@kimdw-rtk/ui 0.0.12 → 0.0.14
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.
- package/dist/chunk-424PT5DM.js +23 -0
- package/dist/chunk-424PT5DM.js.map +1 -0
- package/dist/chunk-PCAHVFSY.js +456 -0
- package/dist/chunk-PCAHVFSY.js.map +1 -0
- package/dist/components/Accordion/Accordion.css.js +7 -4
- package/dist/components/Accordion/Accordion.css.js.map +1 -1
- package/dist/components/Accordion/Accordion.js +8 -5
- package/dist/components/Accordion/Accordion.js.map +1 -1
- package/dist/components/Accordion/Accordion.spec.js +3 -2
- package/dist/components/Accordion/Accordion.spec.js.map +1 -1
- package/dist/components/Accordion/AccordionContent.css.js +7 -4
- package/dist/components/Accordion/AccordionContent.css.js.map +1 -1
- package/dist/components/Accordion/AccordionContent.js +22 -19
- package/dist/components/Accordion/AccordionContent.js.map +1 -1
- package/dist/components/Accordion/AccordionContext.js +5 -2
- package/dist/components/Accordion/AccordionContext.js.map +1 -1
- package/dist/components/Accordion/AccordionTrigger.css.js +7 -4
- package/dist/components/Accordion/AccordionTrigger.css.js.map +1 -1
- package/dist/components/Accordion/AccordionTrigger.js +7 -4
- package/dist/components/Accordion/AccordionTrigger.js.map +1 -1
- package/dist/components/Accordion/index.js +4 -3
- package/dist/components/Accordion/index.js.map +1 -1
- package/dist/components/Alert/index.js +7 -4
- package/dist/components/Alert/index.js.map +1 -1
- package/dist/components/Box/Box.css.js +6 -3
- package/dist/components/Box/Box.css.js.map +1 -1
- package/dist/components/Box/Box.spec.js +3 -2
- package/dist/components/Box/Box.spec.js.map +1 -1
- package/dist/components/Box/index.js +8 -5
- package/dist/components/Box/index.js.map +1 -1
- package/dist/components/Button/Button.css.js +15 -12
- package/dist/components/Button/Button.css.js.map +1 -1
- package/dist/components/Button/Button.spec.js +12 -5
- package/dist/components/Button/Button.spec.js.map +1 -1
- package/dist/components/Button/index.js +11 -8
- package/dist/components/Button/index.js.map +1 -1
- package/dist/components/Card/Card.css.js +11 -8
- package/dist/components/Card/Card.css.js.map +1 -1
- package/dist/components/Card/Card.js +7 -4
- package/dist/components/Card/Card.js.map +1 -1
- package/dist/components/Card/Card.spec.js +11 -4
- package/dist/components/Card/Card.spec.js.map +1 -1
- package/dist/components/Card/CardContent.css.js +6 -3
- package/dist/components/Card/CardContent.css.js.map +1 -1
- package/dist/components/Card/CardContent.js +7 -4
- package/dist/components/Card/CardContent.js.map +1 -1
- package/dist/components/Card/CardInteraction.css.js +5 -2
- package/dist/components/Card/CardInteraction.css.js.map +1 -1
- package/dist/components/Card/CardInteraction.js +8 -5
- package/dist/components/Card/CardInteraction.js.map +1 -1
- package/dist/components/Card/CardThumbnail.css.js +5 -2
- package/dist/components/Card/CardThumbnail.css.js.map +1 -1
- package/dist/components/Card/CardThumbnail.js +7 -4
- package/dist/components/Card/CardThumbnail.js.map +1 -1
- package/dist/components/Card/index.js +5 -4
- package/dist/components/Card/index.js.map +1 -1
- package/dist/components/Chip/Chip.css.js +12 -9
- package/dist/components/Chip/Chip.css.js.map +1 -1
- package/dist/components/Chip/Chip.js +7 -4
- package/dist/components/Chip/Chip.js.map +1 -1
- package/dist/components/Chip/Chip.spec.js +3 -2
- package/dist/components/Chip/Chip.spec.js.map +1 -1
- package/dist/components/Chip/index.js +2 -1
- package/dist/components/Chip/index.js.map +1 -1
- package/dist/components/Confirm/index.js +6 -3
- package/dist/components/Confirm/index.js.map +1 -1
- package/dist/components/Dialog/Dialog.css.js +6 -3
- package/dist/components/Dialog/Dialog.css.js.map +1 -1
- package/dist/components/Dialog/Dialog.js +8 -5
- package/dist/components/Dialog/Dialog.js.map +1 -1
- package/dist/components/Dialog/Dialog.spec.js +11 -4
- package/dist/components/Dialog/Dialog.spec.js.map +1 -1
- package/dist/components/Dialog/DialogContent.css.js +8 -5
- package/dist/components/Dialog/DialogContent.css.js.map +1 -1
- package/dist/components/Dialog/DialogContent.js +8 -5
- package/dist/components/Dialog/DialogContent.js.map +1 -1
- package/dist/components/Dialog/DialogFooter.css.js +6 -3
- package/dist/components/Dialog/DialogFooter.css.js.map +1 -1
- package/dist/components/Dialog/DialogFooter.js +7 -4
- package/dist/components/Dialog/DialogFooter.js.map +1 -1
- package/dist/components/Dialog/DialogHeader.css.js +7 -4
- package/dist/components/Dialog/DialogHeader.css.js.map +1 -1
- package/dist/components/Dialog/DialogHeader.js +8 -5
- package/dist/components/Dialog/DialogHeader.js.map +1 -1
- package/dist/components/Dialog/index.js +5 -4
- package/dist/components/Dialog/index.js.map +1 -1
- package/dist/components/Navigation/Navigation.spec.js +4 -3
- package/dist/components/Navigation/Navigation.spec.js.map +1 -1
- package/dist/components/Navigation/NavigationAside.css.js +5 -2
- package/dist/components/Navigation/NavigationAside.css.js.map +1 -1
- package/dist/components/Navigation/NavigationAside.js +7 -4
- package/dist/components/Navigation/NavigationAside.js.map +1 -1
- package/dist/components/Navigation/NavigationBar.css.js +7 -4
- package/dist/components/Navigation/NavigationBar.css.js.map +1 -1
- package/dist/components/Navigation/NavigationBar.js +7 -4
- package/dist/components/Navigation/NavigationBar.js.map +1 -1
- package/dist/components/Navigation/NavigationContainer.css.js +4 -1
- package/dist/components/Navigation/NavigationContainer.css.js.map +1 -1
- package/dist/components/Navigation/NavigationContainer.js +7 -4
- package/dist/components/Navigation/NavigationContainer.js.map +1 -1
- package/dist/components/Navigation/NavigationDrawer.css.js +9 -6
- package/dist/components/Navigation/NavigationDrawer.css.js.map +1 -1
- package/dist/components/Navigation/NavigationDrawer.js +7 -4
- package/dist/components/Navigation/NavigationDrawer.js.map +1 -1
- package/dist/components/Navigation/NavigationItem.css.js +8 -5
- package/dist/components/Navigation/NavigationItem.css.js.map +1 -1
- package/dist/components/Navigation/NavigationItem.js +7 -4
- package/dist/components/Navigation/NavigationItem.js.map +1 -1
- package/dist/components/Navigation/NavigationLogo.css.js +5 -2
- package/dist/components/Navigation/NavigationLogo.css.js.map +1 -1
- package/dist/components/Navigation/NavigationLogo.js +7 -4
- package/dist/components/Navigation/NavigationLogo.js.map +1 -1
- package/dist/components/Navigation/NavigationMenu.css.js +8 -5
- package/dist/components/Navigation/NavigationMenu.css.js.map +1 -1
- package/dist/components/Navigation/NavigationMenu.js +7 -4
- package/dist/components/Navigation/NavigationMenu.js.map +1 -1
- package/dist/components/Navigation/index.js +8 -7
- package/dist/components/Navigation/index.js.map +1 -1
- package/dist/components/Range/Range.css.js +14 -11
- package/dist/components/Range/Range.css.js.map +1 -1
- package/dist/components/Range/Range.js +8 -5
- package/dist/components/Range/Range.js.map +1 -1
- package/dist/components/Range/Range.spec.js +3 -2
- package/dist/components/Range/Range.spec.js.map +1 -1
- package/dist/components/Range/index.js +2 -1
- package/dist/components/Range/index.js.map +1 -1
- package/dist/components/ScrollArea/ScrollArea.css.js +10 -7
- package/dist/components/ScrollArea/ScrollArea.css.js.map +1 -1
- package/dist/components/ScrollArea/ScrollArea.js +8 -5
- package/dist/components/ScrollArea/ScrollArea.js.map +1 -1
- package/dist/components/ScrollArea/ScrollArea.spec.js +3 -2
- package/dist/components/ScrollArea/ScrollArea.spec.js.map +1 -1
- package/dist/components/ScrollArea/index.js +2 -1
- package/dist/components/ScrollArea/index.js.map +1 -1
- package/dist/components/Select/Select.css.js +6 -3
- package/dist/components/Select/Select.css.js.map +1 -1
- package/dist/components/Select/Select.js +10 -7
- package/dist/components/Select/Select.js.map +1 -1
- package/dist/components/Select/Select.spec.js +16 -9
- package/dist/components/Select/Select.spec.js.map +1 -1
- package/dist/components/Select/SelectContext.js +5 -2
- package/dist/components/Select/SelectContext.js.map +1 -1
- package/dist/components/Select/SelectOption.css.js +6 -3
- package/dist/components/Select/SelectOption.css.js.map +1 -1
- package/dist/components/Select/SelectOption.js +7 -4
- package/dist/components/Select/SelectOption.js.map +1 -1
- package/dist/components/Select/SelectOptionList.css.js +7 -4
- package/dist/components/Select/SelectOptionList.css.js.map +1 -1
- package/dist/components/Select/SelectOptionList.js +13 -10
- package/dist/components/Select/SelectOptionList.js.map +1 -1
- package/dist/components/Select/SelectTrigger.css.js +7 -4
- package/dist/components/Select/SelectTrigger.css.js.map +1 -1
- package/dist/components/Select/SelectTrigger.js +10 -7
- package/dist/components/Select/SelectTrigger.js.map +1 -1
- package/dist/components/Select/index.js +3 -2
- package/dist/components/Select/index.js.map +1 -1
- package/dist/components/Skeleton/Skeleton.css.js +7 -4
- package/dist/components/Skeleton/Skeleton.css.js.map +1 -1
- package/dist/components/Skeleton/Skeleton.spec.js +3 -2
- package/dist/components/Skeleton/Skeleton.spec.js.map +1 -1
- package/dist/components/Skeleton/index.js +7 -4
- package/dist/components/Skeleton/index.js.map +1 -1
- package/dist/components/Table/Table.css.js +6 -3
- package/dist/components/Table/Table.css.js.map +1 -1
- package/dist/components/Table/Table.js +7 -4
- package/dist/components/Table/Table.js.map +1 -1
- package/dist/components/Table/Table.spec.js +3 -2
- package/dist/components/Table/Table.spec.js.map +1 -1
- package/dist/components/Table/TableBody.js +6 -3
- package/dist/components/Table/TableBody.js.map +1 -1
- package/dist/components/Table/TableCell.css.js +8 -5
- package/dist/components/Table/TableCell.css.js.map +1 -1
- package/dist/components/Table/TableCell.js +8 -5
- package/dist/components/Table/TableCell.js.map +1 -1
- package/dist/components/Table/TableHead.css.js +6 -3
- package/dist/components/Table/TableHead.css.js.map +1 -1
- package/dist/components/Table/TableHead.js +8 -5
- package/dist/components/Table/TableHead.js.map +1 -1
- package/dist/components/Table/TableHeader.js +6 -3
- package/dist/components/Table/TableHeader.js.map +1 -1
- package/dist/components/Table/TableRow.css.js +5 -2
- package/dist/components/Table/TableRow.css.js.map +1 -1
- package/dist/components/Table/TableRow.js +7 -4
- package/dist/components/Table/TableRow.js.map +1 -1
- package/dist/components/Table/index.js +7 -6
- package/dist/components/Table/index.js.map +1 -1
- package/dist/components/Tabs/Tabs.js +7 -4
- package/dist/components/Tabs/Tabs.js.map +1 -1
- package/dist/components/Tabs/Tabs.spec.js +18 -11
- package/dist/components/Tabs/Tabs.spec.js.map +1 -1
- package/dist/components/Tabs/TabsContent.js +7 -4
- package/dist/components/Tabs/TabsContent.js.map +1 -1
- package/dist/components/Tabs/TabsList.css.js +6 -3
- package/dist/components/Tabs/TabsList.css.js.map +1 -1
- package/dist/components/Tabs/TabsList.js +7 -4
- package/dist/components/Tabs/TabsList.js.map +1 -1
- package/dist/components/Tabs/TabsProvider.js +5 -2
- package/dist/components/Tabs/TabsProvider.js.map +1 -1
- package/dist/components/Tabs/TabsTrigger.css.js +6 -3
- package/dist/components/Tabs/TabsTrigger.css.js.map +1 -1
- package/dist/components/Tabs/TabsTrigger.js +8 -5
- package/dist/components/Tabs/TabsTrigger.js.map +1 -1
- package/dist/components/Tabs/index.js +5 -4
- package/dist/components/Tabs/index.js.map +1 -1
- package/dist/components/TextField/TextField.css.js +11 -8
- package/dist/components/TextField/TextField.css.js.map +1 -1
- package/dist/components/TextField/TextField.spec.js +3 -2
- package/dist/components/TextField/TextField.spec.js.map +1 -1
- package/dist/components/TextField/index.js +7 -4
- package/dist/components/TextField/index.js.map +1 -1
- package/dist/components/Toast/Toast.css.js +12 -9
- package/dist/components/Toast/Toast.css.js.map +1 -1
- package/dist/components/Toast/Toast.spec.js +3 -2
- package/dist/components/Toast/Toast.spec.js.map +1 -1
- package/dist/components/Toast/index.js +8 -5
- package/dist/components/Toast/index.js.map +1 -1
- package/dist/components/Typography/Typography.css.js +5 -2
- package/dist/components/Typography/Typography.css.js.map +1 -1
- package/dist/components/Typography/Typography.spec.js +12 -5
- package/dist/components/Typography/Typography.spec.js.map +1 -1
- package/dist/components/Typography/index.js +8 -5
- package/dist/components/Typography/index.js.map +1 -1
- package/dist/components/index.js +19 -18
- package/dist/components/index.js.map +1 -1
- package/dist/contexts/UIProvider.js +7 -4
- package/dist/contexts/UIProvider.js.map +1 -1
- package/dist/contexts/index.js +2 -1
- package/dist/contexts/index.js.map +1 -1
- package/dist/hooks/index.js +6 -5
- package/dist/hooks/index.js.map +1 -1
- package/dist/hooks/useDialog/index.js +6 -3
- package/dist/hooks/useDialog/index.js.map +1 -1
- package/dist/hooks/useDialog/useDialog.spec.js +20 -13
- package/dist/hooks/useDialog/useDialog.spec.js.map +1 -1
- package/dist/hooks/useMouseScroll/index.js +4 -1
- package/dist/hooks/useMouseScroll/index.js.map +1 -1
- package/dist/hooks/usePointerSlider/index.js +4 -1
- package/dist/hooks/usePointerSlider/index.js.map +1 -1
- package/dist/hooks/useRipple/index.js +22 -19
- package/dist/hooks/useRipple/index.js.map +1 -1
- package/dist/hooks/useRipple/ripple.css.js +6 -3
- package/dist/hooks/useRipple/ripple.css.js.map +1 -1
- package/dist/hooks/useToast/ToastContainer.css.js +4 -1
- package/dist/hooks/useToast/ToastContainer.css.js.map +1 -1
- package/dist/hooks/useToast/ToastContainer.js +5 -2
- package/dist/hooks/useToast/ToastContainer.js.map +1 -1
- package/dist/hooks/useToast/ToastProvider.js +9 -6
- package/dist/hooks/useToast/ToastProvider.js.map +1 -1
- package/dist/hooks/useToast/index.js +5 -2
- package/dist/hooks/useToast/index.js.map +1 -1
- package/dist/index.js +9 -8
- package/dist/index.js.map +1 -1
- package/dist/styles/globalStyle.css.js +2 -1
- package/dist/styles/globalStyle.css.js.map +1 -1
- package/dist/styles/index.js +5 -4
- package/dist/styles/index.js.map +1 -1
- package/dist/styles/layers.css.js +5 -2
- package/dist/styles/layers.css.js.map +1 -1
- package/dist/styles/overlay.css.js +6 -3
- package/dist/styles/overlay.css.js.map +1 -1
- package/dist/styles/sprinkles.css.js +13 -10
- package/dist/styles/sprinkles.css.js.map +1 -1
- package/dist/styles/sx.js +5 -2
- package/dist/styles/sx.js.map +1 -1
- package/dist/tests/uiTest.js +15 -9
- package/dist/tests/uiTest.js.map +1 -1
- package/dist/themes/darkTheme.css.js +5 -2
- package/dist/themes/darkTheme.css.js.map +1 -1
- package/dist/themes/index.js +6 -3
- package/dist/themes/index.js.map +1 -1
- package/dist/themes/lightTheme.css.js +5 -2
- package/dist/themes/lightTheme.css.js.map +1 -1
- package/dist/themes/theme.css.js +7 -4
- package/dist/themes/theme.css.js.map +1 -1
- package/dist/tokens/index.js +8 -5
- package/dist/tokens/index.js.map +1 -1
- package/dist/tokens/scale/color.js +6 -3
- package/dist/tokens/scale/color.js.map +1 -1
- package/dist/tokens/semantic/breakpoint.js +4 -1
- package/dist/tokens/semantic/breakpoint.js.map +1 -1
- package/dist/tokens/semantic/color.js +4 -1
- package/dist/tokens/semantic/color.js.map +1 -1
- package/dist/tokens/semantic/spacing.js +4 -1
- package/dist/tokens/semantic/spacing.js.map +1 -1
- package/dist/tokens/semantic/typography.js +4 -1
- package/dist/tokens/semantic/typography.js.map +1 -1
- package/dist/types/index.js +2 -1
- package/dist/types/index.js.map +1 -1
- package/dist/utils/index.js +2 -1
- package/dist/utils/index.js.map +1 -1
- package/dist/utils/sprinklesUtils.js +6 -3
- package/dist/utils/sprinklesUtils.js.map +1 -1
- package/dist/utils/styleUtils.css.js +6 -3
- package/dist/utils/styleUtils.css.js.map +1 -1
- package/package.json +1 -5
|
@@ -1,11 +1,14 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
2
|
+
import "../../chunk-424PT5DM.js";
|
|
3
|
+
|
|
4
|
+
// src/components/Tabs/TabsTrigger.tsx
|
|
3
5
|
import { forwardRef, useContext } from "react";
|
|
4
6
|
import clsx from "clsx";
|
|
5
|
-
import { sx } from "#styles";
|
|
6
|
-
import { TabsContext } from "./TabsProvider";
|
|
7
|
-
import * as s from "./TabsTrigger.css";
|
|
8
|
-
|
|
7
|
+
import { sx } from "#styles.mjs";
|
|
8
|
+
import { TabsContext } from "./TabsProvider.mjs";
|
|
9
|
+
import * as s from "./TabsTrigger.css.mjs";
|
|
10
|
+
import { jsx } from "react/jsx-runtime";
|
|
11
|
+
var TabsTrigger = forwardRef(
|
|
9
12
|
({ children, value, className, sx: propSx, ...props }, ref) => {
|
|
10
13
|
const tabsContext = useContext(TabsContext);
|
|
11
14
|
if (tabsContext === void 0) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Tabs/TabsTrigger.tsx"],"sourcesContent":["'use client';\n\nimport { forwardRef, useContext } from 'react';\n\nimport clsx from 'clsx';\n\nimport { sx } from '#styles';\nimport type { UIComponent } from '#types';\n\nimport { TabsContext } from './TabsProvider';\nimport * as s from './TabsTrigger.css';\n\ninterface TabsTriggerProps extends UIComponent<'button'> {\n value: number | string;\n}\n\nexport const TabsTrigger = forwardRef<HTMLButtonElement, TabsTriggerProps>(\n ({ children, value, className, sx: propSx, ...props }, ref) => {\n const tabsContext = useContext(TabsContext);\n\n if (tabsContext === undefined) {\n throw new Error('TabsTrigger must be used within a Tabs.');\n }\n\n const isSelected = tabsContext.value === value;\n\n const handleClick = () => {\n tabsContext.setValue(value);\n };\n\n return (\n <button\n ref={ref}\n className={clsx(className, s.container({ isSelected }), sx(propSx))}\n onClick={handleClick}\n {...props}\n >\n {children}\n </button>\n );\n },\n);\nTabsTrigger.displayName = 'TabsTrigger';\n"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Tabs/TabsTrigger.tsx"],"sourcesContent":["'use client';\n\nimport { forwardRef, useContext } from 'react';\n\nimport clsx from 'clsx';\n\nimport { sx } from '#styles';\nimport type { UIComponent } from '#types';\n\nimport { TabsContext } from './TabsProvider';\nimport * as s from './TabsTrigger.css';\n\ninterface TabsTriggerProps extends UIComponent<'button'> {\n value: number | string;\n}\n\nexport const TabsTrigger = forwardRef<HTMLButtonElement, TabsTriggerProps>(\n ({ children, value, className, sx: propSx, ...props }, ref) => {\n const tabsContext = useContext(TabsContext);\n\n if (tabsContext === undefined) {\n throw new Error('TabsTrigger must be used within a Tabs.');\n }\n\n const isSelected = tabsContext.value === value;\n\n const handleClick = () => {\n tabsContext.setValue(value);\n };\n\n return (\n <button\n ref={ref}\n className={clsx(className, s.container({ isSelected }), sx(propSx))}\n onClick={handleClick}\n {...props}\n >\n {children}\n </button>\n );\n },\n);\nTabsTrigger.displayName = 'TabsTrigger';\n"],"mappings":";;;;AAEA,SAAS,YAAY,kBAAkB;AAEvC,OAAO,UAAU;AAEjB,SAAS,UAAU;AAGnB,SAAS,mBAAmB;AAC5B,YAAY,OAAO;AAqBb;AAfC,IAAM,cAAc;AAAA,EACzB,CAAC,EAAE,UAAU,OAAO,WAAW,IAAI,QAAQ,GAAG,MAAM,GAAG,QAAQ;AAC7D,UAAM,cAAc,WAAW,WAAW;AAE1C,QAAI,gBAAgB,QAAW;AAC7B,YAAM,IAAI,MAAM,yCAAyC;AAAA,IAC3D;AAEA,UAAM,aAAa,YAAY,UAAU;AAEzC,UAAM,cAAc,MAAM;AACxB,kBAAY,SAAS,KAAK;AAAA,IAC5B;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW,KAAK,WAAa,YAAU,EAAE,WAAW,CAAC,GAAG,GAAG,MAAM,CAAC;AAAA,QAClE,SAAS;AAAA,QACR,GAAG;AAAA,QAEH;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACA,YAAY,cAAc;","names":[]}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
export * from "./
|
|
3
|
-
export * from "./
|
|
4
|
-
export * from "./
|
|
1
|
+
// src/components/Tabs/index.ts
|
|
2
|
+
export * from "./Tabs.mjs";
|
|
3
|
+
export * from "./TabsContent.mjs";
|
|
4
|
+
export * from "./TabsList.mjs";
|
|
5
|
+
export * from "./TabsTrigger.mjs";
|
|
5
6
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Tabs/index.ts"],"sourcesContent":["export * from './Tabs';\nexport * from './TabsContent';\nexport * from './TabsList';\nexport * from './TabsTrigger';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Tabs/index.ts"],"sourcesContent":["export * from './Tabs';\nexport * from './TabsContent';\nexport * from './TabsList';\nexport * from './TabsTrigger';\n"],"mappings":";AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}
|
|
@@ -1,10 +1,13 @@
|
|
|
1
|
+
import "../../chunk-424PT5DM.js";
|
|
2
|
+
|
|
3
|
+
// src/components/TextField/TextField.css.ts
|
|
1
4
|
import { createVar } from "@vanilla-extract/css";
|
|
2
|
-
import { recipeWithLayer, styleWithLayer } from "#styleUtils";
|
|
3
|
-
import { theme } from "#themes";
|
|
4
|
-
import { semanticColor } from "#tokens";
|
|
5
|
-
import { SCALE_COLOR } from "../../tokens/scale/color";
|
|
6
|
-
|
|
7
|
-
|
|
5
|
+
import { recipeWithLayer, styleWithLayer } from "#styleUtils.mjs";
|
|
6
|
+
import { theme } from "#themes.mjs";
|
|
7
|
+
import { semanticColor } from "#tokens.mjs";
|
|
8
|
+
import { SCALE_COLOR } from "../../tokens/scale/color.mjs";
|
|
9
|
+
var backgroundVar = createVar();
|
|
10
|
+
var semanticColors = semanticColor.reduce(
|
|
8
11
|
(prev, color) => ({
|
|
9
12
|
...prev,
|
|
10
13
|
[color]: styleWithLayer({
|
|
@@ -15,7 +18,7 @@ const semanticColors = semanticColor.reduce(
|
|
|
15
18
|
}),
|
|
16
19
|
{}
|
|
17
20
|
);
|
|
18
|
-
|
|
21
|
+
var scaleColors = SCALE_COLOR.reduce(
|
|
19
22
|
(prev, value) => ({
|
|
20
23
|
...prev,
|
|
21
24
|
[value]: styleWithLayer({
|
|
@@ -26,7 +29,7 @@ const scaleColors = SCALE_COLOR.reduce(
|
|
|
26
29
|
}),
|
|
27
30
|
{}
|
|
28
31
|
);
|
|
29
|
-
|
|
32
|
+
var textField = recipeWithLayer({
|
|
30
33
|
base: {
|
|
31
34
|
padding: "0.75em 0.5em",
|
|
32
35
|
border: `1px solid`,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/TextField/TextField.css.ts"],"sourcesContent":["import { createVar } from '@vanilla-extract/css';\n\nimport { recipeWithLayer, styleWithLayer } from '#styleUtils';\nimport { theme } from '#themes';\nimport { semanticColor } from '#tokens';\n\nimport { SCALE_COLOR, type ScaleColor } from '../../tokens/scale/color';\n\nconst backgroundVar = createVar();\n\nconst semanticColors = semanticColor.reduce(\n (prev, color) => ({\n ...prev,\n [color]: styleWithLayer({\n vars: {\n [backgroundVar]: theme.color[color],\n },\n }),\n }),\n {} as Record<(typeof semanticColor)[number], string>,\n);\n\nconst scaleColors = SCALE_COLOR.reduce(\n (prev, value) => ({\n ...prev,\n [value]: styleWithLayer({\n vars: {\n [backgroundVar]: theme.color[value][500],\n },\n }),\n }),\n {} as Record<ScaleColor, string>,\n);\n\nexport const textField = recipeWithLayer({\n base: {\n padding: '0.75em 0.5em',\n border: `1px solid`,\n borderColor: ` rgb(${theme.color.border})`,\n\n backgroundColor: `rgb(${theme.color.background})`,\n\n color: `rgb(${theme.color.foreground})`,\n\n transition: 'border-color 0.15s ease, color 0.15s ease',\n\n outline: 'none',\n\n ':focus': {\n borderColor: `rgb(${backgroundVar})`,\n },\n\n ':disabled': {\n color: `rgb(${theme.color['muted-foreground']})`,\n },\n },\n variants: {\n color: {\n ...semanticColors,\n ...scaleColors,\n },\n\n size: {\n sm: {\n borderRadius: theme.borderRadius,\n\n fontSize: '0.875em',\n },\n md: {\n borderRadius: theme.borderRadius,\n\n fontSize: '1em',\n },\n lg: {\n borderRadius: theme.borderRadius,\n\n fontSize: '1.125em',\n },\n },\n },\n});\n"],"mappings":"AAAA,SAAS,iBAAiB;AAE1B,SAAS,iBAAiB,sBAAsB;AAChD,SAAS,aAAa;AACtB,SAAS,qBAAqB;AAE9B,SAAS,mBAAoC;AAE7C,
|
|
1
|
+
{"version":3,"sources":["../../../src/components/TextField/TextField.css.ts"],"sourcesContent":["import { createVar } from '@vanilla-extract/css';\n\nimport { recipeWithLayer, styleWithLayer } from '#styleUtils';\nimport { theme } from '#themes';\nimport { semanticColor } from '#tokens';\n\nimport { SCALE_COLOR, type ScaleColor } from '../../tokens/scale/color';\n\nconst backgroundVar = createVar();\n\nconst semanticColors = semanticColor.reduce(\n (prev, color) => ({\n ...prev,\n [color]: styleWithLayer({\n vars: {\n [backgroundVar]: theme.color[color],\n },\n }),\n }),\n {} as Record<(typeof semanticColor)[number], string>,\n);\n\nconst scaleColors = SCALE_COLOR.reduce(\n (prev, value) => ({\n ...prev,\n [value]: styleWithLayer({\n vars: {\n [backgroundVar]: theme.color[value][500],\n },\n }),\n }),\n {} as Record<ScaleColor, string>,\n);\n\nexport const textField = recipeWithLayer({\n base: {\n padding: '0.75em 0.5em',\n border: `1px solid`,\n borderColor: ` rgb(${theme.color.border})`,\n\n backgroundColor: `rgb(${theme.color.background})`,\n\n color: `rgb(${theme.color.foreground})`,\n\n transition: 'border-color 0.15s ease, color 0.15s ease',\n\n outline: 'none',\n\n ':focus': {\n borderColor: `rgb(${backgroundVar})`,\n },\n\n ':disabled': {\n color: `rgb(${theme.color['muted-foreground']})`,\n },\n },\n variants: {\n color: {\n ...semanticColors,\n ...scaleColors,\n },\n\n size: {\n sm: {\n borderRadius: theme.borderRadius,\n\n fontSize: '0.875em',\n },\n md: {\n borderRadius: theme.borderRadius,\n\n fontSize: '1em',\n },\n lg: {\n borderRadius: theme.borderRadius,\n\n fontSize: '1.125em',\n },\n },\n },\n});\n"],"mappings":";;;AAAA,SAAS,iBAAiB;AAE1B,SAAS,iBAAiB,sBAAsB;AAChD,SAAS,aAAa;AACtB,SAAS,qBAAqB;AAE9B,SAAS,mBAAoC;AAE7C,IAAM,gBAAgB,UAAU;AAEhC,IAAM,iBAAiB,cAAc;AAAA,EACnC,CAAC,MAAM,WAAW;AAAA,IAChB,GAAG;AAAA,IACH,CAAC,KAAK,GAAG,eAAe;AAAA,MACtB,MAAM;AAAA,QACJ,CAAC,aAAa,GAAG,MAAM,MAAM,KAAK;AAAA,MACpC;AAAA,IACF,CAAC;AAAA,EACH;AAAA,EACA,CAAC;AACH;AAEA,IAAM,cAAc,YAAY;AAAA,EAC9B,CAAC,MAAM,WAAW;AAAA,IAChB,GAAG;AAAA,IACH,CAAC,KAAK,GAAG,eAAe;AAAA,MACtB,MAAM;AAAA,QACJ,CAAC,aAAa,GAAG,MAAM,MAAM,KAAK,EAAE,GAAG;AAAA,MACzC;AAAA,IACF,CAAC;AAAA,EACH;AAAA,EACA,CAAC;AACH;AAEO,IAAM,YAAY,gBAAgB;AAAA,EACvC,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,aAAa,QAAQ,MAAM,MAAM,MAAM;AAAA,IAEvC,iBAAiB,OAAO,MAAM,MAAM,UAAU;AAAA,IAE9C,OAAO,OAAO,MAAM,MAAM,UAAU;AAAA,IAEpC,YAAY;AAAA,IAEZ,SAAS;AAAA,IAET,UAAU;AAAA,MACR,aAAa,OAAO,aAAa;AAAA,IACnC;AAAA,IAEA,aAAa;AAAA,MACX,OAAO,OAAO,MAAM,MAAM,kBAAkB,CAAC;AAAA,IAC/C;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,OAAO;AAAA,MACL,GAAG;AAAA,MACH,GAAG;AAAA,IACL;AAAA,IAEA,MAAM;AAAA,MACJ,IAAI;AAAA,QACF,cAAc,MAAM;AAAA,QAEpB,UAAU;AAAA,MACZ;AAAA,MACA,IAAI;AAAA,QACF,cAAc,MAAM;AAAA,QAEpB,UAAU;AAAA,MACZ;AAAA,MACA,IAAI;AAAA,QACF,cAAc,MAAM;AAAA,QAEpB,UAAU;AAAA,MACZ;AAAA,IACF;AAAA,EACF;AACF,CAAC;","names":[]}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
import {
|
|
1
|
+
// src/components/TextField/TextField.spec.tsx
|
|
2
|
+
import { TextField } from "./index.mjs";
|
|
3
|
+
import { uiTest } from "../../tests/uiTest.mjs";
|
|
3
4
|
describe("TextField \uCEF4\uD3EC\uB10C\uD2B8", () => {
|
|
4
5
|
uiTest(TextField, "TextField");
|
|
5
6
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/TextField/TextField.spec.tsx"],"sourcesContent":["import { TextField } from '.';\nimport { uiTest } from '../../tests/uiTest';\n\ndescribe('TextField 컴포넌트', () => {\n uiTest(TextField, 'TextField');\n});\n"],"mappings":"AAAA,SAAS,iBAAiB;AAC1B,SAAS,cAAc;AAEvB,SAAS,sCAAkB,MAAM;AAC/B,SAAO,WAAW,WAAW;AAC/B,CAAC;","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/TextField/TextField.spec.tsx"],"sourcesContent":["import { TextField } from '.';\nimport { uiTest } from '../../tests/uiTest';\n\ndescribe('TextField 컴포넌트', () => {\n uiTest(TextField, 'TextField');\n});\n"],"mappings":";AAAA,SAAS,iBAAiB;AAC1B,SAAS,cAAc;AAEvB,SAAS,sCAAkB,MAAM;AAC/B,SAAO,WAAW,WAAW;AAC/B,CAAC;","names":[]}
|
|
@@ -1,9 +1,12 @@
|
|
|
1
|
-
import
|
|
1
|
+
import "../../chunk-424PT5DM.js";
|
|
2
|
+
|
|
3
|
+
// src/components/TextField/index.tsx
|
|
2
4
|
import { forwardRef } from "react";
|
|
3
5
|
import { clsx } from "clsx";
|
|
4
|
-
import { sx } from "#styles";
|
|
5
|
-
import * as s from "./TextField.css";
|
|
6
|
-
|
|
6
|
+
import { sx } from "#styles.mjs";
|
|
7
|
+
import * as s from "./TextField.css.mjs";
|
|
8
|
+
import { jsx } from "react/jsx-runtime";
|
|
9
|
+
var TextField = forwardRef(
|
|
7
10
|
({
|
|
8
11
|
className,
|
|
9
12
|
type = "text",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/TextField/index.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport { clsx } from 'clsx';\n\nimport { sx } from '#styles';\nimport type { UIComponent } from '#types';\n\nimport * as s from './TextField.css';\n\ninterface TextFieldProps extends UIComponent<'input', typeof s.textField> {\n type?: React.HTMLInputTypeAttribute;\n}\n\nexport const TextField = forwardRef<HTMLInputElement, TextFieldProps>(\n (\n {\n className,\n type = 'text',\n size = 'md',\n color = 'primary',\n sx: propSx,\n ...props\n },\n ref,\n ) => {\n return (\n <input\n ref={ref}\n type={type}\n className={clsx(className, s.textField({ size, color }), sx(propSx))}\n {...props}\n />\n );\n },\n);\nTextField.displayName = 'TextField';\n\nexport { s as textFieldCss };\n"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../src/components/TextField/index.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport { clsx } from 'clsx';\n\nimport { sx } from '#styles';\nimport type { UIComponent } from '#types';\n\nimport * as s from './TextField.css';\n\ninterface TextFieldProps extends UIComponent<'input', typeof s.textField> {\n type?: React.HTMLInputTypeAttribute;\n}\n\nexport const TextField = forwardRef<HTMLInputElement, TextFieldProps>(\n (\n {\n className,\n type = 'text',\n size = 'md',\n color = 'primary',\n sx: propSx,\n ...props\n },\n ref,\n ) => {\n return (\n <input\n ref={ref}\n type={type}\n className={clsx(className, s.textField({ size, color }), sx(propSx))}\n {...props}\n />\n );\n },\n);\nTextField.displayName = 'TextField';\n\nexport { s as textFieldCss };\n"],"mappings":";;;AAAA,SAAS,kBAAkB;AAE3B,SAAS,YAAY;AAErB,SAAS,UAAU;AAGnB,YAAY,OAAO;AAmBb;AAbC,IAAM,YAAY;AAAA,EACvB,CACE;AAAA,IACE;AAAA,IACA,OAAO;AAAA,IACP,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,IAAI;AAAA,IACJ,GAAG;AAAA,EACL,GACA,QACG;AACH,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,WAAW,KAAK,WAAa,YAAU,EAAE,MAAM,MAAM,CAAC,GAAG,GAAG,MAAM,CAAC;AAAA,QAClE,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AACA,UAAU,cAAc;","names":[]}
|
|
@@ -1,10 +1,13 @@
|
|
|
1
|
+
import "../../chunk-424PT5DM.js";
|
|
2
|
+
|
|
3
|
+
// src/components/Toast/Toast.css.ts
|
|
1
4
|
import { createVar, keyframes } from "@vanilla-extract/css";
|
|
2
|
-
import { recipeWithLayer, styleWithLayer } from "#styleUtils";
|
|
3
|
-
import { theme } from "#themes";
|
|
4
|
-
import { semanticColor } from "#tokens";
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
5
|
+
import { recipeWithLayer, styleWithLayer } from "#styleUtils.mjs";
|
|
6
|
+
import { theme } from "#themes.mjs";
|
|
7
|
+
import { semanticColor } from "#tokens.mjs";
|
|
8
|
+
var colorVar = createVar();
|
|
9
|
+
var foregroundVar = createVar();
|
|
10
|
+
var semanticColors = semanticColor.reduce(
|
|
8
11
|
(prev, color) => ({
|
|
9
12
|
...prev,
|
|
10
13
|
[color]: styleWithLayer({
|
|
@@ -16,7 +19,7 @@ const semanticColors = semanticColor.reduce(
|
|
|
16
19
|
}),
|
|
17
20
|
{}
|
|
18
21
|
);
|
|
19
|
-
|
|
22
|
+
var fill = keyframes({
|
|
20
23
|
"0%": {
|
|
21
24
|
transform: "scaleX(0)"
|
|
22
25
|
},
|
|
@@ -24,7 +27,7 @@ const fill = keyframes({
|
|
|
24
27
|
transform: "scaleX(1)"
|
|
25
28
|
}
|
|
26
29
|
});
|
|
27
|
-
|
|
30
|
+
var progress = recipeWithLayer({
|
|
28
31
|
base: {
|
|
29
32
|
position: "absolute",
|
|
30
33
|
inset: "0",
|
|
@@ -46,7 +49,7 @@ const progress = recipeWithLayer({
|
|
|
46
49
|
}
|
|
47
50
|
}
|
|
48
51
|
});
|
|
49
|
-
|
|
52
|
+
var toast = recipeWithLayer({
|
|
50
53
|
base: {
|
|
51
54
|
position: "relative",
|
|
52
55
|
overflow: "hidden",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Toast/Toast.css.ts"],"sourcesContent":["import { createVar, keyframes } from '@vanilla-extract/css';\n\nimport { recipeWithLayer, styleWithLayer } from '#styleUtils';\nimport { theme } from '#themes';\nimport { semanticColor } from '#tokens';\n\nconst colorVar = createVar();\nconst foregroundVar = createVar();\n\nconst semanticColors = semanticColor.reduce(\n (prev, color) => ({\n ...prev,\n [color]: styleWithLayer({\n vars: {\n [colorVar]: theme.color[color],\n [foregroundVar]: theme.color[`${color}-foreground`],\n },\n }),\n }),\n {} as Record<(typeof semanticColor)[number], string>,\n);\n\nconst fill = keyframes({\n '0%': {\n transform: 'scaleX(0)',\n },\n '100%': {\n transform: 'scaleX(1)',\n },\n});\n\nexport const progress = recipeWithLayer({\n base: {\n position: 'absolute',\n inset: '0',\n\n width: '100%',\n\n backgroundColor: `rgba(${foregroundVar}, 0.25)`,\n\n transformOrigin: '0 0',\n },\n\n variants: {\n animation: {\n true: {\n animationName: fill,\n animationTimingFunction: 'linear',\n animationIterationCount: '1',\n animationFillMode: 'forwards',\n },\n false: {\n display: 'none',\n },\n },\n },\n});\n\nexport const toast = recipeWithLayer({\n base: {\n position: 'relative',\n overflow: 'hidden',\n\n padding: '0.875em',\n\n backgroundColor: `rgb(${colorVar})`,\n\n color: `rgb(${foregroundVar})`,\n whiteSpace: 'nowrap',\n wordBreak: 'break-all',\n\n cursor: 'pointer',\n },\n variants: {\n color: {\n ...semanticColors,\n },\n },\n});\n"],"mappings":"AAAA,SAAS,WAAW,iBAAiB;AAErC,SAAS,iBAAiB,sBAAsB;AAChD,SAAS,aAAa;AACtB,SAAS,qBAAqB;AAE9B,
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Toast/Toast.css.ts"],"sourcesContent":["import { createVar, keyframes } from '@vanilla-extract/css';\n\nimport { recipeWithLayer, styleWithLayer } from '#styleUtils';\nimport { theme } from '#themes';\nimport { semanticColor } from '#tokens';\n\nconst colorVar = createVar();\nconst foregroundVar = createVar();\n\nconst semanticColors = semanticColor.reduce(\n (prev, color) => ({\n ...prev,\n [color]: styleWithLayer({\n vars: {\n [colorVar]: theme.color[color],\n [foregroundVar]: theme.color[`${color}-foreground`],\n },\n }),\n }),\n {} as Record<(typeof semanticColor)[number], string>,\n);\n\nconst fill = keyframes({\n '0%': {\n transform: 'scaleX(0)',\n },\n '100%': {\n transform: 'scaleX(1)',\n },\n});\n\nexport const progress = recipeWithLayer({\n base: {\n position: 'absolute',\n inset: '0',\n\n width: '100%',\n\n backgroundColor: `rgba(${foregroundVar}, 0.25)`,\n\n transformOrigin: '0 0',\n },\n\n variants: {\n animation: {\n true: {\n animationName: fill,\n animationTimingFunction: 'linear',\n animationIterationCount: '1',\n animationFillMode: 'forwards',\n },\n false: {\n display: 'none',\n },\n },\n },\n});\n\nexport const toast = recipeWithLayer({\n base: {\n position: 'relative',\n overflow: 'hidden',\n\n padding: '0.875em',\n\n backgroundColor: `rgb(${colorVar})`,\n\n color: `rgb(${foregroundVar})`,\n whiteSpace: 'nowrap',\n wordBreak: 'break-all',\n\n cursor: 'pointer',\n },\n variants: {\n color: {\n ...semanticColors,\n },\n },\n});\n"],"mappings":";;;AAAA,SAAS,WAAW,iBAAiB;AAErC,SAAS,iBAAiB,sBAAsB;AAChD,SAAS,aAAa;AACtB,SAAS,qBAAqB;AAE9B,IAAM,WAAW,UAAU;AAC3B,IAAM,gBAAgB,UAAU;AAEhC,IAAM,iBAAiB,cAAc;AAAA,EACnC,CAAC,MAAM,WAAW;AAAA,IAChB,GAAG;AAAA,IACH,CAAC,KAAK,GAAG,eAAe;AAAA,MACtB,MAAM;AAAA,QACJ,CAAC,QAAQ,GAAG,MAAM,MAAM,KAAK;AAAA,QAC7B,CAAC,aAAa,GAAG,MAAM,MAAM,GAAG,KAAK,aAAa;AAAA,MACpD;AAAA,IACF,CAAC;AAAA,EACH;AAAA,EACA,CAAC;AACH;AAEA,IAAM,OAAO,UAAU;AAAA,EACrB,MAAM;AAAA,IACJ,WAAW;AAAA,EACb;AAAA,EACA,QAAQ;AAAA,IACN,WAAW;AAAA,EACb;AACF,CAAC;AAEM,IAAM,WAAW,gBAAgB;AAAA,EACtC,MAAM;AAAA,IACJ,UAAU;AAAA,IACV,OAAO;AAAA,IAEP,OAAO;AAAA,IAEP,iBAAiB,QAAQ,aAAa;AAAA,IAEtC,iBAAiB;AAAA,EACnB;AAAA,EAEA,UAAU;AAAA,IACR,WAAW;AAAA,MACT,MAAM;AAAA,QACJ,eAAe;AAAA,QACf,yBAAyB;AAAA,QACzB,yBAAyB;AAAA,QACzB,mBAAmB;AAAA,MACrB;AAAA,MACA,OAAO;AAAA,QACL,SAAS;AAAA,MACX;AAAA,IACF;AAAA,EACF;AACF,CAAC;AAEM,IAAM,QAAQ,gBAAgB;AAAA,EACnC,MAAM;AAAA,IACJ,UAAU;AAAA,IACV,UAAU;AAAA,IAEV,SAAS;AAAA,IAET,iBAAiB,OAAO,QAAQ;AAAA,IAEhC,OAAO,OAAO,aAAa;AAAA,IAC3B,YAAY;AAAA,IACZ,WAAW;AAAA,IAEX,QAAQ;AAAA,EACV;AAAA,EACA,UAAU;AAAA,IACR,OAAO;AAAA,MACL,GAAG;AAAA,IACL;AAAA,EACF;AACF,CAAC;","names":[]}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
import {
|
|
1
|
+
// src/components/Toast/Toast.spec.tsx
|
|
2
|
+
import { Toast } from "./index.mjs";
|
|
3
|
+
import { uiTest } from "../../tests/uiTest.mjs";
|
|
3
4
|
describe("Toast \uCEF4\uD3EC\uB10C\uD2B8", () => {
|
|
4
5
|
uiTest(Toast, "Toast");
|
|
5
6
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Toast/Toast.spec.tsx"],"sourcesContent":["import { Toast } from '.';\nimport { uiTest } from '../../tests/uiTest';\n\ndescribe('Toast 컴포넌트', () => {\n uiTest(Toast, 'Toast');\n});\n"],"mappings":"AAAA,SAAS,aAAa;AACtB,SAAS,cAAc;AAEvB,SAAS,kCAAc,MAAM;AAC3B,SAAO,OAAO,OAAO;AACvB,CAAC;","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Toast/Toast.spec.tsx"],"sourcesContent":["import { Toast } from '.';\nimport { uiTest } from '../../tests/uiTest';\n\ndescribe('Toast 컴포넌트', () => {\n uiTest(Toast, 'Toast');\n});\n"],"mappings":";AAAA,SAAS,aAAa;AACtB,SAAS,cAAc;AAEvB,SAAS,kCAAc,MAAM;AAC3B,SAAO,OAAO,OAAO;AACvB,CAAC;","names":[]}
|
|
@@ -1,10 +1,13 @@
|
|
|
1
|
-
import
|
|
1
|
+
import "../../chunk-424PT5DM.js";
|
|
2
|
+
|
|
3
|
+
// src/components/Toast/index.tsx
|
|
2
4
|
import { forwardRef } from "react";
|
|
3
5
|
import clsx from "clsx";
|
|
4
|
-
import { Box } from "#components";
|
|
5
|
-
import { sx } from "#styles";
|
|
6
|
-
import * as s from "./Toast.css";
|
|
7
|
-
|
|
6
|
+
import { Box } from "#components.mjs";
|
|
7
|
+
import { sx } from "#styles.mjs";
|
|
8
|
+
import * as s from "./Toast.css.mjs";
|
|
9
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
10
|
+
var Toast = forwardRef(
|
|
8
11
|
({
|
|
9
12
|
children,
|
|
10
13
|
color = "accent",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Toast/index.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport clsx from 'clsx';\n\nimport { Box } from '#components';\nimport { sx } from '#styles';\nimport type { UIComponent } from '#types';\n\nimport * as s from './Toast.css';\n\ninterface ToastProps extends UIComponent<'div', typeof s.toast> {\n duration?: number;\n}\n\nexport const Toast = forwardRef<HTMLDivElement, ToastProps>(\n (\n {\n children,\n color = 'accent',\n className,\n duration = 0,\n sx: propSx,\n ...props\n },\n ref,\n ) => {\n return (\n <Box\n ref={ref}\n boxShadow=\"accent-sm\"\n rounded\n className={clsx(s.toast({ color }), className, sx(propSx))}\n {...props}\n >\n <div\n className={s.progress({ animation: duration !== 0 })}\n style={{\n animationDuration: duration > 0 ? `${duration}ms` : undefined,\n }}\n ></div>\n <span style={{ position: 'relative' }}>{children}</span>\n </Box>\n );\n },\n);\nToast.displayName = 'Toast';\n\nexport { s as toastCss };\n"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Toast/index.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport clsx from 'clsx';\n\nimport { Box } from '#components';\nimport { sx } from '#styles';\nimport type { UIComponent } from '#types';\n\nimport * as s from './Toast.css';\n\ninterface ToastProps extends UIComponent<'div', typeof s.toast> {\n duration?: number;\n}\n\nexport const Toast = forwardRef<HTMLDivElement, ToastProps>(\n (\n {\n children,\n color = 'accent',\n className,\n duration = 0,\n sx: propSx,\n ...props\n },\n ref,\n ) => {\n return (\n <Box\n ref={ref}\n boxShadow=\"accent-sm\"\n rounded\n className={clsx(s.toast({ color }), className, sx(propSx))}\n {...props}\n >\n <div\n className={s.progress({ animation: duration !== 0 })}\n style={{\n animationDuration: duration > 0 ? `${duration}ms` : undefined,\n }}\n ></div>\n <span style={{ position: 'relative' }}>{children}</span>\n </Box>\n );\n },\n);\nToast.displayName = 'Toast';\n\nexport { s as toastCss };\n"],"mappings":";;;AAAA,SAAS,kBAAkB;AAE3B,OAAO,UAAU;AAEjB,SAAS,WAAW;AACpB,SAAS,UAAU;AAGnB,YAAY,OAAO;AAmBb,SAOE,KAPF;AAbC,IAAM,QAAQ;AAAA,EACnB,CACE;AAAA,IACE;AAAA,IACA,QAAQ;AAAA,IACR;AAAA,IACA,WAAW;AAAA,IACX,IAAI;AAAA,IACJ,GAAG;AAAA,EACL,GACA,QACG;AACH,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAU;AAAA,QACV,SAAO;AAAA,QACP,WAAW,KAAO,QAAM,EAAE,MAAM,CAAC,GAAG,WAAW,GAAG,MAAM,CAAC;AAAA,QACxD,GAAG;AAAA,QAEJ;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,WAAa,WAAS,EAAE,WAAW,aAAa,EAAE,CAAC;AAAA,cACnD,OAAO;AAAA,gBACL,mBAAmB,WAAW,IAAI,GAAG,QAAQ,OAAO;AAAA,cACtD;AAAA;AAAA,UACD;AAAA,UACD,oBAAC,UAAK,OAAO,EAAE,UAAU,WAAW,GAAI,UAAS;AAAA;AAAA;AAAA,IACnD;AAAA,EAEJ;AACF;AACA,MAAM,cAAc;","names":[]}
|
|
@@ -1,5 +1,8 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
1
|
+
import "../../chunk-424PT5DM.js";
|
|
2
|
+
|
|
3
|
+
// src/components/Typography/Typography.css.ts
|
|
4
|
+
import { recipeWithLayer } from "#styleUtils.mjs";
|
|
5
|
+
var typography = recipeWithLayer({
|
|
3
6
|
base: {
|
|
4
7
|
margin: "0"
|
|
5
8
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Typography/Typography.css.ts"],"sourcesContent":["import { recipeWithLayer } from '#styleUtils';\n\nexport const typography = recipeWithLayer({\n base: {\n margin: '0',\n },\n variants: {\n isEllipsis: {\n true: {\n overflow: 'hidden',\n\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n },\n },\n },\n});\n"],"mappings":"AAAA,SAAS,uBAAuB;AAEzB,
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Typography/Typography.css.ts"],"sourcesContent":["import { recipeWithLayer } from '#styleUtils';\n\nexport const typography = recipeWithLayer({\n base: {\n margin: '0',\n },\n variants: {\n isEllipsis: {\n true: {\n overflow: 'hidden',\n\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n },\n },\n },\n});\n"],"mappings":";;;AAAA,SAAS,uBAAuB;AAEzB,IAAM,aAAa,gBAAgB;AAAA,EACxC,MAAM;AAAA,IACJ,QAAQ;AAAA,EACV;AAAA,EACA,UAAU;AAAA,IACR,YAAY;AAAA,MACV,MAAM;AAAA,QACJ,UAAU;AAAA,QAEV,YAAY;AAAA,QACZ,cAAc;AAAA,MAChB;AAAA,IACF;AAAA,EACF;AACF,CAAC;","names":[]}
|
|
@@ -1,12 +1,19 @@
|
|
|
1
|
+
import {
|
|
2
|
+
cleanup,
|
|
3
|
+
react_esm_exports,
|
|
4
|
+
render
|
|
5
|
+
} from "../../chunk-PCAHVFSY.js";
|
|
6
|
+
import "../../chunk-424PT5DM.js";
|
|
7
|
+
|
|
8
|
+
// src/components/Typography/Typography.spec.tsx
|
|
9
|
+
import { Typography } from "#components.mjs";
|
|
10
|
+
import { uiTest } from "../../tests/uiTest.mjs";
|
|
1
11
|
import { jsx } from "react/jsx-runtime";
|
|
2
|
-
import { cleanup, render, screen } from "@testing-library/react";
|
|
3
|
-
import { Typography } from "#components";
|
|
4
|
-
import { uiTest } from "../../tests/uiTest";
|
|
5
12
|
describe("Typogrphy \uCEF4\uD3EC\uB10C\uD2B8", () => {
|
|
6
13
|
uiTest(Typography, "Typography");
|
|
7
14
|
test("\uAE30\uBCF8\uC801\uC73C\uB85C p\uD0DC\uADF8\uB85C \uCD9C\uB825\uD55C\uB2E4.", () => {
|
|
8
15
|
render(/* @__PURE__ */ jsx(Typography, { children: "test" }));
|
|
9
|
-
expect(screen.getByText("test").tagName.toLowerCase()).toBe("p");
|
|
16
|
+
expect(react_esm_exports.screen.getByText("test").tagName.toLowerCase()).toBe("p");
|
|
10
17
|
});
|
|
11
18
|
test("as\uC5D0 \uC804\uB2EC\uB41C \uC54C\uB9DE\uC740 \uD0DC\uADF8\uB85C \uCD9C\uB825\uD55C\uB2E4.", () => {
|
|
12
19
|
const tags = [
|
|
@@ -22,7 +29,7 @@ describe("Typogrphy \uCEF4\uD3EC\uB10C\uD2B8", () => {
|
|
|
22
29
|
for (const tag of tags) {
|
|
23
30
|
cleanup();
|
|
24
31
|
render(/* @__PURE__ */ jsx(Typography, { as: tag, children: "test" }));
|
|
25
|
-
expect(screen.getByText("test").tagName.toLowerCase()).toBe(tag);
|
|
32
|
+
expect(react_esm_exports.screen.getByText("test").tagName.toLowerCase()).toBe(tag);
|
|
26
33
|
}
|
|
27
34
|
});
|
|
28
35
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Typography/Typography.spec.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\n\nimport { cleanup, render, screen } from '@testing-library/react';\n\nimport { Typography } from '#components';\n\nimport { uiTest } from '../../tests/uiTest';\n\ndescribe('Typogrphy 컴포넌트', () => {\n uiTest(Typography, 'Typography');\n\n test('기본적으로 p태그로 출력한다.', () => {\n render(<Typography>test</Typography>);\n expect(screen.getByText('test').tagName.toLowerCase()).toBe('p');\n });\n\n test('as에 전달된 알맞은 태그로 출력한다.', () => {\n const tags: ComponentProps<typeof Typography>['as'][] = [\n 'p',\n 'h1',\n 'h2',\n 'h3',\n 'h4',\n 'h5',\n 'h6',\n 'span',\n ];\n\n for (const tag of tags) {\n cleanup();\n render(<Typography as={tag}>test</Typography>);\n expect(screen.getByText('test').tagName.toLowerCase()).toBe(tag);\n }\n });\n});\n"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Typography/Typography.spec.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\n\nimport { cleanup, render, screen } from '@testing-library/react';\n\nimport { Typography } from '#components';\n\nimport { uiTest } from '../../tests/uiTest';\n\ndescribe('Typogrphy 컴포넌트', () => {\n uiTest(Typography, 'Typography');\n\n test('기본적으로 p태그로 출력한다.', () => {\n render(<Typography>test</Typography>);\n expect(screen.getByText('test').tagName.toLowerCase()).toBe('p');\n });\n\n test('as에 전달된 알맞은 태그로 출력한다.', () => {\n const tags: ComponentProps<typeof Typography>['as'][] = [\n 'p',\n 'h1',\n 'h2',\n 'h3',\n 'h4',\n 'h5',\n 'h6',\n 'span',\n ];\n\n for (const tag of tags) {\n cleanup();\n render(<Typography as={tag}>test</Typography>);\n expect(screen.getByText('test').tagName.toLowerCase()).toBe(tag);\n }\n });\n});\n"],"mappings":";;;;;;;;AAIA,SAAS,kBAAkB;AAE3B,SAAS,cAAc;AAMZ;AAJX,SAAS,sCAAkB,MAAM;AAC/B,SAAO,YAAY,YAAY;AAE/B,OAAK,gFAAoB,MAAM;AAC7B,WAAO,oBAAC,cAAW,kBAAI,CAAa;AACpC,WAAO,yBAAO,UAAU,MAAM,EAAE,QAAQ,YAAY,CAAC,EAAE,KAAK,GAAG;AAAA,EACjE,CAAC;AAED,OAAK,+FAAyB,MAAM;AAClC,UAAM,OAAkD;AAAA,MACtD;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAEA,eAAW,OAAO,MAAM;AACtB,cAAQ;AACR,aAAO,oBAAC,cAAW,IAAI,KAAK,kBAAI,CAAa;AAC7C,aAAO,yBAAO,UAAU,MAAM,EAAE,QAAQ,YAAY,CAAC,EAAE,KAAK,GAAG;AAAA,IACjE;AAAA,EACF,CAAC;AACH,CAAC;","names":[]}
|
|
@@ -1,10 +1,13 @@
|
|
|
1
|
-
import
|
|
1
|
+
import "../../chunk-424PT5DM.js";
|
|
2
|
+
|
|
3
|
+
// src/components/Typography/index.tsx
|
|
2
4
|
import { forwardRef } from "react";
|
|
3
5
|
import clsx from "clsx";
|
|
4
|
-
import { sprinkles } from "#styles";
|
|
5
|
-
import
|
|
6
|
-
import * as s from "./Typography.css";
|
|
7
|
-
|
|
6
|
+
import { sprinkles } from "#styles.mjs";
|
|
7
|
+
import "#types.mjs";
|
|
8
|
+
import * as s from "./Typography.css.mjs";
|
|
9
|
+
import { jsx } from "react/jsx-runtime";
|
|
10
|
+
var Typography = forwardRef(
|
|
8
11
|
({
|
|
9
12
|
children,
|
|
10
13
|
as: Component = "p",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Typography/index.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport clsx from 'clsx';\n\nimport { sprinkles, type SprinklesProps } from '#styles';\nimport { type UIComponent } from '#types';\n\nimport * as s from './Typography.css';\n\ntype TypographyElement = 'p' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span';\n\ntype TypographyProps<T extends TypographyElement = TypographyElement> = Omit<\n UIComponent<T, typeof s.typography> & {\n as?: T;\n color?: SprinklesProps['color'];\n fontSize?: SprinklesProps['fontSize'];\n fontWeight?: SprinklesProps['fontWeight'];\n lineHeight?: SprinklesProps['lineHeight'];\n },\n 'ref'\n>;\n\nexport const Typography = forwardRef<HTMLParagraphElement, TypographyProps>(\n (\n {\n children,\n as: Component = 'p',\n className,\n color = 'foreground',\n fontSize = 'md',\n fontWeight = 'normal',\n lineHeight,\n isEllipsis = false,\n sx,\n ...props\n },\n ref,\n ) => {\n return (\n <Component\n ref={ref}\n className={clsx(\n s.typography({ isEllipsis }),\n sprinkles({ color, fontSize, fontWeight, lineHeight }),\n sx && sprinkles(sx),\n className,\n )}\n {...props}\n >\n {children}\n </Component>\n );\n },\n);\nTypography.displayName = 'Typography';\n\nexport { s as typographyCss };\n"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Typography/index.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport clsx from 'clsx';\n\nimport { sprinkles, type SprinklesProps } from '#styles';\nimport { type UIComponent } from '#types';\n\nimport * as s from './Typography.css';\n\ntype TypographyElement = 'p' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span';\n\ntype TypographyProps<T extends TypographyElement = TypographyElement> = Omit<\n UIComponent<T, typeof s.typography> & {\n as?: T;\n color?: SprinklesProps['color'];\n fontSize?: SprinklesProps['fontSize'];\n fontWeight?: SprinklesProps['fontWeight'];\n lineHeight?: SprinklesProps['lineHeight'];\n },\n 'ref'\n>;\n\nexport const Typography = forwardRef<HTMLParagraphElement, TypographyProps>(\n (\n {\n children,\n as: Component = 'p',\n className,\n color = 'foreground',\n fontSize = 'md',\n fontWeight = 'normal',\n lineHeight,\n isEllipsis = false,\n sx,\n ...props\n },\n ref,\n ) => {\n return (\n <Component\n ref={ref}\n className={clsx(\n s.typography({ isEllipsis }),\n sprinkles({ color, fontSize, fontWeight, lineHeight }),\n sx && sprinkles(sx),\n className,\n )}\n {...props}\n >\n {children}\n </Component>\n );\n },\n);\nTypography.displayName = 'Typography';\n\nexport { s as typographyCss };\n"],"mappings":";;;AAAA,SAAS,kBAAkB;AAE3B,OAAO,UAAU;AAEjB,SAAS,iBAAsC;AAC/C,OAAiC;AAEjC,YAAY,OAAO;AAgCb;AAjBC,IAAM,aAAa;AAAA,EACxB,CACE;AAAA,IACE;AAAA,IACA,IAAI,YAAY;AAAA,IAChB;AAAA,IACA,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,aAAa;AAAA,IACb;AAAA,IACA,aAAa;AAAA,IACb;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AACH,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW;AAAA,UACP,aAAW,EAAE,WAAW,CAAC;AAAA,UAC3B,UAAU,EAAE,OAAO,UAAU,YAAY,WAAW,CAAC;AAAA,UACrD,MAAM,UAAU,EAAE;AAAA,UAClB;AAAA,QACF;AAAA,QACC,GAAG;AAAA,QAEH;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACA,WAAW,cAAc;","names":[]}
|
package/dist/components/index.js
CHANGED
|
@@ -1,19 +1,20 @@
|
|
|
1
|
-
|
|
2
|
-
export * from "./
|
|
3
|
-
export * from "./
|
|
4
|
-
export * from "./
|
|
5
|
-
export * from "./
|
|
6
|
-
export * from "./
|
|
7
|
-
export * from "./
|
|
8
|
-
export * from "./
|
|
9
|
-
export * from "./
|
|
10
|
-
export * from "./
|
|
11
|
-
export * from "./
|
|
12
|
-
export * from "./
|
|
13
|
-
export * from "./
|
|
14
|
-
export * from "./
|
|
15
|
-
export * from "./
|
|
16
|
-
export * from "./
|
|
17
|
-
export * from "./
|
|
18
|
-
export * from "./
|
|
1
|
+
// src/components/index.ts
|
|
2
|
+
export * from "./Accordion/index.mjs";
|
|
3
|
+
export * from "./Alert/index.mjs";
|
|
4
|
+
export * from "./Box/index.mjs";
|
|
5
|
+
export * from "./Button/index.mjs";
|
|
6
|
+
export * from "./Card/index.mjs";
|
|
7
|
+
export * from "./Chip/index.mjs";
|
|
8
|
+
export * from "./Confirm/index.mjs";
|
|
9
|
+
export * from "./Dialog/index.mjs";
|
|
10
|
+
export * from "./Navigation/index.mjs";
|
|
11
|
+
export * from "./Range/index.mjs";
|
|
12
|
+
export * from "./ScrollArea/index.mjs";
|
|
13
|
+
export * from "./Select/index.mjs";
|
|
14
|
+
export * from "./Skeleton/index.mjs";
|
|
15
|
+
export * from "./Table/index.mjs";
|
|
16
|
+
export * from "./Tabs/index.mjs";
|
|
17
|
+
export * from "./TextField/index.mjs";
|
|
18
|
+
export * from "./Toast/index.mjs";
|
|
19
|
+
export * from "./Typography/index.mjs";
|
|
19
20
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/index.ts"],"sourcesContent":["export * from './Accordion';\nexport * from './Alert';\nexport * from './Box';\nexport * from './Button';\nexport * from './Card';\nexport * from './Chip';\nexport * from './Confirm';\nexport * from './Dialog';\nexport * from './Navigation';\nexport * from './Range';\nexport * from './ScrollArea';\nexport * from './Select';\nexport * from './Skeleton';\nexport * from './Table';\nexport * from './Tabs';\nexport * from './TextField';\nexport * from './Toast';\nexport * from './Typography';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../src/components/index.ts"],"sourcesContent":["export * from './Accordion';\nexport * from './Alert';\nexport * from './Box';\nexport * from './Button';\nexport * from './Card';\nexport * from './Chip';\nexport * from './Confirm';\nexport * from './Dialog';\nexport * from './Navigation';\nexport * from './Range';\nexport * from './ScrollArea';\nexport * from './Select';\nexport * from './Skeleton';\nexport * from './Table';\nexport * from './Tabs';\nexport * from './TextField';\nexport * from './Toast';\nexport * from './Typography';\n"],"mappings":";AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}
|
|
@@ -1,9 +1,12 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
2
|
+
import "../chunk-424PT5DM.js";
|
|
3
|
+
|
|
4
|
+
// src/contexts/UIProvider.tsx
|
|
3
5
|
import { OverlayProvider } from "@kimdw-rtk/utils";
|
|
4
|
-
import { ToastProvider } from "#hooks";
|
|
5
|
-
import * as overlayStyle from "../styles/overlay.css";
|
|
6
|
-
|
|
6
|
+
import { ToastProvider } from "#hooks.mjs";
|
|
7
|
+
import * as overlayStyle from "../styles/overlay.css.mjs";
|
|
8
|
+
import { Fragment, jsx } from "react/jsx-runtime";
|
|
9
|
+
var UIProvider = ({
|
|
7
10
|
children,
|
|
8
11
|
overlayUnmountOn = "transitionEnd"
|
|
9
12
|
}) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/contexts/UIProvider.tsx"],"sourcesContent":["'use client';\n\nimport type { ReactNode } from 'react';\n\nimport { OverlayProvider, type OverlayOption } from '@kimdw-rtk/utils';\n\nimport { ToastProvider } from '#hooks';\n\nimport * as overlayStyle from '../styles/overlay.css';\n\ninterface UIProviderProps {\n children: ReactNode;\n overlayUnmountOn?: OverlayOption['unmountOn'];\n}\n\nexport const UIProvider = ({\n children,\n overlayUnmountOn = 'transitionEnd',\n}: UIProviderProps) => {\n return (\n <>\n <OverlayProvider\n className={{ ...overlayStyle }}\n unmountOn={overlayUnmountOn}\n >\n <ToastProvider>{children}</ToastProvider>\n </OverlayProvider>\n </>\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../src/contexts/UIProvider.tsx"],"sourcesContent":["'use client';\n\nimport type { ReactNode } from 'react';\n\nimport { OverlayProvider, type OverlayOption } from '@kimdw-rtk/utils';\n\nimport { ToastProvider } from '#hooks';\n\nimport * as overlayStyle from '../styles/overlay.css';\n\ninterface UIProviderProps {\n children: ReactNode;\n overlayUnmountOn?: OverlayOption['unmountOn'];\n}\n\nexport const UIProvider = ({\n children,\n overlayUnmountOn = 'transitionEnd',\n}: UIProviderProps) => {\n return (\n <>\n <OverlayProvider\n className={{ ...overlayStyle }}\n unmountOn={overlayUnmountOn}\n >\n <ToastProvider>{children}</ToastProvider>\n </OverlayProvider>\n </>\n );\n};\n"],"mappings":";;;;AAIA,SAAS,uBAA2C;AAEpD,SAAS,qBAAqB;AAE9B,YAAY,kBAAkB;AAY1B,mBAKI,WALJ;AALG,IAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA,mBAAmB;AACrB,MAAuB;AACrB,SACE,gCACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,EAAE,GAAG,aAAa;AAAA,MAC7B,WAAW;AAAA,MAEX,8BAAC,iBAAe,UAAS;AAAA;AAAA,EAC3B,GACF;AAEJ;","names":[]}
|
package/dist/contexts/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/contexts/index.ts"],"sourcesContent":["export * from './UIProvider';\n"],"mappings":"AAAA,cAAc;","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../src/contexts/index.ts"],"sourcesContent":["export * from './UIProvider';\n"],"mappings":";AAAA,cAAc;","names":[]}
|
package/dist/hooks/index.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
|
-
|
|
2
|
-
export * from "./
|
|
3
|
-
export * from "./
|
|
4
|
-
export * from "./
|
|
5
|
-
export * from "./useToast/
|
|
1
|
+
// src/hooks/index.ts
|
|
2
|
+
export * from "./useDialog/index.mjs";
|
|
3
|
+
export * from "./usePointerSlider/index.mjs";
|
|
4
|
+
export * from "./useRipple/index.mjs";
|
|
5
|
+
export * from "./useToast/index.mjs";
|
|
6
|
+
export * from "./useToast/ToastProvider.mjs";
|
|
6
7
|
//# sourceMappingURL=index.js.map
|
package/dist/hooks/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/hooks/index.ts"],"sourcesContent":["export * from './useDialog';\nexport * from './usePointerSlider';\nexport * from './useRipple';\nexport * from './useToast';\nexport * from './useToast/ToastProvider';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../src/hooks/index.ts"],"sourcesContent":["export * from './useDialog';\nexport * from './usePointerSlider';\nexport * from './useRipple';\nexport * from './useToast';\nexport * from './useToast/ToastProvider';\n"],"mappings":";AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}
|
|
@@ -1,9 +1,12 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
2
|
+
import "../../chunk-424PT5DM.js";
|
|
3
|
+
|
|
4
|
+
// src/hooks/useDialog/index.tsx
|
|
3
5
|
import { useCallback, useMemo, useRef } from "react";
|
|
4
6
|
import { useOverlay } from "@kimdw-rtk/utils";
|
|
5
|
-
import { Alert, Confirm } from "#components";
|
|
6
|
-
|
|
7
|
+
import { Alert, Confirm } from "#components.mjs";
|
|
8
|
+
import { jsx } from "react/jsx-runtime";
|
|
9
|
+
var useDialog = () => {
|
|
7
10
|
const { push } = useOverlay();
|
|
8
11
|
const dialogRef = useRef(null);
|
|
9
12
|
const alert = useCallback(
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/hooks/useDialog/index.tsx"],"sourcesContent":["'use client';\n\nimport { type ReactNode, useCallback, useMemo, useRef } from 'react';\n\nimport { useOverlay } from '@kimdw-rtk/utils';\n\nimport { Alert, Confirm } from '#components';\n\nexport const useDialog = () => {\n const { push } = useOverlay();\n const dialogRef = useRef<{ close: () => void }>(null);\n\n const alert = useCallback(\n (message: ReactNode) => {\n return new Promise((resolve) => {\n push(<Alert>{message}</Alert>, { onClose: () => resolve(true) });\n });\n },\n [push],\n );\n\n const confirm = useCallback(\n (message: ReactNode): Promise<boolean> => {\n return new Promise((resolve) => {\n const handleConfirm = () => {\n resolve(true);\n dialogRef.current?.close();\n };\n\n const handleCancle = () => {\n resolve(false);\n dialogRef.current?.close();\n };\n\n push(\n <Confirm\n ref={dialogRef}\n onConfirm={handleConfirm}\n onCancle={handleCancle}\n >\n {message}\n </Confirm>,\n { onClose: () => resolve(false) },\n );\n });\n },\n [push],\n );\n\n return useMemo(() => ({ alert, confirm }), [alert, confirm]);\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../src/hooks/useDialog/index.tsx"],"sourcesContent":["'use client';\n\nimport { type ReactNode, useCallback, useMemo, useRef } from 'react';\n\nimport { useOverlay } from '@kimdw-rtk/utils';\n\nimport { Alert, Confirm } from '#components';\n\nexport const useDialog = () => {\n const { push } = useOverlay();\n const dialogRef = useRef<{ close: () => void }>(null);\n\n const alert = useCallback(\n (message: ReactNode) => {\n return new Promise((resolve) => {\n push(<Alert>{message}</Alert>, { onClose: () => resolve(true) });\n });\n },\n [push],\n );\n\n const confirm = useCallback(\n (message: ReactNode): Promise<boolean> => {\n return new Promise((resolve) => {\n const handleConfirm = () => {\n resolve(true);\n dialogRef.current?.close();\n };\n\n const handleCancle = () => {\n resolve(false);\n dialogRef.current?.close();\n };\n\n push(\n <Confirm\n ref={dialogRef}\n onConfirm={handleConfirm}\n onCancle={handleCancle}\n >\n {message}\n </Confirm>,\n { onClose: () => resolve(false) },\n );\n });\n },\n [push],\n );\n\n return useMemo(() => ({ alert, confirm }), [alert, confirm]);\n};\n"],"mappings":";;;;AAEA,SAAyB,aAAa,SAAS,cAAc;AAE7D,SAAS,kBAAkB;AAE3B,SAAS,OAAO,eAAe;AASlB;AAPN,IAAM,YAAY,MAAM;AAC7B,QAAM,EAAE,KAAK,IAAI,WAAW;AAC5B,QAAM,YAAY,OAA8B,IAAI;AAEpD,QAAM,QAAQ;AAAA,IACZ,CAAC,YAAuB;AACtB,aAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,aAAK,oBAAC,SAAO,mBAAQ,GAAU,EAAE,SAAS,MAAM,QAAQ,IAAI,EAAE,CAAC;AAAA,MACjE,CAAC;AAAA,IACH;AAAA,IACA,CAAC,IAAI;AAAA,EACP;AAEA,QAAM,UAAU;AAAA,IACd,CAAC,YAAyC;AACxC,aAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,cAAM,gBAAgB,MAAM;AAC1B,kBAAQ,IAAI;AACZ,oBAAU,SAAS,MAAM;AAAA,QAC3B;AAEA,cAAM,eAAe,MAAM;AACzB,kBAAQ,KAAK;AACb,oBAAU,SAAS,MAAM;AAAA,QAC3B;AAEA;AAAA,UACE;AAAA,YAAC;AAAA;AAAA,cACC,KAAK;AAAA,cACL,WAAW;AAAA,cACX,UAAU;AAAA,cAET;AAAA;AAAA,UACH;AAAA,UACA,EAAE,SAAS,MAAM,QAAQ,KAAK,EAAE;AAAA,QAClC;AAAA,MACF,CAAC;AAAA,IACH;AAAA,IACA,CAAC,IAAI;AAAA,EACP;AAEA,SAAO,QAAQ,OAAO,EAAE,OAAO,QAAQ,IAAI,CAAC,OAAO,OAAO,CAAC;AAC7D;","names":[]}
|
|
@@ -1,7 +1,14 @@
|
|
|
1
|
+
import {
|
|
2
|
+
act,
|
|
3
|
+
react_esm_exports,
|
|
4
|
+
render
|
|
5
|
+
} from "../../chunk-PCAHVFSY.js";
|
|
6
|
+
import "../../chunk-424PT5DM.js";
|
|
7
|
+
|
|
8
|
+
// src/hooks/useDialog/useDialog.spec.tsx
|
|
9
|
+
import { UIProvider } from "#contexts.mjs";
|
|
10
|
+
import { useDialog } from "#hooks.mjs";
|
|
1
11
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { act, render, screen, waitFor } from "@testing-library/react";
|
|
3
|
-
import { UIProvider } from "#contexts";
|
|
4
|
-
import { useDialog } from "#hooks";
|
|
5
12
|
describe("useDialog \uD14C\uC2A4\uD2B8", () => {
|
|
6
13
|
const mockFn = jest.fn();
|
|
7
14
|
beforeEach(() => {
|
|
@@ -20,38 +27,38 @@ describe("useDialog \uD14C\uC2A4\uD2B8", () => {
|
|
|
20
27
|
);
|
|
21
28
|
});
|
|
22
29
|
it("\uD655\uC778 \uBC84\uD2BC\uC744 \uB204\uB974\uBA74 alert\uC744 \uB2EB\uC744 \uC218 \uC788\uB2E4.", async () => {
|
|
23
|
-
const alertButton = screen.getByRole("button", { name: "alert click" });
|
|
24
|
-
expect(screen.queryByText("alert")).not.toBeInTheDocument();
|
|
30
|
+
const alertButton = react_esm_exports.screen.getByRole("button", { name: "alert click" });
|
|
31
|
+
expect(react_esm_exports.screen.queryByText("alert")).not.toBeInTheDocument();
|
|
25
32
|
act(() => {
|
|
26
33
|
alertButton.click();
|
|
27
34
|
});
|
|
28
|
-
expect(screen.getByText("alert")).toBeInTheDocument();
|
|
29
|
-
const okButton = screen.getByRole("button", { name: "\uD655\uC778" });
|
|
35
|
+
expect(react_esm_exports.screen.getByText("alert")).toBeInTheDocument();
|
|
36
|
+
const okButton = react_esm_exports.screen.getByRole("button", { name: "\uD655\uC778" });
|
|
30
37
|
act(() => {
|
|
31
38
|
okButton.click();
|
|
32
39
|
});
|
|
33
|
-
expect(screen.queryByText("alert")).not.toBeInTheDocument();
|
|
40
|
+
expect(react_esm_exports.screen.queryByText("alert")).not.toBeInTheDocument();
|
|
34
41
|
});
|
|
35
42
|
it.skip("confirm\uC758 \uD655\uC778 \uBC84\uD2BC\uC744 \uB204\uB974\uBA74 true, \uCDE8\uC18C \uBC84\uD2BC\uC744 \uB204\uB974\uBA74 false\uB97C \uBC18\uD658\uD55C\uB2E4.", async () => {
|
|
36
|
-
const confirmButton = screen.getByRole("button", { name: "confirm click" });
|
|
43
|
+
const confirmButton = react_esm_exports.screen.getByRole("button", { name: "confirm click" });
|
|
37
44
|
act(() => {
|
|
38
45
|
confirmButton.click();
|
|
39
46
|
});
|
|
40
|
-
const okButton = screen.getByRole("button", { name: "\uD655\uC778" });
|
|
47
|
+
const okButton = react_esm_exports.screen.getByRole("button", { name: "\uD655\uC778" });
|
|
41
48
|
act(() => {
|
|
42
49
|
okButton.click();
|
|
43
50
|
});
|
|
44
|
-
await waitFor(() => {
|
|
51
|
+
await (0, react_esm_exports.waitFor)(() => {
|
|
45
52
|
expect(mockFn.mock.calls[0][0]).toBe(true);
|
|
46
53
|
});
|
|
47
54
|
act(() => {
|
|
48
55
|
confirmButton.click();
|
|
49
56
|
});
|
|
50
|
-
const cancelButton = screen.getByRole("button", { name: "\uCDE8\uC18C" });
|
|
57
|
+
const cancelButton = react_esm_exports.screen.getByRole("button", { name: "\uCDE8\uC18C" });
|
|
51
58
|
act(() => {
|
|
52
59
|
cancelButton.click();
|
|
53
60
|
});
|
|
54
|
-
await waitFor(() => {
|
|
61
|
+
await (0, react_esm_exports.waitFor)(() => {
|
|
55
62
|
expect(mockFn.mock.calls[1][0]).toBe(false);
|
|
56
63
|
});
|
|
57
64
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/hooks/useDialog/useDialog.spec.tsx"],"sourcesContent":["import { act, render, screen, waitFor } from '@testing-library/react';\n\nimport { UIProvider } from '#contexts';\nimport { useDialog } from '#hooks';\n\ndescribe('useDialog 테스트', () => {\n const mockFn = jest.fn();\n\n beforeEach(() => {\n const TestComponent = () => {\n const { alert, confirm } = useDialog();\n\n const handleConfirmClick = async () => {\n mockFn(await confirm('confirm'));\n };\n\n return (\n <>\n <button onClick={() => alert('alert')}>alert click</button>\n <button onClick={handleConfirmClick}>confirm click</button>\n </>\n );\n };\n\n render(\n <UIProvider overlayUnmountOn={'exit'}>\n <TestComponent />\n </UIProvider>,\n );\n });\n\n it('확인 버튼을 누르면 alert을 닫을 수 있다.', async () => {\n const alertButton = screen.getByRole('button', { name: 'alert click' });\n\n expect(screen.queryByText('alert')).not.toBeInTheDocument();\n\n act(() => {\n alertButton.click();\n });\n\n expect(screen.getByText('alert')).toBeInTheDocument();\n\n const okButton = screen.getByRole('button', { name: '확인' });\n act(() => {\n okButton.click();\n });\n\n expect(screen.queryByText('alert')).not.toBeInTheDocument();\n });\n\n it.skip('confirm의 확인 버튼을 누르면 true, 취소 버튼을 누르면 false를 반환한다.', async () => {\n const confirmButton = screen.getByRole('button', { name: 'confirm click' });\n\n act(() => {\n confirmButton.click();\n });\n\n const okButton = screen.getByRole('button', { name: '확인' });\n act(() => {\n okButton.click();\n });\n\n await waitFor(() => {\n expect(mockFn.mock.calls[0][0]).toBe(true);\n });\n\n act(() => {\n confirmButton.click();\n });\n\n const cancelButton = screen.getByRole('button', { name: '취소' });\n act(() => {\n cancelButton.click();\n });\n\n await waitFor(() => {\n expect(mockFn.mock.calls[1][0]).toBe(false);\n });\n });\n});\n"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../src/hooks/useDialog/useDialog.spec.tsx"],"sourcesContent":["import { act, render, screen, waitFor } from '@testing-library/react';\n\nimport { UIProvider } from '#contexts';\nimport { useDialog } from '#hooks';\n\ndescribe('useDialog 테스트', () => {\n const mockFn = jest.fn();\n\n beforeEach(() => {\n const TestComponent = () => {\n const { alert, confirm } = useDialog();\n\n const handleConfirmClick = async () => {\n mockFn(await confirm('confirm'));\n };\n\n return (\n <>\n <button onClick={() => alert('alert')}>alert click</button>\n <button onClick={handleConfirmClick}>confirm click</button>\n </>\n );\n };\n\n render(\n <UIProvider overlayUnmountOn={'exit'}>\n <TestComponent />\n </UIProvider>,\n );\n });\n\n it('확인 버튼을 누르면 alert을 닫을 수 있다.', async () => {\n const alertButton = screen.getByRole('button', { name: 'alert click' });\n\n expect(screen.queryByText('alert')).not.toBeInTheDocument();\n\n act(() => {\n alertButton.click();\n });\n\n expect(screen.getByText('alert')).toBeInTheDocument();\n\n const okButton = screen.getByRole('button', { name: '확인' });\n act(() => {\n okButton.click();\n });\n\n expect(screen.queryByText('alert')).not.toBeInTheDocument();\n });\n\n it.skip('confirm의 확인 버튼을 누르면 true, 취소 버튼을 누르면 false를 반환한다.', async () => {\n const confirmButton = screen.getByRole('button', { name: 'confirm click' });\n\n act(() => {\n confirmButton.click();\n });\n\n const okButton = screen.getByRole('button', { name: '확인' });\n act(() => {\n okButton.click();\n });\n\n await waitFor(() => {\n expect(mockFn.mock.calls[0][0]).toBe(true);\n });\n\n act(() => {\n confirmButton.click();\n });\n\n const cancelButton = screen.getByRole('button', { name: '취소' });\n act(() => {\n cancelButton.click();\n });\n\n await waitFor(() => {\n expect(mockFn.mock.calls[1][0]).toBe(false);\n });\n });\n});\n"],"mappings":";;;;;;;;AAEA,SAAS,kBAAkB;AAC3B,SAAS,iBAAiB;AAclB,mBACE,KADF;AAZR,SAAS,gCAAiB,MAAM;AAC9B,QAAM,SAAS,KAAK,GAAG;AAEvB,aAAW,MAAM;AACf,UAAM,gBAAgB,MAAM;AAC1B,YAAM,EAAE,OAAO,QAAQ,IAAI,UAAU;AAErC,YAAM,qBAAqB,YAAY;AACrC,eAAO,MAAM,QAAQ,SAAS,CAAC;AAAA,MACjC;AAEA,aACE,iCACE;AAAA,4BAAC,YAAO,SAAS,MAAM,MAAM,OAAO,GAAG,yBAAW;AAAA,QAClD,oBAAC,YAAO,SAAS,oBAAoB,2BAAa;AAAA,SACpD;AAAA,IAEJ;AAEA;AAAA,MACE,oBAAC,cAAW,kBAAkB,QAC5B,8BAAC,iBAAc,GACjB;AAAA,IACF;AAAA,EACF,CAAC;AAED,KAAG,oGAA8B,YAAY;AAC3C,UAAM,cAAc,yBAAO,UAAU,UAAU,EAAE,MAAM,cAAc,CAAC;AAEtE,WAAO,yBAAO,YAAY,OAAO,CAAC,EAAE,IAAI,kBAAkB;AAE1D,QAAI,MAAM;AACR,kBAAY,MAAM;AAAA,IACpB,CAAC;AAED,WAAO,yBAAO,UAAU,OAAO,CAAC,EAAE,kBAAkB;AAEpD,UAAM,WAAW,yBAAO,UAAU,UAAU,EAAE,MAAM,eAAK,CAAC;AAC1D,QAAI,MAAM;AACR,eAAS,MAAM;AAAA,IACjB,CAAC;AAED,WAAO,yBAAO,YAAY,OAAO,CAAC,EAAE,IAAI,kBAAkB;AAAA,EAC5D,CAAC;AAED,KAAG,KAAK,mKAAqD,YAAY;AACvE,UAAM,gBAAgB,yBAAO,UAAU,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE1E,QAAI,MAAM;AACR,oBAAc,MAAM;AAAA,IACtB,CAAC;AAED,UAAM,WAAW,yBAAO,UAAU,UAAU,EAAE,MAAM,eAAK,CAAC;AAC1D,QAAI,MAAM;AACR,eAAS,MAAM;AAAA,IACjB,CAAC;AAED,cAAM,2BAAQ,MAAM;AAClB,aAAO,OAAO,KAAK,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,IAAI;AAAA,IAC3C,CAAC;AAED,QAAI,MAAM;AACR,oBAAc,MAAM;AAAA,IACtB,CAAC;AAED,UAAM,eAAe,yBAAO,UAAU,UAAU,EAAE,MAAM,eAAK,CAAC;AAC9D,QAAI,MAAM;AACR,mBAAa,MAAM;AAAA,IACrB,CAAC;AAED,cAAM,2BAAQ,MAAM;AAClB,aAAO,OAAO,KAAK,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,KAAK;AAAA,IAC5C,CAAC;AAAA,EACH,CAAC;AACH,CAAC;","names":[]}
|
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
"use client";
|
|
2
|
+
import "../../chunk-424PT5DM.js";
|
|
3
|
+
|
|
4
|
+
// src/hooks/useMouseScroll/index.ts
|
|
2
5
|
import { useEffect } from "react";
|
|
3
|
-
|
|
6
|
+
var useMouseScroll = (ref) => {
|
|
4
7
|
useEffect(() => {
|
|
5
8
|
const element = ref.current;
|
|
6
9
|
let isDown = false, startX = 0, startLeft = 0;
|