@kimdw-rtk/ui 0.1.7 → 0.1.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (132) hide show
  1. package/dist/components/Accordion/Accordion.cjs +17 -0
  2. package/dist/components/Accordion/Accordion.css.vanilla.cjs +11 -0
  3. package/dist/components/Accordion/AccordionContent.cjs +61 -0
  4. package/dist/components/Accordion/AccordionContent.css.vanilla.cjs +14 -0
  5. package/dist/components/Accordion/AccordionContext.cjs +11 -0
  6. package/dist/components/Accordion/AccordionTrigger.cjs +19 -0
  7. package/dist/components/Accordion/AccordionTrigger.css.vanilla.cjs +14 -0
  8. package/dist/components/Alert/index.cjs +17 -0
  9. package/dist/components/Box/Box.css.vanilla.cjs +11 -0
  10. package/dist/components/Box/index.cjs +16 -0
  11. package/dist/components/Button/Button.css.vanilla.cjs +15 -0
  12. package/dist/components/Button/index.cjs +26 -0
  13. package/dist/components/Card/Card.cjs +15 -0
  14. package/dist/components/Card/Card.css.vanilla.cjs +14 -0
  15. package/dist/components/Card/CardContent.cjs +14 -0
  16. package/dist/components/Card/CardContent.css.vanilla.cjs +12 -0
  17. package/dist/components/Card/CardHeader.cjs +14 -0
  18. package/dist/components/Card/CardHeader.css.vanilla.cjs +12 -0
  19. package/dist/components/Card/CardInteraction.cjs +18 -0
  20. package/dist/components/Card/CardInteraction.css.vanilla.cjs +10 -0
  21. package/dist/components/Card/CardThumbnail.cjs +14 -0
  22. package/dist/components/Card/CardThumbnail.css.vanilla.cjs +10 -0
  23. package/dist/components/Chip/Chip.cjs +15 -0
  24. package/dist/components/Chip/Chip.css.vanilla.cjs +11 -0
  25. package/dist/components/Confirm/index.cjs +22 -0
  26. package/dist/components/Container/Container.css.vanilla.cjs +11 -0
  27. package/dist/components/Container/index.cjs +16 -0
  28. package/dist/components/Dialog/Dialog.cjs +15 -0
  29. package/dist/components/Dialog/Dialog.css.vanilla.cjs +7 -0
  30. package/dist/components/Dialog/DialogContent.cjs +15 -0
  31. package/dist/components/Dialog/DialogContent.css.vanilla.cjs +11 -0
  32. package/dist/components/Dialog/DialogFooter.cjs +14 -0
  33. package/dist/components/Dialog/DialogHeader.cjs +16 -0
  34. package/dist/components/Dialog/DialogHeader.css.vanilla.cjs +12 -0
  35. package/dist/components/Flex/Flex.css.vanilla.cjs +10 -0
  36. package/dist/components/Flex/index.cjs +16 -0
  37. package/dist/components/Navigation/NavigationAside.cjs +15 -0
  38. package/dist/components/Navigation/NavigationAside.css.vanilla.cjs +10 -0
  39. package/dist/components/Navigation/NavigationBar.cjs +18 -0
  40. package/dist/components/Navigation/NavigationBar.css.vanilla.cjs +13 -0
  41. package/dist/components/Navigation/NavigationContainer.cjs +15 -0
  42. package/dist/components/Navigation/NavigationContainer.css.vanilla.cjs +7 -0
  43. package/dist/components/Navigation/NavigationDrawer.cjs +30 -0
  44. package/dist/components/Navigation/NavigationDrawer.css.vanilla.cjs +16 -0
  45. package/dist/components/Navigation/NavigationItem.cjs +14 -0
  46. package/dist/components/Navigation/NavigationItem.css.vanilla.cjs +13 -0
  47. package/dist/components/Navigation/NavigationLogo.cjs +14 -0
  48. package/dist/components/Navigation/NavigationLogo.css.vanilla.cjs +10 -0
  49. package/dist/components/Navigation/NavigationMenu.cjs +15 -0
  50. package/dist/components/Navigation/NavigationMenu.css.vanilla.cjs +12 -0
  51. package/dist/components/Portal/index.cjs +12 -0
  52. package/dist/components/Range/Range.cjs +42 -0
  53. package/dist/components/Range/Range.css.vanilla.cjs +17 -0
  54. package/dist/components/ScrollArea/ScrollArea.cjs +39 -0
  55. package/dist/components/ScrollArea/ScrollArea.css.vanilla.cjs +18 -0
  56. package/dist/components/Select/Select.cjs +51 -0
  57. package/dist/components/Select/Select.css.vanilla.cjs +11 -0
  58. package/dist/components/Select/SelectContext.cjs +36 -0
  59. package/dist/components/Select/SelectOption.cjs +28 -0
  60. package/dist/components/Select/SelectOption.css.vanilla.cjs +10 -0
  61. package/dist/components/Select/SelectOptionList.cjs +39 -0
  62. package/dist/components/Select/SelectOptionList.css.vanilla.cjs +11 -0
  63. package/dist/components/Select/SelectTrigger.cjs +25 -0
  64. package/dist/components/Select/SelectTrigger.css.vanilla.cjs +12 -0
  65. package/dist/components/Separator/index.cjs +11 -0
  66. package/dist/components/Skeleton/Skeleton.css.vanilla.cjs +10 -0
  67. package/dist/components/Skeleton/index.cjs +14 -0
  68. package/dist/components/Table/Table.cjs +15 -0
  69. package/dist/components/Table/Table.css.vanilla.cjs +15 -0
  70. package/dist/components/Table/TableBody.cjs +11 -0
  71. package/dist/components/Table/TableCell.cjs +12 -0
  72. package/dist/components/Table/TableCell.css.vanilla.cjs +12 -0
  73. package/dist/components/Table/TableHead.cjs +12 -0
  74. package/dist/components/Table/TableHead.css.vanilla.cjs +10 -0
  75. package/dist/components/Table/TableHeader.cjs +11 -0
  76. package/dist/components/Table/TableRow.cjs +12 -0
  77. package/dist/components/Table/TableRow.css.vanilla.cjs +10 -0
  78. package/dist/components/Tabs/Tabs.cjs +16 -0
  79. package/dist/components/Tabs/TabsContent.cjs +22 -0
  80. package/dist/components/Tabs/TabsList.cjs +14 -0
  81. package/dist/components/Tabs/TabsList.css.vanilla.cjs +10 -0
  82. package/dist/components/Tabs/TabsProvider.cjs +12 -0
  83. package/dist/components/Tabs/TabsTrigger.cjs +24 -0
  84. package/dist/components/Tabs/TabsTrigger.css.vanilla.cjs +11 -0
  85. package/dist/components/TextField/TextField.css.vanilla.cjs +11 -0
  86. package/dist/components/TextField/index.cjs +15 -0
  87. package/dist/components/Toast/Toast.css.vanilla.cjs +13 -0
  88. package/dist/components/Toast/index.cjs +18 -0
  89. package/dist/components/Tooltip/Tooltip.css.vanilla.cjs +11 -0
  90. package/dist/components/Tooltip/index.cjs +31 -0
  91. package/dist/components/Typography/Typography.css.vanilla.cjs +11 -0
  92. package/dist/components/Typography/index.cjs +25 -0
  93. package/dist/contexts/UIProvider.cjs +15 -0
  94. package/dist/hooks/useContainer/ContainerProvider.cjs +13 -0
  95. package/dist/hooks/useContainer/index.cjs +12 -0
  96. package/dist/hooks/useDialog/index.cjs +34 -0
  97. package/dist/hooks/useMouseScroll/index.cjs +52 -0
  98. package/dist/hooks/usePointerSlider/index.cjs +49 -0
  99. package/dist/hooks/useRipple/index.cjs +116 -0
  100. package/dist/hooks/useRipple/ripple.css.vanilla.cjs +10 -0
  101. package/dist/hooks/useToast/ToastContainer.cjs +10 -0
  102. package/dist/hooks/useToast/ToastContainer.css.vanilla.cjs +7 -0
  103. package/dist/hooks/useToast/ToastProvider.cjs +54 -0
  104. package/dist/hooks/useToast/index.cjs +16 -0
  105. package/dist/index.cjs +176 -0
  106. package/dist/node_modules/.pnpm/@vanilla-extract_recipes@0.5.7_@vanilla-extract_css@1.17.4_babel-plugin-macros@3.1.0_/node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.cjs +114 -0
  107. package/dist/node_modules/.pnpm/@vanilla-extract_sprinkles@1.6.5_@vanilla-extract_css@1.17.4_babel-plugin-macros@3.1.0_/node_modules/@vanilla-extract/sprinkles/createRuntimeSprinkles/dist/vanilla-extract-sprinkles-createRuntimeSprinkles.esm.cjs +11 -0
  108. package/dist/node_modules/.pnpm/@vanilla-extract_sprinkles@1.6.5_@vanilla-extract_css@1.17.4_babel-plugin-macros@3.1.0_/node_modules/@vanilla-extract/sprinkles/dist/createSprinkles-74286718.esm.cjs +192 -0
  109. package/dist/node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.cjs +8 -0
  110. package/dist/node_modules/.pnpm/lucide-react@0.503.0_react@18.3.1/node_modules/lucide-react/dist/esm/Icon.cjs +49 -0
  111. package/dist/node_modules/.pnpm/lucide-react@0.503.0_react@18.3.1/node_modules/lucide-react/dist/esm/createLucideIcon.cjs +34 -0
  112. package/dist/node_modules/.pnpm/lucide-react@0.503.0_react@18.3.1/node_modules/lucide-react/dist/esm/defaultAttributes.cjs +24 -0
  113. package/dist/node_modules/.pnpm/lucide-react@0.503.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/align-justify.cjs +23 -0
  114. package/dist/node_modules/.pnpm/lucide-react@0.503.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/chevron-down.cjs +19 -0
  115. package/dist/node_modules/.pnpm/lucide-react@0.503.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/x.cjs +22 -0
  116. package/dist/node_modules/.pnpm/lucide-react@0.503.0_react@18.3.1/node_modules/lucide-react/dist/esm/shared/src/utils.cjs +34 -0
  117. package/dist/styles/layers.css.vanilla.cjs +9 -0
  118. package/dist/styles/overlay.css.vanilla.cjs +11 -0
  119. package/dist/styles/sprinkles.css.vanilla.cjs +22 -0
  120. package/dist/styles/sx.cjs +15 -0
  121. package/dist/themes/darkTheme.css.vanilla.cjs +5 -0
  122. package/dist/themes/lightTheme.css.vanilla.cjs +5 -0
  123. package/dist/themes/theme.css.vanilla.cjs +5 -0
  124. package/dist/tokens/index.cjs +18 -0
  125. package/dist/tokens/scale/color.cjs +581 -0
  126. package/dist/tokens/semantic/breakpoint.cjs +10 -0
  127. package/dist/tokens/semantic/color.cjs +14 -0
  128. package/dist/tokens/semantic/spacing.cjs +15 -0
  129. package/dist/tokens/semantic/typography.cjs +36 -0
  130. package/dist/tokens/semantic/width.cjs +9 -0
  131. package/dist/utils/sprinklesUtils.cjs +25 -0
  132. package/package.json +9 -6
@@ -0,0 +1,10 @@
1
+ 'use strict';
2
+
3
+ require('./../../styles/layers.css.ts.vanilla.css');
4
+ require('./../../styles/sprinkles.css.ts.vanilla.css');
5
+ require('./../../styles/globalStyle.css.ts.vanilla.css');
6
+ require('./Skeleton.css.ts.vanilla.css');
7
+
8
+ var skeleton = 'Skeleton_styleWithLayer__a0ivc31';
9
+
10
+ exports.skeleton = skeleton;
@@ -0,0 +1,14 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var react = require('react');
5
+ var clsx = require('../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.cjs');
6
+ var Skeleton_css = require('./Skeleton.css.vanilla.cjs');
7
+ var sx = require('../../styles/sx.cjs');
8
+
9
+ const Skeleton = react.forwardRef(({ className, width, height, style, sx: propSx, ...props }, ref) => {
10
+ return (jsxRuntime.jsx("div", { ref: ref, className: clsx.clsx(Skeleton_css.skeleton, className, sx.sx(propSx)), style: { ...style, width, height }, ...props }));
11
+ });
12
+ Skeleton.displayName = 'Skeleton';
13
+
14
+ exports.Skeleton = Skeleton;
@@ -0,0 +1,15 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var react = require('react');
5
+ var clsx = require('../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.cjs');
6
+ var Table_css = require('./Table.css.vanilla.cjs');
7
+ var sx = require('../../styles/sx.cjs');
8
+
9
+ const Table = react.forwardRef(({ isStriped, className, size = 'md', sx: propSx, ...props }, ref) => {
10
+ return (jsxRuntime.jsx("table", { ref: ref, className: clsx.clsx(Table_css.table({ size }), isStriped && Table_css.striped, sx.sx(propSx), className), ...props }));
11
+ });
12
+ Table.displayName = 'Table';
13
+
14
+ exports.tableCss = Table_css;
15
+ exports.Table = Table;
@@ -0,0 +1,15 @@
1
+ 'use strict';
2
+
3
+ require('./../../styles/layers.css.ts.vanilla.css');
4
+ require('./../../styles/sprinkles.css.ts.vanilla.css');
5
+ require('./../../styles/globalStyle.css.ts.vanilla.css');
6
+ require('./Table.css.ts.vanilla.css');
7
+ var createRuntimeFn62c9670f_esm = require('../../node_modules/.pnpm/@vanilla-extract_recipes@0.5.7_@vanilla-extract_css@1.17.4_babel-plugin-macros@3.1.0_/node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.cjs');
8
+
9
+ var paddingVar = 'var(--paddingVar__cuva6j0)';
10
+ var striped = 'Table_styleWithLayer__cuva6jb';
11
+ var table = createRuntimeFn62c9670f_esm.c({defaultClassName:'Table__cuva6j6 Table_layeredBase__cuva6j1',variantClassNames:{size:{sm:'Table_styleWithLayer__cuva6j2',md:'Table_styleWithLayer__cuva6j3',lg:'Table_styleWithLayer__cuva6j4',xl:'Table_styleWithLayer__cuva6j5'}},defaultVariants:{},compoundVariants:[]});
12
+
13
+ exports.paddingVar = paddingVar;
14
+ exports.striped = striped;
15
+ exports.table = table;
@@ -0,0 +1,11 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var clsx = require('../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.cjs');
5
+ var sx = require('../../styles/sx.cjs');
6
+
7
+ const TableBody = ({ className, sx: propSx, ...props }) => {
8
+ return jsxRuntime.jsx("tbody", { className: clsx.clsx(className, sx.sx(propSx)), ...props });
9
+ };
10
+
11
+ exports.TableBody = TableBody;
@@ -0,0 +1,12 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var clsx = require('../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.cjs');
5
+ var TableCell_css = require('./TableCell.css.vanilla.cjs');
6
+ var sx = require('../../styles/sx.cjs');
7
+
8
+ const TableCell = ({ width, textAlign, style, className, sx: propSx, ...props }) => {
9
+ return (jsxRuntime.jsx("td", { className: clsx.clsx(TableCell_css.tableCell, className, sx.sx(propSx)), style: { ...style, width, textAlign }, ...props }));
10
+ };
11
+
12
+ exports.TableCell = TableCell;
@@ -0,0 +1,12 @@
1
+ 'use strict';
2
+
3
+ require('./../../styles/layers.css.ts.vanilla.css');
4
+ require('./../../styles/sprinkles.css.ts.vanilla.css');
5
+ require('./../../styles/globalStyle.css.ts.vanilla.css');
6
+ require('./Table.css.ts.vanilla.css');
7
+ require('./TableRow.css.ts.vanilla.css');
8
+ require('./TableCell.css.ts.vanilla.css');
9
+
10
+ var tableCell = 'TableCell_styleWithLayer__1a6tmtd0';
11
+
12
+ exports.tableCell = tableCell;
@@ -0,0 +1,12 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var clsx = require('../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.cjs');
5
+ var TableHead_css = require('./TableHead.css.vanilla.cjs');
6
+ var sx = require('../../styles/sx.cjs');
7
+
8
+ const TableHead = ({ width, textAlign, style, className, sx: propSx, ...props }) => {
9
+ return (jsxRuntime.jsx("th", { className: clsx.clsx(TableHead_css.tableHead, className, sx.sx(propSx)), style: { ...style, width, textAlign }, ...props }));
10
+ };
11
+
12
+ exports.TableHead = TableHead;
@@ -0,0 +1,10 @@
1
+ 'use strict';
2
+
3
+ require('./../../styles/layers.css.ts.vanilla.css');
4
+ require('./../../styles/sprinkles.css.ts.vanilla.css');
5
+ require('./../../styles/globalStyle.css.ts.vanilla.css');
6
+ require('./TableHead.css.ts.vanilla.css');
7
+
8
+ var tableHead = 'TableHead_styleWithLayer__1sk0un50';
9
+
10
+ exports.tableHead = tableHead;
@@ -0,0 +1,11 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var clsx = require('../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.cjs');
5
+ var sx = require('../../styles/sx.cjs');
6
+
7
+ const TableHeader = ({ className, sx: propSx, ...props }) => {
8
+ return jsxRuntime.jsx("thead", { className: clsx.clsx(className, sx.sx(propSx)), ...props });
9
+ };
10
+
11
+ exports.TableHeader = TableHeader;
@@ -0,0 +1,12 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var clsx = require('../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.cjs');
5
+ var TableRow_css = require('./TableRow.css.vanilla.cjs');
6
+ var sx = require('../../styles/sx.cjs');
7
+
8
+ const TableRow = ({ isInteractive = false, className, sx: propSx, ...props }) => {
9
+ return (jsxRuntime.jsx("tr", { className: clsx.clsx(isInteractive && TableRow_css.interactive, className, sx.sx(propSx)), ...props }));
10
+ };
11
+
12
+ exports.TableRow = TableRow;
@@ -0,0 +1,10 @@
1
+ 'use strict';
2
+
3
+ require('./../../styles/layers.css.ts.vanilla.css');
4
+ require('./../../styles/sprinkles.css.ts.vanilla.css');
5
+ require('./../../styles/globalStyle.css.ts.vanilla.css');
6
+ require('./TableRow.css.ts.vanilla.css');
7
+
8
+ var interactive = 'TableRow_styleWithLayer__1ntlunj0';
9
+
10
+ exports.interactive = interactive;
@@ -0,0 +1,16 @@
1
+ "use client";
2
+ 'use strict';
3
+
4
+ var jsxRuntime = require('react/jsx-runtime');
5
+ var react = require('react');
6
+ var clsx = require('../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.cjs');
7
+ var TabsProvider = require('./TabsProvider.cjs');
8
+ var sx = require('../../styles/sx.cjs');
9
+
10
+ const Tabs = react.forwardRef(({ children, defaultValue, className, sx: propSx, ...props }, ref) => {
11
+ const [value, setValue] = react.useReducer(TabsProvider.tabsReducer, defaultValue);
12
+ return (jsxRuntime.jsx(TabsProvider.TabsContext.Provider, { value: { value, setValue }, children: jsxRuntime.jsx("div", { ref: ref, className: clsx.clsx(className, sx.sx(propSx)), style: { width: '100%' }, ...props, children: children }) }));
13
+ });
14
+ Tabs.displayName = 'Tabs';
15
+
16
+ exports.Tabs = Tabs;
@@ -0,0 +1,22 @@
1
+ "use client";
2
+ 'use strict';
3
+
4
+ var jsxRuntime = require('react/jsx-runtime');
5
+ var react = require('react');
6
+ var clsx = require('../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.cjs');
7
+ var TabsProvider = require('./TabsProvider.cjs');
8
+ var sx = require('../../styles/sx.cjs');
9
+
10
+ const TabsContent = react.forwardRef(({ value, className, sx: propSx, ...props }, ref) => {
11
+ const tabsContext = react.useContext(TabsProvider.TabsContext);
12
+ if (tabsContext === undefined) {
13
+ throw new Error('TabsContext must be used within a Tabs.');
14
+ }
15
+ if (tabsContext.value !== value) {
16
+ return null;
17
+ }
18
+ return jsxRuntime.jsx("div", { ref: ref, className: clsx.clsx(className, sx.sx(propSx)), ...props });
19
+ });
20
+ TabsContent.displayName = 'TabsContent';
21
+
22
+ exports.TabsContent = TabsContent;
@@ -0,0 +1,14 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var react = require('react');
5
+ var clsx = require('../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.cjs');
6
+ var TabsList_css = require('./TabsList.css.vanilla.cjs');
7
+ var sx = require('../../styles/sx.cjs');
8
+
9
+ const TabsList = react.forwardRef(({ children, className, sx: propSx, ...props }, ref) => {
10
+ return (jsxRuntime.jsx("div", { ref: ref, className: clsx.clsx(className, TabsList_css.container, sx.sx(propSx)), ...props, children: children }));
11
+ });
12
+ TabsList.displayName = 'TabsList';
13
+
14
+ exports.TabsList = TabsList;
@@ -0,0 +1,10 @@
1
+ 'use strict';
2
+
3
+ require('./../../styles/layers.css.ts.vanilla.css');
4
+ require('./../../styles/sprinkles.css.ts.vanilla.css');
5
+ require('./../../styles/globalStyle.css.ts.vanilla.css');
6
+ require('./TabsList.css.ts.vanilla.css');
7
+
8
+ var container = 'TabsList_styleWithLayer__9gciwt0';
9
+
10
+ exports.container = container;
@@ -0,0 +1,12 @@
1
+ "use client";
2
+ 'use strict';
3
+
4
+ var react = require('react');
5
+
6
+ const TabsContext = react.createContext(undefined);
7
+ const tabsReducer = (_, value) => {
8
+ return value;
9
+ };
10
+
11
+ exports.TabsContext = TabsContext;
12
+ exports.tabsReducer = tabsReducer;
@@ -0,0 +1,24 @@
1
+ "use client";
2
+ 'use strict';
3
+
4
+ var jsxRuntime = require('react/jsx-runtime');
5
+ var react = require('react');
6
+ var clsx = require('../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.cjs');
7
+ var TabsProvider = require('./TabsProvider.cjs');
8
+ var TabsTrigger_css = require('./TabsTrigger.css.vanilla.cjs');
9
+ var sx = require('../../styles/sx.cjs');
10
+
11
+ const TabsTrigger = react.forwardRef(({ children, value, className, sx: propSx, ...props }, ref) => {
12
+ const tabsContext = react.useContext(TabsProvider.TabsContext);
13
+ if (tabsContext === undefined) {
14
+ throw new Error('TabsTrigger must be used within a Tabs.');
15
+ }
16
+ const isSelected = tabsContext.value === value;
17
+ const handleClick = () => {
18
+ tabsContext.setValue(value);
19
+ };
20
+ return (jsxRuntime.jsx("button", { ref: ref, className: clsx.clsx(className, TabsTrigger_css.container({ isSelected }), sx.sx(propSx)), onClick: handleClick, ...props, children: children }));
21
+ });
22
+ TabsTrigger.displayName = 'TabsTrigger';
23
+
24
+ exports.TabsTrigger = TabsTrigger;
@@ -0,0 +1,11 @@
1
+ 'use strict';
2
+
3
+ require('./../../styles/layers.css.ts.vanilla.css');
4
+ require('./../../styles/sprinkles.css.ts.vanilla.css');
5
+ require('./../../styles/globalStyle.css.ts.vanilla.css');
6
+ require('./TabsTrigger.css.ts.vanilla.css');
7
+ var createRuntimeFn62c9670f_esm = require('../../node_modules/.pnpm/@vanilla-extract_recipes@0.5.7_@vanilla-extract_css@1.17.4_babel-plugin-macros@3.1.0_/node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.cjs');
8
+
9
+ var container = createRuntimeFn62c9670f_esm.c({defaultClassName:'TabsTrigger__rk5ejr3 TabsTrigger_layeredBase__rk5ejr0',variantClassNames:{isSelected:{true:'TabsTrigger_styleWithLayer__rk5ejr1',false:'TabsTrigger_styleWithLayer__rk5ejr2'}},defaultVariants:{},compoundVariants:[]});
10
+
11
+ exports.container = container;
@@ -0,0 +1,11 @@
1
+ 'use strict';
2
+
3
+ require('./../../styles/layers.css.ts.vanilla.css');
4
+ require('./../../styles/sprinkles.css.ts.vanilla.css');
5
+ require('./../../styles/globalStyle.css.ts.vanilla.css');
6
+ require('./TextField.css.ts.vanilla.css');
7
+ var createRuntimeFn62c9670f_esm = require('../../node_modules/.pnpm/@vanilla-extract_recipes@0.5.7_@vanilla-extract_css@1.17.4_babel-plugin-macros@3.1.0_/node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.cjs');
8
+
9
+ var textField = createRuntimeFn62c9670f_esm.c({defaultClassName:'TextField__q8l7gtz TextField_layeredBase__q8l7gtv',variantClassNames:{color:{primary:'TextField_styleWithLayer__q8l7gt1',secondary:'TextField_styleWithLayer__q8l7gt2',muted:'TextField_styleWithLayer__q8l7gt3',accent:'TextField_styleWithLayer__q8l7gt4',card:'TextField_styleWithLayer__q8l7gt5',danger:'TextField_styleWithLayer__q8l7gt6',warning:'TextField_styleWithLayer__q8l7gt7',success:'TextField_styleWithLayer__q8l7gt8',red:'TextField_styleWithLayer__q8l7gt9',orange:'TextField_styleWithLayer__q8l7gta',amber:'TextField_styleWithLayer__q8l7gtb',yellow:'TextField_styleWithLayer__q8l7gtc',lime:'TextField_styleWithLayer__q8l7gtd',green:'TextField_styleWithLayer__q8l7gte',emerald:'TextField_styleWithLayer__q8l7gtf',teal:'TextField_styleWithLayer__q8l7gtg',cyan:'TextField_styleWithLayer__q8l7gth',sky:'TextField_styleWithLayer__q8l7gti',blue:'TextField_styleWithLayer__q8l7gtj',indigo:'TextField_styleWithLayer__q8l7gtk',violet:'TextField_styleWithLayer__q8l7gtl',purple:'TextField_styleWithLayer__q8l7gtm',fuchsia:'TextField_styleWithLayer__q8l7gtn',pink:'TextField_styleWithLayer__q8l7gto',rose:'TextField_styleWithLayer__q8l7gtp',slate:'TextField_styleWithLayer__q8l7gtq',gray:'TextField_styleWithLayer__q8l7gtr',zinc:'TextField_styleWithLayer__q8l7gts',neutral:'TextField_styleWithLayer__q8l7gtt',stone:'TextField_styleWithLayer__q8l7gtu'},size:{sm:'TextField_styleWithLayer__q8l7gtw',md:'TextField_styleWithLayer__q8l7gtx',lg:'TextField_styleWithLayer__q8l7gty'}},defaultVariants:{},compoundVariants:[]});
10
+
11
+ exports.textField = textField;
@@ -0,0 +1,15 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var react = require('react');
5
+ var clsx = require('../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.cjs');
6
+ var TextField_css = require('./TextField.css.vanilla.cjs');
7
+ var sx = require('../../styles/sx.cjs');
8
+
9
+ const TextField = react.forwardRef(({ className, type = 'text', size = 'md', color = 'primary', sx: propSx, ...props }, ref) => {
10
+ return (jsxRuntime.jsx("input", { ref: ref, className: clsx.clsx(className, TextField_css.textField({ size, color }), sx.sx(propSx)), type: type, ...props }));
11
+ });
12
+ TextField.displayName = 'TextField';
13
+
14
+ exports.textFieldCss = TextField_css;
15
+ exports.TextField = TextField;
@@ -0,0 +1,13 @@
1
+ 'use strict';
2
+
3
+ require('./../../styles/layers.css.ts.vanilla.css');
4
+ require('./../../styles/sprinkles.css.ts.vanilla.css');
5
+ require('./../../styles/globalStyle.css.ts.vanilla.css');
6
+ require('./Toast.css.ts.vanilla.css');
7
+ var createRuntimeFn62c9670f_esm = require('../../node_modules/.pnpm/@vanilla-extract_recipes@0.5.7_@vanilla-extract_css@1.17.4_babel-plugin-macros@3.1.0_/node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.cjs');
8
+
9
+ var progress = createRuntimeFn62c9670f_esm.c({defaultClassName:'Toast__1nxbvh6e Toast_layeredBase__1nxbvh6b',variantClassNames:{animation:{true:'Toast_styleWithLayer__1nxbvh6c',false:'Toast_styleWithLayer__1nxbvh6d'}},defaultVariants:{},compoundVariants:[]});
10
+ var toast = createRuntimeFn62c9670f_esm.c({defaultClassName:'Toast__1nxbvh6i Toast_layeredBase__1nxbvh6h',variantClassNames:{color:{primary:'Toast_styleWithLayer__1nxbvh62',secondary:'Toast_styleWithLayer__1nxbvh63',muted:'Toast_styleWithLayer__1nxbvh64',accent:'Toast_styleWithLayer__1nxbvh65',card:'Toast_styleWithLayer__1nxbvh66',danger:'Toast_styleWithLayer__1nxbvh67',warning:'Toast_styleWithLayer__1nxbvh68',success:'Toast_styleWithLayer__1nxbvh69'}},defaultVariants:{},compoundVariants:[]});
11
+
12
+ exports.progress = progress;
13
+ exports.toast = toast;
@@ -0,0 +1,18 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var react = require('react');
5
+ var clsx = require('../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.cjs');
6
+ var Toast_css = require('./Toast.css.vanilla.cjs');
7
+ var index = require('../Box/index.cjs');
8
+ var sx = require('../../styles/sx.cjs');
9
+
10
+ const Toast = react.forwardRef(({ children, color = 'accent', className, duration = 0, sx: propSx, ...props }, ref) => {
11
+ return (jsxRuntime.jsxs(index.Box, { ref: ref, boxShadow: "accent-sm", className: clsx.clsx(Toast_css.toast({ color }), className, sx.sx(propSx)), rounded: true, ...props, children: [jsxRuntime.jsx("div", { className: Toast_css.progress({ animation: duration !== 0 }), style: {
12
+ animationDuration: duration > 0 ? `${duration}ms` : undefined,
13
+ } }), jsxRuntime.jsx("span", { style: { position: 'relative' }, children: children })] }));
14
+ });
15
+ Toast.displayName = 'Toast';
16
+
17
+ exports.toastCss = Toast_css;
18
+ exports.Toast = Toast;
@@ -0,0 +1,11 @@
1
+ 'use strict';
2
+
3
+ require('./../../styles/layers.css.ts.vanilla.css');
4
+ require('./../../styles/sprinkles.css.ts.vanilla.css');
5
+ require('./../../styles/globalStyle.css.ts.vanilla.css');
6
+ require('./Tooltip.css.ts.vanilla.css');
7
+ var createRuntimeFn62c9670f_esm = require('../../node_modules/.pnpm/@vanilla-extract_recipes@0.5.7_@vanilla-extract_css@1.17.4_babel-plugin-macros@3.1.0_/node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.cjs');
8
+
9
+ var tooltip = createRuntimeFn62c9670f_esm.c({defaultClassName:'Tooltip__1s9n3or5 Tooltip_layeredBase__1s9n3or1',variantClassNames:{size:{sm:'Tooltip_styleWithLayer__1s9n3or2',md:'Tooltip_styleWithLayer__1s9n3or3',lg:'Tooltip_styleWithLayer__1s9n3or4'}},defaultVariants:{},compoundVariants:[]});
10
+
11
+ exports.tooltip = tooltip;
@@ -0,0 +1,31 @@
1
+ "use client";
2
+ 'use strict';
3
+
4
+ var jsxRuntime = require('react/jsx-runtime');
5
+ var react = require('react');
6
+ var Tooltip_css = require('./Tooltip.css.vanilla.cjs');
7
+ var index = require('../Portal/index.cjs');
8
+
9
+ const Tooltip = ({ children, content, size = 'sm' }) => {
10
+ const [isVisible, setIsVisible] = react.useState(false);
11
+ const [position, setPosition] = react.useState({
12
+ x: 0,
13
+ y: 0,
14
+ });
15
+ const handlePointerOver = (e) => {
16
+ const rect = e.currentTarget.getBoundingClientRect();
17
+ setIsVisible(true);
18
+ setPosition({ x: rect.x + rect.width / 2, y: rect.y + rect.height + 4 });
19
+ children.props?.onPointerOver?.(e);
20
+ };
21
+ const handlePointerOut = (e) => {
22
+ setIsVisible(false);
23
+ children.props?.onPointerOut?.(e);
24
+ };
25
+ return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [react.cloneElement(children, {
26
+ onPointerOver: handlePointerOver,
27
+ onPointerOut: handlePointerOut,
28
+ }), isVisible && (jsxRuntime.jsx(index.Portal, { children: jsxRuntime.jsx("div", { className: Tooltip_css.tooltip({ size }), style: { top: position.y, left: position.x }, children: content }) }))] }));
29
+ };
30
+
31
+ exports.Tooltip = Tooltip;
@@ -0,0 +1,11 @@
1
+ 'use strict';
2
+
3
+ require('./../../styles/layers.css.ts.vanilla.css');
4
+ require('./../../styles/sprinkles.css.ts.vanilla.css');
5
+ require('./../../styles/globalStyle.css.ts.vanilla.css');
6
+ require('./Typography.css.ts.vanilla.css');
7
+ var createRuntimeFn62c9670f_esm = require('../../node_modules/.pnpm/@vanilla-extract_recipes@0.5.7_@vanilla-extract_css@1.17.4_babel-plugin-macros@3.1.0_/node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.cjs');
8
+
9
+ var typography = createRuntimeFn62c9670f_esm.c({defaultClassName:'Typography__q3o6cc3 Typography_layeredBase__q3o6cc0',variantClassNames:{isEllipsis:{true:'Typography_styleWithLayer__q3o6cc1'},isGradient:{true:'Typography_styleWithLayer__q3o6cc2'}},defaultVariants:{},compoundVariants:[]});
10
+
11
+ exports.typography = typography;
@@ -0,0 +1,25 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var react = require('react');
5
+ var clsx = require('../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.cjs');
6
+ var Typography_css = require('./Typography.css.vanilla.cjs');
7
+ var sprinkles_css = require('../../styles/sprinkles.css.vanilla.cjs');
8
+
9
+ const Typography = react.forwardRef(({ children, as: Component = 'p', className, color = 'foreground', fontSize = 'md', fontWeight = 'normal', lineHeight, textAlign, letterSpacing, wordBreak, gradientFrom, gradientTo, isEllipsis = false, isGradient = false, sx, ...props }, ref) => {
10
+ return (jsxRuntime.jsx(Component, { ref: ref, className: clsx.clsx(Typography_css.typography({ isEllipsis, isGradient }), sprinkles_css.sprinkles({
11
+ color,
12
+ fontSize,
13
+ fontWeight,
14
+ lineHeight,
15
+ textAlign,
16
+ letterSpacing,
17
+ wordBreak,
18
+ gradientFrom,
19
+ gradientTo,
20
+ }), sx && sprinkles_css.sprinkles(sx), className), ...props, children: children }));
21
+ });
22
+ Typography.displayName = 'Typography';
23
+
24
+ exports.typographyCss = Typography_css;
25
+ exports.Typography = Typography;
@@ -0,0 +1,15 @@
1
+ "use client";
2
+ 'use strict';
3
+
4
+ var jsxRuntime = require('react/jsx-runtime');
5
+ var utils = require('@kimdw-rtk/utils');
6
+ var overlay_css = require('../styles/overlay.css.vanilla.cjs');
7
+ var ContainerProvider = require('../hooks/useContainer/ContainerProvider.cjs');
8
+ var ToastProvider = require('../hooks/useToast/ToastProvider.cjs');
9
+ var index = require('../components/Portal/index.cjs');
10
+
11
+ const UIProvider = ({ children, container, overlayUnmountOn = 'transitionEnd', }) => {
12
+ return (jsxRuntime.jsx(ContainerProvider.ContainerProvider, { container: container, children: jsxRuntime.jsx(ToastProvider.ToastProvider, { children: jsxRuntime.jsx(utils.OverlayProvider, { className: { ...overlay_css }, renderOverlay: (overlayChildren) => (jsxRuntime.jsx(index.Portal, { children: overlayChildren })), unmountOn: overlayUnmountOn, children: children }) }) }));
13
+ };
14
+
15
+ exports.UIProvider = UIProvider;
@@ -0,0 +1,13 @@
1
+ "use client";
2
+ 'use strict';
3
+
4
+ var jsxRuntime = require('react/jsx-runtime');
5
+ var react = require('react');
6
+
7
+ const ContainerContext = react.createContext(undefined);
8
+ const ContainerProvider = ({ children, container, }) => {
9
+ return (jsxRuntime.jsx(ContainerContext.Provider, { value: container, children: children }));
10
+ };
11
+
12
+ exports.ContainerContext = ContainerContext;
13
+ exports.ContainerProvider = ContainerProvider;
@@ -0,0 +1,12 @@
1
+ "use client";
2
+ 'use strict';
3
+
4
+ var react = require('react');
5
+ var ContainerProvider = require('./ContainerProvider.cjs');
6
+
7
+ const useContainer = () => {
8
+ const containerContext = react.useContext(ContainerProvider.ContainerContext);
9
+ return containerContext;
10
+ };
11
+
12
+ exports.useContainer = useContainer;
@@ -0,0 +1,34 @@
1
+ "use client";
2
+ 'use strict';
3
+
4
+ var jsxRuntime = require('react/jsx-runtime');
5
+ var react = require('react');
6
+ var utils = require('@kimdw-rtk/utils');
7
+ var index = require('../../components/Alert/index.cjs');
8
+ var index$1 = require('../../components/Confirm/index.cjs');
9
+
10
+ const useDialog = () => {
11
+ const { push } = utils.useOverlay();
12
+ const dialogRef = react.useRef(null);
13
+ const alert = react.useCallback((message) => {
14
+ return new Promise((resolve) => {
15
+ push(jsxRuntime.jsx(index.Alert, { children: message }), { onClose: () => resolve(true) });
16
+ });
17
+ }, [push]);
18
+ const confirm = react.useCallback((message) => {
19
+ return new Promise((resolve) => {
20
+ const handleConfirm = () => {
21
+ resolve(true);
22
+ dialogRef.current?.close();
23
+ };
24
+ const handleCancle = () => {
25
+ resolve(false);
26
+ dialogRef.current?.close();
27
+ };
28
+ push(jsxRuntime.jsx(index$1.Confirm, { ref: dialogRef, onCancle: handleCancle, onConfirm: handleConfirm, children: message }), { onClose: () => resolve(false) });
29
+ });
30
+ }, [push]);
31
+ return react.useMemo(() => ({ alert, confirm }), [alert, confirm]);
32
+ };
33
+
34
+ exports.useDialog = useDialog;
@@ -0,0 +1,52 @@
1
+ "use client";
2
+ 'use strict';
3
+
4
+ var react = require('react');
5
+
6
+ /**
7
+ * 마우스를 사용하는 환경에서도 드래그로 가로 스크롤을 할 수 있게 만드는 hook
8
+ */
9
+ const useMouseScroll = (ref) => {
10
+ react.useEffect(() => {
11
+ const element = ref.current;
12
+ let isDown = false, startX = 0, startLeft = 0;
13
+ if (element === null) {
14
+ return;
15
+ }
16
+ const handleMouseDown = (e) => {
17
+ if (!element.contains(e.target)) {
18
+ return;
19
+ }
20
+ isDown = true;
21
+ startLeft = element.scrollLeft;
22
+ startX = e.x;
23
+ };
24
+ const handleMouseMove = (e) => {
25
+ if (!isDown) {
26
+ return;
27
+ }
28
+ element.scrollLeft = startLeft + startX - e.x;
29
+ };
30
+ const handleMouseUp = () => {
31
+ isDown = false;
32
+ };
33
+ const handleWheel = (e) => {
34
+ element.scrollTo({
35
+ left: element.scrollLeft + e.deltaY,
36
+ behavior: 'smooth',
37
+ });
38
+ };
39
+ window.addEventListener('mousedown', handleMouseDown);
40
+ window.addEventListener('mousemove', handleMouseMove);
41
+ window.addEventListener('mouseup', handleMouseUp);
42
+ element.addEventListener('wheel', handleWheel);
43
+ return () => {
44
+ window.removeEventListener('mousedown', handleMouseDown);
45
+ window.removeEventListener('mousemove', handleMouseMove);
46
+ window.removeEventListener('mouseup', handleMouseUp);
47
+ element.removeEventListener('wheel', handleWheel);
48
+ };
49
+ }, [ref]);
50
+ };
51
+
52
+ exports.useMouseScroll = useMouseScroll;
@@ -0,0 +1,49 @@
1
+ "use client";
2
+ 'use strict';
3
+
4
+ var react = require('react');
5
+
6
+ const usePointerSlider = (ref, { min, max, defaultValue, }) => {
7
+ const [value, setValue] = react.useState(defaultValue);
8
+ react.useEffect(() => {
9
+ const element = ref.current;
10
+ let isDown = false, parentWidth = 0, parentX = 0;
11
+ if (element === null) {
12
+ return;
13
+ }
14
+ element.style.left = `${((defaultValue - min) / (max - min)) * 100}%`;
15
+ const handlePointerDown = (e) => {
16
+ element.setPointerCapture(e.pointerId);
17
+ isDown = true;
18
+ const boundingRect = element.parentElement?.getBoundingClientRect();
19
+ if (boundingRect === undefined) {
20
+ return;
21
+ }
22
+ parentWidth = boundingRect.width;
23
+ parentX = boundingRect.x;
24
+ };
25
+ const handlePointerMove = (e) => {
26
+ if (!isDown) {
27
+ return;
28
+ }
29
+ const currentValue = Math.min(max, Math.max(min, Math.round((e.clientX - parentX) / (parentWidth / (max - min))) + min));
30
+ element.style.left = `${((currentValue - min) / (max - min)) * 100}%`;
31
+ setValue(currentValue);
32
+ };
33
+ const handlePointerUp = (e) => {
34
+ element.releasePointerCapture(e.pointerId);
35
+ isDown = false;
36
+ };
37
+ element.addEventListener('pointerdown', handlePointerDown);
38
+ element.addEventListener('pointermove', handlePointerMove);
39
+ element.addEventListener('pointerup', handlePointerUp);
40
+ return () => {
41
+ element.removeEventListener('pointerdown', handlePointerDown);
42
+ element.removeEventListener('pointermove', handlePointerMove);
43
+ element.removeEventListener('pointerup', handlePointerUp);
44
+ };
45
+ }, [ref, max, min, defaultValue]);
46
+ return value;
47
+ };
48
+
49
+ exports.usePointerSlider = usePointerSlider;