luan-ui 0.2.0 → 0.3.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.
- package/README.md +38 -1
- package/dist/components/avatar/avatar.js +2 -2
- package/dist/components/avatar/avatar.js.map +1 -1
- package/dist/components/dialog/dialog.js +1 -1
- package/dist/components/dialog/dialog.js.map +1 -1
- package/dist/components/drawer/drawer.d.ts +16 -0
- package/dist/components/drawer/drawer.js +49 -0
- package/dist/components/drawer/drawer.js.map +1 -0
- package/dist/components/dropdown-menu/dropdown-menu.js +2 -2
- package/dist/components/dropdown-menu/dropdown-menu.js.map +1 -1
- package/dist/components/radio-group/radio-group.js +8 -1
- package/dist/components/radio-group/radio-group.js.map +1 -1
- package/dist/components/select/select.d.ts +2 -1
- package/dist/components/select/select.js +9 -2
- package/dist/components/select/select.js.map +1 -1
- package/dist/components/slider/slider.js +6 -2
- package/dist/components/slider/slider.js.map +1 -1
- package/dist/index.d.ts +2 -1
- package/dist/index.js +2 -1
- package/dist/index.js.map +1 -1
- package/dist/styles/index.css +80 -0
- package/package.json +1 -1
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.
|
|
@@ -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
|
|
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"]}
|
|
@@ -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
|
|
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":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AACnD,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,UAAU,CAAC;AACjD,OAAO,EAGN,UAAU,GACV,MAAM,OAAO,CAAC;AAEf,MAAM,MAAM,GAAG,WAAW,CAAC,IAAI,CAAC;AAEhC,MAAM,aAAa,GAAG,WAAW,CAAC,OAAO,CAAC;AAE1C,MAAM,WAAW,GAAG,WAAW,CAAC,KAAK,CAAC;AAEtC,MAAM,aAAa,GAAG,UAAU,CAG9B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACnC,KAAC,WAAW,CAAC,OAAO,IACnB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACZ,
|
|
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]:
|
|
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]:
|
|
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":"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","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":"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","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,
|
|
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,
|
|
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").
|
|
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 =
|
|
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]:
|
|
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
|
-
|
|
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,
|
|
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
|
@@ -12,7 +12,8 @@ export type { CardContentProps, CardFooterProps, CardHeaderProps, CardProps, } f
|
|
|
12
12
|
export { Checkbox } from "./components/checkbox/checkbox";
|
|
13
13
|
export type { CheckboxProps } from "./components/checkbox/checkbox";
|
|
14
14
|
export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, } from "./components/dialog/dialog";
|
|
15
|
-
export {
|
|
15
|
+
export { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerTitle, DrawerTrigger, } from "./components/drawer/drawer";
|
|
16
|
+
export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuRadioItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuGroup, DropdownMenuPortal, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuRadioGroup, } from "./components/dropdown-menu/dropdown-menu";
|
|
16
17
|
export { getVariants } from "./utilities/get-variants/get-variants";
|
|
17
18
|
export type { ResponsiveValue } from "./utilities/responsive/responsive";
|
|
18
19
|
export { Label } from "./components/label/label";
|
package/dist/index.js
CHANGED
|
@@ -6,7 +6,8 @@ export { Button } from "./components/button/button";
|
|
|
6
6
|
export { Card, CardContent, CardFooter, CardHeader, } from "./components/card/card";
|
|
7
7
|
export { Checkbox } from "./components/checkbox/checkbox";
|
|
8
8
|
export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, } from "./components/dialog/dialog";
|
|
9
|
-
export {
|
|
9
|
+
export { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerTitle, DrawerTrigger, } from "./components/drawer/drawer";
|
|
10
|
+
export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuRadioItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuGroup, DropdownMenuPortal, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuRadioGroup, } from "./components/dropdown-menu/dropdown-menu";
|
|
10
11
|
export { getVariants } from "./utilities/get-variants/get-variants";
|
|
11
12
|
export { Label } from "./components/label/label";
|
|
12
13
|
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,
|
|
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,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 { 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"]}
|
package/dist/styles/index.css
CHANGED
|
@@ -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
|
+
}
|