luan-ui 0.2.0 → 0.4.0

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 (35) hide show
  1. package/README.md +38 -1
  2. package/dist/components/alert/alert.d.ts +79 -0
  3. package/dist/components/alert/alert.js +117 -0
  4. package/dist/components/alert/alert.js.map +1 -0
  5. package/dist/components/alert-dialog/alert-dialog.d.ts +10 -0
  6. package/dist/components/alert-dialog/alert-dialog.js +18 -0
  7. package/dist/components/alert-dialog/alert-dialog.js.map +1 -0
  8. package/dist/components/avatar/avatar.js +2 -2
  9. package/dist/components/avatar/avatar.js.map +1 -1
  10. package/dist/components/button/button.d.ts +2 -2
  11. package/dist/components/button/button.js +3 -2
  12. package/dist/components/button/button.js.map +1 -1
  13. package/dist/components/dialog/dialog.js +1 -1
  14. package/dist/components/dialog/dialog.js.map +1 -1
  15. package/dist/components/drawer/drawer.d.ts +16 -0
  16. package/dist/components/drawer/drawer.js +49 -0
  17. package/dist/components/drawer/drawer.js.map +1 -0
  18. package/dist/components/dropdown-menu/dropdown-menu.js +2 -2
  19. package/dist/components/dropdown-menu/dropdown-menu.js.map +1 -1
  20. package/dist/components/radio-group/radio-group.js +8 -1
  21. package/dist/components/radio-group/radio-group.js.map +1 -1
  22. package/dist/components/select/select.d.ts +2 -1
  23. package/dist/components/select/select.js +9 -2
  24. package/dist/components/select/select.js.map +1 -1
  25. package/dist/components/slider/slider.js +6 -2
  26. package/dist/components/slider/slider.js.map +1 -1
  27. package/dist/index.d.ts +5 -1
  28. package/dist/index.js +4 -1
  29. package/dist/index.js.map +1 -1
  30. package/dist/styles/index.css +80 -0
  31. package/dist/utilities/get-variants/get-variants.js +3 -2
  32. package/dist/utilities/get-variants/get-variants.js.map +1 -1
  33. package/dist/utilities/responsive/responsive.d.ts +5 -3
  34. package/dist/utilities/responsive/responsive.js.map +1 -1
  35. package/package.json +6 -10
package/README.md CHANGED
@@ -1,3 +1,40 @@
1
1
  # luan-ui
2
2
 
3
- Luan UI is built with Tailwind on top of Radix UI Primitives. It includes Responsive values that can be defined based on breakpoints.
3
+ Luan UI is built with Tailwind on top of Radix UI Primitives. It includes Responsive values that can be defined based on breakpoints.
4
+
5
+ ## Installation
6
+
7
+ Add the npm package with your favorite package manager
8
+
9
+ ```bash
10
+ npm install luan-ui
11
+ yarn add luan-ui
12
+ pnpm add luan-ui
13
+ ```
14
+
15
+ ## Set-up
16
+
17
+ If you haven't already, you can install Tailwind v4 in your project by following the official [Tailwind v4 documentation](https://tailwindcss.com/docs/installation).
18
+
19
+ In your project, you have to import the custom config to enable animations and custom configuration that are needed for luan-ui to work properly.
20
+
21
+ ```css
22
+ /* Import tailwind */
23
+ @import 'tailwindcss';
24
+
25
+ /* Import tailwind luan-ui configuration */
26
+ @import 'luan-ui/dist/styles/index.css';
27
+
28
+ ```
29
+
30
+ Now you should be able to use the components in your project.
31
+
32
+ ## Philosophy
33
+
34
+ While I strive for some standardisation and enforcement of best practices, it is equally important that all components remain flexible and that they easily adapt to changing requirements among consumers. Having common design requirements shouldn't limit consumers in their way how they use the components.
35
+
36
+ Therefore all the components pass on their standard HTML props. You can use and overwrite all props like id, event handlers and so on. Also all components forward their ref, hence they can be targeted by other libraries or with settings refs yourself.
37
+
38
+ Radix Ui is used as a headless UI library. Using a headless ui library gives you the advantage to have full control over the styling, while the "heavy-lifting" - especially in regards to accessibility - is done for you already. Because handling focus, setting the appropriate aria attributes and similar things are a difficult task to do right.
39
+
40
+ All of the components are built with composability and extensibility in mind.
@@ -0,0 +1,79 @@
1
+ import type { ResponsiveValue } from "../../utilities/responsive/responsive";
2
+ import { type ComponentPropsWithoutRef } from "react";
3
+ type AlertProps = ComponentPropsWithoutRef<"div"> & {
4
+ variant?: "primary" | "secondary" | "error";
5
+ asChild?: boolean;
6
+ size?: ResponsiveValue<"small" | "medium">;
7
+ };
8
+ export declare const SIZES: {
9
+ sm: {
10
+ small: string;
11
+ medium: string;
12
+ };
13
+ md: {
14
+ small: string;
15
+ medium: string;
16
+ };
17
+ lg: {
18
+ small: string;
19
+ medium: string;
20
+ };
21
+ xl: {
22
+ small: string;
23
+ medium: string;
24
+ };
25
+ };
26
+ declare const Alert: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
27
+ variant?: "primary" | "secondary" | "error";
28
+ asChild?: boolean;
29
+ size?: ResponsiveValue<"small" | "medium">;
30
+ } & import("react").RefAttributes<HTMLDivElement>>;
31
+ type AlertTitleProps = ComponentPropsWithoutRef<"div"> & {
32
+ asChild?: boolean;
33
+ };
34
+ export declare const TITLE_SIZES: {
35
+ sm: {
36
+ small: string;
37
+ medium: string;
38
+ };
39
+ md: {
40
+ small: string;
41
+ medium: string;
42
+ };
43
+ lg: {
44
+ small: string;
45
+ medium: string;
46
+ };
47
+ xl: {
48
+ small: string;
49
+ medium: string;
50
+ };
51
+ };
52
+ declare const AlertTitle: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
53
+ asChild?: boolean;
54
+ } & import("react").RefAttributes<HTMLDivElement>>;
55
+ type AlertDescriptionProps = ComponentPropsWithoutRef<"div"> & {
56
+ asChild?: boolean;
57
+ };
58
+ export declare const DESCRIPTION_SIZES: {
59
+ sm: {
60
+ small: string;
61
+ medium: string;
62
+ };
63
+ md: {
64
+ small: string;
65
+ medium: string;
66
+ };
67
+ lg: {
68
+ small: string;
69
+ medium: string;
70
+ };
71
+ xl: {
72
+ small: string;
73
+ medium: string;
74
+ };
75
+ };
76
+ declare const AlertDescription: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
77
+ asChild?: boolean;
78
+ } & import("react").RefAttributes<HTMLDivElement>>;
79
+ export { Alert, AlertDescription, AlertTitle, type AlertDescriptionProps, type AlertProps, type AlertTitleProps, };
@@ -0,0 +1,117 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { Slot } from "../slot/slot";
3
+ import { getVariants } from "../../utilities/get-variants/get-variants";
4
+ import { createContext, forwardRef, useContext, } from "react";
5
+ const AlertContext = createContext(undefined);
6
+ const useAlertContext = () => {
7
+ const context = useContext(AlertContext);
8
+ if (!context) {
9
+ throw new Error("useAlertContext must be used within an Alert component");
10
+ }
11
+ return context;
12
+ };
13
+ const alertStyles = getVariants({
14
+ base: "grid w-fit grid-cols-[0_1fr] items-start gap-1 rounded-md border border-transparent has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] [&>svg]:translate-y-1",
15
+ variants: {
16
+ variant: {
17
+ primary: "bg-gray-700 text-white",
18
+ secondary: "border-gray-700 text-gray-700",
19
+ error: "bg-red-500 text-white",
20
+ },
21
+ size: {
22
+ small: "px-2 py-1 has-[>svg]:gap-x-2",
23
+ medium: "px-3 py-2 has-[>svg]:gap-x-3",
24
+ },
25
+ },
26
+ });
27
+ export const SIZES = {
28
+ sm: {
29
+ small: "sm:px-2 sm:py-1 sm:has-[>svg]:gap-x-2",
30
+ medium: "sm:px-3 sm:py-2 sm:has-[>svg]:gap-x-3",
31
+ },
32
+ md: {
33
+ small: "md:px-2 md:py-1 md:has-[>svg]:gap-x-2",
34
+ medium: "md:px-3 md:py-2 md:has-[>svg]:gap-x-3",
35
+ },
36
+ lg: {
37
+ small: "lg:px-2 lg:py-1 lg:has-[>svg]:gap-x-2",
38
+ medium: "lg:px-3 lg:py-2 lg:has-[>svg]:gap-x-3",
39
+ },
40
+ xl: {
41
+ small: "xl:px-2 xl:py-1 xl:has-[>svg]:gap-x-2",
42
+ medium: "xl:px-3 xl:py-2 xl:has-[>svg]:gap-x-3",
43
+ },
44
+ };
45
+ const Alert = forwardRef(({ variant = "primary", size = "medium", className, asChild, ...props }, ref) => {
46
+ const Component = asChild ? Slot : "div";
47
+ return (_jsx(AlertContext.Provider, { value: { variant, size }, children: _jsx(Component, { className: alertStyles({ variant, size, className }), ...props, ref: ref }) }));
48
+ });
49
+ Alert.displayName = "Alert";
50
+ const alertTitleStyles = getVariants({
51
+ base: "col-start-2 font-bold",
52
+ variants: {
53
+ size: {
54
+ small: "text-sm",
55
+ medium: "text-base",
56
+ },
57
+ },
58
+ });
59
+ export const TITLE_SIZES = {
60
+ sm: {
61
+ small: "sm:text-sm",
62
+ medium: "sm:text-base",
63
+ },
64
+ md: {
65
+ small: "md:text-sm",
66
+ medium: "md:text-base",
67
+ },
68
+ lg: {
69
+ small: "lg:text-sm",
70
+ medium: "lg:text-base",
71
+ },
72
+ xl: {
73
+ small: "xl:text-sm",
74
+ medium: "xl:text-base",
75
+ },
76
+ };
77
+ const AlertTitle = forwardRef(({ className, asChild, ...props }, ref) => {
78
+ const { size } = useAlertContext();
79
+ const Component = asChild ? Slot : "div";
80
+ return (_jsx(Component, { ref: ref, ...props, className: alertTitleStyles({ size, className }) }));
81
+ });
82
+ AlertTitle.displayName = "AlertTitle";
83
+ const alertDescriptionStyles = getVariants({
84
+ base: "col-start-2",
85
+ variants: {
86
+ size: {
87
+ small: "text-xs",
88
+ medium: "text-sm",
89
+ },
90
+ },
91
+ });
92
+ export const DESCRIPTION_SIZES = {
93
+ sm: {
94
+ small: "sm:text-xs",
95
+ medium: "sm:text-sm",
96
+ },
97
+ md: {
98
+ small: "md:text-xs",
99
+ medium: "md:text-sm",
100
+ },
101
+ lg: {
102
+ small: "lg:text-xs",
103
+ medium: "lg:text-sm",
104
+ },
105
+ xl: {
106
+ small: "xl:text-xs",
107
+ medium: "xl:text-sm",
108
+ },
109
+ };
110
+ const AlertDescription = forwardRef(({ className, asChild, ...props }, ref) => {
111
+ const { size } = useAlertContext();
112
+ const Component = asChild ? Slot : "div";
113
+ return (_jsx(Component, { ref: ref, ...props, className: alertDescriptionStyles({ size, className }) }));
114
+ });
115
+ AlertDescription.displayName = "AlertDescription";
116
+ export { Alert, AlertDescription, AlertTitle, };
117
+ //# sourceMappingURL=alert.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"alert.js","sourceRoot":"/","sources":["components/alert/alert.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,sCAAsC,CAAC;AAEnE,OAAO,EAEN,aAAa,EACb,UAAU,EACV,UAAU,GACV,MAAM,OAAO,CAAC;AAOf,MAAM,YAAY,GAAG,aAAa,CAA+B,SAAS,CAAC,CAAC;AAE5E,MAAM,eAAe,GAAG,GAAG,EAAE;IAC5B,MAAM,OAAO,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;IACzC,IAAI,CAAC,OAAO,EAAE,CAAC;QACd,MAAM,IAAI,KAAK,CAAC,wDAAwD,CAAC,CAAC;IAC3E,CAAC;IACD,OAAO,OAAO,CAAC;AAChB,CAAC,CAAC;AAQF,MAAM,WAAW,GAAG,WAAW,CAAC;IAC/B,IAAI,EAAE,6JAA6J;IACnK,QAAQ,EAAE;QACT,OAAO,EAAE;YACR,OAAO,EAAE,wBAAwB;YACjC,SAAS,EAAE,+BAA+B;YAC1C,KAAK,EAAE,uBAAuB;SAC9B;QACD,IAAI,EAAE;YACL,KAAK,EAAE,8BAA8B;YACrC,MAAM,EAAE,8BAA8B;SACtC;KACD;CACD,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,KAAK,GAAG;IACpB,EAAE,EAAE;QACH,KAAK,EAAE,uCAAuC;QAC9C,MAAM,EAAE,uCAAuC;KAC/C;IACD,EAAE,EAAE;QACH,KAAK,EAAE,uCAAuC;QAC9C,MAAM,EAAE,uCAAuC;KAC/C;IACD,EAAE,EAAE;QACH,KAAK,EAAE,uCAAuC;QAC9C,MAAM,EAAE,uCAAuC;KAC/C;IACD,EAAE,EAAE;QACH,KAAK,EAAE,uCAAuC;QAC9C,MAAM,EAAE,uCAAuC;KAC/C;CACD,CAAC;AAEF,MAAM,KAAK,GAAG,UAAU,CACvB,CACC,EAAE,OAAO,GAAG,SAAS,EAAE,IAAI,GAAG,QAAQ,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EACtE,GAAG,EACF,EAAE;IACH,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC;IAEzC,OAAO,CACN,KAAC,YAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,YAC9C,KAAC,SAAS,IACT,SAAS,EAAE,WAAW,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,KAChD,KAAK,EACT,GAAG,EAAE,GAAG,GACP,GACqB,CACxB,CAAC;AACH,CAAC,CACD,CAAC;AAEF,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC;AAM5B,MAAM,gBAAgB,GAAG,WAAW,CAAC;IACpC,IAAI,EAAE,uBAAuB;IAC7B,QAAQ,EAAE;QACT,IAAI,EAAE;YACL,KAAK,EAAE,SAAS;YAChB,MAAM,EAAE,WAAW;SACnB;KACD;CACD,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,WAAW,GAAG;IAC1B,EAAE,EAAE;QACH,KAAK,EAAE,YAAY;QACnB,MAAM,EAAE,cAAc;KACtB;IACD,EAAE,EAAE;QACH,KAAK,EAAE,YAAY;QACnB,MAAM,EAAE,cAAc;KACtB;IACD,EAAE,EAAE;QACH,KAAK,EAAE,YAAY;QACnB,MAAM,EAAE,cAAc;KACtB;IACD,EAAE,EAAE;QACH,KAAK,EAAE,YAAY;QACnB,MAAM,EAAE,cAAc;KACtB;CACD,CAAC;AAEF,MAAM,UAAU,GAAG,UAAU,CAC5B,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACzC,MAAM,EAAE,IAAI,EAAE,GAAG,eAAe,EAAE,CAAC;IACnC,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC;IACzC,OAAO,CACN,KAAC,SAAS,IACT,GAAG,EAAE,GAAG,KACJ,KAAK,EACT,SAAS,EAAE,gBAAgB,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,GAC/C,CACF,CAAC;AACH,CAAC,CACD,CAAC;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC;AAMtC,MAAM,sBAAsB,GAAG,WAAW,CAAC;IAC1C,IAAI,EAAE,aAAa;IACnB,QAAQ,EAAE;QACT,IAAI,EAAE;YACL,KAAK,EAAE,SAAS;YAChB,MAAM,EAAE,SAAS;SACjB;KACD;CACD,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,iBAAiB,GAAG;IAChC,EAAE,EAAE;QACH,KAAK,EAAE,YAAY;QACnB,MAAM,EAAE,YAAY;KACpB;IACD,EAAE,EAAE;QACH,KAAK,EAAE,YAAY;QACnB,MAAM,EAAE,YAAY;KACpB;IACD,EAAE,EAAE;QACH,KAAK,EAAE,YAAY;QACnB,MAAM,EAAE,YAAY;KACpB;IACD,EAAE,EAAE;QACH,KAAK,EAAE,YAAY;QACnB,MAAM,EAAE,YAAY;KACpB;CACD,CAAC;AAEF,MAAM,gBAAgB,GAAG,UAAU,CAClC,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACzC,MAAM,EAAE,IAAI,EAAE,GAAG,eAAe,EAAE,CAAC;IACnC,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC;IACzC,OAAO,CACN,KAAC,SAAS,IACT,GAAG,EAAE,GAAG,KACJ,KAAK,EACT,SAAS,EAAE,sBAAsB,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,GACrD,CACF,CAAC;AACH,CAAC,CACD,CAAC;AAEF,gBAAgB,CAAC,WAAW,GAAG,kBAAkB,CAAC;AAElD,OAAO,EACN,KAAK,EACL,gBAAgB,EAChB,UAAU,GAIV,CAAC","sourcesContent":["import { Slot } from \"@components/slot/slot\";\nimport { getVariants } from \"@utilities/get-variants/get-variants\";\nimport type { ResponsiveValue } from \"@utilities/responsive/responsive\";\nimport {\n\ttype ComponentPropsWithoutRef,\n\tcreateContext,\n\tforwardRef,\n\tuseContext,\n} from \"react\";\n\ntype AlertContextType = {\n\tvariant: \"primary\" | \"secondary\" | \"error\";\n\tsize: ResponsiveValue<\"small\" | \"medium\">;\n};\n\nconst AlertContext = createContext<AlertContextType | undefined>(undefined);\n\nconst useAlertContext = () => {\n\tconst context = useContext(AlertContext);\n\tif (!context) {\n\t\tthrow new Error(\"useAlertContext must be used within an Alert component\");\n\t}\n\treturn context;\n};\n\ntype AlertProps = ComponentPropsWithoutRef<\"div\"> & {\n\tvariant?: \"primary\" | \"secondary\" | \"error\";\n\tasChild?: boolean;\n\tsize?: ResponsiveValue<\"small\" | \"medium\">;\n};\n\nconst alertStyles = getVariants({\n\tbase: \"grid w-fit grid-cols-[0_1fr] items-start gap-1 rounded-md border border-transparent has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] [&>svg]:translate-y-1\",\n\tvariants: {\n\t\tvariant: {\n\t\t\tprimary: \"bg-gray-700 text-white\",\n\t\t\tsecondary: \"border-gray-700 text-gray-700\",\n\t\t\terror: \"bg-red-500 text-white\",\n\t\t},\n\t\tsize: {\n\t\t\tsmall: \"px-2 py-1 has-[>svg]:gap-x-2\",\n\t\t\tmedium: \"px-3 py-2 has-[>svg]:gap-x-3\",\n\t\t},\n\t},\n});\n\nexport const SIZES = {\n\tsm: {\n\t\tsmall: \"sm:px-2 sm:py-1 sm:has-[>svg]:gap-x-2\",\n\t\tmedium: \"sm:px-3 sm:py-2 sm:has-[>svg]:gap-x-3\",\n\t},\n\tmd: {\n\t\tsmall: \"md:px-2 md:py-1 md:has-[>svg]:gap-x-2\",\n\t\tmedium: \"md:px-3 md:py-2 md:has-[>svg]:gap-x-3\",\n\t},\n\tlg: {\n\t\tsmall: \"lg:px-2 lg:py-1 lg:has-[>svg]:gap-x-2\",\n\t\tmedium: \"lg:px-3 lg:py-2 lg:has-[>svg]:gap-x-3\",\n\t},\n\txl: {\n\t\tsmall: \"xl:px-2 xl:py-1 xl:has-[>svg]:gap-x-2\",\n\t\tmedium: \"xl:px-3 xl:py-2 xl:has-[>svg]:gap-x-3\",\n\t},\n};\n\nconst Alert = forwardRef<HTMLDivElement, AlertProps>(\n\t(\n\t\t{ variant = \"primary\", size = \"medium\", className, asChild, ...props },\n\t\tref,\n\t) => {\n\t\tconst Component = asChild ? Slot : \"div\";\n\n\t\treturn (\n\t\t\t<AlertContext.Provider value={{ variant, size }}>\n\t\t\t\t<Component\n\t\t\t\t\tclassName={alertStyles({ variant, size, className })}\n\t\t\t\t\t{...props}\n\t\t\t\t\tref={ref}\n\t\t\t\t/>\n\t\t\t</AlertContext.Provider>\n\t\t);\n\t},\n);\n\nAlert.displayName = \"Alert\";\n\ntype AlertTitleProps = ComponentPropsWithoutRef<\"div\"> & {\n\tasChild?: boolean;\n};\n\nconst alertTitleStyles = getVariants({\n\tbase: \"col-start-2 font-bold\",\n\tvariants: {\n\t\tsize: {\n\t\t\tsmall: \"text-sm\",\n\t\t\tmedium: \"text-base\",\n\t\t},\n\t},\n});\n\nexport const TITLE_SIZES = {\n\tsm: {\n\t\tsmall: \"sm:text-sm\",\n\t\tmedium: \"sm:text-base\",\n\t},\n\tmd: {\n\t\tsmall: \"md:text-sm\",\n\t\tmedium: \"md:text-base\",\n\t},\n\tlg: {\n\t\tsmall: \"lg:text-sm\",\n\t\tmedium: \"lg:text-base\",\n\t},\n\txl: {\n\t\tsmall: \"xl:text-sm\",\n\t\tmedium: \"xl:text-base\",\n\t},\n};\n\nconst AlertTitle = forwardRef<HTMLDivElement, AlertTitleProps>(\n\t({ className, asChild, ...props }, ref) => {\n\t\tconst { size } = useAlertContext();\n\t\tconst Component = asChild ? Slot : \"div\";\n\t\treturn (\n\t\t\t<Component\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t\tclassName={alertTitleStyles({ size, className })}\n\t\t\t/>\n\t\t);\n\t},\n);\n\nAlertTitle.displayName = \"AlertTitle\";\n\ntype AlertDescriptionProps = ComponentPropsWithoutRef<\"div\"> & {\n\tasChild?: boolean;\n};\n\nconst alertDescriptionStyles = getVariants({\n\tbase: \"col-start-2\",\n\tvariants: {\n\t\tsize: {\n\t\t\tsmall: \"text-xs\",\n\t\t\tmedium: \"text-sm\",\n\t\t},\n\t},\n});\n\nexport const DESCRIPTION_SIZES = {\n\tsm: {\n\t\tsmall: \"sm:text-xs\",\n\t\tmedium: \"sm:text-sm\",\n\t},\n\tmd: {\n\t\tsmall: \"md:text-xs\",\n\t\tmedium: \"md:text-sm\",\n\t},\n\tlg: {\n\t\tsmall: \"lg:text-xs\",\n\t\tmedium: \"lg:text-sm\",\n\t},\n\txl: {\n\t\tsmall: \"xl:text-xs\",\n\t\tmedium: \"xl:text-sm\",\n\t},\n};\n\nconst AlertDescription = forwardRef<HTMLDivElement, AlertDescriptionProps>(\n\t({ className, asChild, ...props }, ref) => {\n\t\tconst { size } = useAlertContext();\n\t\tconst Component = asChild ? Slot : \"div\";\n\t\treturn (\n\t\t\t<Component\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t\tclassName={alertDescriptionStyles({ size, className })}\n\t\t\t/>\n\t\t);\n\t},\n);\n\nAlertDescription.displayName = \"AlertDescription\";\n\nexport {\n\tAlert,\n\tAlertDescription,\n\tAlertTitle,\n\ttype AlertDescriptionProps,\n\ttype AlertProps,\n\ttype AlertTitleProps,\n};\n"]}
@@ -0,0 +1,10 @@
1
+ import { AlertDialog as RadixAlertDialog } from "radix-ui";
2
+ declare const AlertDialog: import("react").FC<RadixAlertDialog.AlertDialogProps>;
3
+ declare const AlertDialogTrigger: import("react").ForwardRefExoticComponent<RadixAlertDialog.AlertDialogTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
4
+ declare const AlertDialogOverlay: import("react").ForwardRefExoticComponent<Omit<RadixAlertDialog.AlertDialogOverlayProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
5
+ declare const AlertDialogContent: import("react").ForwardRefExoticComponent<Omit<RadixAlertDialog.AlertDialogContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
6
+ declare const AlertDialogTitle: import("react").ForwardRefExoticComponent<Omit<RadixAlertDialog.AlertDialogTitleProps & import("react").RefAttributes<HTMLHeadingElement>, "ref"> & import("react").RefAttributes<HTMLHeadingElement>>;
7
+ declare const AlertDialogDescription: import("react").ForwardRefExoticComponent<Omit<RadixAlertDialog.AlertDialogDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>;
8
+ declare const AlertDialogAction: import("react").ForwardRefExoticComponent<RadixAlertDialog.AlertDialogActionProps & import("react").RefAttributes<HTMLButtonElement>>;
9
+ declare const AlertDialogCancel: import("react").ForwardRefExoticComponent<RadixAlertDialog.AlertDialogCancelProps & import("react").RefAttributes<HTMLButtonElement>>;
10
+ export { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogOverlay, AlertDialogTitle, AlertDialogDescription, AlertDialogAction, AlertDialogCancel, };
@@ -0,0 +1,18 @@
1
+ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { cn } from "../../utilities/cn/cn";
3
+ import { AlertDialog as RadixAlertDialog } from "radix-ui";
4
+ import { forwardRef, } from "react";
5
+ const AlertDialog = RadixAlertDialog.Root;
6
+ const AlertDialogTrigger = RadixAlertDialog.Trigger;
7
+ const AlertDialogOverlay = forwardRef(({ className, ...props }, ref) => (_jsx(RadixAlertDialog.Overlay, { ref: ref, className: cn("fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-fade-out data-[state=closed]:animate-out data-[state=open]:animate-fade-in data-[state=open]:animate-in", className), ...props })));
8
+ AlertDialogOverlay.displayName = RadixAlertDialog.Overlay.displayName;
9
+ const AlertDialogContent = forwardRef(({ className, ...props }, ref) => (_jsxs(_Fragment, { children: [_jsx(AlertDialogOverlay, {}), _jsx(RadixAlertDialog.Content, { ref: ref, className: cn("-translate-x-1/2 -translate-y-1/2 fixed top-1/2 left-1/2 z-50 flex w-fit max-w-xl flex-col gap-4 rounded-lg bg-white p-4", className), ...props })] })));
10
+ AlertDialogContent.displayName = RadixAlertDialog.Content.displayName;
11
+ const AlertDialogTitle = forwardRef(({ className, ...props }, ref) => (_jsx(RadixAlertDialog.Title, { ref: ref, className: cn("font-medium text-lg", className), ...props })));
12
+ AlertDialogTitle.displayName = RadixAlertDialog.Title.displayName;
13
+ const AlertDialogDescription = forwardRef(({ className, ...props }, ref) => (_jsx(RadixAlertDialog.Description, { ref: ref, className: cn("text-gray-500 text-sm", className), ...props })));
14
+ AlertDialogDescription.displayName = RadixAlertDialog.Description.displayName;
15
+ const AlertDialogAction = RadixAlertDialog.Action;
16
+ const AlertDialogCancel = RadixAlertDialog.Cancel;
17
+ export { AlertDialog, AlertDialogTrigger, AlertDialogContent, AlertDialogOverlay, AlertDialogTitle, AlertDialogDescription, AlertDialogAction, AlertDialogCancel, };
18
+ //# sourceMappingURL=alert-dialog.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"alert-dialog.js","sourceRoot":"/","sources":["components/alert-dialog/alert-dialog.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,WAAW,IAAI,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAC3D,OAAO,EAGN,UAAU,GACV,MAAM,OAAO,CAAC;AAEf,MAAM,WAAW,GAAG,gBAAgB,CAAC,IAAI,CAAC;AAE1C,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,OAAO,CAAC;AAEpD,MAAM,kBAAkB,GAAG,UAAU,CAGnC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACnC,KAAC,gBAAgB,CAAC,OAAO,IACxB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACZ,oKAAoK,EACpK,SAAS,CACT,KACG,KAAK,GACR,CACF,CAAC,CAAC;AACH,kBAAkB,CAAC,WAAW,GAAG,gBAAgB,CAAC,OAAO,CAAC,WAAW,CAAC;AAEtE,MAAM,kBAAkB,GAAG,UAAU,CAGnC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACnC,8BACC,KAAC,kBAAkB,KAAG,EACtB,KAAC,gBAAgB,CAAC,OAAO,IACxB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACZ,0HAA0H,EAC1H,SAAS,CACT,KACG,KAAK,GACR,IACA,CACH,CAAC,CAAC;AACH,kBAAkB,CAAC,WAAW,GAAG,gBAAgB,CAAC,OAAO,CAAC,WAAW,CAAC;AAEtE,MAAM,gBAAgB,GAAG,UAAU,CAGjC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACnC,KAAC,gBAAgB,CAAC,KAAK,IACtB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE,SAAS,CAAC,KAC3C,KAAK,GACR,CACF,CAAC,CAAC;AACH,gBAAgB,CAAC,WAAW,GAAG,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC;AAElE,MAAM,sBAAsB,GAAG,UAAU,CAGvC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACnC,KAAC,gBAAgB,CAAC,WAAW,IAC5B,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,uBAAuB,EAAE,SAAS,CAAC,KAC7C,KAAK,GACR,CACF,CAAC,CAAC;AACH,sBAAsB,CAAC,WAAW,GAAG,gBAAgB,CAAC,WAAW,CAAC,WAAW,CAAC;AAE9E,MAAM,iBAAiB,GAAG,gBAAgB,CAAC,MAAM,CAAC;AAElD,MAAM,iBAAiB,GAAG,gBAAgB,CAAC,MAAM,CAAC;AAElD,OAAO,EACN,WAAW,EACX,kBAAkB,EAClB,kBAAkB,EAClB,kBAAkB,EAClB,gBAAgB,EAChB,sBAAsB,EACtB,iBAAiB,EACjB,iBAAiB,GACjB,CAAC","sourcesContent":["import { cn } from \"@utilities/cn/cn\";\nimport { AlertDialog as RadixAlertDialog } from \"radix-ui\";\nimport {\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\tforwardRef,\n} from \"react\";\n\nconst AlertDialog = RadixAlertDialog.Root;\n\nconst AlertDialogTrigger = RadixAlertDialog.Trigger;\n\nconst AlertDialogOverlay = forwardRef<\n\tComponentRef<typeof RadixAlertDialog.Overlay>,\n\tComponentPropsWithoutRef<typeof RadixAlertDialog.Overlay>\n>(({ className, ...props }, ref) => (\n\t<RadixAlertDialog.Overlay\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-fade-out data-[state=closed]:animate-out data-[state=open]:animate-fade-in data-[state=open]:animate-in\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nAlertDialogOverlay.displayName = RadixAlertDialog.Overlay.displayName;\n\nconst AlertDialogContent = forwardRef<\n\tComponentRef<typeof RadixAlertDialog.Content>,\n\tComponentPropsWithoutRef<typeof RadixAlertDialog.Content>\n>(({ className, ...props }, ref) => (\n\t<>\n\t\t<AlertDialogOverlay />\n\t\t<RadixAlertDialog.Content\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"-translate-x-1/2 -translate-y-1/2 fixed top-1/2 left-1/2 z-50 flex w-fit max-w-xl flex-col gap-4 rounded-lg bg-white p-4\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t</>\n));\nAlertDialogContent.displayName = RadixAlertDialog.Content.displayName;\n\nconst AlertDialogTitle = forwardRef<\n\tComponentRef<typeof RadixAlertDialog.Title>,\n\tComponentPropsWithoutRef<typeof RadixAlertDialog.Title>\n>(({ className, ...props }, ref) => (\n\t<RadixAlertDialog.Title\n\t\tref={ref}\n\t\tclassName={cn(\"font-medium text-lg\", className)}\n\t\t{...props}\n\t/>\n));\nAlertDialogTitle.displayName = RadixAlertDialog.Title.displayName;\n\nconst AlertDialogDescription = forwardRef<\n\tComponentRef<typeof RadixAlertDialog.Description>,\n\tComponentPropsWithoutRef<typeof RadixAlertDialog.Description>\n>(({ className, ...props }, ref) => (\n\t<RadixAlertDialog.Description\n\t\tref={ref}\n\t\tclassName={cn(\"text-gray-500 text-sm\", className)}\n\t\t{...props}\n\t/>\n));\nAlertDialogDescription.displayName = RadixAlertDialog.Description.displayName;\n\nconst AlertDialogAction = RadixAlertDialog.Action;\n\nconst AlertDialogCancel = RadixAlertDialog.Cancel;\n\nexport {\n\tAlertDialog,\n\tAlertDialogTrigger,\n\tAlertDialogContent,\n\tAlertDialogOverlay,\n\tAlertDialogTitle,\n\tAlertDialogDescription,\n\tAlertDialogAction,\n\tAlertDialogCancel,\n};\n"]}
@@ -2,11 +2,11 @@ import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import { cn } from "../../utilities/cn/cn";
3
3
  import { Avatar as AvatarPrimitive } from "radix-ui";
4
4
  import { forwardRef } from "react";
5
- const Avatar = forwardRef(({ className, ...props }, ref) => (_jsx(AvatarPrimitive.Root, { ref: ref, className: cn("relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full", className), ...props })));
5
+ const Avatar = forwardRef(({ className, ...props }, ref) => (_jsx(AvatarPrimitive.Root, { ref: ref, className: cn("relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full border-2 border-white", className), ...props })));
6
6
  Avatar.displayName = AvatarPrimitive.Root.displayName;
7
7
  const AvatarImage = forwardRef(({ className, ...props }, ref) => (_jsx(AvatarPrimitive.Image, { ref: ref, className: cn("absolute h-full w-full object-cover", className), ...props })));
8
8
  AvatarImage.displayName = AvatarPrimitive.Image.displayName;
9
- const AvatarFallback = forwardRef(({ className, ...props }, ref) => (_jsx(AvatarPrimitive.Fallback, { ref: ref, className: cn("flex h-full w-full items-center justify-center rounded-full bg-gray-700 text-white", className), ...props })));
9
+ const AvatarFallback = forwardRef(({ className, ...props }, ref) => (_jsx(AvatarPrimitive.Fallback, { ref: ref, className: cn("flex h-full w-full items-center justify-center rounded-full border border-white bg-gray-700 text-white", className), ...props })));
10
10
  AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;
11
11
  export { Avatar, AvatarFallback, AvatarImage };
12
12
  //# sourceMappingURL=avatar.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"avatar.js","sourceRoot":"/","sources":["components/avatar/avatar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,UAAU,CAAC;AACrD,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAInC,MAAM,MAAM,GAAG,UAAU,CAGvB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACnC,KAAC,eAAe,CAAC,IAAI,IACpB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACZ,+DAA+D,EAC/D,SAAS,CACT,KACG,KAAK,GACR,CACF,CAAC,CAAC;AAEH,MAAM,CAAC,WAAW,GAAG,eAAe,CAAC,IAAI,CAAC,WAAW,CAAC;AAEtD,MAAM,WAAW,GAAG,UAAU,CAG5B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACnC,KAAC,eAAe,CAAC,KAAK,IACrB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,qCAAqC,EAAE,SAAS,CAAC,KAC3D,KAAK,GACR,CACF,CAAC,CAAC;AAEH,WAAW,CAAC,WAAW,GAAG,eAAe,CAAC,KAAK,CAAC,WAAW,CAAC;AAE5D,MAAM,cAAc,GAAG,UAAU,CAG/B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACnC,KAAC,eAAe,CAAC,QAAQ,IACxB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACZ,oFAAoF,EACpF,SAAS,CACT,KACG,KAAK,GACR,CACF,CAAC,CAAC;AAEH,cAAc,CAAC,WAAW,GAAG,eAAe,CAAC,QAAQ,CAAC,WAAW,CAAC;AAElE,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,WAAW,EAAE,CAAC","sourcesContent":["import { cn } from \"@utilities/cn/cn\";\nimport { Avatar as AvatarPrimitive } from \"radix-ui\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport type { ComponentRef } from \"react\";\n\nconst Avatar = forwardRef<\n\tComponentRef<typeof AvatarPrimitive.Root>,\n\tComponentPropsWithoutRef<typeof AvatarPrimitive.Root>\n>(({ className, ...props }, ref) => (\n\t<AvatarPrimitive.Root\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\n\nAvatar.displayName = AvatarPrimitive.Root.displayName;\n\nconst AvatarImage = forwardRef<\n\tComponentRef<typeof AvatarPrimitive.Image>,\n\tComponentPropsWithoutRef<typeof AvatarPrimitive.Image>\n>(({ className, ...props }, ref) => (\n\t<AvatarPrimitive.Image\n\t\tref={ref}\n\t\tclassName={cn(\"absolute h-full w-full object-cover\", className)}\n\t\t{...props}\n\t/>\n));\n\nAvatarImage.displayName = AvatarPrimitive.Image.displayName;\n\nconst AvatarFallback = forwardRef<\n\tComponentRef<typeof AvatarPrimitive.Fallback>,\n\tComponentPropsWithoutRef<typeof AvatarPrimitive.Fallback>\n>(({ className, ...props }, ref) => (\n\t<AvatarPrimitive.Fallback\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"flex h-full w-full items-center justify-center rounded-full bg-gray-700 text-white\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\n\nAvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;\n\nexport { Avatar, AvatarFallback, AvatarImage };\n"]}
1
+ {"version":3,"file":"avatar.js","sourceRoot":"/","sources":["components/avatar/avatar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,UAAU,CAAC;AACrD,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAInC,MAAM,MAAM,GAAG,UAAU,CAGvB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACnC,KAAC,eAAe,CAAC,IAAI,IACpB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACZ,qFAAqF,EACrF,SAAS,CACT,KACG,KAAK,GACR,CACF,CAAC,CAAC;AAEH,MAAM,CAAC,WAAW,GAAG,eAAe,CAAC,IAAI,CAAC,WAAW,CAAC;AAEtD,MAAM,WAAW,GAAG,UAAU,CAG5B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACnC,KAAC,eAAe,CAAC,KAAK,IACrB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,qCAAqC,EAAE,SAAS,CAAC,KAC3D,KAAK,GACR,CACF,CAAC,CAAC;AAEH,WAAW,CAAC,WAAW,GAAG,eAAe,CAAC,KAAK,CAAC,WAAW,CAAC;AAE5D,MAAM,cAAc,GAAG,UAAU,CAG/B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACnC,KAAC,eAAe,CAAC,QAAQ,IACxB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACZ,wGAAwG,EACxG,SAAS,CACT,KACG,KAAK,GACR,CACF,CAAC,CAAC;AAEH,cAAc,CAAC,WAAW,GAAG,eAAe,CAAC,QAAQ,CAAC,WAAW,CAAC;AAElE,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,WAAW,EAAE,CAAC","sourcesContent":["import { cn } from \"@utilities/cn/cn\";\nimport { Avatar as AvatarPrimitive } from \"radix-ui\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport type { ComponentRef } from \"react\";\n\nconst Avatar = forwardRef<\n\tComponentRef<typeof AvatarPrimitive.Root>,\n\tComponentPropsWithoutRef<typeof AvatarPrimitive.Root>\n>(({ className, ...props }, ref) => (\n\t<AvatarPrimitive.Root\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full border-2 border-white\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\n\nAvatar.displayName = AvatarPrimitive.Root.displayName;\n\nconst AvatarImage = forwardRef<\n\tComponentRef<typeof AvatarPrimitive.Image>,\n\tComponentPropsWithoutRef<typeof AvatarPrimitive.Image>\n>(({ className, ...props }, ref) => (\n\t<AvatarPrimitive.Image\n\t\tref={ref}\n\t\tclassName={cn(\"absolute h-full w-full object-cover\", className)}\n\t\t{...props}\n\t/>\n));\n\nAvatarImage.displayName = AvatarPrimitive.Image.displayName;\n\nconst AvatarFallback = forwardRef<\n\tComponentRef<typeof AvatarPrimitive.Fallback>,\n\tComponentPropsWithoutRef<typeof AvatarPrimitive.Fallback>\n>(({ className, ...props }, ref) => (\n\t<AvatarPrimitive.Fallback\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"flex h-full w-full items-center justify-center rounded-full border border-white bg-gray-700 text-white\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\n\nAvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;\n\nexport { Avatar, AvatarFallback, AvatarImage };\n"]}
@@ -1,6 +1,6 @@
1
1
  import type { ResponsiveValue } from "../../utilities/responsive/responsive";
2
2
  export type ButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {
3
- variant?: "primary" | "secondary";
3
+ variant?: "primary" | "secondary" | "destructive";
4
4
  size?: ResponsiveValue<"small" | "medium" | "large">;
5
5
  asChild?: boolean;
6
6
  iconStart?: React.ReactNode;
@@ -52,7 +52,7 @@ export declare const SIZES: {
52
52
  * <Button disabled>Disabled Button</Button>
53
53
  */
54
54
  export declare const Button: import("react").ForwardRefExoticComponent<import("react").ButtonHTMLAttributes<HTMLButtonElement> & {
55
- variant?: "primary" | "secondary";
55
+ variant?: "primary" | "secondary" | "destructive";
56
56
  size?: ResponsiveValue<"small" | "medium" | "large">;
57
57
  asChild?: boolean;
58
58
  iconStart?: React.ReactNode;
@@ -24,8 +24,9 @@ const buttonStyles = getVariants({
24
24
  base: "flex w-fit cursor-pointer items-center justify-center gap-2 rounded border font-semibold",
25
25
  variants: {
26
26
  variant: {
27
- primary: "border-transparent bg-gray-700 text-white hover:bg-gray-800",
28
- secondary: "border-gray-700 bg-white text-gray-700 hover:bg-gray-50",
27
+ primary: "border-transparent bg-gray-700 text-white hover:bg-gray-800 active:bg-gray-900",
28
+ secondary: "border-gray-700 bg-white text-gray-700 hover:bg-gray-50 active:bg-gray-100",
29
+ destructive: "border-transparent bg-red-500 text-white hover:bg-red-600 active:bg-red-700",
29
30
  },
30
31
  size: {
31
32
  small: "gap-2 px-2 py-1 text-sm",
@@ -1 +1 @@
1
- {"version":3,"file":"button.js","sourceRoot":"/","sources":["components/button/button.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AACxD,OAAO,EAAE,WAAW,EAAE,MAAM,sCAAsC,CAAC;AAEnE,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAUnC,MAAM,CAAC,MAAM,KAAK,GAAG;IACpB,EAAE,EAAE;QACH,KAAK,EAAE,qCAAqC;QAC5C,MAAM,EAAE,uCAAuC;QAC/C,KAAK,EAAE,qCAAqC;KAC5C;IACD,EAAE,EAAE;QACH,KAAK,EAAE,qCAAqC;QAC5C,MAAM,EAAE,uCAAuC;QAC/C,KAAK,EAAE,qCAAqC;KAC5C;IACD,EAAE,EAAE;QACH,KAAK,EAAE,qCAAqC;QAC5C,MAAM,EAAE,uCAAuC;QAC/C,KAAK,EAAE,qCAAqC;KAC5C;CACD,CAAC;AAEF,MAAM,YAAY,GAAG,WAAW,CAAC;IAChC,IAAI,EAAE,0FAA0F;IAChG,QAAQ,EAAE;QACT,OAAO,EAAE;YACR,OAAO,EAAE,6DAA6D;YACtE,SAAS,EAAE,yDAAyD;SACpE;QACD,IAAI,EAAE;YACL,KAAK,EAAE,yBAAyB;YAChC,MAAM,EAAE,2BAA2B;YACnC,KAAK,EAAE,yBAAyB;SAChC;QACD,QAAQ,EAAE;YACT,IAAI,EAAE,+BAA+B;SACrC;KACD;IACD,gBAAgB,EAAE;QACjB;YACC,OAAO,EAAE,WAAW;YACpB,IAAI,EAAE,QAAQ;YACd,SAAS,EAAE,uBAAuB;SAClC;KACD;CACD,CAAC,CAAC;AAEH;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAC/B,CACC,EACC,OAAO,EACP,QAAQ,EACR,OAAO,GAAG,SAAS,EACnB,IAAI,GAAG,QAAQ,EACf,SAAS,EACT,QAAQ,EACR,SAAS,EACT,OAAO,EACP,GAAG,KAAK,EACR,EACD,GAAG,EACF,EAAE;IACH,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC;IAC5C,OAAO,CACN,KAAC,SAAS,IACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,YAAY,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,KAC3D,KAAK,YAET,KAAC,SAAS,IAAC,KAAK,EAAE,QAAQ,YACxB,CAAC,KAAK,EAAE,EAAE,CAAC,CACX,8BACE,SAAS,IAAI,CACb,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,OAAO,kBACvB,SAAS,GACJ,CACP,EACA,KAAK,EACL,OAAO,IAAI,CACX,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,OAAO,kBACvB,OAAO,GACF,CACP,IACC,CACH,GACU,GACD,CACZ,CAAC;AACH,CAAC,CACD,CAAC;AAEF,MAAM,CAAC,WAAW,GAAG,QAAQ,CAAC","sourcesContent":["import { Icon } from \"@components/icon/icon\";\nimport { Slot, Slottable } from \"@components/slot/slot\";\nimport { getVariants } from \"@utilities/get-variants/get-variants\";\nimport type { ResponsiveValue } from \"@utilities/responsive/responsive\";\nimport { forwardRef } from \"react\";\n\nexport type ButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {\n\tvariant?: \"primary\" | \"secondary\";\n\tsize?: ResponsiveValue<\"small\" | \"medium\" | \"large\">;\n\tasChild?: boolean;\n\ticonStart?: React.ReactNode;\n\ticonEnd?: React.ReactNode;\n};\n\nexport const SIZES = {\n\tsm: {\n\t\tsmall: \"sm:text-sm sm:px-2 sm:py-1 sm:gap-2\",\n\t\tmedium: \"sm:text-base sm:px-4 sm:py-2 sm:gap-4\",\n\t\tlarge: \"sm:text-lg sm:px-6 sm:py-3 sm:gap-6\",\n\t},\n\tmd: {\n\t\tsmall: \"md:text-sm md:px-2 md:py-1 md:gap-2\",\n\t\tmedium: \"md:text-base md:px-4 md:py-2 md:gap-4\",\n\t\tlarge: \"md:text-lg md:px-6 md:py-3 md:gap-6\",\n\t},\n\tlg: {\n\t\tsmall: \"lg:text-sm lg:px-2 lg:py-1 lg:gap-2\",\n\t\tmedium: \"lg:text-base lg:px-4 lg:py-2 lg:gap-4\",\n\t\tlarge: \"lg:text-lg lg:px-6 lg:py-3 lg:gap-6\",\n\t},\n};\n\nconst buttonStyles = getVariants({\n\tbase: \"flex w-fit cursor-pointer items-center justify-center gap-2 rounded border font-semibold\",\n\tvariants: {\n\t\tvariant: {\n\t\t\tprimary: \"border-transparent bg-gray-700 text-white hover:bg-gray-800\",\n\t\t\tsecondary: \"border-gray-700 bg-white text-gray-700 hover:bg-gray-50\",\n\t\t},\n\t\tsize: {\n\t\t\tsmall: \"gap-2 px-2 py-1 text-sm\",\n\t\t\tmedium: \"gap-3 px-4 py-2 text-base\",\n\t\t\tlarge: \"gap-4 px-6 py-3 text-lg\",\n\t\t},\n\t\tdisabled: {\n\t\t\ttrue: \"cursor-not-allowed opacity-50\",\n\t\t},\n\t},\n\tcompoundVariants: [\n\t\t{\n\t\t\tvariant: \"secondary\",\n\t\t\tsize: \"medium\",\n\t\t\tclassName: \"test-compound-variant\",\n\t\t},\n\t],\n});\n\n/**\n * A flexible button component that supports variants, sizes, and icons\n * @param {Object} props - The props for the Button component\n * @param {'primary' | 'secondary'} [props.variant='primary'] - The visual style variant of the button\n * @param {'small' | 'medium' | 'large'} [props.size='medium'] - The size of the button\n * @param {boolean} [props.asChild] - Whether to render the button as a child component using Radix Slot\n * @param {React.ReactNode} [props.iconStart] - Icon element to display before the button content\n * @param {React.ReactNode} [props.iconEnd] - Icon element to display after the button content\n * @param {string} [props.className] - Additional CSS classes to apply\n * @param {boolean} [props.disabled] - Whether the button is disabled\n * @returns {React.ReactElement} The Button component\n * @example\n * // Basic usage\n * <Button>Click me</Button>\n *\n * // With variants and size\n * <Button variant=\"secondary\" size=\"large\">\n * Large Secondary Button\n * </Button>\n *\n * // With icons\n * <Button iconStart={<SearchIcon />} iconEnd={<ArrowRightIcon />}>\n * Search\n * </Button>\n *\n * // Disabled state\n * <Button disabled>Disabled Button</Button>\n */\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n\t(\n\t\t{\n\t\t\tasChild,\n\t\t\tchildren,\n\t\t\tvariant = \"primary\",\n\t\t\tsize = \"medium\",\n\t\t\tclassName,\n\t\t\tdisabled,\n\t\t\ticonStart,\n\t\t\ticonEnd,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst Component = asChild ? Slot : \"button\";\n\t\treturn (\n\t\t\t<Component\n\t\t\t\tref={ref}\n\t\t\t\tclassName={buttonStyles({ variant, size, disabled, className })}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t<Slottable child={children}>\n\t\t\t\t\t{(child) => (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{iconStart && (\n\t\t\t\t\t\t\t\t<Icon size={size} asChild>\n\t\t\t\t\t\t\t\t\t{iconStart}\n\t\t\t\t\t\t\t\t</Icon>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{child}\n\t\t\t\t\t\t\t{iconEnd && (\n\t\t\t\t\t\t\t\t<Icon size={size} asChild>\n\t\t\t\t\t\t\t\t\t{iconEnd}\n\t\t\t\t\t\t\t\t</Icon>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</>\n\t\t\t\t\t)}\n\t\t\t\t</Slottable>\n\t\t\t</Component>\n\t\t);\n\t},\n);\n\nButton.displayName = \"Button\";\n"]}
1
+ {"version":3,"file":"button.js","sourceRoot":"/","sources":["components/button/button.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AACxD,OAAO,EAAE,WAAW,EAAE,MAAM,sCAAsC,CAAC;AAEnE,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAUnC,MAAM,CAAC,MAAM,KAAK,GAAG;IACpB,EAAE,EAAE;QACH,KAAK,EAAE,qCAAqC;QAC5C,MAAM,EAAE,uCAAuC;QAC/C,KAAK,EAAE,qCAAqC;KAC5C;IACD,EAAE,EAAE;QACH,KAAK,EAAE,qCAAqC;QAC5C,MAAM,EAAE,uCAAuC;QAC/C,KAAK,EAAE,qCAAqC;KAC5C;IACD,EAAE,EAAE;QACH,KAAK,EAAE,qCAAqC;QAC5C,MAAM,EAAE,uCAAuC;QAC/C,KAAK,EAAE,qCAAqC;KAC5C;CACD,CAAC;AAEF,MAAM,YAAY,GAAG,WAAW,CAAC;IAChC,IAAI,EAAE,0FAA0F;IAChG,QAAQ,EAAE;QACT,OAAO,EAAE;YACR,OAAO,EACN,gFAAgF;YACjF,SAAS,EACR,4EAA4E;YAC7E,WAAW,EACV,6EAA6E;SAC9E;QACD,IAAI,EAAE;YACL,KAAK,EAAE,yBAAyB;YAChC,MAAM,EAAE,2BAA2B;YACnC,KAAK,EAAE,yBAAyB;SAChC;QACD,QAAQ,EAAE;YACT,IAAI,EAAE,+BAA+B;SACrC;KACD;IACD,gBAAgB,EAAE;QACjB;YACC,OAAO,EAAE,WAAW;YACpB,IAAI,EAAE,QAAQ;YACd,SAAS,EAAE,uBAAuB;SAClC;KACD;CACD,CAAC,CAAC;AAEH;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAC/B,CACC,EACC,OAAO,EACP,QAAQ,EACR,OAAO,GAAG,SAAS,EACnB,IAAI,GAAG,QAAQ,EACf,SAAS,EACT,QAAQ,EACR,SAAS,EACT,OAAO,EACP,GAAG,KAAK,EACR,EACD,GAAG,EACF,EAAE;IACH,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC;IAC5C,OAAO,CACN,KAAC,SAAS,IACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,YAAY,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,KAC3D,KAAK,YAET,KAAC,SAAS,IAAC,KAAK,EAAE,QAAQ,YACxB,CAAC,KAAK,EAAE,EAAE,CAAC,CACX,8BACE,SAAS,IAAI,CACb,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,OAAO,kBACvB,SAAS,GACJ,CACP,EACA,KAAK,EACL,OAAO,IAAI,CACX,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,OAAO,kBACvB,OAAO,GACF,CACP,IACC,CACH,GACU,GACD,CACZ,CAAC;AACH,CAAC,CACD,CAAC;AAEF,MAAM,CAAC,WAAW,GAAG,QAAQ,CAAC","sourcesContent":["import { Icon } from \"@components/icon/icon\";\nimport { Slot, Slottable } from \"@components/slot/slot\";\nimport { getVariants } from \"@utilities/get-variants/get-variants\";\nimport type { ResponsiveValue } from \"@utilities/responsive/responsive\";\nimport { forwardRef } from \"react\";\n\nexport type ButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {\n\tvariant?: \"primary\" | \"secondary\" | \"destructive\";\n\tsize?: ResponsiveValue<\"small\" | \"medium\" | \"large\">;\n\tasChild?: boolean;\n\ticonStart?: React.ReactNode;\n\ticonEnd?: React.ReactNode;\n};\n\nexport const SIZES = {\n\tsm: {\n\t\tsmall: \"sm:text-sm sm:px-2 sm:py-1 sm:gap-2\",\n\t\tmedium: \"sm:text-base sm:px-4 sm:py-2 sm:gap-4\",\n\t\tlarge: \"sm:text-lg sm:px-6 sm:py-3 sm:gap-6\",\n\t},\n\tmd: {\n\t\tsmall: \"md:text-sm md:px-2 md:py-1 md:gap-2\",\n\t\tmedium: \"md:text-base md:px-4 md:py-2 md:gap-4\",\n\t\tlarge: \"md:text-lg md:px-6 md:py-3 md:gap-6\",\n\t},\n\tlg: {\n\t\tsmall: \"lg:text-sm lg:px-2 lg:py-1 lg:gap-2\",\n\t\tmedium: \"lg:text-base lg:px-4 lg:py-2 lg:gap-4\",\n\t\tlarge: \"lg:text-lg lg:px-6 lg:py-3 lg:gap-6\",\n\t},\n};\n\nconst buttonStyles = getVariants({\n\tbase: \"flex w-fit cursor-pointer items-center justify-center gap-2 rounded border font-semibold\",\n\tvariants: {\n\t\tvariant: {\n\t\t\tprimary:\n\t\t\t\t\"border-transparent bg-gray-700 text-white hover:bg-gray-800 active:bg-gray-900\",\n\t\t\tsecondary:\n\t\t\t\t\"border-gray-700 bg-white text-gray-700 hover:bg-gray-50 active:bg-gray-100\",\n\t\t\tdestructive:\n\t\t\t\t\"border-transparent bg-red-500 text-white hover:bg-red-600 active:bg-red-700\",\n\t\t},\n\t\tsize: {\n\t\t\tsmall: \"gap-2 px-2 py-1 text-sm\",\n\t\t\tmedium: \"gap-3 px-4 py-2 text-base\",\n\t\t\tlarge: \"gap-4 px-6 py-3 text-lg\",\n\t\t},\n\t\tdisabled: {\n\t\t\ttrue: \"cursor-not-allowed opacity-50\",\n\t\t},\n\t},\n\tcompoundVariants: [\n\t\t{\n\t\t\tvariant: \"secondary\",\n\t\t\tsize: \"medium\",\n\t\t\tclassName: \"test-compound-variant\",\n\t\t},\n\t],\n});\n\n/**\n * A flexible button component that supports variants, sizes, and icons\n * @param {Object} props - The props for the Button component\n * @param {'primary' | 'secondary'} [props.variant='primary'] - The visual style variant of the button\n * @param {'small' | 'medium' | 'large'} [props.size='medium'] - The size of the button\n * @param {boolean} [props.asChild] - Whether to render the button as a child component using Radix Slot\n * @param {React.ReactNode} [props.iconStart] - Icon element to display before the button content\n * @param {React.ReactNode} [props.iconEnd] - Icon element to display after the button content\n * @param {string} [props.className] - Additional CSS classes to apply\n * @param {boolean} [props.disabled] - Whether the button is disabled\n * @returns {React.ReactElement} The Button component\n * @example\n * // Basic usage\n * <Button>Click me</Button>\n *\n * // With variants and size\n * <Button variant=\"secondary\" size=\"large\">\n * Large Secondary Button\n * </Button>\n *\n * // With icons\n * <Button iconStart={<SearchIcon />} iconEnd={<ArrowRightIcon />}>\n * Search\n * </Button>\n *\n * // Disabled state\n * <Button disabled>Disabled Button</Button>\n */\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n\t(\n\t\t{\n\t\t\tasChild,\n\t\t\tchildren,\n\t\t\tvariant = \"primary\",\n\t\t\tsize = \"medium\",\n\t\t\tclassName,\n\t\t\tdisabled,\n\t\t\ticonStart,\n\t\t\ticonEnd,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst Component = asChild ? Slot : \"button\";\n\t\treturn (\n\t\t\t<Component\n\t\t\t\tref={ref}\n\t\t\t\tclassName={buttonStyles({ variant, size, disabled, className })}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t<Slottable child={children}>\n\t\t\t\t\t{(child) => (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{iconStart && (\n\t\t\t\t\t\t\t\t<Icon size={size} asChild>\n\t\t\t\t\t\t\t\t\t{iconStart}\n\t\t\t\t\t\t\t\t</Icon>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{child}\n\t\t\t\t\t\t\t{iconEnd && (\n\t\t\t\t\t\t\t\t<Icon size={size} asChild>\n\t\t\t\t\t\t\t\t\t{iconEnd}\n\t\t\t\t\t\t\t\t</Icon>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</>\n\t\t\t\t\t)}\n\t\t\t\t</Slottable>\n\t\t\t</Component>\n\t\t);\n\t},\n);\n\nButton.displayName = \"Button\";\n"]}
@@ -6,7 +6,7 @@ import { forwardRef, } from "react";
6
6
  const Dialog = RadixDialog.Root;
7
7
  const DialogTrigger = RadixDialog.Trigger;
8
8
  const DialogClose = RadixDialog.Close;
9
- const DialogOverlay = forwardRef(({ className, ...props }, ref) => (_jsx(RadixDialog.Overlay, { ref: ref, className: cn("data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-out data-[state=open]:animate-in", className), ...props })));
9
+ const DialogOverlay = forwardRef(({ className, ...props }, ref) => (_jsx(RadixDialog.Overlay, { ref: ref, className: cn("fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-fade-out data-[state=closed]:animate-out data-[state=open]:animate-fade-in data-[state=open]:animate-in", className), ...props })));
10
10
  DialogOverlay.displayName = RadixDialog.Overlay.displayName;
11
11
  const DialogContent = forwardRef(({ children, className, ...props }, ref) => {
12
12
  return (_jsxs(DialogOverlay, { children: [_jsx(DialogOverlay, {}), _jsxs(RadixDialog.Content, { className: cn("-translate-x-1/2 -translate-y-1/2 fixed top-1/2 left-1/2 z-50 flex w-fit max-w-xl flex-col gap-4 rounded-lg bg-white p-4", className), ...props, ref: ref, children: [_jsx(DialogClose, { asChild: true, children: _jsx("button", { type: "button", className: "absolute top-4 right-4", children: _jsx(Cross1Icon, { className: "h-4 w-4" }) }) }), children] })] }));
@@ -1 +1 @@
1
- {"version":3,"file":"dialog.js","sourceRoot":"/","sources":["components/dialog/dialog.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Cross1Icon } from \"@radix-ui/react-icons\";\nimport { cn } from \"@utilities/cn/cn\";\nimport { Dialog as RadixDialog } from \"radix-ui\";\nimport {\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\tforwardRef,\n} from \"react\";\n\nconst Dialog = RadixDialog.Root;\n\nconst DialogTrigger = RadixDialog.Trigger;\n\nconst DialogClose = RadixDialog.Close;\n\nconst DialogOverlay = forwardRef<\n\tComponentRef<typeof RadixDialog.Overlay>,\n\tComponentPropsWithoutRef<typeof RadixDialog.Overlay>\n>(({ className, ...props }, ref) => (\n\t<RadixDialog.Overlay\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-out data-[state=open]:animate-in\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nDialogOverlay.displayName = RadixDialog.Overlay.displayName;\n\nconst DialogContent = forwardRef<\n\tComponentRef<typeof RadixDialog.Content>,\n\tComponentPropsWithoutRef<typeof RadixDialog.Content>\n>(({ children, className, ...props }, ref) => {\n\treturn (\n\t\t<DialogOverlay>\n\t\t\t<DialogOverlay />\n\t\t\t<RadixDialog.Content\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"-translate-x-1/2 -translate-y-1/2 fixed top-1/2 left-1/2 z-50 flex w-fit max-w-xl flex-col gap-4 rounded-lg bg-white p-4\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t\tref={ref}\n\t\t\t>\n\t\t\t\t<DialogClose asChild>\n\t\t\t\t\t<button type=\"button\" className=\"absolute top-4 right-4\">\n\t\t\t\t\t\t<Cross1Icon className=\"h-4 w-4\" />\n\t\t\t\t\t</button>\n\t\t\t\t</DialogClose>\n\t\t\t\t{children}\n\t\t\t</RadixDialog.Content>\n\t\t</DialogOverlay>\n\t);\n});\n\nconst DialogHeader = forwardRef<\n\tHTMLDivElement,\n\tComponentPropsWithoutRef<\"div\">\n>(({ className, ...props }, ref) => (\n\t<div ref={ref} className={cn(\"flex flex-col gap-1\", className)} {...props} />\n));\n\nDialogHeader.displayName = \"DialogHeader\";\n\nconst DialogTitle = forwardRef<\n\tComponentRef<typeof RadixDialog.Title>,\n\tComponentPropsWithoutRef<typeof RadixDialog.Title>\n>(({ className, ...props }, ref) => (\n\t<RadixDialog.Title\n\t\tref={ref}\n\t\tclassName={cn(\"font-semibold text-lg\", className)}\n\t\t{...props}\n\t/>\n));\n\nDialogTitle.displayName = \"DialogTitle\";\n\nconst DialogDescription = forwardRef<\n\tComponentRef<typeof RadixDialog.Description>,\n\tComponentPropsWithoutRef<typeof RadixDialog.Description>\n>(({ className, ...props }, ref) => (\n\t<RadixDialog.Description\n\t\tref={ref}\n\t\tclassName={cn(\"text-gray-500 text-sm\", className)}\n\t\t{...props}\n\t/>\n));\n\nDialogDescription.displayName = \"DialogDescription\";\n\nconst DialogFooter = forwardRef<\n\tHTMLDivElement,\n\tComponentPropsWithoutRef<\"div\">\n>(({ className, ...props }, ref) => (\n\t<div\n\t\tref={ref}\n\t\tclassName={cn(\"flex justify-end gap-2\", className)}\n\t\t{...props}\n\t/>\n));\n\nDialogFooter.displayName = \"DialogFooter\";\nexport {\n\tDialog,\n\tDialogClose,\n\tDialogContent,\n\tDialogDescription,\n\tDialogFooter,\n\tDialogHeader,\n\tDialogTitle,\n\tDialogTrigger,\n};\n"]}
1
+ {"version":3,"file":"dialog.js","sourceRoot":"/","sources":["components/dialog/dialog.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Cross1Icon } from \"@radix-ui/react-icons\";\nimport { cn } from \"@utilities/cn/cn\";\nimport { Dialog as RadixDialog } from \"radix-ui\";\nimport {\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\tforwardRef,\n} from \"react\";\n\nconst Dialog = RadixDialog.Root;\n\nconst DialogTrigger = RadixDialog.Trigger;\n\nconst DialogClose = RadixDialog.Close;\n\nconst DialogOverlay = forwardRef<\n\tComponentRef<typeof RadixDialog.Overlay>,\n\tComponentPropsWithoutRef<typeof RadixDialog.Overlay>\n>(({ className, ...props }, ref) => (\n\t<RadixDialog.Overlay\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-fade-out data-[state=closed]:animate-out data-[state=open]:animate-fade-in data-[state=open]:animate-in\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nDialogOverlay.displayName = RadixDialog.Overlay.displayName;\n\nconst DialogContent = forwardRef<\n\tComponentRef<typeof RadixDialog.Content>,\n\tComponentPropsWithoutRef<typeof RadixDialog.Content>\n>(({ children, className, ...props }, ref) => {\n\treturn (\n\t\t<DialogOverlay>\n\t\t\t<DialogOverlay />\n\t\t\t<RadixDialog.Content\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"-translate-x-1/2 -translate-y-1/2 fixed top-1/2 left-1/2 z-50 flex w-fit max-w-xl flex-col gap-4 rounded-lg bg-white p-4\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t\tref={ref}\n\t\t\t>\n\t\t\t\t<DialogClose asChild>\n\t\t\t\t\t<button type=\"button\" className=\"absolute top-4 right-4\">\n\t\t\t\t\t\t<Cross1Icon className=\"h-4 w-4\" />\n\t\t\t\t\t</button>\n\t\t\t\t</DialogClose>\n\t\t\t\t{children}\n\t\t\t</RadixDialog.Content>\n\t\t</DialogOverlay>\n\t);\n});\n\nconst DialogHeader = forwardRef<\n\tHTMLDivElement,\n\tComponentPropsWithoutRef<\"div\">\n>(({ className, ...props }, ref) => (\n\t<div ref={ref} className={cn(\"flex flex-col gap-1\", className)} {...props} />\n));\n\nDialogHeader.displayName = \"DialogHeader\";\n\nconst DialogTitle = forwardRef<\n\tComponentRef<typeof RadixDialog.Title>,\n\tComponentPropsWithoutRef<typeof RadixDialog.Title>\n>(({ className, ...props }, ref) => (\n\t<RadixDialog.Title\n\t\tref={ref}\n\t\tclassName={cn(\"font-semibold text-lg\", className)}\n\t\t{...props}\n\t/>\n));\n\nDialogTitle.displayName = \"DialogTitle\";\n\nconst DialogDescription = forwardRef<\n\tComponentRef<typeof RadixDialog.Description>,\n\tComponentPropsWithoutRef<typeof RadixDialog.Description>\n>(({ className, ...props }, ref) => (\n\t<RadixDialog.Description\n\t\tref={ref}\n\t\tclassName={cn(\"text-gray-500 text-sm\", className)}\n\t\t{...props}\n\t/>\n));\n\nDialogDescription.displayName = \"DialogDescription\";\n\nconst DialogFooter = forwardRef<\n\tHTMLDivElement,\n\tComponentPropsWithoutRef<\"div\">\n>(({ className, ...props }, ref) => (\n\t<div\n\t\tref={ref}\n\t\tclassName={cn(\"flex justify-end gap-2\", className)}\n\t\t{...props}\n\t/>\n));\n\nDialogFooter.displayName = \"DialogFooter\";\nexport {\n\tDialog,\n\tDialogClose,\n\tDialogContent,\n\tDialogDescription,\n\tDialogFooter,\n\tDialogHeader,\n\tDialogTitle,\n\tDialogTrigger,\n};\n"]}
@@ -0,0 +1,16 @@
1
+ import { Dialog as RadixDialog } from "radix-ui";
2
+ /**
3
+ * Drawer Context
4
+ */
5
+ type DrawerContextValue = {
6
+ side?: "left" | "right" | "top" | "bottom";
7
+ };
8
+ declare const Drawer: ({ children, side, ...props }: RadixDialog.DialogProps & DrawerContextValue) => import("react/jsx-runtime").JSX.Element;
9
+ declare const DrawerTrigger: import("react").ForwardRefExoticComponent<RadixDialog.DialogTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
10
+ declare const DrawerClose: import("react").ForwardRefExoticComponent<RadixDialog.DialogCloseProps & import("react").RefAttributes<HTMLButtonElement>>;
11
+ declare const DrawerContent: import("react").ForwardRefExoticComponent<Omit<RadixDialog.DialogContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
12
+ declare const DrawerHeader: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
13
+ declare const DrawerTitle: import("react").ForwardRefExoticComponent<Omit<RadixDialog.DialogTitleProps & import("react").RefAttributes<HTMLHeadingElement>, "ref"> & import("react").RefAttributes<HTMLHeadingElement>>;
14
+ declare const DrawerDescription: import("react").ForwardRefExoticComponent<Omit<RadixDialog.DialogDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>;
15
+ declare const DrawerFooter: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
16
+ export { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerTitle, DrawerTrigger, };
@@ -0,0 +1,49 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { Cross1Icon } from "@radix-ui/react-icons";
3
+ import { cn } from "../../utilities/cn/cn";
4
+ import { getVariants } from "../../utilities/get-variants/get-variants";
5
+ import { Dialog as RadixDialog } from "radix-ui";
6
+ import { createContext, forwardRef, useContext, useMemo, } from "react";
7
+ const DrawerContext = createContext(undefined);
8
+ const useDrawerContext = () => {
9
+ const context = useContext(DrawerContext);
10
+ if (!context) {
11
+ throw new Error("Drawer components must be used within a Drawer");
12
+ }
13
+ return context;
14
+ };
15
+ const Drawer = ({ children, side, ...props }) => {
16
+ const contextValue = useMemo(() => ({
17
+ side,
18
+ }), [side]);
19
+ return (_jsx(DrawerContext.Provider, { value: contextValue, children: _jsx(RadixDialog.Root, { ...props, children: children }) }));
20
+ };
21
+ const DrawerTrigger = RadixDialog.Trigger;
22
+ const DrawerClose = RadixDialog.Close;
23
+ const DrawerOverlay = forwardRef(({ className, ...props }, ref) => (_jsx(RadixDialog.Overlay, { ref: ref, className: cn("fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-fade-out data-[state=closed]:animate-out data-[state=open]:animate-fade-in data-[state=open]:animate-in", className), ...props })));
24
+ DrawerOverlay.displayName = RadixDialog.Overlay.displayName;
25
+ const drawerContentStyles = getVariants({
26
+ base: "fixed z-50 flex flex-col gap-4 bg-white p-4",
27
+ variants: {
28
+ side: {
29
+ left: "left-0 h-screen w-fit rounded-r-lg data-[state=closed]:animate-slide-out-left data-[state=open]:animate-slide-in-left",
30
+ right: "right-0 h-screen w-fit rounded-l-lg data-[state=closed]:animate-slide-out-right data-[state=open]:animate-slide-in-right",
31
+ top: "top-0 h-fit w-screen rounded-b-lg data-[state=closed]:animate-slide-out-top data-[state=open]:animate-slide-in-top",
32
+ bottom: "bottom-0 h-fit w-screen rounded-t-lg data-[state=closed]:animate-slide-out-bottom data-[state=open]:animate-slide-in-bottom",
33
+ },
34
+ },
35
+ });
36
+ const DrawerContent = forwardRef(({ children, className, ...props }, ref) => {
37
+ const { side = "right" } = useDrawerContext();
38
+ return (_jsx(DrawerOverlay, { children: _jsxs(RadixDialog.Content, { className: drawerContentStyles({ side }), ...props, ref: ref, children: [_jsx(DrawerClose, { asChild: true, children: _jsx("button", { type: "button", className: "absolute top-4 right-4", children: _jsx(Cross1Icon, { className: "h-4 w-4" }) }) }), children] }) }));
39
+ });
40
+ const DrawerHeader = forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn("flex flex-col gap-1", className), ...props })));
41
+ DrawerHeader.displayName = "DrawerHeader";
42
+ const DrawerTitle = forwardRef(({ className, ...props }, ref) => (_jsx(RadixDialog.Title, { ref: ref, className: cn("font-semibold text-lg", className), ...props })));
43
+ DrawerTitle.displayName = "DrawerTitle";
44
+ const DrawerDescription = forwardRef(({ className, ...props }, ref) => (_jsx(RadixDialog.Description, { ref: ref, className: cn("text-gray-500 text-sm", className), ...props })));
45
+ DrawerDescription.displayName = "DrawerDescription";
46
+ const DrawerFooter = forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn("flex justify-end gap-2", className), ...props })));
47
+ DrawerFooter.displayName = "DrawerFooter";
48
+ export { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerTitle, DrawerTrigger, };
49
+ //# sourceMappingURL=drawer.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"drawer.js","sourceRoot":"/","sources":["components/drawer/drawer.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Cross1Icon } from \"@radix-ui/react-icons\";\nimport { cn } from \"@utilities/cn/cn\";\nimport { getVariants } from \"@utilities/get-variants/get-variants\";\nimport { Dialog as RadixDialog } from \"radix-ui\";\nimport {\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\tcreateContext,\n\tforwardRef,\n\tuseContext,\n\tuseMemo,\n} from \"react\";\n\n/**\n * Drawer Context\n */\n\ntype DrawerContextValue = {\n\tside?: \"left\" | \"right\" | \"top\" | \"bottom\";\n};\n\nconst DrawerContext = createContext<DrawerContextValue | undefined>(undefined);\n\nconst useDrawerContext = () => {\n\tconst context = useContext(DrawerContext);\n\tif (!context) {\n\t\tthrow new Error(\"Drawer components must be used within a Drawer\");\n\t}\n\treturn context;\n};\n\nconst Drawer = ({\n\tchildren,\n\tside,\n\t...props\n}: RadixDialog.DialogProps & DrawerContextValue) => {\n\tconst contextValue = useMemo(\n\t\t() => ({\n\t\t\tside,\n\t\t}),\n\t\t[side],\n\t);\n\treturn (\n\t\t<DrawerContext.Provider value={contextValue}>\n\t\t\t<RadixDialog.Root {...props}>{children}</RadixDialog.Root>\n\t\t</DrawerContext.Provider>\n\t);\n};\n\nconst DrawerTrigger = RadixDialog.Trigger;\n\nconst DrawerClose = RadixDialog.Close;\n\nconst DrawerOverlay = forwardRef<\n\tComponentRef<typeof RadixDialog.Overlay>,\n\tComponentPropsWithoutRef<typeof RadixDialog.Overlay>\n>(({ className, ...props }, ref) => (\n\t<RadixDialog.Overlay\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-fade-out data-[state=closed]:animate-out data-[state=open]:animate-fade-in data-[state=open]:animate-in\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nDrawerOverlay.displayName = RadixDialog.Overlay.displayName;\n\nconst drawerContentStyles = getVariants({\n\tbase: \"fixed z-50 flex flex-col gap-4 bg-white p-4\",\n\tvariants: {\n\t\tside: {\n\t\t\tleft: \"left-0 h-screen w-fit rounded-r-lg data-[state=closed]:animate-slide-out-left data-[state=open]:animate-slide-in-left\",\n\t\t\tright:\n\t\t\t\t\"right-0 h-screen w-fit rounded-l-lg data-[state=closed]:animate-slide-out-right data-[state=open]:animate-slide-in-right\",\n\t\t\ttop: \"top-0 h-fit w-screen rounded-b-lg data-[state=closed]:animate-slide-out-top data-[state=open]:animate-slide-in-top\",\n\t\t\tbottom:\n\t\t\t\t\"bottom-0 h-fit w-screen rounded-t-lg data-[state=closed]:animate-slide-out-bottom data-[state=open]:animate-slide-in-bottom\",\n\t\t},\n\t},\n});\n\nconst DrawerContent = forwardRef<\n\tComponentRef<typeof RadixDialog.Content>,\n\tComponentPropsWithoutRef<typeof RadixDialog.Content>\n>(({ children, className, ...props }, ref) => {\n\tconst { side = \"right\" } = useDrawerContext();\n\treturn (\n\t\t<DrawerOverlay>\n\t\t\t<RadixDialog.Content\n\t\t\t\tclassName={drawerContentStyles({ side })}\n\t\t\t\t{...props}\n\t\t\t\tref={ref}\n\t\t\t>\n\t\t\t\t<DrawerClose asChild>\n\t\t\t\t\t<button type=\"button\" className=\"absolute top-4 right-4\">\n\t\t\t\t\t\t<Cross1Icon className=\"h-4 w-4\" />\n\t\t\t\t\t</button>\n\t\t\t\t</DrawerClose>\n\t\t\t\t{children}\n\t\t\t</RadixDialog.Content>\n\t\t</DrawerOverlay>\n\t);\n});\n\nconst DrawerHeader = forwardRef<\n\tHTMLDivElement,\n\tComponentPropsWithoutRef<\"div\">\n>(({ className, ...props }, ref) => (\n\t<div ref={ref} className={cn(\"flex flex-col gap-1\", className)} {...props} />\n));\n\nDrawerHeader.displayName = \"DrawerHeader\";\n\nconst DrawerTitle = forwardRef<\n\tComponentRef<typeof RadixDialog.Title>,\n\tComponentPropsWithoutRef<typeof RadixDialog.Title>\n>(({ className, ...props }, ref) => (\n\t<RadixDialog.Title\n\t\tref={ref}\n\t\tclassName={cn(\"font-semibold text-lg\", className)}\n\t\t{...props}\n\t/>\n));\n\nDrawerTitle.displayName = \"DrawerTitle\";\n\nconst DrawerDescription = forwardRef<\n\tComponentRef<typeof RadixDialog.Description>,\n\tComponentPropsWithoutRef<typeof RadixDialog.Description>\n>(({ className, ...props }, ref) => (\n\t<RadixDialog.Description\n\t\tref={ref}\n\t\tclassName={cn(\"text-gray-500 text-sm\", className)}\n\t\t{...props}\n\t/>\n));\n\nDrawerDescription.displayName = \"DrawerDescription\";\n\nconst DrawerFooter = forwardRef<\n\tHTMLDivElement,\n\tComponentPropsWithoutRef<\"div\">\n>(({ className, ...props }, ref) => (\n\t<div\n\t\tref={ref}\n\t\tclassName={cn(\"flex justify-end gap-2\", className)}\n\t\t{...props}\n\t/>\n));\n\nDrawerFooter.displayName = \"DrawerFooter\";\n\nexport {\n\tDrawer,\n\tDrawerClose,\n\tDrawerContent,\n\tDrawerDescription,\n\tDrawerFooter,\n\tDrawerHeader,\n\tDrawerTitle,\n\tDrawerTrigger,\n};\n"]}
@@ -12,10 +12,10 @@ const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
12
12
  const DropdownMenuSubTrigger = forwardRef(({ className, inset, children, ...props }, ref) => (_jsxs(DropdownMenuPrimitive.SubTrigger, { ref: ref, className: cn("flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none focus-visible:bg-gray-200 focus-visible:text-gray-700 data-[state=open]:bg-gray-200 data-[state=open]:text-gray-900 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0", inset && "pl-8", className), ...props, children: [children, _jsx(ChevronRightIcon, { className: "ml-auto" })] })));
13
13
  DropdownMenuSubTrigger.displayName =
14
14
  DropdownMenuPrimitive.SubTrigger.displayName;
15
- const DropdownMenuSubContent = forwardRef(({ className, ...props }, ref) => (_jsx(DropdownMenuPrimitive.SubContent, { ref: ref, className: cn("data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-[--radix-dropdown-menu-content-transform-origin] overflow-hidden rounded-md border border-gray-200 bg-gray-50 p-1 text-gray-700 shadow-lg data-[state=closed]:animate-fade-out data-[state=open]:animate-fade-in", className), ...props })));
15
+ const DropdownMenuSubContent = forwardRef(({ className, ...props }, ref) => (_jsx(DropdownMenuPrimitive.SubContent, { ref: ref, className: cn("data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-[--radix-dropdown-menu-content-transform-origin] overflow-hidden rounded-md border border-gray-200 bg-gray-50 p-1 text-gray-700 shadow-lg data-[state=closed]:animate-fade-out data-[state=open]:animate-fade-in", className), ...props })));
16
16
  DropdownMenuSubContent.displayName =
17
17
  DropdownMenuPrimitive.SubContent.displayName;
18
- const DropdownMenuContent = forwardRef(({ className, sideOffset = 4, ...props }, ref) => (_jsx(DropdownMenuPrimitive.Portal, { children: _jsx(DropdownMenuPrimitive.Content, { ref: ref, sideOffset: sideOffset, className: cn("z-50 max-h-[var(--radix-dropdown-menu-content-available-height)] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border border-gray-200 bg-gray-50 p-1 text-gray-700 shadow-md", "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-dropdown-menu-content-transform-origin] data-[state=closed]:animate-fade-out data-[state=open]:animate-fade-in", className), ...props }) })));
18
+ const DropdownMenuContent = forwardRef(({ className, sideOffset = 4, ...props }, ref) => (_jsx(DropdownMenuPrimitive.Portal, { children: _jsx(DropdownMenuPrimitive.Content, { ref: ref, sideOffset: sideOffset, className: cn("z-50 max-h-[var(--radix-dropdown-menu-content-available-height)] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border border-gray-200 bg-gray-50 p-1 text-gray-700 shadow-md", "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-dropdown-menu-content-transform-origin] data-[state=closed]:animate-fade-out data-[state=open]:animate-fade-in", className), ...props }) })));
19
19
  DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
20
20
  const DropdownMenuItem = forwardRef(({ className, inset, ...props }, ref) => (_jsx(DropdownMenuPrimitive.Item, { ref: ref, className: cn("relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus-visible:bg-gray-200 focus-visible:text-gray-700 data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&>svg]:size-4 [&>svg]:shrink-0", inset && "pl-8", className), ...props })));
21
21
  DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
@@ -1 +1 @@
1
- {"version":3,"file":"dropdown-menu.js","sourceRoot":"/","sources":["components/dropdown-menu/dropdown-menu.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAChF,OAAO,EAAE,YAAY,IAAI,qBAAqB,EAAE,MAAM,UAAU,CAAC;AAEjE,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAGN,UAAU,GACV,MAAM,OAAO,CAAC;AAEf,MAAM,YAAY,GAAG,qBAAqB,CAAC,IAAI,CAAC;AAEhD,MAAM,mBAAmB,GAAG,qBAAqB,CAAC,OAAO,CAAC;AAE1D,MAAM,iBAAiB,GAAG,qBAAqB,CAAC,KAAK,CAAC;AAEtD,MAAM,kBAAkB,GAAG,qBAAqB,CAAC,MAAM,CAAC;AAExD,MAAM,eAAe,GAAG,qBAAqB,CAAC,GAAG,CAAC;AAElD,MAAM,sBAAsB,GAAG,qBAAqB,CAAC,UAAU,CAAC;AAEhE,MAAM,sBAAsB,GAAG,UAAU,CAKvC,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACpD,MAAC,qBAAqB,CAAC,UAAU,IAChC,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACZ,gRAAgR,EAChR,KAAK,IAAI,MAAM,EACf,SAAS,CACT,KACG,KAAK,aAER,QAAQ,EACT,KAAC,gBAAgB,IAAC,SAAS,EAAC,SAAS,GAAG,IACN,CACnC,CAAC,CAAC;AACH,sBAAsB,CAAC,WAAW;IACjC,qBAAqB,CAAC,UAAU,CAAC,WAAW,CAAC;AAE9C,MAAM,sBAAsB,GAAG,UAAU,CAGvC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACnC,KAAC,qBAAqB,CAAC,UAAU,IAChC,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACZ,+fAA+f,EAC/f,SAAS,CACT,KACG,KAAK,GACR,CACF,CAAC,CAAC;AACH,sBAAsB,CAAC,WAAW;IACjC,qBAAqB,CAAC,UAAU,CAAC,WAAW,CAAC;AAE9C,MAAM,mBAAmB,GAAG,UAAU,CAGpC,CAAC,EAAE,SAAS,EAAE,UAAU,GAAG,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACnD,KAAC,qBAAqB,CAAC,MAAM,cAC5B,KAAC,qBAAqB,CAAC,OAAO,IAC7B,GAAG,EAAE,GAAG,EACR,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,EAAE,CACZ,0LAA0L,EAC1L,oZAAoZ,EACpZ,SAAS,CACT,KACG,KAAK,GACR,GAC4B,CAC/B,CAAC,CAAC;AACH,mBAAmB,CAAC,WAAW,GAAG,qBAAqB,CAAC,OAAO,CAAC,WAAW,CAAC;AAE5E,MAAM,gBAAgB,GAAG,UAAU,CAKjC,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAC1C,KAAC,qBAAqB,CAAC,IAAI,IAC1B,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACZ,gRAAgR,EAChR,KAAK,IAAI,MAAM,EACf,SAAS,CACT,KACG,KAAK,GACR,CACF,CAAC,CAAC;AACH,gBAAgB,CAAC,WAAW,GAAG,qBAAqB,CAAC,IAAI,CAAC,WAAW,CAAC;AAEtE,MAAM,wBAAwB,GAAG,UAAU,CAGzC,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACtD,MAAC,qBAAqB,CAAC,YAAY,IAClC,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACZ,+OAA+O,EAC/O,SAAS,CACT,EACD,OAAO,EAAE,OAAO,KACZ,KAAK,aAET,eAAM,SAAS,EAAC,8DAA8D,YAC7E,KAAC,qBAAqB,CAAC,aAAa,cACnC,KAAC,SAAS,IAAC,SAAS,EAAC,SAAS,GAAG,GACI,GAChC,EACN,QAAQ,IAC2B,CACrC,CAAC,CAAC;AACH,wBAAwB,CAAC,WAAW;IACnC,qBAAqB,CAAC,YAAY,CAAC,WAAW,CAAC;AAEhD,MAAM,qBAAqB,GAAG,UAAU,CAGtC,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAC7C,MAAC,qBAAqB,CAAC,SAAS,IAC/B,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACZ,+OAA+O,EAC/O,SAAS,CACT,KACG,KAAK,aAET,eAAM,SAAS,EAAC,8DAA8D,YAC7E,KAAC,qBAAqB,CAAC,aAAa,cACnC,KAAC,UAAU,IAAC,SAAS,EAAC,sBAAsB,GAAG,GACV,GAChC,EACN,QAAQ,IACwB,CAClC,CAAC,CAAC;AACH,qBAAqB,CAAC,WAAW,GAAG,qBAAqB,CAAC,SAAS,CAAC,WAAW,CAAC;AAEhF,MAAM,iBAAiB,GAAG,UAAU,CAKlC,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAC1C,KAAC,qBAAqB,CAAC,KAAK,IAC3B,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACZ,mCAAmC,EACnC,KAAK,IAAI,MAAM,EACf,SAAS,CACT,KACG,KAAK,GACR,CACF,CAAC,CAAC;AACH,iBAAiB,CAAC,WAAW,GAAG,qBAAqB,CAAC,KAAK,CAAC,WAAW,CAAC;AAExE,MAAM,qBAAqB,GAAG,UAAU,CAGtC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACnC,KAAC,qBAAqB,CAAC,SAAS,IAC/B,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,6BAA6B,EAAE,SAAS,CAAC,KACnD,KAAK,GACR,CACF,CAAC,CAAC;AACH,qBAAqB,CAAC,WAAW,GAAG,qBAAqB,CAAC,SAAS,CAAC,WAAW,CAAC;AAEhF,MAAM,oBAAoB,GAAG,CAAC,EAC7B,SAAS,EACT,GAAG,KAAK,EAC+B,EAAE,EAAE;IAC3C,OAAO,CACN,eACC,SAAS,EAAE,EAAE,CAAC,4CAA4C,EAAE,SAAS,CAAC,KAClE,KAAK,GACR,CACF,CAAC;AACH,CAAC,CAAC;AACF,oBAAoB,CAAC,WAAW,GAAG,sBAAsB,CAAC;AAE1D,OAAO,EACN,YAAY,EACZ,mBAAmB,EACnB,mBAAmB,EACnB,gBAAgB,EAChB,wBAAwB,EACxB,qBAAqB,EACrB,iBAAiB,EACjB,qBAAqB,EACrB,oBAAoB,EACpB,iBAAiB,EACjB,kBAAkB,EAClB,eAAe,EACf,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,GACtB,CAAC","sourcesContent":["import { CheckIcon, ChevronRightIcon, CircleIcon } from \"@radix-ui/react-icons\";\nimport { DropdownMenu as DropdownMenuPrimitive } from \"radix-ui\";\n\nimport { cn } from \"@utilities/cn/cn\";\nimport {\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\tforwardRef,\n} from \"react\";\n\nconst DropdownMenu = DropdownMenuPrimitive.Root;\n\nconst DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;\n\nconst DropdownMenuGroup = DropdownMenuPrimitive.Group;\n\nconst DropdownMenuPortal = DropdownMenuPrimitive.Portal;\n\nconst DropdownMenuSub = DropdownMenuPrimitive.Sub;\n\nconst DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;\n\nconst DropdownMenuSubTrigger = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.SubTrigger>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, children, ...props }, ref) => (\n\t<DropdownMenuPrimitive.SubTrigger\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none focus-visible:bg-gray-200 focus-visible:text-gray-700 data-[state=open]:bg-gray-200 data-[state=open]:text-gray-900 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0\",\n\t\t\tinset && \"pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t{children}\n\t\t<ChevronRightIcon className=\"ml-auto\" />\n\t</DropdownMenuPrimitive.SubTrigger>\n));\nDropdownMenuSubTrigger.displayName =\n\tDropdownMenuPrimitive.SubTrigger.displayName;\n\nconst DropdownMenuSubContent = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.SubContent>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>\n>(({ className, ...props }, ref) => (\n\t<DropdownMenuPrimitive.SubContent\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-[--radix-dropdown-menu-content-transform-origin] overflow-hidden rounded-md border border-gray-200 bg-gray-50 p-1 text-gray-700 shadow-lg data-[state=closed]:animate-fade-out data-[state=open]:animate-fade-in\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nDropdownMenuSubContent.displayName =\n\tDropdownMenuPrimitive.SubContent.displayName;\n\nconst DropdownMenuContent = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Content>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content>\n>(({ className, sideOffset = 4, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Portal>\n\t\t<DropdownMenuPrimitive.Content\n\t\t\tref={ref}\n\t\t\tsideOffset={sideOffset}\n\t\t\tclassName={cn(\n\t\t\t\t\"z-50 max-h-[var(--radix-dropdown-menu-content-available-height)] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border border-gray-200 bg-gray-50 p-1 text-gray-700 shadow-md\",\n\t\t\t\t\"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-dropdown-menu-content-transform-origin] data-[state=closed]:animate-fade-out data-[state=open]:animate-fade-in\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t</DropdownMenuPrimitive.Portal>\n));\nDropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;\n\nconst DropdownMenuItem = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Item>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Item\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus-visible:bg-gray-200 focus-visible:text-gray-700 data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&>svg]:size-4 [&>svg]:shrink-0\",\n\t\t\tinset && \"pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nDropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;\n\nconst DropdownMenuCheckboxItem = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.CheckboxItem>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => (\n\t<DropdownMenuPrimitive.CheckboxItem\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"relative flex cursor-default select-none items-center rounded-sm py-1.5 pr-2 pl-8 text-sm outline-none transition-colors focus-visible:bg-gray-200 focus-visible:text-gray-700 data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n\t\t\tclassName,\n\t\t)}\n\t\tchecked={checked}\n\t\t{...props}\n\t>\n\t\t<span className=\"absolute left-2 flex h-3.5 w-3.5 items-center justify-center\">\n\t\t\t<DropdownMenuPrimitive.ItemIndicator>\n\t\t\t\t<CheckIcon className=\"h-4 w-4\" />\n\t\t\t</DropdownMenuPrimitive.ItemIndicator>\n\t\t</span>\n\t\t{children}\n\t</DropdownMenuPrimitive.CheckboxItem>\n));\nDropdownMenuCheckboxItem.displayName =\n\tDropdownMenuPrimitive.CheckboxItem.displayName;\n\nconst DropdownMenuRadioItem = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.RadioItem>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioItem>\n>(({ className, children, ...props }, ref) => (\n\t<DropdownMenuPrimitive.RadioItem\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"relative flex cursor-default select-none items-center rounded-sm py-1.5 pr-2 pl-8 text-sm outline-none transition-colors focus-visible:bg-gray-200 focus-visible:text-gray-900 data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t<span className=\"absolute left-2 flex h-3.5 w-3.5 items-center justify-center\">\n\t\t\t<DropdownMenuPrimitive.ItemIndicator>\n\t\t\t\t<CircleIcon className=\"h-2 w-2 fill-current\" />\n\t\t\t</DropdownMenuPrimitive.ItemIndicator>\n\t\t</span>\n\t\t{children}\n\t</DropdownMenuPrimitive.RadioItem>\n));\nDropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;\n\nconst DropdownMenuLabel = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Label>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Label\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"px-2 py-1.5 font-semibold text-sm\",\n\t\t\tinset && \"pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nDropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;\n\nconst DropdownMenuSeparator = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Separator>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Separator\n\t\tref={ref}\n\t\tclassName={cn(\"-mx-1 my-1 h-px bg-gray-200\", className)}\n\t\t{...props}\n\t/>\n));\nDropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;\n\nconst DropdownMenuShortcut = ({\n\tclassName,\n\t...props\n}: React.HTMLAttributes<HTMLSpanElement>) => {\n\treturn (\n\t\t<span\n\t\t\tclassName={cn(\"ml-auto text-xs tracking-widest opacity-60\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n};\nDropdownMenuShortcut.displayName = \"DropdownMenuShortcut\";\n\nexport {\n\tDropdownMenu,\n\tDropdownMenuTrigger,\n\tDropdownMenuContent,\n\tDropdownMenuItem,\n\tDropdownMenuCheckboxItem,\n\tDropdownMenuRadioItem,\n\tDropdownMenuLabel,\n\tDropdownMenuSeparator,\n\tDropdownMenuShortcut,\n\tDropdownMenuGroup,\n\tDropdownMenuPortal,\n\tDropdownMenuSub,\n\tDropdownMenuSubContent,\n\tDropdownMenuSubTrigger,\n\tDropdownMenuRadioGroup,\n};\n"]}
1
+ {"version":3,"file":"dropdown-menu.js","sourceRoot":"/","sources":["components/dropdown-menu/dropdown-menu.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAChF,OAAO,EAAE,YAAY,IAAI,qBAAqB,EAAE,MAAM,UAAU,CAAC;AAEjE,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAGN,UAAU,GACV,MAAM,OAAO,CAAC;AAEf,MAAM,YAAY,GAAG,qBAAqB,CAAC,IAAI,CAAC;AAEhD,MAAM,mBAAmB,GAAG,qBAAqB,CAAC,OAAO,CAAC;AAE1D,MAAM,iBAAiB,GAAG,qBAAqB,CAAC,KAAK,CAAC;AAEtD,MAAM,kBAAkB,GAAG,qBAAqB,CAAC,MAAM,CAAC;AAExD,MAAM,eAAe,GAAG,qBAAqB,CAAC,GAAG,CAAC;AAElD,MAAM,sBAAsB,GAAG,qBAAqB,CAAC,UAAU,CAAC;AAEhE,MAAM,sBAAsB,GAAG,UAAU,CAKvC,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACpD,MAAC,qBAAqB,CAAC,UAAU,IAChC,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACZ,gRAAgR,EAChR,KAAK,IAAI,MAAM,EACf,SAAS,CACT,KACG,KAAK,aAER,QAAQ,EACT,KAAC,gBAAgB,IAAC,SAAS,EAAC,SAAS,GAAG,IACN,CACnC,CAAC,CAAC;AACH,sBAAsB,CAAC,WAAW;IACjC,qBAAqB,CAAC,UAAU,CAAC,WAAW,CAAC;AAE9C,MAAM,sBAAsB,GAAG,UAAU,CAGvC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACnC,KAAC,qBAAqB,CAAC,UAAU,IAChC,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACZ,ocAAoc,EACpc,SAAS,CACT,KACG,KAAK,GACR,CACF,CAAC,CAAC;AACH,sBAAsB,CAAC,WAAW;IACjC,qBAAqB,CAAC,UAAU,CAAC,WAAW,CAAC;AAE9C,MAAM,mBAAmB,GAAG,UAAU,CAGpC,CAAC,EAAE,SAAS,EAAE,UAAU,GAAG,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACnD,KAAC,qBAAqB,CAAC,MAAM,cAC5B,KAAC,qBAAqB,CAAC,OAAO,IAC7B,GAAG,EAAE,GAAG,EACR,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,EAAE,CACZ,0LAA0L,EAC1L,yVAAyV,EACzV,SAAS,CACT,KACG,KAAK,GACR,GAC4B,CAC/B,CAAC,CAAC;AACH,mBAAmB,CAAC,WAAW,GAAG,qBAAqB,CAAC,OAAO,CAAC,WAAW,CAAC;AAE5E,MAAM,gBAAgB,GAAG,UAAU,CAKjC,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAC1C,KAAC,qBAAqB,CAAC,IAAI,IAC1B,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACZ,gRAAgR,EAChR,KAAK,IAAI,MAAM,EACf,SAAS,CACT,KACG,KAAK,GACR,CACF,CAAC,CAAC;AACH,gBAAgB,CAAC,WAAW,GAAG,qBAAqB,CAAC,IAAI,CAAC,WAAW,CAAC;AAEtE,MAAM,wBAAwB,GAAG,UAAU,CAGzC,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACtD,MAAC,qBAAqB,CAAC,YAAY,IAClC,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACZ,+OAA+O,EAC/O,SAAS,CACT,EACD,OAAO,EAAE,OAAO,KACZ,KAAK,aAET,eAAM,SAAS,EAAC,8DAA8D,YAC7E,KAAC,qBAAqB,CAAC,aAAa,cACnC,KAAC,SAAS,IAAC,SAAS,EAAC,SAAS,GAAG,GACI,GAChC,EACN,QAAQ,IAC2B,CACrC,CAAC,CAAC;AACH,wBAAwB,CAAC,WAAW;IACnC,qBAAqB,CAAC,YAAY,CAAC,WAAW,CAAC;AAEhD,MAAM,qBAAqB,GAAG,UAAU,CAGtC,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAC7C,MAAC,qBAAqB,CAAC,SAAS,IAC/B,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACZ,+OAA+O,EAC/O,SAAS,CACT,KACG,KAAK,aAET,eAAM,SAAS,EAAC,8DAA8D,YAC7E,KAAC,qBAAqB,CAAC,aAAa,cACnC,KAAC,UAAU,IAAC,SAAS,EAAC,sBAAsB,GAAG,GACV,GAChC,EACN,QAAQ,IACwB,CAClC,CAAC,CAAC;AACH,qBAAqB,CAAC,WAAW,GAAG,qBAAqB,CAAC,SAAS,CAAC,WAAW,CAAC;AAEhF,MAAM,iBAAiB,GAAG,UAAU,CAKlC,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAC1C,KAAC,qBAAqB,CAAC,KAAK,IAC3B,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACZ,mCAAmC,EACnC,KAAK,IAAI,MAAM,EACf,SAAS,CACT,KACG,KAAK,GACR,CACF,CAAC,CAAC;AACH,iBAAiB,CAAC,WAAW,GAAG,qBAAqB,CAAC,KAAK,CAAC,WAAW,CAAC;AAExE,MAAM,qBAAqB,GAAG,UAAU,CAGtC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACnC,KAAC,qBAAqB,CAAC,SAAS,IAC/B,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,6BAA6B,EAAE,SAAS,CAAC,KACnD,KAAK,GACR,CACF,CAAC,CAAC;AACH,qBAAqB,CAAC,WAAW,GAAG,qBAAqB,CAAC,SAAS,CAAC,WAAW,CAAC;AAEhF,MAAM,oBAAoB,GAAG,CAAC,EAC7B,SAAS,EACT,GAAG,KAAK,EAC+B,EAAE,EAAE;IAC3C,OAAO,CACN,eACC,SAAS,EAAE,EAAE,CAAC,4CAA4C,EAAE,SAAS,CAAC,KAClE,KAAK,GACR,CACF,CAAC;AACH,CAAC,CAAC;AACF,oBAAoB,CAAC,WAAW,GAAG,sBAAsB,CAAC;AAE1D,OAAO,EACN,YAAY,EACZ,mBAAmB,EACnB,mBAAmB,EACnB,gBAAgB,EAChB,wBAAwB,EACxB,qBAAqB,EACrB,iBAAiB,EACjB,qBAAqB,EACrB,oBAAoB,EACpB,iBAAiB,EACjB,kBAAkB,EAClB,eAAe,EACf,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,GACtB,CAAC","sourcesContent":["import { CheckIcon, ChevronRightIcon, CircleIcon } from \"@radix-ui/react-icons\";\nimport { DropdownMenu as DropdownMenuPrimitive } from \"radix-ui\";\n\nimport { cn } from \"@utilities/cn/cn\";\nimport {\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\tforwardRef,\n} from \"react\";\n\nconst DropdownMenu = DropdownMenuPrimitive.Root;\n\nconst DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;\n\nconst DropdownMenuGroup = DropdownMenuPrimitive.Group;\n\nconst DropdownMenuPortal = DropdownMenuPrimitive.Portal;\n\nconst DropdownMenuSub = DropdownMenuPrimitive.Sub;\n\nconst DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;\n\nconst DropdownMenuSubTrigger = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.SubTrigger>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, children, ...props }, ref) => (\n\t<DropdownMenuPrimitive.SubTrigger\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none focus-visible:bg-gray-200 focus-visible:text-gray-700 data-[state=open]:bg-gray-200 data-[state=open]:text-gray-900 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0\",\n\t\t\tinset && \"pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t{children}\n\t\t<ChevronRightIcon className=\"ml-auto\" />\n\t</DropdownMenuPrimitive.SubTrigger>\n));\nDropdownMenuSubTrigger.displayName =\n\tDropdownMenuPrimitive.SubTrigger.displayName;\n\nconst DropdownMenuSubContent = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.SubContent>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>\n>(({ className, ...props }, ref) => (\n\t<DropdownMenuPrimitive.SubContent\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-[--radix-dropdown-menu-content-transform-origin] overflow-hidden rounded-md border border-gray-200 bg-gray-50 p-1 text-gray-700 shadow-lg data-[state=closed]:animate-fade-out data-[state=open]:animate-fade-in\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nDropdownMenuSubContent.displayName =\n\tDropdownMenuPrimitive.SubContent.displayName;\n\nconst DropdownMenuContent = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Content>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content>\n>(({ className, sideOffset = 4, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Portal>\n\t\t<DropdownMenuPrimitive.Content\n\t\t\tref={ref}\n\t\t\tsideOffset={sideOffset}\n\t\t\tclassName={cn(\n\t\t\t\t\"z-50 max-h-[var(--radix-dropdown-menu-content-available-height)] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border border-gray-200 bg-gray-50 p-1 text-gray-700 shadow-md\",\n\t\t\t\t\"data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-dropdown-menu-content-transform-origin] data-[state=closed]:animate-fade-out data-[state=open]:animate-fade-in\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t</DropdownMenuPrimitive.Portal>\n));\nDropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;\n\nconst DropdownMenuItem = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Item>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Item\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus-visible:bg-gray-200 focus-visible:text-gray-700 data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&>svg]:size-4 [&>svg]:shrink-0\",\n\t\t\tinset && \"pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nDropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;\n\nconst DropdownMenuCheckboxItem = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.CheckboxItem>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => (\n\t<DropdownMenuPrimitive.CheckboxItem\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"relative flex cursor-default select-none items-center rounded-sm py-1.5 pr-2 pl-8 text-sm outline-none transition-colors focus-visible:bg-gray-200 focus-visible:text-gray-700 data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n\t\t\tclassName,\n\t\t)}\n\t\tchecked={checked}\n\t\t{...props}\n\t>\n\t\t<span className=\"absolute left-2 flex h-3.5 w-3.5 items-center justify-center\">\n\t\t\t<DropdownMenuPrimitive.ItemIndicator>\n\t\t\t\t<CheckIcon className=\"h-4 w-4\" />\n\t\t\t</DropdownMenuPrimitive.ItemIndicator>\n\t\t</span>\n\t\t{children}\n\t</DropdownMenuPrimitive.CheckboxItem>\n));\nDropdownMenuCheckboxItem.displayName =\n\tDropdownMenuPrimitive.CheckboxItem.displayName;\n\nconst DropdownMenuRadioItem = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.RadioItem>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioItem>\n>(({ className, children, ...props }, ref) => (\n\t<DropdownMenuPrimitive.RadioItem\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"relative flex cursor-default select-none items-center rounded-sm py-1.5 pr-2 pl-8 text-sm outline-none transition-colors focus-visible:bg-gray-200 focus-visible:text-gray-900 data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t<span className=\"absolute left-2 flex h-3.5 w-3.5 items-center justify-center\">\n\t\t\t<DropdownMenuPrimitive.ItemIndicator>\n\t\t\t\t<CircleIcon className=\"h-2 w-2 fill-current\" />\n\t\t\t</DropdownMenuPrimitive.ItemIndicator>\n\t\t</span>\n\t\t{children}\n\t</DropdownMenuPrimitive.RadioItem>\n));\nDropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;\n\nconst DropdownMenuLabel = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Label>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Label\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"px-2 py-1.5 font-semibold text-sm\",\n\t\t\tinset && \"pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nDropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;\n\nconst DropdownMenuSeparator = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Separator>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Separator\n\t\tref={ref}\n\t\tclassName={cn(\"-mx-1 my-1 h-px bg-gray-200\", className)}\n\t\t{...props}\n\t/>\n));\nDropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;\n\nconst DropdownMenuShortcut = ({\n\tclassName,\n\t...props\n}: React.HTMLAttributes<HTMLSpanElement>) => {\n\treturn (\n\t\t<span\n\t\t\tclassName={cn(\"ml-auto text-xs tracking-widest opacity-60\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n};\nDropdownMenuShortcut.displayName = \"DropdownMenuShortcut\";\n\nexport {\n\tDropdownMenu,\n\tDropdownMenuTrigger,\n\tDropdownMenuContent,\n\tDropdownMenuItem,\n\tDropdownMenuCheckboxItem,\n\tDropdownMenuRadioItem,\n\tDropdownMenuLabel,\n\tDropdownMenuSeparator,\n\tDropdownMenuShortcut,\n\tDropdownMenuGroup,\n\tDropdownMenuPortal,\n\tDropdownMenuSub,\n\tDropdownMenuSubContent,\n\tDropdownMenuSubTrigger,\n\tDropdownMenuRadioGroup,\n};\n"]}
@@ -1,4 +1,5 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { useFormContext } from "../form-field/form-field-context";
2
3
  import { cn } from "../../utilities/cn/cn";
3
4
  import { RadioGroup as RadixRadioGroup } from "radix-ui";
4
5
  import { forwardRef, } from "react";
@@ -31,7 +32,13 @@ import { forwardRef, } from "react";
31
32
  * @param {boolean} [loop] - When true, keyboard navigation will loop from last item to first, and vice versa
32
33
  * @returns {React.ForwardRefExoticComponent} A React component that renders a radio group
33
34
  */
34
- const RadioGroup = forwardRef(({ className, ...props }, ref) => (_jsx(RadixRadioGroup.Root, { ref: ref, className: cn("flex flex-col gap-2", className), ...props })));
35
+ const RadioGroup = forwardRef(({ className, disabled: initialDisabled, required: initialRequired, ...props }, ref) => {
36
+ const { disabled, required } = useFormContext({
37
+ disabled: initialDisabled,
38
+ required: initialRequired,
39
+ });
40
+ return (_jsx(RadixRadioGroup.Root, { ref: ref, className: cn("flex flex-col gap-2", className), disabled: disabled, required: required, ...props }));
41
+ });
35
42
  const RadioGroupItem = forwardRef(({ className, ...props }, ref) => (_jsx(RadixRadioGroup.Item, { ref: ref, className: cn("flex h-4 w-4 items-center justify-center rounded-full border border-gray-700 bg-white focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-gray-700 data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50", className), ...props, children: _jsx(RadixRadioGroup.Indicator, { className: "relative h-2 w-2 rounded-full bg-gray-500" }) })));
36
43
  export { RadioGroup, RadioGroupItem };
37
44
  //# sourceMappingURL=radio-group.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"radio-group.js","sourceRoot":"/","sources":["components/radio-group/radio-group.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,UAAU,IAAI,eAAe,EAAE,MAAM,UAAU,CAAC;AACzD,OAAO,EAGN,UAAU,GACV,MAAM,OAAO,CAAC;AAEf;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,MAAM,UAAU,GAAG,UAAU,CAG3B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACnC,KAAC,eAAe,CAAC,IAAI,IACpB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE,SAAS,CAAC,KAC3C,KAAK,GACR,CACF,CAAC,CAAC;AAEH,MAAM,cAAc,GAAG,UAAU,CAG/B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACnC,KAAC,eAAe,CAAC,IAAI,IACpB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACZ,iOAAiO,EACjO,SAAS,CACT,KACG,KAAK,YAET,KAAC,eAAe,CAAC,SAAS,IAAC,SAAS,EAAC,2CAA2C,GAAG,GAC7D,CACvB,CAAC,CAAC;AAEH,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,CAAC","sourcesContent":["import { cn } from \"@utilities/cn/cn\";\nimport { RadioGroup as RadixRadioGroup } from \"radix-ui\";\nimport {\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\tforwardRef,\n} from \"react\";\n\n/**\n * A RadioGroup component that provides a set of radio buttons where only one can be selected at a time.\n *\n * @example\n * ```tsx\n * <RadioGroup defaultValue=\"option1\">\n * <div>\n * <RadioGroupItem value=\"option1\" id=\"option1\" />\n * <label htmlFor=\"option1\">Option 1</label>\n * </div>\n * <div>\n * <RadioGroupItem value=\"option2\" id=\"option2\" />\n * <label htmlFor=\"option2\">Option 2</label>\n * </div>\n * </RadioGroup>\n * ```\n *\n * @param {string} [className] - Additional CSS classes to apply to the root element\n * @param {string} [defaultValue] - The value of the radio item that should be checked when initially rendered\n * @param {string} [value] - The controlled value of the radio item to check\n * @param {function} [onValueChange] - Event handler called when the value changes\n * @param {boolean} [disabled] - When true, prevents the user from interacting with the radio group\n * @param {boolean} [required] - When true, indicates that the user must select a value before the owning form can be submitted\n * @param {string} [name] - The name of the group. Submitted with its owning form as part of a name/value pair\n * @param {string} [dir] - The reading direction of the radio group\n * @param {string} [orientation] - The orientation of the radio group\n * @param {boolean} [loop] - When true, keyboard navigation will loop from last item to first, and vice versa\n * @returns {React.ForwardRefExoticComponent} A React component that renders a radio group\n */\nconst RadioGroup = forwardRef<\n\tComponentRef<typeof RadixRadioGroup.Root>,\n\tComponentPropsWithoutRef<typeof RadixRadioGroup.Root>\n>(({ className, ...props }, ref) => (\n\t<RadixRadioGroup.Root\n\t\tref={ref}\n\t\tclassName={cn(\"flex flex-col gap-2\", className)}\n\t\t{...props}\n\t/>\n));\n\nconst RadioGroupItem = forwardRef<\n\tComponentRef<typeof RadixRadioGroup.Item>,\n\tComponentPropsWithoutRef<typeof RadixRadioGroup.Item>\n>(({ className, ...props }, ref) => (\n\t<RadixRadioGroup.Item\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"flex h-4 w-4 items-center justify-center rounded-full border border-gray-700 bg-white focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-gray-700 data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t<RadixRadioGroup.Indicator className=\"relative h-2 w-2 rounded-full bg-gray-500\" />\n\t</RadixRadioGroup.Item>\n));\n\nexport { RadioGroup, RadioGroupItem };\n"]}
1
+ {"version":3,"file":"radio-group.js","sourceRoot":"/","sources":["components/radio-group/radio-group.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,2CAA2C,CAAC;AAC3E,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,UAAU,IAAI,eAAe,EAAE,MAAM,UAAU,CAAC;AACzD,OAAO,EAGN,UAAU,GACV,MAAM,OAAO,CAAC;AAEf;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,MAAM,UAAU,GAAG,UAAU,CAI5B,CACC,EACC,SAAS,EACT,QAAQ,EAAE,eAAe,EACzB,QAAQ,EAAE,eAAe,EACzB,GAAG,KAAK,EACR,EACD,GAAG,EACF,EAAE;IACH,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,cAAc,CAAC;QAC7C,QAAQ,EAAE,eAAe;QACzB,QAAQ,EAAE,eAAe;KACzB,CAAC,CAAC;IACH,OAAO,CACN,KAAC,eAAe,CAAC,IAAI,IACpB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE,SAAS,CAAC,EAC/C,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,KACd,KAAK,GACR,CACF,CAAC;AACH,CAAC,CACD,CAAC;AAEF,MAAM,cAAc,GAAG,UAAU,CAG/B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACnC,KAAC,eAAe,CAAC,IAAI,IACpB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACZ,iOAAiO,EACjO,SAAS,CACT,KACG,KAAK,YAET,KAAC,eAAe,CAAC,SAAS,IAAC,SAAS,EAAC,2CAA2C,GAAG,GAC7D,CACvB,CAAC,CAAC;AAEH,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,CAAC","sourcesContent":["import { useFormContext } from \"@components/form-field/form-field-context\";\nimport { cn } from \"@utilities/cn/cn\";\nimport { RadioGroup as RadixRadioGroup } from \"radix-ui\";\nimport {\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\tforwardRef,\n} from \"react\";\n\n/**\n * A RadioGroup component that provides a set of radio buttons where only one can be selected at a time.\n *\n * @example\n * ```tsx\n * <RadioGroup defaultValue=\"option1\">\n * <div>\n * <RadioGroupItem value=\"option1\" id=\"option1\" />\n * <label htmlFor=\"option1\">Option 1</label>\n * </div>\n * <div>\n * <RadioGroupItem value=\"option2\" id=\"option2\" />\n * <label htmlFor=\"option2\">Option 2</label>\n * </div>\n * </RadioGroup>\n * ```\n *\n * @param {string} [className] - Additional CSS classes to apply to the root element\n * @param {string} [defaultValue] - The value of the radio item that should be checked when initially rendered\n * @param {string} [value] - The controlled value of the radio item to check\n * @param {function} [onValueChange] - Event handler called when the value changes\n * @param {boolean} [disabled] - When true, prevents the user from interacting with the radio group\n * @param {boolean} [required] - When true, indicates that the user must select a value before the owning form can be submitted\n * @param {string} [name] - The name of the group. Submitted with its owning form as part of a name/value pair\n * @param {string} [dir] - The reading direction of the radio group\n * @param {string} [orientation] - The orientation of the radio group\n * @param {boolean} [loop] - When true, keyboard navigation will loop from last item to first, and vice versa\n * @returns {React.ForwardRefExoticComponent} A React component that renders a radio group\n */\nconst RadioGroup = forwardRef<\n\tComponentRef<typeof RadixRadioGroup.Root>,\n\tComponentPropsWithoutRef<typeof RadixRadioGroup.Root>\n>(\n\t(\n\t\t{\n\t\t\tclassName,\n\t\t\tdisabled: initialDisabled,\n\t\t\trequired: initialRequired,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst { disabled, required } = useFormContext({\n\t\t\tdisabled: initialDisabled,\n\t\t\trequired: initialRequired,\n\t\t});\n\t\treturn (\n\t\t\t<RadixRadioGroup.Root\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cn(\"flex flex-col gap-2\", className)}\n\t\t\t\tdisabled={disabled}\n\t\t\t\trequired={required}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\n\nconst RadioGroupItem = forwardRef<\n\tComponentRef<typeof RadixRadioGroup.Item>,\n\tComponentPropsWithoutRef<typeof RadixRadioGroup.Item>\n>(({ className, ...props }, ref) => (\n\t<RadixRadioGroup.Item\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"flex h-4 w-4 items-center justify-center rounded-full border border-gray-700 bg-white focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-gray-700 data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t<RadixRadioGroup.Indicator className=\"relative h-2 w-2 rounded-full bg-gray-500\" />\n\t</RadixRadioGroup.Item>\n));\n\nexport { RadioGroup, RadioGroupItem };\n"]}
@@ -1,8 +1,9 @@
1
1
  import { Select as SelectPrimitive } from "radix-ui";
2
+ import { type ComponentPropsWithoutRef } from "react";
2
3
  /**
3
4
  * Select
4
5
  */
5
- declare const Select: import("react").FC<SelectPrimitive.SelectProps>;
6
+ declare const Select: ({ disabled: initialDisabled, required: initialRequired, ...props }: ComponentPropsWithoutRef<typeof SelectPrimitive.Root>) => import("react/jsx-runtime").JSX.Element;
6
7
  /**
7
8
  * SelectGroup
8
9
  */
@@ -1,5 +1,6 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { Select as SelectPrimitive } from "radix-ui";
3
+ import { useFormContext } from "../form-field/form-field-context";
3
4
  import { Icon } from "../icon/icon";
4
5
  import { CheckIcon, ChevronDownIcon, ChevronUpIcon, } from "@radix-ui/react-icons";
5
6
  import { cn } from "../../utilities/cn/cn";
@@ -7,7 +8,13 @@ import { forwardRef, } from "react";
7
8
  /**
8
9
  * Select
9
10
  */
10
- const Select = SelectPrimitive.Root;
11
+ const Select = ({ disabled: initialDisabled, required: initialRequired, ...props }) => {
12
+ const { disabled, required } = useFormContext({
13
+ disabled: initialDisabled,
14
+ required: initialRequired,
15
+ });
16
+ return (_jsx(SelectPrimitive.Root, { disabled: disabled, required: required, ...props }));
17
+ };
11
18
  /**
12
19
  * SelectGroup
13
20
  */
@@ -35,7 +42,7 @@ SelectScrollDownButton.displayName =
35
42
  /**
36
43
  * SelectContent
37
44
  */
38
- const SelectContent = forwardRef(({ className, children, position = "popper", ...props }, ref) => (_jsx(SelectPrimitive.Portal, { children: _jsxs(SelectPrimitive.Content, { ref: ref, className: cn("data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-[--radix-select-content-available-height] min-w-[8rem] origin-[--radix-select-content-transform-origin] overflow-y-auto overflow-x-hidden rounded-md border border-gray-400 bg-white text-gray-700 shadow-md data-[state=closed]:animate-out data-[state=open]:animate-in", position === "popper" &&
45
+ const SelectContent = forwardRef(({ className, children, position = "popper", ...props }, ref) => (_jsx(SelectPrimitive.Portal, { children: _jsxs(SelectPrimitive.Content, { ref: ref, className: cn("data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-[--radix-select-content-available-height] min-w-[8rem] origin-[--radix-select-content-transform-origin] overflow-y-auto overflow-x-hidden rounded-md border border-gray-400 bg-white text-gray-700 shadow-md data-[state=closed]:animate-fade-out data-[state=closed]:animate-out data-[state=open]:animate-fade-in data-[state=open]:animate-in", position === "popper" &&
39
46
  "data-[side=left]:-translate-x-1 data-[side=top]:-translate-y-1 data-[side=right]:translate-x-1 data-[side=bottom]:translate-y-1", className), position: position, ...props, children: [_jsx(SelectScrollUpButton, {}), _jsx(SelectPrimitive.Viewport, { className: cn("p-1", position === "popper" &&
40
47
  "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"), children: children }), _jsx(SelectScrollDownButton, {})] }) })));
41
48
  SelectContent.displayName = SelectPrimitive.Content.displayName;
@@ -1 +1 @@
1
- {"version":3,"file":"select.js","sourceRoot":"/","sources":["components/select/select.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Select as SelectPrimitive } from \"radix-ui\";\n\nimport { Icon } from \"@components/icon/icon\";\nimport {\n\tCheckIcon,\n\tChevronDownIcon,\n\tChevronUpIcon,\n} from \"@radix-ui/react-icons\";\nimport { cn } from \"@utilities/cn/cn\";\nimport {\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\tforwardRef,\n} from \"react\";\n\n/**\n * Select\n */\n\nconst Select = SelectPrimitive.Root;\n\n/**\n * SelectGroup\n */\n\nconst SelectGroup = SelectPrimitive.Group;\n\n/**\n * SelectValue\n */\n\nconst SelectValue = SelectPrimitive.Value;\n\n/**\n * SelectTrigger\n */\n\nconst SelectTrigger = forwardRef<\n\tComponentRef<typeof SelectPrimitive.Trigger>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.Trigger>\n>(({ className, children, ...props }, ref) => (\n\t<SelectPrimitive.Trigger\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"flex h-9 w-full items-center justify-between whitespace-nowrap rounded-md border border-gray-400 bg-transparent px-3 py-2 text-sm shadow-sm ring-offset-background focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 data-[placeholder]:text-gray-500 [&>span]:line-clamp-1\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t{children}\n\t\t<SelectPrimitive.Icon asChild>\n\t\t\t<Icon asChild size=\"small\" className=\"opacity-50\">\n\t\t\t\t<ChevronDownIcon />\n\t\t\t</Icon>\n\t\t</SelectPrimitive.Icon>\n\t</SelectPrimitive.Trigger>\n));\nSelectTrigger.displayName = SelectPrimitive.Trigger.displayName;\n\n/**\n * SelectScrollUpButton\n */\n\nconst SelectScrollUpButton = forwardRef<\n\tComponentRef<typeof SelectPrimitive.ScrollUpButton>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.ScrollUpButton>\n>(({ className, ...props }, ref) => (\n\t<SelectPrimitive.ScrollUpButton\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"flex cursor-default items-center justify-center py-1\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t<Icon asChild size=\"small\" className=\"opacity-50\">\n\t\t\t<ChevronUpIcon />\n\t\t</Icon>\n\t</SelectPrimitive.ScrollUpButton>\n));\nSelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;\n\n/**\n * SelectScrollDownButton\n */\n\nconst SelectScrollDownButton = forwardRef<\n\tComponentRef<typeof SelectPrimitive.ScrollDownButton>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.ScrollDownButton>\n>(({ className, ...props }, ref) => (\n\t<SelectPrimitive.ScrollDownButton\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"flex cursor-default items-center justify-center py-1\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t<Icon asChild size=\"small\" className=\"opacity-50\">\n\t\t\t<ChevronDownIcon />\n\t\t</Icon>\n\t</SelectPrimitive.ScrollDownButton>\n));\nSelectScrollDownButton.displayName =\n\tSelectPrimitive.ScrollDownButton.displayName;\n\n/**\n * SelectContent\n */\n\nconst SelectContent = forwardRef<\n\tComponentRef<typeof SelectPrimitive.Content>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.Content>\n>(({ className, children, position = \"popper\", ...props }, ref) => (\n\t<SelectPrimitive.Portal>\n\t\t<SelectPrimitive.Content\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-[--radix-select-content-available-height] min-w-[8rem] origin-[--radix-select-content-transform-origin] overflow-y-auto overflow-x-hidden rounded-md border border-gray-400 bg-white text-gray-700 shadow-md data-[state=closed]:animate-out data-[state=open]:animate-in\",\n\t\t\t\tposition === \"popper\" &&\n\t\t\t\t\t\"data-[side=left]:-translate-x-1 data-[side=top]:-translate-y-1 data-[side=right]:translate-x-1 data-[side=bottom]:translate-y-1\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tposition={position}\n\t\t\t{...props}\n\t\t>\n\t\t\t<SelectScrollUpButton />\n\t\t\t<SelectPrimitive.Viewport\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"p-1\",\n\t\t\t\t\tposition === \"popper\" &&\n\t\t\t\t\t\t\"h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]\",\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</SelectPrimitive.Viewport>\n\t\t\t<SelectScrollDownButton />\n\t\t</SelectPrimitive.Content>\n\t</SelectPrimitive.Portal>\n));\nSelectContent.displayName = SelectPrimitive.Content.displayName;\n\n/**\n * SelectLabel\n */\n\nconst SelectLabel = forwardRef<\n\tComponentRef<typeof SelectPrimitive.Label>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.Label>\n>(({ className, ...props }, ref) => (\n\t<SelectPrimitive.Label\n\t\tref={ref}\n\t\tclassName={cn(\"px-2 py-1.5 font-semibold text-sm\", className)}\n\t\t{...props}\n\t/>\n));\nSelectLabel.displayName = SelectPrimitive.Label.displayName;\n\n/**\n * SelectItem\n */\n\nconst SelectItem = forwardRef<\n\tComponentRef<typeof SelectPrimitive.Item>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.Item>\n>(({ className, children, ...props }, ref) => (\n\t<SelectPrimitive.Item\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pr-8 pl-2 text-sm outline-none focus-visible:bg-gray-700 focus-visible:text-white data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t<span className=\"absolute right-2 flex h-3.5 w-3.5 items-center justify-center\">\n\t\t\t<SelectPrimitive.ItemIndicator>\n\t\t\t\t<Icon asChild size=\"small\">\n\t\t\t\t\t<CheckIcon />\n\t\t\t\t</Icon>\n\t\t\t</SelectPrimitive.ItemIndicator>\n\t\t</span>\n\t\t<SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n\t</SelectPrimitive.Item>\n));\nSelectItem.displayName = SelectPrimitive.Item.displayName;\n\n/**\n * SelectSeparator\n */\n\nconst SelectSeparator = forwardRef<\n\tComponentRef<typeof SelectPrimitive.Separator>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n\t<SelectPrimitive.Separator\n\t\tref={ref}\n\t\tclassName={cn(\"my-2 h-px bg-gray-200\", className)}\n\t\t{...props}\n\t/>\n));\nSelectSeparator.displayName = SelectPrimitive.Separator.displayName;\n\nexport {\n\tSelect,\n\tSelectGroup,\n\tSelectValue,\n\tSelectTrigger,\n\tSelectContent,\n\tSelectLabel,\n\tSelectItem,\n\tSelectSeparator,\n\tSelectScrollUpButton,\n\tSelectScrollDownButton,\n};\n"]}
1
+ {"version":3,"file":"select.js","sourceRoot":"/","sources":["components/select/select.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Select as SelectPrimitive } from \"radix-ui\";\n\nimport { useFormContext } from \"@components/form-field/form-field-context\";\nimport { Icon } from \"@components/icon/icon\";\nimport {\n\tCheckIcon,\n\tChevronDownIcon,\n\tChevronUpIcon,\n} from \"@radix-ui/react-icons\";\nimport { cn } from \"@utilities/cn/cn\";\nimport {\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\tforwardRef,\n} from \"react\";\n\n/**\n * Select\n */\n\nconst Select = ({\n\tdisabled: initialDisabled,\n\trequired: initialRequired,\n\t...props\n}: ComponentPropsWithoutRef<typeof SelectPrimitive.Root>) => {\n\tconst { disabled, required } = useFormContext({\n\t\tdisabled: initialDisabled,\n\t\trequired: initialRequired,\n\t});\n\treturn (\n\t\t<SelectPrimitive.Root disabled={disabled} required={required} {...props} />\n\t);\n};\n\n/**\n * SelectGroup\n */\n\nconst SelectGroup = SelectPrimitive.Group;\n\n/**\n * SelectValue\n */\n\nconst SelectValue = SelectPrimitive.Value;\n\n/**\n * SelectTrigger\n */\n\nconst SelectTrigger = forwardRef<\n\tComponentRef<typeof SelectPrimitive.Trigger>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.Trigger>\n>(({ className, children, ...props }, ref) => (\n\t<SelectPrimitive.Trigger\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"flex h-9 w-full items-center justify-between whitespace-nowrap rounded-md border border-gray-400 bg-transparent px-3 py-2 text-sm shadow-sm ring-offset-background focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 data-[placeholder]:text-gray-500 [&>span]:line-clamp-1\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t{children}\n\t\t<SelectPrimitive.Icon asChild>\n\t\t\t<Icon asChild size=\"small\" className=\"opacity-50\">\n\t\t\t\t<ChevronDownIcon />\n\t\t\t</Icon>\n\t\t</SelectPrimitive.Icon>\n\t</SelectPrimitive.Trigger>\n));\nSelectTrigger.displayName = SelectPrimitive.Trigger.displayName;\n\n/**\n * SelectScrollUpButton\n */\n\nconst SelectScrollUpButton = forwardRef<\n\tComponentRef<typeof SelectPrimitive.ScrollUpButton>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.ScrollUpButton>\n>(({ className, ...props }, ref) => (\n\t<SelectPrimitive.ScrollUpButton\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"flex cursor-default items-center justify-center py-1\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t<Icon asChild size=\"small\" className=\"opacity-50\">\n\t\t\t<ChevronUpIcon />\n\t\t</Icon>\n\t</SelectPrimitive.ScrollUpButton>\n));\nSelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;\n\n/**\n * SelectScrollDownButton\n */\n\nconst SelectScrollDownButton = forwardRef<\n\tComponentRef<typeof SelectPrimitive.ScrollDownButton>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.ScrollDownButton>\n>(({ className, ...props }, ref) => (\n\t<SelectPrimitive.ScrollDownButton\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"flex cursor-default items-center justify-center py-1\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t<Icon asChild size=\"small\" className=\"opacity-50\">\n\t\t\t<ChevronDownIcon />\n\t\t</Icon>\n\t</SelectPrimitive.ScrollDownButton>\n));\nSelectScrollDownButton.displayName =\n\tSelectPrimitive.ScrollDownButton.displayName;\n\n/**\n * SelectContent\n */\n\nconst SelectContent = forwardRef<\n\tComponentRef<typeof SelectPrimitive.Content>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.Content>\n>(({ className, children, position = \"popper\", ...props }, ref) => (\n\t<SelectPrimitive.Portal>\n\t\t<SelectPrimitive.Content\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t\"data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-[--radix-select-content-available-height] min-w-[8rem] origin-[--radix-select-content-transform-origin] overflow-y-auto overflow-x-hidden rounded-md border border-gray-400 bg-white text-gray-700 shadow-md data-[state=closed]:animate-fade-out data-[state=closed]:animate-out data-[state=open]:animate-fade-in data-[state=open]:animate-in\",\n\t\t\t\tposition === \"popper\" &&\n\t\t\t\t\t\"data-[side=left]:-translate-x-1 data-[side=top]:-translate-y-1 data-[side=right]:translate-x-1 data-[side=bottom]:translate-y-1\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tposition={position}\n\t\t\t{...props}\n\t\t>\n\t\t\t<SelectScrollUpButton />\n\t\t\t<SelectPrimitive.Viewport\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"p-1\",\n\t\t\t\t\tposition === \"popper\" &&\n\t\t\t\t\t\t\"h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]\",\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</SelectPrimitive.Viewport>\n\t\t\t<SelectScrollDownButton />\n\t\t</SelectPrimitive.Content>\n\t</SelectPrimitive.Portal>\n));\nSelectContent.displayName = SelectPrimitive.Content.displayName;\n\n/**\n * SelectLabel\n */\n\nconst SelectLabel = forwardRef<\n\tComponentRef<typeof SelectPrimitive.Label>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.Label>\n>(({ className, ...props }, ref) => (\n\t<SelectPrimitive.Label\n\t\tref={ref}\n\t\tclassName={cn(\"px-2 py-1.5 font-semibold text-sm\", className)}\n\t\t{...props}\n\t/>\n));\nSelectLabel.displayName = SelectPrimitive.Label.displayName;\n\n/**\n * SelectItem\n */\n\nconst SelectItem = forwardRef<\n\tComponentRef<typeof SelectPrimitive.Item>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.Item>\n>(({ className, children, ...props }, ref) => (\n\t<SelectPrimitive.Item\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pr-8 pl-2 text-sm outline-none focus-visible:bg-gray-700 focus-visible:text-white data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t>\n\t\t<span className=\"absolute right-2 flex h-3.5 w-3.5 items-center justify-center\">\n\t\t\t<SelectPrimitive.ItemIndicator>\n\t\t\t\t<Icon asChild size=\"small\">\n\t\t\t\t\t<CheckIcon />\n\t\t\t\t</Icon>\n\t\t\t</SelectPrimitive.ItemIndicator>\n\t\t</span>\n\t\t<SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n\t</SelectPrimitive.Item>\n));\nSelectItem.displayName = SelectPrimitive.Item.displayName;\n\n/**\n * SelectSeparator\n */\n\nconst SelectSeparator = forwardRef<\n\tComponentRef<typeof SelectPrimitive.Separator>,\n\tComponentPropsWithoutRef<typeof SelectPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n\t<SelectPrimitive.Separator\n\t\tref={ref}\n\t\tclassName={cn(\"my-2 h-px bg-gray-200\", className)}\n\t\t{...props}\n\t/>\n));\nSelectSeparator.displayName = SelectPrimitive.Separator.displayName;\n\nexport {\n\tSelect,\n\tSelectGroup,\n\tSelectValue,\n\tSelectTrigger,\n\tSelectContent,\n\tSelectLabel,\n\tSelectItem,\n\tSelectSeparator,\n\tSelectScrollUpButton,\n\tSelectScrollDownButton,\n};\n"]}
@@ -1,6 +1,7 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
2
  import { Slider as RadixSlider } from "radix-ui";
3
3
  import { forwardRef, useState, } from "react";
4
+ import { useFormContext } from "../form-field/form-field-context";
4
5
  import { Tooltip, TooltipContent, TooltipTrigger, } from "../tooltip/tooltip";
5
6
  import { cn } from "../../utilities/cn/cn";
6
7
  /**
@@ -25,9 +26,12 @@ import { cn } from "../../utilities/cn/cn";
25
26
  * @param {React.Ref<ComponentRef<typeof RadixSlider.Root>>} ref - Forwarded ref for the slider root element
26
27
  * @returns {JSX.Element} A slider component with optional tooltips and min/max display
27
28
  */
28
- const Slider = forwardRef(({ className, defaultValue, min, max, showMinMax = true, ...props }, ref) => {
29
+ const Slider = forwardRef(({ className, defaultValue, min, max, showMinMax = true, disabled: initialDisabled, ...props }, ref) => {
29
30
  const [value, setValue] = useState(defaultValue ?? []);
30
- return (_jsxs(_Fragment, { children: [_jsxs(RadixSlider.Root, { ref: ref, value: value, onValueChange: setValue, className: cn("relative flex w-full touch-none select-none items-center", className), ...props, children: [_jsx(RadixSlider.Track, { className: "relative h-1.5 w-full grow overflow-hidden rounded-full bg-gray-700/20 data-[disabled]:opacity-50", children: _jsx(RadixSlider.Range, { className: "absolute h-full bg-gray-700" }) }), value.map((thumbValue, index) => (
31
+ const { disabled } = useFormContext({
32
+ disabled: initialDisabled,
33
+ });
34
+ return (_jsxs(_Fragment, { children: [_jsxs(RadixSlider.Root, { ref: ref, value: value, onValueChange: setValue, className: cn("relative flex w-full touch-none select-none items-center", className), disabled: disabled, ...props, children: [_jsx(RadixSlider.Track, { className: "relative h-1.5 w-full grow overflow-hidden rounded-full bg-gray-700/20 data-[disabled]:opacity-50", children: _jsx(RadixSlider.Range, { className: "absolute h-full bg-gray-700" }) }), value.map((thumbValue, index) => (
31
35
  // biome-ignore lint/suspicious/noArrayIndexKey: <only index is available>
32
36
  _jsxs(Tooltip, { delayDuration: 0, children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx(RadixSlider.Thumb, { className: "block h-4 w-4 rounded-full border border-gray-700 bg-white shadow transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-gray-700 data-[disabled]:pointer-events-none" }) }), _jsx(TooltipContent, { children: _jsx("p", { children: thumbValue }) })] }, index)))] }), showMinMax && (_jsxs("div", { className: "mt-2 flex w-full flex-row justify-between", children: [_jsx("p", { children: min }), _jsx("p", { children: max })] }))] }));
33
37
  });
@@ -1 +1 @@
1
- {"version":3,"file":"slider.js","sourceRoot":"/","sources":["components/slider/slider.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,UAAU,CAAC;AACjD,OAAO,EAGN,UAAU,EACV,QAAQ,GACR,MAAM,OAAO,CAAC;AAEf,OAAO,EACN,OAAO,EACP,cAAc,EACd,cAAc,GACd,MAAM,6BAA6B,CAAC;AACrC,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AAUtC;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,MAAM,GAAG,UAAU,CACxB,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,GAAG,EAAE,GAAG,EAAE,UAAU,GAAG,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAC3E,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAW,YAAY,IAAI,EAAE,CAAC,CAAC;IAEjE,OAAO,CACN,8BACC,MAAC,WAAW,CAAC,IAAI,IAChB,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,aAAa,EAAE,QAAQ,EACvB,SAAS,EAAE,EAAE,CACZ,0DAA0D,EAC1D,SAAS,CACT,KACG,KAAK,aAET,KAAC,WAAW,CAAC,KAAK,IAAC,SAAS,EAAC,mGAAmG,YAC/H,KAAC,WAAW,CAAC,KAAK,IAAC,SAAS,EAAC,6BAA6B,GAAG,GAC1C,EACnB,KAAK,CAAC,GAAG,CAAC,CAAC,UAAU,EAAE,KAAK,EAAE,EAAE,CAAC;oBACjC,0EAA0E;oBAC1E,MAAC,OAAO,IAAa,aAAa,EAAE,CAAC,aACpC,KAAC,cAAc,IAAC,OAAO,kBACtB,KAAC,WAAW,CAAC,KAAK,IAAC,SAAS,EAAC,qMAAqM,GAAG,GACrN,EACjB,KAAC,cAAc,cACd,sBAAI,UAAU,GAAK,GACH,KANJ,KAAK,CAOT,CACV,CAAC,IACgB,EAClB,UAAU,IAAI,CACd,eAAK,SAAS,EAAC,2CAA2C,aACzD,sBAAI,GAAG,GAAK,EACZ,sBAAI,GAAG,GAAK,IACP,CACN,IACC,CACH,CAAC;AACH,CAAC,CACD,CAAC;AACF,MAAM,CAAC,WAAW,GAAG,WAAW,CAAC,IAAI,CAAC,WAAW,CAAC;AAElD,OAAO,EAAE,MAAM,EAAE,CAAC","sourcesContent":["import { Slider as RadixSlider } from \"radix-ui\";\nimport {\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\tforwardRef,\n\tuseState,\n} from \"react\";\n\nimport {\n\tTooltip,\n\tTooltipContent,\n\tTooltipTrigger,\n} from \"@components/tooltip/tooltip\";\nimport { cn } from \"@utilities/cn/cn\";\n\nexport type SliderProps = ComponentPropsWithoutRef<typeof RadixSlider.Root> & {\n\t/**\n\t * Whether to show the minimum and maximum values below the slider\n\t * @default true\n\t */\n\tshowMinMax?: boolean;\n};\n\n/**\n * A customizable slider component built on top of Radix UI's slider primitive.\n *\n * @example\n * ```tsx\n * <Slider\n * min={0}\n * max={100}\n * defaultValue={[50]}\n * showMinMax={true}\n * />\n * ```\n *\n * @param {Object} props - The props for the Slider component\n * @param {number[]} [props.defaultValue] - The initial value of the slider\n * @param {number} [props.min=0] - The minimum value of the slider\n * @param {number} [props.max=100] - The maximum value of the slider\n * @param {boolean} [props.showMinMax=true] - Whether to show min/max values below the slider\n * @param {string} [props.className] - Additional CSS classes to apply to the slider\n * @param {React.Ref<ComponentRef<typeof RadixSlider.Root>>} ref - Forwarded ref for the slider root element\n * @returns {JSX.Element} A slider component with optional tooltips and min/max display\n */\nconst Slider = forwardRef<ComponentRef<typeof RadixSlider.Root>, SliderProps>(\n\t({ className, defaultValue, min, max, showMinMax = true, ...props }, ref) => {\n\t\tconst [value, setValue] = useState<number[]>(defaultValue ?? []);\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<RadixSlider.Root\n\t\t\t\t\tref={ref}\n\t\t\t\t\tvalue={value}\n\t\t\t\t\tonValueChange={setValue}\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"relative flex w-full touch-none select-none items-center\",\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t)}\n\t\t\t\t\t{...props}\n\t\t\t\t>\n\t\t\t\t\t<RadixSlider.Track className=\"relative h-1.5 w-full grow overflow-hidden rounded-full bg-gray-700/20 data-[disabled]:opacity-50\">\n\t\t\t\t\t\t<RadixSlider.Range className=\"absolute h-full bg-gray-700\" />\n\t\t\t\t\t</RadixSlider.Track>\n\t\t\t\t\t{value.map((thumbValue, index) => (\n\t\t\t\t\t\t// biome-ignore lint/suspicious/noArrayIndexKey: <only index is available>\n\t\t\t\t\t\t<Tooltip key={index} delayDuration={0}>\n\t\t\t\t\t\t\t<TooltipTrigger asChild>\n\t\t\t\t\t\t\t\t<RadixSlider.Thumb className=\"block h-4 w-4 rounded-full border border-gray-700 bg-white shadow transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-gray-700 data-[disabled]:pointer-events-none\" />\n\t\t\t\t\t\t\t</TooltipTrigger>\n\t\t\t\t\t\t\t<TooltipContent>\n\t\t\t\t\t\t\t\t<p>{thumbValue}</p>\n\t\t\t\t\t\t\t</TooltipContent>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t))}\n\t\t\t\t</RadixSlider.Root>\n\t\t\t\t{showMinMax && (\n\t\t\t\t\t<div className=\"mt-2 flex w-full flex-row justify-between\">\n\t\t\t\t\t\t<p>{min}</p>\n\t\t\t\t\t\t<p>{max}</p>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</>\n\t\t);\n\t},\n);\nSlider.displayName = RadixSlider.Root.displayName;\n\nexport { Slider };\n"]}
1
+ {"version":3,"file":"slider.js","sourceRoot":"/","sources":["components/slider/slider.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,UAAU,CAAC;AACjD,OAAO,EAGN,UAAU,EACV,QAAQ,GACR,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,cAAc,EAAE,MAAM,2CAA2C,CAAC;AAC3E,OAAO,EACN,OAAO,EACP,cAAc,EACd,cAAc,GACd,MAAM,6BAA6B,CAAC;AACrC,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AAUtC;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,MAAM,GAAG,UAAU,CACxB,CACC,EACC,SAAS,EACT,YAAY,EACZ,GAAG,EACH,GAAG,EACH,UAAU,GAAG,IAAI,EACjB,QAAQ,EAAE,eAAe,EACzB,GAAG,KAAK,EACR,EACD,GAAG,EACF,EAAE;IACH,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAW,YAAY,IAAI,EAAE,CAAC,CAAC;IACjE,MAAM,EAAE,QAAQ,EAAE,GAAG,cAAc,CAAC;QACnC,QAAQ,EAAE,eAAe;KACzB,CAAC,CAAC;IAEH,OAAO,CACN,8BACC,MAAC,WAAW,CAAC,IAAI,IAChB,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,aAAa,EAAE,QAAQ,EACvB,SAAS,EAAE,EAAE,CACZ,0DAA0D,EAC1D,SAAS,CACT,EACD,QAAQ,EAAE,QAAQ,KACd,KAAK,aAET,KAAC,WAAW,CAAC,KAAK,IAAC,SAAS,EAAC,mGAAmG,YAC/H,KAAC,WAAW,CAAC,KAAK,IAAC,SAAS,EAAC,6BAA6B,GAAG,GAC1C,EACnB,KAAK,CAAC,GAAG,CAAC,CAAC,UAAU,EAAE,KAAK,EAAE,EAAE,CAAC;oBACjC,0EAA0E;oBAC1E,MAAC,OAAO,IAAa,aAAa,EAAE,CAAC,aACpC,KAAC,cAAc,IAAC,OAAO,kBACtB,KAAC,WAAW,CAAC,KAAK,IAAC,SAAS,EAAC,qMAAqM,GAAG,GACrN,EACjB,KAAC,cAAc,cACd,sBAAI,UAAU,GAAK,GACH,KANJ,KAAK,CAOT,CACV,CAAC,IACgB,EAClB,UAAU,IAAI,CACd,eAAK,SAAS,EAAC,2CAA2C,aACzD,sBAAI,GAAG,GAAK,EACZ,sBAAI,GAAG,GAAK,IACP,CACN,IACC,CACH,CAAC;AACH,CAAC,CACD,CAAC;AACF,MAAM,CAAC,WAAW,GAAG,WAAW,CAAC,IAAI,CAAC,WAAW,CAAC;AAElD,OAAO,EAAE,MAAM,EAAE,CAAC","sourcesContent":["import { Slider as RadixSlider } from \"radix-ui\";\nimport {\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\tforwardRef,\n\tuseState,\n} from \"react\";\n\nimport { useFormContext } from \"@components/form-field/form-field-context\";\nimport {\n\tTooltip,\n\tTooltipContent,\n\tTooltipTrigger,\n} from \"@components/tooltip/tooltip\";\nimport { cn } from \"@utilities/cn/cn\";\n\nexport type SliderProps = ComponentPropsWithoutRef<typeof RadixSlider.Root> & {\n\t/**\n\t * Whether to show the minimum and maximum values below the slider\n\t * @default true\n\t */\n\tshowMinMax?: boolean;\n};\n\n/**\n * A customizable slider component built on top of Radix UI's slider primitive.\n *\n * @example\n * ```tsx\n * <Slider\n * min={0}\n * max={100}\n * defaultValue={[50]}\n * showMinMax={true}\n * />\n * ```\n *\n * @param {Object} props - The props for the Slider component\n * @param {number[]} [props.defaultValue] - The initial value of the slider\n * @param {number} [props.min=0] - The minimum value of the slider\n * @param {number} [props.max=100] - The maximum value of the slider\n * @param {boolean} [props.showMinMax=true] - Whether to show min/max values below the slider\n * @param {string} [props.className] - Additional CSS classes to apply to the slider\n * @param {React.Ref<ComponentRef<typeof RadixSlider.Root>>} ref - Forwarded ref for the slider root element\n * @returns {JSX.Element} A slider component with optional tooltips and min/max display\n */\nconst Slider = forwardRef<ComponentRef<typeof RadixSlider.Root>, SliderProps>(\n\t(\n\t\t{\n\t\t\tclassName,\n\t\t\tdefaultValue,\n\t\t\tmin,\n\t\t\tmax,\n\t\t\tshowMinMax = true,\n\t\t\tdisabled: initialDisabled,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst [value, setValue] = useState<number[]>(defaultValue ?? []);\n\t\tconst { disabled } = useFormContext({\n\t\t\tdisabled: initialDisabled,\n\t\t});\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<RadixSlider.Root\n\t\t\t\t\tref={ref}\n\t\t\t\t\tvalue={value}\n\t\t\t\t\tonValueChange={setValue}\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"relative flex w-full touch-none select-none items-center\",\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t)}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t{...props}\n\t\t\t\t>\n\t\t\t\t\t<RadixSlider.Track className=\"relative h-1.5 w-full grow overflow-hidden rounded-full bg-gray-700/20 data-[disabled]:opacity-50\">\n\t\t\t\t\t\t<RadixSlider.Range className=\"absolute h-full bg-gray-700\" />\n\t\t\t\t\t</RadixSlider.Track>\n\t\t\t\t\t{value.map((thumbValue, index) => (\n\t\t\t\t\t\t// biome-ignore lint/suspicious/noArrayIndexKey: <only index is available>\n\t\t\t\t\t\t<Tooltip key={index} delayDuration={0}>\n\t\t\t\t\t\t\t<TooltipTrigger asChild>\n\t\t\t\t\t\t\t\t<RadixSlider.Thumb className=\"block h-4 w-4 rounded-full border border-gray-700 bg-white shadow transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-gray-700 data-[disabled]:pointer-events-none\" />\n\t\t\t\t\t\t\t</TooltipTrigger>\n\t\t\t\t\t\t\t<TooltipContent>\n\t\t\t\t\t\t\t\t<p>{thumbValue}</p>\n\t\t\t\t\t\t\t</TooltipContent>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t))}\n\t\t\t\t</RadixSlider.Root>\n\t\t\t\t{showMinMax && (\n\t\t\t\t\t<div className=\"mt-2 flex w-full flex-row justify-between\">\n\t\t\t\t\t\t<p>{min}</p>\n\t\t\t\t\t\t<p>{max}</p>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</>\n\t\t);\n\t},\n);\nSlider.displayName = RadixSlider.Root.displayName;\n\nexport { Slider };\n"]}
package/dist/index.d.ts CHANGED
@@ -1,5 +1,8 @@
1
1
  export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, } from "./components/accordion/accordion";
2
2
  export type { AccordionContentProps, AccordionItemProps, AccordionProps, AccordionTriggerProps, } from "./components/accordion/accordion";
3
+ export { Alert, AlertDescription, AlertTitle } from "./components/alert/alert";
4
+ export type { AlertDescriptionProps, AlertProps, AlertTitleProps, } from "./components/alert/alert";
5
+ export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogOverlay, AlertDialogTitle, AlertDialogTrigger, } from "./components/alert-dialog/alert-dialog";
3
6
  export { Avatar, AvatarFallback, AvatarImage } from "./components/avatar/avatar";
4
7
  export { AvatarGroup } from "./components/avatar/avatar-group";
5
8
  export type { AvatarGroupProps } from "./components/avatar/avatar-group";
@@ -12,7 +15,8 @@ export type { CardContentProps, CardFooterProps, CardHeaderProps, CardProps, } f
12
15
  export { Checkbox } from "./components/checkbox/checkbox";
13
16
  export type { CheckboxProps } from "./components/checkbox/checkbox";
14
17
  export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, } from "./components/dialog/dialog";
15
- export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuCheckboxItem, DropdownMenuRadioItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuGroup, DropdownMenuPortal, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuRadioGroup, } from "./components/dropdown-menu/dropdown-menu";
18
+ export { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerTitle, DrawerTrigger, } from "./components/drawer/drawer";
19
+ export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuRadioItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuGroup, DropdownMenuPortal, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuRadioGroup, } from "./components/dropdown-menu/dropdown-menu";
16
20
  export { getVariants } from "./utilities/get-variants/get-variants";
17
21
  export type { ResponsiveValue } from "./utilities/responsive/responsive";
18
22
  export { Label } from "./components/label/label";
package/dist/index.js CHANGED
@@ -1,4 +1,6 @@
1
1
  export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, } from "./components/accordion/accordion";
2
+ export { Alert, AlertDescription, AlertTitle } from "./components/alert/alert";
3
+ export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogOverlay, AlertDialogTitle, AlertDialogTrigger, } from "./components/alert-dialog/alert-dialog";
2
4
  export { Avatar, AvatarFallback, AvatarImage } from "./components/avatar/avatar";
3
5
  export { AvatarGroup } from "./components/avatar/avatar-group";
4
6
  export { Badge } from "./components/badge/badge";
@@ -6,7 +8,8 @@ export { Button } from "./components/button/button";
6
8
  export { Card, CardContent, CardFooter, CardHeader, } from "./components/card/card";
7
9
  export { Checkbox } from "./components/checkbox/checkbox";
8
10
  export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, } from "./components/dialog/dialog";
9
- export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuCheckboxItem, DropdownMenuRadioItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuGroup, DropdownMenuPortal, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuRadioGroup, } from "./components/dropdown-menu/dropdown-menu";
11
+ export { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerTitle, DrawerTrigger, } from "./components/drawer/drawer";
12
+ export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuRadioItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuGroup, DropdownMenuPortal, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuRadioGroup, } from "./components/dropdown-menu/dropdown-menu";
10
13
  export { getVariants } from "./utilities/get-variants/get-variants";
11
14
  export { Label } from "./components/label/label";
12
15
  export { Input } from "./components/input/input";
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"/","sources":["index.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,SAAS,EACT,gBAAgB,EAChB,aAAa,EACb,gBAAgB,GAChB,MAAM,iCAAiC,CAAC;AAOzC,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAChF,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAE9D,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAEhD,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AAEnD,OAAO,EACN,IAAI,EACJ,WAAW,EACX,UAAU,EACV,UAAU,GACV,MAAM,uBAAuB,CAAC;AAO/B,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AAEzD,OAAO,EACN,MAAM,EACN,WAAW,EACX,aAAa,EACb,iBAAiB,EACjB,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,aAAa,GACb,MAAM,2BAA2B,CAAC;AACnC,OAAO,EACN,YAAY,EACZ,mBAAmB,EACnB,mBAAmB,EACnB,gBAAgB,EAChB,wBAAwB,EACxB,qBAAqB,EACrB,iBAAiB,EACjB,qBAAqB,EACrB,oBAAoB,EACpB,iBAAiB,EACjB,kBAAkB,EAClB,eAAe,EACf,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,GACtB,MAAM,yCAAyC,CAAC;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,sCAAsC,CAAC;AAEnE,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAEhD,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAEhD,OAAO,EACN,UAAU,EACV,cAAc,EACd,cAAc,EACd,cAAc,GACd,MAAM,mCAAmC,CAAC;AAK3C,OAAO,EACN,OAAO,EACP,aAAa,EACb,YAAY,EACZ,cAAc,EACd,aAAa,EACb,cAAc,GACd,MAAM,6BAA6B,CAAC;AAKrC,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AAEzD,OAAO,EACN,UAAU,EACV,cAAc,GACd,MAAM,qCAAqC,CAAC;AAC7C,OAAO,EACN,MAAM,EACN,aAAa,EACb,WAAW,EACX,UAAU,EACV,WAAW,EACX,sBAAsB,EACtB,oBAAoB,EACpB,eAAe,EACf,aAAa,EACb,WAAW,GACX,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AAEnD,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AAEnD,OAAO,EACN,IAAI,EACJ,WAAW,EACX,QAAQ,EACR,WAAW,GACX,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EACN,KAAK,EACL,SAAS,EACT,SAAS,EACT,SAAS,EACT,WAAW,EACX,QAAQ,EACR,WAAW,EACX,YAAY,GACZ,MAAM,yBAAyB,CAAC;AACjC,OAAO,EACN,KAAK,EACL,OAAO,EACP,KAAK,GACL,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EACN,OAAO,EACP,cAAc,EACd,cAAc,GACd,MAAM,6BAA6B,CAAC","sourcesContent":["export {\n\tAccordion,\n\tAccordionContent,\n\tAccordionItem,\n\tAccordionTrigger,\n} from \"@components/accordion/accordion\";\nexport type {\n\tAccordionContentProps,\n\tAccordionItemProps,\n\tAccordionProps,\n\tAccordionTriggerProps,\n} from \"@components/accordion/accordion\";\nexport { Avatar, AvatarFallback, AvatarImage } from \"@components/avatar/avatar\";\nexport { AvatarGroup } from \"@components/avatar/avatar-group\";\nexport type { AvatarGroupProps } from \"@components/avatar/avatar-group\";\nexport { Badge } from \"@components/badge/badge\";\nexport type { BadgeProps } from \"@components/badge/badge\";\nexport { Button } from \"@components/button/button\";\nexport type { ButtonProps } from \"@components/button/button\";\nexport {\n\tCard,\n\tCardContent,\n\tCardFooter,\n\tCardHeader,\n} from \"@components/card/card\";\nexport type {\n\tCardContentProps,\n\tCardFooterProps,\n\tCardHeaderProps,\n\tCardProps,\n} from \"@components/card/card\";\nexport { Checkbox } from \"@components/checkbox/checkbox\";\nexport type { CheckboxProps } from \"@components/checkbox/checkbox\";\nexport {\n\tDialog,\n\tDialogClose,\n\tDialogContent,\n\tDialogDescription,\n\tDialogFooter,\n\tDialogHeader,\n\tDialogTitle,\n\tDialogTrigger,\n} from \"@components/dialog/dialog\";\nexport {\n\tDropdownMenu,\n\tDropdownMenuTrigger,\n\tDropdownMenuContent,\n\tDropdownMenuItem,\n\tDropdownMenuCheckboxItem,\n\tDropdownMenuRadioItem,\n\tDropdownMenuLabel,\n\tDropdownMenuSeparator,\n\tDropdownMenuShortcut,\n\tDropdownMenuGroup,\n\tDropdownMenuPortal,\n\tDropdownMenuSub,\n\tDropdownMenuSubContent,\n\tDropdownMenuSubTrigger,\n\tDropdownMenuRadioGroup,\n} from \"@components/dropdown-menu/dropdown-menu\";\nexport { getVariants } from \"@utilities/get-variants/get-variants\";\nexport type { ResponsiveValue } from \"@utilities/responsive/responsive\";\nexport { Label } from \"@components/label/label\";\nexport type { LabelProps } from \"@components/label/label\";\nexport { Input } from \"@components/input/input\";\nexport type { InputProps } from \"@components/input/input\";\nexport {\n\tPagination,\n\tPaginationItem,\n\tPaginationNext,\n\tPaginationPrev,\n} from \"@components/pagination/pagination\";\nexport type {\n\tPaginationItemProps,\n\tPaginationProps,\n} from \"@components/pagination/pagination\";\nexport {\n\tPopover,\n\tPopoverAnchor,\n\tPopoverClose,\n\tPopoverContent,\n\tPopoverPortal,\n\tPopoverTrigger,\n} from \"@components/popover/popover\";\nexport type {\n\tPopoverContentProps,\n\tPopoverProps,\n} from \"@components/popover/popover\";\nexport { Progress } from \"@components/progress/progress\";\nexport type { ProgressProps } from \"@components/progress/progress\";\nexport {\n\tRadioGroup,\n\tRadioGroupItem,\n} from \"@components/radio-group/radio-group\";\nexport {\n\tSelect,\n\tSelectContent,\n\tSelectGroup,\n\tSelectItem,\n\tSelectLabel,\n\tSelectScrollDownButton,\n\tSelectScrollUpButton,\n\tSelectSeparator,\n\tSelectTrigger,\n\tSelectValue,\n} from \"@components/select/select\";\nexport { Skeleton } from \"@components/skeleton/skeleton\";\nexport { Slider } from \"@components/slider/slider\";\nexport type { SliderProps } from \"@components/slider/slider\";\nexport { Switch } from \"@components/switch/switch\";\nexport type { SwitchProps } from \"@components/switch/switch\";\nexport {\n\tTabs,\n\tTabsContent,\n\tTabsList,\n\tTabsTrigger,\n} from \"@components/tabs/tabs\";\nexport {\n\tTable,\n\tTableBody,\n\tTableCell,\n\tTableHead,\n\tTableHeader,\n\tTableRow,\n\tTableFooter,\n\tTableCaption,\n} from \"@components/table/table\";\nexport {\n\tToast,\n\tToaster,\n\ttoast,\n} from \"@components/toast/toast\";\nexport type { ToastProps } from \"@components/toast/toast\";\nexport {\n\tTooltip,\n\tTooltipContent,\n\tTooltipTrigger,\n} from \"@components/tooltip/tooltip\";\nexport type { TooltipProps } from \"@components/tooltip/tooltip\";\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"/","sources":["index.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,SAAS,EACT,gBAAgB,EAChB,aAAa,EACb,gBAAgB,GAChB,MAAM,iCAAiC,CAAC;AAOzC,OAAO,EAAE,KAAK,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAM9E,OAAO,EACN,WAAW,EACX,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,sBAAsB,EACtB,kBAAkB,EAClB,gBAAgB,EAChB,kBAAkB,GAClB,MAAM,uCAAuC,CAAC;AAC/C,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAChF,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAE9D,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAEhD,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AAEnD,OAAO,EACN,IAAI,EACJ,WAAW,EACX,UAAU,EACV,UAAU,GACV,MAAM,uBAAuB,CAAC;AAO/B,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AAEzD,OAAO,EACN,MAAM,EACN,WAAW,EACX,aAAa,EACb,iBAAiB,EACjB,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,aAAa,GACb,MAAM,2BAA2B,CAAC;AACnC,OAAO,EACN,MAAM,EACN,WAAW,EACX,aAAa,EACb,iBAAiB,EACjB,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,aAAa,GACb,MAAM,2BAA2B,CAAC;AACnC,OAAO,EACN,YAAY,EACZ,mBAAmB,EACnB,mBAAmB,EACnB,qBAAqB,EACrB,iBAAiB,EACjB,qBAAqB,EACrB,oBAAoB,EACpB,iBAAiB,EACjB,kBAAkB,EAClB,eAAe,EACf,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,GACtB,MAAM,yCAAyC,CAAC;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,sCAAsC,CAAC;AAEnE,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAEhD,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAEhD,OAAO,EACN,UAAU,EACV,cAAc,EACd,cAAc,EACd,cAAc,GACd,MAAM,mCAAmC,CAAC;AAK3C,OAAO,EACN,OAAO,EACP,aAAa,EACb,YAAY,EACZ,cAAc,EACd,aAAa,EACb,cAAc,GACd,MAAM,6BAA6B,CAAC;AAKrC,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AAEzD,OAAO,EACN,UAAU,EACV,cAAc,GACd,MAAM,qCAAqC,CAAC;AAC7C,OAAO,EACN,MAAM,EACN,aAAa,EACb,WAAW,EACX,UAAU,EACV,WAAW,EACX,sBAAsB,EACtB,oBAAoB,EACpB,eAAe,EACf,aAAa,EACb,WAAW,GACX,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AAEnD,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AAEnD,OAAO,EACN,IAAI,EACJ,WAAW,EACX,QAAQ,EACR,WAAW,GACX,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EACN,KAAK,EACL,SAAS,EACT,SAAS,EACT,SAAS,EACT,WAAW,EACX,QAAQ,EACR,WAAW,EACX,YAAY,GACZ,MAAM,yBAAyB,CAAC;AACjC,OAAO,EACN,KAAK,EACL,OAAO,EACP,KAAK,GACL,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EACN,OAAO,EACP,cAAc,EACd,cAAc,GACd,MAAM,6BAA6B,CAAC","sourcesContent":["export {\n\tAccordion,\n\tAccordionContent,\n\tAccordionItem,\n\tAccordionTrigger,\n} from \"@components/accordion/accordion\";\nexport type {\n\tAccordionContentProps,\n\tAccordionItemProps,\n\tAccordionProps,\n\tAccordionTriggerProps,\n} from \"@components/accordion/accordion\";\nexport { Alert, AlertDescription, AlertTitle } from \"@components/alert/alert\";\nexport type {\n\tAlertDescriptionProps,\n\tAlertProps,\n\tAlertTitleProps,\n} from \"@components/alert/alert\";\nexport {\n\tAlertDialog,\n\tAlertDialogAction,\n\tAlertDialogCancel,\n\tAlertDialogContent,\n\tAlertDialogDescription,\n\tAlertDialogOverlay,\n\tAlertDialogTitle,\n\tAlertDialogTrigger,\n} from \"@components/alert-dialog/alert-dialog\";\nexport { Avatar, AvatarFallback, AvatarImage } from \"@components/avatar/avatar\";\nexport { AvatarGroup } from \"@components/avatar/avatar-group\";\nexport type { AvatarGroupProps } from \"@components/avatar/avatar-group\";\nexport { Badge } from \"@components/badge/badge\";\nexport type { BadgeProps } from \"@components/badge/badge\";\nexport { Button } from \"@components/button/button\";\nexport type { ButtonProps } from \"@components/button/button\";\nexport {\n\tCard,\n\tCardContent,\n\tCardFooter,\n\tCardHeader,\n} from \"@components/card/card\";\nexport type {\n\tCardContentProps,\n\tCardFooterProps,\n\tCardHeaderProps,\n\tCardProps,\n} from \"@components/card/card\";\nexport { Checkbox } from \"@components/checkbox/checkbox\";\nexport type { CheckboxProps } from \"@components/checkbox/checkbox\";\nexport {\n\tDialog,\n\tDialogClose,\n\tDialogContent,\n\tDialogDescription,\n\tDialogFooter,\n\tDialogHeader,\n\tDialogTitle,\n\tDialogTrigger,\n} from \"@components/dialog/dialog\";\nexport {\n\tDrawer,\n\tDrawerClose,\n\tDrawerContent,\n\tDrawerDescription,\n\tDrawerFooter,\n\tDrawerHeader,\n\tDrawerTitle,\n\tDrawerTrigger,\n} from \"@components/drawer/drawer\";\nexport {\n\tDropdownMenu,\n\tDropdownMenuTrigger,\n\tDropdownMenuContent,\n\tDropdownMenuRadioItem,\n\tDropdownMenuLabel,\n\tDropdownMenuSeparator,\n\tDropdownMenuShortcut,\n\tDropdownMenuGroup,\n\tDropdownMenuPortal,\n\tDropdownMenuSub,\n\tDropdownMenuSubContent,\n\tDropdownMenuSubTrigger,\n\tDropdownMenuRadioGroup,\n} from \"@components/dropdown-menu/dropdown-menu\";\nexport { getVariants } from \"@utilities/get-variants/get-variants\";\nexport type { ResponsiveValue } from \"@utilities/responsive/responsive\";\nexport { Label } from \"@components/label/label\";\nexport type { LabelProps } from \"@components/label/label\";\nexport { Input } from \"@components/input/input\";\nexport type { InputProps } from \"@components/input/input\";\nexport {\n\tPagination,\n\tPaginationItem,\n\tPaginationNext,\n\tPaginationPrev,\n} from \"@components/pagination/pagination\";\nexport type {\n\tPaginationItemProps,\n\tPaginationProps,\n} from \"@components/pagination/pagination\";\nexport {\n\tPopover,\n\tPopoverAnchor,\n\tPopoverClose,\n\tPopoverContent,\n\tPopoverPortal,\n\tPopoverTrigger,\n} from \"@components/popover/popover\";\nexport type {\n\tPopoverContentProps,\n\tPopoverProps,\n} from \"@components/popover/popover\";\nexport { Progress } from \"@components/progress/progress\";\nexport type { ProgressProps } from \"@components/progress/progress\";\nexport {\n\tRadioGroup,\n\tRadioGroupItem,\n} from \"@components/radio-group/radio-group\";\nexport {\n\tSelect,\n\tSelectContent,\n\tSelectGroup,\n\tSelectItem,\n\tSelectLabel,\n\tSelectScrollDownButton,\n\tSelectScrollUpButton,\n\tSelectSeparator,\n\tSelectTrigger,\n\tSelectValue,\n} from \"@components/select/select\";\nexport { Skeleton } from \"@components/skeleton/skeleton\";\nexport { Slider } from \"@components/slider/slider\";\nexport type { SliderProps } from \"@components/slider/slider\";\nexport { Switch } from \"@components/switch/switch\";\nexport type { SwitchProps } from \"@components/switch/switch\";\nexport {\n\tTabs,\n\tTabsContent,\n\tTabsList,\n\tTabsTrigger,\n} from \"@components/tabs/tabs\";\nexport {\n\tTable,\n\tTableBody,\n\tTableCell,\n\tTableHead,\n\tTableHeader,\n\tTableRow,\n\tTableFooter,\n\tTableCaption,\n} from \"@components/table/table\";\nexport {\n\tToast,\n\tToaster,\n\ttoast,\n} from \"@components/toast/toast\";\nexport type { ToastProps } from \"@components/toast/toast\";\nexport {\n\tTooltip,\n\tTooltipContent,\n\tTooltipTrigger,\n} from \"@components/tooltip/tooltip\";\nexport type { TooltipProps } from \"@components/tooltip/tooltip\";\n"]}
@@ -8,6 +8,14 @@
8
8
  --animate-accordion-down: accordion-down 350ms ease;
9
9
  --animate-fade-in: fade-in 350ms ease;
10
10
  --animate-fade-out: fade-out 350ms ease;
11
+ --animate-slide-in-right: slide-in-right 500ms ease;
12
+ --animate-slide-out-right: slide-out-right 500ms ease;
13
+ --animate-slide-in-left: slide-in-left 500ms ease;
14
+ --animate-slide-out-left: slide-out-left 500ms ease;
15
+ --animate-slide-in-top: slide-in-top 500ms ease;
16
+ --animate-slide-out-top: slide-out-top 500ms ease;
17
+ --animate-slide-in-bottom: slide-in-bottom 500ms ease;
18
+ --animate-slide-out-bottom: slide-out-bottom 500ms ease;
11
19
  }
12
20
 
13
21
  @keyframes accordion-up {
@@ -45,3 +53,75 @@
45
53
  opacity: 0;
46
54
  }
47
55
  }
56
+
57
+ @keyframes slide-in-right {
58
+ from {
59
+ transform: translateX(100%);
60
+ }
61
+ to {
62
+ transform: translateX(0);
63
+ }
64
+ }
65
+
66
+ @keyframes slide-out-right {
67
+ from {
68
+ transform: translateX(0);
69
+ }
70
+ to {
71
+ transform: translateX(100%);
72
+ }
73
+ }
74
+
75
+ @keyframes slide-in-left {
76
+ from {
77
+ transform: translateX(-100%);
78
+ }
79
+ to {
80
+ transform: translateX(0);
81
+ }
82
+ }
83
+
84
+ @keyframes slide-out-left {
85
+ from {
86
+ transform: translateX(0);
87
+ }
88
+ to {
89
+ transform: translateX(-100%);
90
+ }
91
+ }
92
+
93
+ @keyframes slide-in-top {
94
+ from {
95
+ transform: translateY(-100%);
96
+ }
97
+ to {
98
+ transform: translateY(0);
99
+ }
100
+ }
101
+
102
+ @keyframes slide-out-top {
103
+ from {
104
+ transform: translateY(0);
105
+ }
106
+ to {
107
+ transform: translateY(-100%);
108
+ }
109
+ }
110
+
111
+ @keyframes slide-in-bottom {
112
+ from {
113
+ transform: translateY(100%);
114
+ }
115
+ to {
116
+ transform: translateY(0);
117
+ }
118
+ }
119
+
120
+ @keyframes slide-out-bottom {
121
+ from {
122
+ transform: translateY(0);
123
+ }
124
+ to {
125
+ transform: translateY(100%);
126
+ }
127
+ }
@@ -39,12 +39,12 @@ import { cn } from "../cn/cn";
39
39
  */
40
40
  export const getVariants = ({ base, variants, compoundVariants, }) => ({ className, ...props }) => {
41
41
  const responsiveClasses = Object.entries(props)
42
- .flatMap(([key, propValue]) => {
42
+ .map(([key, propValue]) => {
43
43
  const variant = variants?.[key];
44
44
  const value = typeof propValue === "boolean" ? String(propValue) : propValue;
45
45
  // Handle undefined values
46
46
  if (!value)
47
- return;
47
+ return undefined;
48
48
  const variantValue = variant?.[value];
49
49
  // Handle string values
50
50
  if (typeof variantValue === "string") {
@@ -65,6 +65,7 @@ export const getVariants = ({ base, variants, compoundVariants, }) => ({ classNa
65
65
  })
66
66
  .join(" ");
67
67
  })
68
+ .filter(Boolean)
68
69
  .join(" ");
69
70
  const compoundClasses = compoundVariants
70
71
  ?.map(({ className, ...compound }) => {
@@ -1 +1 @@
1
- {"version":3,"file":"get-variants.js","sourceRoot":"/","sources":["utilities/get-variants/get-variants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AA8BtC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,MAAM,CAAC,MAAM,WAAW,GACvB,CAA0B,EACzB,IAAI,EACJ,QAAQ,EACR,gBAAgB,GACY,EAAE,EAAE,CACjC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAmB,EAAE,EAAE;IAC5C,MAAM,iBAAiB,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;SAC7C,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,SAAS,CAAC,EAAE,EAAE;QAC7B,MAAM,OAAO,GAAG,QAAQ,EAAE,CAAC,GAAG,CAAC,CAAC;QAChC,MAAM,KAAK,GACV,OAAO,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;QAEhE,0BAA0B;QAC1B,IAAI,CAAC,KAAK;YAAE,OAAO;QAEnB,MAAM,YAAY,GAAG,OAAO,EAAE,CAAC,KAA6B,CAAC,CAAC;QAE9D,uBAAuB;QACvB,IAAI,OAAO,YAAY,KAAK,QAAQ,EAAE,CAAC;YACtC,OAAO,YAAY,CAAC;QACrB,CAAC;QAED,2BAA2B;QAC3B,OAAO,MAAM,CAAC,OAAO,CAAC,KAAmC,CAAC;aACxD,GAAG,CAAC,CAAC,CAAC,UAAU,EAAE,KAAK,CAAC,EAAE,EAAE;YAC5B,mFAAmF;YACnF,IAAI,UAAU,KAAK,SAAS,EAAE,CAAC;gBAC9B,OAAO,QAAQ,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,KAA6B,CAAC,CAAC;YACzD,CAAC;YACD,iEAAiE;YACjE,OAAO,QAAQ,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,KAA6B,CAAC;gBACtD,EAAE,KAAK,CAAC,GAAG,CAAC;iBACX,GAAG,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,GAAG,UAAU,IAAI,SAAS,EAAE,CAAC;iBAChD,IAAI,CAAC,GAAG,CAAC,CAAC;QACb,CAAC,CAAC;aACD,IAAI,CAAC,GAAG,CAAC,CAAC;IACb,CAAC,CAAC;SACD,IAAI,CAAC,GAAG,CAAC,CAAC;IAEZ,MAAM,eAAe,GAAG,gBAAgB;QACvC,EAAE,GAAG,CAAC,CAAC,EAAE,SAAS,EAAE,GAAG,QAAQ,EAAE,EAAE,EAAE;QACpC,IACC,MAAM,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,KAAK,CAC7B,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE,CAChB,KAAK,CAAC,GAAG,CAAC,KAAK,MAAM,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC,GAAG,CAAC,KAAK,KAAK,CACrD,EACA,CAAC;YACF,OAAO,SAAS,CAAC;QAClB,CAAC;QACD,OAAO,SAAS,CAAC;IAClB,CAAC,CAAC;SACD,MAAM,CAAC,OAAO,CAAC,CAAC;IAElB,OAAO,EAAE,CAAC,IAAI,EAAE,iBAAiB,EAAE,eAAe,EAAE,SAAS,CAAC,CAAC;AAChE,CAAC,CAAC","sourcesContent":["import { cn } from \"@utilities/cn/cn\";\nimport type {\n\tBreakpointsMap,\n\tResponsiveValue,\n} from \"@utilities/responsive/responsive\";\n\ntype VariantValue = Record<string, string>;\ntype VariantConfig = Record<string, VariantValue>;\n\ntype StringBoolean = \"true\" | \"false\";\ntype BooleanVariant = Partial<Record<StringBoolean, string>>;\n\ntype VariantPropValue<T> = T extends BooleanVariant\n\t? ResponsiveValue<boolean> | undefined\n\t: T extends Record<string, unknown>\n\t\t? ResponsiveValue<keyof T>\n\t\t: never;\n\ntype VariantProps<T extends VariantConfig> = {\n\t[K in keyof T]: VariantPropValue<T[K]>;\n} & {\n\tclassName?: string;\n};\n\ntype ResponsiveClassesConfig<T extends VariantConfig> = {\n\tbase: string;\n\tvariants?: T;\n\tcompoundVariants?: Partial<VariantProps<T>>[];\n};\n\n/**\n * Creates a function that generates classes based on variant configurations and responsive props\n *\n * @template T - Type extending VariantConfig (Record of variant names to their possible values and corresponding classes)\n *\n * @param config - Configuration object for variants\n * @param config.base - Base classes that are always applied\n * @param config.variants - Object containing variant definitions where each key is a variant name\n * and value is either a string of class names, an object mapping variant values to class names,\n * or an object with true/false keys for boolean variants\n * @param config.compoundVariants - Optional array of compound variants that apply additional classes\n * when multiple variants have specific values\n *\n * @returns A function that accepts variant props and returns classes with twMerge\n *\n * @example\n * const getButtonVariants = getVariants({\n * base: \"px-4 py-2 rounded\",\n * variants: {\n * intent: {\n * primary: \"bg-blue-500 text-white\",\n * secondary: \"bg-gray-200 text-gray-800\"\n * },\n * size: {\n * sm: \"text-sm\",\n * lg: \"text-lg\"\n * },\n * disabled: {\n * true: \"opacity-50 cursor-not-allowed\"\n * }\n * }\n * });\n *\n * // Usage:\n * getButtonVariants({ intent: \"primary\", size: \"lg\", disabled: true })\n * // Or with responsive values:\n * getButtonVariants({ intent: { initial: \"primary\", md: \"secondary\" } })\n */\nexport const getVariants =\n\t<T extends VariantConfig>({\n\t\tbase,\n\t\tvariants,\n\t\tcompoundVariants,\n\t}: ResponsiveClassesConfig<T>) =>\n\t({ className, ...props }: VariantProps<T>) => {\n\t\tconst responsiveClasses = Object.entries(props)\n\t\t\t.flatMap(([key, propValue]) => {\n\t\t\t\tconst variant = variants?.[key];\n\t\t\t\tconst value =\n\t\t\t\t\ttypeof propValue === \"boolean\" ? String(propValue) : propValue;\n\n\t\t\t\t// Handle undefined values\n\t\t\t\tif (!value) return;\n\n\t\t\t\tconst variantValue = variant?.[value as keyof typeof variant];\n\n\t\t\t\t// Handle string values\n\t\t\t\tif (typeof variantValue === \"string\") {\n\t\t\t\t\treturn variantValue;\n\t\t\t\t}\n\n\t\t\t\t// Handle responsive values\n\t\t\t\treturn Object.entries(value as Partial<BreakpointsMap<T>>)\n\t\t\t\t\t.map(([breakpoint, value]) => {\n\t\t\t\t\t\t// If the breakpoint is initial, return the variant value without breakpoint prefix\n\t\t\t\t\t\tif (breakpoint === \"initial\") {\n\t\t\t\t\t\t\treturn variants?.[key]?.[value as keyof typeof variant];\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// Otherwise, return the variant value with the breakpoint prefix\n\t\t\t\t\t\treturn variants?.[key]?.[value as keyof typeof variant]\n\t\t\t\t\t\t\t?.split(\" \")\n\t\t\t\t\t\t\t.map((className) => `${breakpoint}:${className}`)\n\t\t\t\t\t\t\t.join(\" \");\n\t\t\t\t\t})\n\t\t\t\t\t.join(\" \");\n\t\t\t})\n\t\t\t.join(\" \");\n\n\t\tconst compoundClasses = compoundVariants\n\t\t\t?.map(({ className, ...compound }) => {\n\t\t\t\tif (\n\t\t\t\t\tObject.entries(compound).every(\n\t\t\t\t\t\t([key, value]) =>\n\t\t\t\t\t\t\tprops[key] === String(value) || props[key] === value,\n\t\t\t\t\t)\n\t\t\t\t) {\n\t\t\t\t\treturn className;\n\t\t\t\t}\n\t\t\t\treturn undefined;\n\t\t\t})\n\t\t\t.filter(Boolean);\n\n\t\treturn cn(base, responsiveClasses, compoundClasses, className);\n\t};\n"]}
1
+ {"version":3,"file":"get-variants.js","sourceRoot":"/","sources":["utilities/get-variants/get-variants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AA8BtC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,MAAM,CAAC,MAAM,WAAW,GACvB,CAA0B,EACzB,IAAI,EACJ,QAAQ,EACR,gBAAgB,GACY,EAAE,EAAE,CACjC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAmB,EAAE,EAAE;IAC5C,MAAM,iBAAiB,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;SAC7C,GAAG,CAAC,CAAC,CAAC,GAAG,EAAE,SAAS,CAA0C,EAAE,EAAE;QAClE,MAAM,OAAO,GAAG,QAAQ,EAAE,CAAC,GAAG,CAAC,CAAC;QAChC,MAAM,KAAK,GACV,OAAO,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;QAEhE,0BAA0B;QAC1B,IAAI,CAAC,KAAK;YAAE,OAAO,SAAS,CAAC;QAE7B,MAAM,YAAY,GAAG,OAAO,EAAE,CAAC,KAA2B,CAAC,CAAC;QAE5D,uBAAuB;QACvB,IAAI,OAAO,YAAY,KAAK,QAAQ,EAAE,CAAC;YACtC,OAAO,YAAY,CAAC;QACrB,CAAC;QAED,2BAA2B;QAC3B,OAAO,MAAM,CAAC,OAAO,CAAC,KAAmC,CAAC;aACxD,GAAG,CAAC,CAAC,CAAC,UAAU,EAAE,KAAK,CAAC,EAAE,EAAE;YAC5B,mFAAmF;YACnF,IAAI,UAAU,KAAK,SAAS,EAAE,CAAC;gBAC9B,OAAO,QAAQ,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,KAA6B,CAAC,CAAC;YACzD,CAAC;YACD,iEAAiE;YACjE,OAAO,QAAQ,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,KAA6B,CAAC;gBACtD,EAAE,KAAK,CAAC,GAAG,CAAC;iBACX,GAAG,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,GAAG,UAAU,IAAI,SAAS,EAAE,CAAC;iBAChD,IAAI,CAAC,GAAG,CAAC,CAAC;QACb,CAAC,CAAC;aACD,IAAI,CAAC,GAAG,CAAC,CAAC;IACb,CAAC,CAAC;SACD,MAAM,CAAC,OAAO,CAAC;SACf,IAAI,CAAC,GAAG,CAAC,CAAC;IAEZ,MAAM,eAAe,GAAG,gBAAgB;QACvC,EAAE,GAAG,CAAC,CAAC,EAAE,SAAS,EAAE,GAAG,QAAQ,EAAE,EAAE,EAAE;QACpC,IACC,MAAM,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,KAAK,CAC7B,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE,CAChB,KAAK,CAAC,GAAG,CAAC,KAAK,MAAM,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC,GAAG,CAAC,KAAK,KAAK,CACrD,EACA,CAAC;YACF,OAAO,SAAS,CAAC;QAClB,CAAC;QACD,OAAO,SAAS,CAAC;IAClB,CAAC,CAAC;SACD,MAAM,CAAC,OAAO,CAAC,CAAC;IAElB,OAAO,EAAE,CAAC,IAAI,EAAE,iBAAiB,EAAE,eAAe,EAAE,SAAS,CAAC,CAAC;AAChE,CAAC,CAAC","sourcesContent":["import { cn } from \"@utilities/cn/cn\";\nimport type {\n\tBreakpointsMap,\n\tResponsiveValue,\n} from \"@utilities/responsive/responsive\";\n\ntype VariantValue = Record<string, string>;\ntype VariantConfig = Record<string, VariantValue>;\n\ntype StringBoolean = \"true\" | \"false\";\ntype BooleanVariant = Partial<Record<StringBoolean, string>>;\n\ntype VariantPropValue<T> = T extends BooleanVariant\n\t? ResponsiveValue<boolean> | undefined\n\t: T extends Record<string, unknown>\n\t\t? ResponsiveValue<keyof T>\n\t\t: never;\n\ntype VariantProps<T extends VariantConfig> = {\n\t[K in keyof T]: VariantPropValue<T[K]>;\n} & {\n\tclassName?: string;\n};\n\ntype ResponsiveClassesConfig<T extends VariantConfig> = {\n\tbase: string;\n\tvariants?: T;\n\tcompoundVariants?: Partial<VariantProps<T>>[];\n};\n\n/**\n * Creates a function that generates classes based on variant configurations and responsive props\n *\n * @template T - Type extending VariantConfig (Record of variant names to their possible values and corresponding classes)\n *\n * @param config - Configuration object for variants\n * @param config.base - Base classes that are always applied\n * @param config.variants - Object containing variant definitions where each key is a variant name\n * and value is either a string of class names, an object mapping variant values to class names,\n * or an object with true/false keys for boolean variants\n * @param config.compoundVariants - Optional array of compound variants that apply additional classes\n * when multiple variants have specific values\n *\n * @returns A function that accepts variant props and returns classes with twMerge\n *\n * @example\n * const getButtonVariants = getVariants({\n * base: \"px-4 py-2 rounded\",\n * variants: {\n * intent: {\n * primary: \"bg-blue-500 text-white\",\n * secondary: \"bg-gray-200 text-gray-800\"\n * },\n * size: {\n * sm: \"text-sm\",\n * lg: \"text-lg\"\n * },\n * disabled: {\n * true: \"opacity-50 cursor-not-allowed\"\n * }\n * }\n * });\n *\n * // Usage:\n * getButtonVariants({ intent: \"primary\", size: \"lg\", disabled: true })\n * // Or with responsive values:\n * getButtonVariants({ intent: { initial: \"primary\", md: \"secondary\" } })\n */\nexport const getVariants =\n\t<T extends VariantConfig>({\n\t\tbase,\n\t\tvariants,\n\t\tcompoundVariants,\n\t}: ResponsiveClassesConfig<T>) =>\n\t({ className, ...props }: VariantProps<T>) => {\n\t\tconst responsiveClasses = Object.entries(props)\n\t\t\t.map(([key, propValue]: [keyof T, VariantPropValue<T[keyof T]>]) => {\n\t\t\t\tconst variant = variants?.[key];\n\t\t\t\tconst value =\n\t\t\t\t\ttypeof propValue === \"boolean\" ? String(propValue) : propValue;\n\n\t\t\t\t// Handle undefined values\n\t\t\t\tif (!value) return undefined;\n\n\t\t\t\tconst variantValue = variant?.[value as keyof VariantValue];\n\n\t\t\t\t// Handle string values\n\t\t\t\tif (typeof variantValue === \"string\") {\n\t\t\t\t\treturn variantValue;\n\t\t\t\t}\n\n\t\t\t\t// Handle responsive values\n\t\t\t\treturn Object.entries(value as Partial<BreakpointsMap<T>>)\n\t\t\t\t\t.map(([breakpoint, value]) => {\n\t\t\t\t\t\t// If the breakpoint is initial, return the variant value without breakpoint prefix\n\t\t\t\t\t\tif (breakpoint === \"initial\") {\n\t\t\t\t\t\t\treturn variants?.[key]?.[value as keyof typeof variant];\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// Otherwise, return the variant value with the breakpoint prefix\n\t\t\t\t\t\treturn variants?.[key]?.[value as keyof typeof variant]\n\t\t\t\t\t\t\t?.split(\" \")\n\t\t\t\t\t\t\t.map((className) => `${breakpoint}:${className}`)\n\t\t\t\t\t\t\t.join(\" \");\n\t\t\t\t\t})\n\t\t\t\t\t.join(\" \");\n\t\t\t})\n\t\t\t.filter(Boolean)\n\t\t\t.join(\" \");\n\n\t\tconst compoundClasses = compoundVariants\n\t\t\t?.map(({ className, ...compound }) => {\n\t\t\t\tif (\n\t\t\t\t\tObject.entries(compound).every(\n\t\t\t\t\t\t([key, value]) =>\n\t\t\t\t\t\t\tprops[key] === String(value) || props[key] === value,\n\t\t\t\t\t)\n\t\t\t\t) {\n\t\t\t\t\treturn className;\n\t\t\t\t}\n\t\t\t\treturn undefined;\n\t\t\t})\n\t\t\t.filter(Boolean);\n\n\t\treturn cn(base, responsiveClasses, compoundClasses, className);\n\t};\n"]}
@@ -1,6 +1,8 @@
1
- export type Breakpoint = "initial" | "sm" | "md" | "lg" | "xl";
2
- export type BreakpointsMap<V> = Partial<{
3
- [breakpoint in Breakpoint]: V;
1
+ export type Breakpoints = "sm" | "md" | "lg" | "xl";
2
+ export type BreakpointsMap<V> = {
3
+ initial: V;
4
+ } & Partial<{
5
+ [breakpoint in Breakpoints]: V;
4
6
  }>;
5
7
  export type ResponsiveValue<T> = T | BreakpointsMap<T>;
6
8
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"responsive.js","sourceRoot":"/","sources":["utilities/responsive/responsive.ts"],"names":[],"mappings":"AAQA,MAAM,eAAe,GAAG,CAAI,KAAyB,EAAc,EAAE,CACpE,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC;AAE1B,MAAM,gBAAgB,GAAG,CACxB,KAAyB,EACI,EAAE,CAC/B,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK,IAAI,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;AAErE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAG,CACjC,KAAyB,EACzB,MAAuB,EACF,EAAE,CACvB,eAAe,CAAC,KAAK,CAAC;IACrB,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;IACf,CAAC,CAAE,MAAM,CAAC,WAAW,CACnB,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,UAAU,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC;QAClD,UAAU;QACV,MAAM,CAAC,KAAK,CAAC;KACb,CAAC,CACoB,CAAC","sourcesContent":["export type Breakpoint = \"initial\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\n\nexport type BreakpointsMap<V> = Partial<{\n\t[breakpoint in Breakpoint]: V;\n}>;\n\nexport type ResponsiveValue<T> = T | BreakpointsMap<T>;\n\nconst isSingularValue = <A>(value: ResponsiveValue<A>): value is A =>\n\t!isBreakpointsMap(value);\n\nconst isBreakpointsMap = <A>(\n\tvalue: ResponsiveValue<A>,\n): value is BreakpointsMap<A> =>\n\ttypeof value === \"object\" && value != null && !Array.isArray(value);\n\n/**\n * Maps a ResponsiveValue to a new ResponsiveValue using the provided mapper function. Singular values are passed through as is.\n *\n * @template V The type of the original value\n * @template T The type of the mapped value\n * @param {ResponsiveValue<V>} value - The original ResponsiveValue to be mapped\n * @param {function(V): T} mapper - A function that maps a ResponsiveValue to a new ResponsiveValue\n * @returns {ResponsiveValue<T>} A new ResponsiveValue with the mapped values\n *\n *\n * @example\n * const sizes = {\n * initial: 'md',\n * sm: 'lg',\n * }\n *\n * const output = mapResponsiveValue(sizes, size => {\n *\tswitch (size) {\n *\t\tcase 'initial':\n *\t\treturn 'sm';\n *\t\tcase 'sm':\n *\t\t\treturn 'md';\n *\t\t}\n *\t});\n *\n * // console.log(output)\n * {\n *\tinitial: 'sm',\n *\tsm: 'md',\n * }\n */\nexport const mapResponsiveValue = <V, T>(\n\tvalue: ResponsiveValue<V>,\n\tmapper: (value: V) => T,\n): ResponsiveValue<T> =>\n\tisSingularValue(value)\n\t\t? mapper(value)\n\t\t: (Object.fromEntries(\n\t\t\t\tObject.entries(value).map(([breakpoint, value]) => [\n\t\t\t\t\tbreakpoint,\n\t\t\t\t\tmapper(value),\n\t\t\t\t]),\n\t\t\t) as BreakpointsMap<T>);\n"]}
1
+ {"version":3,"file":"responsive.js","sourceRoot":"/","sources":["utilities/responsive/responsive.ts"],"names":[],"mappings":"AAUA,MAAM,eAAe,GAAG,CAAI,KAAyB,EAAc,EAAE,CACpE,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC;AAE1B,MAAM,gBAAgB,GAAG,CACxB,KAAyB,EACI,EAAE,CAC/B,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK,IAAI,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;AAErE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAG,CACjC,KAAyB,EACzB,MAAuB,EACF,EAAE,CACvB,eAAe,CAAC,KAAK,CAAC;IACrB,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;IACf,CAAC,CAAE,MAAM,CAAC,WAAW,CACnB,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,UAAU,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC;QAClD,UAAU;QACV,MAAM,CAAC,KAAK,CAAC;KACb,CAAC,CACoB,CAAC","sourcesContent":["export type Breakpoints = \"sm\" | \"md\" | \"lg\" | \"xl\";\n\nexport type BreakpointsMap<V> = {\n\tinitial: V;\n} & Partial<{\n\t[breakpoint in Breakpoints]: V;\n}>;\n\nexport type ResponsiveValue<T> = T | BreakpointsMap<T>;\n\nconst isSingularValue = <A>(value: ResponsiveValue<A>): value is A =>\n\t!isBreakpointsMap(value);\n\nconst isBreakpointsMap = <A>(\n\tvalue: ResponsiveValue<A>,\n): value is BreakpointsMap<A> =>\n\ttypeof value === \"object\" && value != null && !Array.isArray(value);\n\n/**\n * Maps a ResponsiveValue to a new ResponsiveValue using the provided mapper function. Singular values are passed through as is.\n *\n * @template V The type of the original value\n * @template T The type of the mapped value\n * @param {ResponsiveValue<V>} value - The original ResponsiveValue to be mapped\n * @param {function(V): T} mapper - A function that maps a ResponsiveValue to a new ResponsiveValue\n * @returns {ResponsiveValue<T>} A new ResponsiveValue with the mapped values\n *\n *\n * @example\n * const sizes = {\n * initial: 'md',\n * sm: 'lg',\n * }\n *\n * const output = mapResponsiveValue(sizes, size => {\n *\tswitch (size) {\n *\t\tcase 'initial':\n *\t\treturn 'sm';\n *\t\tcase 'sm':\n *\t\t\treturn 'md';\n *\t\t}\n *\t});\n *\n * // console.log(output)\n * {\n *\tinitial: 'sm',\n *\tsm: 'md',\n * }\n */\nexport const mapResponsiveValue = <V, T>(\n\tvalue: ResponsiveValue<V>,\n\tmapper: (value: V) => T,\n): ResponsiveValue<T> =>\n\tisSingularValue(value)\n\t\t? mapper(value)\n\t\t: (Object.fromEntries(\n\t\t\t\tObject.entries(value).map(([breakpoint, value]) => [\n\t\t\t\t\tbreakpoint,\n\t\t\t\t\tmapper(value),\n\t\t\t\t]),\n\t\t\t) as BreakpointsMap<T>);\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "luan-ui",
3
- "version": "0.2.0",
3
+ "version": "0.4.0",
4
4
  "description": "A UI library for React",
5
5
  "author": "benebene84 <benedikt.sperl@gmail.com> (https://github.com/benebene84)",
6
6
  "main": "/dist/index.js",
@@ -34,15 +34,11 @@
34
34
  "homepage": "https://github.com/benebene84/luan-ui#readme",
35
35
  "devDependencies": {
36
36
  "@biomejs/biome": "^1.9.4",
37
- "@chromatic-com/storybook": "^3",
38
- "@storybook/addon-essentials": "^8.6.14",
39
- "@storybook/addon-interactions": "^8.6.14",
40
- "@storybook/addon-onboarding": "^8.6.14",
37
+ "@chromatic-com/storybook": "^4.0.0",
38
+ "@storybook/addon-docs": "^9.0.5",
39
+ "@storybook/addon-onboarding": "^9.0.5",
41
40
  "@storybook/addon-webpack5-compiler-swc": "^3.0.0",
42
- "@storybook/blocks": "^8.6.14",
43
- "@storybook/react": "^8.6.14",
44
- "@storybook/react-webpack5": "^8.6.14",
45
- "@storybook/test": "^8.6.14",
41
+ "@storybook/react-webpack5": "^9.0.5",
46
42
  "@tailwindcss/postcss": "^4.1.7",
47
43
  "@testing-library/dom": "^10.4.0",
48
44
  "@testing-library/jest-dom": "^6.6.3",
@@ -57,7 +53,7 @@
57
53
  "lefthook": "^1.11.13",
58
54
  "postcss": "^8.5.3",
59
55
  "postcss-loader": "^8.1.1",
60
- "storybook": "^8.6.14",
56
+ "storybook": "^9.0.5",
61
57
  "style-loader": "^4.0.0",
62
58
  "tailwindcss": "^4.1.7",
63
59
  "tsc-alias": "^1.8.16",