@freightos/freightwind 1.0.0

package/dist/cjs/components/rich-text-editor.js

@@ -0,0 +1,152 @@
+"use strict";
+'use client';
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RichTextEditor = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const utils_1 = require("../lib/utils");
+const extension_bullet_list_1 = __importDefault(require("@tiptap/extension-bullet-list"));
+const extension_list_item_1 = __importDefault(require("@tiptap/extension-list-item"));
+const extension_ordered_list_1 = __importDefault(require("@tiptap/extension-ordered-list"));
+const extension_link_1 = __importDefault(require("@tiptap/extension-link"));
+const extension_underline_1 = __importDefault(require("@tiptap/extension-underline"));
+const extension_placeholder_1 = __importDefault(require("@tiptap/extension-placeholder"));
+const react_1 = require("@tiptap/react");
+const starter_kit_1 = __importDefault(require("@tiptap/starter-kit"));
+const state_1 = require("@tiptap/pm/state");
+const lucide_react_1 = require("lucide-react");
+const react_2 = require("react");
+const input_1 = require("./input");
+const button_1 = require("./button");
+const popover_1 = require("./popover");
+// Custom Link extension to prevent clicks
+const createCustomLink = (onLinkClick) => {
+    return extension_link_1.default.extend({
+        addProseMirrorPlugins() {
+            return [
+                new state_1.Plugin({
+                    key: new state_1.PluginKey('handleLinkClick'),
+                    props: {
+                        handleClick(_view, _pos, event) {
+                            const link = event.target?.closest('a');
+                            if (link) {
+                                event.preventDefault();
+                                event.stopPropagation();
+                                const href = link.getAttribute('href');
+                                if (href) {
+                                    onLinkClick(href);
+                                }
+                                return true;
+                            }
+                            return false;
+                        },
+                    },
+                }),
+            ];
+        },
+    }).configure({
+        openOnClick: false,
+        HTMLAttributes: {
+            class: 'text-primary underline cursor-pointer',
+            rel: 'noopener noreferrer nofollow',
+        },
+    });
+};
+const MenuBar = ({ editor, linkUrl, setLinkUrl, linkPopoverOpen, setLinkPopoverOpen, isEditingExistingLink, setIsEditingExistingLink, handleSetLink, handleRemoveLink, }) => {
+    if (!editor)
+        return null;
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-fds-xs border-b border-border bg-fds-gray-10 px-fds-md py-fds-md dark:bg-card", children: [(0, jsx_runtime_1.jsx)("button", { onClick: () => editor.chain().focus().toggleBold().run(), type: "button", className: "cursor-pointer rounded p-1 hover:bg-fds-gray-20 dark:hover:bg-fds-gray-80", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Bold, { className: (0, utils_1.cn)('h-4 w-4 text-foreground', editor.isActive('bold') && 'text-primary') }) }), (0, jsx_runtime_1.jsx)("button", { onClick: () => editor.chain().focus().toggleItalic().run(), type: "button", className: "cursor-pointer rounded p-1 hover:bg-fds-gray-20 dark:hover:bg-fds-gray-80", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Italic, { className: (0, utils_1.cn)('h-4 w-4 text-foreground', editor.isActive('italic') && 'text-primary') }) }), (0, jsx_runtime_1.jsx)("button", { onClick: () => editor.chain().focus().toggleUnderline().run(), type: "button", className: "cursor-pointer rounded p-1 hover:bg-fds-gray-20 dark:hover:bg-fds-gray-80", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Underline, { className: (0, utils_1.cn)('h-4 w-4 text-foreground', editor.isActive('underline') && 'text-primary') }) }), (0, jsx_runtime_1.jsx)("div", { className: "mx-fds-xs h-4 w-px bg-fds-gray-20 dark:bg-fds-gray-80" }), (0, jsx_runtime_1.jsx)("button", { onClick: (e) => {
+                    e.preventDefault();
+                    editor.chain().focus().toggleBulletList().run();
+                }, type: "button", className: "cursor-pointer rounded p-1 hover:bg-fds-gray-20 dark:hover:bg-fds-gray-80", children: (0, jsx_runtime_1.jsx)(lucide_react_1.List, { className: (0, utils_1.cn)('h-4 w-4 text-foreground', editor.isActive('bulletList') && 'text-primary') }) }), (0, jsx_runtime_1.jsx)("button", { onClick: (e) => {
+                    e.preventDefault();
+                    editor.chain().focus().toggleOrderedList().run();
+                }, type: "button", className: "cursor-pointer rounded p-1 hover:bg-fds-gray-20 dark:hover:bg-fds-gray-80", children: (0, jsx_runtime_1.jsx)(lucide_react_1.ListOrdered, { className: (0, utils_1.cn)('h-4 w-4 text-foreground', editor.isActive('orderedList') && 'text-primary') }) }), (0, jsx_runtime_1.jsxs)(popover_1.Popover, { open: linkPopoverOpen, onOpenChange: setLinkPopoverOpen, children: [(0, jsx_runtime_1.jsx)(popover_1.PopoverTrigger, { asChild: true, children: (0, jsx_runtime_1.jsx)("button", { type: "button", className: "cursor-pointer rounded p-1 hover:bg-fds-gray-20 dark:hover:bg-fds-gray-80", onClick: () => {
+                                if (editor.isActive('link')) {
+                                    setLinkUrl(editor.getAttributes('link').href);
+                                }
+                            }, children: (0, jsx_runtime_1.jsx)(lucide_react_1.Link, { className: (0, utils_1.cn)('h-4 w-4 text-foreground', editor.isActive('link') && 'text-primary') }) }) }), (0, jsx_runtime_1.jsx)(popover_1.PopoverContent, { className: "w-[300px]", children: (0, jsx_runtime_1.jsx)("div", { className: "flex flex-col gap-fds-sm", children: isEditingExistingLink ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-fds-sm font-fds-semibold", children: "Visit URL:" }), (0, jsx_runtime_1.jsx)("a", { href: linkUrl, target: "_blank", rel: "noopener noreferrer", className: "truncate text-fds-sm text-primary hover:underline", children: linkUrl }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-fds-xs", children: [(0, jsx_runtime_1.jsx)(button_1.Button, { size: "small", onClick: () => {
+                                                    setIsEditingExistingLink(false);
+                                                }, className: "flex-1", children: "Edit" }), (0, jsx_runtime_1.jsx)(button_1.Button, { size: "small", type: "text", onClick: handleRemoveLink, className: "flex-1", children: "Remove" })] })] })) : editor.isActive('link') ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-fds-sm font-fds-semibold", children: "Edit Link" }), (0, jsx_runtime_1.jsx)(input_1.Input, { value: linkUrl, onChange: (e) => setLinkUrl(e.target.value), placeholder: "Enter URL", onKeyDown: (e) => {
+                                            if (e.key === 'Enter') {
+                                                e.preventDefault();
+                                                handleSetLink();
+                                            }
+                                        }, autoFocus: true }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-fds-xs", children: [(0, jsx_runtime_1.jsx)(button_1.Button, { size: "small", onClick: handleSetLink, className: "flex-1", children: "Update" }), (0, jsx_runtime_1.jsx)(button_1.Button, { size: "small", type: "text", onClick: handleRemoveLink, className: "flex-1", children: "Remove" })] })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-fds-sm font-fds-semibold", children: "Add Link" }), (0, jsx_runtime_1.jsx)(input_1.Input, { value: linkUrl, onChange: (e) => setLinkUrl(e.target.value), placeholder: "Enter URL", onKeyDown: (e) => {
+                                            if (e.key === 'Enter') {
+                                                e.preventDefault();
+                                                handleSetLink();
+                                            }
+                                        }, autoFocus: true }), (0, jsx_runtime_1.jsx)(button_1.Button, { size: "small", onClick: handleSetLink, children: "Add Link" })] })) }) })] })] }));
+};
+const RichTextEditor = ({ value = '', onChange, placeholder = 'Type your message...', className, }) => {
+    const [linkPopoverOpen, setLinkPopoverOpen] = (0, react_2.useState)(false);
+    const [linkUrl, setLinkUrl] = (0, react_2.useState)('');
+    const [isEditingExistingLink, setIsEditingExistingLink] = (0, react_2.useState)(false);
+    const handleLinkClick = (href) => {
+        setLinkUrl(href);
+        setIsEditingExistingLink(true);
+        setLinkPopoverOpen(true);
+    };
+    const CustomLink = createCustomLink(handleLinkClick);
+    const editor = (0, react_1.useEditor)({
+        immediatelyRender: false,
+        extensions: [
+            starter_kit_1.default.configure({
+                bulletList: false,
+                orderedList: false,
+                listItem: false,
+            }),
+            extension_list_item_1.default,
+            extension_bullet_list_1.default.configure({
+                HTMLAttributes: {
+                    class: 'list-disc list-outside ml-4',
+                },
+            }),
+            extension_ordered_list_1.default.configure({
+                HTMLAttributes: {
+                    class: 'list-decimal list-outside ml-4',
+                },
+            }),
+            extension_underline_1.default,
+            CustomLink,
+            extension_placeholder_1.default.configure({
+                placeholder,
+            }),
+        ],
+        content: value,
+        onUpdate: ({ editor }) => {
+            onChange?.(editor.getHTML());
+        },
+        editorProps: {
+            attributes: {
+                class: (0, utils_1.cn)('prose prose-sm focus:outline-none min-h-[80px] px-fds-lg py-fds-sm prose-p:my-1 prose-ul:my-1 prose-ol:my-1 text-fds-sm bg-white dark:bg-black dark:text-white', className),
+            },
+        },
+    });
+    const handleSetLink = () => {
+        if (linkUrl && editor) {
+            // Ensure URL has protocol
+            let formattedUrl = linkUrl;
+            if (!/^https?:\/\//i.test(linkUrl)) {
+                formattedUrl = `https://${linkUrl}`;
+            }
+            editor.chain().focus().setLink({ href: formattedUrl }).run();
+            setLinkUrl('');
+            setIsEditingExistingLink(false);
+            setLinkPopoverOpen(false);
+        }
+    };
+    const handleRemoveLink = () => {
+        if (editor) {
+            editor.chain().focus().unsetLink().run();
+            setLinkUrl('');
+            setIsEditingExistingLink(false);
+            setLinkPopoverOpen(false);
+        }
+    };
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "w-full", children: [(0, jsx_runtime_1.jsx)(MenuBar, { editor: editor, linkUrl: linkUrl, setLinkUrl: setLinkUrl, linkPopoverOpen: linkPopoverOpen, setLinkPopoverOpen: setLinkPopoverOpen, isEditingExistingLink: isEditingExistingLink, setIsEditingExistingLink: setIsEditingExistingLink, handleSetLink: handleSetLink, handleRemoveLink: handleRemoveLink }), (0, jsx_runtime_1.jsx)(react_1.EditorContent, { editor: editor, placeholder: placeholder })] }));
+};
+exports.RichTextEditor = RichTextEditor;

package/dist/cjs/components/route.js

@@ -0,0 +1,47 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Route = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const utils_1 = require("../lib/utils");
+const Route = React.forwardRef(({ className, type = 'point-to-point', start, end, ...props }, ref) => {
+    if (type === 'point-to-point') {
+        return ((0, jsx_runtime_1.jsxs)("div", { ref: ref, className: (0, utils_1.cn)('flex items-center gap-fds-sm', className), ...props, children: [start, (0, jsx_runtime_1.jsxs)("div", { className: "relative flex items-center", children: [(0, jsx_runtime_1.jsx)("div", { className: "h-[5px] w-[5px] rounded-full bg-foreground" }), (0, jsx_runtime_1.jsx)("div", { className: "h-px w-[22px] bg-foreground" }), (0, jsx_runtime_1.jsx)("div", { className: "h-[5px] w-[5px] rounded-full bg-foreground" })] }), end] }));
+    }
+    return null;
+});
+exports.Route = Route;
+Route.displayName = 'Route';

package/dist/cjs/components/scroll-area.js

@@ -0,0 +1,48 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ScrollBar = exports.ScrollArea = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const ScrollAreaPrimitive = __importStar(require("@radix-ui/react-scroll-area"));
+const utils_1 = require("../lib/utils");
+const ScrollArea = React.forwardRef(({ className, children, ...props }, ref) => ((0, jsx_runtime_1.jsxs)(ScrollAreaPrimitive.Root, { ref: ref, className: (0, utils_1.cn)("relative overflow-hidden", className), ...props, children: [(0, jsx_runtime_1.jsx)(ScrollAreaPrimitive.Viewport, { className: "h-full w-full rounded-[inherit]", children: children }), (0, jsx_runtime_1.jsx)(ScrollBar, {}), (0, jsx_runtime_1.jsx)(ScrollAreaPrimitive.Corner, {})] })));
+exports.ScrollArea = ScrollArea;
+ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
+const ScrollBar = React.forwardRef(({ className, orientation = "vertical", ...props }, ref) => ((0, jsx_runtime_1.jsx)(ScrollAreaPrimitive.ScrollAreaScrollbar, { ref: ref, orientation: orientation, className: (0, utils_1.cn)("flex touch-none select-none transition-colors", orientation === "vertical" &&
+        "h-full w-2.5 border-l border-l-transparent p-[1px]", orientation === "horizontal" &&
+        "h-2.5 flex-col border-t border-t-transparent p-[1px]", className), ...props, children: (0, jsx_runtime_1.jsx)(ScrollAreaPrimitive.ScrollAreaThumb, { className: "relative flex-1 rounded-full bg-border" }) })));
+exports.ScrollBar = ScrollBar;
+ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;

package/dist/cjs/components/select.js

@@ -0,0 +1,71 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SelectScrollDownButton = exports.SelectScrollUpButton = exports.SelectSeparator = exports.SelectItem = exports.SelectLabel = exports.SelectContent = exports.SelectTrigger = exports.SelectValue = exports.SelectGroup = exports.Select = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const SelectPrimitive = __importStar(require("@radix-ui/react-select"));
+const utils_1 = require("../lib/utils");
+const icons_1 = require("@freightos/icons");
+const Select = SelectPrimitive.Root;
+exports.Select = Select;
+const SelectGroup = SelectPrimitive.Group;
+exports.SelectGroup = SelectGroup;
+const SelectValue = SelectPrimitive.Value;
+exports.SelectValue = SelectValue;
+const SelectTrigger = React.forwardRef(({ className, children, ...props }, ref) => ((0, jsx_runtime_1.jsxs)(SelectPrimitive.Trigger, { ref: ref, className: (0, utils_1.cn)('flex h-[32px] w-full items-center justify-between rounded-fds-md border border-input-border bg-input py-2 pl-3 pr-2 text-sm transition-[color,box-shadow] focus:outline-none disabled:cursor-not-allowed disabled:opacity-50 data-[state=open]:border-[#2075bd] data-[placeholder]:text-muted-foreground data-[state=open]:shadow-[0_0_0_2px_var(--fds-color-primary-blue-20)] [&>span]:line-clamp-1 [&[data-state=open]>span[data-radix-select-icon]>svg]:rotate-180', className), ...props, children: [children, (0, jsx_runtime_1.jsx)(SelectPrimitive.Icon, { asChild: true, children: (0, jsx_runtime_1.jsx)(icons_1.IconCaretDown, { className: "transition-transform duration-200" }) })] })));
+exports.SelectTrigger = SelectTrigger;
+SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
+const SelectScrollUpButton = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)(SelectPrimitive.ScrollUpButton, { ref: ref, className: (0, utils_1.cn)('flex cursor-default items-center justify-center py-1', className), ...props, children: (0, jsx_runtime_1.jsx)(icons_1.IconCaretUp, {}) })));
+exports.SelectScrollUpButton = SelectScrollUpButton;
+SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
+const SelectScrollDownButton = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)(SelectPrimitive.ScrollDownButton, { ref: ref, className: (0, utils_1.cn)('flex cursor-default items-center justify-center py-1', className), ...props, children: (0, jsx_runtime_1.jsx)(icons_1.IconCaretDown, {}) })));
+exports.SelectScrollDownButton = SelectScrollDownButton;
+SelectScrollDownButton.displayName =
+    SelectPrimitive.ScrollDownButton.displayName;
+const SelectContent = React.forwardRef(({ className, children, position = 'popper', ...props }, ref) => ((0, jsx_runtime_1.jsx)(SelectPrimitive.Portal, { children: (0, jsx_runtime_1.jsxs)(SelectPrimitive.Content, { ref: ref, className: (0, utils_1.cn)('relative z-[9999] max-h-[--radix-select-content-available-height] min-w-[8rem] w-max origin-[--radix-select-content-transform-origin] overflow-y-auto overflow-x-hidden rounded-fds-md bg-popover text-popover-foreground shadow-fds-md data-[state=open]:animate-in data-[state=closed]:animate-out 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', position === 'popper' &&
+            'data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1', className), position: position, ...props, children: [(0, jsx_runtime_1.jsx)(SelectScrollUpButton, {}), (0, jsx_runtime_1.jsx)(SelectPrimitive.Viewport, { className: (0, utils_1.cn)('w-full', position === 'popper' &&
+                    'h-[var(--radix-select-trigger-height)] min-w-[var(--radix-select-trigger-width)]'), children: children }), (0, jsx_runtime_1.jsx)(SelectScrollDownButton, {})] }) })));
+exports.SelectContent = SelectContent;
+SelectContent.displayName = SelectPrimitive.Content.displayName;
+const SelectLabel = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)(SelectPrimitive.Label, { ref: ref, className: (0, utils_1.cn)('py-1.5 pl-8 pr-2 text-sm font-semibold', className), ...props })));
+exports.SelectLabel = SelectLabel;
+SelectLabel.displayName = SelectPrimitive.Label.displayName;
+const SelectItem = React.forwardRef(({ className, children, ...props }, ref) => ((0, jsx_runtime_1.jsx)(SelectPrimitive.Item, { ref: ref, className: (0, utils_1.cn)('relative flex w-full cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[highlighted]:bg-accent data-[disabled]:opacity-50', className), ...props, children: (0, jsx_runtime_1.jsx)(SelectPrimitive.ItemText, { asChild: true, children: (0, jsx_runtime_1.jsx)("div", { className: "flex w-full flex-1 items-center", children: children }) }) })));
+exports.SelectItem = SelectItem;
+SelectItem.displayName = SelectPrimitive.Item.displayName;
+const SelectSeparator = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)(SelectPrimitive.Separator, { ref: ref, className: (0, utils_1.cn)('-mx-1 my-1 h-px bg-muted', className), ...props })));
+exports.SelectSeparator = SelectSeparator;
+SelectSeparator.displayName = SelectPrimitive.Separator.displayName;

package/dist/cjs/components/separator.js

@@ -0,0 +1,43 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Separator = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const SeparatorPrimitive = __importStar(require("@radix-ui/react-separator"));
+const React = __importStar(require("react"));
+const utils_1 = require("../lib/utils");
+const Separator = React.forwardRef(({ className, orientation = 'horizontal', decorative = true, ...props }, ref) => ((0, jsx_runtime_1.jsx)(SeparatorPrimitive.Root, { ref: ref, decorative: decorative, orientation: orientation, className: (0, utils_1.cn)('shrink-0 bg-fds-gray-20', orientation === 'horizontal' ? 'h-[1px] w-full' : 'h-full w-[1px]', className), ...props })));
+exports.Separator = Separator;
+Separator.displayName = SeparatorPrimitive.Root.displayName;

package/dist/cjs/components/sheet.js

@@ -0,0 +1,245 @@
+"use strict";
+'use client';
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SheetDescription = exports.SheetTitle = exports.SheetFooter = exports.SheetBody = exports.SheetHeader = exports.SheetContent = exports.SheetClose = exports.SheetTrigger = exports.SheetOverlay = exports.SheetPortal = exports.SheetProvider = exports.Sheet = exports.useSheetContext = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const SheetPrimitive = __importStar(require("@radix-ui/react-dialog"));
+const class_variance_authority_1 = require("class-variance-authority");
+const lucide_react_1 = require("lucide-react");
+const utils_1 = require("../lib/utils");
+const SheetContext = React.createContext({
+    level: 0,
+    parentSheetWidth: undefined,
+    registerNestedSheet: () => { },
+    unregisterNestedSheet: () => { },
+    hasNestedSheetOpen: false,
+    nestedSheetWidth: undefined,
+});
+const useSheetContext = () => React.useContext(SheetContext);
+exports.useSheetContext = useSheetContext;
+// Sheet wrapper that provides context
+const SheetProvider = ({ children, width }) => {
+    const parentContext = (0, exports.useSheetContext)();
+    const [nestedSheetCount, setNestedSheetCount] = React.useState(0);
+    const registerNestedSheet = React.useCallback(() => {
+        setNestedSheetCount((count) => count + 1);
+    }, []);
+    const unregisterNestedSheet = React.useCallback(() => {
+        setNestedSheetCount((count) => Math.max(0, count - 1));
+    }, []);
+    const contextValue = React.useMemo(() => ({
+        level: parentContext.level + 1,
+        parentSheetWidth: width,
+        registerNestedSheet,
+        unregisterNestedSheet,
+        hasNestedSheetOpen: nestedSheetCount > 0,
+    }), [
+        parentContext.level,
+        width,
+        registerNestedSheet,
+        unregisterNestedSheet,
+        nestedSheetCount,
+    ]);
+    return ((0, jsx_runtime_1.jsx)(SheetContext.Provider, { value: contextValue, children: children }));
+};
+exports.SheetProvider = SheetProvider;
+const SheetRoot = ({ open, width, ...props }) => {
+    const parentContext = (0, exports.useSheetContext)();
+    // Register/unregister when open state changes
+    React.useEffect(() => {
+        if (open && parentContext.level > 0) {
+            parentContext.registerNestedSheet(width);
+            return () => {
+                parentContext.unregisterNestedSheet();
+            };
+        }
+        return undefined;
+    }, [open, parentContext, width]);
+    return (0, jsx_runtime_1.jsx)(SheetPrimitive.Root, { open: open, ...props });
+};
+const Sheet = SheetRoot;
+exports.Sheet = Sheet;
+const SheetTrigger = SheetPrimitive.Trigger;
+exports.SheetTrigger = SheetTrigger;
+const SheetClose = SheetPrimitive.Close;
+exports.SheetClose = SheetClose;
+const SheetPortal = SheetPrimitive.Portal;
+exports.SheetPortal = SheetPortal;
+const SheetOverlay = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)(SheetPrimitive.Overlay, { className: (0, utils_1.cn)('fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0', className), ...props, ref: ref })));
+exports.SheetOverlay = SheetOverlay;
+SheetOverlay.displayName = SheetPrimitive.Overlay.displayName;
+const sheetVariants = (0, class_variance_authority_1.cva)('fixed bg-background shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out bg-card flex flex-col', {
+    variants: {
+        side: {
+            top: 'inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top',
+            bottom: 'inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom',
+            left: 'inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm',
+            right: 'inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm',
+        },
+        zIndex: {
+            default: 'z-50',
+            high: 'z-[1100]',
+            pushed: 'z-[1150]', // Between high (1100) and nested overlay (1199)
+            nested: 'z-[1200]',
+        },
+    },
+    defaultVariants: {
+        side: 'right',
+        zIndex: 'default',
+    },
+});
+const SheetContent = React.forwardRef(({ side = 'right', zIndex = 'default', className, overlayClassName, hideCloseButton = false, sheetWidth, children, ...props }, ref) => {
+    // Read the parent context BEFORE potentially wrapping with SheetProvider
+    const parentContext = (0, exports.useSheetContext)();
+    // Track nested sheets for THIS sheet using local state
+    const [localNestedSheetCount, setLocalNestedSheetCount] = React.useState(0);
+    const [localNestedSheetWidth, setLocalNestedSheetWidth] = React.useState();
+    const closeTimeoutRef = React.useRef(null);
+    const registerLocalNestedSheet = React.useCallback((width) => {
+        // Clear any pending close timeout when opening a new nested sheet
+        if (closeTimeoutRef.current) {
+            clearTimeout(closeTimeoutRef.current);
+            closeTimeoutRef.current = null;
+        }
+        setLocalNestedSheetCount((count) => count + 1);
+        if (width) {
+            setLocalNestedSheetWidth(width);
+        }
+    }, []);
+    const unregisterLocalNestedSheet = React.useCallback(() => {
+        setLocalNestedSheetCount((count) => Math.max(0, count - 1));
+        setLocalNestedSheetWidth(undefined);
+        // Clear any existing timeout
+        if (closeTimeoutRef.current) {
+            clearTimeout(closeTimeoutRef.current);
+            closeTimeoutRef.current = null;
+        }
+    }, []);
+    // Cleanup timeout on unmount
+    React.useEffect(() => {
+        return () => {
+            if (closeTimeoutRef.current) {
+                clearTimeout(closeTimeoutRef.current);
+            }
+        };
+    }, []);
+    // This sheet should be pushed if IT has nested sheets open
+    const shouldBePushed = localNestedSheetCount > 0 && sheetWidth;
+    // Create a custom context value that uses THIS sheet's local nested sheet tracking
+    const customContextValue = React.useMemo(() => ({
+        level: parentContext.level + 1,
+        parentSheetWidth: sheetWidth,
+        registerNestedSheet: registerLocalNestedSheet,
+        unregisterNestedSheet: unregisterLocalNestedSheet,
+        hasNestedSheetOpen: localNestedSheetCount > 0,
+        nestedSheetWidth: localNestedSheetWidth,
+    }), [
+        parentContext.level,
+        sheetWidth,
+        registerLocalNestedSheet,
+        unregisterLocalNestedSheet,
+        localNestedSheetCount,
+        localNestedSheetWidth,
+    ]);
+    // Wrap children with context provider if sheetWidth is provided
+    const wrappedChildren = sheetWidth ? ((0, jsx_runtime_1.jsx)(SheetContext.Provider, { value: customContextValue, children: children })) : (children);
+    // Determine z-index based on nesting level AND pushed state
+    // A sheet is nested if its parent level >= 1 (meaning it's inside another sheet)
+    let effectiveZIndex = parentContext.level >= 1 ? 'nested' : zIndex;
+    const isNestedSheet = parentContext.level >= 1;
+    // When pushed, keep the same z-index (it will be under nested sheet's overlay anyway)
+    // Don't change z-index when pushed - the nested overlay (z-1199) will be above this (z-1100)
+    // Calculate overlay z-index
+    const overlayZIndex = effectiveZIndex === 'nested'
+        ? 1199
+        : effectiveZIndex === 'high'
+            ? 1099
+            : 50;
+    // Animation timing classes
+    const animationClasses = 'data-[state=closed]:duration-300 data-[state=open]:duration-500';
+    // Calculate transform for pushed state
+    // Strategy: During close, parent slides back at same speed as nested slides out
+    // Both travel in the positive direction (to the right) so they stick together
+    const transformStyle = shouldBePushed && localNestedSheetWidth
+        ? {
+            // Opening: animate to pushed position (move left)
+            transform: `translate3d(-${localNestedSheetWidth}, 0, 0)`,
+            transition: 'transform 500ms linear',
+        }
+        : {
+            // Closing: animate back to center (move right)
+            transform: 'translate3d(0, 0, 0)',
+            transition: 'transform 300ms linear',
+        };
+    const inlineStyle = {
+        ...transformStyle,
+        // Force GPU acceleration for both sheets to ensure smooth, synchronized animations
+        willChange: 'transform',
+        // For nested sheets, override animation timing to linear
+        ...(isNestedSheet && {
+            animationTimingFunction: 'linear',
+        }),
+    };
+    // Debug logging
+    // console.log('📊 Sheet render:', {
+    //   level: parentContext.level,
+    //   hasNestedSheetOpen: parentContext.hasNestedSheetOpen,
+    //   parentSheetWidth: parentContext.parentSheetWidth,
+    //   shouldBePushed,
+    //   effectiveZIndex,
+    //   overlayZIndex,
+    //   sheetWidth,
+    // });
+    return ((0, jsx_runtime_1.jsxs)(SheetPortal, { children: [!shouldBePushed && !localNestedSheetWidth && ((0, jsx_runtime_1.jsx)(SheetOverlay, { className: overlayClassName, style: { zIndex: overlayZIndex } })), (0, jsx_runtime_1.jsxs)(SheetPrimitive.Content, { ref: ref, className: (0, utils_1.cn)(sheetVariants({ side, zIndex: effectiveZIndex }), animationClasses, shouldBePushed && 'pointer-events-none', className), style: inlineStyle, ...props, children: [wrappedChildren, !hideCloseButton && ((0, jsx_runtime_1.jsxs)(SheetPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.X, { className: "h-4 w-4" }), (0, jsx_runtime_1.jsx)("span", { className: "sr-only", children: "Close" })] }))] })] }));
+});
+exports.SheetContent = SheetContent;
+SheetContent.displayName = SheetPrimitive.Content.displayName;
+const SheetHeader = ({ className, ...props }) => ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('flex flex-shrink-0 flex-col space-y-2 px-fds-xl py-fds-xl', className), ...props }));
+exports.SheetHeader = SheetHeader;
+SheetHeader.displayName = 'SheetHeader';
+const SheetBody = ({ className, ...props }) => ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('flex-1 overflow-y-auto px-fds-xl', className), ...props }));
+exports.SheetBody = SheetBody;
+SheetBody.displayName = 'SheetBody';
+const SheetFooter = ({ className, ...props }) => ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('flex-shrink-0 border-t border-fds-gray-20 px-fds-xl py-fds-xl', className), ...props }));
+exports.SheetFooter = SheetFooter;
+SheetFooter.displayName = 'SheetFooter';
+const SheetTitle = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)(SheetPrimitive.Title, { ref: ref, className: (0, utils_1.cn)('text-fds-h3 font-fds-bold', className), ...props })));
+exports.SheetTitle = SheetTitle;
+SheetTitle.displayName = SheetPrimitive.Title.displayName;
+const SheetDescription = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)(SheetPrimitive.Description, { ref: ref, className: (0, utils_1.cn)('text-sm text-muted-foreground', className), ...props })));
+exports.SheetDescription = SheetDescription;
+SheetDescription.displayName = SheetPrimitive.Description.displayName;

package/dist/cjs/components/skeleton.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Skeleton = Skeleton;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const utils_1 = require("../lib/utils");
+function Skeleton({ className, ...props }) {
+    return ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)("animate-pulse rounded-md bg-muted", className), ...props }));
+}