From 643e607eb44bf3c7c5eaa1efb09b5fbfeb0bde50 Mon Sep 17 00:00:00 2001
From: Shinwoo PARK <devpysweb@gmail.com>
Date: Thu, 13 Jun 2024 19:28:32 +0000
Subject: [PATCH] refactor: delete docs & make it dev environment
---
packages/react/index.html | 18 +-
.../react/public/android-chrome-192x192.png | Bin 4380 -> 0 bytes
.../react/public/android-chrome-512x512.png | Bin 15489 -> 0 bytes
packages/react/public/apple-touch-icon.png | Bin 3914 -> 0 bytes
packages/react/public/favicon-16x16.png | Bin 280 -> 0 bytes
packages/react/public/favicon-32x32.png | Bin 564 -> 0 bytes
packages/react/public/favicon.ico | Bin 15406 -> 0 bytes
packages/react/public/site.webmanifest | 20 --
packages/react/src/App.tsx | 256 ------------------
packages/react/src/DocsLayout.tsx | 43 ---
packages/react/src/DynamicLayout.tsx | 63 -----
packages/react/src/ErrorHandler.tsx | 19 --
packages/react/src/HeadingContext.tsx | 12 -
packages/react/src/Home.tsx | 30 --
packages/react/src/MainLayout.tsx | 215 ---------------
packages/react/src/RouteObject.ts | 59 ----
packages/react/src/components/LoadedCode.tsx | 118 --------
packages/react/src/components/Story.tsx | 32 ---
packages/react/src/docs/components/Button.mdx | 162 -----------
.../ButtonBlocks/Examples/Danger.tsx | 5 -
.../ButtonBlocks/Examples/Default.tsx | 5 -
.../ButtonBlocks/Examples/Ghost.tsx | 5 -
.../components/ButtonBlocks/Examples/Link.tsx | 5 -
.../ButtonBlocks/Examples/Success.tsx | 5 -
.../ButtonBlocks/Examples/Warning.tsx | 5 -
.../components/ButtonBlocks/Examples/index.ts | 16 --
.../docs/components/ButtonBlocks/Preview.tsx | 5 -
.../react/src/docs/components/Checkbox.mdx | 84 ------
.../CheckboxBlocks/Examples/Disabled.tsx | 11 -
.../CheckboxBlocks/Examples/Text.tsx | 11 -
.../CheckboxBlocks/Examples/index.ts | 5 -
.../components/CheckboxBlocks/Preview.tsx | 11 -
packages/react/src/docs/components/Dialog.mdx | 177 ------------
.../Examples/BasicInformationalDialog.tsx | 36 ---
.../DialogBlocks/Examples/DeletingItem.tsx | 79 ------
.../components/DialogBlocks/Examples/index.ts | 8 -
.../docs/components/DialogBlocks/Preview.tsx | 42 ---
packages/react/src/docs/components/Drawer.mdx | 203 --------------
.../DrawerBlocks/Examples/Bottom.tsx | 40 ---
.../components/DrawerBlocks/Examples/Left.tsx | 40 ---
.../DrawerBlocks/Examples/Right.tsx | 40 ---
.../components/DrawerBlocks/Examples/Top.tsx | 40 ---
.../components/DrawerBlocks/Examples/index.ts | 7 -
.../docs/components/DrawerBlocks/Preview.tsx | 40 ---
packages/react/src/docs/components/Input.mdx | 123 ---------
.../InputBlocks/Examples/Disabled.tsx | 5 -
.../InputBlocks/Examples/Invalid.tsx | 5 -
.../components/InputBlocks/Examples/index.ts | 5 -
.../docs/components/InputBlocks/Preview.tsx | 5 -
.../components/InputFrameBlocks/Preview.tsx | 23 --
packages/react/src/docs/components/Label.mdx | 125 ---------
.../LabelBlocks/Examples/Disabled.tsx | 11 -
.../LabelBlocks/Examples/Horizontal.tsx | 11 -
.../LabelBlocks/Examples/Invalid.tsx | 11 -
.../LabelBlocks/Examples/Vertical.tsx | 11 -
.../components/LabelBlocks/Examples/index.ts | 12 -
.../docs/components/LabelBlocks/Preview.tsx | 11 -
.../react/src/docs/components/Popover.mdx | 117 --------
.../PopoverBlocks/Examples/ThemeSelector.tsx | 43 ---
.../PopoverBlocks/Examples/UserControl.tsx | 151 -----------
.../PopoverBlocks/Examples/index.ts | 7 -
.../docs/components/PopoverBlocks/Preview.tsx | 54 ----
packages/react/src/docs/components/Switch.mdx | 40 ---
.../docs/components/SwitchBlocks/Preview.tsx | 5 -
packages/react/src/docs/components/Tabs.mdx | 79 ------
.../docs/components/TabsBlocks/Preview.tsx | 18 --
packages/react/src/docs/components/Toast.mdx | 182 -------------
.../components/ToastBlocks/Examples/Error.tsx | 29 --
.../ToastBlocks/Examples/Normal.tsx | 29 --
.../ToastBlocks/Examples/PendingFail.tsx | 35 ---
.../ToastBlocks/Examples/PendingSuccess.tsx | 37 ---
.../ToastBlocks/Examples/Success.tsx | 29 --
.../ToastBlocks/Examples/Warning.tsx | 29 --
.../components/ToastBlocks/Examples/index.ts | 16 --
.../docs/components/ToastBlocks/Preview.tsx | 25 --
.../react/src/docs/components/Tooltip.mdx | 206 --------------
.../TooltipBlocks/Examples/Bottom.tsx | 13 -
.../TooltipBlocks/Examples/Controlled.tsx | 16 --
.../TooltipBlocks/Examples/EarlyDelay.tsx | 13 -
.../TooltipBlocks/Examples/LateDelay.tsx | 13 -
.../TooltipBlocks/Examples/Left.tsx | 13 -
.../TooltipBlocks/Examples/NoDelay.tsx | 13 -
.../TooltipBlocks/Examples/Right.tsx | 13 -
.../components/TooltipBlocks/Examples/Top.tsx | 13 -
.../TooltipBlocks/Examples/index.ts | 19 --
.../docs/components/TooltipBlocks/Preview.tsx | 13 -
packages/react/src/docs/configuration.mdx | 64 -----
packages/react/src/docs/installation.mdx | 36 ---
packages/react/src/docs/introduction.mdx | 41 ---
packages/react/src/errors/PageNotFound.tsx | 22 --
packages/react/src/errors/Unexpected.tsx | 22 --
packages/react/src/mdx.d.ts | 7 -
packages/react/src/vite-env.d.ts | 6 -
93 files changed, 1 insertion(+), 3797 deletions(-)
delete mode 100644 packages/react/public/android-chrome-192x192.png
delete mode 100644 packages/react/public/android-chrome-512x512.png
delete mode 100644 packages/react/public/apple-touch-icon.png
delete mode 100644 packages/react/public/favicon-16x16.png
delete mode 100644 packages/react/public/favicon-32x32.png
delete mode 100644 packages/react/public/favicon.ico
delete mode 100644 packages/react/public/site.webmanifest
delete mode 100644 packages/react/src/App.tsx
delete mode 100644 packages/react/src/DocsLayout.tsx
delete mode 100644 packages/react/src/DynamicLayout.tsx
delete mode 100644 packages/react/src/ErrorHandler.tsx
delete mode 100644 packages/react/src/HeadingContext.tsx
delete mode 100644 packages/react/src/Home.tsx
delete mode 100644 packages/react/src/MainLayout.tsx
delete mode 100644 packages/react/src/RouteObject.ts
delete mode 100644 packages/react/src/components/LoadedCode.tsx
delete mode 100644 packages/react/src/components/Story.tsx
delete mode 100644 packages/react/src/docs/components/Button.mdx
delete mode 100644 packages/react/src/docs/components/ButtonBlocks/Examples/Danger.tsx
delete mode 100644 packages/react/src/docs/components/ButtonBlocks/Examples/Default.tsx
delete mode 100644 packages/react/src/docs/components/ButtonBlocks/Examples/Ghost.tsx
delete mode 100644 packages/react/src/docs/components/ButtonBlocks/Examples/Link.tsx
delete mode 100644 packages/react/src/docs/components/ButtonBlocks/Examples/Success.tsx
delete mode 100644 packages/react/src/docs/components/ButtonBlocks/Examples/Warning.tsx
delete mode 100644 packages/react/src/docs/components/ButtonBlocks/Examples/index.ts
delete mode 100644 packages/react/src/docs/components/ButtonBlocks/Preview.tsx
delete mode 100644 packages/react/src/docs/components/Checkbox.mdx
delete mode 100644 packages/react/src/docs/components/CheckboxBlocks/Examples/Disabled.tsx
delete mode 100644 packages/react/src/docs/components/CheckboxBlocks/Examples/Text.tsx
delete mode 100644 packages/react/src/docs/components/CheckboxBlocks/Examples/index.ts
delete mode 100644 packages/react/src/docs/components/CheckboxBlocks/Preview.tsx
delete mode 100644 packages/react/src/docs/components/Dialog.mdx
delete mode 100644 packages/react/src/docs/components/DialogBlocks/Examples/BasicInformationalDialog.tsx
delete mode 100644 packages/react/src/docs/components/DialogBlocks/Examples/DeletingItem.tsx
delete mode 100644 packages/react/src/docs/components/DialogBlocks/Examples/index.ts
delete mode 100644 packages/react/src/docs/components/DialogBlocks/Preview.tsx
delete mode 100644 packages/react/src/docs/components/Drawer.mdx
delete mode 100644 packages/react/src/docs/components/DrawerBlocks/Examples/Bottom.tsx
delete mode 100644 packages/react/src/docs/components/DrawerBlocks/Examples/Left.tsx
delete mode 100644 packages/react/src/docs/components/DrawerBlocks/Examples/Right.tsx
delete mode 100644 packages/react/src/docs/components/DrawerBlocks/Examples/Top.tsx
delete mode 100644 packages/react/src/docs/components/DrawerBlocks/Examples/index.ts
delete mode 100644 packages/react/src/docs/components/DrawerBlocks/Preview.tsx
delete mode 100644 packages/react/src/docs/components/Input.mdx
delete mode 100644 packages/react/src/docs/components/InputBlocks/Examples/Disabled.tsx
delete mode 100644 packages/react/src/docs/components/InputBlocks/Examples/Invalid.tsx
delete mode 100644 packages/react/src/docs/components/InputBlocks/Examples/index.ts
delete mode 100644 packages/react/src/docs/components/InputBlocks/Preview.tsx
delete mode 100644 packages/react/src/docs/components/InputFrameBlocks/Preview.tsx
delete mode 100644 packages/react/src/docs/components/Label.mdx
delete mode 100644 packages/react/src/docs/components/LabelBlocks/Examples/Disabled.tsx
delete mode 100644 packages/react/src/docs/components/LabelBlocks/Examples/Horizontal.tsx
delete mode 100644 packages/react/src/docs/components/LabelBlocks/Examples/Invalid.tsx
delete mode 100644 packages/react/src/docs/components/LabelBlocks/Examples/Vertical.tsx
delete mode 100644 packages/react/src/docs/components/LabelBlocks/Examples/index.ts
delete mode 100644 packages/react/src/docs/components/LabelBlocks/Preview.tsx
delete mode 100644 packages/react/src/docs/components/Popover.mdx
delete mode 100644 packages/react/src/docs/components/PopoverBlocks/Examples/ThemeSelector.tsx
delete mode 100644 packages/react/src/docs/components/PopoverBlocks/Examples/UserControl.tsx
delete mode 100644 packages/react/src/docs/components/PopoverBlocks/Examples/index.ts
delete mode 100644 packages/react/src/docs/components/PopoverBlocks/Preview.tsx
delete mode 100644 packages/react/src/docs/components/Switch.mdx
delete mode 100644 packages/react/src/docs/components/SwitchBlocks/Preview.tsx
delete mode 100644 packages/react/src/docs/components/Tabs.mdx
delete mode 100644 packages/react/src/docs/components/TabsBlocks/Preview.tsx
delete mode 100644 packages/react/src/docs/components/Toast.mdx
delete mode 100644 packages/react/src/docs/components/ToastBlocks/Examples/Error.tsx
delete mode 100644 packages/react/src/docs/components/ToastBlocks/Examples/Normal.tsx
delete mode 100644 packages/react/src/docs/components/ToastBlocks/Examples/PendingFail.tsx
delete mode 100644 packages/react/src/docs/components/ToastBlocks/Examples/PendingSuccess.tsx
delete mode 100644 packages/react/src/docs/components/ToastBlocks/Examples/Success.tsx
delete mode 100644 packages/react/src/docs/components/ToastBlocks/Examples/Warning.tsx
delete mode 100644 packages/react/src/docs/components/ToastBlocks/Examples/index.ts
delete mode 100644 packages/react/src/docs/components/ToastBlocks/Preview.tsx
delete mode 100644 packages/react/src/docs/components/Tooltip.mdx
delete mode 100644 packages/react/src/docs/components/TooltipBlocks/Examples/Bottom.tsx
delete mode 100644 packages/react/src/docs/components/TooltipBlocks/Examples/Controlled.tsx
delete mode 100644 packages/react/src/docs/components/TooltipBlocks/Examples/EarlyDelay.tsx
delete mode 100644 packages/react/src/docs/components/TooltipBlocks/Examples/LateDelay.tsx
delete mode 100644 packages/react/src/docs/components/TooltipBlocks/Examples/Left.tsx
delete mode 100644 packages/react/src/docs/components/TooltipBlocks/Examples/NoDelay.tsx
delete mode 100644 packages/react/src/docs/components/TooltipBlocks/Examples/Right.tsx
delete mode 100644 packages/react/src/docs/components/TooltipBlocks/Examples/Top.tsx
delete mode 100644 packages/react/src/docs/components/TooltipBlocks/Examples/index.ts
delete mode 100644 packages/react/src/docs/components/TooltipBlocks/Preview.tsx
delete mode 100644 packages/react/src/docs/configuration.mdx
delete mode 100644 packages/react/src/docs/installation.mdx
delete mode 100644 packages/react/src/docs/introduction.mdx
delete mode 100644 packages/react/src/errors/PageNotFound.tsx
delete mode 100644 packages/react/src/errors/Unexpected.tsx
delete mode 100644 packages/react/src/mdx.d.ts
delete mode 100644 packages/react/src/vite-env.d.ts
diff --git a/packages/react/index.html b/packages/react/index.html
index b7cd84f..0ba5f47 100644
--- a/packages/react/index.html
+++ b/packages/react/index.html
@@ -3,23 +3,7 @@
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
- <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
- <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
- <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
- <link rel="manifest" href="/site.webmanifest">
- <meta name="description" content="PSW/UI is a UI library with minimum dependency." />
- <meta name="keywords" content="UI, library, PSW, React, components" />
- <meta name="author" content="Shinwoo PARK" />
- <meta property="og:title" content="PSW/UI" />
- <meta property="og:description" content="PSW/UI is a UI library with minimum dependency." />
- <meta property="og:type" content="website" />
- <meta property="og:url" content="https://ui.psw.kr" />
- <meta property="og:image" content="https://ui.psw.kr/android-chrome-512x512.png" />
- <meta name="twitter:card" content="summary_large_image" />
- <meta name="twitter:title" content="PSW/UI" />
- <meta name="twitter:description" content="PSW/UI is a UI library with minimum dependency." />
- <meta name="twitter:image" content="https://ui.psw.kr/android-chrome-512x512.png" />
- <title>PSW/UI</title>
+ <title>Dev Environment</title>
</head>
<body>
<div id="root"></div>
diff --git a/packages/react/public/android-chrome-192x192.png b/packages/react/public/android-chrome-192x192.png
deleted file mode 100644
index 5c8371af6cf8b0ba17d035c032f5d5bff7344e7b..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001
literal 4380
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
T8=2r=58#@fk#6x7hlu|G<t+8(
diff --git a/packages/react/public/android-chrome-512x512.png b/packages/react/public/android-chrome-512x512.png
deleted file mode 100644
index 58c799bf6f0e88e9b7f2bb8b402b88080b3051b5..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001
literal 15489
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
diff --git a/packages/react/public/apple-touch-icon.png b/packages/react/public/apple-touch-icon.png
deleted file mode 100644
index 7efb407f4845a2178e1f1fbfea808f97bc87ff4f..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001
literal 3914
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
diff --git a/packages/react/public/favicon-16x16.png b/packages/react/public/favicon-16x16.png
deleted file mode 100644
index d25599930929ba09eb7961236a9437cf9cb7b02c..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001
literal 280
zcmV+z0q6dSP)<h;3K|Lk000e1NJLTq000mG000mO1^@s6AM^iV0002rNkl<ZI8W`9
zAr6B;5Jms0<p5~701^WyKw>Z)Vhur+8j?DY+yH~XaRdYgiH9p-00Uh}Dk$kDw8(BU
zD`wvQNoM~L0CyfY9+bzKGjaGq_%(j<_|<4y1(q{y-`RsemSv!n!nW-lo98*^d4}US
zyZm1OxPAs{nnIRkSeCV$c2N}Q`yQ_Aihm&p0x-s)sw#$I*kDPL&~+V>BtaO4VgW@_
z&@>IIszMyc8|--=48wq?X=vM4EU;Eh(?k?S&~<%->$-;T`zXuuU|OM-30ceB>&s`i
eU$RU;t@9I<-FNSJ73iG+0000<MNUMnLSTZqZF2$u
diff --git a/packages/react/public/favicon-32x32.png b/packages/react/public/favicon-32x32.png
deleted file mode 100644
index 76f747445240a211dd07e770625b51f0bba6ffe9..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001
literal 564
zcmV-40?Yl0P)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F80005|Nkl<ZSV!$w
zJ!>ja5Iq4wTdM>cK@mhjLGcIJ*eQr03ZjLDMbZg^d9jKF1<RMlLIf*OEW}Q*w^9qS
z5ere0RF(=#^6m@@2}#yP%`?Rg47+!C?m1`A-u;*h02d-}MP7@%+K$EM$Kp*OKZ|@6
z`9S1<L}q`CP8v8v0-m;4ehv-KB;fTw*#6zcy^#RACufV_FCY*IpkA-DL-BYVrBX@K
ztw<z-N~OXzp->3bYE`m+uLFtz#R0_u#R0{EvpeAT`_X7L_<f#8Bv33CCEx9_SPbQI
znQMZ<AZoSRao+;B+l@}A!yuVV2HC9i&r>RuLO!48dXLA0cDsF?0G&>U`FzeGtyT+O
zuU8U~+#=T~^m;v})9G;nX!d9{g4t}wdcB6lV!?Pk{u0z^G-5a$LakPFjmcz^B&U;m
zKgU#*OeRq%6c~&Md_Es0lgS5ggTa7ivk9x!%E!~`G;+DzX#{9A8g#o|*laciT&-42
zHW&<eY`5E46xHoSx?C<Sm&?-#AQV~)MCx=pB|-cBKChG6Y_^wN_AS^UsZ=UNqfvyz
zVK^KPXti2CwOB0B>-G5eiylE*D{@2D8u$*31W{}@8@YU+>W&g{FzdUCzoIcYduw(l
z9JxP*od;lWbGmEKZ^ZuPc6<Pq>?za=zKHxQ^5Gu@&?(%L*FTy70000<MNUMnLSTYk
C|Mvy}
diff --git a/packages/react/public/favicon.ico b/packages/react/public/favicon.ico
deleted file mode 100644
index 79ec661cc7ad4ebc520eda469e933e6a78e840af..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001
literal 15406
zcmeHN-79rj7~jWN4CRcxk))H4>2>$s7?KzlO1Tj7RVG8x+_+MbL6JYf+)nw3BvM=`
z5;b#}C?AO=$wwpPig$c_X8pEz?Y8&qefHkxaE>$YTJ^NnS?gKP^IK~@>)B^N&z2;c
z6fD{860053uOX83qa;ZV$Mf%x-%HXTtnbsOFXKN*lJkQkePldr3Y+oV&nmsr!3J&^
zkwwBBPv>%7ZuQ!1HUe41McLWe<a9de?(R;e#l=O+$;mM#Cn+h3E-x=>W@d&83kzjJ
z`|9e791e$}jP~|+Iy*a~h=>S<H#|I?PESv%v$Ip_(_7Qv;2=#;PrL9<O-<3z(2z_2
z*K$TiMrdMU!i8^aY>Y-nM_u~G{Fip`?f!kepC*30y#ogGy}5&YE>q!ofuC_O`iT+z
zlbd2=W4|#vVf4hv&=$Sqfez?`PUvoD^wv7{<U=>G=#9U1zpwUOZymlkZ#~^!_lJap
z5Xe{O2VM2`_3|_5;^Kmyo}Oevdv<n~8X6iXG&J;0@FXN8(8|gR8I{%5RZ2`ud{qp1
zPOh)7E2^)ruL=IRt*uQaw9&`Q=H}*$=d8Eq)7;$5MH6HvCnvkC4}BQprM0!yg~wAI
z+uPf+Sp08EO-<F6o05`3H#avj@9yrdE}s<~ICowqCnpVMj*pLXcEW!qE4s9J^Yil+
zdH4^d#iQ<PX=zdT3knJh`PFl^+9f3=ioC|gMnieEwY3U=d3m`Zzm`sQUs+k1A`f?8
zJ*L&Jsi{%;D=RAv`L$%I`-Fb6|J<O2{fYah_6=HX;eTG&|7z{=|E$lS?*RN=(Cg=<
zhiAgyL;a;6@1Okr`ybZ!#aTcHbn*9Z*8Fx0;v_6YEB(UAAWp(K<j`#mtDTJgW#o(V
zvTB>a1Z;mZs$+z3Gs<_2dKqENs!V_J-!iPfGr}4w8R56Tuz0E$nClt+6@b|Jnqf<U
zWH%f)uixuk<@k*1_vmMgFpF^$z6yCX<fK5J<kWoWQ-Xqm<d{-LMFsWu_Y>k`i2Lz4
zDB3$aJ2X5zOjT7?a$YVtIQU)IK}<{xH8nNKG1U9}d;UtTTR%KJ(8k6FA)XZ*8|&9K
zL`FtZUtgaRThs-uF@TsQ@{?G<FKvbELd?9Ur$@FCH9X)tK0cQBcwu3I=I7_-_R-Oi
zoEuj2!oGTYdnqg|%;#$;EiI+n+gk+=u<Y;eQ+IbaWo2biR8*9L3GIxG4C?6Uka@t%
z3v3RtNxm<>sO@$;EiW%~2y%UXeolFLdF1Y1;-2T`=F-8z!Hc<wY5Vdn6crT_@bZE^
ztgEXty@!au!p?ZX_XEYn#ir+bb4Kvxh?lE<&C=46rF<36Xl`zf!>7l`N9yY8a(i~(
zU{=pX&Szj?K+%l`{HL17OuM?e`h^TU8=|A5Ez2>ZOU(lv$jR{nf1a6{X<0AwO6vO$
zUlku8Z&{8So0&HJwfgQN$C#d;Zdot#M<*vId>d$OZS7U^LPl$VpHSxv;n&mB(k$bT
zi;JVZy*&m0*4CD(?|qE$8I1!!p8vcY9v-^Q{praAe)vsZ@Sn-d_ey&5%=QcX&v62=
z|DMH5g#8HnG3#rz_=Nok`_ZxsvwgyTg#DPc6)iqtKf->r?80oHupj^0kJ)n)e9!0f
z4eUc8=fHsda{!+a@}~;{j33`?lrRd!95yij%qUR5-@rE~>TghR4zMNMhxd4=`Ca{!
Q;j3VTeHTUSfLA;4A2hA8G5`Po
diff --git a/packages/react/public/site.webmanifest b/packages/react/public/site.webmanifest
deleted file mode 100644
index 78a3b05..0000000
--- a/packages/react/public/site.webmanifest
+++ /dev/null
@@ -1,20 +0,0 @@
-{
- "name": "PSW/UI",
- "short_name": "PSWUI",
- "description": "PSW/UI is a UI library with minimum dependency.",
- "icons": [
- {
- "src": "/android-chrome-192x192.png",
- "sizes": "192x192",
- "type": "image/png"
- },
- {
- "src": "/android-chrome-512x512.png",
- "sizes": "512x512",
- "type": "image/png"
- }
- ],
- "theme_color": "#ffffff",
- "background_color": "#ffffff",
- "display": "standalone"
-}
diff --git a/packages/react/src/App.tsx b/packages/react/src/App.tsx
deleted file mode 100644
index b559bda..0000000
--- a/packages/react/src/App.tsx
+++ /dev/null
@@ -1,256 +0,0 @@
-import {
- Route,
- createBrowserRouter,
- createRoutesFromElements,
- RouterProvider,
- redirect,
-} from "react-router-dom";
-import MainLayout from "./MainLayout";
-import Home from "./Home";
-import DocsLayout from "./DocsLayout";
-import ErrorBoundary from "./ErrorHandler";
-import DynamicLayout from "./DynamicLayout";
-import { Code } from "./components/LoadedCode";
-
-import DocsIntroduction, {
- tableOfContents as docsIntroductionToc,
-} from "./docs/introduction.mdx";
-import DocsInstallation, {
- tableOfContents as docsInstallationToc,
-} from "./docs/installation.mdx";
-import DocsConfiguration, {
- tableOfContents as docsConfigurationToc,
-} from "./docs/configuration.mdx";
-
-import { HeadingContext } from "./HeadingContext";
-import React, {
- ForwardedRef,
- forwardRef,
- useContext,
- useEffect,
- useRef,
- useState,
-} from "react";
-import { Tooltip, TooltipContent } from "@components/Tooltip.tsx";
-
-function buildThresholdList() {
- const thresholds: number[] = [];
- const numSteps = 20;
-
- for (let i = 1.0; i <= numSteps; i++) {
- const ratio = i / numSteps;
- thresholds.push(ratio);
- }
-
- thresholds.push(0);
- return thresholds;
-}
-
-function HashedHeaders(Level: `h${1 | 2 | 3 | 4 | 5 | 6}`) {
- return (prop: any, ref: ForwardedRef<HTMLHeadingElement>) => {
- const internalRef = useRef<HTMLHeadingElement | null>(null);
- const [_, setActiveHeadings] = useContext(HeadingContext);
-
- const { children, ...restProp } = prop;
-
- useEffect(() => {
- const observer = new IntersectionObserver(
- ([{ target, intersectionRatio }]) => {
- if (intersectionRatio > 0.5) {
- setActiveHeadings((prev) => [...prev, target.id]);
- } else {
- setActiveHeadings((prev) => prev.filter((id) => id !== target.id));
- }
- },
- {
- root: null,
- rootMargin: "0px",
- threshold: buildThresholdList(),
- },
- );
- if (internalRef.current) {
- observer.observe(internalRef.current);
- }
- return () => {
- observer.disconnect();
- };
- }, [internalRef.current]);
-
- const [status, setStatus] = useState<"normal" | "error" | "success">(
- "normal",
- );
- const messages = {
- normal: "Click to copy link",
- success: "Copied link!",
- error: "Failed to copy..",
- };
-
- useEffect(() => {
- if (status !== "normal") {
- const timeout = setTimeout(() => {
- setStatus("normal");
- }, 3000);
- return () => {
- clearTimeout(timeout);
- };
- }
- }, [status]);
-
- return (
- <Tooltip asChild position={"right"}>
- <Level
- ref={(el) => {
- internalRef.current = el;
- if (typeof ref === "function") {
- ref(el);
- } else if (el && ref) {
- ref.current = el;
- }
- }}
- className={`${prop.className} cursor-pointer select-none`}
- onClick={async (e) => {
- try {
- await navigator.clipboard.writeText(
- window.location.href.split("#")[0] + "#" + e.currentTarget.id,
- );
- setStatus("success");
- } catch (e) {
- setStatus("error");
- }
- }}
- {...restProp}
- >
- {children}
- <TooltipContent status={status} offset={"lg"} delay={"early"}>
- <p className={"text-base font-normal whitespace-nowrap not-prose"}>
- {messages[status]}
- </p>
- </TooltipContent>
- </Level>
- </Tooltip>
- );
- };
-}
-
-const overrideComponents = {
- pre: (props: any) => {
- const {
- props: { children, className },
- } = React.cloneElement(React.Children.only(props.children));
-
- const language =
- (!className || !className.includes("language-")
- ? "typescript"
- : /language-([a-z]+)/.exec(className)![1]) ?? "typescript";
-
- return <Code language={language}>{children as string}</Code>;
- },
- code: forwardRef<HTMLElement, any>((props: any, ref) => (
- <code
- ref={ref}
- {...props}
- className={`${props.className} rounded-md bg-neutral-800 text-orange-500 font-light p-1 before:content-none after:content-none`}
- />
- )),
- table: forwardRef<HTMLTableElement, any>((props: any, ref) => (
- <div className="overflow-auto">
- <table ref={ref} {...props} className={`${props.className}`} />
- </div>
- )),
- h1: forwardRef<HTMLHeadingElement, any>(HashedHeaders("h1")),
- h2: forwardRef<HTMLHeadingElement, any>(HashedHeaders("h2")),
- h3: forwardRef<HTMLHeadingElement, any>(HashedHeaders("h3")),
- h4: forwardRef<HTMLHeadingElement, any>(HashedHeaders("h4")),
- h5: forwardRef<HTMLHeadingElement, any>(HashedHeaders("h5")),
- h6: forwardRef<HTMLHeadingElement, any>(HashedHeaders("h6")),
-};
-
-const docsModules = import.meta.glob("./docs/components/*.mdx");
-
-const routes = Object.keys(docsModules).map((path) => {
- const sfPath = path.split("/").pop()?.replace(".mdx", "");
-
- return (
- <Route
- key={path}
- path={sfPath}
- lazy={async () => {
- const { default: C, tableOfContents } = await import(
- `./docs/components/${sfPath}.mdx`
- );
- return {
- Component: () => (
- <DynamicLayout toc={tableOfContents}>
- <C components={overrideComponents} />
- </DynamicLayout>
- ),
- };
- }}
- />
- );
-});
-
-const REDIRECTED_404 = /^\?(\/([a-zA-Z0-9\-_]+\/?)+)(&.*)*$/;
-
-const router = createBrowserRouter(
- createRoutesFromElements(
- <Route path="/" element={<MainLayout />} errorElement={<ErrorBoundary />}>
- <Route
- index
- loader={() =>
- REDIRECTED_404.test(window.location.search)
- ? redirect(REDIRECTED_404.exec(window.location.search)?.[1] ?? "/")
- : true
- }
- element={<Home />}
- />
- <Route path="docs" element={<DocsLayout />}>
- <Route index loader={() => redirect("/docs/introduction")} />
- <Route
- path="introduction"
- element={
- <DynamicLayout toc={docsIntroductionToc}>
- <DocsIntroduction components={overrideComponents} />
- </DynamicLayout>
- }
- />
- <Route
- path="installation"
- element={
- <DynamicLayout toc={docsInstallationToc}>
- <DocsInstallation components={overrideComponents} />
- </DynamicLayout>
- }
- />
- <Route
- path="configuration"
- element={
- <DynamicLayout toc={docsConfigurationToc}>
- <DocsConfiguration components={overrideComponents} />
- </DynamicLayout>
- }
- />
- <Route path="components">
- <Route
- index
- loader={() =>
- redirect(
- `/docs/components/${Object.keys(docsModules)[0]
- .split("/")
- .pop()
- ?.replace(".mdx", "")}`,
- )
- }
- />
- {routes}
- </Route>
- </Route>
- </Route>,
- ),
-);
-
-function App() {
- return <RouterProvider router={router} />;
-}
-
-export default App;
diff --git a/packages/react/src/DocsLayout.tsx b/packages/react/src/DocsLayout.tsx
deleted file mode 100644
index 228c297..0000000
--- a/packages/react/src/DocsLayout.tsx
+++ /dev/null
@@ -1,43 +0,0 @@
-import { Link, useLocation } from "react-router-dom";
-import { Outlet } from "react-router-dom";
-import RouteObject from "./RouteObject";
-
-function SideNav() {
- const location = useLocation();
-
- return (
- <nav className="sticky top-16 overflow-auto max-h-[calc(100vh-4rem)] md:flex flex-col justify-start items-start gap-8 p-8 hidden">
- {Object.entries(RouteObject.sideNav).map(([categoryName, links]) => {
- return (
- <section
- className="flex flex-col gap-2 justify-center items-start"
- key={categoryName}
- >
- <span className="font-bold">{categoryName}</span>
- {links.map((link) => (
- <Link
- to={link.path}
- key={link.path}
- className="text-sm text-neutral-500 hover:text-neutral-700 data-[active=true]:text-current"
- data-active={link.eq(location.pathname)}
- >
- {link.name}
- </Link>
- ))}
- </section>
- );
- })}
- </nav>
- );
-}
-
-function DocsLayout() {
- return (
- <div className="flex-grow grid grid-cols-1 md:grid-cols-[12rem_1fr] lg:grid-cols-[12rem_1fr_10rem] w-full max-w-5xl mx-auto">
- <SideNav />
- <Outlet />
- </div>
- );
-}
-
-export default DocsLayout;
diff --git a/packages/react/src/DynamicLayout.tsx b/packages/react/src/DynamicLayout.tsx
deleted file mode 100644
index b652815..0000000
--- a/packages/react/src/DynamicLayout.tsx
+++ /dev/null
@@ -1,63 +0,0 @@
-import { ReactNode, Fragment, useState, useContext } from "react";
-import { type Toc } from "@stefanprobst/rehype-extract-toc";
-import { useLocation } from "react-router-dom";
-import { HeadingContext } from "./HeadingContext";
-
-function RecursivelyToc({ toc }: { toc: Toc }) {
- const location = useLocation();
- const [activeHeadings] = useContext(HeadingContext);
-
- return (
- <ul>
- {toc.map((tocEntry) => {
- return (
- <Fragment key={tocEntry.id}>
- <li
- key={tocEntry.id}
- data-id={tocEntry.id}
- className="text-neutral-500 data-[active='true']:text-black dark:data-[active='true']:text-white text-sm font-medium"
- style={{ paddingLeft: `${tocEntry.depth - 1}rem` }}
- data-active={
- activeHeadings.includes(tocEntry.id ?? "")
- ? true
- : location.hash.length > 0
- ? location.hash === `#${tocEntry.id}`
- : false
- }
- >
- <a href={`#${tocEntry.id}`}>{tocEntry.value}</a>
- </li>
- {Array.isArray(tocEntry.children) && (
- <RecursivelyToc toc={tocEntry.children} />
- )}
- </Fragment>
- );
- })}
- </ul>
- );
-}
-
-export default function DynamicLayout({
- children,
- toc,
-}: {
- children: ReactNode;
- toc: Toc;
-}) {
- const [activeHeadings, setActiveHeadings] = useState<string[]>([]);
-
- return (
- <HeadingContext.Provider value={[activeHeadings, setActiveHeadings]}>
- <div className="w-full flex flex-col items-center">
- <main className="w-full [:not(:where([class~='not-prose'],[class~='not-prose']_*))]:prose-sm prose lg:[:not(:where([class~='not-prose'],_[class~='not-prose']_*))]:prose-lg p-8 dark:prose-invert">
- {children}
- </main>
- </div>
- <nav className="hidden lg:flex flex-col gap-2 py-8 px-4 sticky top-16 overflow-auto max-h-[calc(100vh-4rem)]">
- <span className="font-bold text-sm">On This Page</span>
-
- <RecursivelyToc toc={toc} />
- </nav>
- </HeadingContext.Provider>
- );
-}
diff --git a/packages/react/src/ErrorHandler.tsx b/packages/react/src/ErrorHandler.tsx
deleted file mode 100644
index 378965e..0000000
--- a/packages/react/src/ErrorHandler.tsx
+++ /dev/null
@@ -1,19 +0,0 @@
-import { isRouteErrorResponse, useRouteError } from "react-router-dom";
-import UnexpectedError from "./errors/Unexpected";
-import PageNotFound from "./errors/PageNotFound";
-
-function ErrorBoundary() {
- const error = useRouteError();
-
- if (isRouteErrorResponse(error)) {
- if (error.status === 404) {
- return <PageNotFound />;
- } else {
- return <UnexpectedError />;
- }
- } else {
- return <UnexpectedError />;
- }
-}
-
-export default ErrorBoundary;
diff --git a/packages/react/src/HeadingContext.tsx b/packages/react/src/HeadingContext.tsx
deleted file mode 100644
index 4ce18e2..0000000
--- a/packages/react/src/HeadingContext.tsx
+++ /dev/null
@@ -1,12 +0,0 @@
-import { Dispatch, SetStateAction, createContext } from "react";
-
-export const HeadingContext = createContext<
- [string[], Dispatch<SetStateAction<string[]>>]
->([
- [],
- () => {
- if (process.env && process.env.NODE_ENV === "development") {
- console.log("HeadingContext outside");
- }
- },
-]);
diff --git a/packages/react/src/Home.tsx b/packages/react/src/Home.tsx
deleted file mode 100644
index baa8d15..0000000
--- a/packages/react/src/Home.tsx
+++ /dev/null
@@ -1,30 +0,0 @@
-import { Link } from "react-router-dom";
-import { Button } from "../components/Button";
-
-function Home() {
- return (
- <main className="flex-grow h-full flex flex-col p-4 justify-center items-center">
- <section className="h-full flex flex-col justify-center items-center text-center gap-8">
- <header className="flex flex-col justify-center items-center gap-2">
- <h1 className="text-4xl font-bold">
- Build your components in isolation
- </h1>
- <p className="text-xl max-w-xl">
- There are a lot of component libraries out there, but why it install
- so many things?
- </p>
- </header>
- <div className="flex flex-row justify-center items-center gap-2">
- <Button asChild preset="default">
- <Link to="/docs">Get Started</Link>
- </Button>
- <Button asChild preset="ghost">
- <Link to="/docs/components">Components</Link>
- </Button>
- </div>
- </section>
- </main>
- );
-}
-
-export default Home;
diff --git a/packages/react/src/MainLayout.tsx b/packages/react/src/MainLayout.tsx
deleted file mode 100644
index 5d76dc8..0000000
--- a/packages/react/src/MainLayout.tsx
+++ /dev/null
@@ -1,215 +0,0 @@
-import { useEffect, useState } from "react";
-import { Link, Outlet, useLocation } from "react-router-dom";
-import { Button } from "../components/Button";
-import RouteObject from "./RouteObject";
-import { Toaster } from "@components/Toast";
-import { Popover, PopoverContent, PopoverTrigger } from "@components/Popover";
-import {
- DrawerClose,
- DrawerContent,
- DrawerOverlay,
- DrawerRoot,
- DrawerTrigger,
-} from "@components/Drawer";
-
-type Theme = "light" | "dark" | "system";
-
-function ThemeButton() {
- const [theme, setTheme] = useState<Theme>(
- (localStorage.getItem("theme") as Theme) || "system"
- );
- useEffect(() => {
- document.documentElement.classList.toggle("dark", theme === "dark");
- document.documentElement.classList.toggle("system", theme === "system");
- localStorage.setItem("theme", theme);
- }, [theme]);
-
- return (
- <Popover>
- <PopoverTrigger>
- <Button preset="ghost" size="icon">
- {/* material-symbols:light-mode */}
- <svg
- xmlns="http://www.w3.org/2000/svg"
- width="1.2em"
- height="1.2em"
- viewBox="0 0 24 24"
- className="dark:hidden"
- >
- <path
- fill="currentColor"
- d="M12 17q-2.075 0-3.537-1.463T7 12t1.463-3.537T12 7t3.538 1.463T17 12t-1.463 3.538T12 17m-7-4H1v-2h4zm18 0h-4v-2h4zM11 5V1h2v4zm0 18v-4h2v4zM6.4 7.75L3.875 5.325L5.3 3.85l2.4 2.5zm12.3 12.4l-2.425-2.525L17.6 16.25l2.525 2.425zM16.25 6.4l2.425-2.525L20.15 5.3l-2.5 2.4zM3.85 18.7l2.525-2.425L7.75 17.6l-2.425 2.525z"
- />
- </svg>
- {/* material-symbols:dark-mode */}
- <svg
- xmlns="http://www.w3.org/2000/svg"
- width="1.2em"
- height="1.2em"
- viewBox="0 0 24 24"
- className="hidden dark:block"
- >
- <path
- fill="currentColor"
- d="M12 21q-3.75 0-6.375-2.625T3 12t2.625-6.375T12 3q.35 0 .688.025t.662.075q-1.025.725-1.638 1.888T11.1 7.5q0 2.25 1.575 3.825T16.5 12.9q1.375 0 2.525-.613T20.9 10.65q.05.325.075.662T21 12q0 3.75-2.625 6.375T12 21"
- />
- </svg>
- </Button>
- </PopoverTrigger>
- <PopoverContent anchor="bottomLeft" className="w-32">
- <Button
- preset="ghost"
- onClick={() => setTheme("light")}
- className="w-full px-2 py-1.5 text-sm"
- >
- Light
- </Button>
- <Button
- preset="ghost"
- onClick={() => setTheme("dark")}
- className="w-full px-2 py-1.5 text-sm"
- >
- Dark
- </Button>
- <Button
- preset="ghost"
- onClick={() => setTheme("system")}
- className="w-full px-2 py-1.5 text-sm"
- >
- System
- </Button>
- </PopoverContent>
- </Popover>
- );
-}
-
-function TopNav() {
- const location = useLocation();
-
- return (
- <>
- <nav className="sticky top-0 z-20 bg-transparent backdrop-blur-lg border-b border-neutral-200 dark:border-neutral-800 w-full max-w-screen px-8 flex flex-row justify-center items-center h-16">
- <div
- data-role="wrapper"
- className="flex flex-row items-center justify-between w-full max-w-6xl text-lg"
- >
- <div
- data-role="links"
- className="hidden md:flex flex-row items-center gap-3"
- >
- <Link to="/" className="font-bold">
- PSW/UI
- </Link>
- {RouteObject.mainNav.map((link) => {
- return (
- <Link
- key={link.path}
- to={link.path}
- data-active={link.eq(location.pathname)}
- className="font-light text-base data-[active=true]:text-current text-neutral-500 hover:text-neutral-700"
- >
- {link.name}
- </Link>
- );
- })}
- </div>
- <div data-role="mobile-links" className="flex md:hidden">
- <DrawerRoot>
- <DrawerTrigger>
- <Button preset="ghost" size="icon">
- {/* mdi:menu */}
- <svg
- xmlns="http://www.w3.org/2000/svg"
- width="1.2em"
- height="1.2em"
- viewBox="0 0 24 24"
- >
- <path
- fill="currentColor"
- d="M3 6h18v2H3zm0 5h18v2H3zm0 5h18v2H3z"
- />
- </svg>
- </Button>
- </DrawerTrigger>
- <DrawerOverlay className="z-[99]">
- <DrawerContent className="w-[300px] overflow-auto">
- <DrawerClose className="absolute top-4 right-4">
- <Button preset="ghost" size="icon">
- {/* mdi:close */}
- <svg
- xmlns="http://www.w3.org/2000/svg"
- width="1.2em"
- height="1.2em"
- viewBox="0 0 24 24"
- >
- <path
- fill="currentColor"
- d="M19 6.41L17.59 5 12 9.27 6.41 5 5 6.41 9.27 11 5 17.59 6.41 19 12 14.73 17.59 19 19 17.59 13.41 12 19 6.41"
- />
- </svg>
- </Button>
- </DrawerClose>
- <div className="flex flex-col justify-start items-start gap-6 text-lg">
- <div className="flex flex-col justify-start items-start gap-3">
- <DrawerClose>
- <Link to="/" className="font-extrabold">
- PSW/UI
- </Link>
- </DrawerClose>
- {RouteObject.mainNav.map((link) => {
- return (
- <DrawerClose key={link.path}>
- <Link to={link.path}>{link.name}</Link>
- </DrawerClose>
- );
- })}
- </div>
- {Object.entries(RouteObject.sideNav).map(
- ([categoryName, links]) => {
- return (
- <div
- className="flex flex-col justify-start items-start gap-3"
- key={categoryName}
- >
- <h2 className="font-bold">{categoryName}</h2>
- {links.map((link) => {
- return (
- <DrawerClose key={link.path}>
- <Link
- to={link.path}
- className="text-base opacity-75"
- >
- {link.name}
- </Link>
- </DrawerClose>
- );
- })}
- </div>
- );
- }
- )}
- </div>
- </DrawerContent>
- </DrawerOverlay>
- </DrawerRoot>
- </div>
- <div data-role="controls" className="flex flex-row items-center">
- <ThemeButton />
- </div>
- </div>
- </nav>
- </>
- );
-}
-
-function MainLayout() {
- return (
- <>
- <Toaster className="top-16" />
- <TopNav />
- <Outlet />
- </>
- );
-}
-
-export default MainLayout;
diff --git a/packages/react/src/RouteObject.ts b/packages/react/src/RouteObject.ts
deleted file mode 100644
index 798de14..0000000
--- a/packages/react/src/RouteObject.ts
+++ /dev/null
@@ -1,59 +0,0 @@
-const docsModules = import.meta.glob("./docs/components/*.mdx");
-
-const mainNav = [
- {
- path: "/docs",
- name: "Docs",
- eq: (pathname: string) =>
- pathname.startsWith("/docs") && !pathname.startsWith("/docs/components"),
- },
- {
- path: "/docs/components",
- name: "Components",
- eq: (pathname: string) => pathname.startsWith("/docs/components"),
- },
- {
- path: "https://github.com/p-sw/ui",
- name: "Github",
- eq: () => false,
- },
-];
-
-const sideNav: Record<
- string,
- { path: string; name: string; eq: (path: string) => boolean }[]
-> = {
- Documents: [
- {
- path: "/docs/introduction",
- name: "Introduction",
- eq: (pathname: string) => pathname === "/docs/introduction",
- },
- {
- path: "/docs/installation",
- name: "Installation",
- eq: (pathname: string) => pathname === "/docs/installation",
- },
- {
- path: "/docs/configuration",
- name: "Configuration",
- eq: (pathname: string) => pathname === "/docs/configuration",
- },
- ],
- Components: [],
-};
-
-Object.keys(docsModules).forEach((path) => {
- const name = (path.split("/").pop() ?? "").replace(".mdx", "");
- sideNav["Components"].push({
- path: path.replace("./docs", "/docs").replace(".mdx", ""),
- name: name.charAt(0).toUpperCase() + name.slice(1),
- eq: (pathname: string) =>
- pathname === path.replace("./docs", "/docs").replace(".mdx", ""),
- });
-});
-
-export default {
- mainNav,
- sideNav,
-};
diff --git a/packages/react/src/components/LoadedCode.tsx b/packages/react/src/components/LoadedCode.tsx
deleted file mode 100644
index 4363438..0000000
--- a/packages/react/src/components/LoadedCode.tsx
+++ /dev/null
@@ -1,118 +0,0 @@
-import { forwardRef, useEffect, useState } from "react";
-import SyntaxHighlighter from "react-syntax-highlighter";
-import { gruvboxDark } from "react-syntax-highlighter/dist/cjs/styles/hljs";
-import { Button } from "@components/Button";
-import { useToast } from "@components/Toast";
-import { twMerge } from "tailwind-merge";
-
-export const GITHUB = "https://raw.githubusercontent.com/p-sw/ui/main";
-
-export const LoadedCode = ({
- from,
- className,
-}: {
- from: string;
- className?: string;
-}) => {
- const [state, setState] = useState<string | undefined | null>();
- const { toast } = useToast();
-
- useEffect(() => {
- (async () => {
- const res = await fetch(from);
- const text = await res.text();
- setState(text);
- })();
- }, [from]);
-
- return (
- <div className={twMerge("relative", className)}>
- <Button
- preset="default"
- size="icon"
- className="absolute top-4 right-4 text-black dark:text-white z-10"
- onClick={() => {
- if (state && state.length > 0) {
- void navigator.clipboard.writeText(state ?? "");
- toast({
- title: "Copied",
- description: "The code has been copied to your clipboard.",
- status: "success",
- });
- } else {
- toast({
- title: "Error",
- description: "It seems like code is not loaded yet.",
- status: "error",
- });
- }
- }}
- >
- <svg
- xmlns="http://www.w3.org/2000/svg"
- width="1.2em"
- height="1.2em"
- viewBox="0 0 24 24"
- >
- <path
- fill="currentColor"
- d="M4 7v14h14v2H4c-1.1 0-2-.9-2-2V7zm16-4c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H8c-1.1 0-2-.9-2-2V5c0-1.1.9-2 2-2h3.18C11.6 1.84 12.7 1 14 1s2.4.84 2.82 2zm-6 0c-.55 0-1 .45-1 1s.45 1 1 1s1-.45 1-1s-.45-1-1-1m-4 4V5H8v12h12V5h-2v2z"
- />
- </svg>
- </Button>
- <SyntaxHighlighter
- language="typescript"
- style={gruvboxDark}
- className={`w-full h-64 rounded-lg ${!state ? "animate-pulse" : ""} scrollbar-none`}
- customStyle={{ padding: "1rem" }}
- >
- {state ?? ""}
- </SyntaxHighlighter>
- </div>
- );
-};
-
-export const Code = forwardRef<
- HTMLDivElement,
- { children: string; className?: string; language: string }
->(({ children, className, language }, ref) => {
- const { toast } = useToast();
-
- return (
- <div className={twMerge("relative", className)} ref={ref}>
- <Button
- preset="default"
- size="icon"
- className="absolute top-4 right-4 text-black dark:text-white z-10"
- onClick={() => {
- void navigator.clipboard.writeText(children ?? "");
- toast({
- title: "Copied",
- description: "The code has been copied to your clipboard.",
- status: "success",
- });
- }}
- >
- <svg
- xmlns="http://www.w3.org/2000/svg"
- width="1.2em"
- height="1.2em"
- viewBox="0 0 24 24"
- >
- <path
- fill="currentColor"
- d="M4 7v14h14v2H4c-1.1 0-2-.9-2-2V7zm16-4c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H8c-1.1 0-2-.9-2-2V5c0-1.1.9-2 2-2h3.18C11.6 1.84 12.7 1 14 1s2.4.84 2.82 2zm-6 0c-.55 0-1 .45-1 1s.45 1 1 1s1-.45 1-1s-.45-1-1-1m-4 4V5H8v12h12V5h-2v2z"
- />
- </svg>
- </Button>
- <SyntaxHighlighter
- language={language}
- style={gruvboxDark}
- className={`w-full h-auto max-h-64 rounded-lg scrollbar-none`}
- customStyle={{ padding: "1rem" }}
- >
- {children}
- </SyntaxHighlighter>
- </div>
- );
-});
diff --git a/packages/react/src/components/Story.tsx b/packages/react/src/components/Story.tsx
deleted file mode 100644
index 3d0577c..0000000
--- a/packages/react/src/components/Story.tsx
+++ /dev/null
@@ -1,32 +0,0 @@
-import React from "react";
-import { twMerge } from "tailwind-merge";
-
-const layoutClasses = {
- default: "",
- centered: "flex items-center justify-center",
-};
-
-const Story = React.forwardRef<
- HTMLDivElement,
- {
- layout?: keyof typeof layoutClasses;
- children: React.ReactNode;
- className?: string;
- id?: string;
- }
->(({ layout = "default", children, className, id }, ref) => {
- return (
- <div
- className={twMerge(
- `bg-white dark:bg-black border border-neutral-300 dark:border-neutral-700 rounded-lg w-full p-4 min-h-48 h-auto my-8 not-prose ${layoutClasses[layout]}`,
- className
- )}
- ref={ref}
- id={id}
- >
- {children}
- </div>
- );
-});
-
-export { Story };
diff --git a/packages/react/src/docs/components/Button.mdx b/packages/react/src/docs/components/Button.mdx
deleted file mode 100644
index 4613fbd..0000000
--- a/packages/react/src/docs/components/Button.mdx
+++ /dev/null
@@ -1,162 +0,0 @@
-import { TabProvider, TabTrigger, TabContent, TabList } from "@components/Tabs";
-import { Story } from "@/components/Story";
-import { LoadedCode, GITHUB } from "@/components/LoadedCode";
-import { ButtonDemo } from "./ButtonBlocks/Preview";
-import Examples from "./ButtonBlocks/Examples";
-
-# Button
-Displays a button or a component that looks like a button.
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <ButtonDemo />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/ButtonBlocks/Preview.tsx`} />
- </TabContent>
-</TabProvider>
-
-## Installation
-
-1. Create a new file `Button.tsx` in your component folder.
-2. Copy and paste the following code into the file.
-
-<LoadedCode from={`${GITHUB}/packages/react/components/Button.tsx`} />
-
-## Usage
-
-```tsx
-import { Button } from "@components/Button";
-```
-
-```html
-<Button>Button</Button>
-```
-
-## Props
-
-### Variants
-
-| Prop | Type | Default | Description |
-|:-------------|:------------------------------------------------------------------------------|:------------|:----------------------------------------|
-| `size` | `"link" \| "sm" \| "md" \| "lg" \| "icon"` | `"md"` | The size of the button |
-| `border` | `"none" \| "solid" \| "success" \| "warning" \| "danger"` | `"solid"` | The border color of the button |
-| `background` | `"default" \| "ghost" \| "success" \| "warning" \| "danger" \| "transparent"` | `"default"` | The background color of the button |
-| `decoration` | `"none" \| "link"` | `"none"` | The inner text decoration of the button |
-| `presets` | `"default" \| "ghost" \| "link" \| "success" \| "warning" \| "danger"` | `"default"` | The preset of the variant props |
-
-### Special
-
-| Prop | Type | Default | Description |
-|:----------|:----------|:--------|:---------------------------------------------------------|
-| `asChild` | `boolean` | `false` | Whether the button is rendered as a child of a component |
-
-## Examples
-
-### Default
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Default />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/ButtonBlocks/Examples/Default.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Ghost
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Ghost />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/ButtonBlocks/Examples/Ghost.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Link
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Link />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/ButtonBlocks/Examples/Link.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Success
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Success />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/ButtonBlocks/Examples/Success.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Warning
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Warning />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/ButtonBlocks/Examples/Warning.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Danger
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Danger />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/ButtonBlocks/Examples/Danger.tsx`} />
- </TabContent>
-</TabProvider>
diff --git a/packages/react/src/docs/components/ButtonBlocks/Examples/Danger.tsx b/packages/react/src/docs/components/ButtonBlocks/Examples/Danger.tsx
deleted file mode 100644
index ca271ba..0000000
--- a/packages/react/src/docs/components/ButtonBlocks/Examples/Danger.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-import { Button } from "@components/Button";
-
-export const Danger = () => {
- return <Button preset="danger">Danger</Button>;
-};
diff --git a/packages/react/src/docs/components/ButtonBlocks/Examples/Default.tsx b/packages/react/src/docs/components/ButtonBlocks/Examples/Default.tsx
deleted file mode 100644
index 6a5e111..0000000
--- a/packages/react/src/docs/components/ButtonBlocks/Examples/Default.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-import { Button } from "@components/Button";
-
-export const Default = () => {
- return <Button preset="default">Default</Button>;
-};
diff --git a/packages/react/src/docs/components/ButtonBlocks/Examples/Ghost.tsx b/packages/react/src/docs/components/ButtonBlocks/Examples/Ghost.tsx
deleted file mode 100644
index a6ad3ba..0000000
--- a/packages/react/src/docs/components/ButtonBlocks/Examples/Ghost.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-import { Button } from "@components/Button";
-
-export const Ghost = () => {
- return <Button preset="ghost">Ghost</Button>;
-};
diff --git a/packages/react/src/docs/components/ButtonBlocks/Examples/Link.tsx b/packages/react/src/docs/components/ButtonBlocks/Examples/Link.tsx
deleted file mode 100644
index d922088..0000000
--- a/packages/react/src/docs/components/ButtonBlocks/Examples/Link.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-import { Button } from "@components/Button";
-
-export const Link = () => {
- return <Button preset="link">Link</Button>;
-};
diff --git a/packages/react/src/docs/components/ButtonBlocks/Examples/Success.tsx b/packages/react/src/docs/components/ButtonBlocks/Examples/Success.tsx
deleted file mode 100644
index 534a40c..0000000
--- a/packages/react/src/docs/components/ButtonBlocks/Examples/Success.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-import { Button } from "@components/Button";
-
-export const Success = () => {
- return <Button preset="success">Success</Button>;
-};
diff --git a/packages/react/src/docs/components/ButtonBlocks/Examples/Warning.tsx b/packages/react/src/docs/components/ButtonBlocks/Examples/Warning.tsx
deleted file mode 100644
index 90dea91..0000000
--- a/packages/react/src/docs/components/ButtonBlocks/Examples/Warning.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-import { Button } from "@components/Button";
-
-export const Warning = () => {
- return <Button preset="warning">Warning</Button>;
-};
diff --git a/packages/react/src/docs/components/ButtonBlocks/Examples/index.ts b/packages/react/src/docs/components/ButtonBlocks/Examples/index.ts
deleted file mode 100644
index 0b7aaac..0000000
--- a/packages/react/src/docs/components/ButtonBlocks/Examples/index.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-import { Danger } from "./Danger";
-import { Warning } from "./Warning";
-import { Success } from "./Success";
-import { Link } from "./Link";
-import { Ghost } from "./Ghost";
-import { Default } from "./Default";
-
-export default {
- Danger,
- Warning,
- Success,
- Link,
- Ghost,
- Default,
-};
-
diff --git a/packages/react/src/docs/components/ButtonBlocks/Preview.tsx b/packages/react/src/docs/components/ButtonBlocks/Preview.tsx
deleted file mode 100644
index 3f3a5b1..0000000
--- a/packages/react/src/docs/components/ButtonBlocks/Preview.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-import { Button } from "@components/Button";
-
-export function ButtonDemo() {
- return <Button>Button</Button>;
-}
diff --git a/packages/react/src/docs/components/Checkbox.mdx b/packages/react/src/docs/components/Checkbox.mdx
deleted file mode 100644
index 6979ce1..0000000
--- a/packages/react/src/docs/components/Checkbox.mdx
+++ /dev/null
@@ -1,84 +0,0 @@
-import { TabProvider, TabTrigger, TabContent, TabList } from "@components/Tabs";
-import { Story } from "@/components/Story";
-import { LoadedCode, GITHUB } from "@/components/LoadedCode";
-import { CheckboxDemo } from "./CheckboxBlocks/Preview";
-import Examples from "./CheckboxBlocks/Examples";
-
-# Checkbox
-A control that allows the user to toggle between checked and not checked.
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <CheckboxDemo />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/CheckboxBlocks/Preview.tsx`} />
- </TabContent>
-</TabProvider>
-
-## Installation
-
-1. Create a new file `Checkbox.mdx` in your component folder.
-2. Copy and paste the following code into the file.
-
-<LoadedCode from={`${GITHUB}/packages/react/components/Checkbox.tsx`} />
-
-## Usage
-
-```tsx
-import { Checkbox } from "@components/Checkbox";
-```
-
-```html
-<Checkbox />
-```
-
-## Props
-
-### Variants
-
-| Prop | Type | Default | Description |
-|:-------|:-------------------------|:--------|:-------------------------|
-| `size` | `"base" \| "md" \| "lg"` | `"md"` | The size of the checkbox |
-
-## Examples
-
-### Text
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Text />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/CheckboxBlocks/Examples/Text.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Disabled
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Disabled />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/CheckboxBlocks/Examples/Disabled.tsx`} />
- </TabContent>
-</TabProvider>
diff --git a/packages/react/src/docs/components/CheckboxBlocks/Examples/Disabled.tsx b/packages/react/src/docs/components/CheckboxBlocks/Examples/Disabled.tsx
deleted file mode 100644
index 470be3c..0000000
--- a/packages/react/src/docs/components/CheckboxBlocks/Examples/Disabled.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import { Label } from "@components/Label";
-import { Checkbox } from "@components/Checkbox";
-
-export function Disabled() {
- return (
- <Label direction="horizontal">
- <Checkbox size="base" disabled />
- <span>Agree terms and conditions</span>
- </Label>
- );
-}
diff --git a/packages/react/src/docs/components/CheckboxBlocks/Examples/Text.tsx b/packages/react/src/docs/components/CheckboxBlocks/Examples/Text.tsx
deleted file mode 100644
index 6c19dd0..0000000
--- a/packages/react/src/docs/components/CheckboxBlocks/Examples/Text.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import { Label } from "@components/Label";
-import { Checkbox } from "@components/Checkbox";
-
-export function Text() {
- return (
- <Label direction="horizontal">
- <Checkbox size="base" />
- <span>Agree terms and conditions</span>
- </Label>
- );
-}
diff --git a/packages/react/src/docs/components/CheckboxBlocks/Examples/index.ts b/packages/react/src/docs/components/CheckboxBlocks/Examples/index.ts
deleted file mode 100644
index 8b86020..0000000
--- a/packages/react/src/docs/components/CheckboxBlocks/Examples/index.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-import { Text } from "./Text";
-import { Disabled } from "./Disabled";
-
-export default { Text, Disabled };
-
diff --git a/packages/react/src/docs/components/CheckboxBlocks/Preview.tsx b/packages/react/src/docs/components/CheckboxBlocks/Preview.tsx
deleted file mode 100644
index 8f83020..0000000
--- a/packages/react/src/docs/components/CheckboxBlocks/Preview.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import { Checkbox } from "@components/Checkbox";
-import { Label } from "@components/Label";
-
-export function CheckboxDemo() {
- return (
- <Label direction="horizontal">
- <Checkbox />
- <span>Checkbox</span>
- </Label>
- );
-}
diff --git a/packages/react/src/docs/components/Dialog.mdx b/packages/react/src/docs/components/Dialog.mdx
deleted file mode 100644
index dc01c22..0000000
--- a/packages/react/src/docs/components/Dialog.mdx
+++ /dev/null
@@ -1,177 +0,0 @@
-import { TabProvider, TabTrigger, TabContent, TabList } from "@components/Tabs";
-import { Story } from "@/components/Story";
-import { LoadedCode, GITHUB } from "@/components/LoadedCode";
-import { DialogDemo } from "./DialogBlocks/Preview";
-import Examples from "./DialogBlocks/Examples";
-
-# Dialog
-A modal window that prompts the user to take an action or provides critical information.
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <DialogDemo />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/DialogBlocks/Preview.tsx`} />
- </TabContent>
-</TabProvider>
-
-## Installation
-
-1. Create a new file `Dialog.tsx` in your component folder.
-2. Copy and paste the following code into the file.
-
-<LoadedCode from={`${GITHUB}/packages/react/components/Dialog.tsx`} />
-
-## Usage
-
-```tsx
-import {
- DialogRoot,
- DialogTrigger,
- DialogOverlay,
- DialogContent,
- DialogHeader,
- DialogTitle,
- DialogSubtitle,
- DialogFooter,
- DialogClose,
-} from "@components/Dialog";
-```
-
-```html
-<DialogRoot>
- <DialogTrigger>
- <Button>Open Dialog</Button>
- </DialogTrigger>
- <DialogOverlay>
- <DialogContent>
- <DialogHeader>
- <DialogTitle>Dialog Title</DialogTitle>
- <DialogSubtitle>Dialog Subtitle</DialogSubtitle>
- </DialogHeader>
- {/* Main Contents */}
- <DialogFooter>
- <DialogClose>
- <Button>Close</Button>
- </DialogClose>
- </DialogFooter>
- </DialogContent>
- </DialogOverlay>
-</DialogRoot>
-```
-
-> Note:
->
-> DialogTrigger and DialogClose will merge its onClick event handler to its children.
-> Also, there is no default element for those.
-> So you always have to provide the clickable children for DialogTrigger and DialogClose.
->
-> It is easier to understand if you think of this component as always having the `asChild` prop applied to it.
-
-## Props
-
-### DialogOverlay
-
-#### Variants
-
-| Prop | Type | Default | Description |
-|:----------|:-----------------------|:--------|:---------------------------------------------|
-| `blur` | `"sm" \| "md" \| "lg"` | `md` | Whether the background of dialog is blurred |
-| `darken` | `"sm" \| "md" \| "lg"` | `md` | Whether the background of dialog is darkened |
-| `padding` | `"sm" \| "md" \| "lg"` | `md` | Minimum margin of the dialog |
-
-#### Special
-
-| Prop | Type | Default | Description |
-|:---------------|:----------|:--------|:-----------------------------------------------|
-| `closeOnClick` | `boolean` | `false` | Whether the dialog will be closed when clicked |
-
-### DialogContent
-
-#### Variants
-
-| Prop | Type | Default | Description |
-|:----------|:---------------------------------------------------------------------|:--------|:-----------------------------------------------|
-| `size` | `"fit" \| "fullSm" \| "fullMd" \| "fullLg" \| "fullXl" \| "full2xl"` | `fit` | Size of the dialog - width and max width |
-| `rounded` | `"sm" \| "md" \| "lg" \| "xl"` | `md` | Roundness of the dialog |
-| `padding` | `"sm" \| "md" \| "lg"` | `md` | Padding of the dialog |
-| `gap` | `"sm" \| "md" \| "lg"` | `md` | Works like flex's gap - space between children |
-
-### DialogHeader
-
-#### Variants
-
-| Prop | Type | Default | Description |
-|:------|:-----------------------|:--------|:----------------------------------------------|
-| `gap` | `"sm" \| "md" \| "lg"` | `sm` | Gap between the children - title and subtitle |
-
-### DialogTitle
-
-#### Variants
-
-| Prop | Type | Default | Description |
-|:---------|:-----------------------|:--------|:--------------------|
-| `size` | `"sm" \| "md" \| "lg"` | `md` | Size of the title |
-| `weight` | `"sm" \| "md" \| "lg"` | `lg` | Weight of the title |
-
-### DialogSubtitle
-
-#### Variants
-
-| Prop | Type | Default | Description |
-|:----------|:-----------------------|:--------|:------------------------|
-| `size` | `"sm" \| "md" \| "lg"` | `sm` | Size of the subtitle |
-| `weight` | `"sm" \| "md" \| "lg"` | `md` | Weight of the subtitle |
-| `opacity` | `"sm" \| "md" \| "lg"` | `sm` | Opacity of the subtitle |
-
-### DialogFooter
-
-#### Variants
-
-| Prop | Type | Default | Description |
-|:------|:-----------------------|:--------|:-------------------------|
-| `gap` | `"sm" \| "md" \| "lg"` | `sm` | Gap between the children |
-
-## Examples
-
-### Basic Informational Dialog
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.BasicInformationalDialog />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/DialogBlocks/Examples/BasicInformationalDialog.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Deleting Item
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.DeletingItem />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/DialogBlocks/Examples/DeletingItem.tsx`} />
- </TabContent>
-</TabProvider>
-
diff --git a/packages/react/src/docs/components/DialogBlocks/Examples/BasicInformationalDialog.tsx b/packages/react/src/docs/components/DialogBlocks/Examples/BasicInformationalDialog.tsx
deleted file mode 100644
index 5051e08..0000000
--- a/packages/react/src/docs/components/DialogBlocks/Examples/BasicInformationalDialog.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import { Button } from "@components/Button";
-import {
- DialogRoot,
- DialogTrigger,
- DialogOverlay,
- DialogContent,
- DialogHeader,
- DialogTitle,
- DialogSubtitle,
- DialogFooter,
- DialogClose,
-} from "@components/Dialog";
-
-export function BasicInformationalDialog() {
- return (
- <DialogRoot>
- <DialogTrigger>
- <Button preset="default">What is this?</Button>
- </DialogTrigger>
- <DialogOverlay>
- <DialogContent size={"fullMd"}>
- <DialogHeader>
- <DialogTitle>Dialog Title</DialogTitle>
- <DialogSubtitle>Dialog Subtitle</DialogSubtitle>
- </DialogHeader>
- <p>This is a dialog. You can put the information you want to show.</p>
- <DialogFooter>
- <DialogClose>
- <Button preset="default">Ok!</Button>
- </DialogClose>
- </DialogFooter>
- </DialogContent>
- </DialogOverlay>
- </DialogRoot>
- );
-}
diff --git a/packages/react/src/docs/components/DialogBlocks/Examples/DeletingItem.tsx b/packages/react/src/docs/components/DialogBlocks/Examples/DeletingItem.tsx
deleted file mode 100644
index 1c58385..0000000
--- a/packages/react/src/docs/components/DialogBlocks/Examples/DeletingItem.tsx
+++ /dev/null
@@ -1,79 +0,0 @@
-import {
- DialogRoot,
- DialogTrigger,
- DialogOverlay,
- DialogContent,
- DialogHeader,
- DialogTitle,
- DialogSubtitle,
- DialogFooter,
- DialogClose,
-} from "@components/Dialog";
-import { Button } from "@components/Button";
-import { useToast } from "@components/Toast";
-
-export function DeletingItem() {
- const { toast } = useToast();
-
- return (
- <DialogRoot>
- <DialogTrigger>
- <Button preset="danger">Delete Item</Button>
- </DialogTrigger>
- <DialogOverlay>
- <DialogContent size={"fullMd"}>
- <DialogHeader>
- <DialogTitle>Delete Item</DialogTitle>
- <DialogSubtitle>
- Are you sure you want to delete this item?
- </DialogSubtitle>
- </DialogHeader>
- <div className="flex flex-col gap-3">
- <ul className="list-disc list-inside">
- <li>This action will delete the item, and related data</li>
- <li>This action cannot be undone</li>
- </ul>
- </div>
- <DialogFooter>
- <DialogClose>
- <Button
- preset="danger"
- onClick={async () => {
- const toasted = toast({
- title: "Deleting Item",
- description: "Item deletion is requested",
- status: "loading",
- });
-
- await new Promise((r) => setTimeout(r, 1000));
-
- toasted.update({
- title: "Item Deleted",
- description: "The item has been deleted",
- status: "success",
- });
- }}
- >
- Delete
- </Button>
- </DialogClose>
- <DialogClose>
- <Button
- preset="default"
- onClick={() => {
- toast({
- title: "Action Canceled",
- description: "The delete action has been canceled",
- status: "error",
- });
- }}
- >
- Cancel
- </Button>
- </DialogClose>
- </DialogFooter>
- </DialogContent>
- </DialogOverlay>
- </DialogRoot>
- );
-}
diff --git a/packages/react/src/docs/components/DialogBlocks/Examples/index.ts b/packages/react/src/docs/components/DialogBlocks/Examples/index.ts
deleted file mode 100644
index 1422de3..0000000
--- a/packages/react/src/docs/components/DialogBlocks/Examples/index.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-import { BasicInformationalDialog } from "./BasicInformationalDialog";
-import { DeletingItem } from "./DeletingItem";
-
-export default {
- BasicInformationalDialog,
- DeletingItem,
-}
-
diff --git a/packages/react/src/docs/components/DialogBlocks/Preview.tsx b/packages/react/src/docs/components/DialogBlocks/Preview.tsx
deleted file mode 100644
index 3392a50..0000000
--- a/packages/react/src/docs/components/DialogBlocks/Preview.tsx
+++ /dev/null
@@ -1,42 +0,0 @@
-import {
- DialogRoot,
- DialogTrigger,
- DialogOverlay,
- DialogContent,
- DialogHeader,
- DialogTitle,
- DialogSubtitle,
- DialogFooter,
- DialogClose,
-} from "@components/Dialog";
-import { Button } from "@components/Button";
-
-export function DialogDemo() {
- return (
- <DialogRoot>
- <DialogTrigger>
- <Button preset="default">Open Dialog</Button>
- </DialogTrigger>
- <DialogOverlay>
- <DialogContent size={"fullMd"}>
- <DialogHeader>
- <DialogTitle>Dialog Title</DialogTitle>
- <DialogSubtitle>Dialog Subtitle</DialogSubtitle>
- </DialogHeader>
- <p>
- Laborum non adipisicing enim enim culpa esse anim esse consequat
- Lorem incididunt. Enim mollit laborum sunt cillum voluptate est
- officia nostrud non consequat adipisicing cupidatat aliquip magna.
- Voluptate nisi cupidatat qui nisi in pariatur. Sint consequat labore
- pariatur mollit sint nostrud tempor commodo pariatur ea laboris.
- </p>
- <DialogFooter>
- <DialogClose>
- <Button preset="default">Close</Button>
- </DialogClose>
- </DialogFooter>
- </DialogContent>
- </DialogOverlay>
- </DialogRoot>
- );
-}
diff --git a/packages/react/src/docs/components/Drawer.mdx b/packages/react/src/docs/components/Drawer.mdx
deleted file mode 100644
index 091f218..0000000
--- a/packages/react/src/docs/components/Drawer.mdx
+++ /dev/null
@@ -1,203 +0,0 @@
-import { TabProvider, TabTrigger, TabContent, TabList } from "@components/Tabs";
-import { Story } from "@/components/Story";
-import { LoadedCode, GITHUB } from '@/components/LoadedCode';
-import { DrawerDemo } from "./DrawerBlocks/Preview";
-import Examples from "./DrawerBlocks/Examples";
-
-# Drawer
-Displays a panel that slides out from the edge of the screen, typically used for navigation or additional content.
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <DrawerDemo />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/DrawerBlocks/Preview.tsx`} />
- </TabContent>
-</TabProvider>
-
-## Installation
-
-1. Create a new file `Drawer.tsx` in your component folder.
-2. Copy and paste the following code into the file.
-
-<LoadedCode from={`${GITHUB}/packages/react/components/Drawer.tsx`} />
-
-## Usage
-
-```tsx
-import {
- DrawerRoot,
- DrawerTrigger,
- DrawerOverlay,
- DrawerContent,
- DrawerClose,
- DrawerHeader,
- DrawerBody,
- DrawerFooter,
-} from "@components/Drawer";
-```
-
-```html
-<DrawerRoot>
- <DrawerTrigger>
- <Button>Open Drawer</Button>
- </DrawerTrigger>
- <DrawerOverlay>
- <DrawerContent>
- <DrawerHeader>
- <h1 className="text-2xl font-bold">Drawer</h1>
- </DrawerHeader>
- <DrawerBody>
- {/* Main Contents */}
- </DrawerBody>
- <DrawerFooter>
- <DrawerClose>
- <Button>Close Drawer</Button>
- </DrawerClose>
- </DrawerFooter>
- </DrawerContent>
- </DrawerOverlay>
-</DrawerRoot>
-```
-
-> Note:
->
-> DrawerTrigger and DrawerClose will merge its onClick event handler to its children.
-> Also, there is no default element for those.
-> So you always have to provide the clickable children for DialogTrigger and DialogClose.
->
-> It is easier to understand if you think of this component as always having the `asChild` prop applied to it.
-
-## Props
-
-### DrawerRoot
-
-#### Special
-
-| Prop | Type | Default | Description |
-|:-----------------|:----------|:---------------|:----------------------------------------------------------|
-| `closeThreshold` | `number` | `0.3` | The threshold for the drawer to close with swipe or drag. |
-| `opened` | `boolean` | - (Controlled) | Whether the drawer is opened. |
-
-### DrawerOverlay
-
-#### Special
-
-| Prop | Type | Default | Description |
-|:----------|:----------|:--------|:------------------------------------------------------------|
-| `asChild` | `boolean` | `false` | Whether the component is rendered as a child of a component |
-
-### DrawerContent
-
-#### Variants
-
-| Prop | Type | Default | Description |
-|:-----------|:-----------------------------------------|:---------|:---------------------------|
-| `position` | `"top" \| "bottom" \| "left" \| "right"` | `"left"` | The position of the drawer |
-
-#### Special
-
-| Prop | Type | Default | Description |
-|:----------|:----------|:--------|:------------------------------------------------------------|
-| `asChild` | `boolean` | `false` | Whether the component is rendered as a child of a component |
-
-### DrawerHeader
-
-#### Special
-
-| Prop | Type | Default | Description |
-|:----------|:----------|:--------|:------------------------------------------------------------|
-| `asChild` | `boolean` | `false` | Whether the component is rendered as a child of a component |
-
-### DrawerBody
-
-#### Special
-
-| Prop | Type | Default | Description |
-|:----------|:----------|:--------|:------------------------------------------------------------|
-| `asChild` | `boolean` | `false` | Whether the component is rendered as a child of a component |
-
-### DrawerFooter
-
-#### Special
-
-| Prop | Type | Default | Description |
-|:----------|:----------|:--------|:------------------------------------------------------------|
-| `asChild` | `boolean` | `false` | Whether the component is rendered as a child of a component |
-
-## Examples
-
-### Left
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Left />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/DrawerBlocks/Examples/Left.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Right
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Right />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/DrawerBlocks/Examples/Right.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Top
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Top />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/DrawerBlocks/Examples/Top.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Bottom
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Bottom />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/DrawerBlocks/Examples/Bottom.tsx`} />
- </TabContent>
-</TabProvider>
diff --git a/packages/react/src/docs/components/DrawerBlocks/Examples/Bottom.tsx b/packages/react/src/docs/components/DrawerBlocks/Examples/Bottom.tsx
deleted file mode 100644
index 6b9a856..0000000
--- a/packages/react/src/docs/components/DrawerBlocks/Examples/Bottom.tsx
+++ /dev/null
@@ -1,40 +0,0 @@
-import {
- DrawerRoot,
- DrawerTrigger,
- DrawerOverlay,
- DrawerContent,
- DrawerHeader,
- DrawerBody,
- DrawerFooter,
- DrawerClose,
-} from "@components/Drawer";
-import { Button } from "@components/Button";
-
-export const Bottom = () => {
- return (
- <DrawerRoot>
- <DrawerTrigger>
- <Button>Open Drawer</Button>
- </DrawerTrigger>
- <DrawerOverlay className="z-[99]">
- <DrawerContent position="bottom">
- <DrawerHeader>
- <h1 className="text-2xl font-bold">Drawer</h1>
- </DrawerHeader>
- <DrawerBody>
- <p>
- Drawers are a type of overlay that slides in from the edge of the
- screen. They are typically used for navigation or additional
- content.
- </p>
- </DrawerBody>
- <DrawerFooter>
- <DrawerClose>
- <Button>Done</Button>
- </DrawerClose>
- </DrawerFooter>
- </DrawerContent>
- </DrawerOverlay>
- </DrawerRoot>
- );
-};
diff --git a/packages/react/src/docs/components/DrawerBlocks/Examples/Left.tsx b/packages/react/src/docs/components/DrawerBlocks/Examples/Left.tsx
deleted file mode 100644
index 31928e3..0000000
--- a/packages/react/src/docs/components/DrawerBlocks/Examples/Left.tsx
+++ /dev/null
@@ -1,40 +0,0 @@
-import {
- DrawerRoot,
- DrawerTrigger,
- DrawerOverlay,
- DrawerContent,
- DrawerHeader,
- DrawerBody,
- DrawerFooter,
- DrawerClose,
-} from "@components/Drawer";
-import { Button } from "@components/Button";
-
-export const Left = () => {
- return (
- <DrawerRoot>
- <DrawerTrigger>
- <Button>Open Drawer</Button>
- </DrawerTrigger>
- <DrawerOverlay className="z-[99]">
- <DrawerContent position="left" className="max-w-[320px]">
- <DrawerHeader>
- <h1 className="text-2xl font-bold">Drawer</h1>
- </DrawerHeader>
- <DrawerBody>
- <p>
- Drawers are a type of overlay that slides in from the edge of the
- screen. They are typically used for navigation or additional
- content.
- </p>
- </DrawerBody>
- <DrawerFooter>
- <DrawerClose>
- <Button>Done</Button>
- </DrawerClose>
- </DrawerFooter>
- </DrawerContent>
- </DrawerOverlay>
- </DrawerRoot>
- );
-};
diff --git a/packages/react/src/docs/components/DrawerBlocks/Examples/Right.tsx b/packages/react/src/docs/components/DrawerBlocks/Examples/Right.tsx
deleted file mode 100644
index 369bf88..0000000
--- a/packages/react/src/docs/components/DrawerBlocks/Examples/Right.tsx
+++ /dev/null
@@ -1,40 +0,0 @@
-import {
- DrawerRoot,
- DrawerTrigger,
- DrawerOverlay,
- DrawerContent,
- DrawerHeader,
- DrawerBody,
- DrawerFooter,
- DrawerClose,
-} from "@components/Drawer";
-import { Button } from "@components/Button";
-
-export const Right = () => {
- return (
- <DrawerRoot>
- <DrawerTrigger>
- <Button>Open Drawer</Button>
- </DrawerTrigger>
- <DrawerOverlay className="z-[99]">
- <DrawerContent position="right" className="max-w-[320px]">
- <DrawerHeader>
- <h1 className="text-2xl font-bold">Drawer</h1>
- </DrawerHeader>
- <DrawerBody>
- <p>
- Drawers are a type of overlay that slides in from the edge of the
- screen. They are typically used for navigation or additional
- content.
- </p>
- </DrawerBody>
- <DrawerFooter>
- <DrawerClose>
- <Button>Done</Button>
- </DrawerClose>
- </DrawerFooter>
- </DrawerContent>
- </DrawerOverlay>
- </DrawerRoot>
- );
-};
diff --git a/packages/react/src/docs/components/DrawerBlocks/Examples/Top.tsx b/packages/react/src/docs/components/DrawerBlocks/Examples/Top.tsx
deleted file mode 100644
index 79fc096..0000000
--- a/packages/react/src/docs/components/DrawerBlocks/Examples/Top.tsx
+++ /dev/null
@@ -1,40 +0,0 @@
-import {
- DrawerRoot,
- DrawerTrigger,
- DrawerOverlay,
- DrawerContent,
- DrawerHeader,
- DrawerBody,
- DrawerFooter,
- DrawerClose,
-} from "@components/Drawer";
-import { Button } from "@components/Button";
-
-export const Top = () => {
- return (
- <DrawerRoot>
- <DrawerTrigger>
- <Button>Open Drawer</Button>
- </DrawerTrigger>
- <DrawerOverlay className="z-[99]">
- <DrawerContent position="top">
- <DrawerHeader>
- <h1 className="text-2xl font-bold">Drawer</h1>
- </DrawerHeader>
- <DrawerBody>
- <p>
- Drawers are a type of overlay that slides in from the edge of the
- screen. They are typically used for navigation or additional
- content.
- </p>
- </DrawerBody>
- <DrawerFooter>
- <DrawerClose>
- <Button>Done</Button>
- </DrawerClose>
- </DrawerFooter>
- </DrawerContent>
- </DrawerOverlay>
- </DrawerRoot>
- );
-};
diff --git a/packages/react/src/docs/components/DrawerBlocks/Examples/index.ts b/packages/react/src/docs/components/DrawerBlocks/Examples/index.ts
deleted file mode 100644
index d1d88b9..0000000
--- a/packages/react/src/docs/components/DrawerBlocks/Examples/index.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import { Left } from "./Left";
-import { Right } from "./Right";
-import { Top } from "./Top";
-import { Bottom } from "./Bottom";
-
-export default { Left, Right, Top, Bottom };
-
diff --git a/packages/react/src/docs/components/DrawerBlocks/Preview.tsx b/packages/react/src/docs/components/DrawerBlocks/Preview.tsx
deleted file mode 100644
index fb749fa..0000000
--- a/packages/react/src/docs/components/DrawerBlocks/Preview.tsx
+++ /dev/null
@@ -1,40 +0,0 @@
-import { Button } from "@components/Button";
-import {
- DrawerRoot,
- DrawerTrigger,
- DrawerOverlay,
- DrawerContent,
- DrawerClose,
- DrawerHeader,
- DrawerBody,
- DrawerFooter,
-} from "@components/Drawer";
-
-export const DrawerDemo = () => {
- return (
- <DrawerRoot>
- <DrawerTrigger>
- <Button>Open Drawer</Button>
- </DrawerTrigger>
- <DrawerOverlay className="z-[99]">
- <DrawerContent className="max-w-[320px]">
- <DrawerHeader>
- <h1 className="text-2xl font-bold">Drawer</h1>
- </DrawerHeader>
- <DrawerBody>
- <p>
- Drawers are a type of overlay that slides in from the edge of the
- screen. They are typically used for navigation or additional
- content.
- </p>
- </DrawerBody>
- <DrawerFooter>
- <DrawerClose>
- <Button>Close</Button>
- </DrawerClose>
- </DrawerFooter>
- </DrawerContent>
- </DrawerOverlay>
- </DrawerRoot>
- );
-};
diff --git a/packages/react/src/docs/components/Input.mdx b/packages/react/src/docs/components/Input.mdx
deleted file mode 100644
index e879950..0000000
--- a/packages/react/src/docs/components/Input.mdx
+++ /dev/null
@@ -1,123 +0,0 @@
-import { TabProvider, TabTrigger, TabContent, TabList } from "@components/Tabs";
-import { Story } from "@/components/Story";
-import { LoadedCode, GITHUB } from "@/components/LoadedCode";
-import { InputDemo } from "./InputBlocks/Preview";
-import { InputFrameDemo } from "./InputFrameBlocks/Preview";
-import InputExamples from "./InputBlocks/Examples";
-
-# Input
-Element that captures user's input.
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <InputDemo />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/InputBlocks/Preview.tsx`} />
- </TabContent>
-</TabProvider>
-
-## Installation
-
-1. Create a new file `Input.tsx` in your component folder.
-2. Copy and paste the following code into the file.
-
-<LoadedCode from={`${GITHUB}/packages/react/components/Input.tsx`} />
-
-## Usage
-
-```tsx
-import { Input } from "@components/Input";
-```
-
-```html
-<Input type="text" />
-```
-
-## Props
-
-### Variants
-
-| Prop | Type | Default | Description |
-|:-----------|:----------|:--------|:-----------------------------------------------------------------------------------------|
-| `unstyled` | `boolean` | `false` | Remove style of input, so it can be real transparent input. Mostly used with InputFrame. |
-| `full` | `boolean` | `false` | Make input take full width of its container. |
-
-## Examples
-
-### Invalid
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <InputExamples.Invalid />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/InputBlocks/Examples/Invalid.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Disabled
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <InputExamples.Disabled />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/InputBlocks/Examples/Disabled.tsx`} />
- </TabContent>
-</TabProvider>
-
-# InputFrame
-Label with input's style.
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <InputFrameDemo />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/InputFrameBlocks/Preview.tsx`} />
- </TabContent>
-</TabProvider>
-
-## Installation
-
-**Included in `Input.tsx`.**
-
-## Usage
-
-```tsx
-import {
- Input,
- InputFrame,
-} from "@components/Input";
-```
-
-```html
-<InputFrame>
- <Input type="text" unstyled />
-</InputFrame>
-```
\ No newline at end of file
diff --git a/packages/react/src/docs/components/InputBlocks/Examples/Disabled.tsx b/packages/react/src/docs/components/InputBlocks/Examples/Disabled.tsx
deleted file mode 100644
index e81c9db..0000000
--- a/packages/react/src/docs/components/InputBlocks/Examples/Disabled.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-import { Input } from "@components/Input";
-
-export function Disabled() {
- return <Input type="text" disabled />;
-}
diff --git a/packages/react/src/docs/components/InputBlocks/Examples/Invalid.tsx b/packages/react/src/docs/components/InputBlocks/Examples/Invalid.tsx
deleted file mode 100644
index 27fb355..0000000
--- a/packages/react/src/docs/components/InputBlocks/Examples/Invalid.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-import { Input } from "@components/Input";
-
-export function Invalid() {
- return <Input type="text" invalid="Invalid Input" />;
-}
diff --git a/packages/react/src/docs/components/InputBlocks/Examples/index.ts b/packages/react/src/docs/components/InputBlocks/Examples/index.ts
deleted file mode 100644
index 5c43f37..0000000
--- a/packages/react/src/docs/components/InputBlocks/Examples/index.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-import { Invalid } from "./Invalid";
-import { Disabled } from "./Disabled";
-
-export default { Invalid, Disabled };
-
diff --git a/packages/react/src/docs/components/InputBlocks/Preview.tsx b/packages/react/src/docs/components/InputBlocks/Preview.tsx
deleted file mode 100644
index b066653..0000000
--- a/packages/react/src/docs/components/InputBlocks/Preview.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-import { Input } from "@components/Input";
-
-export function InputDemo() {
- return <Input type="text" />;
-}
diff --git a/packages/react/src/docs/components/InputFrameBlocks/Preview.tsx b/packages/react/src/docs/components/InputFrameBlocks/Preview.tsx
deleted file mode 100644
index 1068c34..0000000
--- a/packages/react/src/docs/components/InputFrameBlocks/Preview.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { Button } from "@components/Button";
-import { Input, InputFrame } from "@components/Input";
-
-export function InputFrameDemo() {
- return (
- <InputFrame>
- <Input type="text" unstyled />
- <Button preset="success" size="icon">
- <svg
- xmlns="http://www.w3.org/2000/svg"
- width="1.2em"
- height="1.2em"
- viewBox="0 0 24 24"
- >
- <path
- fill="currentColor"
- d="M9.5 3A6.5 6.5 0 0 1 16 9.5c0 1.61-.59 3.09-1.56 4.23l.27.27h.79l5 5l-1.5 1.5l-5-5v-.79l-.27-.27A6.52 6.52 0 0 1 9.5 16A6.5 6.5 0 0 1 3 9.5A6.5 6.5 0 0 1 9.5 3m0 2C7 5 5 7 5 9.5S7 14 9.5 14S14 12 14 9.5S12 5 9.5 5"
- />
- </svg>
- </Button>
- </InputFrame>
- );
-}
diff --git a/packages/react/src/docs/components/Label.mdx b/packages/react/src/docs/components/Label.mdx
deleted file mode 100644
index 6c9deeb..0000000
--- a/packages/react/src/docs/components/Label.mdx
+++ /dev/null
@@ -1,125 +0,0 @@
-import {
- TabProvider, TabTrigger, TabContent, TabList
-} from "@components/Tabs";
-import { Story } from "@/components/Story";
-import { LoadedCode, GITHUB } from "@/components/LoadedCode";
-import { LabelDemo } from "./LabelBlocks/Preview";
-import Examples from "./LabelBlocks/Examples"
-
-# Label
-A wrapper that used to tag and describe form elements clearly and accessibly.
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <LabelDemo />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/LabelBlocks/Preview.tsx`} />
- </TabContent>
-</TabProvider>
-
-## Installation
-
-1. Create a new file `Label.tsx` in your component folder.
-2. Copy and paste the following code into the file.
-
-<LoadedCode from={`${GITHUB}/packages/react/components/Label.tsx`} />
-
-## Usage
-
-```tsx
-import { Label } from "@components/Label"
-```
-
-```html
-<Label>
- <input />
-</Label>
-
-<Label htmlFor="input">Label</Label>
-<input id="input" />
-```
-
-## Props
-
-### Variants
-
-| Prop | Type | Default | Description |
-|:------------|:-----------------------------|:-------------|:----------------------------|
-| `direction` | `"vertical" \| "horizontal"` | `"vertical"` | The direction of the label. |
-
-## Examples
-
-### Vertical
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Vertical />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/LabelBlocks/Examples/Vertical.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Horizontal
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Horizontal />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/LabelBlocks/Examples/Horizontal.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Invalid
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Invalid />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/LabelBlocks/Examples/Invalid.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Disabled
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Disabled />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/LabelBlocks/Examples/Disabled.tsx`} />
- </TabContent>
-</TabProvider>
\ No newline at end of file
diff --git a/packages/react/src/docs/components/LabelBlocks/Examples/Disabled.tsx b/packages/react/src/docs/components/LabelBlocks/Examples/Disabled.tsx
deleted file mode 100644
index 85f58d4..0000000
--- a/packages/react/src/docs/components/LabelBlocks/Examples/Disabled.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import { Label } from "@components/Label";
-import { Input } from "@components/Input";
-
-export function Disabled() {
- return (
- <Label direction="vertical">
- <span>Email</span>
- <Input type="email" disabled />
- </Label>
- );
-}
diff --git a/packages/react/src/docs/components/LabelBlocks/Examples/Horizontal.tsx b/packages/react/src/docs/components/LabelBlocks/Examples/Horizontal.tsx
deleted file mode 100644
index 35d370c..0000000
--- a/packages/react/src/docs/components/LabelBlocks/Examples/Horizontal.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import { Label } from "@components/Label";
-import { Checkbox } from "@components/Checkbox";
-
-export function Horizontal() {
- return (
- <Label direction="horizontal">
- <Checkbox />
- <span>Checkbox</span>
- </Label>
- );
-}
diff --git a/packages/react/src/docs/components/LabelBlocks/Examples/Invalid.tsx b/packages/react/src/docs/components/LabelBlocks/Examples/Invalid.tsx
deleted file mode 100644
index 9d1c73d..0000000
--- a/packages/react/src/docs/components/LabelBlocks/Examples/Invalid.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import { Label } from "@components/Label";
-import { Input } from "@components/Input";
-
-export function Invalid() {
- return (
- <Label direction="vertical">
- <span>Email</span>
- <Input type="email" invalid="Invalid Email" />
- </Label>
- );
-}
diff --git a/packages/react/src/docs/components/LabelBlocks/Examples/Vertical.tsx b/packages/react/src/docs/components/LabelBlocks/Examples/Vertical.tsx
deleted file mode 100644
index 701c710..0000000
--- a/packages/react/src/docs/components/LabelBlocks/Examples/Vertical.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import { Label } from "@components/Label";
-import { Input } from "@components/Input";
-
-export function Vertical() {
- return (
- <Label direction="vertical">
- <span>Email</span>
- <Input type="email" />
- </Label>
- );
-}
diff --git a/packages/react/src/docs/components/LabelBlocks/Examples/index.ts b/packages/react/src/docs/components/LabelBlocks/Examples/index.ts
deleted file mode 100644
index 4b37b25..0000000
--- a/packages/react/src/docs/components/LabelBlocks/Examples/index.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-import { Vertical } from "./Vertical";
-import { Horizontal } from "./Horizontal";
-import { Invalid } from "./Invalid";
-import { Disabled } from "./Disabled";
-
-export default {
- Vertical,
- Horizontal,
- Invalid,
- Disabled,
-};
-
diff --git a/packages/react/src/docs/components/LabelBlocks/Preview.tsx b/packages/react/src/docs/components/LabelBlocks/Preview.tsx
deleted file mode 100644
index dcc9683..0000000
--- a/packages/react/src/docs/components/LabelBlocks/Preview.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import { Label } from "@components/Label";
-import { Input } from "@components/Input";
-
-export function LabelDemo() {
- return (
- <Label direction="vertical">
- <span>Email</span>
- <Input type="email" />
- </Label>
- );
-}
diff --git a/packages/react/src/docs/components/Popover.mdx b/packages/react/src/docs/components/Popover.mdx
deleted file mode 100644
index ef3c6be..0000000
--- a/packages/react/src/docs/components/Popover.mdx
+++ /dev/null
@@ -1,117 +0,0 @@
-import { TabProvider, TabTrigger, TabContent, TabList } from "@components/Tabs";
-import { Story } from "@/components/Story";
-import { LoadedCode, GITHUB } from "@/components/LoadedCode";
-import { PopoverDemo } from "./PopoverBlocks/Preview";
-import Examples from "./PopoverBlocks/Examples";
-
-# Popover
-Displays rich content in a portal, triggered by a button.
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <PopoverDemo />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/PopoverBlocks/Preview.tsx`} />
- </TabContent>
-</TabProvider>
-
-## Installation
-
-1. Create a new file `Popover.tsx` in your component folder.
-2. Copy and paste the following code into the file.
-
-<LoadedCode from={`${GITHUB}/packages/react/components/Popover.tsx`} />
-
-## Usage
-
-```tsx
-import { Popover, PopoverTrigger, PopoverContent } from "@components/popover"
-```
-
-```html
-<Popover>
- <PopoverTrigger>
- <Button />
- </PopoverTrigger>
- <PopoverContent>
- {/* content of popover */}
- </PopoverContent>
-</Popover
-```
-
-> Note:
->
-> PopoverTrigger will merge its onClick event handler to its children.
-> Also, there is no default element for those.
-> So you always have to provide the clickable children for PopoverTrigger.
->
-> It is easier to understand if you think of this component as always having the `asChild` prop applied to it.
-
-## Props
-
-### Popover
-
-#### Special
-
-| Prop | Type | Default | Description |
-|:----------|:----------|:--------|:------------------------------------------------------------------|
-| `opened` | `boolean` | `false` | Initial open state |
-| `asChild` | `boolean` | `false` | Whether the root of popover is rendered as a child of a component |
-
-### PopoverContent
-
-#### Variants
-
-| Prop | Type | Default | Description |
-|:---------|:-------------------------------------------------------------------------|:-----------------|:--------------------------------|
-| `anchor` | `` `${"top" \| "middle" \| "bottom"}${"Left" \| "Center" \| "Right"}` `` | `"bottomCenter"` | Position of Popover content |
-| `offset` | `"sm" \| "md" \| "lg"` | `"md"` | Gap between trigger and popover |
-
-#### Special
-
-| Prop | Type | Default | Description |
-|:----------|:----------|:--------|:--------------------------------------------------------------------------------|
-| `asChild` | `boolean` | `false` | `Whether the container of popover content is rendered as a child of a component |
-
-## Examples
-
-### Theme Selector
-
-<TabProvider defaultName={"preview"}>
- <TabList>
- <TabTrigger name={"preview"}>Preview</TabTrigger>
- <TabTrigger name={"code"}>Code</TabTrigger>
- </TabList>
- <TabContent name={"preview"}>
- <Story layout={"centered"}>
- <Examples.ThemeSelector />
- </Story>
- </TabContent>
- <TabContent name={"code"}>
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/PopoverBlocks/Examples/ThemeSelector.tsx`} />
- </TabContent>
-</TabProvider>
-
-### User Control
-
-<TabProvider defaultName={"preview"}>
- <TabList>
- <TabTrigger name={"preview"}>Preview</TabTrigger>
- <TabTrigger name={"code"}>Code</TabTrigger>
- </TabList>
- <TabContent name={"preview"}>
- <Story layout={"centered"}>
- <Examples.UserControl />
- </Story>
- </TabContent>
- <TabContent name={"code"}>
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/PopoverBlocks/Examples/UserControl.tsx`} />
- </TabContent>
-</TabProvider>
\ No newline at end of file
diff --git a/packages/react/src/docs/components/PopoverBlocks/Examples/ThemeSelector.tsx b/packages/react/src/docs/components/PopoverBlocks/Examples/ThemeSelector.tsx
deleted file mode 100644
index 9adc1c2..0000000
--- a/packages/react/src/docs/components/PopoverBlocks/Examples/ThemeSelector.tsx
+++ /dev/null
@@ -1,43 +0,0 @@
-import { Popover, PopoverTrigger, PopoverContent } from "@components/Popover.tsx";
-import { Button } from "@components/Button.tsx";
-import { useState } from "react";
-
-const DarkIcon = () => {
- // ic:baseline-dark-mode
- return <svg xmlns="http://www.w3.org/2000/svg" width="1.2em" height="1.2em" viewBox="0 0 24 24">
- <path fill="currentColor"
- d="M12 3a9 9 0 1 0 9 9c0-.46-.04-.92-.1-1.36a5.389 5.389 0 0 1-4.4 2.26a5.403 5.403 0 0 1-3.14-9.8c-.44-.06-.9-.1-1.36-.1"/>
- </svg>
-}
-
-const LightIcon = () => {
- // ic:baseline-light-mode
- return <svg xmlns="http://www.w3.org/2000/svg" width="1.2em" height="1.2em" viewBox="0 0 24 24">
- <path fill="currentColor"
- d="M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5s5-2.24 5-5s-2.24-5-5-5M2 13h2c.55 0 1-.45 1-1s-.45-1-1-1H2c-.55 0-1 .45-1 1s.45 1 1 1m18 0h2c.55 0 1-.45 1-1s-.45-1-1-1h-2c-.55 0-1 .45-1 1s.45 1 1 1M11 2v2c0 .55.45 1 1 1s1-.45 1-1V2c0-.55-.45-1-1-1s-1 .45-1 1m0 18v2c0 .55.45 1 1 1s1-.45 1-1v-2c0-.55-.45-1-1-1s-1 .45-1 1M5.99 4.58a.996.996 0 0 0-1.41 0a.996.996 0 0 0 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0s.39-1.03 0-1.41zm12.37 12.37a.996.996 0 0 0-1.41 0a.996.996 0 0 0 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0a.996.996 0 0 0 0-1.41zm1.06-10.96a.996.996 0 0 0 0-1.41a.996.996 0 0 0-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0zM7.05 18.36a.996.996 0 0 0 0-1.41a.996.996 0 0 0-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0z"/>
- </svg>
-}
-
-export const ThemeSelector = () => {
- const [theme, setTheme] = useState<"light" | "dark">("dark");
-
- return <Popover>
- <PopoverTrigger>
- <Button preset={"default"} size={"icon"}>
- {
- theme === "light" ? <LightIcon /> : <DarkIcon />
- }
- </Button>
- </PopoverTrigger>
- <PopoverContent anchor={"bottomCenter"}>
- <Button onClick={() => setTheme("dark")} preset={"ghost"} className={"gap-2"}>
- <DarkIcon />
- <span className={"whitespace-nowrap"}>Dark Mode</span>
- </Button>
- <Button onClick={() => setTheme("light")} preset={"ghost"} className={"gap-2"}>
- <LightIcon />
- <span className={"whitespace-nowrap"}>Light Mode</span>
- </Button>
- </PopoverContent>
- </Popover>
-}
\ No newline at end of file
diff --git a/packages/react/src/docs/components/PopoverBlocks/Examples/UserControl.tsx b/packages/react/src/docs/components/PopoverBlocks/Examples/UserControl.tsx
deleted file mode 100644
index 5ccd52d..0000000
--- a/packages/react/src/docs/components/PopoverBlocks/Examples/UserControl.tsx
+++ /dev/null
@@ -1,151 +0,0 @@
-import {
- Popover,
- PopoverTrigger,
- PopoverContent,
-} from "@components/Popover.tsx";
-import { Button } from "@components/Button.tsx";
-import { useToast } from "@components/Toast.tsx";
-import {
- createContext,
- Dispatch,
- SetStateAction,
- SVGProps,
- useContext,
- useState,
- useTransition,
-} from "react";
-import { Label } from "@components/Label.tsx";
-import { Input } from "@components/Input.tsx";
-
-interface UserControlState {
- signIn: boolean;
-}
-const initialState: UserControlState = {
- signIn: false,
-};
-const UserControlContext = createContext<
- [UserControlState, Dispatch<SetStateAction<UserControlState>>]
->([initialState, () => {}]);
-
-const logInServerAction = async () => {
- return new Promise((r) => setTimeout(r, 2000));
-};
-
-const logOutServerAction = async () => {
- return new Promise((r) => setTimeout(r, 1000));
-};
-
-function MdiLoading(props: SVGProps<SVGSVGElement>) {
- return (
- <svg
- xmlns="http://www.w3.org/2000/svg"
- width="1.2em"
- height="1.2em"
- viewBox="0 0 24 24"
- {...props}
- >
- <path
- fill="currentColor"
- d="M12 4V2A10 10 0 0 0 2 12h2a8 8 0 0 1 8-8"
- ></path>
- </svg>
- );
-}
-
-const SignInForm = () => {
- const [isSigningIn, setIsSigningIn] = useState(false);
- const transition = useTransition();
- const [_, setState] = useContext(UserControlContext);
- const { toast } = useToast();
-
- function startSignIn() {
- transition[1](() => {
- setIsSigningIn(true);
- const toasted = toast({
- title: "Logging In...",
- description: "Please wait until server responses",
- status: "loading",
- });
- logInServerAction().then(() => {
- toasted.update({
- title: "Log In Success",
- description: "Successfully logged in!",
- status: "success",
- });
- setIsSigningIn(false);
- setState((prev) => ({ ...prev, signIn: true }));
- });
- });
- }
-
- return (
- <PopoverContent anchor={"bottomLeft"} className={"p-4 space-y-3"}>
- <Label>
- <span>Username</span>
- <Input type={"text"} />
- </Label>
- <Label>
- <span>Password</span>
- <Input type={"password"} />
- </Label>
- <div className={"flex flex-row justify-end"}>
- <Button preset={"success"} onClick={startSignIn}>
- {isSigningIn ? <MdiLoading className={"animate-spin"} /> : "Sign In"}
- </Button>
- </div>
- </PopoverContent>
- );
-};
-
-const UserControlContent = () => {
- const [isSigningOut, setIsSigningOut] = useState(false);
- const transition = useTransition();
- const [_, setState] = useContext(UserControlContext);
- const { toast } = useToast();
-
- function startSignOut() {
- transition[1](() => {
- setIsSigningOut(true);
- const toasted = toast({
- title: "Logging Out",
- description: "Please wait until server responses",
- status: "loading",
- });
- logOutServerAction().then(() => {
- toasted.update({
- title: "Log Out Success",
- description: "Successfully logged out!",
- status: "success",
- });
- setIsSigningOut(false);
- setState((prev) => ({ ...prev, signIn: false }));
- });
- });
- }
-
- return (
- <PopoverContent anchor={"bottomLeft"}>
- <Button preset={"ghost"}>Dashboard</Button>
- <Button preset={"ghost"} onClick={startSignOut}>
- {isSigningOut ? <MdiLoading className={"animate-spin"} /> : "Sign Out"}
- </Button>
- </PopoverContent>
- );
-};
-
-export const UserControl = () => {
- const [state, setState] = useState<UserControlState>({
- signIn: false,
- });
-
- return (
- <Popover>
- <PopoverTrigger>
- <Button>{state.signIn ? "Log Out" : "Log In"}</Button>
- </PopoverTrigger>
- <UserControlContext.Provider value={[state, setState]}>
- {state.signIn ? <UserControlContent /> : <SignInForm />}
- </UserControlContext.Provider>
- </Popover>
- );
-};
diff --git a/packages/react/src/docs/components/PopoverBlocks/Examples/index.ts b/packages/react/src/docs/components/PopoverBlocks/Examples/index.ts
deleted file mode 100644
index ad9badf..0000000
--- a/packages/react/src/docs/components/PopoverBlocks/Examples/index.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import { ThemeSelector } from "./ThemeSelector";
-import { UserControl } from "./UserControl";
-
-export default {
- ThemeSelector,
- UserControl,
-}
\ No newline at end of file
diff --git a/packages/react/src/docs/components/PopoverBlocks/Preview.tsx b/packages/react/src/docs/components/PopoverBlocks/Preview.tsx
deleted file mode 100644
index 7a1f0ca..0000000
--- a/packages/react/src/docs/components/PopoverBlocks/Preview.tsx
+++ /dev/null
@@ -1,54 +0,0 @@
-import { Button } from "@components/Button";
-import { Popover, PopoverContent, PopoverTrigger } from "@components/Popover";
-
-export function PopoverDemo() {
- return (
- <Popover>
- <PopoverTrigger>
- <Button size="icon">
- <svg
- xmlns="http://www.w3.org/2000/svg"
- width="1.2em"
- height="1.2em"
- viewBox="0 0 24 24"
- >
- <path
- fill="currentColor"
- d="M12 4a4 4 0 0 1 4 4a4 4 0 0 1-4 4a4 4 0 0 1-4-4a4 4 0 0 1 4-4m0 10c4.42 0 8 1.79 8 4v2H4v-2c0-2.21 3.58-4 8-4"
- />
- </svg>
- </Button>
- </PopoverTrigger>
- <PopoverContent>
- <Button preset="ghost" className="gap-2">
- <svg
- xmlns="http://www.w3.org/2000/svg"
- width="1.2em"
- height="1.2em"
- viewBox="0 0 24 24"
- >
- <path
- fill="currentColor"
- d="M3 6h18v2H3zm0 5h18v2H3zm0 5h18v2H3z"
- />
- </svg>
- <span className="flex-grow text-left">Dashboard</span>
- </Button>
- <Button preset="ghost" className="gap-2">
- <svg
- xmlns="http://www.w3.org/2000/svg"
- width="1.2em"
- height="1.2em"
- viewBox="0 0 24 24"
- >
- <path
- fill="currentColor"
- d="m17 7l-1.41 1.41L18.17 11H8v2h10.17l-2.58 2.58L17 17l5-5M4 5h8V3H4c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h8v-2H4z"
- />
- </svg>
- <span className="flex-grow text-left">Log out</span>
- </Button>
- </PopoverContent>
- </Popover>
- );
-}
diff --git a/packages/react/src/docs/components/Switch.mdx b/packages/react/src/docs/components/Switch.mdx
deleted file mode 100644
index e60cf3f..0000000
--- a/packages/react/src/docs/components/Switch.mdx
+++ /dev/null
@@ -1,40 +0,0 @@
-import { TabProvider, TabTrigger, TabContent, TabList } from "@components/Tabs";
-import { Story } from "@/components/Story";
-import { LoadedCode, GITHUB } from "@/components/LoadedCode";
-import { SwitchDemo } from "./SwitchBlocks/Preview";
-
-# Switch
-Toggle between two states with a sleek design. Perfect for enabling/disabling options.
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <SwitchDemo />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/SwitchBlocks/Preview.tsx`} />
- </TabContent>
-</TabProvider>
-
-## Installation
-
-1. Create a new file `Switch.tsx` in your component folder.
-2. Copy and paste the following code into the file.
-
-<LoadedCode from={`${GITHUB}/packages/react/components/Switch.tsx`} />
-
-## Usage
-
-```tsx
-import { Switch } from "@components/Switch";
-```
-
-```html
-<Switch />
-```
-
diff --git a/packages/react/src/docs/components/SwitchBlocks/Preview.tsx b/packages/react/src/docs/components/SwitchBlocks/Preview.tsx
deleted file mode 100644
index ccc389b..0000000
--- a/packages/react/src/docs/components/SwitchBlocks/Preview.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-import { Switch } from "@components/Switch";
-
-export function SwitchDemo() {
- return <Switch />;
-}
diff --git a/packages/react/src/docs/components/Tabs.mdx b/packages/react/src/docs/components/Tabs.mdx
deleted file mode 100644
index 97eb77e..0000000
--- a/packages/react/src/docs/components/Tabs.mdx
+++ /dev/null
@@ -1,79 +0,0 @@
-import { TabProvider, TabTrigger, TabContent, TabList } from "@components/Tabs";
-import { Story } from "@/components/Story";
-import { LoadedCode, GITHUB } from "@/components/LoadedCode";
-import { TabsDemo } from "./TabsBlocks/Preview";
-
-# Tabs
-Organizes content into multiple sections with tabbed navigation.
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered" className="flex-col [&>*]:w-full">
- <TabsDemo />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/TabsBlocks/Preview.tsx`} />
- </TabContent>
-</TabProvider>
-
-## Installation
-
-1. Create a new file `Tabs.tsx` in your component folder.
-2. Copy and paste the following code into the file.
-
-<LoadedCode from={`${GITHUB}/packages/react/components/Tabs.tsx`} />
-
-## Usage
-
-```tsx
-import { TabProvider, TabTrigger, TabContent, TabList } from "@components/Tabs";
-```
-
-```html
-<TabProvider defaultName="tab1">
- <TabList>
- <TabTrigger name="tab1">Tab 1</TabTrigger>
- <TabTrigger name="tab2">Tab 2</TabTrigger>
- </TabList>
- <TabContent name="tab1">
- <div>Tab 1 Content</div>
- </TabContent>
- <TabContent name="tab2">
- <div>Tab 2 Content</div>
- </TabContent>
-</TabProvider>
-```
-
-> Note:
->
-> TabContent requires a element as children.
-> There is no default element in the tab, so you have to provide it.
-
-## Props
-
-### TabProvider
-
-#### Special
-| Name | Type | Default | Description |
-|:--------------|:---------|:-----------------|:---------------------------------------------|
-| `defaultName` | `string` | - (**required**) | The name of the tab to be active by default. |
-
-### TabTrigger
-
-#### Special
-| Name | Type | Default | Description |
-|:----------|:----------|:-----------------|:----------------------------------------------------------|
-| `name` | `string` | - (**required**) | The name of the tab. |
-| `asChild` | `boolean` | `false` | Whether the element is rendered as a child of a component |
-
-### TabContent
-
-#### Special
-| Name | Type | Default | Description |
-|:-------|:---------|:-----------------|:---------------------|
-| `name` | `string` | - (**required**) | The name of the tab. |
diff --git a/packages/react/src/docs/components/TabsBlocks/Preview.tsx b/packages/react/src/docs/components/TabsBlocks/Preview.tsx
deleted file mode 100644
index dc6fc04..0000000
--- a/packages/react/src/docs/components/TabsBlocks/Preview.tsx
+++ /dev/null
@@ -1,18 +0,0 @@
-import { TabProvider, TabTrigger, TabContent, TabList } from "@components/Tabs";
-
-export function TabsDemo() {
- return (
- <TabProvider defaultName="tab1">
- <TabList>
- <TabTrigger name="tab1">Tab 1</TabTrigger>
- <TabTrigger name="tab2">Tab 2</TabTrigger>
- </TabList>
- <TabContent name="tab1">
- <div className="w-full text-center">Tab 1 Content</div>
- </TabContent>
- <TabContent name="tab2">
- <div className="w-full text-center">Tab 2 Content</div>
- </TabContent>
- </TabProvider>
- );
-}
diff --git a/packages/react/src/docs/components/Toast.mdx b/packages/react/src/docs/components/Toast.mdx
deleted file mode 100644
index 1f45981..0000000
--- a/packages/react/src/docs/components/Toast.mdx
+++ /dev/null
@@ -1,182 +0,0 @@
-import { TabProvider, TabTrigger, TabContent, TabList } from "@components/Tabs"
-import { Story } from "@/components/Story";
-import { LoadedCode, GITHUB } from "@/components/LoadedCode";
-import { ToastDemo } from "./ToastBlocks/Preview";
-import Examples from "./ToastBlocks/Examples";
-
-# Toast
-A brief message alert to inform users about events or actions.
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <ToastDemo />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/ToastBlocks/Preview.tsx`} />
- </TabContent>
-</TabProvider>
-
-## Installation
-
-1. Create a new file `Toast.tsx` in your component folder.
-2. Copy and paste the following code into the file.
-
-<LoadedCode from={`${GITHUB}/packages/react/components/Toast.tsx`} />
-
-## Usage
-
-```tsx
-import { Toaster } from "@components/Toast";
-```
-
-```html
-<Toaster />
-```
-
-> Note:
->
-> You can put Toaster in anywhere. It will automatically go to document.body through portal.
-> But, it is recommended to place it at the root of the application, just once.
-
----
-
-```tsx
-import { useToast } from "@components/Toast";
-
-function App() {
- const { toast } = useToast();
- return <button onClick={() => toast("Hello, world!")}>Toast</button>;
-}
-```
-
-## Props
-
-### Toaster
-
-#### Special
-
-| Prop | Type | Default | Description |
-|:----------------|:-----------------------|:---------------------|:--------------------------|
-| `defaultOption` | `Partial<ToastOption>` | `defaultToastOption` | Global options for toast. |
-
-```ts
-interface ToastOption {
- closeButton: boolean;
- closeTimeout: number | null;
-}
-
-const defaultToastOption: ToastOption = {
- closeButton: true,
- closeTimeout: 3000,
-};
-```
-
-## Examples
-
-### Normal
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Normal />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/ToastBlocks/Preview.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Success
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Success />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/ToastBlocks/Preview.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Error
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Error />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/ToastBlocks/Preview.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Warning
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Warning />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/ToastBlocks/Preview.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Pending - Fail
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.PendingFail />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/ToastBlocks/Preview.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Pending - Success
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.PendingSuccess />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/ToastBlocks/Preview.tsx`} />
- </TabContent>
-</TabProvider>
\ No newline at end of file
diff --git a/packages/react/src/docs/components/ToastBlocks/Examples/Error.tsx b/packages/react/src/docs/components/ToastBlocks/Examples/Error.tsx
deleted file mode 100644
index 4781572..0000000
--- a/packages/react/src/docs/components/ToastBlocks/Examples/Error.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { Button } from "@components/Button";
-import { Toaster, useToast } from "@components/Toast";
-
-function Children() {
- const { toast } = useToast();
-
- return (
- <Button
- onClick={() =>
- toast({
- title: "Toast Title",
- description: "Toast Description",
- status: "error",
- })
- }
- >
- Toast
- </Button>
- );
-}
-
-export function Error() {
- return (
- <>
- <Toaster />
- <Children />
- </>
- );
-}
diff --git a/packages/react/src/docs/components/ToastBlocks/Examples/Normal.tsx b/packages/react/src/docs/components/ToastBlocks/Examples/Normal.tsx
deleted file mode 100644
index 688140c..0000000
--- a/packages/react/src/docs/components/ToastBlocks/Examples/Normal.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { Button } from "@components/Button";
-import { Toaster, useToast } from "@components/Toast";
-
-function Children() {
- const { toast } = useToast();
-
- return (
- <Button
- onClick={() =>
- toast({
- title: "Toast Title",
- description: "Toast Description",
- status: "default",
- })
- }
- >
- Toast
- </Button>
- );
-}
-
-export function Normal() {
- return (
- <>
- <Toaster />
- <Children />
- </>
- );
-}
diff --git a/packages/react/src/docs/components/ToastBlocks/Examples/PendingFail.tsx b/packages/react/src/docs/components/ToastBlocks/Examples/PendingFail.tsx
deleted file mode 100644
index 856b11a..0000000
--- a/packages/react/src/docs/components/ToastBlocks/Examples/PendingFail.tsx
+++ /dev/null
@@ -1,35 +0,0 @@
-import { Button } from "@components/Button";
-import { Toaster, useToast } from "@components/Toast";
-
-function Children() {
- const { toast } = useToast();
-
- return (
- <Button
- onClick={async () => {
- const toasted = toast({
- title: "Waiting...",
- description: "Waiting for result...",
- status: "loading",
- });
- await new Promise((r) => setTimeout(r, 1000));
- toasted.update({
- title: "Promise Failed",
- description: "Something went wrong!",
- status: "error",
- });
- }}
- >
- Toast
- </Button>
- );
-}
-
-export function PendingFail() {
- return (
- <>
- <Toaster />
- <Children />
- </>
- );
-}
diff --git a/packages/react/src/docs/components/ToastBlocks/Examples/PendingSuccess.tsx b/packages/react/src/docs/components/ToastBlocks/Examples/PendingSuccess.tsx
deleted file mode 100644
index 55eb23c..0000000
--- a/packages/react/src/docs/components/ToastBlocks/Examples/PendingSuccess.tsx
+++ /dev/null
@@ -1,37 +0,0 @@
-import { Button } from "@components/Button";
-import { Toaster, useToast } from "@components/Toast";
-
-function Children() {
- const { toast } = useToast();
-
- return (
- <Button
- onClick={async () => {
- const toasted = toast({
- title: "Waiting...",
- description: "Waiting for result...",
- status: "loading",
- });
-
- await new Promise((r) => setTimeout(r, 1000));
-
- toasted.update({
- title: "Promise Success",
- description: "Promise resolved!",
- status: "success",
- });
- }}
- >
- Toast
- </Button>
- );
-}
-
-export function PendingSuccess() {
- return (
- <>
- <Toaster />
- <Children />
- </>
- );
-}
diff --git a/packages/react/src/docs/components/ToastBlocks/Examples/Success.tsx b/packages/react/src/docs/components/ToastBlocks/Examples/Success.tsx
deleted file mode 100644
index 4b93466..0000000
--- a/packages/react/src/docs/components/ToastBlocks/Examples/Success.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { Button } from "@components/Button";
-import { Toaster, useToast } from "@components/Toast";
-
-function Children() {
- const { toast } = useToast();
-
- return (
- <Button
- onClick={() =>
- toast({
- title: "Toast Title",
- description: "Toast Description",
- status: "success",
- })
- }
- >
- Toast
- </Button>
- );
-}
-
-export function Success() {
- return (
- <>
- <Toaster />
- <Children />
- </>
- );
-}
diff --git a/packages/react/src/docs/components/ToastBlocks/Examples/Warning.tsx b/packages/react/src/docs/components/ToastBlocks/Examples/Warning.tsx
deleted file mode 100644
index 0facd76..0000000
--- a/packages/react/src/docs/components/ToastBlocks/Examples/Warning.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { Button } from "@components/Button";
-import { Toaster, useToast } from "@components/Toast";
-
-function Children() {
- const { toast } = useToast();
-
- return (
- <Button
- onClick={() =>
- toast({
- title: "Toast Title",
- description: "Toast Description",
- status: "warning",
- })
- }
- >
- Toast
- </Button>
- );
-}
-
-export function Warning() {
- return (
- <>
- <Toaster />
- <Children />
- </>
- );
-}
diff --git a/packages/react/src/docs/components/ToastBlocks/Examples/index.ts b/packages/react/src/docs/components/ToastBlocks/Examples/index.ts
deleted file mode 100644
index ae1401c..0000000
--- a/packages/react/src/docs/components/ToastBlocks/Examples/index.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-import { Error } from "./Error";
-import { Normal } from "./Normal";
-import { PendingFail } from "./PendingFail";
-import { PendingSuccess } from "./PendingSuccess";
-import { Success } from "./Success";
-import { Warning } from "./Warning";
-
-export default {
- Error,
- Normal,
- PendingFail,
- PendingSuccess,
- Success,
- Warning,
-};
-
diff --git a/packages/react/src/docs/components/ToastBlocks/Preview.tsx b/packages/react/src/docs/components/ToastBlocks/Preview.tsx
deleted file mode 100644
index f1b05b5..0000000
--- a/packages/react/src/docs/components/ToastBlocks/Preview.tsx
+++ /dev/null
@@ -1,25 +0,0 @@
-import { Button } from "@components/Button";
-import { Toaster, useToast } from "@components/Toast";
-
-function Children() {
- const { toast } = useToast();
-
- return (
- <Button
- onClick={() =>
- toast({ title: "Toast Title", description: "Toast Description" })
- }
- >
- Toast
- </Button>
- );
-}
-
-export function ToastDemo() {
- return (
- <>
- <Toaster />
- <Children />
- </>
- );
-}
diff --git a/packages/react/src/docs/components/Tooltip.mdx b/packages/react/src/docs/components/Tooltip.mdx
deleted file mode 100644
index 6df9b91..0000000
--- a/packages/react/src/docs/components/Tooltip.mdx
+++ /dev/null
@@ -1,206 +0,0 @@
-import { TabProvider, TabTrigger, TabContent, TabList } from "@components/Tabs";
-import { Story } from "@/components/Story";
-import { LoadedCode, GITHUB } from "@/components/LoadedCode";
-import { TooltipDemo } from "./TooltipBlocks/Preview";
-import Examples from "./TooltipBlocks/Examples";
-
-# Tooltip
-A brief helper for providing contextual information or guiding user interactions.
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <TooltipDemo />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/TooltipBlocks/Preview.tsx`} />
- </TabContent>
-</TabProvider>
-
-## Installation
-
-1. Create a new file `Tooltip.tsx` in your component folder.
-2. Copy and paste the following code into the file.
-
-<LoadedCode from={`${GITHUB}/packages/react/components/Tooltip.tsx`} />
-
-## Usage
-
-```tsx
-import { Tooltip, TooltipContent } from "@components/Tooltip";
-```
-
-```html
-<Tooltip>
- <TooltipContent>
- {/* Tooltip Content */}
- </TooltipContent>
- {/* Tooltip Trigger */}
-</Tooltip>
-```
-
-## Props
-
-### Tooltip
-
-#### Variants
-
-| Prop | Type | Default | Description |
-|:-------------|:-----------------------------------------|:--------|:----------------------------------------|
-| `position` | `"bottom" \| "left" \| "right" \| "top"` | `"top"` | The position of the tooltip. |
-| `controlled` | `boolean` | `false` | Blocks tooltip triggered by hover state |
-| `opened` | `boolean` | `false` | Forces to be opened |
-
-### TooltipContent
-
-#### Variants
-
-| Prop | Type | Default | Description |
-|:---------|:------------------------------------------------|:-----------|:---------------------------------------------------|
-| `offset` | `"sm" \| "md" \| "lg"` | `"md"` | Gap between the tooltip and the trigger. |
-| `delay` | `"none" \| "early" \| "normal" \| "late"` | `"normal"` | The time between hover start and appear of tooltip |
-| `status` | `"normal" \| "error" \| "success" \| "warning"` | `"normal"` | Color of tooltip |
-
-## Examples
-
-
-### Top
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Top />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/TooltipBlocks/Examples/Top.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Bottom
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Bottom />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/TooltipBlocks/Examples/Bottom.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Left
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Left />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/TooltipBlocks/Examples/Left.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Right
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name="preview">Preview</TabTrigger>
- <TabTrigger name="code">Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.Right />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/TooltipBlocks/Examples/Right.tsx`} />
- </TabContent>
-</TabProvider>
-
-### No Delay
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name={"preview"}>Preview</TabTrigger>
- <TabTrigger name={"code"}>Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.NoDelay />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/TooltipBlocks/Examples/NoDelay.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Early Delay
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name={"preview"}>Preview</TabTrigger>
- <TabTrigger name={"code"}>Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.EarlyDelay />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/TooltipBlocks/Examples/EarlyDelay.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Late Delay
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name={"preview"}>Preview</TabTrigger>
- <TabTrigger name={"code"}>Code</TabTrigger>
- </TabList>
- <TabContent name="preview">
- <Story layout="centered">
- <Examples.LateDelay />
- </Story>
- </TabContent>
- <TabContent name="code">
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/TooltipBlocks/Examples/LateDelay.tsx`} />
- </TabContent>
-</TabProvider>
-
-### Controlled
-
-<TabProvider defaultName="preview">
- <TabList>
- <TabTrigger name={"preview"}>Preview</TabTrigger>
- <TabTrigger name={"code"}>Code</TabTrigger>
- </TabList>
- <TabContent name={"preview"}>
- <Story layout={"centered"}>
- <Examples.Controlled />
- </Story>
- </TabContent>
- <TabContent name={"code"}>
- <LoadedCode from={`${GITHUB}/packages/react/src/docs/components/TooltipBlocks/Examples/Controlled.tsx`} />
- </TabContent>
-</TabProvider>
\ No newline at end of file
diff --git a/packages/react/src/docs/components/TooltipBlocks/Examples/Bottom.tsx b/packages/react/src/docs/components/TooltipBlocks/Examples/Bottom.tsx
deleted file mode 100644
index b4f15f2..0000000
--- a/packages/react/src/docs/components/TooltipBlocks/Examples/Bottom.tsx
+++ /dev/null
@@ -1,13 +0,0 @@
-import { Button } from "@components/Button";
-import { Tooltip, TooltipContent } from "@components/Tooltip";
-
-export function Bottom() {
- return (
- <Tooltip position="bottom">
- <TooltipContent>
- <p>Tooltip!</p>
- </TooltipContent>
- <Button>Hover me</Button>
- </Tooltip>
- );
-}
diff --git a/packages/react/src/docs/components/TooltipBlocks/Examples/Controlled.tsx b/packages/react/src/docs/components/TooltipBlocks/Examples/Controlled.tsx
deleted file mode 100644
index a9b72ce..0000000
--- a/packages/react/src/docs/components/TooltipBlocks/Examples/Controlled.tsx
+++ /dev/null
@@ -1,16 +0,0 @@
-import { Button } from "@components/Button";
-import { Tooltip, TooltipContent } from "@components/Tooltip";
-import { useState } from "react";
-
-export function Controlled() {
- const [opened, setOpened] = useState(false);
-
- return (
- <Tooltip position="top" controlled opened={opened}>
- <TooltipContent delay={"early"}>
- <p>Tooltip!</p>
- </TooltipContent>
- <Button onClick={() => setOpened((p) => !p)}>Open hover</Button>
- </Tooltip>
- );
-}
diff --git a/packages/react/src/docs/components/TooltipBlocks/Examples/EarlyDelay.tsx b/packages/react/src/docs/components/TooltipBlocks/Examples/EarlyDelay.tsx
deleted file mode 100644
index 07b0e5e..0000000
--- a/packages/react/src/docs/components/TooltipBlocks/Examples/EarlyDelay.tsx
+++ /dev/null
@@ -1,13 +0,0 @@
-import { Button } from "@components/Button";
-import { Tooltip, TooltipContent } from "@components/Tooltip";
-
-export function EarlyDelay() {
- return (
- <Tooltip position="bottom">
- <TooltipContent delay={"early"}>
- <p>Tooltip!</p>
- </TooltipContent>
- <Button>Hover me</Button>
- </Tooltip>
- );
-}
diff --git a/packages/react/src/docs/components/TooltipBlocks/Examples/LateDelay.tsx b/packages/react/src/docs/components/TooltipBlocks/Examples/LateDelay.tsx
deleted file mode 100644
index 180237d..0000000
--- a/packages/react/src/docs/components/TooltipBlocks/Examples/LateDelay.tsx
+++ /dev/null
@@ -1,13 +0,0 @@
-import { Button } from "@components/Button";
-import { Tooltip, TooltipContent } from "@components/Tooltip";
-
-export function LateDelay() {
- return (
- <Tooltip position="bottom">
- <TooltipContent delay={"late"}>
- <p>Tooltip!</p>
- </TooltipContent>
- <Button>Hover me</Button>
- </Tooltip>
- );
-}
diff --git a/packages/react/src/docs/components/TooltipBlocks/Examples/Left.tsx b/packages/react/src/docs/components/TooltipBlocks/Examples/Left.tsx
deleted file mode 100644
index afe3b88..0000000
--- a/packages/react/src/docs/components/TooltipBlocks/Examples/Left.tsx
+++ /dev/null
@@ -1,13 +0,0 @@
-import { Button } from "@components/Button";
-import { Tooltip, TooltipContent } from "@components/Tooltip";
-
-export function Left() {
- return (
- <Tooltip position="left">
- <TooltipContent>
- <p>Tooltip!</p>
- </TooltipContent>
- <Button>Hover me</Button>
- </Tooltip>
- );
-}
diff --git a/packages/react/src/docs/components/TooltipBlocks/Examples/NoDelay.tsx b/packages/react/src/docs/components/TooltipBlocks/Examples/NoDelay.tsx
deleted file mode 100644
index 9295399..0000000
--- a/packages/react/src/docs/components/TooltipBlocks/Examples/NoDelay.tsx
+++ /dev/null
@@ -1,13 +0,0 @@
-import { Button } from "@components/Button";
-import { Tooltip, TooltipContent } from "@components/Tooltip";
-
-export function NoDelay() {
- return (
- <Tooltip position="bottom">
- <TooltipContent delay={"none"}>
- <p>Tooltip!</p>
- </TooltipContent>
- <Button>Hover me</Button>
- </Tooltip>
- );
-}
diff --git a/packages/react/src/docs/components/TooltipBlocks/Examples/Right.tsx b/packages/react/src/docs/components/TooltipBlocks/Examples/Right.tsx
deleted file mode 100644
index c2b4bf7..0000000
--- a/packages/react/src/docs/components/TooltipBlocks/Examples/Right.tsx
+++ /dev/null
@@ -1,13 +0,0 @@
-import { Button } from "@components/Button";
-import { Tooltip, TooltipContent } from "@components/Tooltip";
-
-export function Right() {
- return (
- <Tooltip position="right">
- <TooltipContent>
- <p>Tooltip!</p>
- </TooltipContent>
- <Button>Hover me</Button>
- </Tooltip>
- );
-}
diff --git a/packages/react/src/docs/components/TooltipBlocks/Examples/Top.tsx b/packages/react/src/docs/components/TooltipBlocks/Examples/Top.tsx
deleted file mode 100644
index a8388b9..0000000
--- a/packages/react/src/docs/components/TooltipBlocks/Examples/Top.tsx
+++ /dev/null
@@ -1,13 +0,0 @@
-import { Button } from "@components/Button";
-import { Tooltip, TooltipContent } from "@components/Tooltip";
-
-export function Top() {
- return (
- <Tooltip position="top">
- <TooltipContent>
- <p>Tooltip!</p>
- </TooltipContent>
- <Button>Hover me</Button>
- </Tooltip>
- );
-}
diff --git a/packages/react/src/docs/components/TooltipBlocks/Examples/index.ts b/packages/react/src/docs/components/TooltipBlocks/Examples/index.ts
deleted file mode 100644
index 239edf9..0000000
--- a/packages/react/src/docs/components/TooltipBlocks/Examples/index.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-import { Bottom } from "./Bottom";
-import { Left } from "./Left";
-import { Right } from "./Right";
-import { Top } from "./Top";
-import { NoDelay } from "./NoDelay";
-import { EarlyDelay } from "./EarlyDelay";
-import { LateDelay } from "./LateDelay";
-import { Controlled } from "./Controlled";
-
-export default {
- Bottom,
- Left,
- Right,
- Top,
- NoDelay,
- EarlyDelay,
- LateDelay,
- Controlled,
-};
diff --git a/packages/react/src/docs/components/TooltipBlocks/Preview.tsx b/packages/react/src/docs/components/TooltipBlocks/Preview.tsx
deleted file mode 100644
index 0c7aa29..0000000
--- a/packages/react/src/docs/components/TooltipBlocks/Preview.tsx
+++ /dev/null
@@ -1,13 +0,0 @@
-import { Button } from "@components/Button";
-import { Tooltip, TooltipContent } from "@components/Tooltip";
-
-export function TooltipDemo() {
- return (
- <Tooltip>
- <TooltipContent>
- <p>Tooltip!</p>
- </TooltipContent>
- <Button>Hover me</Button>
- </Tooltip>
- );
-}
diff --git a/packages/react/src/docs/configuration.mdx b/packages/react/src/docs/configuration.mdx
deleted file mode 100644
index 3b76791..0000000
--- a/packages/react/src/docs/configuration.mdx
+++ /dev/null
@@ -1,64 +0,0 @@
-# Configuration
-
-## Library File
-
-Library file is a shared utility container every component uses.
-You can put it anywhere as long as you properly update import path.
-
-PSW/UI manages its import path using tsconfig path.
-
-If you want to follow our rule, you can add a path to your `tsconfig.json`.
-```json
-{
- "compilerOptions": {
- "paths": {
- "@pswui-lib": ["./pswui/lib.tsx"]
- }
- }
-}
-```
-
-## CLI
-
-You can use configuration file to change things of CLI.
-
-Default config file name is `pswui.config.js`.
-
-Here is our config structure:
-```typescript
-export interface Config {
- /**
- * Path that cli will create a file.
- */
- paths?: {
- components?: 'src/pswui/components' | string
- lib?: 'src/pswui/lib.tsx' | string
- }
- /**
- * Absolute path that will used for import in component
- */
- import?: {
- lib?: '@pswui-lib' | string
- }
-}
-```
-
-You can import `Config` type or `buildConfig` function to use typescript intellisense.
-
-```ts
-import { Config } from "@psw-ui/cli"
-
-const config: Config = {
- /* ... */
-}
-
-export default config;
-```
-
-```ts
-import { buildConfig } from "@psw-ui/cli"
-
-export default buildConfig({
- /* ... */
-})
-```
\ No newline at end of file
diff --git a/packages/react/src/docs/installation.mdx b/packages/react/src/docs/installation.mdx
deleted file mode 100644
index 205694e..0000000
--- a/packages/react/src/docs/installation.mdx
+++ /dev/null
@@ -1,36 +0,0 @@
-import {TabProvider, TabContent, TabList, TabTrigger} from "@components/Tabs";
-import {Code} from "@/components/LoadedCode";
-
-# Installation
-
-<TabProvider defaultName="cli">
- <TabList>
- <TabTrigger name="cli">Using CLI</TabTrigger>
- <TabTrigger name="manual">Manual Install</TabTrigger>
- </TabList>
- <TabContent name="cli">
- 1. Install [TailwindCSS](https://tailwindcss.com/docs/installation) and [tailwind-merge](https://github.com/dhiwise/tailwind-merge) and configure it yourself.
- 2. Add import alias for `@pswui-lib` in your `tsconfig.json` file.
- <Code language={"json"}>
- {`{\n "compilerOptions": {\n "paths": {\n "@pswui-lib": ["./pswui/lib.tsx"]\n }\n }\n}`}
- </Code>
- 3. Install [@psw-ui/cli](https://www.npmjs.com/package/@psw-ui/cli).
- <Code language={"plaintext"}>
- {`$ npm install -D \@psw-ui/cli\n$ yarn add -D @psw-ui/cli\n$ pnpm add -D @psw-ui/cli`}
- </Code>
- 4. Run CLI to add components
- <Code language={"plaintext"}>
- {`$ npx pswui add <component>\n$ yarn pswui add <component>\n$ pnpm pswui add <component>`}
- </Code>
- 5. Import component, and use it.
- </TabContent>
- <TabContent name="manual">
- 1. Install [TailwindCSS](https://tailwindcss.com/docs/installation) and [tailwind-merge](https://github.com/dhiwise/tailwind-merge) and configure it yourself.
- 2. Add import alias for `@pswui-lib` in your `tsconfig.json` file.
- <Code language={"json"}>
- {`{\n "compilerOptions": {\n "paths": {\n "@pswui-lib": ["<your library file>"]\n }\n }\n}`}
- </Code>
- 3. Grab the library file from [here](https://raw.githubusercontent.com/pswui/ui/main/packages/react/lib.tsx) and put it in the library file path in the tsconfig.
- 4. Now you can copy & paste your component in your project.
- </TabContent>
-</TabProvider>
diff --git a/packages/react/src/docs/introduction.mdx b/packages/react/src/docs/introduction.mdx
deleted file mode 100644
index 09dccc9..0000000
--- a/packages/react/src/docs/introduction.mdx
+++ /dev/null
@@ -1,41 +0,0 @@
-# Introduction
-
-> Beautifully designed, easily copy & pastable, fully customizable - that means it only depends on few dependencies.
-
-This is **UI kit**, a collection of re-usable components that you can copy and paste into your apps.
-This UI kit is inspired by [shadcn/ui](https://ui.shadcn.com/) - but it is more customizable.
-
-**More customizable?**
-
-shadcn/ui depends on a lot of packages to provide functionality to its components.
-Radix UI, React DayPicker, Embla Carousel...
-
-I'm not saying it's a bad thing.
-
-But when you depends on a lot of package - you easily mess up your package.json, and you can't even edit a single feature.
-The only thing you can customize is **style**.
-
-If there's a bug that needs to be fixed quickly, or a feature that doesn't work the way you want it to,
-you'll want to tweak it to your liking. This is where relying on a lot of packages can be poison.
-
-PSW/UI solves this - by **NOT** depending on any other packages than framework like React, TailwindCSS, and tailwind-merge.
-
-You can just copy it, and all functionality is contained in a single file.
-
-# Roadmap
-
-First of all, this project is alpha.
-
-You can see a lot of components are missing, and some component is buggy.
-
-I'm working with this priority:
-
-1. Adding new component, with stable features.
-2. Fixing bugs with existing components.
-3. Make it looks nice.
-
-Also, there is a [Github README](https://github.com/p-sw/ui) for component implementation plans.
-
-You can see what component is implemented, or planned to be implemented.
-
-If you have any ideas or suggestions, please let me know in [Github Issues](https://github.com/p-sw/ui/issues).
diff --git a/packages/react/src/errors/PageNotFound.tsx b/packages/react/src/errors/PageNotFound.tsx
deleted file mode 100644
index bc37876..0000000
--- a/packages/react/src/errors/PageNotFound.tsx
+++ /dev/null
@@ -1,22 +0,0 @@
-import { Link } from "react-router-dom";
-import { Button } from "../../components/Button";
-
-function PageNotFound() {
- return (
- <main className="flex-grow h-full flex flex-col justify-center items-center gap-8">
- <section className="flex flex-col justify-center items-center text-center gap-2">
- <h1 className="text-4xl font-bold">Page not found</h1>
- <p className="text-base">
- The page you are looking for does not exist.
- </p>
- </section>
- <section className="flex flex-row justify-center items-center text-center gap-2">
- <Button asChild preset="default">
- <Link to="/">Go home</Link>
- </Button>
- </section>
- </main>
- );
-}
-
-export default PageNotFound;
diff --git a/packages/react/src/errors/Unexpected.tsx b/packages/react/src/errors/Unexpected.tsx
deleted file mode 100644
index 930785f..0000000
--- a/packages/react/src/errors/Unexpected.tsx
+++ /dev/null
@@ -1,22 +0,0 @@
-import { Link } from "react-router-dom";
-import { Button } from "../../components/Button";
-
-function UnexpectedError() {
- return (
- <main className="flex-grow h-full flex flex-col justify-center items-center gap-8">
- <section className="flex flex-col justify-center items-center text-center gap-2">
- <h1 className="text-4xl font-bold">Something went wrong</h1>
- <p className="text-base">
- There was an unexpected error while loading the page.
- </p>
- </section>
- <section className="flex flex-row justify-center items-center text-center gap-2">
- <Button asChild preset="default">
- <Link to="/">Go home</Link>
- </Button>
- </section>
- </main>
- );
-}
-
-export default UnexpectedError;
diff --git a/packages/react/src/mdx.d.ts b/packages/react/src/mdx.d.ts
deleted file mode 100644
index 1b6ccf4..0000000
--- a/packages/react/src/mdx.d.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-declare module '*.mdx' {
- import type { MDXProps } from 'mdx/types'
- import type { Toc } from '@stefanprobst/rehype-extract-toc'
-
- export const tableOfContents: Toc
- export default function MDXContent(props: MDXProps): JSX.Element
-}
\ No newline at end of file
diff --git a/packages/react/src/vite-env.d.ts b/packages/react/src/vite-env.d.ts
deleted file mode 100644
index 14bb4ac..0000000
--- a/packages/react/src/vite-env.d.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-/// <reference types="vite/client" />
-import { ImportGlobFunction } from "vite/types/importGlob";
-
-interface ImportMeta {
- glob: ImportGlobFunction;
-}
\ No newline at end of file