@techsio/ui-kit 0.41.2 → 0.42.0

package/dist/stories/molecules/drawer.stories.d.ts

@@ -0,0 +1,158 @@
+import type { StoryObj } from "@storybook/react";
+import { type DrawerRootProps } from "../../src/molecules/drawer.js";
+type DrawerStoryArgs = Omit<DrawerRootProps, "children"> & {
+    draggable: boolean;
+    triggerLabel: string;
+};
+declare function DrawerStory({ draggable, triggerLabel, ...rootProps }: DrawerStoryArgs): import("react/jsx-runtime").JSX.Element;
+declare const meta: {
+    title: string;
+    component: typeof DrawerStory;
+    tags: string[];
+    parameters: {
+        layout: string;
+        docs: {
+            description: {
+                component: string;
+            };
+        };
+    };
+    argTypes: {
+        placement: {
+            control: "select";
+            options: string[];
+            description: string;
+            table: {
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
+        size: {
+            control: "select";
+            options: string[];
+            description: string;
+            table: {
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
+        modal: {
+            control: "boolean";
+            description: string;
+            table: {
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
+        draggable: {
+            control: "boolean";
+            description: string;
+            table: {
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
+        closeOnEscape: {
+            control: "boolean";
+            description: string;
+            table: {
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
+        closeOnInteractOutside: {
+            control: "boolean";
+            description: string;
+            table: {
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
+        preventScroll: {
+            control: "boolean";
+            description: string;
+            table: {
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
+        trapFocus: {
+            control: "boolean";
+            description: string;
+            table: {
+                defaultValue: {
+                    summary: string;
+                };
+            };
+        };
+        triggerLabel: {
+            control: "text";
+            description: string;
+        };
+        ids: {
+            table: {
+                disable: true;
+            };
+        };
+        initialFocusEl: {
+            table: {
+                disable: true;
+            };
+        };
+        finalFocusEl: {
+            table: {
+                disable: true;
+            };
+        };
+        getRootNode: {
+            table: {
+                disable: true;
+            };
+        };
+        stack: {
+            table: {
+                disable: true;
+            };
+        };
+        onOpenChange: {
+            control: false;
+        };
+        onSnapPointChange: {
+            control: false;
+        };
+        onTriggerValueChange: {
+            control: false;
+        };
+    };
+    args: {
+        closeOnEscape: true;
+        closeOnInteractOutside: true;
+        draggable: true;
+        modal: true;
+        onOpenChange: import("storybook/test").Mock<(...args: any[]) => any>;
+        placement: "end";
+        preventScroll: true;
+        size: "md";
+        trapFocus: true;
+        triggerLabel: string;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Playground: Story;
+export declare const Placements: Story;
+export declare const Sizes: Story;
+export declare const SnapPointsAndSwipe: Story;
+export declare const Controlled: Story;
+export declare const MultipleTriggers: Story;
+export declare const CustomContainer: Story;
+export declare const NonModal: Story;
+export declare const Stack: Story;
+//# sourceMappingURL=drawer.stories.d.ts.map

package/dist/stories/molecules/drawer.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer.stories.d.ts","sourceRoot":"","sources":["../../../stories/molecules/drawer.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAKtD,OAAO,EAIL,KAAK,eAAe,EAErB,MAAM,4BAA4B,CAAA;AA6DnC,KAAK,eAAe,GAAG,IAAI,CAAC,eAAe,EAAE,UAAU,CAAC,GAAG;IACzD,SAAS,EAAE,OAAO,CAAA;IAClB,YAAY,EAAE,MAAM,CAAA;CACrB,CAAA;AAED,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,YAAY,EACZ,GAAG,SAAS,EACb,EAAE,eAAe,2CAejB;AAED,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiF0B,CAAA;AAEpC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,UAAU,EAAE,KAAU,CAAA;AASnC,eAAO,MAAM,UAAU,EAAE,KAqBxB,CAAA;AAID,eAAO,MAAM,KAAK,EAAE,KAqBnB,CAAA;AAED,eAAO,MAAM,kBAAkB,EAAE,KAiDhC,CAAA;AAgCD,eAAO,MAAM,UAAU,EAAE,KAGxB,CAAA;AAyCD,eAAO,MAAM,gBAAgB,EAAE,KAG9B,CAAA;AAqCD,eAAO,MAAM,eAAe,EAAE,KAQ7B,CAAA;AAoCD,eAAO,MAAM,QAAQ,EAAE,KAGtB,CAAA;AAmCD,eAAO,MAAM,KAAK,EAAE,KAGnB,CAAA"}

package/dist/stories/organisms/sidebar.stories.d.ts

@@ -0,0 +1,66 @@
+import type { StoryObj } from "@storybook/react";
+import { Sidebar } from "../../src/organisms/sidebar.js";
+declare const meta: {
+    title: string;
+    component: typeof Sidebar;
+    tags: string[];
+    parameters: {
+        layout: string;
+        docs: {
+            description: {
+                component: string;
+            };
+        };
+    };
+    args: {
+        defaultExpanded: "start"[];
+        dir: "ltr";
+        onExpandedChange: import("storybook/test").Mock<(...args: any[]) => any>;
+        onMobileOpenChange: import("storybook/test").Mock<(...args: any[]) => any>;
+    };
+    argTypes: {
+        defaultExpanded: {
+            control: false;
+        };
+        dir: {
+            control: "inline-radio";
+            options: string[];
+        };
+        defaultMobileOpen: {
+            control: false;
+        };
+        collapsible: {
+            control: false;
+        };
+        expanded: {
+            control: false;
+        };
+        id: {
+            control: false;
+        };
+        mobileOpen: {
+            control: false;
+        };
+        onExpandedChange: {
+            control: false;
+        };
+        onMobileOpenChange: {
+            control: false;
+        };
+        ref: {
+            control: false;
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Playground: Story;
+export declare const ControlledOffcanvas: Story;
+export declare const BreakpointFocusTransfer: Story;
+export declare const IconCollapseSidebar07: Story;
+export declare const TwoPaneSidebar09: Story;
+export declare const RightSidebar14: Story;
+export declare const LeftAndRightSidebar15: Story;
+export declare const LogicalEdgesRtl: Story;
+export declare const StickySiteHeaderSidebar16: Story;
+//# sourceMappingURL=sidebar.stories.d.ts.map

package/dist/stories/organisms/sidebar.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar.stories.d.ts","sourceRoot":"","sources":["../../../stories/organisms/sidebar.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAUtD,OAAO,EACL,OAAO,EAER,MAAM,6BAA6B,CAAA;AAqPpC,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkCsB,CAAA;AAEhC,eAAe,IAAI,CAAA;AAEnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,UAAU,EAAE,KA2BxB,CAAA;AAgCD,eAAO,MAAM,mBAAmB,EAAE,KAIjC,CAAA;AAkFD,eAAO,MAAM,uBAAuB,EAAE,KAYrC,CAAA;AAED,eAAO,MAAM,qBAAqB,EAAE,KAWnC,CAAA;AA8HD,eAAO,MAAM,gBAAgB,EAAE,KAQ9B,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAe5B,CAAA;AAsBD,eAAO,MAAM,qBAAqB,EAAE,KAmBnC,CAAA;AAED,eAAO,MAAM,eAAe,EAAE,KAoB7B,CAAA;AAcD,eAAO,MAAM,yBAAyB,EAAE,KA0BvC,CAAA"}

package/dist/test/drawer.behavior.spec.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=drawer.behavior.spec.d.ts.map

package/dist/test/drawer.behavior.spec.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer.behavior.spec.d.ts","sourceRoot":"","sources":["../../test/drawer.behavior.spec.ts"],"names":[],"mappings":""}

package/dist/test/sidebar.behavior.spec.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=sidebar.behavior.spec.d.ts.map

package/dist/test/sidebar.behavior.spec.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar.behavior.spec.d.ts","sourceRoot":"","sources":["../../test/sidebar.behavior.spec.ts"],"names":[],"mappings":""}

package/dist/test/sidebar.ssr.bun.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=sidebar.ssr.bun.d.ts.map

package/dist/test/sidebar.ssr.bun.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar.ssr.bun.d.ts","sourceRoot":"","sources":["../../test/sidebar.ssr.bun.tsx"],"names":[],"mappings":""}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@techsio/ui-kit",
-  "version": "0.41.2",
+  "version": "0.42.0",
   "license": "MIT",
   "type": "module",
   "repository": {
@@ -74,6 +74,7 @@
     "storybook:a11y": "bash scripts/storybook-a11y.sh",
     "test:components": "node scripts/run-component-tests.mjs",
     "test:components:update": "node scripts/run-component-tests.mjs --update-snapshots",
+    "test:sidebar:ssr": "bun test ./test/sidebar.ssr.bun.tsx",
     "lint:tailwind": "eslint \"**/*.{js,jsx,ts,tsx}\" --config eslint.config.js",
     "lint:tailwind:fix": "eslint \"**/*.{js,jsx,ts,tsx}\" --config eslint.config.js --fix",
     "prepare": "node -e \"if (!process.env.RSLIB_CHECK_OUTPUT) require('node:child_process').execSync('pnpm build', { stdio: 'inherit' })\"",
@@ -97,27 +98,29 @@
     "@tanstack/react-charts": "^0.6.5",
     "@tanstack/react-table": "^9.1.2",
     "@tanstack/react-virtual": "^3.14.8",
-    "@zag-js/accordion": "^1.41.2",
-    "@zag-js/carousel": "^1.41.2",
-    "@zag-js/checkbox": "^1.41.2",
-    "@zag-js/combobox": "^1.41.2",
-    "@zag-js/dialog": "^1.41.2",
-    "@zag-js/i18n-utils": "^1.41.2",
-    "@zag-js/menu": "^1.41.2",
-    "@zag-js/number-input": "^1.41.2",
-    "@zag-js/pagination": "^1.41.2",
-    "@zag-js/popover": "^1.41.2",
-    "@zag-js/radio-group": "^1.41.2",
-    "@zag-js/rating-group": "^1.41.2",
-    "@zag-js/react": "^1.41.2",
-    "@zag-js/select": "^1.41.2",
-    "@zag-js/slider": "^1.41.2",
-    "@zag-js/steps": "^1.41.2",
-    "@zag-js/switch": "^1.41.2",
-    "@zag-js/tabs": "^1.41.2",
-    "@zag-js/toast": "^1.41.2",
-    "@zag-js/tooltip": "^1.41.2",
-    "@zag-js/tree-view": "^1.41.2",
+    "@zag-js/accordion": "1.43.3",
+    "@zag-js/carousel": "1.43.3",
+    "@zag-js/checkbox": "1.43.3",
+    "@zag-js/combobox": "1.43.3",
+    "@zag-js/dialog": "1.43.3",
+    "@zag-js/drawer": "1.43.3",
+    "@zag-js/i18n-utils": "1.43.3",
+    "@zag-js/menu": "1.43.3",
+    "@zag-js/number-input": "1.43.3",
+    "@zag-js/pagination": "1.43.3",
+    "@zag-js/popover": "1.43.3",
+    "@zag-js/presence": "1.43.3",
+    "@zag-js/radio-group": "1.43.3",
+    "@zag-js/rating-group": "1.43.3",
+    "@zag-js/react": "1.43.3",
+    "@zag-js/select": "1.43.3",
+    "@zag-js/slider": "1.43.3",
+    "@zag-js/steps": "1.43.3",
+    "@zag-js/switch": "1.43.3",
+    "@zag-js/tabs": "1.43.3",
+    "@zag-js/toast": "1.43.3",
+    "@zag-js/tooltip": "1.43.3",
+    "@zag-js/tree-view": "1.43.3",
     "better-themes": "^1.1.0",
     "d3-scale": "^4.0.2",
     "d3-shape": "^3.2.0",

package/src/tokens/components/components.css

@@ -23,6 +23,7 @@
 @import "./molecules/_color-select.css";
 @import "./molecules/_combobox.css";
 @import "./molecules/_dialog.css";
+@import "./molecules/_drawer.css";
 @import "./molecules/_pagination.css";
 @import "./molecules/_popover.css";
 @import "./molecules/_radio-card.css";
@@ -43,3 +44,4 @@
 @import "./organisms/_footer.css";
 @import "./organisms/_header.css";
 @import "./organisms/_gallery.css";
+@import "./organisms/_sidebar.css";