frosted-ui 0.0.1-canary.9 → 0.0.1-canary.91

package/dist/esm/components/radio-group/radio-group.stories.js

@@ -0,0 +1,134 @@
+import React from 'react';
+import { Code, RadioGroup, Text, radioGroupPropDefs } from '..';
+// More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
+const meta = {
+    title: 'Controls/RadioGroup',
+    component: RadioGroup.Root,
+    args: {
+        disabled: false,
+    },
+    parameters: {
+        // Optional parameter to center the component in the Canvas. More info: https://storybook.js.org/docs/react/configure/story-layout
+        layout: 'centered',
+    },
+    // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/react/writing-docs/autodocs
+    tags: ['autodocs'],
+};
+export default meta;
+// More on writing stories with args: https://storybook.js.org/docs/react/writing-stories/args
+export const Default = {
+    args: {
+        size: radioGroupPropDefs.size.default,
+        color: radioGroupPropDefs.color.default,
+        highContrast: radioGroupPropDefs.highContrast.default,
+    },
+    render: (args) => (React.createElement(RadioGroup.Root, { defaultValue: "1", ...args },
+        React.createElement("div", { style: { display: 'flex', gap: 'var(--space-2)', flexDirection: 'column' } },
+            React.createElement(RadioGroup.Item, { value: "1" }, "Default"),
+            React.createElement(RadioGroup.Item, { value: "2" }, "Comfortable"),
+            React.createElement(RadioGroup.Item, { value: "3" }, "Compact")))),
+};
+export const Composed = {
+    args: {
+        size: radioGroupPropDefs.size.default,
+        color: radioGroupPropDefs.color.default,
+        highContrast: radioGroupPropDefs.highContrast.default,
+    },
+    render: (args) => (React.createElement(RadioGroup.Root, { defaultValue: "1", ...args },
+        React.createElement("div", { style: { display: 'flex', gap: 'var(--space-2)', flexDirection: 'column' } },
+            React.createElement(Text, { as: "label", size: "2" },
+                React.createElement("div", { style: { display: 'flex', gap: 'var(--space-2)' } },
+                    React.createElement(RadioGroup.Item, { value: "1" }),
+                    " Default")),
+            React.createElement(Text, { as: "label", size: "2" },
+                React.createElement("div", { style: { display: 'flex', gap: 'var(--space-2)' } },
+                    React.createElement(RadioGroup.Item, { value: "2" }),
+                    " Comfortable")),
+            React.createElement(Text, { as: "label", size: "2" },
+                React.createElement("div", { style: { display: 'flex', gap: 'var(--space-2)' } },
+                    React.createElement(RadioGroup.Item, { value: "3" }),
+                    " Compact"))))),
+};
+export const Size = {
+    render: (args) => (React.createElement("div", { style: { display: 'flex', alignItems: 'center', gap: 'var(--space-2)' } },
+        React.createElement(RadioGroup.Root, { ...args, size: "1", defaultValue: "1" },
+            React.createElement(RadioGroup.Item, { value: "1" })),
+        React.createElement(RadioGroup.Root, { ...args, size: "2", defaultValue: "1" },
+            React.createElement(RadioGroup.Item, { value: "1" })),
+        React.createElement(RadioGroup.Root, { ...args, size: "3", defaultValue: "1" },
+            React.createElement(RadioGroup.Item, { value: "1" })))),
+};
+export const Color = {
+    render: (args) => (React.createElement("div", { style: { display: 'flex', gap: 'var(--space-2)' } },
+        React.createElement(RadioGroup.Root, { ...args, color: "indigo", defaultValue: "1" },
+            React.createElement(RadioGroup.Item, { value: "1" })),
+        React.createElement(RadioGroup.Root, { ...args, color: "cyan", defaultValue: "1" },
+            React.createElement(RadioGroup.Item, { value: "1" })),
+        React.createElement(RadioGroup.Root, { ...args, color: "orange", defaultValue: "1" },
+            React.createElement(RadioGroup.Item, { value: "1" })),
+        React.createElement(RadioGroup.Root, { ...args, color: "crimson", defaultValue: "1" },
+            React.createElement(RadioGroup.Item, { value: "1" })))),
+};
+export const HighContrast = {
+    name: 'High Contrast',
+    render: (args) => (React.createElement("div", { style: {
+            display: 'inline-grid',
+            gridTemplateRows: 'repeat(2, 1fr)',
+            gap: 'var(--space-2)',
+            gridAutoFlow: 'column',
+        } },
+        React.createElement(RadioGroup.Root, { ...args, color: "indigo", defaultValue: "1" },
+            React.createElement(RadioGroup.Item, { value: "1" })),
+        React.createElement(RadioGroup.Root, { ...args, color: "indigo", defaultValue: "1", highContrast: true },
+            React.createElement(RadioGroup.Item, { value: "1" })),
+        React.createElement(RadioGroup.Root, { ...args, color: "cyan", defaultValue: "1" },
+            React.createElement(RadioGroup.Item, { value: "1" })),
+        React.createElement(RadioGroup.Root, { ...args, color: "cyan", defaultValue: "1", highContrast: true },
+            React.createElement(RadioGroup.Item, { value: "1" })),
+        React.createElement(RadioGroup.Root, { ...args, color: "orange", defaultValue: "1" },
+            React.createElement(RadioGroup.Item, { value: "1" })),
+        React.createElement(RadioGroup.Root, { ...args, color: "orange", defaultValue: "1", highContrast: true },
+            React.createElement(RadioGroup.Item, { value: "1" })),
+        React.createElement(RadioGroup.Root, { ...args, color: "crimson", defaultValue: "1" },
+            React.createElement(RadioGroup.Item, { value: "1" })),
+        React.createElement(RadioGroup.Root, { ...args, color: "crimson", defaultValue: "1", highContrast: true },
+            React.createElement(RadioGroup.Item, { value: "1" })))),
+};
+export const Alignment = {
+    name: 'Alignment with text',
+    render: (args) => (React.createElement("div", { style: { display: 'flex', flexDirection: 'column', gap: 'var(--space-3)' } },
+        React.createElement(Text, { style: { marginBottom: 12 } },
+            "Composing ",
+            React.createElement(Code, null, "RadioGroup"),
+            " within ",
+            React.createElement(Code, null, "Text"),
+            " automatically centers it with the first line of text."),
+        React.createElement(RadioGroup.Root, { ...args, size: "1", defaultValue: "1" },
+            React.createElement(Text, { as: "label", size: "2" },
+                React.createElement("div", { style: { display: 'flex', gap: 'var(--space-2)' } },
+                    React.createElement(RadioGroup.Item, { value: "1" }),
+                    " Default")),
+            React.createElement(Text, { as: "label", size: "2" },
+                React.createElement("div", { style: { display: 'flex', gap: 'var(--space-2)' } },
+                    React.createElement(RadioGroup.Item, { value: "2" }),
+                    " Compact"))),
+        React.createElement(RadioGroup.Root, { ...args, size: "2", defaultValue: "1", style: { display: 'flex', flexDirection: 'column', gap: 'var(--space-1)' } },
+            React.createElement(Text, { as: "label", size: "3" },
+                React.createElement("div", { style: { display: 'flex', gap: 'var(--space-2)' } },
+                    React.createElement(RadioGroup.Item, { value: "1" }),
+                    " Default")),
+            React.createElement(Text, { as: "label", size: "3" },
+                React.createElement("div", { style: { display: 'flex', gap: 'var(--space-2)' } },
+                    React.createElement(RadioGroup.Item, { value: "2" }),
+                    " Compact"))),
+        React.createElement(RadioGroup.Root, { ...args, size: "3", defaultValue: "1", style: { display: 'flex', flexDirection: 'column', gap: 'var(--space-2)' } },
+            React.createElement(Text, { as: "label", size: "4" },
+                React.createElement("div", { style: { display: 'flex', gap: 'var(--space-2)' } },
+                    React.createElement(RadioGroup.Item, { value: "1" }),
+                    " Default")),
+            React.createElement(Text, { as: "label", size: "4" },
+                React.createElement("div", { style: { display: 'flex', gap: 'var(--space-2)' } },
+                    React.createElement(RadioGroup.Item, { value: "2" }),
+                    " Compact"))))),
+};
+//# sourceMappingURL=radio-group.stories.js.map

package/dist/esm/components/radio-group/radio-group.stories.js.map

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

package/dist/esm/components/scroll-area/index.d.ts

@@ -0,0 +1,2 @@
+export * from './scroll-area';
+export * from './scroll-area.props';

package/dist/esm/components/scroll-area/index.js

@@ -0,0 +1,3 @@
+export * from './scroll-area';
+export * from './scroll-area.props';
+//# sourceMappingURL=index.js.map

package/dist/esm/components/scroll-area/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/scroll-area/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC"}

package/dist/esm/components/scroll-area/scroll-area.d.ts

@@ -0,0 +1,13 @@
+import { ScrollArea as ScrollAreaPrimitive } from 'radix-ui';
+import * as React from 'react';
+import { scrollAreaPropDefs } from './scroll-area.props';
+import type { GetPropDefTypes } from '../../helpers';
+type ScrollAreaOwnProps = GetPropDefTypes<typeof scrollAreaPropDefs>;
+interface ScrollAreaProps extends React.ComponentPropsWithRef<typeof ScrollAreaPrimitive.Root>, Omit<React.ComponentPropsWithRef<typeof ScrollAreaPrimitive.Viewport>, 'dir'>, ScrollAreaOwnProps {
+}
+declare const ScrollArea: {
+    (props: ScrollAreaProps): React.JSX.Element;
+    displayName: string;
+};
+export { ScrollArea };
+export type { ScrollAreaProps };

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

@@ -0,0 +1,21 @@
+'use client';
+import classNames from 'classnames';
+import { ScrollArea as ScrollAreaPrimitive } from 'radix-ui';
+import * as React from 'react';
+import { scrollAreaPropDefs } from './scroll-area.props';
+const ScrollArea = (props) => {
+    const { className, style, type, scrollHideDelay = type !== 'scroll' ? 0 : undefined, 
+    // dir,
+    size = scrollAreaPropDefs.size.default, scrollbars = scrollAreaPropDefs.scrollbars.default, ...viewportProps } = props;
+    return (React.createElement(ScrollAreaPrimitive.Root, { type: type, scrollHideDelay: scrollHideDelay, className: classNames('fui-ScrollAreaRoot', className), style: style },
+        React.createElement(ScrollAreaPrimitive.Viewport, { ...viewportProps, className: "fui-ScrollAreaViewport" }),
+        React.createElement("div", { className: "fui-ScrollAreaViewportFocusRing" }),
+        scrollbars !== 'vertical' ? (React.createElement(ScrollAreaPrimitive.Scrollbar, { orientation: "horizontal", className: classNames('fui-ScrollAreaScrollbar', `fui-r-size-${size}`) },
+            React.createElement(ScrollAreaPrimitive.Thumb, { className: "fui-ScrollAreaThumb" }))) : null,
+        scrollbars !== 'horizontal' ? (React.createElement(ScrollAreaPrimitive.Scrollbar, { orientation: "vertical", className: classNames('fui-ScrollAreaScrollbar', `fui-r-size-${size}`) },
+            React.createElement(ScrollAreaPrimitive.Thumb, { className: "fui-ScrollAreaThumb" }))) : null,
+        scrollbars === 'both' ? React.createElement(ScrollAreaPrimitive.Corner, { className: "fui-ScrollAreaCorner" }) : null));
+};
+ScrollArea.displayName = 'ScrollArea';
+export { ScrollArea };
+//# sourceMappingURL=scroll-area.js.map

package/dist/esm/components/scroll-area/scroll-area.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll-area.js","sourceRoot":"","sources":["../../../../src/components/scroll-area/scroll-area.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,UAAU,IAAI,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAC7D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAUzD,MAAM,UAAU,GAAG,CAAC,KAAsB,EAAE,EAAE;IAC5C,MAAM,EACJ,SAAS,EACT,KAAK,EACL,IAAI,EACJ,eAAe,GAAG,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS;IACnD,OAAO;IACP,IAAI,GAAG,kBAAkB,CAAC,IAAI,CAAC,OAAO,EACtC,UAAU,GAAG,kBAAkB,CAAC,UAAU,CAAC,OAAO,EAClD,GAAG,aAAa,EACjB,GAAG,KAAK,CAAC;IACV,OAAO,CACL,oBAAC,mBAAmB,CAAC,IAAI,IACvB,IAAI,EAAE,IAAI,EACV,eAAe,EAAE,eAAe,EAChC,SAAS,EAAE,UAAU,CAAC,oBAAoB,EAAE,SAAS,CAAC,EACtD,KAAK,EAAE,KAAK;QAEZ,oBAAC,mBAAmB,CAAC,QAAQ,OAAK,aAAa,EAAE,SAAS,EAAC,wBAAwB,GAAG;QACtF,6BAAK,SAAS,EAAC,iCAAiC,GAAG;QAElD,UAAU,KAAK,UAAU,CAAC,CAAC,CAAC,CAC3B,oBAAC,mBAAmB,CAAC,SAAS,IAC5B,WAAW,EAAC,YAAY,EACxB,SAAS,EAAE,UAAU,CAAC,yBAAyB,EAAE,cAAc,IAAI,EAAE,CAAC;YAEtE,oBAAC,mBAAmB,CAAC,KAAK,IAAC,SAAS,EAAC,qBAAqB,GAAG,CAC/B,CACjC,CAAC,CAAC,CAAC,IAAI;QAEP,UAAU,KAAK,YAAY,CAAC,CAAC,CAAC,CAC7B,oBAAC,mBAAmB,CAAC,SAAS,IAC5B,WAAW,EAAC,UAAU,EACtB,SAAS,EAAE,UAAU,CAAC,yBAAyB,EAAE,cAAc,IAAI,EAAE,CAAC;YAEtE,oBAAC,mBAAmB,CAAC,KAAK,IAAC,SAAS,EAAC,qBAAqB,GAAG,CAC/B,CACjC,CAAC,CAAC,CAAC,IAAI;QAEP,UAAU,KAAK,MAAM,CAAC,CAAC,CAAC,oBAAC,mBAAmB,CAAC,MAAM,IAAC,SAAS,EAAC,sBAAsB,GAAG,CAAC,CAAC,CAAC,IAAI,CACtE,CAC5B,CAAC;AACJ,CAAC,CAAC;AACF,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC;AAEtC,OAAO,EAAE,UAAU,EAAE,CAAC"}

package/dist/esm/components/scroll-area/scroll-area.props.d.ts

@@ -0,0 +1,13 @@
+declare const scrollAreaPropDefs: {
+    size: {
+        type: "enum";
+        values: readonly ["1", "2", "3"];
+        default: "1";
+    };
+    scrollbars: {
+        type: "enum";
+        values: readonly ["vertical", "horizontal", "both"];
+        default: "both";
+    };
+};
+export { scrollAreaPropDefs };

package/dist/esm/components/scroll-area/scroll-area.props.js

@@ -0,0 +1,8 @@
+const sizes = ['1', '2', '3'];
+const scrollbarsValues = ['vertical', 'horizontal', 'both'];
+const scrollAreaPropDefs = {
+    size: { type: 'enum', values: sizes, default: '1' },
+    scrollbars: { type: 'enum', values: scrollbarsValues, default: 'both' },
+};
+export { scrollAreaPropDefs };
+//# sourceMappingURL=scroll-area.props.js.map

package/dist/esm/components/scroll-area/scroll-area.props.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll-area.props.js","sourceRoot":"","sources":["../../../../src/components/scroll-area/scroll-area.props.ts"],"names":[],"mappings":"AAEA,MAAM,KAAK,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAU,CAAC;AACvC,MAAM,gBAAgB,GAAG,CAAC,UAAU,EAAE,YAAY,EAAE,MAAM,CAAU,CAAC;AAErE,MAAM,kBAAkB,GAAG;IACzB,IAAI,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,EAAE;IACnD,UAAU,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,gBAAgB,EAAE,OAAO,EAAE,MAAM,EAAE;CAIxE,CAAC;AAEF,OAAO,EAAE,kBAAkB,EAAE,CAAC"}

package/dist/esm/components/scroll-area/scroll-area.stories.d.ts

@@ -0,0 +1,21 @@
+import type { StoryObj } from '@storybook/react';
+import React from 'react';
+declare const meta: {
+    title: string;
+    component: {
+        (props: import("./scroll-area").ScrollAreaProps): React.JSX.Element;
+        displayName: string;
+    };
+    args: {
+        type: "auto" | "always" | "scroll" | "hover" | undefined;
+    };
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const Size: Story;
+export declare const Scrollbars: Story;

package/dist/esm/components/scroll-area/scroll-area.stories.js

@@ -0,0 +1,67 @@
+import React from 'react';
+import { Heading, ScrollArea, Text, scrollAreaPropDefs } from '..';
+// More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
+const meta = {
+    title: 'Components/ScrollArea',
+    component: ScrollArea,
+    args: {
+        type: 'always',
+    },
+    parameters: {
+        // Optional parameter to center the component in the Canvas. More info: https://storybook.js.org/docs/react/configure/story-layout
+        layout: 'centered',
+    },
+    // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/react/writing-docs/autodocs
+    tags: ['autodocs'],
+};
+export default meta;
+// More on writing stories with args: https://storybook.js.org/docs/react/writing-stories/args
+export const Default = {
+    args: {
+        size: scrollAreaPropDefs.size.default,
+        scrollbars: 'vertical',
+    },
+    render: (args) => (React.createElement(ScrollArea, { type: "always", scrollbars: "vertical", style: { height: 180 }, ...args },
+        React.createElement("div", { style: { padding: '8px 8px 54px 8px' } },
+            React.createElement(Heading, { size: "4", style: { marginBottom: 8 }, trim: "start" }, "Principles of the typographic craft"),
+            React.createElement("div", { style: { display: 'flex', flexDirection: 'column', gap: 'var(--space-4)' } },
+                React.createElement(Text, { as: "p" }, "Three fundamental aspects of typography are legibility, readability, and aesthetics. Although in a non-technical sense \"legible\" and \"readable\" are often used synonymously, typographically they are separate but related concepts."),
+                React.createElement(Text, { as: "p" }, "Legibility describes how easily individual characters can be distinguished from one another. It is described by Walter Tracy as \"the quality of being decipherable and recognisable\". For instance, if a \"b\" and an \"h\", or a \"3\" and an \"8\", are difficult to distinguish at small sizes, this is a problem of legibility."),
+                React.createElement(Text, { as: "p" }, "Typographers are concerned with legibility insofar as it is their job to select the correct font to use. Brush Script is an example of a font containing many characters that might be difficult to distinguish. The selection of cases influences the legibility of typography because using only uppercase letters (all-caps) reduces legibility."))))),
+};
+export const Size = {
+    args: {
+        size: scrollAreaPropDefs.size.default,
+        scrollbars: 'vertical',
+    },
+    render: (args) => (React.createElement("div", { style: { display: 'flex', flexDirection: 'column', gap: 'var(--space-2)' } },
+        React.createElement(ScrollArea, { ...args, size: "1", type: "always", scrollbars: "horizontal", style: { width: 300, height: 12 } },
+            React.createElement("div", { style: { width: 800, height: 1 } })),
+        React.createElement(ScrollArea, { ...args, size: "2", type: "always", scrollbars: "horizontal", style: { width: 350, height: 16 } },
+            React.createElement("div", { style: { width: 900, height: 1 } })),
+        React.createElement(ScrollArea, { ...args, size: "3", type: "always", scrollbars: "horizontal", style: { width: 400, height: 20 } },
+            React.createElement("div", { style: { width: 1000, height: 1 } })))),
+};
+export const Scrollbars = {
+    args: {
+        size: scrollAreaPropDefs.size.default,
+        type: 'always',
+        scrollbars: 'vertical',
+    },
+    render: (args) => (React.createElement("div", { style: { display: 'grid', gridTemplateColumns: 'repeat(2, 1fr)', gap: 'var(--space-2)' } },
+        React.createElement(ScrollArea, { ...args, type: "always", scrollbars: "vertical", style: { height: 150 } },
+            React.createElement("div", { style: {
+                    display: 'flex',
+                    flexDirection: 'column',
+                    gap: 'var(--space-4)',
+                    padding: 'var(--space-2)',
+                    paddingRight: 'var(--space-8)',
+                } },
+                React.createElement(Text, { size: "2", trim: "both" }, "Three fundamental aspects of typography are legibility, readability, and aesthetics. Although in a non-technical sense \"legible\" and \"readable\" are often used synonymously, typographically they are separate but related concepts."),
+                React.createElement(Text, { size: "2", trim: "both" }, "Legibility describes how easily individual characters can be distinguished from one another. It is described by Walter Tracy as \"the quality of being decipherable and recognisable\". For instance, if a \"b\" and an \"h\", or a \"3\" and an \"8\", are difficult to distinguish at small sizes, this is a problem of legibility."))),
+        React.createElement(ScrollArea, { ...args, type: "always", scrollbars: "horizontal", style: { height: 150 } },
+            React.createElement("div", { style: { display: 'flex', gap: 'var(--space-4)', padding: 'var(--space-2)', width: 700 } },
+                React.createElement(Text, { size: "2", trim: "both" }, "Three fundamental aspects of typography are legibility, readability, and aesthetics. Although in a non-technical sense \"legible\" and \"readable\" are often used synonymously, typographically they are separate but related concepts."),
+                React.createElement(Text, { size: "2", trim: "both" }, "Legibility describes how easily individual characters can be distinguished from one another. It is described by Walter Tracy as \"the quality of being decipherable and recognisable\". For instance, if a \"b\" and an \"h\", or a \"3\" and an \"8\", are difficult to distinguish at small sizes, this is a problem of legibility."))))),
+};
+//# sourceMappingURL=scroll-area.stories.js.map

package/dist/esm/components/scroll-area/scroll-area.stories.js.map

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

package/dist/esm/components/segmented-control/index.d.ts

@@ -0,0 +1 @@
+export * as SegmentedControl from './segmented-control';

package/dist/esm/components/segmented-control/index.js

@@ -0,0 +1,2 @@
+export * as SegmentedControl from './segmented-control';
+//# sourceMappingURL=index.js.map

package/dist/esm/components/segmented-control/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/segmented-control/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,gBAAgB,MAAM,qBAAqB,CAAC"}

package/dist/esm/components/segmented-control/segmented-control.d.ts

@@ -0,0 +1,30 @@
+import { Tabs as TabsPrimitive } from 'radix-ui';
+import * as React from 'react';
+interface SegmentedControlRootProps extends React.ComponentProps<typeof TabsPrimitive.Root> {
+}
+declare const SegmentedControlRoot: {
+    (props: SegmentedControlRootProps): React.JSX.Element;
+    displayName: string;
+};
+interface SegmentedControlListOwnProps extends React.ComponentProps<'div'> {
+}
+interface SegmentedControlListProps extends React.ComponentProps<typeof TabsPrimitive.List>, SegmentedControlListOwnProps {
+}
+declare const SegmentedControlList: {
+    (props: SegmentedControlListProps): React.JSX.Element;
+    displayName: string;
+};
+interface SegmentedControlTriggerProps extends React.ComponentProps<typeof TabsPrimitive.Trigger> {
+}
+declare const SegmentedControlTrigger: {
+    (props: SegmentedControlTriggerProps): React.JSX.Element;
+    displayName: string;
+};
+interface SegmentedControlContentProps extends React.ComponentProps<typeof TabsPrimitive.Content> {
+}
+declare const SegmentedControlContent: {
+    (props: SegmentedControlContentProps): React.JSX.Element;
+    displayName: string;
+};
+export { SegmentedControlContent as Content, SegmentedControlList as List, SegmentedControlRoot as Root, SegmentedControlTrigger as Trigger, };
+export type { SegmentedControlContentProps as ContentProps, SegmentedControlListProps as ListProps, SegmentedControlRootProps as RootProps, SegmentedControlTriggerProps as TriggerProps, };

package/dist/esm/components/segmented-control/segmented-control.js

@@ -0,0 +1,24 @@
+'use client';
+import classNames from 'classnames';
+import { Tabs as TabsPrimitive } from 'radix-ui';
+import * as React from 'react';
+const SegmentedControlRoot = (props) => {
+    const { className, ...rootProps } = props;
+    return React.createElement(TabsPrimitive.Root, { ...rootProps, className: classNames('fui-BaseSegmentedControlRoot', className) });
+};
+SegmentedControlRoot.displayName = 'SegmentedControlRoot';
+const SegmentedControlList = (props) => {
+    const { className, ...listProps } = props;
+    return React.createElement(TabsPrimitive.List, { ...listProps, className: classNames('fui-BaseSegmentedControlList', className) });
+};
+SegmentedControlList.displayName = 'SegmentedControlList';
+const SegmentedControlTrigger = (props) => {
+    const { className, children, ...triggerProps } = props;
+    return (React.createElement(TabsPrimitive.Trigger, { ...triggerProps, className: classNames('fui-reset', 'fui-BaseSegmentedControlTrigger', className) },
+        React.createElement("span", { className: "fui-BaseSegmentedControlTriggerInner" }, children)));
+};
+SegmentedControlTrigger.displayName = 'SegmentedControlTrigger';
+const SegmentedControlContent = (props) => (React.createElement(TabsPrimitive.Content, { ...props, className: classNames('fui-SegmentedControlContent', props.className) }));
+SegmentedControlContent.displayName = 'SegmentedControlContent';
+export { SegmentedControlContent as Content, SegmentedControlList as List, SegmentedControlRoot as Root, SegmentedControlTrigger as Trigger, };
+//# sourceMappingURL=segmented-control.js.map

package/dist/esm/components/segmented-control/segmented-control.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"segmented-control.js","sourceRoot":"","sources":["../../../../src/components/segmented-control/segmented-control.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,IAAI,IAAI,aAAa,EAAE,MAAM,UAAU,CAAC;AACjD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,MAAM,oBAAoB,GAAG,CAAC,KAAgC,EAAE,EAAE;IAChE,MAAM,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IAC1C,OAAO,oBAAC,aAAa,CAAC,IAAI,OAAK,SAAS,EAAE,SAAS,EAAE,UAAU,CAAC,8BAA8B,EAAE,SAAS,CAAC,GAAI,CAAC;AACjH,CAAC,CAAC;AACF,oBAAoB,CAAC,WAAW,GAAG,sBAAsB,CAAC;AAO1D,MAAM,oBAAoB,GAAG,CAAC,KAAgC,EAAE,EAAE;IAChE,MAAM,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IAC1C,OAAO,oBAAC,aAAa,CAAC,IAAI,OAAK,SAAS,EAAE,SAAS,EAAE,UAAU,CAAC,8BAA8B,EAAE,SAAS,CAAC,GAAI,CAAC;AACjH,CAAC,CAAC;AACF,oBAAoB,CAAC,WAAW,GAAG,sBAAsB,CAAC;AAI1D,MAAM,uBAAuB,GAAG,CAAC,KAAmC,EAAE,EAAE;IACtE,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,YAAY,EAAE,GAAG,KAAK,CAAC;IACvD,OAAO,CACL,oBAAC,aAAa,CAAC,OAAO,OAChB,YAAY,EAChB,SAAS,EAAE,UAAU,CAAC,WAAW,EAAE,iCAAiC,EAAE,SAAS,CAAC;QAEhF,8BAAM,SAAS,EAAC,sCAAsC,IAAE,QAAQ,CAAQ,CAClD,CACzB,CAAC;AACJ,CAAC,CAAC;AACF,uBAAuB,CAAC,WAAW,GAAG,yBAAyB,CAAC;AAIhE,MAAM,uBAAuB,GAAG,CAAC,KAAmC,EAAE,EAAE,CAAC,CACvE,oBAAC,aAAa,CAAC,OAAO,OAAK,KAAK,EAAE,SAAS,EAAE,UAAU,CAAC,6BAA6B,EAAE,KAAK,CAAC,SAAS,CAAC,GAAI,CAC5G,CAAC;AACF,uBAAuB,CAAC,WAAW,GAAG,yBAAyB,CAAC;AAEhE,OAAO,EACL,uBAAuB,IAAI,OAAO,EAClC,oBAAoB,IAAI,IAAI,EAC5B,oBAAoB,IAAI,IAAI,EAC5B,uBAAuB,IAAI,OAAO,GACnC,CAAC"}

package/dist/esm/components/segmented-control/segmented-control.stories.d.ts

@@ -0,0 +1,19 @@
+import type { StoryObj } from '@storybook/react';
+import React from 'react';
+import { SegmentedControl } from '..';
+declare const meta: {
+    title: string;
+    component: {
+        (props: SegmentedControl.ListProps): React.JSX.Element;
+        displayName: string;
+    };
+    args: {};
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const InDrawer: Story;

package/dist/esm/components/segmented-control/segmented-control.stories.js

@@ -0,0 +1,54 @@
+import React from 'react';
+import { Button, Drawer, SegmentedControl, Text } from '..';
+// More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
+const meta = {
+    title: 'Components/SegmentedControl',
+    component: SegmentedControl.List,
+    args: {},
+    parameters: {
+        // Optional parameter to center the component in the Canvas. More info: https://storybook.js.org/docs/react/configure/story-layout
+        layout: 'centered',
+    },
+    // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/react/writing-docs/autodocs
+    tags: ['autodocs'],
+};
+export default meta;
+// More on writing stories with args: https://storybook.js.org/docs/react/writing-stories/args
+export const Default = {
+    render: (args) => (React.createElement("div", { style: { width: 'auto' } },
+        React.createElement(SegmentedControl.Root, { defaultValue: "account" },
+            React.createElement(SegmentedControl.List, { ...args },
+                React.createElement(SegmentedControl.Trigger, { value: "account" }, "Account"),
+                React.createElement(SegmentedControl.Trigger, { value: "documents" }, "Documents"),
+                React.createElement(SegmentedControl.Trigger, { value: "settings" }, "Settings")),
+            React.createElement("div", { style: { padding: '12px 16px 8px 16px' } },
+                React.createElement(SegmentedControl.Content, { value: "account" },
+                    React.createElement(Text, { size: "2" }, "Your account.")),
+                React.createElement(SegmentedControl.Content, { value: "documents" },
+                    React.createElement(Text, { size: "2" }, "Your documents.")),
+                React.createElement(SegmentedControl.Content, { value: "settings" },
+                    React.createElement(Text, { size: "2" }, "Your profile.")))))),
+};
+export const InDrawer = {
+    name: 'In a drawer',
+    render: (args) => (React.createElement(Drawer.Root, { defaultOpen: true },
+        React.createElement(Drawer.Trigger, null,
+            React.createElement(Button, null, "View users")),
+        React.createElement(Drawer.Content, { style: { width: 400 } },
+            React.createElement(Drawer.Header, null,
+                React.createElement(Drawer.Title, null, "Users")),
+            React.createElement(Drawer.Body, null,
+                React.createElement(SegmentedControl.Root, { defaultValue: "account" },
+                    React.createElement(SegmentedControl.List, { ...args },
+                        React.createElement(SegmentedControl.Trigger, { value: "account" }, "Account"),
+                        React.createElement(SegmentedControl.Trigger, { value: "documents" }, "Documents"),
+                        React.createElement(SegmentedControl.Trigger, { value: "settings" }, "Settings")),
+                    React.createElement("div", { style: { padding: '12px 16px 8px 16px' } },
+                        React.createElement(SegmentedControl.Content, { value: "account" },
+                            React.createElement(Text, { size: "2" }, "Make changes to your account.")),
+                        React.createElement(SegmentedControl.Content, { value: "documents" },
+                            React.createElement(Text, { size: "2" }, "Access and update your documents.")),
+                        React.createElement(SegmentedControl.Content, { value: "settings" },
+                            React.createElement(Text, { size: "2" }, "Edit your profile.")))))))),
+};
+//# sourceMappingURL=segmented-control.stories.js.map

package/dist/esm/components/segmented-control/segmented-control.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"segmented-control.stories.js","sourceRoot":"","sources":["../../../../src/components/segmented-control/segmented-control.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,gBAAgB,EAAE,IAAI,EAAE,MAAM,IAAI,CAAC;AAE5D,oHAAoH;AACpH,MAAM,IAAI,GAAG;IACX,KAAK,EAAE,6BAA6B;IACpC,SAAS,EAAE,gBAAgB,CAAC,IAAI;IAChC,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,kIAAkI;QAClI,MAAM,EAAE,UAAU;KACnB;IACD,gIAAgI;IAChI,IAAI,EAAE,CAAC,UAAU,CAAC;CAC0B,CAAC;AAE/C,eAAe,IAAI,CAAC;AAGpB,8FAA8F;AAE9F,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,CAChB,6BAAK,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE;QAC3B,oBAAC,gBAAgB,CAAC,IAAI,IAAC,YAAY,EAAC,SAAS;YAC3C,oBAAC,gBAAgB,CAAC,IAAI,OAAK,IAAI;gBAC7B,oBAAC,gBAAgB,CAAC,OAAO,IAAC,KAAK,EAAC,SAAS,cAAmC;gBAC5E,oBAAC,gBAAgB,CAAC,OAAO,IAAC,KAAK,EAAC,WAAW,gBAAqC;gBAChF,oBAAC,gBAAgB,CAAC,OAAO,IAAC,KAAK,EAAC,UAAU,eAAoC,CACxD;YAExB,6BAAK,KAAK,EAAE,EAAE,OAAO,EAAE,oBAAoB,EAAE;gBAC3C,oBAAC,gBAAgB,CAAC,OAAO,IAAC,KAAK,EAAC,SAAS;oBACvC,oBAAC,IAAI,IAAC,IAAI,EAAC,GAAG,oBAAqB,CACV;gBAE3B,oBAAC,gBAAgB,CAAC,OAAO,IAAC,KAAK,EAAC,WAAW;oBACzC,oBAAC,IAAI,IAAC,IAAI,EAAC,GAAG,sBAAuB,CACZ;gBAE3B,oBAAC,gBAAgB,CAAC,OAAO,IAAC,KAAK,EAAC,UAAU;oBACxC,oBAAC,IAAI,IAAC,IAAI,EAAC,GAAG,oBAAqB,CACV,CACvB,CACgB,CACpB,CACP;CACF,CAAC;AACF,MAAM,CAAC,MAAM,QAAQ,GAAU;IAC7B,IAAI,EAAE,aAAa;IACnB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,CAChB,oBAAC,MAAM,CAAC,IAAI,IAAC,WAAW;QACtB,oBAAC,MAAM,CAAC,OAAO;YACb,oBAAC,MAAM,qBAAoB,CACZ;QACjB,oBAAC,MAAM,CAAC,OAAO,IAAC,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE;YACnC,oBAAC,MAAM,CAAC,MAAM;gBACZ,oBAAC,MAAM,CAAC,KAAK,gBAAqB,CACpB;YAChB,oBAAC,MAAM,CAAC,IAAI;gBACV,oBAAC,gBAAgB,CAAC,IAAI,IAAC,YAAY,EAAC,SAAS;oBAC3C,oBAAC,gBAAgB,CAAC,IAAI,OAAK,IAAI;wBAC7B,oBAAC,gBAAgB,CAAC,OAAO,IAAC,KAAK,EAAC,SAAS,cAAmC;wBAC5E,oBAAC,gBAAgB,CAAC,OAAO,IAAC,KAAK,EAAC,WAAW,gBAAqC;wBAChF,oBAAC,gBAAgB,CAAC,OAAO,IAAC,KAAK,EAAC,UAAU,eAAoC,CACxD;oBAExB,6BAAK,KAAK,EAAE,EAAE,OAAO,EAAE,oBAAoB,EAAE;wBAC3C,oBAAC,gBAAgB,CAAC,OAAO,IAAC,KAAK,EAAC,SAAS;4BACvC,oBAAC,IAAI,IAAC,IAAI,EAAC,GAAG,oCAAqC,CAC1B;wBAE3B,oBAAC,gBAAgB,CAAC,OAAO,IAAC,KAAK,EAAC,WAAW;4BACzC,oBAAC,IAAI,IAAC,IAAI,EAAC,GAAG,wCAAyC,CAC9B;wBAE3B,oBAAC,gBAAgB,CAAC,OAAO,IAAC,KAAK,EAAC,UAAU;4BACxC,oBAAC,IAAI,IAAC,IAAI,EAAC,GAAG,yBAA0B,CACf,CACvB,CACgB,CACZ,CACC,CACL,CACf;CACF,CAAC"}

package/dist/esm/components/segmented-control-nav/index.d.ts

@@ -0,0 +1,2 @@
+export * as SegmentedControlNav from './segmented-control-nav';
+export * from './segmented-control-nav.props';

package/dist/esm/components/segmented-control-nav/index.js

@@ -0,0 +1,3 @@
+export * as SegmentedControlNav from './segmented-control-nav';
+export * from './segmented-control-nav.props';
+//# sourceMappingURL=index.js.map

package/dist/esm/components/segmented-control-nav/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/segmented-control-nav/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,mBAAmB,MAAM,yBAAyB,CAAC;AAC/D,cAAc,+BAA+B,CAAC"}

package/dist/esm/components/segmented-control-nav/segmented-control-nav.d.ts

@@ -0,0 +1,19 @@
+import { NavigationMenu } from 'radix-ui';
+import * as React from 'react';
+import { GetPropDefTypes } from '../../helpers';
+import { segmentedControlNavLinkPropDefs } from './segmented-control-nav.props';
+interface SegmentedControlNavRootProps extends Omit<React.ComponentProps<typeof NavigationMenu.Root>, 'asChild' | 'orientation' | 'defauValue' | 'value' | 'onValueChange' | 'delayDuration' | 'skipDelayDuration'> {
+}
+declare const SegmentedControlNavRoot: {
+    (props: SegmentedControlNavRootProps): React.JSX.Element;
+    displayName: string;
+};
+type SegmentedControlNavLinkOwnProps = GetPropDefTypes<typeof segmentedControlNavLinkPropDefs>;
+interface SegmentedControlNavLinkProps extends Omit<React.ComponentProps<typeof NavigationMenu.Link>, 'onSelect'>, SegmentedControlNavLinkOwnProps {
+}
+declare const SegmentedControlNavLink: {
+    (props: SegmentedControlNavLinkProps): React.JSX.Element;
+    displayName: string;
+};
+export { SegmentedControlNavLink as Link, SegmentedControlNavRoot as Root };
+export type { SegmentedControlNavLinkProps as LinkProps, SegmentedControlNavRootProps as RootProps };

package/dist/esm/components/segmented-control-nav/segmented-control-nav.js

@@ -0,0 +1,21 @@
+'use client';
+import classNames from 'classnames';
+import { NavigationMenu } from 'radix-ui';
+import * as React from 'react';
+import { getSubtree } from '../../helpers';
+const SegmentedControlNavRoot = (props) => {
+    const { children, className, ...rootProps } = props;
+    return (React.createElement(NavigationMenu.Root, { className: "fui-SegmentedControlNavRoot", ...rootProps, asChild: false, orientation: "horizontal" },
+        React.createElement(NavigationMenu.List, { className: classNames('fui-reset', 'fui-BaseSegmentedControlList', className) }, children)));
+};
+SegmentedControlNavRoot.displayName = 'SegmentedControlNavRoot';
+const SegmentedControlNavLink = (props) => {
+    const { asChild, children, className, ...linkProps } = props;
+    return (React.createElement(NavigationMenu.Item, { className: "fui-SegmentedControlNavItem" },
+        React.createElement(NavigationMenu.Link, { ...linkProps, className: classNames('fui-reset', 'fui-BaseSegmentedControlTrigger', 'fui-SegmentedControlNavLink', className), 
+            // eslint-disable-next-line @typescript-eslint/no-empty-function
+            onSelect: () => { }, asChild: asChild }, getSubtree({ asChild, children }, (children) => (React.createElement("span", { className: "fui-BaseSegmentedControlTriggerInner" }, children))))));
+};
+SegmentedControlNavLink.displayName = 'SegmentedControlNavLink';
+export { SegmentedControlNavLink as Link, SegmentedControlNavRoot as Root };
+//# sourceMappingURL=segmented-control-nav.js.map

package/dist/esm/components/segmented-control-nav/segmented-control-nav.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"segmented-control-nav.js","sourceRoot":"","sources":["../../../../src/components/segmented-control-nav/segmented-control-nav.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAC1C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAmB,UAAU,EAAE,MAAM,eAAe,CAAC;AAS5D,MAAM,uBAAuB,GAAG,CAAC,KAAmC,EAAE,EAAE;IACtE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IAEpD,OAAO,CACL,oBAAC,cAAc,CAAC,IAAI,IAClB,SAAS,EAAC,6BAA6B,KACnC,SAAS,EACb,OAAO,EAAE,KAAK,EACd,WAAW,EAAC,YAAY;QAExB,oBAAC,cAAc,CAAC,IAAI,IAAC,SAAS,EAAE,UAAU,CAAC,WAAW,EAAE,8BAA8B,EAAE,SAAS,CAAC,IAC/F,QAAQ,CACW,CACF,CACvB,CAAC;AACJ,CAAC,CAAC;AACF,uBAAuB,CAAC,WAAW,GAAG,yBAAyB,CAAC;AAOhE,MAAM,uBAAuB,GAAG,CAAC,KAAmC,EAAE,EAAE;IACtE,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IAE7D,OAAO,CACL,oBAAC,cAAc,CAAC,IAAI,IAAC,SAAS,EAAC,6BAA6B;QAC1D,oBAAC,cAAc,CAAC,IAAI,OACd,SAAS,EACb,SAAS,EAAE,UAAU,CAAC,WAAW,EAAE,iCAAiC,EAAE,6BAA6B,EAAE,SAAS,CAAC;YAC/G,gEAAgE;YAChE,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,EAClB,OAAO,EAAE,OAAO,IAEf,UAAU,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,CAAC,QAAQ,EAAE,EAAE,CAAC,CAC/C,8BAAM,SAAS,EAAC,sCAAsC,IAAE,QAAQ,CAAQ,CACzE,CAAC,CACkB,CACF,CACvB,CAAC;AACJ,CAAC,CAAC;AAEF,uBAAuB,CAAC,WAAW,GAAG,yBAAyB,CAAC;AAEhE,OAAO,EAAE,uBAAuB,IAAI,IAAI,EAAE,uBAAuB,IAAI,IAAI,EAAE,CAAC"}

package/dist/esm/components/segmented-control-nav/segmented-control-nav.props.d.ts

@@ -0,0 +1,7 @@
+declare const segmentedControlNavLinkPropDefs: {
+    asChild: {
+        type: "boolean";
+        default: undefined;
+    };
+};
+export { segmentedControlNavLinkPropDefs };

package/dist/esm/components/segmented-control-nav/segmented-control-nav.props.js

@@ -0,0 +1,6 @@
+import { asChildProp } from '../../helpers';
+const segmentedControlNavLinkPropDefs = {
+    asChild: asChildProp,
+};
+export { segmentedControlNavLinkPropDefs };
+//# sourceMappingURL=segmented-control-nav.props.js.map

package/dist/esm/components/segmented-control-nav/segmented-control-nav.props.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"segmented-control-nav.props.js","sourceRoot":"","sources":["../../../../src/components/segmented-control-nav/segmented-control-nav.props.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,MAAM,+BAA+B,GAAG;IACtC,OAAO,EAAE,WAAW;CAGrB,CAAC;AAEF,OAAO,EAAE,+BAA+B,EAAE,CAAC"}

package/dist/esm/components/segmented-control-nav/segmented-control-nav.stories.d.ts

@@ -0,0 +1,18 @@
+import type { StoryObj } from '@storybook/react';
+import React from 'react';
+import { SegmentedControlNav } from '..';
+declare const meta: {
+    title: string;
+    component: {
+        (props: SegmentedControlNav.RootProps): React.JSX.Element;
+        displayName: string;
+    };
+    args: {};
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;