@spear-ai/spectral 1.13.1 → 1.14.2

package/dist/Select.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.d.ts","names":[],"sources":["../src/components/Select/Select.tsx"],"mappings":";;;;;;KA2BK,YAAA,GAAe,UAAA;AAAA,KACf,KAAA;AAAA,KACA,IAAA;AAAA,UAEY,WAAA,SAAoB,IAAA,CAAK,wBAAA,4HAAoJ,IAAA,CAAK,kBAAA;EACjM,YAAA;EACA,aAAA,GAAgB,aAAA;EAChB,YAAA,GAAe,SAAA;EACf,EAAA;EACA,KAAA;EACA,cAAA;EACA,cAAA;EACA,QAAA,IAAY,KAAA;EACZ,aAAA,IAAiB,KAAA;EACjB,OAAA,EAAS,YAAA;EACT,WAAA;EACA,KAAA,GAAQ,OAAA,CAAQ,cAAA;EAChB,KAAA;EACA,cAAA,GAAiB,kBAAA;AAAA;AAAA,UAGF,mBAAA,SAA4B,WAAA;EAC3C,KAAA,GAAQ,KAAA;EACR,WAAA;EACA,eAAA;EACA,iBAAA,GAAoB,OAAA,GAAU,OAAA;EAC9B,gBAAA,YAA4B,OAAA,CAAQ,MAAA,CAAO,IAAA;EAC3C,QAAA;EACA,IAAA,GAAO,IAAA;EACP,UAAA;AAAA;AAAA,wBAIA,QAAA,EAAU,mBAAA;EACR,GAAA,GAAM,GAAA,CAAI,iBAAA;AAAA,IACX,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA"}

package/dist/Select.js

@@ -1,168 +1,188 @@
-'use client'
-import './styles/main.css'
-import { CheckmarkIcon as e } from "./Icons/CheckmarkIcon.js";
-import { ChevronDownIcon as t } from "./Icons/ChevronDownIcon.js";
-import { LoaderIcon as n } from "./Icons/LoaderIcon.js";
-import { t as r } from "./twUtils-BpqlKSeB.js";
-import { ErrorMessage as i, WarningMessage as a } from "./FormFieldMessage.js";
-import { EmptyState as o, LoadingState as s, getAriaProps as c, getDropdownSurfaceClasses as l, getDropdownWidthStyles as ee, getErrorMessageId as te, getFormFieldCSSProperties as ne, getOptionClasses as re, getTriggerClasses as ie, groupOptions as ae, useFormFieldId as oe } from "./utils/formFieldUtils.js";
-import { Label as u } from "./Label.js";
-import { C as se, S as ce, _ as le, b as d, d as f, f as ue, g as de, h as fe, m as pe, p as me, u as he, v as ge, x as p, y as _e } from "./select-DFE8xm1L.js";
-import { useAutoDropdownHorizontalShift as ve } from "./utils/dropdownPositioning.js";
-import { useState as ye } from "react";
-import { Fragment as m, jsx as h, jsxs as g } from "react/jsx-runtime";
+'use client';
+import { CheckmarkIcon } from "./Icons/CheckmarkIcon.js";
+import { ChevronDownIcon } from "./Icons/ChevronDownIcon.js";
+import { LoaderIcon } from "./Icons/LoaderIcon.js";
+import { cn } from "./utils/twUtils.js";
+import { ErrorMessage, WarningMessage } from "./FormFieldMessage.js";
+import { EmptyState, LoadingState, getAriaProps, getDropdownSurfaceClasses, getDropdownWidthStyles, getErrorMessageId, getFormFieldCSSProperties, getOptionClasses, getTriggerClasses, groupOptions, useFormFieldId } from "./utils/formFieldUtils.js";
+import { Label } from "./Label.js";
+import { useAutoDropdownHorizontalShift } from "./utils/dropdownPositioning.js";
+import { SelectValue } from "./primitives/select.js";
+import { useState } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import * as SelectPrimitive from "@radix-ui/react-select";
+
 //#region src/components/Select/Select.tsx
-var _ = (_) => {
-	let v = "value" in _, { align: y = "start", alignOffset: b = 0, avoidCollisions: x = !0, className: S, collisionBoundary: C, collisionPadding: w = 10, defaultValue: T, dropdownWidth: E = "trigger", emptyMessage: D = "No options found", errorMessage: O, disabled: k, id: A, label: j, labelClassName: M, loadingMessage: N = "Loading…", name: P, onChange: F, onValueChange: be, options: I = [], placeholder: xe = "Select an option", position: L = "popper", ref: Se, required: R, side: Ce = "bottom", sideOffset: we = 4, state: z = "default", value: B, warningMessage: V, "aria-label": Te, "aria-describedby": Ee, ...De } = _, H = v ? B ?? "" : B, [U, Oe] = ye(!1), { dropdownShiftStyle: ke, setDropdownElement: Ae } = ve(U), W = oe(A, P), G = `${W}-listbox`, K = te(W), q = `${W}-warning`, je = z === "error" && O ? K : z === "warning" && V ? q : void 0, { dropdownWidthMode: J, dropdownWidthStyle: Me, resolvedDropdownWidth: Y } = ee({
-		dropdownWidth: E,
+const Select = (allProps) => {
+	const isControlled = "value" in allProps;
+	const { align = "start", alignOffset = 0, avoidCollisions = true, className, collisionBoundary, collisionPadding = 10, defaultValue, dropdownWidth = "trigger", emptyMessage = "No options found", errorMessage, disabled, id, label, labelClassName, loadingMessage = "Loading…", messageReserveLines = 1, messageReserveSpace = true, name, onChange, onValueChange, options = [], placeholder = "Select an option", position = "popper", ref, required, side = "bottom", sideOffset = 4, state = "default", value: valueProp, warningMessage, "aria-label": ariaLabel, "aria-describedby": ariaDescribedBy, ...props } = allProps;
+	const value = isControlled ? valueProp ?? "" : valueProp;
+	const [open, setOpen] = useState(false);
+	const { dropdownShiftStyle, setDropdownElement } = useAutoDropdownHorizontalShift(open);
+	const selectId = useFormFieldId(id, name);
+	const listboxId = `${selectId}-listbox`;
+	const errorMessageId = getErrorMessageId(selectId);
+	const warningMessageId = `${selectId}-warning`;
+	const messageId = state === "error" && errorMessage ? errorMessageId : state === "warning" && warningMessage ? warningMessageId : void 0;
+	const { dropdownWidthMode, dropdownWidthStyle, resolvedDropdownWidth } = getDropdownWidthStyles({
+		dropdownWidth,
 		triggerWidth: "var(--radix-select-trigger-width)"
-	}), Ne = {
-		"--spectral-select-content-width": Y,
-		...L === "item-aligned" ? { width: Y } : {},
-		...Me,
-		...ke
-	}, X = !!k, Z = z === "loading", Pe = z === "error", Fe = c(z, Ee, R, je), { groups: Q, ungrouped: $ } = ae(I), Ie = (e) => {
-		F?.(e), be?.(e);
-	}, Le = () => {
-		if (Z) return /* @__PURE__ */ h(s, {
+	});
+	const selectContentStyle = {
+		"--spectral-select-content-width": resolvedDropdownWidth,
+		...position === "item-aligned" ? { width: resolvedDropdownWidth } : {},
+		...dropdownWidthStyle,
+		...dropdownShiftStyle
+	};
+	const isDisabled = Boolean(disabled);
+	const isLoading = state === "loading";
+	const isInvalid = state === "error";
+	const ariaProps = getAriaProps(state, ariaDescribedBy, required, messageId);
+	const { groups, ungrouped } = groupOptions(options);
+	const handleValueChange = (nextValue) => {
+		onChange?.(nextValue);
+		onValueChange?.(nextValue);
+	};
+	const renderOptions = () => {
+		if (isLoading) return /* @__PURE__ */ jsx(LoadingState, {
 			"data-testid": "spectral-select-loading",
-			message: N
+			message: loadingMessage
 		});
-		if (I.length === 0) return /* @__PURE__ */ h(o, {
+		if (options.length === 0) return /* @__PURE__ */ jsx(EmptyState, {
 			"data-testid": "spectral-select-empty",
-			message: D
+			message: emptyMessage
 		});
-		let t = (t) => {
-			let n = H === t.value;
-			return /* @__PURE__ */ g(pe, {
-				className: r(re(!!t.disabled, !1, n), "relative flex w-full cursor-pointer items-center"),
+		const renderOption = (option) => {
+			const isSelected = value === option.value;
+			return /* @__PURE__ */ jsxs(SelectPrimitive.Item, {
+				className: cn(getOptionClasses(!!option.disabled, false, isSelected), "relative flex w-full cursor-pointer items-center"),
 				"data-testid": "spectral-select-item",
-				disabled: t.disabled,
-				value: t.value,
-				children: [/* @__PURE__ */ h(de, {
+				disabled: option.disabled,
+				value: option.value,
+				children: [/* @__PURE__ */ jsx(SelectPrimitive.ItemText, {
 					"data-testid": "spectral-select-item-text",
 					className: "block truncate",
-					children: t.label
-				}), /* @__PURE__ */ h(fe, {
+					children: option.label
+				}), /* @__PURE__ */ jsx(SelectPrimitive.ItemIndicator, {
 					"data-testid": "spectral-select-item-selected-indicator",
-					asChild: !0,
-					children: /* @__PURE__ */ h("span", {
+					asChild: true,
+					children: /* @__PURE__ */ jsx("span", {
 						className: "right-2 h-4 w-4 absolute flex items-center justify-center",
-						children: /* @__PURE__ */ h(e, { size: 16 })
+						children: /* @__PURE__ */ jsx(CheckmarkIcon, { size: 16 })
 					})
 				})]
-			}, t.value);
+			}, option.value);
 		};
-		return /* @__PURE__ */ g(m, { children: [$.length > 0 && /* @__PURE__ */ g(m, { children: [$.map(t), Object.keys(Q).length > 0 && /* @__PURE__ */ h(p, {
+		return /* @__PURE__ */ jsxs(Fragment, { children: [ungrouped.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [ungrouped.map(renderOption), Object.keys(groups).length > 0 && /* @__PURE__ */ jsx(SelectPrimitive.Separator, {
 			className: "-mx-1 my-1 h-px bg-border-secondary",
 			"data-testid": "spectral-select-separator"
-		})] }), Object.entries(Q).map(([e, n], i) => /* @__PURE__ */ g(ue, {
+		})] }), Object.entries(groups).map(([groupName, groupOptions], groupIndex) => /* @__PURE__ */ jsxs(SelectPrimitive.Group, {
 			"data-testid": "spectral-select-group",
 			children: [
-				i > 0 && /* @__PURE__ */ h(p, {
+				groupIndex > 0 && /* @__PURE__ */ jsx(SelectPrimitive.Separator, {
 					className: "-mx-1 my-1 h-px bg-border-secondary",
 					"data-testid": "spectral-select-group-separator"
 				}),
-				/* @__PURE__ */ h(u, {
-					className: r("px-2 py-1.5 text-base font-semibold text-text-primary", M),
+				/* @__PURE__ */ jsx(Label, {
+					className: cn("px-2 py-1.5 text-base font-semibold text-text-primary", labelClassName),
 					"data-testid": "spectral-select-group-label",
-					children: e
+					children: groupName
 				}),
-				n.map((e) => t(e))
+				groupOptions.map((option) => renderOption(option))
 			]
-		}, e))] });
+		}, groupName))] });
 	};
-	return /* @__PURE__ */ g("div", {
+	return /* @__PURE__ */ jsxs("div", {
 		className: "w-full",
 		children: [
-			j && /* @__PURE__ */ h(u, {
-				className: r("mb-2 block text-text-primary", M, X && "text-text-secondary"),
+			label && /* @__PURE__ */ jsx(Label, {
+				className: cn("mb-2 block text-text-primary", labelClassName, isDisabled && "text-text-secondary"),
 				"data-testid": "spectral-select-label",
-				htmlFor: W,
-				children: j
+				htmlFor: selectId,
+				children: label
 			}),
-			/* @__PURE__ */ g(ge, {
+			/* @__PURE__ */ jsxs(SelectPrimitive.Root, {
 				"data-testid": "spectral-select",
-				defaultValue: T,
-				disabled: X,
-				name: P,
-				onOpenChange: Oe,
-				onValueChange: Ie,
-				open: U,
-				required: R,
-				value: H,
-				children: [/* @__PURE__ */ h(ce, {
-					"aria-controls": G,
-					"aria-expanded": U,
-					"aria-label": Te ?? j,
-					asChild: !0,
-					className: r(ie(U, z), "text-input-text data-placeholder:text-input-text-placeholder!", S),
+				defaultValue,
+				disabled: isDisabled,
+				name,
+				onOpenChange: setOpen,
+				onValueChange: handleValueChange,
+				open,
+				required,
+				value,
+				children: [/* @__PURE__ */ jsx(SelectPrimitive.Trigger, {
+					"aria-controls": listboxId,
+					"aria-expanded": open,
+					"aria-label": ariaLabel ?? label,
+					asChild: true,
+					className: cn(getTriggerClasses(open, state), "text-input-text data-placeholder:text-input-text-placeholder!", className),
 					"data-slot": "select-trigger",
-					"data-state": z,
+					"data-state": state,
 					"data-testid": "spectral-select-trigger",
-					id: W,
-					ref: Se,
+					id: selectId,
+					ref,
 					role: "combobox",
-					style: ne(),
-					...Fe,
-					...De,
-					children: /* @__PURE__ */ g("button", {
+					style: getFormFieldCSSProperties(),
+					...ariaProps,
+					...props,
+					children: /* @__PURE__ */ jsxs("button", {
 						className: "min-w-0 gap-2 [&>span]:min-w-0 grid w-full cursor-pointer grid-cols-[minmax(0,1fr)_auto] items-center overflow-hidden text-left whitespace-nowrap text-input-text! data-placeholder:text-input-text-placeholder! [&>span]:block [&>span]:overflow-hidden [&>span]:text-ellipsis [&>span]:whitespace-nowrap [&>span[data-placeholder]]:text-input-text-placeholder!",
 						type: "button",
-						disabled: X,
-						children: [/* @__PURE__ */ h(he, {
+						disabled: isDisabled,
+						children: [/* @__PURE__ */ jsx(SelectValue, {
 							"data-testid": "spectral-select-value",
-							placeholder: xe
-						}), /* @__PURE__ */ h(me, {
-							asChild: !0,
-							children: /* @__PURE__ */ h("div", {
+							placeholder
+						}), /* @__PURE__ */ jsx(SelectPrimitive.Icon, {
+							asChild: true,
+							children: /* @__PURE__ */ jsx("div", {
 								className: "flex shrink-0 cursor-pointer items-center",
-								children: Z ? /* @__PURE__ */ h(n, { size: 20 }) : /* @__PURE__ */ h(t, {
-									className: r("transition-transform duration-200", U && "rotate-180"),
+								children: isLoading ? /* @__PURE__ */ jsx(LoaderIcon, { size: 20 }) : /* @__PURE__ */ jsx(ChevronDownIcon, {
+									className: cn("transition-transform duration-200", open && "rotate-180"),
 									size: 20
 								})
 							})
 						})]
 					})
-				}), /* @__PURE__ */ h(le, { children: /* @__PURE__ */ g(f, {
-					align: y,
-					alignOffset: b,
-					avoidCollisions: x,
-					className: r("relative z-50 motion-safe:data-[state=closed]:animate-out motion-safe:data-[state=open]:animate-in", l(), "motion-safe:data-[state=closed]:fade-out-0 motion-safe:data-[state=closed]:zoom-out-95 motion-safe:data-[state=open]:fade-in-0 motion-safe:data-[state=open]:zoom-in-95", "max-h-[min(var(--radix-select-content-available-height),300px)] motion-safe:data-[side=bottom]:slide-in-from-top-2 motion-safe:data-[side=top]:slide-in-from-bottom-2", "min-w-32 origin-(--radix-select-content-transform-origin) overflow-hidden", L === "popper" && "data-[side=bottom]:translate-y-1 data-[side=top]:-translate-y-1"),
-					collisionBoundary: C,
-					collisionPadding: w,
-					"data-dropdown-width-mode": J,
-					"data-dropdown-width-value": J === "custom" ? E : void 0,
-					id: G,
+				}), /* @__PURE__ */ jsx(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs(SelectPrimitive.Content, {
+					align,
+					alignOffset,
+					avoidCollisions,
+					className: cn("relative z-50 motion-safe:data-[state=closed]:animate-out motion-safe:data-[state=open]:animate-in", getDropdownSurfaceClasses(), "motion-safe:data-[state=closed]:fade-out-0 motion-safe:data-[state=closed]:zoom-out-95 motion-safe:data-[state=open]:fade-in-0 motion-safe:data-[state=open]:zoom-in-95", "max-h-[min(var(--radix-select-content-available-height),300px)] motion-safe:data-[side=bottom]:slide-in-from-top-2 motion-safe:data-[side=top]:slide-in-from-bottom-2", "min-w-32 origin-(--radix-select-content-transform-origin) overflow-hidden", position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=top]:-translate-y-1"),
+					collisionBoundary,
+					collisionPadding,
+					"data-dropdown-width-mode": dropdownWidthMode,
+					"data-dropdown-width-value": dropdownWidthMode === "custom" ? dropdownWidth : void 0,
+					id: listboxId,
 					"data-slot": "select-content",
 					"data-testid": "spectral-select-content",
-					position: L,
-					ref: Ae,
-					side: Ce,
-					sideOffset: we,
-					style: Ne,
+					position,
+					ref: setDropdownElement,
+					side,
+					sideOffset,
+					style: selectContentStyle,
 					children: [
-						/* @__PURE__ */ h(d, {
+						/* @__PURE__ */ jsx(SelectPrimitive.ScrollUpButton, {
 							className: "py-1 flex cursor-default items-center justify-center",
 							"data-testid": "spectral-select-scroll-up-button",
-							children: /* @__PURE__ */ h(t, {
+							children: /* @__PURE__ */ jsx(ChevronDownIcon, {
 								"aria-hidden": "true",
 								className: "rotate-180",
 								size: 18
 							})
 						}),
-						/* @__PURE__ */ h(se, {
-							asChild: !0,
-							children: /* @__PURE__ */ h("div", {
-								className: r("p-1 overflow-x-hidden overflow-y-auto", L === "popper" && (E === "trigger" ? "scroll-my-1 h-(--radix-select-trigger-height) w-(--spectral-select-content-width) min-w-(--spectral-select-content-width)" : "scroll-my-1 h-(--radix-select-trigger-height)")),
+						/* @__PURE__ */ jsx(SelectPrimitive.Viewport, {
+							asChild: true,
+							children: /* @__PURE__ */ jsx("div", {
+								className: cn("p-1 overflow-x-hidden overflow-y-auto", position === "popper" && (dropdownWidth === "trigger" ? "scroll-my-1 h-(--radix-select-trigger-height) w-(--spectral-select-content-width) min-w-(--spectral-select-content-width)" : "scroll-my-1 h-(--radix-select-trigger-height)")),
 								"data-testid": "spectral-select-items",
-								children: Le()
+								children: renderOptions()
 							})
 						}),
-						/* @__PURE__ */ h(_e, {
+						/* @__PURE__ */ jsx(SelectPrimitive.ScrollDownButton, {
 							className: "py-1 flex cursor-default items-center justify-center",
 							"data-testid": "spectral-select-scroll-down-button",
-							children: /* @__PURE__ */ h(t, {
+							children: /* @__PURE__ */ jsx(ChevronDownIcon, {
 								"aria-hidden": "true",
 								size: 18
 							})
@@ -170,19 +190,25 @@ var _ = (_) => {
 					]
 				}) })]
 			}),
-			/* @__PURE__ */ h(i, {
+			/* @__PURE__ */ jsx(ErrorMessage, {
 				dataTestId: "spectral-select-error-message",
-				id: K,
-				message: Pe ? O ?? null : null
+				id: errorMessageId,
+				message: isInvalid ? errorMessage ?? null : null,
+				messageReserveLines,
+				messageReserveSpace
 			}),
-			/* @__PURE__ */ h(a, {
+			/* @__PURE__ */ jsx(WarningMessage, {
 				dataTestId: "spectral-select-warning-message",
-				id: q,
-				message: z === "warning" ? V ?? null : null
+				id: warningMessageId,
+				message: state === "warning" ? warningMessage ?? null : null,
+				messageReserveLines,
+				messageReserveSpace
 			})
 		]
 	});
 };
-_.displayName = "Select";
+Select.displayName = "Select";
+
 //#endregion
-export { _ as Select };
+export { Select };
+//# sourceMappingURL=Select.js.map

package/dist/Select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.js","names":[],"sources":["../src/components/Select/Select.tsx"],"sourcesContent":["import { CheckmarkIcon, ChevronDownIcon, LoaderIcon } from '@components/Icons'\nimport { Label } from '@components/Label/Label'\nimport { SelectValue } from '@primitives/select'\nimport * as SelectPrimitive from '@radix-ui/react-select'\nimport { useAutoDropdownHorizontalShift } from '@utils/dropdownPositioning'\nimport {\n  EmptyState,\n  ErrorMessage,\n  getAriaProps,\n  getDropdownWidthStyles,\n  getDropdownSurfaceClasses,\n  getErrorMessageId,\n  getFormFieldCSSProperties,\n  getOptionClasses,\n  getTriggerClasses,\n  groupOptions,\n  LoadingState,\n  WarningMessage,\n  useFormFieldId,\n  type BaseFormFieldProps,\n  type BaseOption,\n  type DropdownWidth,\n  type FormFieldState,\n} from '@utils/formFieldUtils'\nimport { cn } from '@utils/twUtils'\nimport { useState, type ComponentPropsWithoutRef, type CSSProperties, type ReactNode, type Ref } from 'react'\n\ntype SelectOption = BaseOption\ntype Align = 'start' | 'center' | 'end'\ntype Side = 'top' | 'bottom' | 'left' | 'right'\n\nexport interface SelectProps extends Omit<ComponentPropsWithoutRef<'button'>, 'value' | 'onChange' | 'aria-disabled' | 'aria-invalid' | 'aria-required' | 'aria-describedby' | 'aria-label'>, Omit<BaseFormFieldProps, 'state'> {\n  defaultValue?: string\n  dropdownWidth?: DropdownWidth\n  emptyMessage?: ReactNode\n  id?: string\n  label?: string\n  labelClassName?: string\n  loadingMessage?: string\n  onChange?: (value: string) => void\n  onValueChange?: (value: string) => void\n  options: SelectOption[]\n  placeholder?: string\n  state?: Exclude<FormFieldState, 'disabled'>\n  value?: string\n  warningMessage?: BaseFormFieldProps['errorMessage']\n}\n\nexport interface SelectExtendedProps extends SelectProps {\n  align?: Align\n  alignOffset?: number\n  avoidCollisions?: boolean\n  collisionBoundary?: Element | Element[] | null\n  collisionPadding?: number | Partial<Record<Side, number>>\n  position?: 'popper' | 'item-aligned'\n  side?: Side\n  sideOffset?: number\n}\n\nexport const Select = (\n  allProps: SelectExtendedProps & {\n    ref?: Ref<HTMLButtonElement>\n  },\n) => {\n  const isControlled = 'value' in allProps\n  const {\n    align = 'start',\n    alignOffset = 0,\n    avoidCollisions = true,\n    className,\n    collisionBoundary,\n    collisionPadding = 10,\n    defaultValue,\n    dropdownWidth = 'trigger',\n    emptyMessage = 'No options found',\n    errorMessage,\n    disabled,\n    id,\n    label,\n    labelClassName,\n    loadingMessage = 'Loading…',\n    messageReserveLines = 1,\n    messageReserveSpace = true,\n    name,\n    onChange,\n    onValueChange,\n    options = [],\n    placeholder = 'Select an option',\n    position = 'popper',\n    ref,\n    required,\n    side = 'bottom',\n    sideOffset = 4,\n    state = 'default',\n    value: valueProp,\n    warningMessage,\n    'aria-label': ariaLabel,\n    'aria-describedby': ariaDescribedBy,\n    ...props\n  } = allProps\n  const value = isControlled ? (valueProp ?? '') : valueProp\n  const [open, setOpen] = useState(false)\n  const { dropdownShiftStyle, setDropdownElement } = useAutoDropdownHorizontalShift(open)\n  const selectId = useFormFieldId(id, name)\n  const listboxId = `${selectId}-listbox`\n  const errorMessageId = getErrorMessageId(selectId)\n  const warningMessageId = `${selectId}-warning`\n  const messageId = state === 'error' && errorMessage ? errorMessageId : state === 'warning' && warningMessage ? warningMessageId : undefined\n  const { dropdownWidthMode, dropdownWidthStyle, resolvedDropdownWidth } = getDropdownWidthStyles({\n    dropdownWidth,\n    triggerWidth: 'var(--radix-select-trigger-width)',\n  })\n  const selectContentStyle = {\n    '--spectral-select-content-width': resolvedDropdownWidth,\n    ...(position === 'item-aligned' ? { width: resolvedDropdownWidth } : {}),\n    ...dropdownWidthStyle,\n    ...dropdownShiftStyle,\n  } as CSSProperties\n  const isDisabled = Boolean(disabled)\n  const isLoading = state === 'loading'\n  const isInvalid = state === 'error'\n  const ariaProps = getAriaProps(state, ariaDescribedBy, required, messageId)\n  const { groups, ungrouped } = groupOptions(options)\n  const handleValueChange = (nextValue: string) => {\n    onChange?.(nextValue)\n    onValueChange?.(nextValue)\n  }\n\n  const renderOptions = () => {\n    if (isLoading) {\n      return <LoadingState data-testid='spectral-select-loading' message={loadingMessage} />\n    }\n\n    if (options.length === 0) {\n      return <EmptyState data-testid='spectral-select-empty' message={emptyMessage} />\n    }\n\n    const renderOption = (option: SelectOption) => {\n      const isSelected = value === option.value\n\n      return (\n        <SelectPrimitive.Item className={cn(getOptionClasses(!!option.disabled, false, isSelected), 'relative flex w-full cursor-pointer items-center')} data-testid='spectral-select-item' disabled={option.disabled} key={option.value} value={option.value}>\n          <SelectPrimitive.ItemText data-testid='spectral-select-item-text' className='block truncate'>\n            {option.label}\n          </SelectPrimitive.ItemText>\n          <SelectPrimitive.ItemIndicator data-testid='spectral-select-item-selected-indicator' asChild>\n            <span className='right-2 h-4 w-4 absolute flex items-center justify-center'>\n              <CheckmarkIcon size={16} />\n            </span>\n          </SelectPrimitive.ItemIndicator>\n        </SelectPrimitive.Item>\n      )\n    }\n\n    return (\n      <>\n        {ungrouped.length > 0 && (\n          <>\n            {ungrouped.map(renderOption)}\n            {Object.keys(groups).length > 0 && <SelectPrimitive.Separator className='-mx-1 my-1 h-px bg-border-secondary' data-testid='spectral-select-separator' />}\n          </>\n        )}\n\n        {Object.entries(groups).map(([groupName, groupOptions], groupIndex) => (\n          <SelectPrimitive.Group key={groupName} data-testid='spectral-select-group'>\n            {groupIndex > 0 && <SelectPrimitive.Separator className='-mx-1 my-1 h-px bg-border-secondary' data-testid='spectral-select-group-separator' />}\n            <Label className={cn('px-2 py-1.5 text-base font-semibold text-text-primary', labelClassName)} data-testid='spectral-select-group-label'>\n              {groupName}\n            </Label>\n            {groupOptions.map((option: BaseOption) => renderOption(option))}\n          </SelectPrimitive.Group>\n        ))}\n      </>\n    )\n  }\n\n  return (\n    <div className='w-full'>\n      {label && (\n        <Label className={cn('mb-2 block text-text-primary', labelClassName, isDisabled && 'text-text-secondary')} data-testid='spectral-select-label' htmlFor={selectId}>\n          {label}\n        </Label>\n      )}\n      <SelectPrimitive.Root data-testid='spectral-select' defaultValue={defaultValue} disabled={isDisabled} name={name} onOpenChange={setOpen} onValueChange={handleValueChange} open={open} required={required} value={value}>\n        <SelectPrimitive.Trigger\n          aria-controls={listboxId}\n          aria-expanded={open}\n          aria-label={ariaLabel ?? label}\n          asChild\n          className={cn(getTriggerClasses(open, state), 'text-input-text data-placeholder:text-input-text-placeholder!', className)}\n          data-slot='select-trigger'\n          data-state={state}\n          data-testid='spectral-select-trigger'\n          id={selectId}\n          ref={ref}\n          role='combobox'\n          style={getFormFieldCSSProperties() as CSSProperties}\n          {...ariaProps}\n          {...props}\n        >\n          <button\n            className='min-w-0 gap-2 [&>span]:min-w-0 grid w-full cursor-pointer grid-cols-[minmax(0,1fr)_auto] items-center overflow-hidden text-left whitespace-nowrap text-input-text! data-placeholder:text-input-text-placeholder! [&>span]:block [&>span]:overflow-hidden [&>span]:text-ellipsis [&>span]:whitespace-nowrap [&>span[data-placeholder]]:text-input-text-placeholder!'\n            type='button'\n            disabled={isDisabled}\n          >\n            <SelectValue data-testid='spectral-select-value' placeholder={placeholder} />\n            <SelectPrimitive.Icon asChild>\n              <div className='flex shrink-0 cursor-pointer items-center'>{isLoading ? <LoaderIcon size={20} /> : <ChevronDownIcon className={cn('transition-transform duration-200', open && 'rotate-180')} size={20} />}</div>\n            </SelectPrimitive.Icon>\n          </button>\n        </SelectPrimitive.Trigger>\n\n        <SelectPrimitive.Portal>\n          <SelectPrimitive.Content\n            align={align}\n            alignOffset={alignOffset}\n            avoidCollisions={avoidCollisions}\n            className={cn(\n              'relative z-50 motion-safe:data-[state=closed]:animate-out motion-safe:data-[state=open]:animate-in',\n              getDropdownSurfaceClasses(),\n              'motion-safe:data-[state=closed]:fade-out-0 motion-safe:data-[state=closed]:zoom-out-95 motion-safe:data-[state=open]:fade-in-0 motion-safe:data-[state=open]:zoom-in-95',\n              'max-h-[min(var(--radix-select-content-available-height),300px)] motion-safe:data-[side=bottom]:slide-in-from-top-2 motion-safe:data-[side=top]:slide-in-from-bottom-2',\n              'min-w-32 origin-(--radix-select-content-transform-origin) overflow-hidden',\n              position === 'popper' && 'data-[side=bottom]:translate-y-1 data-[side=top]:-translate-y-1',\n            )}\n            collisionBoundary={collisionBoundary}\n            collisionPadding={collisionPadding}\n            data-dropdown-width-mode={dropdownWidthMode}\n            data-dropdown-width-value={dropdownWidthMode === 'custom' ? dropdownWidth : undefined}\n            id={listboxId}\n            data-slot='select-content'\n            data-testid='spectral-select-content'\n            position={position}\n            ref={setDropdownElement}\n            side={side}\n            sideOffset={sideOffset}\n            style={selectContentStyle}\n          >\n            <SelectPrimitive.ScrollUpButton className='py-1 flex cursor-default items-center justify-center' data-testid='spectral-select-scroll-up-button'>\n              <ChevronDownIcon aria-hidden='true' className='rotate-180' size={18} />\n            </SelectPrimitive.ScrollUpButton>\n\n            <SelectPrimitive.Viewport asChild>\n              <div\n                className={cn(\n                  'p-1 overflow-x-hidden overflow-y-auto',\n                  position === 'popper' && (dropdownWidth === 'trigger' ? 'scroll-my-1 h-(--radix-select-trigger-height) w-(--spectral-select-content-width) min-w-(--spectral-select-content-width)' : 'scroll-my-1 h-(--radix-select-trigger-height)'),\n                )}\n                data-testid='spectral-select-items'\n              >\n                {renderOptions()}\n              </div>\n            </SelectPrimitive.Viewport>\n\n            <SelectPrimitive.ScrollDownButton className='py-1 flex cursor-default items-center justify-center' data-testid='spectral-select-scroll-down-button'>\n              <ChevronDownIcon aria-hidden='true' size={18} />\n            </SelectPrimitive.ScrollDownButton>\n          </SelectPrimitive.Content>\n        </SelectPrimitive.Portal>\n      </SelectPrimitive.Root>\n\n      <ErrorMessage dataTestId='spectral-select-error-message' id={errorMessageId} message={isInvalid ? (errorMessage ?? null) : null} messageReserveLines={messageReserveLines} messageReserveSpace={messageReserveSpace} />\n      <WarningMessage dataTestId='spectral-select-warning-message' id={warningMessageId} message={state === 'warning' ? (warningMessage ?? null) : null} messageReserveLines={messageReserveLines} messageReserveSpace={messageReserveSpace} />\n    </div>\n  )\n}\nSelect.displayName = 'Select'\n"],"mappings":"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"}

package/dist/Separator.d.ts

@@ -1,12 +1,24 @@
-import { ComponentPropsWithoutRef, Ref } from 'react';
-export type SeparatorProps = {
-    className?: string;
-    decorative?: boolean;
-    orientation?: 'horizontal' | 'vertical';
-    ref?: Ref<HTMLDivElement>;
+'use client';
+import { ComponentPropsWithoutRef, Ref } from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/Separator/Separator.d.ts
+type SeparatorProps = {
+  className?: string;
+  decorative?: boolean;
+  orientation?: 'horizontal' | 'vertical';
+  ref?: Ref<HTMLDivElement>;
 } & ComponentPropsWithoutRef<'div'>;
-export declare const Separator: {
-    ({ className, decorative, orientation, ref, ...props }: SeparatorProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+declare function Separator({
+  className,
+  decorative,
+  orientation,
+  ref,
+  ...props
+}: SeparatorProps): _$react_jsx_runtime0.JSX.Element;
+declare namespace Separator {
+  var displayName: string;
+}
+//#endregion
+export { Separator, SeparatorProps };
 //# sourceMappingURL=Separator.d.ts.map

package/dist/Separator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Separator.d.ts","names":[],"sources":["../src/components/Separator/Separator.tsx"],"mappings":";;;;;KAGY,cAAA;EACV,SAAA;EACA,UAAA;EACA,WAAA;EACA,GAAA,GAAM,GAAA,CAAI,cAAA;AAAA,IACR,wBAAA;AAAA;EAEwB,SAAA;EAAW,UAAA;EAAmB,WAAA;EAA4B,GAAA;EAAA,GAAQ;AAAA,GAAS,cAAA,GAAc,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA"}

package/dist/Separator.js

@@ -1,19 +1,23 @@
-'use client'
-import './styles/main.css'
-import { t as e } from "./twUtils-BpqlKSeB.js";
+'use client';
+import { cn } from "./utils/twUtils.js";
 import "react";
-import { jsx as t } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
+
 //#region src/components/Separator/Separator.tsx
-var n = ({ className: n, decorative: r = !0, orientation: i = "horizontal", ref: a, ...o }) => /* @__PURE__ */ t("div", {
-	"aria-hidden": r ? "true" : void 0,
-	"aria-orientation": r ? void 0 : i,
-	className: e("bg-border shrink-0", i === "horizontal" ? "h-px w-full" : "h-full w-px", n),
-	"data-orientation": i,
-	"data-slot": "separator",
-	role: r ? "none" : "separator",
-	ref: a,
-	...o
-});
-n.displayName = "Separator";
+const Separator = ({ className, decorative = true, orientation = "horizontal", ref, ...props }) => {
+	return /* @__PURE__ */ jsx("div", {
+		"aria-hidden": decorative ? "true" : void 0,
+		"aria-orientation": decorative ? void 0 : orientation,
+		className: cn("bg-border shrink-0", orientation === "horizontal" ? "h-px w-full" : "h-full w-px", className),
+		"data-orientation": orientation,
+		"data-slot": "separator",
+		role: decorative ? "none" : "separator",
+		ref,
+		...props
+	});
+};
+Separator.displayName = "Separator";
+
 //#endregion
-export { n as Separator };
+export { Separator };
+//# sourceMappingURL=Separator.js.map

package/dist/Separator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Separator.js","names":[],"sources":["../src/components/Separator/Separator.tsx"],"sourcesContent":["import { cn } from '@utils/twUtils'\nimport { type ComponentPropsWithoutRef, type Ref } from 'react'\n\nexport type SeparatorProps = {\n  className?: string\n  decorative?: boolean\n  orientation?: 'horizontal' | 'vertical'\n  ref?: Ref<HTMLDivElement>\n} & ComponentPropsWithoutRef<'div'>\n\nexport const Separator = ({ className, decorative = true, orientation = 'horizontal', ref, ...props }: SeparatorProps) => {\n  return (\n    <div\n      aria-hidden={decorative ? 'true' : undefined}\n      aria-orientation={decorative ? undefined : orientation}\n      className={cn('bg-border shrink-0', orientation === 'horizontal' ? 'h-px w-full' : 'h-full w-px', className)}\n      data-orientation={orientation}\n      data-slot='separator'\n      role={decorative ? 'none' : 'separator'}\n      ref={ref}\n      {...props}\n    />\n  )\n}\nSeparator.displayName = 'Separator'\n"],"mappings":";;;;;;AAUA,MAAa,aAAa,EAAE,WAAW,aAAa,MAAM,cAAc,cAAc,KAAK,GAAG,YAA4B;AACxH,QACE,oBAAC,OAAD;EACE,eAAa,aAAa,SAAS;EACnC,oBAAkB,aAAa,SAAY;EAC3C,WAAW,GAAG,sBAAsB,gBAAgB,eAAe,gBAAgB,eAAe,UAAU;EAC5G,oBAAkB;EAClB,aAAU;EACV,MAAM,aAAa,SAAS;EACvB;EACL,GAAI;EACJ;;AAGN,UAAU,cAAc"}

package/dist/Skeleton.d.ts

@@ -1,3 +1,12 @@
-import { ComponentProps } from 'react';
-export declare const Skeleton: ({ className, ...props }: ComponentProps<"div">) => import("react/jsx-runtime").JSX.Element;
+'use client';
+import { ComponentProps } from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/Skeleton/Skeleton.d.ts
+declare const Skeleton: ({
+  className,
+  ...props
+}: ComponentProps<'div'>) => _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Skeleton };
 //# sourceMappingURL=Skeleton.d.ts.map

package/dist/Skeleton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Skeleton.d.ts","names":[],"sources":["../src/components/Skeleton/Skeleton.tsx"],"mappings":";;;;;cAGa,QAAA;EAAQ,SAAA;EAAA,GAAA;AAAA,GAA6B,cAAA,YAAqB,oBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/Skeleton.js

@@ -1,13 +1,17 @@
-'use client'
-import './styles/main.css'
-import { t as e } from "./twUtils-BpqlKSeB.js";
+'use client';
+import { cn } from "./utils/twUtils.js";
 import "react";
-import { jsx as t } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
+
 //#region src/components/Skeleton/Skeleton.tsx
-var n = ({ className: n, ...r }) => /* @__PURE__ */ t("div", {
-	"data-slot": "skeleton",
-	className: e("motion-safe:animate-pulse rounded-md bg-level-three", n),
-	...r
-});
+const Skeleton = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "skeleton",
+		className: cn("motion-safe:animate-pulse rounded-md bg-level-three", className),
+		...props
+	});
+};
+
 //#endregion
-export { n as Skeleton };
+export { Skeleton };
+//# sourceMappingURL=Skeleton.js.map

package/dist/Skeleton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Skeleton.js","names":[],"sources":["../src/components/Skeleton/Skeleton.tsx"],"sourcesContent":["import { cn } from '@utils/twUtils'\nimport { type ComponentProps } from 'react'\n\nexport const Skeleton = ({ className, ...props }: ComponentProps<'div'>) => {\n  return <div data-slot='skeleton' className={cn('motion-safe:animate-pulse rounded-md bg-level-three', className)} {...props} />\n}\n"],"mappings":";;;;;;AAGA,MAAa,YAAY,EAAE,WAAW,GAAG,YAAmC;AAC1E,QAAO,oBAAC,OAAD;EAAK,aAAU;EAAW,WAAW,GAAG,uDAAuD,UAAU;EAAE,GAAI;EAAS"}

package/dist/Slider.d.ts

@@ -1,29 +1,52 @@
-import { ReactNode } from 'react';
-export type SliderLabelPosition = 'end' | 'both';
-export type SliderInputPosition = 'start' | 'both';
-export interface SliderLabelRenderProps {
-    max: number;
-    min: number;
-    position: 'start' | 'end';
-    values: number[];
+'use client';
+import { ReactNode } from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/Slider/Slider.d.ts
+type SliderLabelPosition = 'end' | 'both';
+type SliderInputPosition = 'start' | 'both';
+interface SliderLabelRenderProps {
+  max: number;
+  min: number;
+  position: 'start' | 'end';
+  values: number[];
 }
-export interface SliderProps {
-    accessibleName?: string;
-    className?: string;
-    defaultValue?: number[];
-    disabled?: boolean;
-    inputPosition?: SliderInputPosition;
-    label?: (props: SliderLabelRenderProps) => ReactNode;
-    labelPosition?: SliderLabelPosition;
-    max?: number;
-    min?: number;
-    minStepsBetweenThumbs?: number;
-    name?: string;
-    onValueChange?: (value: number[]) => void;
-    onValueCommit?: (value: number[]) => void;
-    orientation?: 'horizontal' | 'vertical';
-    step?: number;
-    value?: number[];
+interface SliderProps {
+  accessibleName?: string;
+  className?: string;
+  defaultValue?: number[];
+  disabled?: boolean;
+  inputPosition?: SliderInputPosition;
+  label?: (props: SliderLabelRenderProps) => ReactNode;
+  labelPosition?: SliderLabelPosition;
+  max?: number;
+  min?: number;
+  minStepsBetweenThumbs?: number;
+  name?: string;
+  onValueChange?: (value: number[]) => void;
+  onValueCommit?: (value: number[]) => void;
+  orientation?: 'horizontal' | 'vertical';
+  step?: number;
+  value?: number[];
 }
-export declare const Slider: ({ accessibleName, className, defaultValue, disabled, inputPosition, label, labelPosition, max, min, minStepsBetweenThumbs, name, onValueChange, onValueCommit, orientation, step, value }: SliderProps) => import("react/jsx-runtime").JSX.Element;
+declare const Slider: ({
+  accessibleName,
+  className,
+  defaultValue,
+  disabled,
+  inputPosition,
+  label,
+  labelPosition,
+  max,
+  min,
+  minStepsBetweenThumbs,
+  name,
+  onValueChange,
+  onValueCommit,
+  orientation,
+  step,
+  value
+}: SliderProps) => _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Slider, SliderInputPosition, SliderLabelPosition, SliderLabelRenderProps, SliderProps };
 //# sourceMappingURL=Slider.d.ts.map

package/dist/Slider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slider.d.ts","names":[],"sources":["../src/components/Slider/Slider.tsx"],"mappings":";;;;;KAKY,mBAAA;AAAA,KACA,mBAAA;AAAA,UAEK,sBAAA;EACf,GAAA;EACA,GAAA;EACA,QAAA;EACA,MAAA;AAAA;AAAA,UAGe,WAAA;EACf,cAAA;EACA,SAAA;EACA,YAAA;EACA,QAAA;EACA,aAAA,GAAgB,mBAAA;EAChB,KAAA,IAAS,KAAA,EAAO,sBAAA,KAA2B,SAAA;EAC3C,aAAA,GAAgB,mBAAA;EAChB,GAAA;EACA,GAAA;EACA,qBAAA;EACA,IAAA;EACA,aAAA,IAAiB,KAAA;EACjB,aAAA,IAAiB,KAAA;EACjB,WAAA;EACA,IAAA;EACA,KAAA;AAAA;AAAA,cAGW,MAAA;EAAM,cAAA;EAAA,SAAA;EAAA,YAAA;EAAA,QAAA;EAAA,aAAA;EAAA,KAAA;EAAA,aAAA;EAAA,GAAA;EAAA,GAAA;EAAA,qBAAA;EAAA,IAAA;EAAA,aAAA;EAAA,aAAA;EAAA,WAAA;EAAA,IAAA;EAAA;AAAA,GAAgO,WAAA,KAAW,oBAAA,CAAA,GAAA,CAAA,OAAA"}