@nlabs/gothamui 1.8.0

package/lib/components/SelectField/SelectField.stories.js

@@ -0,0 +1,155 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { gothamColors } from '../../utils/colorUtils.js';
+import { interactWithCanvas } from '../../utils/storyInteractions.js';
+import { SelectField } from './SelectField.js';
+const meta = {
+    argTypes: {
+        color: {
+            control: 'select',
+            description: 'The color of the select field',
+            options: gothamColors
+        },
+        defaultValue: {
+            control: 'text',
+            description: 'The default selected value'
+        },
+        label: {
+            control: 'text',
+            description: 'The label text for the select field'
+        },
+        name: {
+            control: 'text',
+            description: 'The name of the select field'
+        },
+        options: {
+            control: 'object',
+            description: 'Array of select options'
+        }
+    },
+    component: SelectField,
+    decorators: [
+        (Story)=>/*#__PURE__*/ _jsx("div", {
+                className: "flex flex-col items-center justify-center min-h-screen w-full p-4",
+                style: {
+                    width: '300px'
+                },
+                children: /*#__PURE__*/ _jsx(Story, {})
+            })
+    ],
+    title: 'Components/Form/SelectField'
+};
+export default meta;
+const defaultOptions = [
+    {
+        id: 1,
+        label: 'First Option',
+        value: '1'
+    },
+    {
+        id: 2,
+        label: 'Second Option',
+        value: '2'
+    },
+    {
+        id: 3,
+        label: 'Third Option',
+        value: '3'
+    }
+];
+export const Default = {
+    args: {
+        label: 'Select an Option',
+        name: 'selectGroup',
+        options: defaultOptions
+    },
+    play: interactWithCanvas
+};
+export const WithDefaultValue = {
+    args: {
+        defaultValue: '2',
+        label: 'Select an Option',
+        name: 'selectGroupWithDefault',
+        options: defaultOptions
+    },
+    play: interactWithCanvas
+};
+export const WithIcons = {
+    args: {
+        label: 'Select a Category',
+        name: 'categorySelect',
+        options: [
+            {
+                icon: 'briefcase',
+                id: 1,
+                label: 'Work',
+                value: 'work'
+            },
+            {
+                icon: 'user',
+                id: 2,
+                label: 'Personal',
+                value: 'personal'
+            },
+            {
+                icon: 'shopping-cart',
+                id: 3,
+                label: 'Shopping',
+                value: 'shopping'
+            }
+        ]
+    },
+    play: interactWithCanvas
+};
+export const WithImages = {
+    args: {
+        label: 'Select a Country',
+        name: 'countrySelect',
+        options: [
+            {
+                id: 1,
+                image: 'https://flagcdn.com/w20/us.png',
+                label: 'United States',
+                value: 'us'
+            },
+            {
+                id: 2,
+                image: 'https://flagcdn.com/w20/gb.png',
+                label: 'United Kingdom',
+                value: 'gb'
+            },
+            {
+                id: 3,
+                image: 'https://flagcdn.com/w20/ca.png',
+                label: 'Canada',
+                value: 'ca'
+            }
+        ]
+    },
+    play: interactWithCanvas
+};
+export const WithLongLabels = {
+    args: {
+        label: 'Select a Plan',
+        name: 'planSelect',
+        options: [
+            {
+                id: 1,
+                label: 'Basic Plan - Perfect for individuals and small projects',
+                value: 'basic'
+            },
+            {
+                id: 2,
+                label: 'Professional Plan - Ideal for growing businesses with advanced features',
+                value: 'pro'
+            },
+            {
+                id: 3,
+                label: 'Enterprise Plan - Full-featured solution with dedicated support',
+                value: 'enterprise'
+            }
+        ]
+    },
+    play: interactWithCanvas
+};
+
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy9uaXRyb2c3L0RldmVsb3BtZW50L2dvdGhhbWpzL3NyYy9jb21wb25lbnRzL1NlbGVjdEZpZWxkL1NlbGVjdEZpZWxkLnN0b3JpZXMudHN4Il0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7Z290aGFtQ29sb3JzfSBmcm9tICcuLi8uLi91dGlscy9jb2xvclV0aWxzLmpzJztcbmltcG9ydCB7aW50ZXJhY3RXaXRoQ2FudmFzfSBmcm9tICcuLi8uLi91dGlscy9zdG9yeUludGVyYWN0aW9ucy5qcyc7XG5pbXBvcnQge1NlbGVjdEZpZWxkfSBmcm9tICcuL1NlbGVjdEZpZWxkLmpzJztcblxuaW1wb3J0IHR5cGUge01ldGEsIFN0b3J5T2JqfSBmcm9tICdAbmxhYnMvbGV4L3N0b3J5Ym9vayc7XG5cblxuY29uc3QgbWV0YTogTWV0YTx0eXBlb2YgU2VsZWN0RmllbGQ+ID0ge1xuICBhcmdUeXBlczoge1xuICAgIGNvbG9yOiB7XG4gICAgICBjb250cm9sOiAnc2VsZWN0JyxcbiAgICAgIGRlc2NyaXB0aW9uOiAnVGhlIGNvbG9yIG9mIHRoZSBzZWxlY3QgZmllbGQnLFxuICAgICAgb3B0aW9uczogZ290aGFtQ29sb3JzXG4gICAgfSxcbiAgICBkZWZhdWx0VmFsdWU6IHtcbiAgICAgIGNvbnRyb2w6ICd0ZXh0JyxcbiAgICAgIGRlc2NyaXB0aW9uOiAnVGhlIGRlZmF1bHQgc2VsZWN0ZWQgdmFsdWUnXG4gICAgfSxcbiAgICBsYWJlbDoge1xuICAgICAgY29udHJvbDogJ3RleHQnLFxuICAgICAgZGVzY3JpcHRpb246ICdUaGUgbGFiZWwgdGV4dCBmb3IgdGhlIHNlbGVjdCBmaWVsZCdcbiAgICB9LFxuICAgIG5hbWU6IHtcbiAgICAgIGNvbnRyb2w6ICd0ZXh0JyxcbiAgICAgIGRlc2NyaXB0aW9uOiAnVGhlIG5hbWUgb2YgdGhlIHNlbGVjdCBmaWVsZCdcbiAgICB9LFxuICAgIG9wdGlvbnM6IHtcbiAgICAgIGNvbnRyb2w6ICdvYmplY3QnLFxuICAgICAgZGVzY3JpcHRpb246ICdBcnJheSBvZiBzZWxlY3Qgb3B0aW9ucydcbiAgICB9XG4gIH0sXG4gIGNvbXBvbmVudDogU2VsZWN0RmllbGQsXG4gIGRlY29yYXRvcnM6IFtcbiAgICAoU3RvcnkpID0+IChcbiAgICAgIDxkaXYgY2xhc3NOYW1lPVwiZmxleCBmbGV4LWNvbCBpdGVtcy1jZW50ZXIganVzdGlmeS1jZW50ZXIgbWluLWgtc2NyZWVuIHctZnVsbCBwLTRcIiBzdHlsZT17e3dpZHRoOiAnMzAwcHgnfX0+XG4gICAgICAgIDxTdG9yeSAvPlxuICAgICAgPC9kaXY+XG4gICAgKVxuICBdLFxuICB0aXRsZTogJ0NvbXBvbmVudHMvRm9ybS9TZWxlY3RGaWVsZCdcbn07XG5cbmV4cG9ydCBkZWZhdWx0IG1ldGE7XG50eXBlIFN0b3J5ID0gU3RvcnlPYmo8dHlwZW9mIFNlbGVjdEZpZWxkPjtcblxuY29uc3QgZGVmYXVsdE9wdGlvbnMgPSBbXG4gIHtcbiAgICBpZDogMSxcbiAgICBsYWJlbDogJ0ZpcnN0IE9wdGlvbicsXG4gICAgdmFsdWU6ICcxJ1xuICB9LFxuICB7XG4gICAgaWQ6IDIsXG4gICAgbGFiZWw6ICdTZWNvbmQgT3B0aW9uJyxcbiAgICB2YWx1ZTogJzInXG4gIH0sXG4gIHtcbiAgICBpZDogMyxcbiAgICBsYWJlbDogJ1RoaXJkIE9wdGlvbicsXG4gICAgdmFsdWU6ICczJ1xuICB9XG5dO1xuXG5leHBvcnQgY29uc3QgRGVmYXVsdDogU3RvcnkgPSB7XG4gIGFyZ3M6IHtcbiAgICBsYWJlbDogJ1NlbGVjdCBhbiBPcHRpb24nLFxuICAgIG5hbWU6ICdzZWxlY3RHcm91cCcsXG4gICAgb3B0aW9uczogZGVmYXVsdE9wdGlvbnNcbiAgfSxcbiAgcGxheTogaW50ZXJhY3RXaXRoQ2FudmFzXG59O1xuXG5leHBvcnQgY29uc3QgV2l0aERlZmF1bHRWYWx1ZTogU3RvcnkgPSB7XG4gIGFyZ3M6IHtcbiAgICBkZWZhdWx0VmFsdWU6ICcyJyxcbiAgICBsYWJlbDogJ1NlbGVjdCBhbiBPcHRpb24nLFxuICAgIG5hbWU6ICdzZWxlY3RHcm91cFdpdGhEZWZhdWx0JyxcbiAgICBvcHRpb25zOiBkZWZhdWx0T3B0aW9uc1xuICB9LFxuICBwbGF5OiBpbnRlcmFjdFdpdGhDYW52YXNcbn07XG5cbmV4cG9ydCBjb25zdCBXaXRoSWNvbnM6IFN0b3J5ID0ge1xuICBhcmdzOiB7XG4gICAgbGFiZWw6ICdTZWxlY3QgYSBDYXRlZ29yeScsXG4gICAgbmFtZTogJ2NhdGVnb3J5U2VsZWN0JyxcbiAgICBvcHRpb25zOiBbXG4gICAgICB7XG4gICAgICAgIGljb246ICdicmllZmNhc2UnLFxuICAgICAgICBpZDogMSxcbiAgICAgICAgbGFiZWw6ICdXb3JrJyxcbiAgICAgICAgdmFsdWU6ICd3b3JrJ1xuICAgICAgfSxcbiAgICAgIHtcbiAgICAgICAgaWNvbjogJ3VzZXInLFxuICAgICAgICBpZDogMixcbiAgICAgICAgbGFiZWw6ICdQZXJzb25hbCcsXG4gICAgICAgIHZhbHVlOiAncGVyc29uYWwnXG4gICAgICB9LFxuICAgICAge1xuICAgICAgICBpY29uOiAnc2hvcHBpbmctY2FydCcsXG4gICAgICAgIGlkOiAzLFxuICAgICAgICBsYWJlbDogJ1Nob3BwaW5nJyxcbiAgICAgICAgdmFsdWU6ICdzaG9wcGluZydcbiAgICAgIH1cbiAgICBdXG4gIH0sXG4gIHBsYXk6IGludGVyYWN0V2l0aENhbnZhc1xufTtcblxuZXhwb3J0IGNvbnN0IFdpdGhJbWFnZXM6IFN0b3J5ID0ge1xuICBhcmdzOiB7XG4gICAgbGFiZWw6ICdTZWxlY3QgYSBDb3VudHJ5JyxcbiAgICBuYW1lOiAnY291bnRyeVNlbGVjdCcsXG4gICAgb3B0aW9uczogW1xuICAgICAge1xuICAgICAgICBpZDogMSxcbiAgICAgICAgaW1hZ2U6ICdodHRwczovL2ZsYWdjZG4uY29tL3cyMC91cy5wbmcnLFxuICAgICAgICBsYWJlbDogJ1VuaXRlZCBTdGF0ZXMnLFxuICAgICAgICB2YWx1ZTogJ3VzJ1xuICAgICAgfSxcbiAgICAgIHtcbiAgICAgICAgaWQ6IDIsXG4gICAgICAgIGltYWdlOiAnaHR0cHM6Ly9mbGFnY2RuLmNvbS93MjAvZ2IucG5nJyxcbiAgICAgICAgbGFiZWw6ICdVbml0ZWQgS2luZ2RvbScsXG4gICAgICAgIHZhbHVlOiAnZ2InXG4gICAgICB9LFxuICAgICAge1xuICAgICAgICBpZDogMyxcbiAgICAgICAgaW1hZ2U6ICdodHRwczovL2ZsYWdjZG4uY29tL3cyMC9jYS5wbmcnLFxuICAgICAgICBsYWJlbDogJ0NhbmFkYScsXG4gICAgICAgIHZhbHVlOiAnY2EnXG4gICAgICB9XG4gICAgXVxuICB9LFxuICBwbGF5OiBpbnRlcmFjdFdpdGhDYW52YXNcbn07XG5cbmV4cG9ydCBjb25zdCBXaXRoTG9uZ0xhYmVsczogU3RvcnkgPSB7XG4gIGFyZ3M6IHtcbiAgICBsYWJlbDogJ1NlbGVjdCBhIFBsYW4nLFxuICAgIG5hbWU6ICdwbGFuU2VsZWN0JyxcbiAgICBvcHRpb25zOiBbXG4gICAgICB7XG4gICAgICAgIGlkOiAxLFxuICAgICAgICBsYWJlbDogJ0Jhc2ljIFBsYW4gLSBQZXJmZWN0IGZvciBpbmRpdmlkdWFscyBhbmQgc21hbGwgcHJvamVjdHMnLFxuICAgICAgICB2YWx1ZTogJ2Jhc2ljJ1xuICAgICAgfSxcbiAgICAgIHtcbiAgICAgICAgaWQ6IDIsXG4gICAgICAgIGxhYmVsOiAnUHJvZmVzc2lvbmFsIFBsYW4gLSBJZGVhbCBmb3IgZ3Jvd2luZyBidXNpbmVzc2VzIHdpdGggYWR2YW5jZWQgZmVhdHVyZXMnLFxuICAgICAgICB2YWx1ZTogJ3BybydcbiAgICAgIH0sXG4gICAgICB7XG4gICAgICAgIGlkOiAzLFxuICAgICAgICBsYWJlbDogJ0VudGVycHJpc2UgUGxhbiAtIEZ1bGwtZmVhdHVyZWQgc29sdXRpb24gd2l0aCBkZWRpY2F0ZWQgc3VwcG9ydCcsXG4gICAgICAgIHZhbHVlOiAnZW50ZXJwcmlzZSdcbiAgICAgIH1cbiAgICBdXG4gIH0sXG4gIHBsYXk6IGludGVyYWN0V2l0aENhbnZhc1xufTtcbiJdLCJuYW1lcyI6WyJnb3RoYW1Db2xvcnMiLCJpbnRlcmFjdFdpdGhDYW52YXMiLCJTZWxlY3RGaWVsZCIsIm1ldGEiLCJhcmdUeXBlcyIsImNvbG9yIiwiY29udHJvbCIsImRlc2NyaXB0aW9uIiwib3B0aW9ucyIsImRlZmF1bHRWYWx1ZSIsImxhYmVsIiwibmFtZSIsImNvbXBvbmVudCIsImRlY29yYXRvcnMiLCJTdG9yeSIsImRpdiIsImNsYXNzTmFtZSIsInN0eWxlIiwid2lkdGgiLCJ0aXRsZSIsImRlZmF1bHRPcHRpb25zIiwiaWQiLCJ2YWx1ZSIsIkRlZmF1bHQiLCJhcmdzIiwicGxheSIsIldpdGhEZWZhdWx0VmFsdWUiLCJXaXRoSWNvbnMiLCJpY29uIiwiV2l0aEltYWdlcyIsImltYWdlIiwiV2l0aExvbmdMYWJlbHMiXSwibWFwcGluZ3MiOiI7QUFBQSxTQUFRQSxZQUFZLFFBQU8sNEJBQTRCO0FBQ3ZELFNBQVFDLGtCQUFrQixRQUFPLG1DQUFtQztBQUNwRSxTQUFRQyxXQUFXLFFBQU8sbUJBQW1CO0FBSzdDLE1BQU1DLE9BQWlDO0lBQ3JDQyxVQUFVO1FBQ1JDLE9BQU87WUFDTEMsU0FBUztZQUNUQyxhQUFhO1lBQ2JDLFNBQVNSO1FBQ1g7UUFDQVMsY0FBYztZQUNaSCxTQUFTO1lBQ1RDLGFBQWE7UUFDZjtRQUNBRyxPQUFPO1lBQ0xKLFNBQVM7WUFDVEMsYUFBYTtRQUNmO1FBQ0FJLE1BQU07WUFDSkwsU0FBUztZQUNUQyxhQUFhO1FBQ2Y7UUFDQUMsU0FBUztZQUNQRixTQUFTO1lBQ1RDLGFBQWE7UUFDZjtJQUNGO0lBQ0FLLFdBQVdWO0lBQ1hXLFlBQVk7UUFDVixDQUFDQyxzQkFDQyxLQUFDQztnQkFBSUMsV0FBVTtnQkFBb0VDLE9BQU87b0JBQUNDLE9BQU87Z0JBQU87MEJBQ3ZHLGNBQUEsS0FBQ0o7O0tBR047SUFDREssT0FBTztBQUNUO0FBRUEsZUFBZWhCLEtBQUs7QUFHcEIsTUFBTWlCLGlCQUFpQjtJQUNyQjtRQUNFQyxJQUFJO1FBQ0pYLE9BQU87UUFDUFksT0FBTztJQUNUO0lBQ0E7UUFDRUQsSUFBSTtRQUNKWCxPQUFPO1FBQ1BZLE9BQU87SUFDVDtJQUNBO1FBQ0VELElBQUk7UUFDSlgsT0FBTztRQUNQWSxPQUFPO0lBQ1Q7Q0FDRDtBQUVELE9BQU8sTUFBTUMsVUFBaUI7SUFDNUJDLE1BQU07UUFDSmQsT0FBTztRQUNQQyxNQUFNO1FBQ05ILFNBQVNZO0lBQ1g7SUFDQUssTUFBTXhCO0FBQ1IsRUFBRTtBQUVGLE9BQU8sTUFBTXlCLG1CQUEwQjtJQUNyQ0YsTUFBTTtRQUNKZixjQUFjO1FBQ2RDLE9BQU87UUFDUEMsTUFBTTtRQUNOSCxTQUFTWTtJQUNYO0lBQ0FLLE1BQU14QjtBQUNSLEVBQUU7QUFFRixPQUFPLE1BQU0wQixZQUFtQjtJQUM5QkgsTUFBTTtRQUNKZCxPQUFPO1FBQ1BDLE1BQU07UUFDTkgsU0FBUztZQUNQO2dCQUNFb0IsTUFBTTtnQkFDTlAsSUFBSTtnQkFDSlgsT0FBTztnQkFDUFksT0FBTztZQUNUO1lBQ0E7Z0JBQ0VNLE1BQU07Z0JBQ05QLElBQUk7Z0JBQ0pYLE9BQU87Z0JBQ1BZLE9BQU87WUFDVDtZQUNBO2dCQUNFTSxNQUFNO2dCQUNOUCxJQUFJO2dCQUNKWCxPQUFPO2dCQUNQWSxPQUFPO1lBQ1Q7U0FDRDtJQUNIO0lBQ0FHLE1BQU14QjtBQUNSLEVBQUU7QUFFRixPQUFPLE1BQU00QixhQUFvQjtJQUMvQkwsTUFBTTtRQUNKZCxPQUFPO1FBQ1BDLE1BQU07UUFDTkgsU0FBUztZQUNQO2dCQUNFYSxJQUFJO2dCQUNKUyxPQUFPO2dCQUNQcEIsT0FBTztnQkFDUFksT0FBTztZQUNUO1lBQ0E7Z0JBQ0VELElBQUk7Z0JBQ0pTLE9BQU87Z0JBQ1BwQixPQUFPO2dCQUNQWSxPQUFPO1lBQ1Q7WUFDQTtnQkFDRUQsSUFBSTtnQkFDSlMsT0FBTztnQkFDUHBCLE9BQU87Z0JBQ1BZLE9BQU87WUFDVDtTQUNEO0lBQ0g7SUFDQUcsTUFBTXhCO0FBQ1IsRUFBRTtBQUVGLE9BQU8sTUFBTThCLGlCQUF3QjtJQUNuQ1AsTUFBTTtRQUNKZCxPQUFPO1FBQ1BDLE1BQU07UUFDTkgsU0FBUztZQUNQO2dCQUNFYSxJQUFJO2dCQUNKWCxPQUFPO2dCQUNQWSxPQUFPO1lBQ1Q7WUFDQTtnQkFDRUQsSUFBSTtnQkFDSlgsT0FBTztnQkFDUFksT0FBTztZQUNUO1lBQ0E7Z0JBQ0VELElBQUk7Z0JBQ0pYLE9BQU87Z0JBQ1BZLE9BQU87WUFDVDtTQUNEO0lBQ0g7SUFDQUcsTUFBTXhCO0FBQ1IsRUFBRSJ9

package/lib/components/SelectField/SelectOption.d.ts

@@ -0,0 +1,13 @@
+export type SelectFieldOption = {
+    readonly icon?: string;
+    readonly id?: number | string;
+    readonly image?: string;
+    readonly label: string;
+    readonly value: string | number | boolean;
+};
+export type SelectOptionProps = {
+    readonly option: SelectFieldOption;
+};
+declare const SelectOptionComponent: ({ option }: SelectOptionProps) => import("react").JSX.Element;
+export declare const SelectOption: import("react").MemoExoticComponent<typeof SelectOptionComponent>;
+export {};

package/lib/components/SelectField/SelectOption.js

@@ -0,0 +1,40 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ListboxOption } from '@headlessui/react';
+import { Check } from 'lucide-react';
+import { memo } from 'react';
+import { Svg } from '../Svg/Svg.js';
+const SelectOptionComponent = ({ option })=>/*#__PURE__*/ _jsxs(ListboxOption, {
+        className: "group relative cursor-default py-2 pr-9 pl-3 text-gray-900 select-none data-focus:bg-indigo-600 data-focus:text-white data-focus:outline-hidden",
+        value: String(option.value),
+        children: [
+            /*#__PURE__*/ _jsxs("div", {
+                className: "flex items-center",
+                children: [
+                    option.icon && /*#__PURE__*/ _jsx(Svg, {
+                        className: "size-5 shrink-0 rounded-full",
+                        name: option.icon
+                    }),
+                    option.image && /*#__PURE__*/ _jsx("img", {
+                        alt: "",
+                        className: "size-5 shrink-0 rounded-full",
+                        src: option.image
+                    }),
+                    /*#__PURE__*/ _jsx("span", {
+                        className: "ml-3 block truncate font-normal group-data-selected:font-semibold",
+                        children: option.label
+                    })
+                ]
+            }),
+            /*#__PURE__*/ _jsx("span", {
+                className: "absolute inset-y-0 right-0 flex items-center pr-4 text-indigo-600 group-not-data-selected:hidden group-data-focus:text-white",
+                children: /*#__PURE__*/ _jsx(Check, {
+                    "aria-hidden": "true",
+                    className: "size-5"
+                })
+            })
+        ]
+    }, option.id || option.label);
+export const SelectOption = /*#__PURE__*/ memo(SelectOptionComponent);
+SelectOption.displayName = 'SelectOption';
+
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy9uaXRyb2c3L0RldmVsb3BtZW50L2dvdGhhbWpzL3NyYy9jb21wb25lbnRzL1NlbGVjdEZpZWxkL1NlbGVjdE9wdGlvbi50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtMaXN0Ym94T3B0aW9ufSBmcm9tICdAaGVhZGxlc3N1aS9yZWFjdCc7XG5pbXBvcnQge0NoZWNrfSBmcm9tICdsdWNpZGUtcmVhY3QnO1xuaW1wb3J0IHttZW1vfSBmcm9tICdyZWFjdCc7XG5cbmltcG9ydCB7U3ZnfSBmcm9tICcuLi9TdmcvU3ZnLmpzJztcblxuZXhwb3J0IHR5cGUgU2VsZWN0RmllbGRPcHRpb24gPSB7XG4gIHJlYWRvbmx5IGljb24/OiBzdHJpbmc7XG4gIHJlYWRvbmx5IGlkPzogbnVtYmVyIHwgc3RyaW5nO1xuICByZWFkb25seSBpbWFnZT86IHN0cmluZztcbiAgcmVhZG9ubHkgbGFiZWw6IHN0cmluZztcbiAgcmVhZG9ubHkgdmFsdWU6IHN0cmluZyB8IG51bWJlciB8IGJvb2xlYW47XG59O1xuXG5leHBvcnQgdHlwZSBTZWxlY3RPcHRpb25Qcm9wcyA9IHtcbiAgcmVhZG9ubHkgb3B0aW9uOiBTZWxlY3RGaWVsZE9wdGlvbjtcbn07XG5jb25zdCBTZWxlY3RPcHRpb25Db21wb25lbnQgPSAoe29wdGlvbn06IFNlbGVjdE9wdGlvblByb3BzKSA9PiAoXG4gIDxMaXN0Ym94T3B0aW9uXG4gICAgY2xhc3NOYW1lPVwiZ3JvdXAgcmVsYXRpdmUgY3Vyc29yLWRlZmF1bHQgcHktMiBwci05IHBsLTMgdGV4dC1ncmF5LTkwMCBzZWxlY3Qtbm9uZSBkYXRhLWZvY3VzOmJnLWluZGlnby02MDAgZGF0YS1mb2N1czp0ZXh0LXdoaXRlIGRhdGEtZm9jdXM6b3V0bGluZS1oaWRkZW5cIlxuICAgIGtleT17b3B0aW9uLmlkIHx8IG9wdGlvbi5sYWJlbH1cbiAgICB2YWx1ZT17U3RyaW5nKG9wdGlvbi52YWx1ZSl9XG4gID5cbiAgICA8ZGl2IGNsYXNzTmFtZT1cImZsZXggaXRlbXMtY2VudGVyXCI+XG4gICAgICB7b3B0aW9uLmljb24gJiYgPFN2ZyBjbGFzc05hbWU9XCJzaXplLTUgc2hyaW5rLTAgcm91bmRlZC1mdWxsXCIgbmFtZT17b3B0aW9uLmljb259IC8+fVxuICAgICAge29wdGlvbi5pbWFnZSAmJiA8aW1nIGFsdD1cIlwiIGNsYXNzTmFtZT1cInNpemUtNSBzaHJpbmstMCByb3VuZGVkLWZ1bGxcIiBzcmM9e29wdGlvbi5pbWFnZX0gLz59XG4gICAgICA8c3BhbiBjbGFzc05hbWU9XCJtbC0zIGJsb2NrIHRydW5jYXRlIGZvbnQtbm9ybWFsIGdyb3VwLWRhdGEtc2VsZWN0ZWQ6Zm9udC1zZW1pYm9sZFwiPntvcHRpb24ubGFiZWx9PC9zcGFuPlxuICAgIDwvZGl2PlxuXG4gICAgPHNwYW4gY2xhc3NOYW1lPVwiYWJzb2x1dGUgaW5zZXQteS0wIHJpZ2h0LTAgZmxleCBpdGVtcy1jZW50ZXIgcHItNCB0ZXh0LWluZGlnby02MDAgZ3JvdXAtbm90LWRhdGEtc2VsZWN0ZWQ6aGlkZGVuIGdyb3VwLWRhdGEtZm9jdXM6dGV4dC13aGl0ZVwiPlxuICAgICAgPENoZWNrIGFyaWEtaGlkZGVuPVwidHJ1ZVwiIGNsYXNzTmFtZT1cInNpemUtNVwiIC8+XG4gICAgPC9zcGFuPlxuICA8L0xpc3Rib3hPcHRpb24+XG4pO1xuXG5leHBvcnQgY29uc3QgU2VsZWN0T3B0aW9uID0gbWVtbyhTZWxlY3RPcHRpb25Db21wb25lbnQpO1xuU2VsZWN0T3B0aW9uLmRpc3BsYXlOYW1lID0gJ1NlbGVjdE9wdGlvbic7XG4iXSwibmFtZXMiOlsiTGlzdGJveE9wdGlvbiIsIkNoZWNrIiwibWVtbyIsIlN2ZyIsIlNlbGVjdE9wdGlvbkNvbXBvbmVudCIsIm9wdGlvbiIsImNsYXNzTmFtZSIsInZhbHVlIiwiU3RyaW5nIiwiZGl2IiwiaWNvbiIsIm5hbWUiLCJpbWFnZSIsImltZyIsImFsdCIsInNyYyIsInNwYW4iLCJsYWJlbCIsImFyaWEtaGlkZGVuIiwiaWQiLCJTZWxlY3RPcHRpb24iLCJkaXNwbGF5TmFtZSJdLCJtYXBwaW5ncyI6IjtBQUFBLFNBQVFBLGFBQWEsUUFBTyxvQkFBb0I7QUFDaEQsU0FBUUMsS0FBSyxRQUFPLGVBQWU7QUFDbkMsU0FBUUMsSUFBSSxRQUFPLFFBQVE7QUFFM0IsU0FBUUMsR0FBRyxRQUFPLGdCQUFnQjtBQWFsQyxNQUFNQyx3QkFBd0IsQ0FBQyxFQUFDQyxNQUFNLEVBQW9CLGlCQUN4RCxNQUFDTDtRQUNDTSxXQUFVO1FBRVZDLE9BQU9DLE9BQU9ILE9BQU9FLEtBQUs7OzBCQUUxQixNQUFDRTtnQkFBSUgsV0FBVTs7b0JBQ1pELE9BQU9LLElBQUksa0JBQUksS0FBQ1A7d0JBQUlHLFdBQVU7d0JBQStCSyxNQUFNTixPQUFPSyxJQUFJOztvQkFDOUVMLE9BQU9PLEtBQUssa0JBQUksS0FBQ0M7d0JBQUlDLEtBQUk7d0JBQUdSLFdBQVU7d0JBQStCUyxLQUFLVixPQUFPTyxLQUFLOztrQ0FDdkYsS0FBQ0k7d0JBQUtWLFdBQVU7a0NBQXFFRCxPQUFPWSxLQUFLOzs7OzBCQUduRyxLQUFDRDtnQkFBS1YsV0FBVTswQkFDZCxjQUFBLEtBQUNMO29CQUFNaUIsZUFBWTtvQkFBT1osV0FBVTs7OztPQVZqQ0QsT0FBT2MsRUFBRSxJQUFJZCxPQUFPWSxLQUFLO0FBZWxDLE9BQU8sTUFBTUcsNkJBQWVsQixLQUFLRSx1QkFBdUI7QUFDeERnQixhQUFhQyxXQUFXLEdBQUcifQ==

package/lib/components/SelectField/SelectOption.stories.js

@@ -0,0 +1,40 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Listbox } from '@headlessui/react';
+import React from 'react';
+import { interactWithCanvas } from '../../utils/storyInteractions.js';
+import { SelectOption } from './SelectOption.js';
+const meta = {
+    argTypes: {
+        option: {
+            control: 'object'
+        }
+    },
+    component: SelectOption,
+    parameters: {
+        layout: 'centered'
+    },
+    title: 'Components/Form/SelectOption'
+};
+export default meta;
+export const Default = {
+    args: {
+        option: {
+            id: 'docs',
+            label: 'Documentation',
+            value: 'docs'
+        }
+    },
+    play: interactWithCanvas,
+    render: (args)=>/*#__PURE__*/ _jsx(Listbox, {
+            value: args.option,
+            children: /*#__PURE__*/ _jsx(Listbox.Options, {
+                static: true,
+                className: "w-64 rounded-md border bg-white p-1 shadow",
+                children: /*#__PURE__*/ _jsx(SelectOption, {
+                    ...args
+                })
+            })
+        })
+};
+
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy9uaXRyb2c3L0RldmVsb3BtZW50L2dvdGhhbWpzL3NyYy9jb21wb25lbnRzL1NlbGVjdEZpZWxkL1NlbGVjdE9wdGlvbi5zdG9yaWVzLnRzeCJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge0xpc3Rib3h9IGZyb20gJ0BoZWFkbGVzc3VpL3JlYWN0JztcbmltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCc7XG5cbmltcG9ydCB7aW50ZXJhY3RXaXRoQ2FudmFzfSBmcm9tICcuLi8uLi91dGlscy9zdG9yeUludGVyYWN0aW9ucy5qcyc7XG5pbXBvcnQge1NlbGVjdE9wdGlvbn0gZnJvbSAnLi9TZWxlY3RPcHRpb24uanMnO1xuXG5pbXBvcnQgdHlwZSB7TWV0YSwgU3RvcnlPYmp9IGZyb20gJ0BubGFicy9sZXgvc3Rvcnlib29rJztcblxuY29uc3QgbWV0YTogTWV0YTx0eXBlb2YgU2VsZWN0T3B0aW9uPiA9IHtcbiAgYXJnVHlwZXM6IHtcbiAgICBvcHRpb246IHtcbiAgICAgIGNvbnRyb2w6ICdvYmplY3QnXG4gICAgfVxuICB9LFxuICBjb21wb25lbnQ6IFNlbGVjdE9wdGlvbixcbiAgcGFyYW1ldGVyczoge1xuICAgIGxheW91dDogJ2NlbnRlcmVkJ1xuICB9LFxuICB0aXRsZTogJ0NvbXBvbmVudHMvRm9ybS9TZWxlY3RPcHRpb24nXG59O1xuXG5leHBvcnQgZGVmYXVsdCBtZXRhO1xuXG50eXBlIFN0b3J5ID0gU3RvcnlPYmo8dHlwZW9mIFNlbGVjdE9wdGlvbj47XG5cbmV4cG9ydCBjb25zdCBEZWZhdWx0OiBTdG9yeSA9IHtcbiAgYXJnczoge1xuICAgIG9wdGlvbjoge1xuICAgICAgaWQ6ICdkb2NzJyxcbiAgICAgIGxhYmVsOiAnRG9jdW1lbnRhdGlvbicsXG4gICAgICB2YWx1ZTogJ2RvY3MnXG4gICAgfVxuICB9LFxuICBwbGF5OiBpbnRlcmFjdFdpdGhDYW52YXMsXG4gIHJlbmRlcjogKGFyZ3MpID0+IChcbiAgICA8TGlzdGJveCB2YWx1ZT17YXJncy5vcHRpb259PlxuICAgICAgPExpc3Rib3guT3B0aW9ucyBzdGF0aWMgY2xhc3NOYW1lPVwidy02NCByb3VuZGVkLW1kIGJvcmRlciBiZy13aGl0ZSBwLTEgc2hhZG93XCI+XG4gICAgICAgIDxTZWxlY3RPcHRpb24gey4uLmFyZ3N9IC8+XG4gICAgICA8L0xpc3Rib3guT3B0aW9ucz5cbiAgICA8L0xpc3Rib3g+XG4gIClcbn07XG4iXSwibmFtZXMiOlsiTGlzdGJveCIsIlJlYWN0IiwiaW50ZXJhY3RXaXRoQ2FudmFzIiwiU2VsZWN0T3B0aW9uIiwibWV0YSIsImFyZ1R5cGVzIiwib3B0aW9uIiwiY29udHJvbCIsImNvbXBvbmVudCIsInBhcmFtZXRlcnMiLCJsYXlvdXQiLCJ0aXRsZSIsIkRlZmF1bHQiLCJhcmdzIiwiaWQiLCJsYWJlbCIsInZhbHVlIiwicGxheSIsInJlbmRlciIsIk9wdGlvbnMiLCJzdGF0aWMiLCJjbGFzc05hbWUiXSwibWFwcGluZ3MiOiI7QUFBQSxTQUFRQSxPQUFPLFFBQU8sb0JBQW9CO0FBQzFDLE9BQU9DLFdBQVcsUUFBUTtBQUUxQixTQUFRQyxrQkFBa0IsUUFBTyxtQ0FBbUM7QUFDcEUsU0FBUUMsWUFBWSxRQUFPLG9CQUFvQjtBQUkvQyxNQUFNQyxPQUFrQztJQUN0Q0MsVUFBVTtRQUNSQyxRQUFRO1lBQ05DLFNBQVM7UUFDWDtJQUNGO0lBQ0FDLFdBQVdMO0lBQ1hNLFlBQVk7UUFDVkMsUUFBUTtJQUNWO0lBQ0FDLE9BQU87QUFDVDtBQUVBLGVBQWVQLEtBQUs7QUFJcEIsT0FBTyxNQUFNUSxVQUFpQjtJQUM1QkMsTUFBTTtRQUNKUCxRQUFRO1lBQ05RLElBQUk7WUFDSkMsT0FBTztZQUNQQyxPQUFPO1FBQ1Q7SUFDRjtJQUNBQyxNQUFNZjtJQUNOZ0IsUUFBUSxDQUFDTCxxQkFDUCxLQUFDYjtZQUFRZ0IsT0FBT0gsS0FBS1AsTUFBTTtzQkFDekIsY0FBQSxLQUFDTixRQUFRbUIsT0FBTztnQkFBQ0MsTUFBTTtnQkFBQ0MsV0FBVTswQkFDaEMsY0FBQSxLQUFDbEI7b0JBQWMsR0FBR1UsSUFBSTs7OztBQUk5QixFQUFFIn0=

package/lib/components/Separator/Separator.d.ts

@@ -0,0 +1,6 @@
+import type { HTMLAttributes } from 'react';
+export interface SeparatorProps extends HTMLAttributes<HTMLDivElement> {
+    readonly decorative?: boolean;
+    readonly orientation?: 'horizontal' | 'vertical';
+}
+export declare const Separator: ({ 'aria-orientation': ariaOrientation, className, decorative, orientation, role, ...props }: SeparatorProps) => import("react").JSX.Element;

package/lib/components/Separator/Separator.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from '@nlabs/utils';
+export const Separator = ({ 'aria-orientation': ariaOrientation, className, decorative = true, orientation = 'horizontal', role, ...props })=>/*#__PURE__*/ _jsx("div", {
+        "aria-hidden": decorative ? true : undefined,
+        "aria-orientation": ariaOrientation ?? orientation,
+        className: cn('shrink-0 bg-border', orientation === 'horizontal' ? 'h-px w-full' : 'h-full w-px', className),
+        "data-orientation": orientation,
+        "data-slot": "separator",
+        role: role ?? (decorative ? 'presentation' : 'separator'),
+        ...props
+    });
+
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy9uaXRyb2c3L0RldmVsb3BtZW50L2dvdGhhbWpzL3NyYy9jb21wb25lbnRzL1NlcGFyYXRvci9TZXBhcmF0b3IudHN4Il0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7Y259IGZyb20gJ0BubGFicy91dGlscyc7XG5cbmltcG9ydCB0eXBlIHtIVE1MQXR0cmlidXRlc30gZnJvbSAncmVhY3QnO1xuXG5leHBvcnQgaW50ZXJmYWNlIFNlcGFyYXRvclByb3BzIGV4dGVuZHMgSFRNTEF0dHJpYnV0ZXM8SFRNTERpdkVsZW1lbnQ+IHtcbiAgcmVhZG9ubHkgZGVjb3JhdGl2ZT86IGJvb2xlYW47XG4gIHJlYWRvbmx5IG9yaWVudGF0aW9uPzogJ2hvcml6b250YWwnIHwgJ3ZlcnRpY2FsJztcbn1cblxuZXhwb3J0IGNvbnN0IFNlcGFyYXRvciA9ICh7XG4gICdhcmlhLW9yaWVudGF0aW9uJzogYXJpYU9yaWVudGF0aW9uLFxuICBjbGFzc05hbWUsXG4gIGRlY29yYXRpdmUgPSB0cnVlLFxuICBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcbiAgcm9sZSxcbiAgLi4ucHJvcHNcbn06IFNlcGFyYXRvclByb3BzKSA9PiAoXG4gIDxkaXZcbiAgICBhcmlhLWhpZGRlbj17ZGVjb3JhdGl2ZSA/IHRydWUgOiB1bmRlZmluZWR9XG4gICAgYXJpYS1vcmllbnRhdGlvbj17YXJpYU9yaWVudGF0aW9uID8/IG9yaWVudGF0aW9ufVxuICAgIGNsYXNzTmFtZT17Y24oXG4gICAgICAnc2hyaW5rLTAgYmctYm9yZGVyJyxcbiAgICAgIG9yaWVudGF0aW9uID09PSAnaG9yaXpvbnRhbCcgPyAnaC1weCB3LWZ1bGwnIDogJ2gtZnVsbCB3LXB4JyxcbiAgICAgIGNsYXNzTmFtZVxuICAgICl9XG4gICAgZGF0YS1vcmllbnRhdGlvbj17b3JpZW50YXRpb259XG4gICAgZGF0YS1zbG90PVwic2VwYXJhdG9yXCJcbiAgICByb2xlPXtyb2xlID8/IChkZWNvcmF0aXZlID8gJ3ByZXNlbnRhdGlvbicgOiAnc2VwYXJhdG9yJyl9XG4gICAgey4uLnByb3BzfVxuICAvPlxuKTtcbiJdLCJuYW1lcyI6WyJjbiIsIlNlcGFyYXRvciIsImFyaWFPcmllbnRhdGlvbiIsImNsYXNzTmFtZSIsImRlY29yYXRpdmUiLCJvcmllbnRhdGlvbiIsInJvbGUiLCJwcm9wcyIsImRpdiIsImFyaWEtaGlkZGVuIiwidW5kZWZpbmVkIiwiYXJpYS1vcmllbnRhdGlvbiIsImRhdGEtb3JpZW50YXRpb24iLCJkYXRhLXNsb3QiXSwibWFwcGluZ3MiOiI7QUFBQSxTQUFRQSxFQUFFLFFBQU8sZUFBZTtBQVNoQyxPQUFPLE1BQU1DLFlBQVksQ0FBQyxFQUN4QixvQkFBb0JDLGVBQWUsRUFDbkNDLFNBQVMsRUFDVEMsYUFBYSxJQUFJLEVBQ2pCQyxjQUFjLFlBQVksRUFDMUJDLElBQUksRUFDSixHQUFHQyxPQUNZLGlCQUNmLEtBQUNDO1FBQ0NDLGVBQWFMLGFBQWEsT0FBT007UUFDakNDLG9CQUFrQlQsbUJBQW1CRztRQUNyQ0YsV0FBV0gsR0FDVCxzQkFDQUssZ0JBQWdCLGVBQWUsZ0JBQWdCLGVBQy9DRjtRQUVGUyxvQkFBa0JQO1FBQ2xCUSxhQUFVO1FBQ1ZQLE1BQU1BLFFBQVNGLENBQUFBLGFBQWEsaUJBQWlCLFdBQVU7UUFDdEQsR0FBR0csS0FBSztPQUVYIn0=

package/lib/components/Separator/Separator.stories.js

@@ -0,0 +1,70 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { focusCanvas } from '../../utils/storyInteractions.js';
+import { Separator } from './Separator.js';
+const meta = {
+    argTypes: {
+        decorative: {
+            control: 'boolean'
+        },
+        orientation: {
+            control: 'select',
+            options: [
+                'horizontal',
+                'vertical'
+            ]
+        }
+    },
+    component: Separator,
+    parameters: {
+        layout: 'centered'
+    },
+    title: 'Components/Separator'
+};
+export default meta;
+export const Horizontal = {
+    args: {
+        decorative: false,
+        orientation: 'horizontal'
+    },
+    play: focusCanvas,
+    render: (args)=>/*#__PURE__*/ _jsxs("div", {
+            className: "w-80 space-y-3",
+            children: [
+                /*#__PURE__*/ _jsx("p", {
+                    className: "text-sm",
+                    children: "Section above"
+                }),
+                /*#__PURE__*/ _jsx(Separator, {
+                    ...args
+                }),
+                /*#__PURE__*/ _jsx("p", {
+                    className: "text-sm",
+                    children: "Section below"
+                })
+            ]
+        })
+};
+export const Vertical = {
+    args: {
+        decorative: false,
+        orientation: 'vertical'
+    },
+    play: focusCanvas,
+    render: (args)=>/*#__PURE__*/ _jsxs("div", {
+            className: "flex h-16 items-center gap-4",
+            children: [
+                /*#__PURE__*/ _jsx("span", {
+                    children: "Left"
+                }),
+                /*#__PURE__*/ _jsx(Separator, {
+                    ...args
+                }),
+                /*#__PURE__*/ _jsx("span", {
+                    children: "Right"
+                })
+            ]
+        })
+};
+
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy9uaXRyb2c3L0RldmVsb3BtZW50L2dvdGhhbWpzL3NyYy9jb21wb25lbnRzL1NlcGFyYXRvci9TZXBhcmF0b3Iuc3Rvcmllcy50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7Zm9jdXNDYW52YXN9IGZyb20gJy4uLy4uL3V0aWxzL3N0b3J5SW50ZXJhY3Rpb25zLmpzJztcbmltcG9ydCB7U2VwYXJhdG9yfSBmcm9tICcuL1NlcGFyYXRvci5qcyc7XG5cbmltcG9ydCB0eXBlIHtNZXRhLCBTdG9yeU9ian0gZnJvbSAnQG5sYWJzL2xleC9zdG9yeWJvb2snO1xuXG5jb25zdCBtZXRhOiBNZXRhPHR5cGVvZiBTZXBhcmF0b3I+ID0ge1xuICBhcmdUeXBlczoge1xuICAgIGRlY29yYXRpdmU6IHtcbiAgICAgIGNvbnRyb2w6ICdib29sZWFuJ1xuICAgIH0sXG4gICAgb3JpZW50YXRpb246IHtcbiAgICAgIGNvbnRyb2w6ICdzZWxlY3QnLFxuICAgICAgb3B0aW9uczogWydob3Jpem9udGFsJywgJ3ZlcnRpY2FsJ11cbiAgICB9XG4gIH0sXG4gIGNvbXBvbmVudDogU2VwYXJhdG9yLFxuICBwYXJhbWV0ZXJzOiB7XG4gICAgbGF5b3V0OiAnY2VudGVyZWQnXG4gIH0sXG4gIHRpdGxlOiAnQ29tcG9uZW50cy9TZXBhcmF0b3InXG59O1xuXG5leHBvcnQgZGVmYXVsdCBtZXRhO1xuXG50eXBlIFN0b3J5ID0gU3RvcnlPYmo8dHlwZW9mIFNlcGFyYXRvcj47XG5cbmV4cG9ydCBjb25zdCBIb3Jpem9udGFsOiBTdG9yeSA9IHtcbiAgYXJnczoge1xuICAgIGRlY29yYXRpdmU6IGZhbHNlLFxuICAgIG9yaWVudGF0aW9uOiAnaG9yaXpvbnRhbCdcbiAgfSxcbiAgcGxheTogZm9jdXNDYW52YXMsXG4gIHJlbmRlcjogKGFyZ3MpID0+IChcbiAgICA8ZGl2IGNsYXNzTmFtZT1cInctODAgc3BhY2UteS0zXCI+XG4gICAgICA8cCBjbGFzc05hbWU9XCJ0ZXh0LXNtXCI+U2VjdGlvbiBhYm92ZTwvcD5cbiAgICAgIDxTZXBhcmF0b3Igey4uLmFyZ3N9IC8+XG4gICAgICA8cCBjbGFzc05hbWU9XCJ0ZXh0LXNtXCI+U2VjdGlvbiBiZWxvdzwvcD5cbiAgICA8L2Rpdj5cbiAgKVxufTtcblxuZXhwb3J0IGNvbnN0IFZlcnRpY2FsOiBTdG9yeSA9IHtcbiAgYXJnczoge1xuICAgIGRlY29yYXRpdmU6IGZhbHNlLFxuICAgIG9yaWVudGF0aW9uOiAndmVydGljYWwnXG4gIH0sXG4gIHBsYXk6IGZvY3VzQ2FudmFzLFxuICByZW5kZXI6IChhcmdzKSA9PiAoXG4gICAgPGRpdiBjbGFzc05hbWU9XCJmbGV4IGgtMTYgaXRlbXMtY2VudGVyIGdhcC00XCI+XG4gICAgICA8c3Bhbj5MZWZ0PC9zcGFuPlxuICAgICAgPFNlcGFyYXRvciB7Li4uYXJnc30gLz5cbiAgICAgIDxzcGFuPlJpZ2h0PC9zcGFuPlxuICAgIDwvZGl2PlxuICApXG59O1xuIl0sIm5hbWVzIjpbIlJlYWN0IiwiZm9jdXNDYW52YXMiLCJTZXBhcmF0b3IiLCJtZXRhIiwiYXJnVHlwZXMiLCJkZWNvcmF0aXZlIiwiY29udHJvbCIsIm9yaWVudGF0aW9uIiwib3B0aW9ucyIsImNvbXBvbmVudCIsInBhcmFtZXRlcnMiLCJsYXlvdXQiLCJ0aXRsZSIsIkhvcml6b250YWwiLCJhcmdzIiwicGxheSIsInJlbmRlciIsImRpdiIsImNsYXNzTmFtZSIsInAiLCJWZXJ0aWNhbCIsInNwYW4iXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPQSxXQUFXLFFBQVE7QUFDMUIsU0FBUUMsV0FBVyxRQUFPLG1DQUFtQztBQUM3RCxTQUFRQyxTQUFTLFFBQU8saUJBQWlCO0FBSXpDLE1BQU1DLE9BQStCO0lBQ25DQyxVQUFVO1FBQ1JDLFlBQVk7WUFDVkMsU0FBUztRQUNYO1FBQ0FDLGFBQWE7WUFDWEQsU0FBUztZQUNURSxTQUFTO2dCQUFDO2dCQUFjO2FBQVc7UUFDckM7SUFDRjtJQUNBQyxXQUFXUDtJQUNYUSxZQUFZO1FBQ1ZDLFFBQVE7SUFDVjtJQUNBQyxPQUFPO0FBQ1Q7QUFFQSxlQUFlVCxLQUFLO0FBSXBCLE9BQU8sTUFBTVUsYUFBb0I7SUFDL0JDLE1BQU07UUFDSlQsWUFBWTtRQUNaRSxhQUFhO0lBQ2Y7SUFDQVEsTUFBTWQ7SUFDTmUsUUFBUSxDQUFDRixxQkFDUCxNQUFDRztZQUFJQyxXQUFVOzs4QkFDYixLQUFDQztvQkFBRUQsV0FBVTs4QkFBVTs7OEJBQ3ZCLEtBQUNoQjtvQkFBVyxHQUFHWSxJQUFJOzs4QkFDbkIsS0FBQ0s7b0JBQUVELFdBQVU7OEJBQVU7Ozs7QUFHN0IsRUFBRTtBQUVGLE9BQU8sTUFBTUUsV0FBa0I7SUFDN0JOLE1BQU07UUFDSlQsWUFBWTtRQUNaRSxhQUFhO0lBQ2Y7SUFDQVEsTUFBTWQ7SUFDTmUsUUFBUSxDQUFDRixxQkFDUCxNQUFDRztZQUFJQyxXQUFVOzs4QkFDYixLQUFDRzs4QkFBSzs7OEJBQ04sS0FBQ25CO29CQUFXLEdBQUdZLElBQUk7OzhCQUNuQixLQUFDTzs4QkFBSzs7OztBQUdaLEVBQUUifQ==

package/lib/components/Skeleton/Skeleton.d.ts

@@ -0,0 +1,2 @@
+import type { HTMLAttributes } from 'react';
+export declare const Skeleton: ({ className, ...props }: HTMLAttributes<HTMLDivElement>) => import("react").JSX.Element;

package/lib/components/Skeleton/Skeleton.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from '@nlabs/utils';
+export const Skeleton = ({ className, ...props })=>/*#__PURE__*/ _jsx("div", {
+        className: cn('animate-pulse rounded-md bg-accent', className),
+        "data-slot": "skeleton",
+        ...props
+    });
+
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy9uaXRyb2c3L0RldmVsb3BtZW50L2dvdGhhbWpzL3NyYy9jb21wb25lbnRzL1NrZWxldG9uL1NrZWxldG9uLnRzeCJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge2NufSBmcm9tICdAbmxhYnMvdXRpbHMnO1xuXG5pbXBvcnQgdHlwZSB7SFRNTEF0dHJpYnV0ZXN9IGZyb20gJ3JlYWN0JztcblxuZXhwb3J0IGNvbnN0IFNrZWxldG9uID0gKHtjbGFzc05hbWUsIC4uLnByb3BzfTogSFRNTEF0dHJpYnV0ZXM8SFRNTERpdkVsZW1lbnQ+KSA9PiAoXG4gIDxkaXZcbiAgICBjbGFzc05hbWU9e2NuKCdhbmltYXRlLXB1bHNlIHJvdW5kZWQtbWQgYmctYWNjZW50JywgY2xhc3NOYW1lKX1cbiAgICBkYXRhLXNsb3Q9XCJza2VsZXRvblwiXG4gICAgey4uLnByb3BzfVxuICAvPlxuKTtcbiJdLCJuYW1lcyI6WyJjbiIsIlNrZWxldG9uIiwiY2xhc3NOYW1lIiwicHJvcHMiLCJkaXYiLCJkYXRhLXNsb3QiXSwibWFwcGluZ3MiOiI7QUFBQSxTQUFRQSxFQUFFLFFBQU8sZUFBZTtBQUloQyxPQUFPLE1BQU1DLFdBQVcsQ0FBQyxFQUFDQyxTQUFTLEVBQUUsR0FBR0MsT0FBc0MsaUJBQzVFLEtBQUNDO1FBQ0NGLFdBQVdGLEdBQUcsc0NBQXNDRTtRQUNwREcsYUFBVTtRQUNULEdBQUdGLEtBQUs7T0FFWCJ9

package/lib/components/Skeleton/Skeleton.stories.js

@@ -0,0 +1,24 @@
+import React from 'react';
+import { focusCanvas } from '../../utils/storyInteractions.js';
+import { Skeleton } from './Skeleton.js';
+const meta = {
+    argTypes: {
+        className: {
+            control: 'text'
+        }
+    },
+    component: Skeleton,
+    parameters: {
+        layout: 'centered'
+    },
+    title: 'Components/Skeleton'
+};
+export default meta;
+export const Default = {
+    args: {
+        className: 'h-24 w-80'
+    },
+    play: focusCanvas
+};
+
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy9uaXRyb2c3L0RldmVsb3BtZW50L2dvdGhhbWpzL3NyYy9jb21wb25lbnRzL1NrZWxldG9uL1NrZWxldG9uLnN0b3JpZXMudHN4Il0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCc7XG5pbXBvcnQge2ZvY3VzQ2FudmFzfSBmcm9tICcuLi8uLi91dGlscy9zdG9yeUludGVyYWN0aW9ucy5qcyc7XG5pbXBvcnQge1NrZWxldG9ufSBmcm9tICcuL1NrZWxldG9uLmpzJztcblxuaW1wb3J0IHR5cGUge01ldGEsIFN0b3J5T2JqfSBmcm9tICdAbmxhYnMvbGV4L3N0b3J5Ym9vayc7XG5cbmNvbnN0IG1ldGE6IE1ldGE8dHlwZW9mIFNrZWxldG9uPiA9IHtcbiAgYXJnVHlwZXM6IHtcbiAgICBjbGFzc05hbWU6IHtcbiAgICAgIGNvbnRyb2w6ICd0ZXh0J1xuICAgIH1cbiAgfSxcbiAgY29tcG9uZW50OiBTa2VsZXRvbixcbiAgcGFyYW1ldGVyczoge1xuICAgIGxheW91dDogJ2NlbnRlcmVkJ1xuICB9LFxuICB0aXRsZTogJ0NvbXBvbmVudHMvU2tlbGV0b24nXG59O1xuXG5leHBvcnQgZGVmYXVsdCBtZXRhO1xuXG50eXBlIFN0b3J5ID0gU3RvcnlPYmo8dHlwZW9mIFNrZWxldG9uPjtcblxuZXhwb3J0IGNvbnN0IERlZmF1bHQ6IFN0b3J5ID0ge1xuICBhcmdzOiB7XG4gICAgY2xhc3NOYW1lOiAnaC0yNCB3LTgwJ1xuICB9LFxuICBwbGF5OiBmb2N1c0NhbnZhc1xufTtcbiJdLCJuYW1lcyI6WyJSZWFjdCIsImZvY3VzQ2FudmFzIiwiU2tlbGV0b24iLCJtZXRhIiwiYXJnVHlwZXMiLCJjbGFzc05hbWUiLCJjb250cm9sIiwiY29tcG9uZW50IiwicGFyYW1ldGVycyIsImxheW91dCIsInRpdGxlIiwiRGVmYXVsdCIsImFyZ3MiLCJwbGF5Il0sIm1hcHBpbmdzIjoiQUFBQSxPQUFPQSxXQUFXLFFBQVE7QUFDMUIsU0FBUUMsV0FBVyxRQUFPLG1DQUFtQztBQUM3RCxTQUFRQyxRQUFRLFFBQU8sZ0JBQWdCO0FBSXZDLE1BQU1DLE9BQThCO0lBQ2xDQyxVQUFVO1FBQ1JDLFdBQVc7WUFDVEMsU0FBUztRQUNYO0lBQ0Y7SUFDQUMsV0FBV0w7SUFDWE0sWUFBWTtRQUNWQyxRQUFRO0lBQ1Y7SUFDQUMsT0FBTztBQUNUO0FBRUEsZUFBZVAsS0FBSztBQUlwQixPQUFPLE1BQU1RLFVBQWlCO0lBQzVCQyxNQUFNO1FBQ0pQLFdBQVc7SUFDYjtJQUNBUSxNQUFNWjtBQUNSLEVBQUUifQ==

package/lib/components/Svg/Svg.d.ts

@@ -0,0 +1,9 @@
+import type { FC } from 'react';
+export interface SvgProps {
+    readonly className?: string;
+    readonly color?: string;
+    readonly height?: number;
+    readonly name: string;
+    readonly width?: number;
+}
+export declare const Svg: FC<SvgProps>;

package/lib/components/Svg/Svg.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Copyright (c) 2018-Present, Nitrogen Labs, Inc.
+ * Copyrights licensed under the MIT License. See the accompanying LICENSE file for terms.
+ */ import { cn } from '@nlabs/utils';
+import { Config } from '../../config/appConfig.js';
+export const Svg = ({ className, color = 'inherit', height = 32, name, width = 32 })=>{
+    const baseUrl = Config.get('baseUrl', '');
+    const iconPath = baseUrl ? `${baseUrl}/icons/icons.svg#${name}` : `/icons/icons.svg#${name}`;
+    return /*#__PURE__*/ _jsx("svg", {
+        className: cn('w-full h-full', className),
+        style: {
+            color,
+            fill: color,
+            height: `${height}px`,
+            width: `${width}px`
+        },
+        viewBox: `0 0 ${width} ${height}`,
+        children: /*#__PURE__*/ _jsx("use", {
+            href: iconPath
+        })
+    });
+};
+
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy9uaXRyb2c3L0RldmVsb3BtZW50L2dvdGhhbWpzL3NyYy9jb21wb25lbnRzL1N2Zy9TdmcudHN4Il0sInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDE4LVByZXNlbnQsIE5pdHJvZ2VuIExhYnMsIEluYy5cbiAqIENvcHlyaWdodHMgbGljZW5zZWQgdW5kZXIgdGhlIE1JVCBMaWNlbnNlLiBTZWUgdGhlIGFjY29tcGFueWluZyBMSUNFTlNFIGZpbGUgZm9yIHRlcm1zLlxuICovXG5pbXBvcnQge2NufSBmcm9tICdAbmxhYnMvdXRpbHMnO1xuaW1wb3J0IHtDb25maWd9IGZyb20gJy4uLy4uL2NvbmZpZy9hcHBDb25maWcuanMnO1xuaW1wb3J0IHR5cGUge0ZDfSBmcm9tICdyZWFjdCc7XG5cbmV4cG9ydCBpbnRlcmZhY2UgU3ZnUHJvcHMge1xuICByZWFkb25seSBjbGFzc05hbWU/OiBzdHJpbmc7XG4gIHJlYWRvbmx5IGNvbG9yPzogc3RyaW5nO1xuICByZWFkb25seSBoZWlnaHQ/OiBudW1iZXI7XG4gIHJlYWRvbmx5IG5hbWU6IHN0cmluZztcbiAgcmVhZG9ubHkgd2lkdGg/OiBudW1iZXI7XG59XG5cbmV4cG9ydCBjb25zdCBTdmc6IEZDPFN2Z1Byb3BzPiA9ICh7XG4gIGNsYXNzTmFtZSxcbiAgY29sb3IgPSAnaW5oZXJpdCcsXG4gIGhlaWdodCA9IDMyLFxuICBuYW1lLFxuICB3aWR0aCA9IDMyXG59KSA9PiB7XG4gIGNvbnN0IGJhc2VVcmwgPSBDb25maWcuZ2V0KCdiYXNlVXJsJywgJycpO1xuICBjb25zdCBpY29uUGF0aCA9IGJhc2VVcmwgPyBgJHtiYXNlVXJsfS9pY29ucy9pY29ucy5zdmcjJHtuYW1lfWAgOiBgL2ljb25zL2ljb25zLnN2ZyMke25hbWV9YDtcblxuICByZXR1cm4gKFxuICAgIDxzdmdcbiAgICAgIGNsYXNzTmFtZT17Y24oJ3ctZnVsbCBoLWZ1bGwnLCBjbGFzc05hbWUpfVxuICAgICAgc3R5bGU9e3tcbiAgICAgICAgY29sb3IsXG4gICAgICAgIGZpbGw6IGNvbG9yLFxuICAgICAgICBoZWlnaHQ6IGAke2hlaWdodH1weGAsXG4gICAgICAgIHdpZHRoOiBgJHt3aWR0aH1weGBcbiAgICAgIH19XG4gICAgICB2aWV3Qm94PXtgMCAwICR7d2lkdGh9ICR7aGVpZ2h0fWB9XG4gICAgPlxuICAgICAgPHVzZSBocmVmPXtpY29uUGF0aH0gLz5cbiAgICA8L3N2Zz5cbiAgKTtcbn07XG4iXSwibmFtZXMiOlsiY24iLCJDb25maWciLCJTdmciLCJjbGFzc05hbWUiLCJjb2xvciIsImhlaWdodCIsIm5hbWUiLCJ3aWR0aCIsImJhc2VVcmwiLCJnZXQiLCJpY29uUGF0aCIsInN2ZyIsInN0eWxlIiwiZmlsbCIsInZpZXdCb3giLCJ1c2UiLCJocmVmIl0sIm1hcHBpbmdzIjoiO0FBQUE7OztDQUdDLEdBQ0QsU0FBUUEsRUFBRSxRQUFPLGVBQWU7QUFDaEMsU0FBUUMsTUFBTSxRQUFPLDRCQUE0QjtBQVdqRCxPQUFPLE1BQU1DLE1BQW9CLENBQUMsRUFDaENDLFNBQVMsRUFDVEMsUUFBUSxTQUFTLEVBQ2pCQyxTQUFTLEVBQUUsRUFDWEMsSUFBSSxFQUNKQyxRQUFRLEVBQUUsRUFDWDtJQUNDLE1BQU1DLFVBQVVQLE9BQU9RLEdBQUcsQ0FBQyxXQUFXO0lBQ3RDLE1BQU1DLFdBQVdGLFVBQVUsR0FBR0EsUUFBUSxpQkFBaUIsRUFBRUYsTUFBTSxHQUFHLENBQUMsaUJBQWlCLEVBQUVBLE1BQU07SUFFNUYscUJBQ0UsS0FBQ0s7UUFDQ1IsV0FBV0gsR0FBRyxpQkFBaUJHO1FBQy9CUyxPQUFPO1lBQ0xSO1lBQ0FTLE1BQU1UO1lBQ05DLFFBQVEsR0FBR0EsT0FBTyxFQUFFLENBQUM7WUFDckJFLE9BQU8sR0FBR0EsTUFBTSxFQUFFLENBQUM7UUFDckI7UUFDQU8sU0FBUyxDQUFDLElBQUksRUFBRVAsTUFBTSxDQUFDLEVBQUVGLFFBQVE7a0JBRWpDLGNBQUEsS0FBQ1U7WUFBSUMsTUFBTU47OztBQUdqQixFQUFFIn0=

package/lib/components/Svg/Svg.stories.js

@@ -0,0 +1,34 @@
+import { Svg as SvgComponent } from './Svg.js';
+import { gothamColors } from '../../utils/colorUtils.js';
+import { focusCanvas } from '../../utils/storyInteractions.js';
+const meta = {
+    argTypes: {
+        color: {
+            control: 'select',
+            options: gothamColors
+        },
+        height: {
+            control: 'number'
+        },
+        name: {
+            control: 'text'
+        },
+        width: {
+            control: 'number'
+        }
+    },
+    component: SvgComponent
+};
+export default meta;
+export const Svg = {
+    args: {
+        className: 'test',
+        color: 'error',
+        height: 100,
+        name: 'test',
+        width: 100
+    },
+    play: focusCanvas
+};
+
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy9uaXRyb2c3L0RldmVsb3BtZW50L2dvdGhhbWpzL3NyYy9jb21wb25lbnRzL1N2Zy9Tdmcuc3Rvcmllcy50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgU3ZnIGFzIFN2Z0NvbXBvbmVudCB9IGZyb20gJy4vU3ZnLmpzJztcbmltcG9ydCB7Z290aGFtQ29sb3JzfSBmcm9tICcuLi8uLi91dGlscy9jb2xvclV0aWxzLmpzJztcbmltcG9ydCB7Zm9jdXNDYW52YXN9IGZyb20gJy4uLy4uL3V0aWxzL3N0b3J5SW50ZXJhY3Rpb25zLmpzJztcblxuaW1wb3J0IHR5cGUgeyBNZXRhLCBTdG9yeU9iaiB9IGZyb20gJ0BubGFicy9sZXgvc3Rvcnlib29rJztcblxuY29uc3QgbWV0YTogTWV0YTx0eXBlb2YgU3ZnQ29tcG9uZW50PiA9IHtcbiAgYXJnVHlwZXM6IHtcbiAgICBjb2xvcjoge1xuICAgICAgY29udHJvbDogJ3NlbGVjdCcsXG4gICAgICBvcHRpb25zOiBnb3RoYW1Db2xvcnNcbiAgICB9LFxuICAgIGhlaWdodDoge1xuICAgICAgY29udHJvbDogJ251bWJlcidcbiAgICB9LFxuICAgIG5hbWU6IHtcbiAgICAgIGNvbnRyb2w6ICd0ZXh0J1xuICAgIH0sXG4gICAgd2lkdGg6IHtcbiAgICAgIGNvbnRyb2w6ICdudW1iZXInXG4gICAgfVxuICB9LFxuICBjb21wb25lbnQ6IFN2Z0NvbXBvbmVudFxufTtcblxuZXhwb3J0IGRlZmF1bHQgbWV0YTtcbnR5cGUgU3RvcnkgPSBTdG9yeU9iajx0eXBlb2YgU3ZnQ29tcG9uZW50PjtcblxuZXhwb3J0IGNvbnN0IFN2ZzogU3RvcnkgPSB7XG4gIGFyZ3M6IHtcbiAgICBjbGFzc05hbWU6ICd0ZXN0JyxcbiAgICBjb2xvcjogJ2Vycm9yJyxcbiAgICBoZWlnaHQ6IDEwMCxcbiAgICBuYW1lOiAndGVzdCcsXG4gICAgd2lkdGg6IDEwMFxuICB9LFxuICBwbGF5OiBmb2N1c0NhbnZhc1xufTtcbiJdLCJuYW1lcyI6WyJTdmciLCJTdmdDb21wb25lbnQiLCJnb3RoYW1Db2xvcnMiLCJmb2N1c0NhbnZhcyIsIm1ldGEiLCJhcmdUeXBlcyIsImNvbG9yIiwiY29udHJvbCIsIm9wdGlvbnMiLCJoZWlnaHQiLCJuYW1lIiwid2lkdGgiLCJjb21wb25lbnQiLCJhcmdzIiwiY2xhc3NOYW1lIiwicGxheSJdLCJtYXBwaW5ncyI6IkFBQUEsU0FBU0EsT0FBT0MsWUFBWSxRQUFRLFdBQVc7QUFDL0MsU0FBUUMsWUFBWSxRQUFPLDRCQUE0QjtBQUN2RCxTQUFRQyxXQUFXLFFBQU8sbUNBQW1DO0FBSTdELE1BQU1DLE9BQWtDO0lBQ3RDQyxVQUFVO1FBQ1JDLE9BQU87WUFDTEMsU0FBUztZQUNUQyxTQUFTTjtRQUNYO1FBQ0FPLFFBQVE7WUFDTkYsU0FBUztRQUNYO1FBQ0FHLE1BQU07WUFDSkgsU0FBUztRQUNYO1FBQ0FJLE9BQU87WUFDTEosU0FBUztRQUNYO0lBQ0Y7SUFDQUssV0FBV1g7QUFDYjtBQUVBLGVBQWVHLEtBQUs7QUFHcEIsT0FBTyxNQUFNSixNQUFhO0lBQ3hCYSxNQUFNO1FBQ0pDLFdBQVc7UUFDWFIsT0FBTztRQUNQRyxRQUFRO1FBQ1JDLE1BQU07UUFDTkMsT0FBTztJQUNUO0lBQ0FJLE1BQU1aO0FBQ1IsRUFBRSJ9

package/lib/components/Switch/Switch.d.ts

@@ -0,0 +1,12 @@
+import { Field as HeadlessField } from '@headlessui/react';
+import type { ComponentPropsWithoutRef, FC, HTMLAttributes, InputHTMLAttributes } from 'react';
+import type { GothamColor } from '../../utils/colorUtils.js';
+export interface SwitchProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {
+    readonly color?: GothamColor;
+    readonly onCheckedChange?: (checked: boolean) => void;
+}
+export declare const Switch: FC<SwitchProps>;
+export declare const SwitchGroup: ({ className, ...props }: HTMLAttributes<HTMLDivElement>) => import("react").JSX.Element;
+export declare const SwitchField: ({ className, ...props }: Omit<ComponentPropsWithoutRef<typeof HeadlessField>, 'as' | 'className'> & {
+    readonly className?: string;
+}) => import("react").JSX.Element;

package/lib/components/Switch/Switch.js

@@ -0,0 +1,54 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Field as HeadlessField } from '@headlessui/react';
+import { cn } from '@nlabs/utils';
+const switchBackgroundClasses = {
+    black: 'peer-checked:bg-black dark:peer-checked:bg-black-dark',
+    error: 'peer-checked:bg-error dark:peer-checked:bg-error-dark',
+    info: 'peer-checked:bg-info dark:peer-checked:bg-info-dark',
+    link: 'peer-checked:bg-link dark:peer-checked:bg-link-dark',
+    neutral: 'peer-checked:bg-neutral dark:peer-checked:bg-neutral-dark',
+    primary: 'peer-checked:bg-primary dark:peer-checked:bg-primary-dark',
+    secondary: 'peer-checked:bg-secondary dark:peer-checked:bg-secondary-dark',
+    success: 'peer-checked:bg-success dark:peer-checked:bg-success-dark',
+    tertiary: 'peer-checked:bg-tertiary dark:peer-checked:bg-tertiary-dark',
+    transparent: 'peer-checked:bg-transparent',
+    warning: 'peer-checked:bg-warning dark:peer-checked:bg-warning-dark',
+    white: 'peer-checked:bg-white dark:peer-checked:bg-white-dark'
+};
+export const Switch = ({ className, color = 'primary', disabled, onCheckedChange, onChange, ...props })=>/*#__PURE__*/ _jsxs("label", {
+        className: cn('relative isolate inline-flex h-6 w-10 rounded-full sm:h-5 sm:w-8', className),
+        "data-slot": "switch",
+        children: [
+            /*#__PURE__*/ _jsx("input", {
+                className: "peer absolute inset-0 size-full cursor-pointer appearance-none rounded-full disabled:cursor-not-allowed",
+                disabled: disabled,
+                onChange: (event)=>{
+                    onChange?.(event);
+                    onCheckedChange?.(event.currentTarget.checked);
+                },
+                role: "switch",
+                type: "checkbox",
+                ...props
+            }),
+            /*#__PURE__*/ _jsx("span", {
+                "aria-hidden": "true",
+                className: cn('pointer-events-none absolute inset-0 rounded-full bg-black/15 ring-1 ring-black/20 ring-inset transition-colors peer-checked:ring-transparent peer-focus-visible:outline-2 peer-focus-visible:outline-offset-2 peer-focus-visible:outline-ring peer-disabled:opacity-50 dark:bg-white/25 dark:ring-white/25 dark:peer-focus-visible:outline-ring-dark', switchBackgroundClasses[color])
+            }),
+            /*#__PURE__*/ _jsx("span", {
+                "aria-hidden": "true",
+                className: "pointer-events-none relative m-[3px] inline-block size-4.5 rounded-full border border-transparent bg-white shadow-sm ring-1 ring-black/5 transition-transform peer-checked:translate-x-4 peer-disabled:opacity-50 sm:size-3.5 sm:peer-checked:translate-x-3 dark:bg-foreground-dark"
+            })
+        ]
+    });
+export const SwitchGroup = ({ className, ...props })=>/*#__PURE__*/ _jsx("div", {
+        className: cn('space-y-3 has-data-[slot=description]:space-y-6', className),
+        "data-slot": "control",
+        ...props
+    });
+export const SwitchField = ({ className, ...props })=>/*#__PURE__*/ _jsx(HeadlessField, {
+        className: cn('grid grid-cols-[1fr_auto] gap-x-8 gap-y-1', '*:data-[slot=switch]:col-start-2 *:data-[slot=switch]:row-start-1 *:data-[slot=switch]:self-start', '*:data-[slot=label]:col-start-1 *:data-[slot=label]:row-start-1', '*:data-[slot=description]:col-start-1 *:data-[slot=description]:row-start-2', className),
+        "data-slot": "field",
+        ...props
+    });
+
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy9uaXRyb2c3L0RldmVsb3BtZW50L2dvdGhhbWpzL3NyYy9jb21wb25lbnRzL1N3aXRjaC9Td2l0Y2gudHN4Il0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7RmllbGQgYXMgSGVhZGxlc3NGaWVsZH0gZnJvbSAnQGhlYWRsZXNzdWkvcmVhY3QnO1xuaW1wb3J0IHtjbn0gZnJvbSAnQG5sYWJzL3V0aWxzJztcblxuaW1wb3J0IHR5cGUge0NvbXBvbmVudFByb3BzV2l0aG91dFJlZiwgRkMsIEhUTUxBdHRyaWJ1dGVzLCBJbnB1dEhUTUxBdHRyaWJ1dGVzfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgdHlwZSB7R290aGFtQ29sb3J9IGZyb20gJy4uLy4uL3V0aWxzL2NvbG9yVXRpbHMuanMnO1xuXG5jb25zdCBzd2l0Y2hCYWNrZ3JvdW5kQ2xhc3NlczogUmVjb3JkPEdvdGhhbUNvbG9yLCBzdHJpbmc+ID0ge1xuICBibGFjazogJ3BlZXItY2hlY2tlZDpiZy1ibGFjayBkYXJrOnBlZXItY2hlY2tlZDpiZy1ibGFjay1kYXJrJyxcbiAgZXJyb3I6ICdwZWVyLWNoZWNrZWQ6YmctZXJyb3IgZGFyazpwZWVyLWNoZWNrZWQ6YmctZXJyb3ItZGFyaycsXG4gIGluZm86ICdwZWVyLWNoZWNrZWQ6YmctaW5mbyBkYXJrOnBlZXItY2hlY2tlZDpiZy1pbmZvLWRhcmsnLFxuICBsaW5rOiAncGVlci1jaGVja2VkOmJnLWxpbmsgZGFyazpwZWVyLWNoZWNrZWQ6YmctbGluay1kYXJrJyxcbiAgbmV1dHJhbDogJ3BlZXItY2hlY2tlZDpiZy1uZXV0cmFsIGRhcms6cGVlci1jaGVja2VkOmJnLW5ldXRyYWwtZGFyaycsXG4gIHByaW1hcnk6ICdwZWVyLWNoZWNrZWQ6YmctcHJpbWFyeSBkYXJrOnBlZXItY2hlY2tlZDpiZy1wcmltYXJ5LWRhcmsnLFxuICBzZWNvbmRhcnk6ICdwZWVyLWNoZWNrZWQ6Ymctc2Vjb25kYXJ5IGRhcms6cGVlci1jaGVja2VkOmJnLXNlY29uZGFyeS1kYXJrJyxcbiAgc3VjY2VzczogJ3BlZXItY2hlY2tlZDpiZy1zdWNjZXNzIGRhcms6cGVlci1jaGVja2VkOmJnLXN1Y2Nlc3MtZGFyaycsXG4gIHRlcnRpYXJ5OiAncGVlci1jaGVja2VkOmJnLXRlcnRpYXJ5IGRhcms6cGVlci1jaGVja2VkOmJnLXRlcnRpYXJ5LWRhcmsnLFxuICB0cmFuc3BhcmVudDogJ3BlZXItY2hlY2tlZDpiZy10cmFuc3BhcmVudCcsXG4gIHdhcm5pbmc6ICdwZWVyLWNoZWNrZWQ6Ymctd2FybmluZyBkYXJrOnBlZXItY2hlY2tlZDpiZy13YXJuaW5nLWRhcmsnLFxuICB3aGl0ZTogJ3BlZXItY2hlY2tlZDpiZy13aGl0ZSBkYXJrOnBlZXItY2hlY2tlZDpiZy13aGl0ZS1kYXJrJ1xufTtcblxuZXhwb3J0IGludGVyZmFjZSBTd2l0Y2hQcm9wcyBleHRlbmRzIE9taXQ8SW5wdXRIVE1MQXR0cmlidXRlczxIVE1MSW5wdXRFbGVtZW50PiwgJ3R5cGUnPiB7XG4gIHJlYWRvbmx5IGNvbG9yPzogR290aGFtQ29sb3I7XG4gIHJlYWRvbmx5IG9uQ2hlY2tlZENoYW5nZT86IChjaGVja2VkOiBib29sZWFuKSA9PiB2b2lkO1xufVxuXG5leHBvcnQgY29uc3QgU3dpdGNoOiBGQzxTd2l0Y2hQcm9wcz4gPSAoe1xuICBjbGFzc05hbWUsXG4gIGNvbG9yID0gJ3ByaW1hcnknLFxuICBkaXNhYmxlZCxcbiAgb25DaGVja2VkQ2hhbmdlLFxuICBvbkNoYW5nZSxcbiAgLi4ucHJvcHNcbn0pID0+IChcbiAgPGxhYmVsXG4gICAgY2xhc3NOYW1lPXtjbigncmVsYXRpdmUgaXNvbGF0ZSBpbmxpbmUtZmxleCBoLTYgdy0xMCByb3VuZGVkLWZ1bGwgc206aC01IHNtOnctOCcsIGNsYXNzTmFtZSl9XG4gICAgZGF0YS1zbG90PVwic3dpdGNoXCJcbiAgPlxuICAgICAgPGlucHV0XG4gICAgICAgIGNsYXNzTmFtZT1cInBlZXIgYWJzb2x1dGUgaW5zZXQtMCBzaXplLWZ1bGwgY3Vyc29yLXBvaW50ZXIgYXBwZWFyYW5jZS1ub25lIHJvdW5kZWQtZnVsbCBkaXNhYmxlZDpjdXJzb3Itbm90LWFsbG93ZWRcIlxuICAgICAgICBkaXNhYmxlZD17ZGlzYWJsZWR9XG4gICAgICBvbkNoYW5nZT17KGV2ZW50KSA9PiB7XG4gICAgICAgIG9uQ2hhbmdlPy4oZXZlbnQpO1xuICAgICAgICBvbkNoZWNrZWRDaGFuZ2U/LihldmVudC5jdXJyZW50VGFyZ2V0LmNoZWNrZWQpO1xuICAgICAgfX1cbiAgICAgIHJvbGU9XCJzd2l0Y2hcIlxuICAgICAgdHlwZT1cImNoZWNrYm94XCJcbiAgICAgIHsuLi5wcm9wc31cbiAgICAvPlxuICAgIDxzcGFuXG4gICAgICBhcmlhLWhpZGRlbj1cInRydWVcIlxuICAgICAgY2xhc3NOYW1lPXtjbihcbiAgICAgICAgJ3BvaW50ZXItZXZlbnRzLW5vbmUgYWJzb2x1dGUgaW5zZXQtMCByb3VuZGVkLWZ1bGwgYmctYmxhY2svMTUgcmluZy0xIHJpbmctYmxhY2svMjAgcmluZy1pbnNldCB0cmFuc2l0aW9uLWNvbG9ycyBwZWVyLWNoZWNrZWQ6cmluZy10cmFuc3BhcmVudCBwZWVyLWZvY3VzLXZpc2libGU6b3V0bGluZS0yIHBlZXItZm9jdXMtdmlzaWJsZTpvdXRsaW5lLW9mZnNldC0yIHBlZXItZm9jdXMtdmlzaWJsZTpvdXRsaW5lLXJpbmcgcGVlci1kaXNhYmxlZDpvcGFjaXR5LTUwIGRhcms6Ymctd2hpdGUvMjUgZGFyazpyaW5nLXdoaXRlLzI1IGRhcms6cGVlci1mb2N1cy12aXNpYmxlOm91dGxpbmUtcmluZy1kYXJrJyxcbiAgICAgICAgc3dpdGNoQmFja2dyb3VuZENsYXNzZXNbY29sb3JdXG4gICAgICApfVxuICAgIC8+XG4gICAgPHNwYW5cbiAgICAgIGFyaWEtaGlkZGVuPVwidHJ1ZVwiXG4gICAgICBjbGFzc05hbWU9XCJwb2ludGVyLWV2ZW50cy1ub25lIHJlbGF0aXZlIG0tWzNweF0gaW5saW5lLWJsb2NrIHNpemUtNC41IHJvdW5kZWQtZnVsbCBib3JkZXIgYm9yZGVyLXRyYW5zcGFyZW50IGJnLXdoaXRlIHNoYWRvdy1zbSByaW5nLTEgcmluZy1ibGFjay81IHRyYW5zaXRpb24tdHJhbnNmb3JtIHBlZXItY2hlY2tlZDp0cmFuc2xhdGUteC00IHBlZXItZGlzYWJsZWQ6b3BhY2l0eS01MCBzbTpzaXplLTMuNSBzbTpwZWVyLWNoZWNrZWQ6dHJhbnNsYXRlLXgtMyBkYXJrOmJnLWZvcmVncm91bmQtZGFya1wiXG4gICAgLz5cbiAgPC9sYWJlbD5cbik7XG5cbmV4cG9ydCBjb25zdCBTd2l0Y2hHcm91cCA9ICh7XG4gIGNsYXNzTmFtZSxcbiAgLi4ucHJvcHNcbn06IEhUTUxBdHRyaWJ1dGVzPEhUTUxEaXZFbGVtZW50PikgPT4gKFxuICA8ZGl2XG4gICAgY2xhc3NOYW1lPXtjbignc3BhY2UteS0zIGhhcy1kYXRhLVtzbG90PWRlc2NyaXB0aW9uXTpzcGFjZS15LTYnLCBjbGFzc05hbWUpfVxuICAgIGRhdGEtc2xvdD1cImNvbnRyb2xcIlxuICAgIHsuLi5wcm9wc31cbiAgLz5cbik7XG5cbmV4cG9ydCBjb25zdCBTd2l0Y2hGaWVsZCA9ICh7XG4gIGNsYXNzTmFtZSxcbiAgLi4ucHJvcHNcbn06IE9taXQ8Q29tcG9uZW50UHJvcHNXaXRob3V0UmVmPHR5cGVvZiBIZWFkbGVzc0ZpZWxkPiwgJ2FzJyB8ICdjbGFzc05hbWUnPiAmIHtyZWFkb25seSBjbGFzc05hbWU/OiBzdHJpbmd9KSA9PiAoXG4gIDxIZWFkbGVzc0ZpZWxkXG4gICAgY2xhc3NOYW1lPXtjbihcbiAgICAgICdncmlkIGdyaWQtY29scy1bMWZyX2F1dG9dIGdhcC14LTggZ2FwLXktMScsXG4gICAgICAnKjpkYXRhLVtzbG90PXN3aXRjaF06Y29sLXN0YXJ0LTIgKjpkYXRhLVtzbG90PXN3aXRjaF06cm93LXN0YXJ0LTEgKjpkYXRhLVtzbG90PXN3aXRjaF06c2VsZi1zdGFydCcsXG4gICAgICAnKjpkYXRhLVtzbG90PWxhYmVsXTpjb2wtc3RhcnQtMSAqOmRhdGEtW3Nsb3Q9bGFiZWxdOnJvdy1zdGFydC0xJyxcbiAgICAgICcqOmRhdGEtW3Nsb3Q9ZGVzY3JpcHRpb25dOmNvbC1zdGFydC0xICo6ZGF0YS1bc2xvdD1kZXNjcmlwdGlvbl06cm93LXN0YXJ0LTInLFxuICAgICAgY2xhc3NOYW1lXG4gICAgKX1cbiAgICBkYXRhLXNsb3Q9XCJmaWVsZFwiXG4gICAgey4uLnByb3BzfVxuICAvPlxuKTtcbiJdLCJuYW1lcyI6WyJGaWVsZCIsIkhlYWRsZXNzRmllbGQiLCJjbiIsInN3aXRjaEJhY2tncm91bmRDbGFzc2VzIiwiYmxhY2siLCJlcnJvciIsImluZm8iLCJsaW5rIiwibmV1dHJhbCIsInByaW1hcnkiLCJzZWNvbmRhcnkiLCJzdWNjZXNzIiwidGVydGlhcnkiLCJ0cmFuc3BhcmVudCIsIndhcm5pbmciLCJ3aGl0ZSIsIlN3aXRjaCIsImNsYXNzTmFtZSIsImNvbG9yIiwiZGlzYWJsZWQiLCJvbkNoZWNrZWRDaGFuZ2UiLCJvbkNoYW5nZSIsInByb3BzIiwibGFiZWwiLCJkYXRhLXNsb3QiLCJpbnB1dCIsImV2ZW50IiwiY3VycmVudFRhcmdldCIsImNoZWNrZWQiLCJyb2xlIiwidHlwZSIsInNwYW4iLCJhcmlhLWhpZGRlbiIsIlN3aXRjaEdyb3VwIiwiZGl2IiwiU3dpdGNoRmllbGQiXSwibWFwcGluZ3MiOiI7QUFBQSxTQUFRQSxTQUFTQyxhQUFhLFFBQU8sb0JBQW9CO0FBQ3pELFNBQVFDLEVBQUUsUUFBTyxlQUFlO0FBS2hDLE1BQU1DLDBCQUF1RDtJQUMzREMsT0FBTztJQUNQQyxPQUFPO0lBQ1BDLE1BQU07SUFDTkMsTUFBTTtJQUNOQyxTQUFTO0lBQ1RDLFNBQVM7SUFDVEMsV0FBVztJQUNYQyxTQUFTO0lBQ1RDLFVBQVU7SUFDVkMsYUFBYTtJQUNiQyxTQUFTO0lBQ1RDLE9BQU87QUFDVDtBQU9BLE9BQU8sTUFBTUMsU0FBMEIsQ0FBQyxFQUN0Q0MsU0FBUyxFQUNUQyxRQUFRLFNBQVMsRUFDakJDLFFBQVEsRUFDUkMsZUFBZSxFQUNmQyxRQUFRLEVBQ1IsR0FBR0MsT0FDSixpQkFDQyxNQUFDQztRQUNDTixXQUFXZixHQUFHLG9FQUFvRWU7UUFDbEZPLGFBQVU7OzBCQUVSLEtBQUNDO2dCQUNDUixXQUFVO2dCQUNWRSxVQUFVQTtnQkFDWkUsVUFBVSxDQUFDSztvQkFDVEwsV0FBV0s7b0JBQ1hOLGtCQUFrQk0sTUFBTUMsYUFBYSxDQUFDQyxPQUFPO2dCQUMvQztnQkFDQUMsTUFBSztnQkFDTEMsTUFBSztnQkFDSixHQUFHUixLQUFLOzswQkFFWCxLQUFDUztnQkFDQ0MsZUFBWTtnQkFDWmYsV0FBV2YsR0FDVCx5VkFDQUMsdUJBQXVCLENBQUNlLE1BQU07OzBCQUdsQyxLQUFDYTtnQkFDQ0MsZUFBWTtnQkFDWmYsV0FBVTs7O09BR2Q7QUFFRixPQUFPLE1BQU1nQixjQUFjLENBQUMsRUFDMUJoQixTQUFTLEVBQ1QsR0FBR0ssT0FDNEIsaUJBQy9CLEtBQUNZO1FBQ0NqQixXQUFXZixHQUFHLG1EQUFtRGU7UUFDakVPLGFBQVU7UUFDVCxHQUFHRixLQUFLO09BRVg7QUFFRixPQUFPLE1BQU1hLGNBQWMsQ0FBQyxFQUMxQmxCLFNBQVMsRUFDVCxHQUFHSyxPQUNzRyxpQkFDekcsS0FBQ3JCO1FBQ0NnQixXQUFXZixHQUNULDZDQUNBLHFHQUNBLG1FQUNBLCtFQUNBZTtRQUVGTyxhQUFVO1FBQ1QsR0FBR0YsS0FBSztPQUVYIn0=

package/lib/components/Switch/Switch.stories.js

@@ -0,0 +1,61 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { interactWithCanvas } from '../../utils/storyInteractions.js';
+import { FieldDescription, FieldLabel } from '../Fieldset/Fieldset.js';
+import { Switch, SwitchField, SwitchGroup } from './Switch.js';
+const meta = {
+    argTypes: {
+        color: {
+            control: 'select',
+            options: [
+                'primary',
+                'secondary',
+                'link',
+                'neutral',
+                'error',
+                'warning',
+                'success',
+                'info'
+            ]
+        },
+        defaultChecked: {
+            control: 'boolean'
+        }
+    },
+    component: Switch,
+    parameters: {
+        layout: 'centered'
+    },
+    title: 'Components/Form/Switch'
+};
+export default meta;
+export const Default = {
+    args: {
+        'aria-label': 'Enable notifications',
+        color: 'primary',
+        defaultChecked: true
+    },
+    play: interactWithCanvas
+};
+export const WithField = {
+    play: interactWithCanvas,
+    render: ()=>/*#__PURE__*/ _jsx(SwitchGroup, {
+            className: "w-96",
+            children: /*#__PURE__*/ _jsxs(SwitchField, {
+                children: [
+                    /*#__PURE__*/ _jsx(FieldLabel, {
+                        children: "Email notifications"
+                    }),
+                    /*#__PURE__*/ _jsx(FieldDescription, {
+                        children: "Receive project activity summaries."
+                    }),
+                    /*#__PURE__*/ _jsx(Switch, {
+                        defaultChecked: true,
+                        name: "emailNotifications"
+                    })
+                ]
+            })
+        })
+};
+
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy9uaXRyb2c3L0RldmVsb3BtZW50L2dvdGhhbWpzL3NyYy9jb21wb25lbnRzL1N3aXRjaC9Td2l0Y2guc3Rvcmllcy50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0JztcblxuaW1wb3J0IHtpbnRlcmFjdFdpdGhDYW52YXN9IGZyb20gJy4uLy4uL3V0aWxzL3N0b3J5SW50ZXJhY3Rpb25zLmpzJztcbmltcG9ydCB7RmllbGREZXNjcmlwdGlvbiwgRmllbGRMYWJlbH0gZnJvbSAnLi4vRmllbGRzZXQvRmllbGRzZXQuanMnO1xuaW1wb3J0IHtTd2l0Y2gsIFN3aXRjaEZpZWxkLCBTd2l0Y2hHcm91cH0gZnJvbSAnLi9Td2l0Y2guanMnO1xuXG5pbXBvcnQgdHlwZSB7TWV0YSwgU3RvcnlPYmp9IGZyb20gJ0BubGFicy9sZXgvc3Rvcnlib29rJztcblxuY29uc3QgbWV0YTogTWV0YTx0eXBlb2YgU3dpdGNoPiA9IHtcbiAgYXJnVHlwZXM6IHtcbiAgICBjb2xvcjoge1xuICAgICAgY29udHJvbDogJ3NlbGVjdCcsXG4gICAgICBvcHRpb25zOiBbJ3ByaW1hcnknLCAnc2Vjb25kYXJ5JywgJ2xpbmsnLCAnbmV1dHJhbCcsICdlcnJvcicsICd3YXJuaW5nJywgJ3N1Y2Nlc3MnLCAnaW5mbyddXG4gICAgfSxcbiAgICBkZWZhdWx0Q2hlY2tlZDoge1xuICAgICAgY29udHJvbDogJ2Jvb2xlYW4nXG4gICAgfVxuICB9LFxuICBjb21wb25lbnQ6IFN3aXRjaCxcbiAgcGFyYW1ldGVyczoge1xuICAgIGxheW91dDogJ2NlbnRlcmVkJ1xuICB9LFxuICB0aXRsZTogJ0NvbXBvbmVudHMvRm9ybS9Td2l0Y2gnXG59O1xuXG5leHBvcnQgZGVmYXVsdCBtZXRhO1xuXG50eXBlIFN0b3J5ID0gU3RvcnlPYmo8dHlwZW9mIFN3aXRjaD47XG5cbmV4cG9ydCBjb25zdCBEZWZhdWx0OiBTdG9yeSA9IHtcbiAgYXJnczoge1xuICAgICdhcmlhLWxhYmVsJzogJ0VuYWJsZSBub3RpZmljYXRpb25zJyxcbiAgICBjb2xvcjogJ3ByaW1hcnknLFxuICAgIGRlZmF1bHRDaGVja2VkOiB0cnVlXG4gIH0sXG4gIHBsYXk6IGludGVyYWN0V2l0aENhbnZhc1xufTtcblxuZXhwb3J0IGNvbnN0IFdpdGhGaWVsZDogU3RvcnkgPSB7XG4gIHBsYXk6IGludGVyYWN0V2l0aENhbnZhcyxcbiAgcmVuZGVyOiAoKSA9PiAoXG4gICAgPFN3aXRjaEdyb3VwIGNsYXNzTmFtZT1cInctOTZcIj5cbiAgICAgIDxTd2l0Y2hGaWVsZD5cbiAgICAgICAgPEZpZWxkTGFiZWw+RW1haWwgbm90aWZpY2F0aW9uczwvRmllbGRMYWJlbD5cbiAgICAgICAgPEZpZWxkRGVzY3JpcHRpb24+UmVjZWl2ZSBwcm9qZWN0IGFjdGl2aXR5IHN1bW1hcmllcy48L0ZpZWxkRGVzY3JpcHRpb24+XG4gICAgICAgIDxTd2l0Y2ggZGVmYXVsdENoZWNrZWQgbmFtZT1cImVtYWlsTm90aWZpY2F0aW9uc1wiIC8+XG4gICAgICA8L1N3aXRjaEZpZWxkPlxuICAgIDwvU3dpdGNoR3JvdXA+XG4gIClcbn07XG4iXSwibmFtZXMiOlsiUmVhY3QiLCJpbnRlcmFjdFdpdGhDYW52YXMiLCJGaWVsZERlc2NyaXB0aW9uIiwiRmllbGRMYWJlbCIsIlN3aXRjaCIsIlN3aXRjaEZpZWxkIiwiU3dpdGNoR3JvdXAiLCJtZXRhIiwiYXJnVHlwZXMiLCJjb2xvciIsImNvbnRyb2wiLCJvcHRpb25zIiwiZGVmYXVsdENoZWNrZWQiLCJjb21wb25lbnQiLCJwYXJhbWV0ZXJzIiwibGF5b3V0IiwidGl0bGUiLCJEZWZhdWx0IiwiYXJncyIsInBsYXkiLCJXaXRoRmllbGQiLCJyZW5kZXIiLCJjbGFzc05hbWUiLCJuYW1lIl0sIm1hcHBpbmdzIjoiO0FBQUEsT0FBT0EsV0FBVyxRQUFRO0FBRTFCLFNBQVFDLGtCQUFrQixRQUFPLG1DQUFtQztBQUNwRSxTQUFRQyxnQkFBZ0IsRUFBRUMsVUFBVSxRQUFPLDBCQUEwQjtBQUNyRSxTQUFRQyxNQUFNLEVBQUVDLFdBQVcsRUFBRUMsV0FBVyxRQUFPLGNBQWM7QUFJN0QsTUFBTUMsT0FBNEI7SUFDaENDLFVBQVU7UUFDUkMsT0FBTztZQUNMQyxTQUFTO1lBQ1RDLFNBQVM7Z0JBQUM7Z0JBQVc7Z0JBQWE7Z0JBQVE7Z0JBQVc7Z0JBQVM7Z0JBQVc7Z0JBQVc7YUFBTztRQUM3RjtRQUNBQyxnQkFBZ0I7WUFDZEYsU0FBUztRQUNYO0lBQ0Y7SUFDQUcsV0FBV1Q7SUFDWFUsWUFBWTtRQUNWQyxRQUFRO0lBQ1Y7SUFDQUMsT0FBTztBQUNUO0FBRUEsZUFBZVQsS0FBSztBQUlwQixPQUFPLE1BQU1VLFVBQWlCO0lBQzVCQyxNQUFNO1FBQ0osY0FBYztRQUNkVCxPQUFPO1FBQ1BHLGdCQUFnQjtJQUNsQjtJQUNBTyxNQUFNbEI7QUFDUixFQUFFO0FBRUYsT0FBTyxNQUFNbUIsWUFBbUI7SUFDOUJELE1BQU1sQjtJQUNOb0IsUUFBUSxrQkFDTixLQUFDZjtZQUFZZ0IsV0FBVTtzQkFDckIsY0FBQSxNQUFDakI7O2tDQUNDLEtBQUNGO2tDQUFXOztrQ0FDWixLQUFDRDtrQ0FBaUI7O2tDQUNsQixLQUFDRTt3QkFBT1EsY0FBYzt3QkFBQ1csTUFBSzs7Ozs7QUFJcEMsRUFBRSJ9