@verbb/plugin-kit-react 1.0.0

package/dist/components/PaneTabs.js

@@ -0,0 +1,37 @@
+import { cn } from "../utils/classes.js";
+import "../utils/index.js";
+import { jsx } from "react/jsx-runtime";
+import { Tabs } from "@base-ui/react/tabs";
+//#region src/components/PaneTabs.tsx
+function PaneTabs({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Tabs.Root, {
+		"data-slot": "tabs",
+		className: cn("flex flex-col h-full", "rounded-lg", "shadow-[0_0_0_1px_var(--color-gray-200),_0_2px_12px_rgb(205_216_228_/_50%)]", className),
+		...props
+	});
+}
+function PaneTabsList({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Tabs.List, {
+		"data-slot": "tabs-list",
+		className: cn("flex", "shadow-[inset_0_-1px_0_0_rgba(154,165,177,0.25)]", "bg-gray-50 rounded-t-lg", className),
+		...props
+	});
+}
+function PaneTabsTrigger({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Tabs.Tab, {
+		"data-slot": "tabs-trigger",
+		className: cn("flex items-center cursor-pointer outline-none whitespace-nowrap", "h-[45px] px-[24px] text-gray-550", "hover:bg-slate-100", "focus-visible:shadow-[inset_0_0_0_2px_var(--color-sky-600)]", "data-[active]:rounded-t-xs data-[active]:relative data-[active]:bg-white data-[active]:hover:bg-white data-[active]:text-gray-700 data-[active]:shadow-[inset_0_2px_0_rgb(107,114,128),0_0_0_1px_rgba(51,64,77,0.1),0_2px_12px_rgba(205,216,228,0.9)]", className),
+		...props
+	});
+}
+function PaneTabsContent({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Tabs.Panel, {
+		"data-slot": "tabs-content",
+		className: cn("outline-none", "relative", "h-full", "overflow-y-auto", "bg-white rounded-b-lg", "focus-visible:shadow-[inset_0_0_0_2px_var(--color-sky-600)]", className),
+		...props
+	});
+}
+//#endregion
+export { PaneTabs, PaneTabsContent, PaneTabsList, PaneTabsTrigger };
+
+//# sourceMappingURL=PaneTabs.js.map

package/dist/components/PaneTabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaneTabs.js","names":[],"sources":["../../src/components/PaneTabs.tsx"],"sourcesContent":["import { ComponentProps } from 'react';\nimport { Tabs as TabsPrimitive } from '@base-ui/react/tabs';\n\nimport { cn } from '@verbb/plugin-kit-react/utils';\n\nfunction PaneTabs({\n    className,\n    ...props\n}: ComponentProps<typeof TabsPrimitive.Root>) {\n    return (\n        <TabsPrimitive.Root\n            data-slot=\"tabs\"\n            className={cn(\n                // Reset and layout\n                'flex flex-col h-full',\n\n                'rounded-lg',\n                'shadow-[0_0_0_1px_var(--color-gray-200),_0_2px_12px_rgb(205_216_228_/_50%)]',\n\n                className,\n            )}\n            {...props}\n        />\n    );\n}\n\nfunction PaneTabsList({\n    className,\n    ...props\n}: ComponentProps<typeof TabsPrimitive.List>) {\n    return (\n        <TabsPrimitive.List\n            data-slot=\"tabs-list\"\n            className={cn(\n                // Reset and layout\n                'flex',\n\n                'shadow-[inset_0_-1px_0_0_rgba(154,165,177,0.25)]',\n\n                'bg-gray-50 rounded-t-lg',\n\n                className,\n            )}\n            {...props}\n        />\n    );\n}\n\nfunction PaneTabsTrigger({\n    className,\n    ...props\n}: ComponentProps<typeof TabsPrimitive.Tab>) {\n    return (\n        <TabsPrimitive.Tab\n            data-slot=\"tabs-trigger\"\n            className={cn(\n                // Reset and layout\n                'flex items-center cursor-pointer outline-none whitespace-nowrap',\n\n                'h-[45px] px-[24px] text-gray-550',\n\n                // Hover state\n                'hover:bg-slate-100',\n\n                // Accessibility\n                'focus-visible:shadow-[inset_0_0_0_2px_var(--color-sky-600)]',\n\n                // Active state\n                'data-[active]:rounded-t-xs data-[active]:relative data-[active]:bg-white data-[active]:hover:bg-white data-[active]:text-gray-700 data-[active]:shadow-[inset_0_2px_0_rgb(107,114,128),0_0_0_1px_rgba(51,64,77,0.1),0_2px_12px_rgba(205,216,228,0.9)]',\n\n                className,\n            )}\n            {...props}\n        />\n    );\n}\n\nfunction PaneTabsContent({\n    className,\n    ...props\n}: ComponentProps<typeof TabsPrimitive.Panel>) {\n    return (\n        <TabsPrimitive.Panel\n            data-slot=\"tabs-content\"\n            className={cn(\n                // Reset and layout\n                'outline-none',\n                'relative',\n                'h-full',\n\n                'overflow-y-auto',\n                'bg-white rounded-b-lg',\n\n                // Accessibility\n                'focus-visible:shadow-[inset_0_0_0_2px_var(--color-sky-600)]',\n\n                className,\n            )}\n            {...props}\n        />\n    );\n}\n\nexport {\n    PaneTabs,\n    PaneTabsList,\n    PaneTabsTrigger,\n    PaneTabsContent,\n};\n"],"mappings":";;;;;AAKA,SAAS,SAAS,EACd,WACA,GAAG,SACuC;AAC1C,QACI,oBAAC,KAAc,MAAf;EACI,aAAU;EACV,WAAW,GAEP,wBAEA,cACA,+EAEA,UACH;EACD,GAAI;EACN,CAAA;;AAIV,SAAS,aAAa,EAClB,WACA,GAAG,SACuC;AAC1C,QACI,oBAAC,KAAc,MAAf;EACI,aAAU;EACV,WAAW,GAEP,QAEA,oDAEA,2BAEA,UACH;EACD,GAAI;EACN,CAAA;;AAIV,SAAS,gBAAgB,EACrB,WACA,GAAG,SACsC;AACzC,QACI,oBAAC,KAAc,KAAf;EACI,aAAU;EACV,WAAW,GAEP,mEAEA,oCAGA,sBAGA,+DAGA,yPAEA,UACH;EACD,GAAI;EACN,CAAA;;AAIV,SAAS,gBAAgB,EACrB,WACA,GAAG,SACwC;AAC3C,QACI,oBAAC,KAAc,OAAf;EACI,aAAU;EACV,WAAW,GAEP,gBACA,YACA,UAEA,mBACA,yBAGA,+DAEA,UACH;EACD,GAAI;EACN,CAAA"}

package/dist/components/Popover.d.ts

@@ -0,0 +1,12 @@
+import { Popover as PopoverPrimitive } from '@base-ui/react/popover';
+declare function Popover({ ariaLabel, ...props }: PopoverPrimitive.Root.Props): import("react/jsx-runtime").JSX.Element;
+declare function PopoverTrigger({ ...props }: PopoverPrimitive.Trigger.Props): import("react/jsx-runtime").JSX.Element;
+declare function PopoverContent({ className, align, alignOffset, side, sideOffset, positionMethod, collisionBoundary, collisionPadding, sticky, collisionAvoidance, portalClassName, portalContainer, ...props }: PopoverPrimitive.Popup.Props & Pick<PopoverPrimitive.Positioner.Props, 'align' | 'alignOffset' | 'side' | 'sideOffset' | 'positionMethod' | 'collisionBoundary' | 'collisionPadding' | 'sticky' | 'collisionAvoidance'> & {
+    portalClassName?: string;
+    portalContainer?: HTMLElement | ShadowRoot | null;
+}): import("react/jsx-runtime").JSX.Element;
+declare function PopoverHeader({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function PopoverTitle({ className, ...props }: PopoverPrimitive.Title.Props): import("react/jsx-runtime").JSX.Element;
+declare function PopoverDescription({ className, ...props }: PopoverPrimitive.Description.Props): import("react/jsx-runtime").JSX.Element;
+export { Popover, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger, };
+//# sourceMappingURL=Popover.d.ts.map

package/dist/components/Popover.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Popover.d.ts","sourceRoot":"","sources":["../../src/components/Popover.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAIrE,iBAAS,OAAO,CAAC,EAAE,SAAqB,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,CAAC,IAAI,CAAC,KAAK,2CAEhF;AAED,iBAAS,cAAc,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,CAAC,OAAO,CAAC,KAAK,2CAEnE;AAED,iBAAS,cAAc,CAAC,EACpB,SAAS,EACT,KAAgB,EAChB,WAAe,EACf,IAAe,EACf,UAAc,EACd,cAAc,EACd,iBAAiB,EACjB,gBAAgB,EAChB,MAAM,EACN,kBAAkB,EAClB,eAAe,EACf,eAAe,EACf,GAAG,KAAK,EACX,EAAE,gBAAgB,CAAC,KAAK,CAAC,KAAK,GAC3B,IAAI,CACA,gBAAgB,CAAC,UAAU,CAAC,KAAK,EAC/B,OAAO,GACP,aAAa,GACb,MAAM,GACN,YAAY,GACZ,gBAAgB,GAChB,mBAAmB,GACnB,kBAAkB,GAClB,QAAQ,GACR,oBAAoB,CACzB,GAAG;IACA,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,eAAe,CAAC,EAAE,WAAW,GAAG,UAAU,GAAG,IAAI,CAAA;CACpD,2CAoDJ;AAED,iBAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAY1E;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,CAAC,KAAK,CAAC,KAAK,2CAY1E;AAED,iBAAS,kBAAkB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACX,EAAE,gBAAgB,CAAC,WAAW,CAAC,KAAK,2CAYpC;AAGD,OAAO,EACH,OAAO,EACP,cAAc,EACd,kBAAkB,EAClB,aAAa,EACb,YAAY,EACZ,cAAc,GACjB,CAAC"}

package/dist/components/Popover.js

@@ -0,0 +1,70 @@
+import { cn } from "../utils/classes.js";
+import { getPortalClassName, getPortalContainer } from "../utils/portal.js";
+import "../utils/index.js";
+import { jsx } from "react/jsx-runtime";
+import { Popover as Popover$1 } from "@base-ui/react/popover";
+//#region src/components/Popover.tsx
+function Popover({ ariaLabel = "Popover", ...props }) {
+	return /* @__PURE__ */ jsx(Popover$1.Root, {
+		"data-slot": "popover",
+		ariaLabel,
+		...props
+	});
+}
+function PopoverTrigger({ ...props }) {
+	return /* @__PURE__ */ jsx(Popover$1.Trigger, {
+		"data-slot": "popover-trigger",
+		...props
+	});
+}
+function PopoverContent({ className, align = "center", alignOffset = 0, side = "bottom", sideOffset = 4, positionMethod, collisionBoundary, collisionPadding, sticky, collisionAvoidance, portalClassName, portalContainer, ...props }) {
+	const resolvedPortalClassName = getPortalClassName(portalClassName);
+	const resolvedPortalContainer = getPortalContainer(portalContainer);
+	return /* @__PURE__ */ jsx(Popover$1.Portal, {
+		"data-slot": "popover-portal",
+		className: resolvedPortalClassName,
+		container: resolvedPortalContainer,
+		children: /* @__PURE__ */ jsx(Popover$1.Positioner, {
+			align,
+			alignOffset,
+			side,
+			sideOffset,
+			positionMethod,
+			collisionBoundary,
+			collisionPadding,
+			sticky,
+			collisionAvoidance,
+			className: "isolate z-50",
+			children: /* @__PURE__ */ jsx(Popover$1.Popup, {
+				"data-slot": "popover-content",
+				className: cn("z-50 w-72 rounded-md outline-hidden will-change-[transform,opacity]", "bg-white p-4", "shadow-[0_10px_38px_-10px_hsla(206,22%,7%,.35),0_10px_20px_-15px_hsla(206,22%,7%,.2)]", "focus:shadow-[0_10px_38px_-10px_hsla(206,22%,7%,.35),0_10px_20px_-15px_hsla(206,22%,7%,.2)]", "data-[state=open]:animate-in data-[state=closed]:animate-out", "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95", "data-[side=bottom]:slide-in-from-top-2", "data-[side=left]:slide-in-from-right-2", "data-[side=right]:slide-in-from-left-2", "data-[side=top]:slide-in-from-bottom-2", className),
+				...props
+			})
+		})
+	});
+}
+function PopoverHeader({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "popover-header",
+		className: cn("flex flex-col gap-0.5 text-sm", className),
+		...props
+	});
+}
+function PopoverTitle({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Popover$1.Title, {
+		"data-slot": "popover-title",
+		className: cn("font-medium text-sm", className),
+		...props
+	});
+}
+function PopoverDescription({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Popover$1.Description, {
+		"data-slot": "popover-description",
+		className: cn("text-gray-500", className),
+		...props
+	});
+}
+//#endregion
+export { Popover, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger };
+
+//# sourceMappingURL=Popover.js.map

package/dist/components/Popover.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Popover.js","names":[],"sources":["../../src/components/Popover.tsx"],"sourcesContent":["import { Popover as PopoverPrimitive } from '@base-ui/react/popover';\n\nimport { cn, getPortalClassName, getPortalContainer } from '@verbb/plugin-kit-react/utils';\n\nfunction Popover({ ariaLabel = 'Popover', ...props }: PopoverPrimitive.Root.Props) {\n    return <PopoverPrimitive.Root data-slot=\"popover\" ariaLabel={ariaLabel} {...props} />;\n}\n\nfunction PopoverTrigger({ ...props }: PopoverPrimitive.Trigger.Props) {\n    return <PopoverPrimitive.Trigger data-slot=\"popover-trigger\" {...props} />;\n}\n\nfunction PopoverContent({\n    className,\n    align = 'center',\n    alignOffset = 0,\n    side = 'bottom',\n    sideOffset = 4,\n    positionMethod,\n    collisionBoundary,\n    collisionPadding,\n    sticky,\n    collisionAvoidance,\n    portalClassName,\n    portalContainer,\n    ...props\n}: PopoverPrimitive.Popup.Props &\n    Pick<\n        PopoverPrimitive.Positioner.Props,\n        | 'align'\n        | 'alignOffset'\n        | 'side'\n        | 'sideOffset'\n        | 'positionMethod'\n        | 'collisionBoundary'\n        | 'collisionPadding'\n        | 'sticky'\n        | 'collisionAvoidance'\n    > & {\n        portalClassName?: string\n        portalContainer?: HTMLElement | ShadowRoot | null\n    }) {\n    const resolvedPortalClassName = getPortalClassName(portalClassName);\n    const resolvedPortalContainer = getPortalContainer(portalContainer);\n\n    return (\n        <PopoverPrimitive.Portal\n            data-slot=\"popover-portal\"\n            className={resolvedPortalClassName}\n            container={resolvedPortalContainer}\n        >\n            <PopoverPrimitive.Positioner\n                align={align}\n                alignOffset={alignOffset}\n                side={side}\n                sideOffset={sideOffset}\n                positionMethod={positionMethod}\n                collisionBoundary={collisionBoundary}\n                collisionPadding={collisionPadding}\n                sticky={sticky}\n                collisionAvoidance={collisionAvoidance}\n                className=\"isolate z-50\"\n            >\n                <PopoverPrimitive.Popup\n                    data-slot=\"popover-content\"\n                    className={cn(\n                        // Reset and base styles\n                        'z-50 w-72 rounded-md outline-hidden will-change-[transform,opacity]',\n\n                        // Themed styles (backgrounds, colors, shadows, spacing)\n                        'bg-white p-4',\n                        'shadow-[0_10px_38px_-10px_hsla(206,22%,7%,.35),0_10px_20px_-15px_hsla(206,22%,7%,.2)]',\n                        'focus:shadow-[0_10px_38px_-10px_hsla(206,22%,7%,.35),0_10px_20px_-15px_hsla(206,22%,7%,.2)]',\n\n                        // Animation classes for open/closed states\n                        'data-[state=open]:animate-in data-[state=closed]:animate-out',\n                        'data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',\n                        'data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95',\n\n                        // Animation classes for side-based slide-ins\n                        'data-[side=bottom]:slide-in-from-top-2',\n                        'data-[side=left]:slide-in-from-right-2',\n                        'data-[side=right]:slide-in-from-left-2',\n                        'data-[side=top]:slide-in-from-bottom-2',\n\n                        // Additional custom classes passed in as props\n                        className,\n                    )}\n                    {...props}\n                />\n            </PopoverPrimitive.Positioner>\n        </PopoverPrimitive.Portal>\n    );\n}\n\nfunction PopoverHeader({ className, ...props }: React.ComponentProps<'div'>) {\n    return (\n        <div\n            data-slot=\"popover-header\"\n            className={cn(\n                'flex flex-col gap-0.5 text-sm',\n\n                className,\n            )}\n            {...props}\n        />\n    );\n}\n\nfunction PopoverTitle({ className, ...props }: PopoverPrimitive.Title.Props) {\n    return (\n        <PopoverPrimitive.Title\n            data-slot=\"popover-title\"\n            className={cn(\n                'font-medium text-sm',\n\n                className,\n            )}\n            {...props}\n        />\n    );\n}\n\nfunction PopoverDescription({\n    className,\n    ...props\n}: PopoverPrimitive.Description.Props) {\n    return (\n        <PopoverPrimitive.Description\n            data-slot=\"popover-description\"\n            className={cn(\n                'text-gray-500',\n\n                className,\n            )}\n            {...props}\n        />\n    );\n}\n\n\nexport {\n    Popover,\n    PopoverContent,\n    PopoverDescription,\n    PopoverHeader,\n    PopoverTitle,\n    PopoverTrigger,\n};\n"],"mappings":";;;;;;AAIA,SAAS,QAAQ,EAAE,YAAY,WAAW,GAAG,SAAsC;AAC/E,QAAO,oBAAC,UAAiB,MAAlB;EAAuB,aAAU;EAAqB;EAAW,GAAI;EAAS,CAAA;;AAGzF,SAAS,eAAe,EAAE,GAAG,SAAyC;AAClE,QAAO,oBAAC,UAAiB,SAAlB;EAA0B,aAAU;EAAkB,GAAI;EAAS,CAAA;;AAG9E,SAAS,eAAe,EACpB,WACA,QAAQ,UACR,cAAc,GACd,OAAO,UACP,aAAa,GACb,gBACA,mBACA,kBACA,QACA,oBACA,iBACA,iBACA,GAAG,SAgBA;CACH,MAAM,0BAA0B,mBAAmB,gBAAgB;CACnE,MAAM,0BAA0B,mBAAmB,gBAAgB;AAEnE,QACI,oBAAC,UAAiB,QAAlB;EACI,aAAU;EACV,WAAW;EACX,WAAW;YAEX,oBAAC,UAAiB,YAAlB;GACW;GACM;GACP;GACM;GACI;GACG;GACD;GACV;GACY;GACpB,WAAU;aAEV,oBAAC,UAAiB,OAAlB;IACI,aAAU;IACV,WAAW,GAEP,uEAGA,gBACA,yFACA,+FAGA,gEACA,8DACA,gEAGA,0CACA,0CACA,0CACA,0CAGA,UACH;IACD,GAAI;IACN,CAAA;GACwB,CAAA;EACR,CAAA;;AAIlC,SAAS,cAAc,EAAE,WAAW,GAAG,SAAsC;AACzE,QACI,oBAAC,OAAD;EACI,aAAU;EACV,WAAW,GACP,iCAEA,UACH;EACD,GAAI;EACN,CAAA;;AAIV,SAAS,aAAa,EAAE,WAAW,GAAG,SAAuC;AACzE,QACI,oBAAC,UAAiB,OAAlB;EACI,aAAU;EACV,WAAW,GACP,uBAEA,UACH;EACD,GAAI;EACN,CAAA;;AAIV,SAAS,mBAAmB,EACxB,WACA,GAAG,SACgC;AACnC,QACI,oBAAC,UAAiB,aAAlB;EACI,aAAU;EACV,WAAW,GACP,iBAEA,UACH;EACD,GAAI;EACN,CAAA"}

package/dist/components/RadioGroup.d.ts

@@ -0,0 +1,6 @@
+import { Radio as RadioPrimitive } from '@base-ui/react/radio';
+import { RadioGroup as RadioGroupPrimitive } from '@base-ui/react/radio-group';
+declare function RadioGroup({ className, ...props }: RadioGroupPrimitive.Props): import("react/jsx-runtime").JSX.Element;
+declare function RadioGroupItem({ className, ...props }: RadioPrimitive.Root.Props): import("react/jsx-runtime").JSX.Element;
+export { RadioGroup, RadioGroupItem };
+//# sourceMappingURL=RadioGroup.d.ts.map

package/dist/components/RadioGroup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioGroup.d.ts","sourceRoot":"","sources":["../../src/components/RadioGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,IAAI,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAC/D,OAAO,EAAE,UAAU,IAAI,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AAO/E,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,mBAAmB,CAAC,KAAK,2CAarE;AAED,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,IAAI,CAAC,KAAK,2CAgDzE;AAED,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,CAAC"}

package/dist/components/RadioGroup.js

@@ -0,0 +1,34 @@
+import { cn } from "../utils/classes.js";
+import "../utils/index.js";
+import { jsx } from "react/jsx-runtime";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { faCircle } from "@fortawesome/pro-solid-svg-icons";
+import { Radio } from "@base-ui/react/radio";
+import { RadioGroup as RadioGroup$1 } from "@base-ui/react/radio-group";
+//#region src/components/RadioGroup.tsx
+function RadioGroup({ className, ...props }) {
+	return /* @__PURE__ */ jsx(RadioGroup$1, {
+		"data-slot": "radio-group",
+		className: cn("grid gap-1.5", className),
+		...props
+	});
+}
+function RadioGroupItem({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Radio.Root, {
+		"data-slot": "radio-group-item",
+		className: cn("peer cursor-pointer aspect-square shrink-0 rounded-full outline-none border", "size-4 border-slate-400", "focus-visible:border-sky-600 focus-visible:shadow-[0_0_0_1px_var(--color-sky-600),0_0_4px_0_hsl(from_var(--color-sky-600)_h_s_l/0.7)]", "aria-invalid:border-rose-600 aria-invalid:focus-visible:!shadow-[0_0_0_1px_var(--color-rose-600),0_0_4px_0_hsl(from_var(--color-rose-600)_h_s_l/0.7)]", "disabled:cursor-not-allowed disabled:opacity-50", "data-checked:bg-slate-50 data-checked:text-[#1f2933]", className),
+		...props,
+		children: /* @__PURE__ */ jsx(Radio.Indicator, {
+			"data-slot": "radio-group-indicator",
+			className: cn("flex items-center justify-center h-full w-full"),
+			children: /* @__PURE__ */ jsx(FontAwesomeIcon, {
+				icon: faCircle,
+				className: cn("size-2 fill-current text-current")
+			})
+		})
+	});
+}
+//#endregion
+export { RadioGroup, RadioGroupItem };
+
+//# sourceMappingURL=RadioGroup.js.map

package/dist/components/RadioGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioGroup.js","names":[],"sources":["../../src/components/RadioGroup.tsx"],"sourcesContent":["import { Radio as RadioPrimitive } from '@base-ui/react/radio';\nimport { RadioGroup as RadioGroupPrimitive } from '@base-ui/react/radio-group';\n\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faCircle } from '@fortawesome/pro-solid-svg-icons';\n\nimport { cn } from '@verbb/plugin-kit-react/utils';\n\nfunction RadioGroup({ className, ...props }: RadioGroupPrimitive.Props) {\n    return (\n        <RadioGroupPrimitive\n            data-slot=\"radio-group\"\n            className={cn(\n                // Layout and spacing\n                'grid gap-1.5',\n\n                className,\n            )}\n            {...props}\n        />\n    );\n}\n\nfunction RadioGroupItem({ className, ...props }: RadioPrimitive.Root.Props) {\n    return (\n        <RadioPrimitive.Root\n            data-slot=\"radio-group-item\"\n            className={cn(\n                // Layout, shape, and borders\n                // 'aspect-square h-4 w-4 rounded-full border border-primary',\n\n                // // Text and focus styles\n                // 'text-primary ring-offset-background focus:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n\n                // // Disabled state\n                // 'disabled:cursor-not-allowed disabled:opacity-50',\n\n                // Reset\n                'peer cursor-pointer aspect-square shrink-0 rounded-full outline-none border',\n\n                // Themes\n                'size-4 border-slate-400',\n\n                // States\n                'focus-visible:border-sky-600 focus-visible:shadow-[0_0_0_1px_var(--color-sky-600),0_0_4px_0_hsl(from_var(--color-sky-600)_h_s_l/0.7)]',\n                'aria-invalid:border-rose-600 aria-invalid:focus-visible:!shadow-[0_0_0_1px_var(--color-rose-600),0_0_4px_0_hsl(from_var(--color-rose-600)_h_s_l/0.7)]',\n\n                'disabled:cursor-not-allowed disabled:opacity-50',\n                'data-checked:bg-slate-50 data-checked:text-[#1f2933]',\n\n                className,\n            )}\n            {...props}\n        >\n            <RadioPrimitive.Indicator\n                data-slot=\"radio-group-indicator\"\n                className={cn(\n                    // Flex alignment for the indicator\n                    'flex items-center justify-center h-full w-full',\n                )}\n            >\n                <FontAwesomeIcon\n                    icon={faCircle}\n                    className={cn(\n                        // Size and color of the indicator\n                        'size-2 fill-current text-current',\n                    )}\n                />\n            </RadioPrimitive.Indicator>\n        </RadioPrimitive.Root>\n    );\n}\n\nexport { RadioGroup, RadioGroupItem };\n"],"mappings":";;;;;;;;AAQA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAoC;AACpE,QACI,oBAAC,cAAD;EACI,aAAU;EACV,WAAW,GAEP,gBAEA,UACH;EACD,GAAI;EACN,CAAA;;AAIV,SAAS,eAAe,EAAE,WAAW,GAAG,SAAoC;AACxE,QACI,oBAAC,MAAe,MAAhB;EACI,aAAU;EACV,WAAW,GAWP,+EAGA,2BAGA,yIACA,yJAEA,mDACA,wDAEA,UACH;EACD,GAAI;YAEJ,oBAAC,MAAe,WAAhB;GACI,aAAU;GACV,WAAW,GAEP,iDACH;aAED,oBAAC,iBAAD;IACI,MAAM;IACN,WAAW,GAEP,mCACH;IACH,CAAA;GACqB,CAAA;EACT,CAAA"}

package/dist/components/ScrollArea.d.ts

@@ -0,0 +1,16 @@
+import { ScrollArea as ScrollAreaPrimitive } from '@base-ui/react/scroll-area';
+import { RefObject } from 'react';
+import { VariantProps } from 'class-variance-authority';
+declare const scrollAreaVariants: (props?: ({
+    size?: "default" | "xs" | "sm" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+type ScrollAreaSize = NonNullable<VariantProps<typeof scrollAreaVariants>['size']>;
+declare function ScrollArea({ className, children, size, orientation, viewPortClassName, viewPortRef, contentClassName, ...props }: ScrollAreaPrimitive.Root.Props & VariantProps<typeof scrollAreaVariants> & {
+    orientation?: 'horizontal' | 'vertical';
+    size?: ScrollAreaSize;
+    viewPortClassName?: string;
+    viewPortRef?: RefObject<HTMLDivElement>;
+    contentClassName?: string;
+}): import("react/jsx-runtime").JSX.Element;
+export { ScrollArea };
+//# sourceMappingURL=ScrollArea.d.ts.map

package/dist/components/ScrollArea.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScrollArea.d.ts","sourceRoot":"","sources":["../../src/components/ScrollArea.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,IAAI,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AAC/E,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,EAAO,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAE7D,QAAA,MAAM,kBAAkB;;8EAWtB,CAAC;AAEH,KAAK,cAAc,GAAG,WAAW,CAAC,YAAY,CAAC,OAAO,kBAAkB,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC;AAEnF,iBAAS,UAAU,CAAC,EAChB,SAAS,EACT,QAAQ,EACR,IAAgB,EAChB,WAAwB,EACxB,iBAAiB,EACjB,WAAW,EACX,gBAAgB,EAChB,GAAG,KAAK,EACX,EAAE,mBAAmB,CAAC,IAAI,CAAC,KAAK,GAAG,YAAY,CAAC,OAAO,kBAAkB,CAAC,GAAG;IAC1E,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,WAAW,CAAC,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;IACxC,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC7B,2CA8CA;AAED,OAAO,EAAE,UAAU,EAAE,CAAC"}

package/dist/components/ScrollArea.js

@@ -0,0 +1,47 @@
+import { cn } from "../utils/classes.js";
+import "../utils/index.js";
+import { cva } from "class-variance-authority";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ScrollArea as ScrollArea$1 } from "@base-ui/react/scroll-area";
+//#region src/components/ScrollArea.tsx
+var scrollAreaVariants = cva("", {
+	variants: { size: {
+		xs: "data-[orientation=horizontal]:h-[6px] data-[orientation=vertical]:w-[6px] ",
+		sm: "data-[orientation=horizontal]:h-[8px] data-[orientation=vertical]:w-[8px] ",
+		default: "data-[orientation=horizontal]:h-[10px] data-[orientation=vertical]:w-[10px] "
+	} },
+	defaultVariants: { size: "default" }
+});
+function ScrollArea({ className, children, size = "default", orientation = "vertical", viewPortClassName, viewPortRef, contentClassName, ...props }) {
+	return /* @__PURE__ */ jsxs(ScrollArea$1.Root, {
+		"data-slot": "scroll-area",
+		className,
+		...props,
+		children: [
+			/* @__PURE__ */ jsx(ScrollArea$1.Viewport, {
+				"data-slot": "scroll-area-viewport",
+				ref: viewPortRef,
+				className: cn("focus-visible:ring-ring/50 size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:outline-1", viewPortClassName),
+				children: /* @__PURE__ */ jsx(ScrollArea$1.Content, {
+					"data-slot": "scroll-area-content",
+					className: contentClassName,
+					children
+				})
+			}),
+			/* @__PURE__ */ jsx(ScrollArea$1.Scrollbar, {
+				"data-slot": "scroll-area-scrollbar",
+				orientation,
+				className: cn("data-[orientation=horizontal]:flex-col data-[orientation=horizontal]:border-t data-[orientation=horizontal]:border-t-[#e8e8e8]", "data-[orientation=vertical]:h-full data-[orientation=vertical]:border-l data-[orientation=vertical]:border-l-transparent", "flex touch-none transition-colors select-none", "opacity-0 transition-opacity data-[hovering]:opacity-100 data-[hovering]:delay-0 data-[hovering]:pointer-events-auto data-[scrolling]:opacity-100 data-[scrolling]:duration-0 data-[scrolling]:pointer-events-auto", "rounded-full bg-[#e4edf6]", scrollAreaVariants({ size })),
+				children: /* @__PURE__ */ jsx(ScrollArea$1.Thumb, {
+					"data-slot": "scroll-area-thumb",
+					className: "rounded-full bg-[#9aa5b1] hover:bg-[#657383] relative flex-1"
+				})
+			}),
+			/* @__PURE__ */ jsx(ScrollArea$1.Corner, {})
+		]
+	});
+}
+//#endregion
+export { ScrollArea };
+
+//# sourceMappingURL=ScrollArea.js.map

package/dist/components/ScrollArea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScrollArea.js","names":[],"sources":["../../src/components/ScrollArea.tsx"],"sourcesContent":["import { ScrollArea as ScrollAreaPrimitive } from '@base-ui/react/scroll-area';\nimport type { RefObject } from 'react';\n\nimport { cn } from '@verbb/plugin-kit-react/utils';\nimport { cva, VariantProps } from 'class-variance-authority';\n\nconst scrollAreaVariants = cva('', {\n    variants: {\n        size: {\n            xs: 'data-[orientation=horizontal]:h-[6px] data-[orientation=vertical]:w-[6px] ',\n            sm: 'data-[orientation=horizontal]:h-[8px] data-[orientation=vertical]:w-[8px] ',\n            default: 'data-[orientation=horizontal]:h-[10px] data-[orientation=vertical]:w-[10px] ',\n        },\n    },\n    defaultVariants: {\n        size: 'default',\n    },\n});\n\ntype ScrollAreaSize = NonNullable<VariantProps<typeof scrollAreaVariants>['size']>;\n\nfunction ScrollArea({\n    className,\n    children,\n    size = 'default',\n    orientation = 'vertical',\n    viewPortClassName,\n    viewPortRef,\n    contentClassName,\n    ...props\n}: ScrollAreaPrimitive.Root.Props & VariantProps<typeof scrollAreaVariants> & {\n    orientation?: 'horizontal' | 'vertical';\n    size?: ScrollAreaSize;\n    viewPortClassName?: string;\n    viewPortRef?: RefObject<HTMLDivElement>;\n    contentClassName?: string;\n}) {\n    return (\n        <ScrollAreaPrimitive.Root\n            data-slot=\"scroll-area\"\n            className={className}\n            {...props}\n        >\n            <ScrollAreaPrimitive.Viewport\n                data-slot=\"scroll-area-viewport\"\n                ref={viewPortRef}\n                className={cn(\n                    'focus-visible:ring-ring/50 size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:outline-1',\n                    viewPortClassName,\n                )}\n            >\n                <ScrollAreaPrimitive.Content\n                    data-slot=\"scroll-area-content\"\n                    className={contentClassName}\n                >\n                    {children}\n                </ScrollAreaPrimitive.Content>\n            </ScrollAreaPrimitive.Viewport>\n\n            <ScrollAreaPrimitive.Scrollbar\n                data-slot=\"scroll-area-scrollbar\"\n                orientation={orientation}\n                // data-hovering=\"true\"\n                className={cn(\n                    'data-[orientation=horizontal]:flex-col data-[orientation=horizontal]:border-t data-[orientation=horizontal]:border-t-[#e8e8e8]',\n                    'data-[orientation=vertical]:h-full data-[orientation=vertical]:border-l data-[orientation=vertical]:border-l-transparent',\n                    'flex touch-none transition-colors select-none',\n                    'opacity-0 transition-opacity data-[hovering]:opacity-100 data-[hovering]:delay-0 data-[hovering]:pointer-events-auto data-[scrolling]:opacity-100 data-[scrolling]:duration-0 data-[scrolling]:pointer-events-auto',\n                    'rounded-full bg-[#e4edf6]',\n\n                    scrollAreaVariants({ size }),\n                )}\n            >\n                <ScrollAreaPrimitive.Thumb\n                    data-slot=\"scroll-area-thumb\"\n                    className=\"rounded-full bg-[#9aa5b1] hover:bg-[#657383] relative flex-1\"\n                />\n            </ScrollAreaPrimitive.Scrollbar>\n\n            <ScrollAreaPrimitive.Corner />\n        </ScrollAreaPrimitive.Root>\n    );\n}\n\nexport { ScrollArea };\n"],"mappings":";;;;;;AAMA,IAAM,qBAAqB,IAAI,IAAI;CAC/B,UAAU,EACN,MAAM;EACF,IAAI;EACJ,IAAI;EACJ,SAAS;EACZ,EACJ;CACD,iBAAiB,EACb,MAAM,WACT;CACJ,CAAC;AAIF,SAAS,WAAW,EAChB,WACA,UACA,OAAO,WACP,cAAc,YACd,mBACA,aACA,kBACA,GAAG,SAOJ;AACC,QACI,qBAAC,aAAoB,MAArB;EACI,aAAU;EACC;EACX,GAAI;YAHR;GAKI,oBAAC,aAAoB,UAArB;IACI,aAAU;IACV,KAAK;IACL,WAAW,GACP,sJACA,kBACH;cAED,oBAAC,aAAoB,SAArB;KACI,aAAU;KACV,WAAW;KAEV;KACyB,CAAA;IACH,CAAA;GAE/B,oBAAC,aAAoB,WAArB;IACI,aAAU;IACG;IAEb,WAAW,GACP,kIACA,4HACA,iDACA,sNACA,6BAEA,mBAAmB,EAAE,MAAM,CAAC,CAC/B;cAED,oBAAC,aAAoB,OAArB;KACI,aAAU;KACV,WAAU;KACZ,CAAA;IAC0B,CAAA;GAEhC,oBAAC,aAAoB,QAArB,EAA8B,CAAA;GACP"}

package/dist/components/Select.d.ts

@@ -0,0 +1,23 @@
+import { ComponentProps } from 'react';
+import { Select as SelectPrimitive } from '@base-ui/react/select';
+import { VariantProps } from 'class-variance-authority';
+declare const selectTriggerVariants: (props?: ({
+    size?: "default" | "xs" | "sm" | "lg" | "xl" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+type SelectSize = VariantProps<typeof selectTriggerVariants>['size'];
+declare function Select({ size, children, ...props }: ComponentProps<typeof SelectPrimitive.Root> & {
+    size?: SelectSize;
+}): import("react/jsx-runtime").JSX.Element;
+declare function SelectGroup({ className, ...props }: SelectPrimitive.Group.Props): import("react/jsx-runtime").JSX.Element;
+declare function SelectValue({ className, ...props }: SelectPrimitive.Value.Props): import("react/jsx-runtime").JSX.Element;
+declare function SelectTrigger({ className, size, children, ...props }: SelectPrimitive.Trigger.Props & {
+    size?: SelectSize;
+}): import("react/jsx-runtime").JSX.Element;
+declare function SelectContent({ className, children, side, sideOffset, align, alignOffset, alignItemWithTrigger, ...props }: SelectPrimitive.Popup.Props & Pick<SelectPrimitive.Positioner.Props, 'align' | 'alignOffset' | 'side' | 'sideOffset' | 'alignItemWithTrigger'>): import("react/jsx-runtime").JSX.Element;
+declare function SelectLabel({ className, ...props }: SelectPrimitive.GroupLabel.Props): import("react/jsx-runtime").JSX.Element;
+declare function SelectItem({ className, children, ...props }: SelectPrimitive.Item.Props): import("react/jsx-runtime").JSX.Element;
+declare function SelectSeparator({ className, ...props }: SelectPrimitive.Separator.Props): import("react/jsx-runtime").JSX.Element;
+declare function SelectScrollUpButton({ className, ...props }: ComponentProps<typeof SelectPrimitive.ScrollUpArrow>): import("react/jsx-runtime").JSX.Element;
+declare function SelectScrollDownButton({ className, ...props }: ComponentProps<typeof SelectPrimitive.ScrollDownArrow>): import("react/jsx-runtime").JSX.Element;
+export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, };
+//# sourceMappingURL=Select.d.ts.map

package/dist/components/Select.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../src/components/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAA6B,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAClE,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAOlE,QAAA,MAAM,qBAAqB;;8EAazB,CAAC;AAsFH,KAAK,UAAU,GAAG,YAAY,CAAC,OAAO,qBAAqB,CAAC,CAAC,MAAM,CAAC,CAAC;AAIrE,iBAAS,MAAM,CAAC,EACZ,IAAgB,EAChB,QAAQ,EACR,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,GAAG;IAAE,IAAI,CAAC,EAAE,UAAU,CAAA;CAAE,2CAQrE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,CAAC,KAAK,CAAC,KAAK,2CAUxE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,CAAC,KAAK,CAAC,KAAK,2CAaxE;AAED,iBAAS,aAAa,CAAC,EACnB,SAAS,EACT,IAAI,EACJ,QAAQ,EACR,GAAG,KAAK,EACX,EAAE,eAAe,CAAC,OAAO,CAAC,KAAK,GAAG;IAC/B,IAAI,CAAC,EAAE,UAAU,CAAC;CACrB,2CA0DA;AAGD,iBAAS,aAAa,CAAC,EACnB,SAAS,EACT,QAAQ,EACR,IAAe,EACf,UAAc,EACd,KAAgB,EAChB,WAAe,EACf,oBAA2B,EAC3B,GAAG,KAAK,EACX,EAAE,eAAe,CAAC,KAAK,CAAC,KAAK,GAC1B,IAAI,CACA,eAAe,CAAC,UAAU,CAAC,KAAK,EAChC,OAAO,GAAG,aAAa,GAAG,MAAM,GAAG,YAAY,GAAG,sBAAsB,CAC3E,2CAsDJ;AAED,iBAAS,WAAW,CAAC,EACjB,SAAS,EACT,GAAG,KAAK,EACX,EAAE,eAAe,CAAC,UAAU,CAAC,KAAK,2CAkBlC;AAED,iBAAS,UAAU,CAAC,EAChB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACX,EAAE,eAAe,CAAC,IAAI,CAAC,KAAK,2CAqD5B;AAED,iBAAS,eAAe,CAAC,EACrB,SAAS,EACT,GAAG,KAAK,EACX,EAAE,eAAe,CAAC,SAAS,CAAC,KAAK,2CAmBjC;AAED,iBAAS,oBAAoB,CAAC,EAC1B,SAAS,EACT,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,aAAa,CAAC,2CAsBtD;AAED,iBAAS,sBAAsB,CAAC,EAC5B,SAAS,EACT,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,eAAe,CAAC,2CAsBxD;AAGD,OAAO,EACH,MAAM,EACN,aAAa,EACb,WAAW,EACX,UAAU,EACV,WAAW,EACX,sBAAsB,EACtB,oBAAoB,EACpB,eAAe,EACf,aAAa,EACb,WAAW,GACd,CAAC"}

package/dist/components/Select.js

@@ -0,0 +1,205 @@
+import { cn } from "../utils/classes.js";
+import { getPortalClassName, getPortalContainer } from "../utils/portal.js";
+import "../utils/index.js";
+import { createContext, useContext } from "react";
+import { cva } from "class-variance-authority";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { faCheck, faChevronDown, faChevronUp } from "@fortawesome/pro-solid-svg-icons";
+import { Select as Select$1 } from "@base-ui/react/select";
+//#region src/components/Select.tsx
+var selectTriggerVariants = cva("", {
+	variants: { size: {
+		xs: "px-2 py-1 text-[11px] rounded-sm [&_svg:not([class*=\"size-\"])]:size-3",
+		sm: "px-2.5 py-1.5 text-[12px] rounded-md [&_svg:not([class*=\"size-\"])]:size-3",
+		default: "px-[10px] py-[6px] text-[14px] rounded-lg [&_svg:not([class*=\"size-\"])]:size-3",
+		lg: "px-3 py-2 text-sm rounded-lg [&_svg:not([class*=\"size-\"])]:size-3",
+		xl: "px-3.5 py-2.5 text-sm rounded-lg [&_svg:not([class*=\"size-\"])]:size-3"
+	} },
+	defaultVariants: { size: "default" }
+});
+var selectTriggerIconVariants = cva("", {
+	variants: { size: {
+		xs: "size-[10px]",
+		sm: "size-[11px]",
+		default: "size-3",
+		lg: "size-3",
+		xl: "size-3.5"
+	} },
+	defaultVariants: { size: "default" }
+});
+var selectItemIndicatorVariants = cva("", {
+	variants: { size: {
+		xs: "right-2 size-3",
+		sm: "right-2.5 size-3",
+		default: "right-2 size-3",
+		lg: "right-3 size-3",
+		xl: "right-3.5 size-3"
+	} },
+	defaultVariants: { size: "default" }
+});
+var selectItemIndicatorIconVariants = cva("", {
+	variants: { size: {
+		xs: "size-3",
+		sm: "size-3",
+		default: "size-3",
+		lg: "size-3",
+		xl: "size-3"
+	} },
+	defaultVariants: { size: "default" }
+});
+var selectLabelVariants = cva(["text-slate-700"], {
+	variants: { size: {
+		xs: "px-2 pt-1 text-[11px]",
+		sm: "px-2.5 pt-1 text-[12px]",
+		default: "px-2.5 pt-1 text-xs",
+		lg: "px-3 pt-1 text-sm",
+		xl: "px-3.5 pt-1 text-base"
+	} },
+	defaultVariants: { size: "default" }
+});
+var selectItemVariants = cva("", {
+	variants: {
+		size: {
+			xs: "px-2 py-1 pr-7 text-[11px] [&_svg:not([class*=\"size-\"])]:size-3",
+			sm: "px-2.5 py-1.5 pr-7 text-[12px] [&_svg:not([class*=\"size-\"])]:size-3",
+			default: "px-[10px] py-[6px] pr-8 text-[14px] [&_svg:not([class*=\"size-\"])]:size-3",
+			lg: "px-3 py-2 pr-8 text-sm [&_svg:not([class*=\"size-\"])]:size-3",
+			xl: "px-3.5 py-2.5 pr-9 text-sm [&_svg:not([class*=\"size-\"])]:size-3"
+		},
+		variant: {
+			default: "",
+			destructive: "text-error"
+		}
+	},
+	defaultVariants: {
+		size: "default",
+		variant: "default"
+	}
+});
+var SelectContext = createContext({ size: "default" });
+function Select({ size = "default", children, ...props }) {
+	return /* @__PURE__ */ jsx(SelectContext.Provider, {
+		value: { size },
+		children: /* @__PURE__ */ jsx(Select$1.Root, {
+			"data-slot": "select",
+			"data-size": size,
+			...props,
+			children
+		})
+	});
+}
+function SelectGroup({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Select$1.Group, {
+		"data-slot": "select-group",
+		className: cn(className),
+		...props
+	});
+}
+function SelectValue({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Select$1.Value, {
+		"data-slot": "select-value",
+		className: cn("min-w-0 flex-1 basis-0 overflow-hidden text-left truncate", className),
+		...props
+	});
+}
+function SelectTrigger({ className, size, children, ...props }) {
+	const context = useContext(SelectContext);
+	const finalSize = size || context.size || "default";
+	return /* @__PURE__ */ jsxs(Select$1.Trigger, {
+		"data-slot": "select-trigger",
+		"data-size": finalSize,
+		className: cn("flex w-fit items-center justify-between whitespace-nowrap outline-none select-none transition-none", "gap-3", "bg-slate-250", "border border-transparent", "hover:not-disabled:bg-slate-300", "*:data-[slot=select-value]:flex", "*:data-[slot=select-value]:items-center", "*:data-[slot=select-value]:gap-1.5", "*:data-[slot=select-value]:line-clamp-1", "focus-visible:border-sky-600 focus-visible:shadow-[0_0_0_1px_var(--color-sky-600),0_0_4px_0_hsl(from_var(--color-sky-600)_h_s_l/0.7)]", "aria-invalid:border-rose-600! aria-invalid:focus-visible:shadow-[0_0_0_1px_var(--color-rose-600),0_0_4px_0_hsl(from_var(--color-rose-600)_h_s_l/0.7)]!", "disabled:cursor-not-allowed disabled:opacity-50", "[&_svg]:pointer-events-none [&_svg]:shrink-0", selectTriggerVariants({ size: finalSize }), className),
+		...props,
+		children: [children, /* @__PURE__ */ jsx(Select$1.Icon, { render: /* @__PURE__ */ jsx(FontAwesomeIcon, {
+			icon: faChevronDown,
+			className: cn("pointer-events-none", selectTriggerIconVariants({ size: finalSize }))
+		}) })]
+	});
+}
+function SelectContent({ className, children, side = "bottom", sideOffset = 4, align = "center", alignOffset = 0, alignItemWithTrigger = true, ...props }) {
+	const resolvedPortalClassName = getPortalClassName();
+	const resolvedPortalContainer = getPortalContainer();
+	return /* @__PURE__ */ jsx(Select$1.Portal, {
+		className: resolvedPortalClassName,
+		container: resolvedPortalContainer,
+		children: /* @__PURE__ */ jsx(Select$1.Positioner, {
+			side,
+			sideOffset,
+			align,
+			alignOffset,
+			alignItemWithTrigger,
+			className: "isolate z-50",
+			children: /* @__PURE__ */ jsxs(Select$1.Popup, {
+				"data-slot": "select-content",
+				"data-align-trigger": alignItemWithTrigger,
+				className: cn("relative isolate z-50 overflow-x-hidden overflow-y-auto", "min-w-(--anchor-width)", "max-w-[min(36rem,calc(100vw-2rem))]", "rounded-md bg-white", "shadow-[0_0_0_1px_rgba(31,41,51,0.1),0_5px_20px_rgba(31,41,51,0.25)]", "duration-100", "data-open:animate-in data-closed:animate-out", "data-open:fade-in-0 data-closed:fade-out-0", "data-open:zoom-in-95 data-closed:zoom-out-95", "data-[side=bottom]:slide-in-from-top-2", "data-[side=top]:slide-in-from-bottom-2", "data-[side=left]:slide-in-from-right-2", "data-[side=right]:slide-in-from-left-2", "data-[side=inline-start]:slide-in-from-right-2", "data-[side=inline-end]:slide-in-from-left-2", "data-[align-trigger=true]:animate-none", "origin-(--transform-origin)", className),
+				...props,
+				children: [
+					/* @__PURE__ */ jsx(SelectScrollUpButton, {}),
+					/* @__PURE__ */ jsx(Select$1.List, { children }),
+					/* @__PURE__ */ jsx(SelectScrollDownButton, {})
+				]
+			})
+		})
+	});
+}
+function SelectLabel({ className, ...props }) {
+	const { size } = useContext(SelectContext);
+	return /* @__PURE__ */ jsx(Select$1.GroupLabel, {
+		"data-slot": "select-label",
+		className: cn("text-slate-700", selectLabelVariants({ size }), className),
+		...props
+	});
+}
+function SelectItem({ className, children, ...props }) {
+	const { size } = useContext(SelectContext);
+	return /* @__PURE__ */ jsxs(Select$1.Item, {
+		"data-slot": "select-item",
+		className: cn("relative flex w-full cursor-default items-center outline-hidden select-none", "gap-1.5", "*:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2", "focus:bg-slate-100 data-[highlighted]:bg-slate-100", "data-disabled:pointer-events-none data-disabled:opacity-50", "[&_svg]:pointer-events-none [&_svg]:shrink-0", selectItemVariants({ size }), className),
+		...props,
+		children: [/* @__PURE__ */ jsx(Select$1.ItemText, {
+			className: "flex min-w-0 items-center flex-1 gap-2 whitespace-nowrap",
+			children
+		}), /* @__PURE__ */ jsx(Select$1.ItemIndicator, { render: /* @__PURE__ */ jsx("span", {
+			className: cn("pointer-events-none absolute flex items-center justify-center", selectItemIndicatorVariants({ size })),
+			children: /* @__PURE__ */ jsx(FontAwesomeIcon, {
+				icon: faCheck,
+				className: cn("pointer-events-none", selectItemIndicatorIconVariants({ size }))
+			})
+		}) })]
+	});
+}
+function SelectSeparator({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Select$1.Separator, {
+		"data-slot": "select-separator",
+		className: cn("pointer-events-none", "-mx-1 my-1 h-px", "bg-slate-200", className),
+		...props
+	});
+}
+function SelectScrollUpButton({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Select$1.ScrollUpArrow, {
+		"data-slot": "select-scroll-up-button",
+		className: cn("top-0 w-full flex items-center justify-center", "cursor-default", "bg-white py-1", "[&_svg:not([class*='size-'])]:size-3", className),
+		...props,
+		children: /* @__PURE__ */ jsx(FontAwesomeIcon, {
+			icon: faChevronUp,
+			className: "size-3 pointer-events-none"
+		})
+	});
+}
+function SelectScrollDownButton({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Select$1.ScrollDownArrow, {
+		"data-slot": "select-scroll-down-button",
+		className: cn("bottom-0 w-full flex items-center justify-center", "cursor-default", "bg-white py-1", "[&_svg:not([class*='size-'])]:size-3", className),
+		...props,
+		children: /* @__PURE__ */ jsx(FontAwesomeIcon, {
+			icon: faChevronDown,
+			className: "size-3 pointer-events-none"
+		})
+	});
+}
+//#endregion
+export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue };
+
+//# sourceMappingURL=Select.js.map

package/dist/components/Select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.js","names":[],"sources":["../../src/components/Select.tsx"],"sourcesContent":["import { ComponentProps, createContext, useContext } from 'react';\nimport { Select as SelectPrimitive } from '@base-ui/react/select';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faCheck, faChevronDown, faChevronUp } from '@fortawesome/pro-solid-svg-icons';\n\nimport { cn, getPortalClassName, getPortalContainer } from '@verbb/plugin-kit-react/utils';\n\nconst selectTriggerVariants = cva('', {\n    variants: {\n        size: {\n            xs: 'px-2 py-1 text-[11px] rounded-sm [&_svg:not([class*=\"size-\"])]:size-3',\n            sm: 'px-2.5 py-1.5 text-[12px] rounded-md [&_svg:not([class*=\"size-\"])]:size-3',\n            default: 'px-[10px] py-[6px] text-[14px] rounded-lg [&_svg:not([class*=\"size-\"])]:size-3',\n            lg: 'px-3 py-2 text-sm rounded-lg [&_svg:not([class*=\"size-\"])]:size-3',\n            xl: 'px-3.5 py-2.5 text-sm rounded-lg [&_svg:not([class*=\"size-\"])]:size-3',\n        },\n    },\n    defaultVariants: {\n        size: 'default',\n    },\n});\n\nconst selectTriggerIconVariants = cva('', {\n    variants: {\n        size: {\n            xs: 'size-[10px]',\n            sm: 'size-[11px]',\n            default: 'size-3',\n            lg: 'size-3',\n            xl: 'size-3.5',\n        },\n    },\n    defaultVariants: {\n        size: 'default',\n    },\n});\n\nconst selectItemIndicatorVariants = cva('', {\n    variants: {\n        size: {\n            xs: 'right-2 size-3',\n            sm: 'right-2.5 size-3',\n            default: 'right-2 size-3',\n            lg: 'right-3 size-3',\n            xl: 'right-3.5 size-3',\n        },\n    },\n    defaultVariants: {\n        size: 'default',\n    },\n});\nconst selectItemIndicatorIconVariants = cva('', {\n    variants: {\n        size: {\n            xs: 'size-3',\n            sm: 'size-3',\n            default: 'size-3',\n            lg: 'size-3',\n            xl: 'size-3',\n        },\n    },\n    defaultVariants: {\n        size: 'default',\n    },\n});\n\nconst selectLabelVariants = cva([\n    // Theme\n    'text-slate-700',\n], {\n    variants: {\n        size: {\n            xs: 'px-2 pt-1 text-[11px]',\n            sm: 'px-2.5 pt-1 text-[12px]',\n            default: 'px-2.5 pt-1 text-xs',\n            lg: 'px-3 pt-1 text-sm',\n            xl: 'px-3.5 pt-1 text-base',\n        },\n    },\n    defaultVariants: {\n        size: 'default',\n    },\n});\n\nconst selectItemVariants = cva('', {\n    variants: {\n        size: {\n            xs: 'px-2 py-1 pr-7 text-[11px] [&_svg:not([class*=\"size-\"])]:size-3',\n            sm: 'px-2.5 py-1.5 pr-7 text-[12px] [&_svg:not([class*=\"size-\"])]:size-3',\n            default: 'px-[10px] py-[6px] pr-8 text-[14px] [&_svg:not([class*=\"size-\"])]:size-3',\n            lg: 'px-3 py-2 pr-8 text-sm [&_svg:not([class*=\"size-\"])]:size-3',\n            xl: 'px-3.5 py-2.5 pr-9 text-sm [&_svg:not([class*=\"size-\"])]:size-3',\n\n\n        },\n        variant: {\n            default: '',\n            destructive: 'text-error',\n        },\n    },\n    defaultVariants: {\n        size: 'default',\n        variant: 'default',\n    },\n});\n\ntype SelectSize = VariantProps<typeof selectTriggerVariants>['size'];\n\nconst SelectContext = createContext<{ size: SelectSize }>({ size: 'default' });\n\nfunction Select({\n    size = 'default',\n    children,\n    ...props\n}: ComponentProps<typeof SelectPrimitive.Root> & { size?: SelectSize }) {\n    return (\n        <SelectContext.Provider value={{ size }}>\n            <SelectPrimitive.Root data-slot=\"select\" data-size={size} {...props}>\n                {children}\n            </SelectPrimitive.Root>\n        </SelectContext.Provider>\n    );\n}\n\nfunction SelectGroup({ className, ...props }: SelectPrimitive.Group.Props) {\n    return (\n        <SelectPrimitive.Group\n            data-slot=\"select-group\"\n            className={cn(\n                className,\n            )}\n            {...props}\n        />\n    );\n}\n\nfunction SelectValue({ className, ...props }: SelectPrimitive.Value.Props) {\n    return (\n        <SelectPrimitive.Value\n            data-slot=\"select-value\"\n            className={cn(\n                // Layout\n                'min-w-0 flex-1 basis-0 overflow-hidden text-left truncate',\n\n                className,\n            )}\n            {...props}\n        />\n    );\n}\n\nfunction SelectTrigger({\n    className,\n    size,\n    children,\n    ...props\n}: SelectPrimitive.Trigger.Props & {\n    size?: SelectSize;\n}) {\n    const context = useContext(SelectContext);\n    const finalSize = size || context.size || 'default';\n\n    return (\n        <SelectPrimitive.Trigger\n            data-slot=\"select-trigger\"\n            data-size={finalSize}\n            className={cn(\n                // Reset\n                'flex w-fit items-center justify-between whitespace-nowrap outline-none select-none transition-none',\n\n                // Layout\n                'gap-3',\n\n                // Theme\n                'bg-slate-250',\n                'border border-transparent',\n\n                // Hover\n                'hover:not-disabled:bg-slate-300',\n\n                // Value\n                '*:data-[slot=select-value]:flex',\n                '*:data-[slot=select-value]:items-center',\n                '*:data-[slot=select-value]:gap-1.5',\n                '*:data-[slot=select-value]:line-clamp-1',\n\n                // Focus\n                'focus-visible:border-sky-600 focus-visible:shadow-[0_0_0_1px_var(--color-sky-600),0_0_4px_0_hsl(from_var(--color-sky-600)_h_s_l/0.7)]',\n                'aria-invalid:border-rose-600! aria-invalid:focus-visible:shadow-[0_0_0_1px_var(--color-rose-600),0_0_4px_0_hsl(from_var(--color-rose-600)_h_s_l/0.7)]!',\n\n                // Disabled\n                'disabled:cursor-not-allowed disabled:opacity-50',\n\n                // Icons\n                '[&_svg]:pointer-events-none [&_svg]:shrink-0',\n\n                selectTriggerVariants({ size: finalSize }),\n\n                className,\n            )}\n            {...props}\n        >\n            {children}\n            <SelectPrimitive.Icon\n                render={\n                    <FontAwesomeIcon\n                        icon={faChevronDown}\n                        className={cn(\n                            'pointer-events-none',\n                            selectTriggerIconVariants({ size: finalSize }),\n                        )}\n                    />\n                }\n            />\n        </SelectPrimitive.Trigger>\n    );\n}\n\n/* eslint-disable no-use-before-define */\nfunction SelectContent({\n    className,\n    children,\n    side = 'bottom',\n    sideOffset = 4,\n    align = 'center',\n    alignOffset = 0,\n    alignItemWithTrigger = true,\n    ...props\n}: SelectPrimitive.Popup.Props &\n    Pick<\n        SelectPrimitive.Positioner.Props,\n        'align' | 'alignOffset' | 'side' | 'sideOffset' | 'alignItemWithTrigger'\n    >) {\n    const resolvedPortalClassName = getPortalClassName();\n    const resolvedPortalContainer = getPortalContainer();\n\n    return (\n        <SelectPrimitive.Portal className={resolvedPortalClassName} container={resolvedPortalContainer}>\n            <SelectPrimitive.Positioner\n                side={side}\n                sideOffset={sideOffset}\n                align={align}\n                alignOffset={alignOffset}\n                alignItemWithTrigger={alignItemWithTrigger}\n                className=\"isolate z-50\"\n            >\n                <SelectPrimitive.Popup\n                    data-slot=\"select-content\"\n                    data-align-trigger={alignItemWithTrigger}\n                    className={cn(\n                        // Reset\n                        'relative isolate z-50 overflow-x-hidden overflow-y-auto',\n\n                        // Layout\n                        'min-w-(--anchor-width)',\n                        'max-w-[min(36rem,calc(100vw-2rem))]',\n\n                        // Theme\n                        'rounded-md bg-white',\n                        'shadow-[0_0_0_1px_rgba(31,41,51,0.1),0_5px_20px_rgba(31,41,51,0.25)]',\n\n                        // Animation\n                        'duration-100',\n                        'data-open:animate-in data-closed:animate-out',\n                        'data-open:fade-in-0 data-closed:fade-out-0',\n                        'data-open:zoom-in-95 data-closed:zoom-out-95',\n                        'data-[side=bottom]:slide-in-from-top-2',\n                        'data-[side=top]:slide-in-from-bottom-2',\n                        'data-[side=left]:slide-in-from-right-2',\n                        'data-[side=right]:slide-in-from-left-2',\n                        'data-[side=inline-start]:slide-in-from-right-2',\n                        'data-[side=inline-end]:slide-in-from-left-2',\n                        'data-[align-trigger=true]:animate-none',\n                        'origin-(--transform-origin)',\n\n                        className,\n                    )}\n                    {...props}\n                >\n                    <SelectScrollUpButton />\n                    <SelectPrimitive.List>{children}</SelectPrimitive.List>\n                    <SelectScrollDownButton />\n                </SelectPrimitive.Popup>\n            </SelectPrimitive.Positioner>\n        </SelectPrimitive.Portal>\n    );\n}\n\nfunction SelectLabel({\n    className,\n    ...props\n}: SelectPrimitive.GroupLabel.Props) {\n    const { size } = useContext(SelectContext);\n\n    return (\n        <SelectPrimitive.GroupLabel\n            data-slot=\"select-label\"\n            className={cn(\n                // Theme\n                'text-slate-700',\n\n                // Size\n                selectLabelVariants({ size }),\n\n                className,\n            )}\n            {...props}\n        />\n    );\n}\n\nfunction SelectItem({\n    className,\n    children,\n    ...props\n}: SelectPrimitive.Item.Props) {\n    const { size } = useContext(SelectContext);\n\n    return (\n        <SelectPrimitive.Item\n            data-slot=\"select-item\"\n            className={cn(\n                // Reset\n                'relative flex w-full cursor-default items-center outline-hidden select-none',\n\n                // Layout\n                'gap-1.5',\n                '*:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2',\n\n                // Focus\n                'focus:bg-slate-100 data-[highlighted]:bg-slate-100',\n\n                // Disabled\n                'data-disabled:pointer-events-none data-disabled:opacity-50',\n\n                // Icons\n                '[&_svg]:pointer-events-none [&_svg]:shrink-0',\n\n                selectItemVariants({ size }),\n\n                className,\n            )}\n            {...props}\n        >\n            <SelectPrimitive.ItemText className=\"flex min-w-0 items-center flex-1 gap-2 whitespace-nowrap\">\n                {children}\n            </SelectPrimitive.ItemText>\n            <SelectPrimitive.ItemIndicator\n                render={\n                    <span\n                        className={cn(\n                            'pointer-events-none absolute flex items-center justify-center',\n\n                            selectItemIndicatorVariants({ size }),\n                        )}\n                    >\n                        <FontAwesomeIcon\n                            icon={faCheck}\n                            className={cn(\n                                'pointer-events-none',\n                                selectItemIndicatorIconVariants({ size }),\n                            )}\n                        />\n                    </span>\n                }\n            />\n        </SelectPrimitive.Item>\n    );\n}\n\nfunction SelectSeparator({\n    className,\n    ...props\n}: SelectPrimitive.Separator.Props) {\n    return (\n        <SelectPrimitive.Separator\n            data-slot=\"select-separator\"\n            className={cn(\n                // Reset\n                'pointer-events-none',\n\n                // Layout\n                '-mx-1 my-1 h-px',\n\n                // Theme\n                'bg-slate-200',\n\n                className,\n            )}\n            {...props}\n        />\n    );\n}\n\nfunction SelectScrollUpButton({\n    className,\n    ...props\n}: ComponentProps<typeof SelectPrimitive.ScrollUpArrow>) {\n    return (\n        <SelectPrimitive.ScrollUpArrow\n            data-slot=\"select-scroll-up-button\"\n            className={cn(\n                // Layout\n                'top-0 w-full flex items-center justify-center',\n                'cursor-default',\n\n                // Theme\n                'bg-white py-1',\n\n                // Icons\n                \"[&_svg:not([class*='size-'])]:size-3\",\n\n                className,\n            )}\n            {...props}\n        >\n            <FontAwesomeIcon icon={faChevronUp} className=\"size-3 pointer-events-none\" />\n        </SelectPrimitive.ScrollUpArrow>\n    );\n}\n\nfunction SelectScrollDownButton({\n    className,\n    ...props\n}: ComponentProps<typeof SelectPrimitive.ScrollDownArrow>) {\n    return (\n        <SelectPrimitive.ScrollDownArrow\n            data-slot=\"select-scroll-down-button\"\n            className={cn(\n                // Layout\n                'bottom-0 w-full flex items-center justify-center',\n                'cursor-default',\n\n                // Theme\n                'bg-white py-1',\n\n                // Icons\n                \"[&_svg:not([class*='size-'])]:size-3\",\n\n                className,\n            )}\n            {...props}\n        >\n            <FontAwesomeIcon icon={faChevronDown} className=\"size-3 pointer-events-none\" />\n        </SelectPrimitive.ScrollDownArrow>\n    );\n}\n/* eslint-enable no-use-before-define */\n\nexport {\n    Select,\n    SelectContent,\n    SelectGroup,\n    SelectItem,\n    SelectLabel,\n    SelectScrollDownButton,\n    SelectScrollUpButton,\n    SelectSeparator,\n    SelectTrigger,\n    SelectValue,\n};\n"],"mappings":"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"}

package/dist/components/SelectInput.d.ts

@@ -0,0 +1,33 @@
+import { Select } from '.';
+import { default as React, ComponentProps } from 'react';
+export interface Option<T = unknown> {
+    value: T;
+    label: string;
+    disabled?: boolean;
+    status?: string;
+}
+type OptionGroup<T = unknown> = {
+    group: string;
+    options: Option<T>[];
+};
+type SelectBaseProps = ComponentProps<typeof Select>;
+interface SelectProps<T = unknown> extends Omit<SelectBaseProps, 'children' | 'value' | 'defaultValue' | 'onValueChange'> {
+    options: Array<Option<T> | OptionGroup<T>>;
+    placeholder?: string;
+    onChange?: (value: T) => void;
+    value?: T;
+    isInvalid?: boolean;
+    onBlur?: React.FocusEventHandler<HTMLButtonElement>;
+    triggerClassName?: string;
+    contentClassName?: string;
+    id?: string;
+    'aria-invalid'?: boolean | 'true' | 'false';
+    'aria-describedby'?: string;
+    'aria-errormessage'?: string;
+    'aria-label'?: string;
+    'aria-labelledby'?: string;
+}
+export declare const SelectInput: React.ForwardRefExoticComponent<SelectProps<unknown> & React.RefAttributes<HTMLButtonElement>>;
+export default Select;
+export type { SelectProps };
+//# sourceMappingURL=SelectInput.d.ts.map

package/dist/components/SelectInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectInput.d.ts","sourceRoot":"","sources":["../../src/components/SelectInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EACH,MAAM,EAOT,MAAM,oCAAoC,CAAC;AAE5C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,cAAc,EAAc,MAAM,OAAO,CAAC;AAKnD,MAAM,WAAW,MAAM,CAAC,CAAC,GAAG,OAAO;IAC/B,KAAK,EAAE,CAAC,CAAC;IACT,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,KAAK,WAAW,CAAC,CAAC,GAAG,OAAO,IAAI;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;CACxB,CAAC;AAoCF,KAAK,eAAe,GAAG,cAAc,CAAC,OAAO,MAAM,CAAC,CAAC;AAErD,UAAU,WAAW,CAAC,CAAC,GAAG,OAAO,CAC7B,SAAQ,IAAI,CAAC,eAAe,EAAE,UAAU,GAAG,OAAO,GAAG,cAAc,GAAG,eAAe,CAAC;IACtF,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;IAC3C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC9B,KAAK,CAAC,EAAE,CAAC,CAAC;IACV,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACpD,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,cAAc,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC;IAC5C,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC9B;AAED,eAAO,MAAM,WAAW,gGA4ItB,CAAC;AAEH,eAAe,MAAM,CAAC;AACtB,YAAY,EAAE,WAAW,EAAE,CAAC"}