@dust-tt/sparkle 0.2.509 → 0.2.511

package/dist/esm/stories/Separator.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Separator.stories.js","sourceRoot":"","sources":["../../../src/stories/Separator.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,SAAS,EAAE,MAAM,6BAA6B,CAAC;AAExD,IAAM,IAAI,GAAG;IACX,KAAK,EAAE,sBAAsB;IAC7B,SAAS,EAAE,SAAS;CACY,CAAC;AAEnC,eAAe,IAAI,CAAC;AAEpB,MAAM,CAAC,IAAM,gBAAgB,GAAG,cAAM,OAAA,CACpC;IACE,6BAAK,SAAS,EAAC,aAAa;QAC1B,4BAAI,SAAS,EAAC,wCAAwC,qBAAoB;QAC1E,2BAAG,SAAS,EAAC,mCAAmC,iFAG5C,CACA;IACN,oBAAC,SAAS,IAAC,SAAS,EAAC,QAAQ,GAAG;IAChC,6BAAK,SAAS,EAAC,mDAAmD;QAChE,wCAAe;QACf,oBAAC,SAAS,IAAC,WAAW,EAAC,UAAU,GAAG;QACpC,6CAAoB;QACpB,oBAAC,SAAS,IAAC,WAAW,EAAC,UAAU,GAAG;QACpC,wCAAe,CACX,CACF,CACP,EAlBqC,CAkBrC,CAAC"}

package/dist/esm/stories/Shadows.stories.d.ts

@@ -0,0 +1,12 @@
+import type { StoryObj } from "@storybook/react";
+declare const meta: {
+    title: string;
+    parameters: {
+        layout: string;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const BoxShadows: Story;
+export declare const DropShadows: Story;
+//# sourceMappingURL=Shadows.stories.d.ts.map

package/dist/esm/stories/Shadows.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Shadows.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/Shadows.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAGvD,QAAA,MAAM,IAAI;;;;;CAKM,CAAC;AAEjB,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAmBnC,eAAO,MAAM,UAAU,EAAE,KAaxB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAczB,CAAC"}

package/dist/esm/stories/Shadows.stories.js

@@ -0,0 +1,36 @@
+import React from "react";
+var meta = {
+    title: "Theme/Shadows",
+    parameters: {
+        layout: "centered",
+    },
+};
+export default meta;
+var ShadowBox = function (_a) {
+    var label = _a.label, shadowClass = _a.shadowClass;
+    return (React.createElement("div", { className: "s-flex s-flex-col s-items-center s-gap-2" },
+        React.createElement("div", { className: "s-h-24 s-w-24 s-rounded-lg s-bg-white dark:s-bg-gray-800 ".concat(shadowClass) }),
+        React.createElement("span", { className: "s-text-sm s-text-gray-600 dark:s-text-gray-400" }, label)));
+};
+export var BoxShadows = {
+    render: function () { return (React.createElement("div", { className: "s-p-8" },
+        React.createElement("h2", { className: "s-mb-6 s-text-xl s-font-semibold" }, "Box Shadows"),
+        React.createElement("div", { className: "s-flex s-flex-wrap s-gap-8" },
+            React.createElement(ShadowBox, { label: "Default", shadowClass: "s-shadow" }),
+            React.createElement(ShadowBox, { label: "Medium", shadowClass: "s-shadow-md" }),
+            React.createElement(ShadowBox, { label: "Large", shadowClass: "s-shadow-lg" }),
+            React.createElement(ShadowBox, { label: "Extra Large", shadowClass: "s-shadow-xl" }),
+            React.createElement(ShadowBox, { label: "2XL", shadowClass: "s-shadow-2xl" })))); },
+};
+export var DropShadows = {
+    render: function () { return (React.createElement("div", { className: "s-p-8" },
+        React.createElement("h2", { className: "s-mb-6 s-text-xl s-font-semibold" }, "Drop Shadows"),
+        React.createElement("div", { className: "s-flex s-flex-wrap s-gap-8" },
+            React.createElement(ShadowBox, { label: "Default", shadowClass: "s-drop-shadow" }),
+            React.createElement(ShadowBox, { label: "Small", shadowClass: "s-drop-shadow-sm" }),
+            React.createElement(ShadowBox, { label: "Medium", shadowClass: "s-drop-shadow-md" }),
+            React.createElement(ShadowBox, { label: "Large", shadowClass: "s-drop-shadow-lg" }),
+            React.createElement(ShadowBox, { label: "Extra Large", shadowClass: "s-drop-shadow-xl" }),
+            React.createElement(ShadowBox, { label: "2XL", shadowClass: "s-drop-shadow-2xl" })))); },
+};
+//# sourceMappingURL=Shadows.stories.js.map

package/dist/esm/stories/Shadows.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Shadows.stories.js","sourceRoot":"","sources":["../../../src/stories/Shadows.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,IAAM,IAAI,GAAG;IACX,KAAK,EAAE,eAAe;IACtB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;KACnB;CACa,CAAC;AAEjB,eAAe,IAAI,CAAC;AAGpB,IAAM,SAAS,GAAG,UAAC,EAMlB;QALC,KAAK,WAAA,EACL,WAAW,iBAAA;IAIP,OAAA,CACJ,6BAAK,SAAS,EAAC,0CAA0C;QACvD,6BACE,SAAS,EAAE,mEAA4D,WAAW,CAAE,GACpF;QACF,8BAAM,SAAS,EAAC,gDAAgD,IAC7D,KAAK,CACD,CACH,CACP;AATK,CASL,CAAC;AAEF,MAAM,CAAC,IAAM,UAAU,GAAU;IAC/B,MAAM,EAAE,cAAM,OAAA,CACZ,6BAAK,SAAS,EAAC,OAAO;QACpB,4BAAI,SAAS,EAAC,kCAAkC,kBAAiB;QACjE,6BAAK,SAAS,EAAC,4BAA4B;YACzC,oBAAC,SAAS,IAAC,KAAK,EAAC,SAAS,EAAC,WAAW,EAAC,UAAU,GAAG;YACpD,oBAAC,SAAS,IAAC,KAAK,EAAC,QAAQ,EAAC,WAAW,EAAC,aAAa,GAAG;YACtD,oBAAC,SAAS,IAAC,KAAK,EAAC,OAAO,EAAC,WAAW,EAAC,aAAa,GAAG;YACrD,oBAAC,SAAS,IAAC,KAAK,EAAC,aAAa,EAAC,WAAW,EAAC,aAAa,GAAG;YAC3D,oBAAC,SAAS,IAAC,KAAK,EAAC,KAAK,EAAC,WAAW,EAAC,cAAc,GAAG,CAChD,CACF,CACP,EAXa,CAWb;CACF,CAAC;AAEF,MAAM,CAAC,IAAM,WAAW,GAAU;IAChC,MAAM,EAAE,cAAM,OAAA,CACZ,6BAAK,SAAS,EAAC,OAAO;QACpB,4BAAI,SAAS,EAAC,kCAAkC,mBAAkB;QAClE,6BAAK,SAAS,EAAC,4BAA4B;YACzC,oBAAC,SAAS,IAAC,KAAK,EAAC,SAAS,EAAC,WAAW,EAAC,eAAe,GAAG;YACzD,oBAAC,SAAS,IAAC,KAAK,EAAC,OAAO,EAAC,WAAW,EAAC,kBAAkB,GAAG;YAC1D,oBAAC,SAAS,IAAC,KAAK,EAAC,QAAQ,EAAC,WAAW,EAAC,kBAAkB,GAAG;YAC3D,oBAAC,SAAS,IAAC,KAAK,EAAC,OAAO,EAAC,WAAW,EAAC,kBAAkB,GAAG;YAC1D,oBAAC,SAAS,IAAC,KAAK,EAAC,aAAa,EAAC,WAAW,EAAC,kBAAkB,GAAG;YAChE,oBAAC,SAAS,IAAC,KAAK,EAAC,KAAK,EAAC,WAAW,EAAC,mBAAmB,GAAG,CACrD,CACF,CACP,EAZa,CAYb;CACF,CAAC"}

package/dist/esm/stories/Sheet.stories.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+declare const meta: {
+    title: string;
+};
+export default meta;
+export declare function Demo(): React.JSX.Element;
+export declare function SheetDemo(): React.JSX.Element;
+export declare function ContentDemo(): React.JSX.Element;
+export declare function SheetCustom(): React.JSX.Element;
+export declare function SheetWithThreeButtons(): React.JSX.Element;
+export declare function SheetWithIconInTitle(): React.JSX.Element;
+//# sourceMappingURL=Sheet.stories.d.ts.map

package/dist/esm/stories/Sheet.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Sheet.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/Sheet.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAkC1B,QAAA,MAAM,IAAI;;CAEM,CAAC;AAEjB,eAAe,IAAI,CAAC;AAEpB,wBAAgB,IAAI,sBAQnB;AAED,wBAAgB,SAAS,sBA0BxB;AAED,wBAAgB,WAAW,sBAqB1B;AAED,wBAAgB,WAAW,sBA+D1B;AAgPD,wBAAgB,qBAAqB,sBAiCpC;AAED,wBAAgB,oBAAoB,sBA0BnC"}

package/dist/esm/stories/Sheet.stories.js

@@ -0,0 +1,286 @@
+import React from "react";
+import { Avatar, Button, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, Icon, Input, Page, Separator, Sheet, SheetContainer, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, TextArea, } from "../components";
+import { CloudArrowLeftRightIcon, FolderIcon, GlobeAltIcon, MoreIcon, PencilSquareIcon, RocketIcon, StarIcon, TrashIcon, } from "../icons/app";
+var meta = {
+    title: "Layouts/Sheet",
+};
+export default meta;
+export function Demo() {
+    return (React.createElement("div", { className: "s-flex s-flex-col s-gap-6" },
+        React.createElement(SheetDemo, null),
+        React.createElement(ContentDemo, null),
+        React.createElement(SheetCustom, null)));
+}
+export function SheetDemo() {
+    return (React.createElement("div", null,
+        React.createElement(Sheet, null,
+            React.createElement(SheetTrigger, { asChild: true },
+                React.createElement(Button, { variant: "outline", label: "Edit demo" })),
+            React.createElement(SheetContent, { side: "left" },
+                React.createElement(SheetHeader, { hideButton: true },
+                    React.createElement(SheetTitle, null, "About me")),
+                React.createElement(SheetContainer, null,
+                    React.createElement("div", { className: "s-flex s-flex-col s-gap-6" },
+                        React.createElement(Input, { label: "Firstname", placeholder: "John" }),
+                        React.createElement(Input, { label: "Lastname", placeholder: "Doe" }))),
+                React.createElement(SheetFooter, { sheetCloseClassName: "s-flex s-gap-2", leftButtonProps: { label: "Cancel", variant: "warning" }, rightButtonProps: { label: "Save", disabled: true } })))));
+}
+export function ContentDemo() {
+    return (React.createElement("div", null,
+        React.createElement(Sheet, null,
+            React.createElement(SheetTrigger, { asChild: true },
+                React.createElement(Button, { variant: "outline", label: "Content demo" })),
+            React.createElement(SheetContent, { size: "xl" },
+                React.createElement(SheetHeader, null,
+                    React.createElement(Page.Header, { icon: RocketIcon, title: React.createElement(React.Fragment, null, "Quick Guide for new members") })),
+                React.createElement(SheetContainer, null,
+                    React.createElement(QIG, null))))));
+}
+export function SheetCustom() {
+    var SimpleDropdownDemo = function () {
+        return (React.createElement(DropdownMenu, null,
+            React.createElement(DropdownMenuTrigger, { asChild: true },
+                React.createElement(Button, { icon: MoreIcon, onClick: function (event) {
+                        event.currentTarget.focus();
+                    } })),
+            React.createElement(DropdownMenuContent, { onCloseAutoFocus: function (event) {
+                    event.preventDefault();
+                } },
+                React.createElement(DropdownMenuItem, { label: "My Account" }),
+                React.createElement(DropdownMenuItem, { label: "Profile" }),
+                React.createElement(DropdownMenuItem, { label: "Billing" }),
+                React.createElement(DropdownMenuItem, { label: "Team" }),
+                React.createElement(DropdownMenuItem, { label: "Subscription" }))));
+    };
+    return (React.createElement("div", null,
+        React.createElement(Sheet, null,
+            React.createElement(SheetTrigger, { asChild: true },
+                React.createElement(Button, { "aria-hidden": "false", variant: "outline", label: "Agent Demo" })),
+            React.createElement(SheetContent, null,
+                React.createElement(SheetHeader, null,
+                    React.createElement("div", { className: "s-flex s-flex-col s-gap-2" },
+                        React.createElement(Avatar, { size: "md", name: "Aria Doe", visual: "https://dust.tt/static/droidavatar/Droid_Lime_3.jpg" }),
+                        React.createElement("div", { className: "s-flex s-flex-col s-gap-0" },
+                            React.createElement(SheetTitle, null, "@coucou"),
+                            React.createElement(SheetDescription, null, "The agent that allways says hello.")),
+                        React.createElement("div", { className: "s-flex s-gap-2" },
+                            React.createElement(Button, { icon: StarIcon, variant: "outline" }),
+                            React.createElement(Separator, { orientation: "vertical" }),
+                            React.createElement(Button, { icon: PencilSquareIcon, variant: "outline" }),
+                            React.createElement(Button, { icon: TrashIcon, variant: "outline" }),
+                            React.createElement(SimpleDropdownDemo, null)))),
+                React.createElement(SheetContainer, null,
+                    React.createElement(TextArea, null))))));
+}
+var QIG = function () { return (React.createElement("div", { className: "s-flex s-flex-col s-gap-5" },
+    React.createElement(Page.Horizontal, null,
+        React.createElement(Page.Vertical, null,
+            React.createElement(Page.H, null,
+                "\uD83D\uDC69\u200D\uD83C\uDFA8\uD83E\uDDB8\u200D\u2640\uFE0F\uD83E\uDD77\uD83E\uDDD1\u200D\uD83D\uDE80",
+                React.createElement("br", null),
+                " Why multiple",
+                React.createElement("br", null),
+                " Agents?"),
+            React.createElement(Page.P, null,
+                "The basic agent is",
+                " ",
+                React.createElement("span", { className: "font-bold text-success-500" }, "@gpt4"),
+                ". It is a raw model. \u201CRaw\u201D means it does not have particular instructions or access to knowledge."),
+            React.createElement(Page.P, null,
+                "You also have access to agents that use a raw model (gpt4 for instance), AND give them specific instructions and access to knowledge.",
+                " ",
+                React.createElement("span", { className: "font-bold" }, "They can answer specific questions, really well.")),
+            React.createElement(Page.P, null, "Agents can be provided by Dust, by your company (Company agent), by s your coworkers (Shared agents).")),
+        React.createElement(Page.Vertical, null,
+            React.createElement(Page.H, null,
+                "\uD83D\uDEE0\uFE0F",
+                React.createElement("br", null),
+                "How to make",
+                React.createElement("br", null),
+                "an Agent?"),
+            React.createElement(Page.P, null, "You can build agents!"),
+            React.createElement(Page.P, null, "Agents start with an \u201Cinstruction\u201D. A simple text, explaining what you want them to do."),
+            React.createElement(Page.P, null,
+                "For instance, ",
+                React.createElement("span", { className: "italic" }, "\u201CAct as a doctor\u201D"),
+                ",",
+                " ",
+                React.createElement("span", { className: "italic" }, "\u201CSummarise this document\u201D"),
+                ",",
+                " ",
+                React.createElement("span", { className: "italic" }, "\u201CWhat do you know about X\u201D"),
+                "."),
+            React.createElement(Page.P, null,
+                "You can give them access to knowledge.",
+                React.createElement("br", null),
+                "We call them ",
+                React.createElement("span", { className: "font-bold" }, "Data sources.")),
+            React.createElement(Page.P, null,
+                "With the right Data source, agents can answer demands like",
+                React.createElement("span", { className: "italic" }, "\u201CHave we been working with company X\u201D"),
+                ", ",
+                React.createElement("span", { className: "italic" }, "\u201CHow do we manage expenses\u201D"),
+                ",",
+                " ",
+                React.createElement("span", { className: "italic" }, "\u201CWrite an intro email using the company tone of voice\u201D...")))),
+    React.createElement(Page.Vertical, null,
+        React.createElement(Page.H, null,
+            "\uD83D\uDCDA",
+            React.createElement("br", null),
+            "What are",
+            React.createElement("br", null),
+            "Data sources?"),
+        React.createElement(Page.P, null,
+            "To augment your agents with knowledge, you give them data.",
+            React.createElement("br", null),
+            " Data can come in different ways in Dust.",
+            " ",
+            React.createElement("span", { className: "font-bold" }, "Here are the three main ways:")),
+        React.createElement(Page.Horizontal, null,
+            React.createElement(Page.Vertical, { sizing: "grow" },
+                React.createElement("div", { className: "flex items-center gap-2" },
+                    React.createElement(Icon, { visual: CloudArrowLeftRightIcon }),
+                    " ",
+                    React.createElement(Page.H, { variant: "h6" }, "Connections")),
+                React.createElement(Page.P, null, "Notion, Slack, Google Drive... Dust can connect to multiple platforms and synchronize your data.")),
+            React.createElement(Page.Vertical, { sizing: "grow" },
+                React.createElement(Page.Horizontal, null,
+                    React.createElement("div", { className: "flex items-center gap-2" },
+                        React.createElement(Icon, { visual: FolderIcon }),
+                        " ",
+                        React.createElement(Page.H, { variant: "h6" }, "Folders"))),
+                React.createElement(Page.P, null, "Upload files (text, pdf, csv) directly in Dust.")),
+            React.createElement(Page.Vertical, { sizing: "grow" },
+                React.createElement(Page.Horizontal, null,
+                    React.createElement("div", { className: "flex items-center gap-2" },
+                        React.createElement(Icon, { visual: GlobeAltIcon }),
+                        " ",
+                        React.createElement(Page.H, { variant: "h6" }, "Websites"))),
+                React.createElement(Page.P, null, "Any public website can be synced in Dust. Think FAQ, Wikipedia pages, documentation...")))),
+    React.createElement(Page.Vertical, { sizing: "grow" },
+        React.createElement(Page.H, null,
+            "\uD83D\uDC4B ",
+            React.createElement("br", null),
+            "Hello ",
+            React.createElement("br", null),
+            " ",
+            React.createElement("span", { className: "text-success-500" }, "@mentions")),
+        React.createElement(Page.P, null, "In Dust, you won't find just one AI agent, but multiple ones."),
+        React.createElement(Page.P, null, "You can call any agent at any time by typing \u201C@\u201D and the name of the agent.")),
+    React.createElement(Page.Horizontal, null,
+        React.createElement(Page.Vertical, null,
+            React.createElement(Page.H, null,
+                "\uD83D\uDC69\u200D\uD83C\uDFA8\uD83E\uDDB8\u200D\u2640\uFE0F\uD83E\uDD77\uD83E\uDDD1\u200D\uD83D\uDE80",
+                React.createElement("br", null),
+                " Why multiple",
+                React.createElement("br", null),
+                " agents?"),
+            React.createElement(Page.P, null,
+                "The basic agent is",
+                " ",
+                React.createElement("span", { className: "font-bold text-success-500" }, "@gpt4"),
+                ". It is a raw model. \u201CRaw\u201D means it does not have particular instructions or access to knowledge."),
+            React.createElement(Page.P, null,
+                "You also have access to agents that use a raw model (gpt4 for instance), AND give them specific instructions and access to knowledge.",
+                " ",
+                React.createElement("span", { className: "font-bold" }, "They can answer specific questions, really well.")),
+            React.createElement(Page.P, null, "Agents can be provided by Dust, by your company (Company agents), by your coworkers (Shared agent).")),
+        React.createElement(Page.Vertical, null,
+            React.createElement(Page.H, null,
+                "\uD83D\uDEE0\uFE0F",
+                React.createElement("br", null),
+                "How to make",
+                React.createElement("br", null),
+                "an agent?"),
+            React.createElement(Page.P, null, "You can build agents!"),
+            React.createElement(Page.P, null, "Assistants start with an \u201Cinstruction\u201D. A simple text, explaining what you want them to do."),
+            React.createElement(Page.P, null,
+                "For instance, ",
+                React.createElement("span", { className: "italic" }, "\u201CAct as a doctor\u201D"),
+                ",",
+                " ",
+                React.createElement("span", { className: "italic" }, "\u201CSummarise this document\u201D"),
+                ",",
+                " ",
+                React.createElement("span", { className: "italic" }, "\u201CWhat do you know about X\u201D"),
+                "."),
+            React.createElement(Page.P, null,
+                "You can give them access to knowledge.",
+                React.createElement("br", null),
+                "We call them ",
+                React.createElement("span", { className: "font-bold" }, "Data sources.")),
+            React.createElement(Page.P, null,
+                "With the right Data source, agents can answer demands like",
+                React.createElement("span", { className: "italic" }, "\u201CHave we been working with company X\u201D"),
+                ", ",
+                React.createElement("span", { className: "italic" }, "\u201CHow do we manage expenses\u201D"),
+                ",",
+                " ",
+                React.createElement("span", { className: "italic" }, "\u201CWrite an intro email using the company tone of voice\u201D...")))),
+    React.createElement(Page.Vertical, null,
+        React.createElement(Page.H, null,
+            "\uD83D\uDCDA",
+            React.createElement("br", null),
+            "What are",
+            React.createElement("br", null),
+            "Data sources?"),
+        React.createElement(Page.P, null,
+            "To augment your agents with knowledge, you give them data.",
+            React.createElement("br", null),
+            " Data can come in different ways in Dust.",
+            " ",
+            React.createElement("span", { className: "font-bold" }, "Here are the three main ways:")),
+        React.createElement(Page.Horizontal, null,
+            React.createElement(Page.Vertical, { sizing: "grow" },
+                React.createElement("div", { className: "flex items-center gap-2" },
+                    React.createElement(Icon, { visual: CloudArrowLeftRightIcon }),
+                    " ",
+                    React.createElement(Page.H, { variant: "h6" }, "Connections")),
+                React.createElement(Page.P, null, "Notion, Slack, Google Drive... Dust can connect to multiple platforms and synchronize your data.")),
+            React.createElement(Page.Vertical, { sizing: "grow" },
+                React.createElement(Page.Horizontal, null,
+                    React.createElement("div", { className: "flex items-center gap-2" },
+                        React.createElement(Icon, { visual: FolderIcon }),
+                        " ",
+                        React.createElement(Page.H, { variant: "h6" }, "Folders"))),
+                React.createElement(Page.P, null, "Upload files (text, pdf, csv) directly in Dust.")),
+            React.createElement(Page.Vertical, { sizing: "grow" },
+                React.createElement(Page.Horizontal, null,
+                    React.createElement("div", { className: "flex items-center gap-2" },
+                        React.createElement(Icon, { visual: GlobeAltIcon }),
+                        " ",
+                        React.createElement(Page.H, { variant: "h6" }, "Websites"))),
+                React.createElement(Page.P, null, "Any public website can be synced in Dust. Think FAQ, Wikipedia pages, documentation...")))))); };
+export function SheetWithThreeButtons() {
+    return (React.createElement("div", null,
+        React.createElement(Sheet, null,
+            React.createElement(SheetTrigger, { asChild: true },
+                React.createElement(Button, { variant: "outline", label: "Three Button Demo" })),
+            React.createElement(SheetContent, null,
+                React.createElement(SheetHeader, null,
+                    React.createElement(SheetTitle, null, "Sheet with Three Buttons"),
+                    React.createElement(SheetDescription, null, "Example of SheetFooter with three buttons")),
+                React.createElement(SheetContainer, null,
+                    React.createElement("div", { className: "s-flex s-flex-col s-gap-6" },
+                        React.createElement(Input, { label: "Example Input", placeholder: "Type something..." }))),
+                React.createElement(SheetFooter, { sheetCloseClassName: "s-flex s-gap-2", leftButtonProps: { label: "Cancel", variant: "warning" }, rightButtonProps: { label: "Save", variant: "primary" }, rightEndButtonProps: {
+                        label: "Delete",
+                        variant: "warning",
+                        icon: TrashIcon,
+                    } })))));
+}
+export function SheetWithIconInTitle() {
+    return (React.createElement("div", null,
+        React.createElement(Sheet, null,
+            React.createElement(SheetTrigger, { asChild: true },
+                React.createElement(Button, { variant: "outline", label: "Edit demo" })),
+            React.createElement(SheetContent, { side: "left" },
+                React.createElement(SheetHeader, { hideButton: true },
+                    React.createElement(SheetTitle, { icon: RocketIcon }, "About me")),
+                React.createElement(SheetContainer, null,
+                    React.createElement("div", { className: "s-flex s-flex-col s-gap-6" },
+                        React.createElement(Input, { label: "Firstname", placeholder: "John" }),
+                        React.createElement(Input, { label: "Lastname", placeholder: "Doe" }))),
+                React.createElement(SheetFooter, { sheetCloseClassName: "s-flex s-gap-2", leftButtonProps: { label: "Cancel", variant: "warning" }, rightButtonProps: { label: "Save", disabled: true } })))));
+}
+//# sourceMappingURL=Sheet.stories.js.map

package/dist/esm/stories/Sheet.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Sheet.stories.js","sourceRoot":"","sources":["../../../src/stories/Sheet.stories.tsx"],"names":[],"mappings":"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"}

package/dist/esm/stories/SliderToggle.stories.d.ts

@@ -0,0 +1,12 @@
+import type { StoryObj } from "@storybook/react";
+import React from "react";
+import { SliderToggle } from "../index_with_tw_base";
+declare const meta: {
+    title: string;
+    component: typeof SliderToggle;
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const SliderToggleBasic: Story;
+export declare const SliderExample: () => React.JSX.Element;
+//# sourceMappingURL=SliderToggle.stories.d.ts.map

package/dist/esm/stories/SliderToggle.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SliderToggle.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/SliderToggle.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAU,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAE7D,QAAA,MAAM,IAAI;;;CAG2B,CAAC;AAEtC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,iBAAiB,EAAE,KAI/B,CAAC;AAEF,eAAO,MAAM,aAAa,yBAgBzB,CAAC"}

package/dist/esm/stories/SliderToggle.stories.js

@@ -0,0 +1,24 @@
+import React from "react";
+import { Button, SliderToggle } from "../index_with_tw_base";
+var meta = {
+    title: "Primitives/SliderToggle",
+    component: SliderToggle,
+};
+export default meta;
+export var SliderToggleBasic = {
+    args: {
+        selected: false,
+    },
+};
+export var SliderExample = function () { return (React.createElement("div", { className: "s-flex s-flex-col s-gap-6" },
+    React.createElement("div", { className: "s-flex s-items-center s-gap-2" },
+        React.createElement(Button, { variant: "outline", size: "sm", label: "Settings" }),
+        React.createElement(SliderToggle, { size: "sm" }),
+        React.createElement(SliderToggle, { size: "sm", selected: true }),
+        React.createElement(SliderToggle, { size: "sm", disabled: true })),
+    React.createElement("div", { className: "s-flex s-items-center s-gap-2" },
+        React.createElement(Button, { variant: "outline", size: "xs", label: "Settings" }),
+        React.createElement(SliderToggle, { size: "xs" }),
+        React.createElement(SliderToggle, { size: "xs", selected: true }),
+        React.createElement(SliderToggle, { size: "xs", disabled: true })))); };
+//# sourceMappingURL=SliderToggle.stories.js.map

package/dist/esm/stories/SliderToggle.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SliderToggle.stories.js","sourceRoot":"","sources":["../../../src/stories/SliderToggle.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAE7D,IAAM,IAAI,GAAG;IACX,KAAK,EAAE,yBAAyB;IAChC,SAAS,EAAE,YAAY;CACY,CAAC;AAEtC,eAAe,IAAI,CAAC;AAGpB,MAAM,CAAC,IAAM,iBAAiB,GAAU;IACtC,IAAI,EAAE;QACJ,QAAQ,EAAE,KAAK;KAChB;CACF,CAAC;AAEF,MAAM,CAAC,IAAM,aAAa,GAAG,cAAM,OAAA,CACjC,6BAAK,SAAS,EAAC,2BAA2B;IACxC,6BAAK,SAAS,EAAC,+BAA+B;QAC5C,oBAAC,MAAM,IAAC,OAAO,EAAC,SAAS,EAAC,IAAI,EAAC,IAAI,EAAC,KAAK,EAAC,UAAU,GAAG;QACvD,oBAAC,YAAY,IAAC,IAAI,EAAC,IAAI,GAAG;QAC1B,oBAAC,YAAY,IAAC,IAAI,EAAC,IAAI,EAAC,QAAQ,SAAG;QACnC,oBAAC,YAAY,IAAC,IAAI,EAAC,IAAI,EAAC,QAAQ,SAAG,CAC/B;IAEN,6BAAK,SAAS,EAAC,+BAA+B;QAC5C,oBAAC,MAAM,IAAC,OAAO,EAAC,SAAS,EAAC,IAAI,EAAC,IAAI,EAAC,KAAK,EAAC,UAAU,GAAG;QACvD,oBAAC,YAAY,IAAC,IAAI,EAAC,IAAI,GAAG;QAC1B,oBAAC,YAAY,IAAC,IAAI,EAAC,IAAI,EAAC,QAAQ,SAAG;QACnC,oBAAC,YAAY,IAAC,IAAI,EAAC,IAAI,EAAC,QAAQ,SAAG,CAC/B,CACF,CACP,EAhBkC,CAgBlC,CAAC"}

package/dist/esm/stories/Spinner.stories.d.ts

@@ -0,0 +1,11 @@
+import type { StoryObj } from "@storybook/react";
+import React from "react";
+declare const meta: {
+    title: string;
+    component: React.FC<import("../components/Spinner").SpinnerProps>;
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const SpinnerExample: () => React.JSX.Element;
+export declare const BasicSpinner: Story;
+//# sourceMappingURL=Spinner.stories.d.ts.map

package/dist/esm/stories/Spinner.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spinner.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/Spinner.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,QAAA,MAAM,IAAI;;;CAGsB,CAAC;AAEjC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,cAAc,yBAqG1B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAI1B,CAAC"}

package/dist/esm/stories/Spinner.stories.js

@@ -0,0 +1,80 @@
+import React from "react";
+import { Spinner } from "../index_with_tw_base";
+var meta = {
+    title: "Primitives/Spinner",
+    component: Spinner,
+};
+export default meta;
+export var SpinnerExample = function () {
+    return (React.createElement("div", { className: "s-flex s-flex-col s-gap-4" },
+        "Size = XS",
+        React.createElement("div", { className: "s-flex s-gap-4" },
+            React.createElement("div", { className: "s-p-20" },
+                React.createElement(Spinner, { variant: "color", size: "xs" })),
+            React.createElement("div", { className: "s-bg-primary-900 s-p-20" },
+                React.createElement(Spinner, { variant: "light", size: "xs" })),
+            React.createElement("div", { className: "s-bg-blue-500 s-p-20" },
+                React.createElement(Spinner, { variant: "light", size: "xs" })),
+            React.createElement("div", { className: "s-p-20" },
+                React.createElement(Spinner, { variant: "dark", size: "xs" })),
+            React.createElement("div", { className: "s-p-20" },
+                React.createElement(Spinner, { variant: "rose300", size: "xs" }))),
+        "Size = SM",
+        React.createElement("div", { className: "s-flex s-gap-4" },
+            React.createElement("div", { className: "s-p-20" },
+                React.createElement(Spinner, { variant: "color", size: "sm" })),
+            React.createElement("div", { className: "s-bg-primary-900 s-p-20" },
+                React.createElement(Spinner, { variant: "light", size: "sm" })),
+            React.createElement("div", { className: "s-bg-blue-500 s-p-20" },
+                React.createElement(Spinner, { variant: "light", size: "sm" })),
+            React.createElement("div", { className: "s-p-20" },
+                React.createElement(Spinner, { variant: "dark", size: "sm" })),
+            React.createElement("div", { className: "s-p-20" },
+                React.createElement(Spinner, { variant: "rose300", size: "sm" }))),
+        "Size = MD",
+        React.createElement("div", { className: "s-flex s-gap-4" },
+            React.createElement("div", { className: "s-p-20" },
+                React.createElement(Spinner, { variant: "color", size: "md" })),
+            React.createElement("div", { className: "s-bg-primary-900 s-p-20" },
+                React.createElement(Spinner, { variant: "light", size: "md" })),
+            React.createElement("div", { className: "s-bg-blue-500 s-p-20" },
+                React.createElement(Spinner, { variant: "light", size: "md" })),
+            React.createElement("div", { className: "s-p-20" },
+                React.createElement(Spinner, { variant: "dark", size: "md" }))),
+        "Size = LG",
+        React.createElement("div", { className: "s-flex s-gap-4" },
+            React.createElement("div", { className: "s-p-20" },
+                React.createElement(Spinner, { variant: "color", size: "lg" })),
+            React.createElement("div", { className: "s-bg-primary-900 s-p-20" },
+                React.createElement(Spinner, { variant: "light", size: "lg" })),
+            React.createElement("div", { className: "s-bg-blue-500 s-p-20" },
+                React.createElement(Spinner, { variant: "light", size: "lg" })),
+            React.createElement("div", { className: "s-p-20" },
+                React.createElement(Spinner, { variant: "dark", size: "lg" }))),
+        "Size = XL",
+        React.createElement("div", { className: "s-flex s-gap-4" },
+            React.createElement("div", { className: "s-p-20" },
+                React.createElement(Spinner, { variant: "color", size: "xl" })),
+            React.createElement("div", { className: "s-bg-primary-900 s-p-20" },
+                React.createElement(Spinner, { variant: "light", size: "xl" })),
+            React.createElement("div", { className: "s-bg-blue-500 s-p-20" },
+                React.createElement(Spinner, { variant: "light", size: "xl" })),
+            React.createElement("div", { className: "s-p-20" },
+                React.createElement(Spinner, { variant: "dark", size: "xl" }))),
+        "Size = XXL",
+        React.createElement("div", { className: "s-flex s-gap-4" },
+            React.createElement("div", { className: "s-p-20" },
+                React.createElement(Spinner, { variant: "color", size: "xxl" })),
+            React.createElement("div", { className: "s-bg-primary-900 s-p-20" },
+                React.createElement(Spinner, { variant: "light", size: "xxl" })),
+            React.createElement("div", { className: "s-bg-blue-500 s-p-20" },
+                React.createElement(Spinner, { variant: "light", size: "xxl" })),
+            React.createElement("div", { className: "s-p-20" },
+                React.createElement(Spinner, { variant: "dark", size: "xxl" })))));
+};
+export var BasicSpinner = {
+    args: {
+        size: "md",
+    },
+};
+//# sourceMappingURL=Spinner.stories.js.map

package/dist/esm/stories/Spinner.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spinner.stories.js","sourceRoot":"","sources":["../../../src/stories/Spinner.stories.tsx"],"names":[],"mappings":"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"}

package/dist/esm/stories/SplitButton.stories.d.ts

@@ -0,0 +1,9 @@
+import type { Meta, StoryObj } from "@storybook/react";
+import React from "react";
+import { SplitButton } from "../index_with_tw_base";
+declare const meta: Meta<React.ComponentProps<typeof SplitButton>>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const ExampleButton: Story;
+export declare const FlexSplitButtonVariants: Story;
+//# sourceMappingURL=SplitButton.stories.d.ts.map

package/dist/esm/stories/SplitButton.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SplitButton.stories.d.ts","sourceRoot":"","sources":["../../../src/stories/SplitButton.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,EAML,WAAW,EACZ,MAAM,uBAAuB,CAAC;AAE/B,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,WAAW,CAAC,CAexD,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,aAAa,EAAE,KAsC3B,CAAC;AAEF,eAAO,MAAM,uBAAuB,EAAE,KAqCrC,CAAC"}

package/dist/esm/stories/SplitButton.stories.js

@@ -0,0 +1,68 @@
+import React from "react";
+import { BUTTON_SIZES, BUTTON_VARIANTS } from "../components/Button";
+import { ArrowUpIcon, ChevronDownIcon } from "../icons/app";
+import { Button, CameraIcon, FlexSplitButton, PlusIcon, RobotIcon, SplitButton, } from "../index_with_tw_base";
+var meta = {
+    title: "Primitives/SplitButton",
+    component: SplitButton,
+    argTypes: {
+        variant: {
+            description: "The visual style variant of the button",
+            options: BUTTON_VARIANTS,
+            control: { type: "select" },
+        },
+        size: {
+            description: "The size of the button",
+            options: BUTTON_SIZES,
+            control: { type: "select" },
+        },
+    },
+};
+export default meta;
+export var ExampleButton = {
+    args: {
+        variant: "outline",
+        size: "md",
+        defaultAction: {
+            label: "First",
+            icon: PlusIcon,
+            tooltip: "First tooltip",
+        },
+        actions: [
+            {
+                label: "First",
+                icon: PlusIcon,
+                tooltip: "First tooltip",
+            },
+            {
+                label: "Second",
+                icon: RobotIcon,
+                tooltip: "Disabled tooltip",
+                disabled: true,
+            },
+            {
+                label: "Photo",
+                icon: CameraIcon,
+                tooltip: "Disabled photo",
+                disabled: true,
+            },
+            {
+                label: "Third",
+                tooltip: "Third tooltip",
+            },
+            {
+                label: "Fourth",
+                tooltip: "Loading tooltip",
+                isLoading: true,
+            },
+        ],
+    },
+};
+export var FlexSplitButtonVariants = {
+    render: function () { return (React.createElement("div", { className: "s-flex s-gap-3" },
+        React.createElement(FlexSplitButton, { label: "Send", variant: "highlight", icon: ArrowUpIcon, splitAction: React.createElement(Button, { size: "mini", variant: "highlight", icon: ChevronDownIcon }) }),
+        React.createElement(FlexSplitButton, { label: "Send", variant: "primary", icon: ArrowUpIcon, splitAction: React.createElement(Button, { size: "mini", variant: "primary", icon: ChevronDownIcon }) }),
+        React.createElement(FlexSplitButton, { label: "Send", variant: "outline", icon: ArrowUpIcon, splitAction: React.createElement(Button, { size: "mini", variant: "outline", icon: ChevronDownIcon }) }),
+        React.createElement(FlexSplitButton, { label: "Send", variant: "ghost", icon: ArrowUpIcon, splitAction: React.createElement(Button, { size: "mini", variant: "ghost", icon: ChevronDownIcon }) }))); },
+};
+//# sourceMappingURL=SplitButton.stories.js.map