@fragments-sdk/ui 0.14.0 → 0.15.1

package/dist/components/ScrollArea/ScrollArea.module.scss.js

@@ -1,13 +1,13 @@
-const root = "_root_umvhi_1";
-const fadeMaskEnd = "_fadeMaskEnd_umvhi_6";
-const horizontal = "_horizontal_umvhi_6";
-const vertical = "_vertical_umvhi_9";
-const both = "_both_umvhi_12";
-const fadeMaskStart = "_fadeMaskStart_umvhi_16";
-const fadeMaskBoth = "_fadeMaskBoth_umvhi_26";
-const viewport = "_viewport_umvhi_36";
-const scrollbarAlways = "_scrollbarAlways_umvhi_72";
-const scrollbarHover = "_scrollbarHover_umvhi_76";
+const root = "_root_14141_1";
+const fadeMaskEnd = "_fadeMaskEnd_14141_6";
+const horizontal = "_horizontal_14141_6";
+const vertical = "_vertical_14141_9";
+const both = "_both_14141_12";
+const fadeMaskStart = "_fadeMaskStart_14141_16";
+const fadeMaskBoth = "_fadeMaskBoth_14141_26";
+const viewport = "_viewport_14141_36";
+const scrollbarAlways = "_scrollbarAlways_14141_72";
+const scrollbarHover = "_scrollbarHover_14141_76";
 const styles = {
   root,
   fadeMaskEnd,
@@ -33,4 +33,3 @@ export {
   vertical,
   viewport
 };
-//# sourceMappingURL=ScrollArea.module.scss.js.map

package/dist/components/ScrollArea/index.cjs

@@ -82,4 +82,3 @@ const ScrollArea = Object.assign(ScrollAreaRoot, {
   Root: ScrollAreaRoot
 });
 exports.ScrollArea = ScrollArea;
-//# sourceMappingURL=index.cjs.map

package/dist/components/ScrollArea/index.js

@@ -65,4 +65,3 @@ const ScrollArea = Object.assign(ScrollAreaRoot, {
 export {
   ScrollArea
 };
-//# sourceMappingURL=index.js.map

package/dist/components/Select/Select.module.scss.cjs

@@ -1,17 +1,31 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const trigger = "_trigger_n53ao_1";
-const value = "_value_n53ao_56";
-const placeholder = "_placeholder_n53ao_69";
-const icon = "_icon_n53ao_73";
-const positioner = "_positioner_n53ao_88";
-const popup = "_popup_n53ao_93";
-const item = "_item_n53ao_120";
-const itemIndicator = "_itemIndicator_n53ao_164";
-const group = "_group_n53ao_177";
-const groupLabel = "_groupLabel_n53ao_183";
+const wrapper = "_wrapper_u6t4o_1";
+const label = "_label_u6t4o_6";
+const helper = "_helper_u6t4o_19";
+const helperError = "_helperError_u6t4o_26";
+const errorMessage = "_errorMessage_u6t4o_30";
+const trigger = "_trigger_u6t4o_36";
+const triggerSm = "_triggerSm_u6t4o_91";
+const triggerLg = "_triggerLg_u6t4o_97";
+const value = "_value_u6t4o_103";
+const placeholder = "_placeholder_u6t4o_116";
+const icon = "_icon_u6t4o_120";
+const positioner = "_positioner_u6t4o_135";
+const popup = "_popup_u6t4o_140";
+const item = "_item_u6t4o_170";
+const itemIndicator = "_itemIndicator_u6t4o_214";
+const group = "_group_u6t4o_227";
+const groupLabel = "_groupLabel_u6t4o_233";
 const styles = {
+  wrapper,
+  label,
+  helper,
+  helperError,
+  errorMessage,
   trigger,
+  triggerSm,
+  triggerLg,
   value,
   placeholder,
   icon,
@@ -23,14 +37,20 @@ const styles = {
   groupLabel
 };
 exports.default = styles;
+exports.errorMessage = errorMessage;
 exports.group = group;
 exports.groupLabel = groupLabel;
+exports.helper = helper;
+exports.helperError = helperError;
 exports.icon = icon;
 exports.item = item;
 exports.itemIndicator = itemIndicator;
+exports.label = label;
 exports.placeholder = placeholder;
 exports.popup = popup;
 exports.positioner = positioner;
 exports.trigger = trigger;
+exports.triggerLg = triggerLg;
+exports.triggerSm = triggerSm;
 exports.value = value;
-//# sourceMappingURL=Select.module.scss.cjs.map
+exports.wrapper = wrapper;

package/dist/components/Select/Select.module.scss.js

@@ -1,15 +1,29 @@
-const trigger = "_trigger_n53ao_1";
-const value = "_value_n53ao_56";
-const placeholder = "_placeholder_n53ao_69";
-const icon = "_icon_n53ao_73";
-const positioner = "_positioner_n53ao_88";
-const popup = "_popup_n53ao_93";
-const item = "_item_n53ao_120";
-const itemIndicator = "_itemIndicator_n53ao_164";
-const group = "_group_n53ao_177";
-const groupLabel = "_groupLabel_n53ao_183";
+const wrapper = "_wrapper_u6t4o_1";
+const label = "_label_u6t4o_6";
+const helper = "_helper_u6t4o_19";
+const helperError = "_helperError_u6t4o_26";
+const errorMessage = "_errorMessage_u6t4o_30";
+const trigger = "_trigger_u6t4o_36";
+const triggerSm = "_triggerSm_u6t4o_91";
+const triggerLg = "_triggerLg_u6t4o_97";
+const value = "_value_u6t4o_103";
+const placeholder = "_placeholder_u6t4o_116";
+const icon = "_icon_u6t4o_120";
+const positioner = "_positioner_u6t4o_135";
+const popup = "_popup_u6t4o_140";
+const item = "_item_u6t4o_170";
+const itemIndicator = "_itemIndicator_u6t4o_214";
+const group = "_group_u6t4o_227";
+const groupLabel = "_groupLabel_u6t4o_233";
 const styles = {
+  wrapper,
+  label,
+  helper,
+  helperError,
+  errorMessage,
   trigger,
+  triggerSm,
+  triggerLg,
   value,
   placeholder,
   icon,
@@ -22,15 +36,21 @@ const styles = {
 };
 export {
   styles as default,
+  errorMessage,
   group,
   groupLabel,
+  helper,
+  helperError,
   icon,
   item,
   itemIndicator,
+  label,
   placeholder,
   popup,
   positioner,
   trigger,
-  value
+  triggerLg,
+  triggerSm,
+  value,
+  wrapper
 };
-//# sourceMappingURL=Select.module.scss.js.map

package/dist/components/Select/index.cjs

@@ -3,6 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const select = require("@base-ui/react/select");
+const aria = require("../../utils/aria.cjs");
 const Select_module = require("./Select.module.scss.cjs");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
@@ -62,9 +63,10 @@ const SelectContext = React__namespace.createContext({
   registerItem: () => {
   },
   unregisterItem: () => {
-  }
+  },
+  size: "md"
 });
-function SelectRoot({
+const SelectRoot = React__namespace.forwardRef(function SelectRoot2({
   children,
   value,
   defaultValue,
@@ -77,8 +79,13 @@ function SelectRoot({
   required,
   name,
   placeholder,
-  options
-}) {
+  options,
+  label,
+  helperText,
+  error,
+  size = "md",
+  className
+}, ref) {
   const [internalValue, setInternalValue] = React__namespace.useState(
     value ?? defaultValue ?? null
   );
@@ -121,11 +128,15 @@ function SelectRoot({
       value: value !== void 0 ? value : internalValue,
       items,
       registerItem,
-      unregisterItem
+      unregisterItem,
+      size
     }),
-    [placeholder, value, internalValue, items, registerItem, unregisterItem]
+    [placeholder, value, internalValue, items, registerItem, unregisterItem, size]
   );
-  return /* @__PURE__ */ jsxRuntime.jsx(SelectContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsx(
+  const { labelId, helperId, errorId, hasError, errorMessage } = aria.useFormFieldIds("select", { label, helperText, error });
+  const wrapperClasses = [Select_module.default.wrapper, className].filter(Boolean).join(" ");
+  const helperClasses = [Select_module.default.helper, hasError && Select_module.default.helperError].filter(Boolean).join(" ");
+  const selectContent = /* @__PURE__ */ jsxRuntime.jsx(
     select.Select.Root,
     {
       value,
@@ -137,14 +148,27 @@ function SelectRoot({
       disabled,
       required,
       name,
+      "aria-labelledby": labelId,
+      "aria-describedby": aria.mergeAriaIds(errorId, helperId),
       children: children ?? (options == null ? void 0 : options.map((option) => /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: option.value, disabled: option.disabled, children: option.label }, option.value)))
     }
-  ) });
-}
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(SelectContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: wrapperClasses, children: [
+    label && /* @__PURE__ */ jsxRuntime.jsx("span", { id: labelId, className: Select_module.default.label, children: label }),
+    selectContent,
+    helperText && /* @__PURE__ */ jsxRuntime.jsx("span", { id: helperId, className: helperClasses, children: helperText }),
+    errorMessage && /* @__PURE__ */ jsxRuntime.jsx("span", { id: errorId, className: Select_module.default.errorMessage, children: errorMessage })
+  ] }) });
+});
 function SelectTrigger({ children, placeholder, className, ...htmlProps }) {
   const context = React__namespace.useContext(SelectContext);
   const placeholderText = placeholder ?? context.placeholder;
-  const classes = [Select_module.default.trigger, className].filter(Boolean).join(" ");
+  const classes = [
+    Select_module.default.trigger,
+    context.size === "sm" && Select_module.default.triggerSm,
+    context.size === "lg" && Select_module.default.triggerLg,
+    className
+  ].filter(Boolean).join(" ");
   const selectedContent = context.value != null ? context.items.get(context.value) : null;
   const displayContent = selectedContent ?? (placeholderText ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: Select_module.default.placeholder, children: placeholderText }) : null);
   return /* @__PURE__ */ jsxRuntime.jsx(select.Select.Trigger, { ...htmlProps, className: classes, children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
@@ -208,4 +232,3 @@ exports.SelectGroupLabel = SelectGroupLabel;
 exports.SelectItem = SelectItem;
 exports.SelectRoot = SelectRoot;
 exports.SelectTrigger = SelectTrigger;
-//# sourceMappingURL=index.cjs.map

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

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { type FormFieldProps } from '../../utils/aria';
 export type SelectValue = string;
 export interface SelectOption {
     value: SelectValue;
@@ -9,7 +10,7 @@ export interface SelectOption {
  * Select dropdown for choosing from a list of options.
  * @see https://usefragments.com/components/select
  */
-export interface SelectProps {
+export interface SelectProps extends FormFieldProps {
     children?: React.ReactNode;
     /** Controlled selected value */
     value?: SelectValue | null;
@@ -25,8 +26,6 @@ export interface SelectProps {
     defaultOpen?: boolean;
     /** Called when open state changes */
     onOpenChange?: (open: boolean) => void;
-    /** Whether the select is non-interactive */
-    disabled?: boolean;
     /** Whether a selection is required */
     required?: boolean;
     /** Form field name */
@@ -35,6 +34,11 @@ export interface SelectProps {
     placeholder?: string;
     /** Convenience API for simple selects (renders Select.Item entries when children are omitted) */
     options?: SelectOption[];
+    /** Size variant.
+     * @default "md" */
+    size?: 'sm' | 'md' | 'lg';
+    /** Wrapper class name */
+    className?: string;
 }
 export interface SelectTriggerProps extends React.HTMLAttributes<HTMLButtonElement> {
     children?: React.ReactNode;
@@ -58,13 +62,13 @@ export interface SelectGroupProps extends React.HTMLAttributes<HTMLElement> {
 export interface SelectGroupLabelProps extends React.HTMLAttributes<HTMLElement> {
     children: React.ReactNode;
 }
-declare function SelectRoot({ children, value, defaultValue, onValueChange, onChange, open, defaultOpen, onOpenChange, disabled, required, name, placeholder, options, }: SelectProps): import("react/jsx-runtime").JSX.Element;
+declare const SelectRoot: React.ForwardRefExoticComponent<SelectProps & React.RefAttributes<HTMLDivElement>>;
 declare function SelectTrigger({ children, placeholder, className, ...htmlProps }: SelectTriggerProps): import("react/jsx-runtime").JSX.Element;
 declare function SelectContent({ children, className, sideOffset, align, maxVisibleItems, ...htmlProps }: SelectContentProps): import("react/jsx-runtime").JSX.Element;
 declare function SelectItem({ children, value, disabled, className, ...htmlProps }: SelectItemProps): import("react/jsx-runtime").JSX.Element;
 declare function SelectGroup({ children, className, ...htmlProps }: SelectGroupProps): import("react/jsx-runtime").JSX.Element;
 declare function SelectGroupLabel({ children, className, ...htmlProps }: SelectGroupLabelProps): import("react/jsx-runtime").JSX.Element;
-export declare const Select: typeof SelectRoot & {
+export declare const Select: React.ForwardRefExoticComponent<SelectProps & React.RefAttributes<HTMLDivElement>> & {
     Trigger: typeof SelectTrigger;
     Content: typeof SelectContent;
     Item: typeof SelectItem;

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Select/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,MAAM,MAAM,WAAW,GAAG,MAAM,CAAC;AAEjC,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,WAAW,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;GAGG;AACH,MAAM,WAAW,WAAW;IAC1B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,gCAAgC;IAChC,KAAK,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC3B,2CAA2C;IAC3C,YAAY,CAAC,EAAE,WAAW,CAAC;IAC3B,oCAAoC;IACpC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IACpD,8BAA8B;IAC9B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IAC/C,4BAA4B;IAC5B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,yBAAyB;IACzB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,qCAAqC;IACrC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,4CAA4C;IAC5C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,sCAAsC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,sBAAsB;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,iDAAiD;IACjD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iGAAiG;IACjG,OAAO,CAAC,EAAE,YAAY,EAAE,CAAC;CAC1B;AAED,MAAM,WAAW,kBAAmB,SAAQ,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC;IACjF,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,MAAM,WAAW,kBAAmB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC9E,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;IACnC,mHAAmH;IACnH,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,UAAU,CAAC;IAC1F,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,EAAE,WAAW,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,gBAAiB,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IACzE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,MAAM,WAAW,qBAAsB,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IAC9E,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAkED,iBAAS,UAAU,CAAC,EAClB,QAAQ,EACR,KAAK,EACL,YAAY,EACZ,aAAa,EACb,QAAQ,EACR,IAAI,EACJ,WAAW,EACX,YAAY,EACZ,QAAQ,EACR,QAAQ,EACR,IAAI,EACJ,WAAW,EACX,OAAO,GACR,EAAE,WAAW,2CA4Eb;AAED,iBAAS,aAAa,CAAC,EAAE,QAAQ,EAAE,WAAW,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EAAE,kBAAkB,2CA4B5F;AAED,iBAAS,aAAa,CAAC,EACrB,QAAQ,EACR,SAAS,EACT,UAAc,EACd,KAAe,EACf,eAAe,EACf,GAAG,SAAS,EACb,EAAE,kBAAkB,2CAoBpB;AAED,iBAAS,UAAU,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EAAE,eAAe,2CAoB1F;AAED,iBAAS,WAAW,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EAAE,gBAAgB,2CAG3E;AAED,iBAAS,gBAAgB,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EAAE,qBAAqB,2CAGrF;AAMD,eAAO,MAAM,MAAM;;;;;;CAMjB,CAAC;AAGH,OAAO,EACL,UAAU,EACV,aAAa,EACb,aAAa,EACb,UAAU,EACV,WAAW,EACX,gBAAgB,GACjB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Select/index.tsx"],"names":[],"mappings":"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"}

package/dist/components/Select/index.js

@@ -1,6 +1,7 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import * as React from "react";
 import { Select as Select$1 } from "@base-ui/react/select";
+import { useFormFieldIds, mergeAriaIds } from "../../utils/aria.js";
 import styles from "./Select.module.scss.js";
 function ChevronDownIcon() {
   return /* @__PURE__ */ jsx(
@@ -43,9 +44,10 @@ const SelectContext = React.createContext({
   registerItem: () => {
   },
   unregisterItem: () => {
-  }
+  },
+  size: "md"
 });
-function SelectRoot({
+const SelectRoot = React.forwardRef(function SelectRoot2({
   children,
   value,
   defaultValue,
@@ -58,8 +60,13 @@ function SelectRoot({
   required,
   name,
   placeholder,
-  options
-}) {
+  options,
+  label,
+  helperText,
+  error,
+  size = "md",
+  className
+}, ref) {
   const [internalValue, setInternalValue] = React.useState(
     value ?? defaultValue ?? null
   );
@@ -102,11 +109,15 @@ function SelectRoot({
       value: value !== void 0 ? value : internalValue,
       items,
       registerItem,
-      unregisterItem
+      unregisterItem,
+      size
     }),
-    [placeholder, value, internalValue, items, registerItem, unregisterItem]
+    [placeholder, value, internalValue, items, registerItem, unregisterItem, size]
   );
-  return /* @__PURE__ */ jsx(SelectContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
+  const { labelId, helperId, errorId, hasError, errorMessage } = useFormFieldIds("select", { label, helperText, error });
+  const wrapperClasses = [styles.wrapper, className].filter(Boolean).join(" ");
+  const helperClasses = [styles.helper, hasError && styles.helperError].filter(Boolean).join(" ");
+  const selectContent = /* @__PURE__ */ jsx(
     Select$1.Root,
     {
       value,
@@ -118,14 +129,27 @@ function SelectRoot({
       disabled,
       required,
       name,
+      "aria-labelledby": labelId,
+      "aria-describedby": mergeAriaIds(errorId, helperId),
       children: children ?? (options == null ? void 0 : options.map((option) => /* @__PURE__ */ jsx(SelectItem, { value: option.value, disabled: option.disabled, children: option.label }, option.value)))
     }
-  ) });
-}
+  );
+  return /* @__PURE__ */ jsx(SelectContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxs("div", { ref, className: wrapperClasses, children: [
+    label && /* @__PURE__ */ jsx("span", { id: labelId, className: styles.label, children: label }),
+    selectContent,
+    helperText && /* @__PURE__ */ jsx("span", { id: helperId, className: helperClasses, children: helperText }),
+    errorMessage && /* @__PURE__ */ jsx("span", { id: errorId, className: styles.errorMessage, children: errorMessage })
+  ] }) });
+});
 function SelectTrigger({ children, placeholder, className, ...htmlProps }) {
   const context = React.useContext(SelectContext);
   const placeholderText = placeholder ?? context.placeholder;
-  const classes = [styles.trigger, className].filter(Boolean).join(" ");
+  const classes = [
+    styles.trigger,
+    context.size === "sm" && styles.triggerSm,
+    context.size === "lg" && styles.triggerLg,
+    className
+  ].filter(Boolean).join(" ");
   const selectedContent = context.value != null ? context.items.get(context.value) : null;
   const displayContent = selectedContent ?? (placeholderText ? /* @__PURE__ */ jsx("span", { className: styles.placeholder, children: placeholderText }) : null);
   return /* @__PURE__ */ jsx(Select$1.Trigger, { ...htmlProps, className: classes, children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -191,4 +215,3 @@ export {
   SelectRoot,
   SelectTrigger
 };
-//# sourceMappingURL=index.js.map

package/dist/components/Separator/Separator.module.scss.cjs

@@ -1,15 +1,15 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const separator = "_separator_1rior_1";
-const horizontal = "_horizontal_1rior_6";
-const vertical = "_vertical_1rior_11";
-const withLabel = "_withLabel_1rior_17";
-const label = "_label_1rior_30";
-const spacingNone = "_spacingNone_1rior_40";
-const spacingSm = "_spacingSm_1rior_44";
-const spacingMd = "_spacingMd_1rior_51";
-const spacingLg = "_spacingLg_1rior_58";
-const soft = "_soft_1rior_65";
+const separator = "_separator_13ozq_1";
+const horizontal = "_horizontal_13ozq_6";
+const vertical = "_vertical_13ozq_11";
+const withLabel = "_withLabel_13ozq_17";
+const label = "_label_13ozq_30";
+const spacingNone = "_spacingNone_13ozq_40";
+const spacingSm = "_spacingSm_13ozq_44";
+const spacingMd = "_spacingMd_13ozq_51";
+const spacingLg = "_spacingLg_13ozq_58";
+const soft = "_soft_13ozq_65";
 const styles = {
   separator,
   horizontal,
@@ -33,4 +33,3 @@ exports.spacingNone = spacingNone;
 exports.spacingSm = spacingSm;
 exports.vertical = vertical;
 exports.withLabel = withLabel;
-//# sourceMappingURL=Separator.module.scss.cjs.map

package/dist/components/Separator/Separator.module.scss.js

@@ -1,13 +1,13 @@
-const separator = "_separator_1rior_1";
-const horizontal = "_horizontal_1rior_6";
-const vertical = "_vertical_1rior_11";
-const withLabel = "_withLabel_1rior_17";
-const label = "_label_1rior_30";
-const spacingNone = "_spacingNone_1rior_40";
-const spacingSm = "_spacingSm_1rior_44";
-const spacingMd = "_spacingMd_1rior_51";
-const spacingLg = "_spacingLg_1rior_58";
-const soft = "_soft_1rior_65";
+const separator = "_separator_13ozq_1";
+const horizontal = "_horizontal_13ozq_6";
+const vertical = "_vertical_13ozq_11";
+const withLabel = "_withLabel_13ozq_17";
+const label = "_label_13ozq_30";
+const spacingNone = "_spacingNone_13ozq_40";
+const spacingSm = "_spacingSm_13ozq_44";
+const spacingMd = "_spacingMd_13ozq_51";
+const spacingLg = "_spacingLg_13ozq_58";
+const soft = "_soft_13ozq_65";
 const styles = {
   separator,
   horizontal,
@@ -33,4 +33,3 @@ export {
   vertical,
   withLabel
 };
-//# sourceMappingURL=Separator.module.scss.js.map

package/dist/components/Separator/index.cjs

@@ -2,8 +2,8 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
+const separator = require("@base-ui/react/separator");
 const Separator_module = require("./Separator.module.scss.cjs");
-const Separator$1 = require("../../node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/react/esm/separator/Separator.cjs");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
   if (e) {
@@ -66,7 +66,7 @@ const SeparatorRoot = React__namespace.forwardRef(
       className
     ].filter(Boolean).join(" ");
     return /* @__PURE__ */ jsxRuntime.jsx(
-      Separator$1.Separator,
+      separator.Separator,
       {
         ref,
         orientation,
@@ -81,4 +81,3 @@ const Separator = Object.assign(SeparatorRoot, {
   Root: SeparatorRoot
 });
 exports.Separator = Separator;
-//# sourceMappingURL=index.cjs.map

package/dist/components/Separator/index.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import * as React from "react";
+import { Separator as Separator$1 } from "@base-ui/react/separator";
 import styles from "./Separator.module.scss.js";
-import { Separator as Separator$1 } from "../../node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/react/esm/separator/Separator.js";
 const spacingClasses = {
   none: styles.spacingNone,
   sm: styles.spacingSm,
@@ -64,4 +64,3 @@ const Separator = Object.assign(SeparatorRoot, {
 export {
   Separator
 };
-//# sourceMappingURL=index.js.map

package/dist/components/Sidebar/Sidebar.module.scss.cjs

@@ -1,47 +1,47 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const root = "_root_1kyk4_1";
-const mobile = "_mobile_1kyk4_14";
-const collapsed = "_collapsed_1kyk4_20";
-const header = "_header_1kyk4_23";
-const nav = "_nav_1kyk4_27";
-const sectionLabel = "_sectionLabel_1kyk4_30";
-const itemLabel = "_itemLabel_1kyk4_41";
-const itemBadge = "_itemBadge_1kyk4_42";
-const itemChevron = "_itemChevron_1kyk4_43";
-const item = "_item_1kyk4_41";
-const itemIcon = "_itemIcon_1kyk4_51";
-const footer = "_footer_1kyk4_54";
-const collapseToggle = "_collapseToggle_1kyk4_58";
-const collapsedNoIcons = "_collapsedNoIcons_1kyk4_62";
-const collapseToggleFloating = "_collapseToggleFloating_1kyk4_71";
-const positionRight = "_positionRight_1kyk4_85";
-const navScrollArea = "_navScrollArea_1kyk4_112";
-const section = "_section_1kyk4_30";
-const sectionHeader = "_sectionHeader_1kyk4_121";
-const sectionTrigger = "_sectionTrigger_1kyk4_128";
-const sectionActionWrapper = "_sectionActionWrapper_1kyk4_144";
-const sectionAction = "_sectionAction_1kyk4_144";
-const sectionList = "_sectionList_1kyk4_190";
-const sectionCollapsible = "_sectionCollapsible_1kyk4_196";
-const itemWrapper = "_itemWrapper_1kyk4_209";
-const itemDisabled = "_itemDisabled_1kyk4_253";
-const itemActive = "_itemActive_1kyk4_262";
-const itemExpanded = "_itemExpanded_1kyk4_342";
-const submenu = "_submenu_1kyk4_346";
-const submenuWrapper = "_submenuWrapper_1kyk4_356";
-const subItemWrapper = "_subItemWrapper_1kyk4_364";
-const subItem = "_subItem_1kyk4_364";
-const subItemDisabled = "_subItemDisabled_1kyk4_421";
-const subItemActive = "_subItemActive_1kyk4_430";
-const trigger = "_trigger_1kyk4_452";
-const overlay = "_overlay_1kyk4_493";
-const offcanvasCollapsed = "_offcanvasCollapsed_1kyk4_563";
-const rail = "_rail_1kyk4_570";
-const railCollapsed = "_railCollapsed_1kyk4_638";
-const menuSkeleton = "_menuSkeleton_1kyk4_642";
-const skeletonItem = "_skeletonItem_1kyk4_649";
-const skeletonLabel = "_skeletonLabel_1kyk4_657";
+const root = "_root_17397_1";
+const mobile = "_mobile_17397_14";
+const collapsed = "_collapsed_17397_20";
+const header = "_header_17397_23";
+const nav = "_nav_17397_27";
+const sectionLabel = "_sectionLabel_17397_30";
+const itemLabel = "_itemLabel_17397_41";
+const itemBadge = "_itemBadge_17397_42";
+const itemChevron = "_itemChevron_17397_43";
+const item = "_item_17397_41";
+const itemIcon = "_itemIcon_17397_51";
+const footer = "_footer_17397_54";
+const collapseToggle = "_collapseToggle_17397_58";
+const collapsedNoIcons = "_collapsedNoIcons_17397_62";
+const collapseToggleFloating = "_collapseToggleFloating_17397_71";
+const positionRight = "_positionRight_17397_85";
+const navScrollArea = "_navScrollArea_17397_112";
+const section = "_section_17397_30";
+const sectionHeader = "_sectionHeader_17397_121";
+const sectionTrigger = "_sectionTrigger_17397_128";
+const sectionActionWrapper = "_sectionActionWrapper_17397_144";
+const sectionAction = "_sectionAction_17397_144";
+const sectionList = "_sectionList_17397_190";
+const sectionCollapsible = "_sectionCollapsible_17397_196";
+const itemWrapper = "_itemWrapper_17397_209";
+const itemDisabled = "_itemDisabled_17397_253";
+const itemActive = "_itemActive_17397_262";
+const itemExpanded = "_itemExpanded_17397_342";
+const submenu = "_submenu_17397_346";
+const submenuWrapper = "_submenuWrapper_17397_356";
+const subItemWrapper = "_subItemWrapper_17397_364";
+const subItem = "_subItem_17397_364";
+const subItemDisabled = "_subItemDisabled_17397_421";
+const subItemActive = "_subItemActive_17397_430";
+const trigger = "_trigger_17397_452";
+const overlay = "_overlay_17397_493";
+const offcanvasCollapsed = "_offcanvasCollapsed_17397_563";
+const rail = "_rail_17397_570";
+const railCollapsed = "_railCollapsed_17397_638";
+const menuSkeleton = "_menuSkeleton_17397_642";
+const skeletonItem = "_skeletonItem_17397_649";
+const skeletonLabel = "_skeletonLabel_17397_657";
 const styles = {
   root,
   mobile,
@@ -129,4 +129,3 @@ exports.subItemWrapper = subItemWrapper;
 exports.submenu = submenu;
 exports.submenuWrapper = submenuWrapper;
 exports.trigger = trigger;
-//# sourceMappingURL=Sidebar.module.scss.cjs.map