@raystack/apsara 1.0.0-rc.0 → 1.0.0-rc.1

package/dist/components/sidebar/sidebar-root.js

@@ -1,28 +1,28 @@
 "use client";
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { cx } from 'class-variance-authority';
-import { createContext, forwardRef, useState, useCallback } from 'react';
+import { createContext, useState, useCallback } from 'react';
 import { Tooltip } from '../tooltip/tooltip.js';
 import styles from './sidebar.module.css.js';
 
 const SidebarContext = createContext({
     isCollapsed: false
 });
-const SidebarRoot = forwardRef(({ className, position = 'left', open: providedOpen, onOpenChange, hideCollapsedItemTooltip, collapsible = true, tooltipMessage, defaultOpen = true, children, ...props }, ref) => {
+function SidebarRoot({ className, position = 'left', open: providedOpen, onOpenChange, hideCollapsedItemTooltip, collapsible = true, tooltipMessage, defaultOpen = true, children, ...props }) {
     const [internalOpen, setInternalOpen] = useState(defaultOpen);
     const open = providedOpen ?? internalOpen;
     const handleOpenChange = useCallback((value) => {
         setInternalOpen(value);
         onOpenChange?.(value);
     }, [onOpenChange]);
-    return (jsx(SidebarContext.Provider, { value: { isCollapsed: !open, hideCollapsedItemTooltip }, children: jsxs("aside", { ref: ref, className: cx(styles.root, className), "data-position": position, "data-open": open ? '' : undefined, "data-closed": !open ? '' : undefined, "data-collapse-disabled": !collapsible ? '' : undefined, "aria-label": 'Navigation Sidebar', "aria-expanded": open, role: 'navigation', ...props, children: [collapsible && (jsxs(Tooltip, { trackCursorAxis: 'y', children: [jsx(Tooltip.Trigger, { render: jsx("div", { className: styles.resizeHandle, onClick: () => handleOpenChange(!open), role: 'button', tabIndex: 0, "aria-label": open ? 'Collapse sidebar' : 'Expand sidebar', onKeyDown: e => {
+    return (jsx(SidebarContext, { value: { isCollapsed: !open, hideCollapsedItemTooltip }, children: jsxs("aside", { className: cx(styles.root, className), "data-position": position, "data-open": open ? '' : undefined, "data-closed": !open ? '' : undefined, "data-collapse-disabled": !collapsible ? '' : undefined, "aria-label": 'Navigation Sidebar', "aria-expanded": open, role: 'navigation', ...props, children: [collapsible && (jsxs(Tooltip, { trackCursorAxis: 'y', children: [jsx(Tooltip.Trigger, { render: jsx("div", { className: styles.resizeHandle, onClick: () => handleOpenChange(!open), role: 'button', tabIndex: 0, "aria-label": open ? 'Collapse sidebar' : 'Expand sidebar', onKeyDown: e => {
                                     if (e.key === 'Enter' || e.key === ' ') {
                                         e.preventDefault();
                                         handleOpenChange(!open);
                                     }
                                 } }) }), jsx(Tooltip.Content, { side: position === 'left' ? 'right' : 'left', sideOffset: 10, children: tooltipMessage ??
                                 (open ? 'Click to collapse' : 'Click to expand') })] })), children] }) }));
-});
+}
 SidebarRoot.displayName = 'Sidebar';
 
 export { SidebarContext, SidebarRoot };

package/dist/components/sidebar/sidebar-root.js.map

@@ -1 +1 @@
-{"version":3,"file":"sidebar-root.js","sources":["../../../components/sidebar/sidebar-root.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'class-variance-authority';\nimport {\n  ComponentPropsWithoutRef,\n  createContext,\n  forwardRef,\n  ReactNode,\n  useCallback,\n  useState\n} from 'react';\nimport { Tooltip } from '../tooltip';\nimport styles from './sidebar.module.css';\n\nexport interface SidebarContextValue {\n  isCollapsed: boolean;\n  hideCollapsedItemTooltip?: boolean;\n}\n\nexport const SidebarContext = createContext<SidebarContextValue>({\n  isCollapsed: false\n});\n\nexport interface SidebarRootProps extends ComponentPropsWithoutRef<'aside'> {\n  position?: 'left' | 'right';\n  hideCollapsedItemTooltip?: boolean;\n  collapsible?: boolean;\n  tooltipMessage?: ReactNode;\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n}\n\nexport const SidebarRoot = forwardRef<HTMLElement, SidebarRootProps>(\n  (\n    {\n      className,\n      position = 'left',\n      open: providedOpen,\n      onOpenChange,\n      hideCollapsedItemTooltip,\n      collapsible = true,\n      tooltipMessage,\n      defaultOpen = true,\n      children,\n      ...props\n    },\n    ref\n  ) => {\n    const [internalOpen, setInternalOpen] = useState(defaultOpen);\n    const open = providedOpen ?? internalOpen;\n\n    const handleOpenChange = useCallback(\n      (value: boolean) => {\n        setInternalOpen(value);\n        onOpenChange?.(value);\n      },\n      [onOpenChange]\n    );\n\n    return (\n      <SidebarContext.Provider\n        value={{ isCollapsed: !open, hideCollapsedItemTooltip }}\n      >\n        <aside\n          ref={ref}\n          className={cx(styles.root, className)}\n          data-position={position}\n          data-open={open ? '' : undefined}\n          data-closed={!open ? '' : undefined}\n          data-collapse-disabled={!collapsible ? '' : undefined}\n          aria-label='Navigation Sidebar'\n          aria-expanded={open}\n          role='navigation'\n          {...props}\n        >\n          {collapsible && (\n            <Tooltip trackCursorAxis='y'>\n              <Tooltip.Trigger\n                render={\n                  <div\n                    className={styles.resizeHandle}\n                    onClick={() => handleOpenChange(!open)}\n                    role='button'\n                    tabIndex={0}\n                    aria-label={open ? 'Collapse sidebar' : 'Expand sidebar'}\n                    onKeyDown={e => {\n                      if (e.key === 'Enter' || e.key === ' ') {\n                        e.preventDefault();\n                        handleOpenChange(!open);\n                      }\n                    }}\n                  />\n                }\n              />\n              <Tooltip.Content\n                side={position === 'left' ? 'right' : 'left'}\n                sideOffset={10}\n              >\n                {tooltipMessage ??\n                  (open ? 'Click to collapse' : 'Click to expand')}\n              </Tooltip.Content>\n            </Tooltip>\n          )}\n          {children}\n        </aside>\n      </SidebarContext.Provider>\n    );\n  }\n);\n\nSidebarRoot.displayName = 'Sidebar';\n"],"names":[],"mappings":";;;;;;;AAmBO;AACL;AACD;AAYY;;AAiBT;AAEA;;AAGI;AACF;AAIF;AA2BkB;;AAEE;;;AAWN;AAQhB;AAGF;;"}
+{"version":3,"file":"sidebar-root.js","sources":["../../../components/sidebar/sidebar-root.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'class-variance-authority';\nimport {\n  ComponentProps,\n  createContext,\n  ReactNode,\n  useCallback,\n  useState\n} from 'react';\nimport { Tooltip } from '../tooltip';\nimport styles from './sidebar.module.css';\n\nexport interface SidebarContextValue {\n  isCollapsed: boolean;\n  hideCollapsedItemTooltip?: boolean;\n}\n\nexport const SidebarContext = createContext<SidebarContextValue>({\n  isCollapsed: false\n});\n\nexport interface SidebarRootProps extends ComponentProps<'aside'> {\n  position?: 'left' | 'right';\n  hideCollapsedItemTooltip?: boolean;\n  collapsible?: boolean;\n  tooltipMessage?: ReactNode;\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n}\n\nexport function SidebarRoot({\n  className,\n  position = 'left',\n  open: providedOpen,\n  onOpenChange,\n  hideCollapsedItemTooltip,\n  collapsible = true,\n  tooltipMessage,\n  defaultOpen = true,\n  children,\n  ...props\n}: SidebarRootProps) {\n  const [internalOpen, setInternalOpen] = useState(defaultOpen);\n  const open = providedOpen ?? internalOpen;\n\n  const handleOpenChange = useCallback(\n    (value: boolean) => {\n      setInternalOpen(value);\n      onOpenChange?.(value);\n    },\n    [onOpenChange]\n  );\n\n  return (\n    <SidebarContext value={{ isCollapsed: !open, hideCollapsedItemTooltip }}>\n      <aside\n        className={cx(styles.root, className)}\n        data-position={position}\n        data-open={open ? '' : undefined}\n        data-closed={!open ? '' : undefined}\n        data-collapse-disabled={!collapsible ? '' : undefined}\n        aria-label='Navigation Sidebar'\n        aria-expanded={open}\n        role='navigation'\n        {...props}\n      >\n        {collapsible && (\n          <Tooltip trackCursorAxis='y'>\n            <Tooltip.Trigger\n              render={\n                <div\n                  className={styles.resizeHandle}\n                  onClick={() => handleOpenChange(!open)}\n                  role='button'\n                  tabIndex={0}\n                  aria-label={open ? 'Collapse sidebar' : 'Expand sidebar'}\n                  onKeyDown={e => {\n                    if (e.key === 'Enter' || e.key === ' ') {\n                      e.preventDefault();\n                      handleOpenChange(!open);\n                    }\n                  }}\n                />\n              }\n            />\n            <Tooltip.Content\n              side={position === 'left' ? 'right' : 'left'}\n              sideOffset={10}\n            >\n              {tooltipMessage ??\n                (open ? 'Click to collapse' : 'Click to expand')}\n            </Tooltip.Content>\n          </Tooltip>\n        )}\n        {children}\n      </aside>\n    </SidebarContext>\n  );\n}\n\nSidebarRoot.displayName = 'Sidebar';\n"],"names":[],"mappings":";;;;;;;AAkBO;AACL;AACD;AAYe;;AAad;AAEA;;AAGI;AACF;AAIF;AAwBkB;;AAEE;;;AAWN;AAQhB;AAEA;;"}

package/dist/components/sidebar/sidebar.d.ts

@@ -1,8 +1,12 @@
-export declare const Sidebar: import("react").ForwardRefExoticComponent<import("./sidebar-root").SidebarRootProps & import("react").RefAttributes<HTMLElement>> & {
-    Header: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-    Main: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-    Footer: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-    Item: import("react").ForwardRefExoticComponent<import("./sidebar-item").SidebarItemProps & import("react").RefAttributes<HTMLAnchorElement>>;
-    Group: import("react").ForwardRefExoticComponent<import("./sidebar-misc").SidebarNavigationGroupProps & import("react").RefAttributes<HTMLElement>>;
+import { SidebarItem } from './sidebar-item';
+import { SidebarMain } from './sidebar-main';
+import { SidebarFooter, SidebarHeader, SidebarNavigationGroup } from './sidebar-misc';
+import { SidebarRoot } from './sidebar-root';
+export declare const Sidebar: typeof SidebarRoot & {
+    Header: typeof SidebarHeader;
+    Main: typeof SidebarMain;
+    Footer: typeof SidebarFooter;
+    Item: typeof SidebarItem;
+    Group: typeof SidebarNavigationGroup;
 };
 //# sourceMappingURL=sidebar.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"sidebar.d.ts","sourceRoot":"","sources":["../../../components/sidebar/sidebar.tsx"],"names":[],"mappings":"AASA,eAAO,MAAM,OAAO;;;;;;CAMlB,CAAC"}
+{"version":3,"file":"sidebar.d.ts","sourceRoot":"","sources":["../../../components/sidebar/sidebar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EACL,aAAa,EACb,aAAa,EACb,sBAAsB,EACvB,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C,eAAO,MAAM,OAAO;;;;;;CAMlB,CAAC"}

package/dist/components/skeleton/skeleton.cjs

@@ -28,9 +28,11 @@ const SkeletonBase = (props) => {
                 ...style
             } }, i))) }));
 };
+SkeletonBase.displayName = 'Skeleton';
 const Provider = ({ children, ...props }) => {
-    return (jsxRuntime.jsx(SkeletonContext.Provider, { value: props, children: children }));
+    return jsxRuntime.jsx(SkeletonContext, { value: props, children: children });
 };
+Provider.displayName = 'Skeleton.Provider';
 const Skeleton = Object.assign(SkeletonBase, { Provider });
 
 exports.Skeleton = Skeleton;

package/dist/components/skeleton/skeleton.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton.cjs","sources":["../../../components/skeleton/skeleton.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'class-variance-authority';\nimport { CSSProperties, createContext, useContext } from 'react';\nimport styles from './skeleton.module.css';\n\nexport interface SkeletonProps {\n  baseColor?: string;\n  highlightColor?: string;\n  width?: string | number;\n  height?: string | number;\n  borderRadius?: string | number;\n  inline?: boolean;\n  duration?: number;\n  enableAnimation?: boolean;\n  count?: number;\n  style?: CSSProperties;\n  className?: string;\n  containerStyle?: CSSProperties;\n  containerClassName?: string;\n}\n\nconst SkeletonContext = createContext<SkeletonProps | null>(null);\n\ninterface SkeletonProviderProps extends SkeletonProps {\n  children: React.ReactNode;\n}\n\nconst SkeletonBase = (props: SkeletonProps) => {\n  const contextProps = useContext(SkeletonContext);\n\n  const {\n    baseColor,\n    highlightColor,\n    width,\n    height = 'var(--rs-space-4)',\n    borderRadius = 'var(--rs-radius-2)',\n    inline = false,\n    duration = 1.5,\n    count = 1,\n    enableAnimation = true,\n    style,\n    className,\n    containerStyle,\n    containerClassName\n  } = { ...contextProps, ...props };\n\n  const skeletonClassName = cx(\n    styles.skeleton,\n    inline && styles.inline,\n    enableAnimation && styles.animate,\n    className\n  );\n\n  const Container = inline ? 'span' : 'div';\n  const defaultWidth = inline ? '50px' : '100%';\n\n  return (\n    <Container\n      className={containerClassName}\n      style={{\n        display: inline ? 'inline-block' : 'flex',\n        flexDirection: !inline ? 'column' : undefined,\n        gap: !inline && count > 1 ? 'var(--rs-space-3)' : undefined,\n        ...containerStyle\n      }}\n    >\n      {Array.from({ length: count }).map((_, i) => (\n        <span\n          key={i}\n          className={skeletonClassName}\n          style={\n            {\n              width: width ?? defaultWidth,\n              height,\n              borderRadius,\n              '--skeleton-base-color': baseColor,\n              '--skeleton-highlight-color': highlightColor,\n              '--skeleton-duration': `${duration}s`,\n              ...style\n            } as CSSProperties\n          }\n        />\n      ))}\n    </Container>\n  );\n};\n\nconst Provider = ({ children, ...props }: SkeletonProviderProps) => {\n  return (\n    <SkeletonContext.Provider value={props}>\n      {children}\n    </SkeletonContext.Provider>\n  );\n};\n\nexport const Skeleton = Object.assign(SkeletonBase, { Provider });\n"],"names":[],"mappings":";;;;;;;;AAsBA;AAMA;AACE;;;;;;;;AAkCM;AACA;;;;;AAYM;AACA;;AAEA;AACgB;AAM9B;AAEA;AACE;AAKF;AAEO;;"}
+{"version":3,"file":"skeleton.cjs","sources":["../../../components/skeleton/skeleton.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'class-variance-authority';\nimport { CSSProperties, createContext, ReactNode, useContext } from 'react';\nimport styles from './skeleton.module.css';\n\nexport interface SkeletonProps {\n  baseColor?: string;\n  highlightColor?: string;\n  width?: string | number;\n  height?: string | number;\n  borderRadius?: string | number;\n  inline?: boolean;\n  duration?: number;\n  enableAnimation?: boolean;\n  count?: number;\n  style?: CSSProperties;\n  className?: string;\n  containerStyle?: CSSProperties;\n  containerClassName?: string;\n}\n\nconst SkeletonContext = createContext<SkeletonProps | null>(null);\n\ninterface SkeletonProviderProps extends SkeletonProps {\n  children: ReactNode;\n}\n\nconst SkeletonBase = (props: SkeletonProps) => {\n  const contextProps = useContext(SkeletonContext);\n\n  const {\n    baseColor,\n    highlightColor,\n    width,\n    height = 'var(--rs-space-4)',\n    borderRadius = 'var(--rs-radius-2)',\n    inline = false,\n    duration = 1.5,\n    count = 1,\n    enableAnimation = true,\n    style,\n    className,\n    containerStyle,\n    containerClassName\n  } = { ...contextProps, ...props };\n\n  const skeletonClassName = cx(\n    styles.skeleton,\n    inline && styles.inline,\n    enableAnimation && styles.animate,\n    className\n  );\n\n  const Container = inline ? 'span' : 'div';\n  const defaultWidth = inline ? '50px' : '100%';\n\n  return (\n    <Container\n      className={containerClassName}\n      style={{\n        display: inline ? 'inline-block' : 'flex',\n        flexDirection: !inline ? 'column' : undefined,\n        gap: !inline && count > 1 ? 'var(--rs-space-3)' : undefined,\n        ...containerStyle\n      }}\n    >\n      {Array.from({ length: count }).map((_, i) => (\n        <span\n          key={i}\n          className={skeletonClassName}\n          style={\n            {\n              width: width ?? defaultWidth,\n              height,\n              borderRadius,\n              '--skeleton-base-color': baseColor,\n              '--skeleton-highlight-color': highlightColor,\n              '--skeleton-duration': `${duration}s`,\n              ...style\n            } as CSSProperties\n          }\n        />\n      ))}\n    </Container>\n  );\n};\n\nSkeletonBase.displayName = 'Skeleton';\n\nconst Provider = ({ children, ...props }: SkeletonProviderProps) => {\n  return <SkeletonContext value={props}>{children}</SkeletonContext>;\n};\n\nProvider.displayName = 'Skeleton.Provider';\n\nexport const Skeleton = Object.assign(SkeletonBase, { Provider });\n"],"names":[],"mappings":";;;;;;;;AAsBA;AAMA;AACE;;;;;;;;AAkCM;AACA;;;;;AAYM;AACA;;AAEA;AACgB;AAM9B;AAEA;AAEA;;AAEA;AAEA;AAEO;;"}

package/dist/components/skeleton/skeleton.d.ts

@@ -1,4 +1,4 @@
-import { CSSProperties } from 'react';
+import { CSSProperties, ReactNode } from 'react';
 export interface SkeletonProps {
     baseColor?: string;
     highlightColor?: string;
@@ -15,10 +15,16 @@ export interface SkeletonProps {
     containerClassName?: string;
 }
 interface SkeletonProviderProps extends SkeletonProps {
-    children: React.ReactNode;
+    children: ReactNode;
 }
-export declare const Skeleton: ((props: SkeletonProps) => import("react/jsx-runtime").JSX.Element) & {
-    Provider: ({ children, ...props }: SkeletonProviderProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Skeleton: {
+    (props: SkeletonProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+} & {
+    Provider: {
+        ({ children, ...props }: SkeletonProviderProps): import("react/jsx-runtime").JSX.Element;
+        displayName: string;
+    };
 };
 export {};
 //# sourceMappingURL=skeleton.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"skeleton.d.ts","sourceRoot":"","sources":["../../../components/skeleton/skeleton.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,aAAa,EAA6B,MAAM,OAAO,CAAC;AAGjE,MAAM,WAAW,aAAa;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC/B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAID,UAAU,qBAAsB,SAAQ,aAAa;IACnD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAsED,eAAO,MAAM,QAAQ,WApEQ,aAAa;uCA4DA,qBAAqB;CAQE,CAAC"}
+{"version":3,"file":"skeleton.d.ts","sourceRoot":"","sources":["../../../components/skeleton/skeleton.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,aAAa,EAAiB,SAAS,EAAc,MAAM,OAAO,CAAC;AAG5E,MAAM,WAAW,aAAa;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC/B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAID,UAAU,qBAAsB,SAAQ,aAAa;IACnD,QAAQ,EAAE,SAAS,CAAC;CACrB;AAsED,eAAO,MAAM,QAAQ;YApEQ,aAAa;;;;iCA8DA,qBAAqB;;;CAME,CAAC"}

package/dist/components/skeleton/skeleton.js

@@ -26,9 +26,11 @@ const SkeletonBase = (props) => {
                 ...style
             } }, i))) }));
 };
+SkeletonBase.displayName = 'Skeleton';
 const Provider = ({ children, ...props }) => {
-    return (jsx(SkeletonContext.Provider, { value: props, children: children }));
+    return jsx(SkeletonContext, { value: props, children: children });
 };
+Provider.displayName = 'Skeleton.Provider';
 const Skeleton = Object.assign(SkeletonBase, { Provider });
 
 export { Skeleton };

package/dist/components/skeleton/skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton.js","sources":["../../../components/skeleton/skeleton.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'class-variance-authority';\nimport { CSSProperties, createContext, useContext } from 'react';\nimport styles from './skeleton.module.css';\n\nexport interface SkeletonProps {\n  baseColor?: string;\n  highlightColor?: string;\n  width?: string | number;\n  height?: string | number;\n  borderRadius?: string | number;\n  inline?: boolean;\n  duration?: number;\n  enableAnimation?: boolean;\n  count?: number;\n  style?: CSSProperties;\n  className?: string;\n  containerStyle?: CSSProperties;\n  containerClassName?: string;\n}\n\nconst SkeletonContext = createContext<SkeletonProps | null>(null);\n\ninterface SkeletonProviderProps extends SkeletonProps {\n  children: React.ReactNode;\n}\n\nconst SkeletonBase = (props: SkeletonProps) => {\n  const contextProps = useContext(SkeletonContext);\n\n  const {\n    baseColor,\n    highlightColor,\n    width,\n    height = 'var(--rs-space-4)',\n    borderRadius = 'var(--rs-radius-2)',\n    inline = false,\n    duration = 1.5,\n    count = 1,\n    enableAnimation = true,\n    style,\n    className,\n    containerStyle,\n    containerClassName\n  } = { ...contextProps, ...props };\n\n  const skeletonClassName = cx(\n    styles.skeleton,\n    inline && styles.inline,\n    enableAnimation && styles.animate,\n    className\n  );\n\n  const Container = inline ? 'span' : 'div';\n  const defaultWidth = inline ? '50px' : '100%';\n\n  return (\n    <Container\n      className={containerClassName}\n      style={{\n        display: inline ? 'inline-block' : 'flex',\n        flexDirection: !inline ? 'column' : undefined,\n        gap: !inline && count > 1 ? 'var(--rs-space-3)' : undefined,\n        ...containerStyle\n      }}\n    >\n      {Array.from({ length: count }).map((_, i) => (\n        <span\n          key={i}\n          className={skeletonClassName}\n          style={\n            {\n              width: width ?? defaultWidth,\n              height,\n              borderRadius,\n              '--skeleton-base-color': baseColor,\n              '--skeleton-highlight-color': highlightColor,\n              '--skeleton-duration': `${duration}s`,\n              ...style\n            } as CSSProperties\n          }\n        />\n      ))}\n    </Container>\n  );\n};\n\nconst Provider = ({ children, ...props }: SkeletonProviderProps) => {\n  return (\n    <SkeletonContext.Provider value={props}>\n      {children}\n    </SkeletonContext.Provider>\n  );\n};\n\nexport const Skeleton = Object.assign(SkeletonBase, { Provider });\n"],"names":[],"mappings":";;;;;;AAsBA;AAMA;AACE;;;;;;;;AAkCM;AACA;;;;;AAYM;AACA;;AAEA;AACgB;AAM9B;AAEA;AACE;AAKF;AAEO;;"}
+{"version":3,"file":"skeleton.js","sources":["../../../components/skeleton/skeleton.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'class-variance-authority';\nimport { CSSProperties, createContext, ReactNode, useContext } from 'react';\nimport styles from './skeleton.module.css';\n\nexport interface SkeletonProps {\n  baseColor?: string;\n  highlightColor?: string;\n  width?: string | number;\n  height?: string | number;\n  borderRadius?: string | number;\n  inline?: boolean;\n  duration?: number;\n  enableAnimation?: boolean;\n  count?: number;\n  style?: CSSProperties;\n  className?: string;\n  containerStyle?: CSSProperties;\n  containerClassName?: string;\n}\n\nconst SkeletonContext = createContext<SkeletonProps | null>(null);\n\ninterface SkeletonProviderProps extends SkeletonProps {\n  children: ReactNode;\n}\n\nconst SkeletonBase = (props: SkeletonProps) => {\n  const contextProps = useContext(SkeletonContext);\n\n  const {\n    baseColor,\n    highlightColor,\n    width,\n    height = 'var(--rs-space-4)',\n    borderRadius = 'var(--rs-radius-2)',\n    inline = false,\n    duration = 1.5,\n    count = 1,\n    enableAnimation = true,\n    style,\n    className,\n    containerStyle,\n    containerClassName\n  } = { ...contextProps, ...props };\n\n  const skeletonClassName = cx(\n    styles.skeleton,\n    inline && styles.inline,\n    enableAnimation && styles.animate,\n    className\n  );\n\n  const Container = inline ? 'span' : 'div';\n  const defaultWidth = inline ? '50px' : '100%';\n\n  return (\n    <Container\n      className={containerClassName}\n      style={{\n        display: inline ? 'inline-block' : 'flex',\n        flexDirection: !inline ? 'column' : undefined,\n        gap: !inline && count > 1 ? 'var(--rs-space-3)' : undefined,\n        ...containerStyle\n      }}\n    >\n      {Array.from({ length: count }).map((_, i) => (\n        <span\n          key={i}\n          className={skeletonClassName}\n          style={\n            {\n              width: width ?? defaultWidth,\n              height,\n              borderRadius,\n              '--skeleton-base-color': baseColor,\n              '--skeleton-highlight-color': highlightColor,\n              '--skeleton-duration': `${duration}s`,\n              ...style\n            } as CSSProperties\n          }\n        />\n      ))}\n    </Container>\n  );\n};\n\nSkeletonBase.displayName = 'Skeleton';\n\nconst Provider = ({ children, ...props }: SkeletonProviderProps) => {\n  return <SkeletonContext value={props}>{children}</SkeletonContext>;\n};\n\nProvider.displayName = 'Skeleton.Provider';\n\nexport const Skeleton = Object.assign(SkeletonBase, { Provider });\n"],"names":[],"mappings":";;;;;;AAsBA;AAMA;AACE;;;;;;;;AAkCM;AACA;;;;;AAYM;AACA;;AAEA;AACgB;AAM9B;AAEA;AAEA;;AAEA;AAEA;AAEO;;"}

package/dist/components/slider/slider.cjs

@@ -19,7 +19,7 @@ const slider = classVarianceAuthority.cva(slider_module.default.slider, {
         variant: 'single'
     }
 });
-const SliderRoot = React.forwardRef(({ className, variant = 'single', label, thumbSize = 'large', ...props }, ref) => {
+function SliderRoot({ className, variant = 'single', label, thumbSize = 'large', ...props }) {
     const isRange = variant === 'range';
     const isThumbSmall = thumbSize === 'small';
     const getLabel = React.useCallback((index) => {
@@ -30,12 +30,13 @@ const SliderRoot = React.forwardRef(({ className, variant = 'single', label, thu
         return label[index];
     }, [label]);
     const thumbCount = isRange ? 2 : 1;
-    return (jsxRuntime.jsx(react.Slider.Root, { ref: ref, className: slider({ variant, className }), thumbAlignment: 'edge', ...props, children: jsxRuntime.jsx(react.Slider.Control, { className: slider_module.default.control, children: jsxRuntime.jsxs(react.Slider.Track, { className: slider_module.default.track, children: [jsxRuntime.jsx(react.Slider.Indicator, { className: slider_module.default.indicator }), Array.from({ length: thumbCount }).map((_, i) => (jsxRuntime.jsxs(react.Slider.Thumb, { index: isRange ? i : undefined, className: classVarianceAuthority.cx(slider_module.default.thumb), "aria-label": getLabel(i) || (isRange ? `Thumb ${i + 1}` : 'Slider thumb'), "data-size": thumbSize, children: [isThumbSmall ? (jsxRuntime.jsx("div", { className: slider_module.default.thumbSmall })) : (jsxRuntime.jsxs("div", { className: slider_module.default.thumbLarge, children: [jsxRuntime.jsx("div", { className: slider_module.default.thumbLargeLine }), jsxRuntime.jsx("div", { className: slider_module.default.thumbLargeLine }), jsxRuntime.jsx("div", { className: slider_module.default.thumbLargeLine })] })), getLabel(i) && (jsxRuntime.jsx(text.Text, { className: slider_module.default.label, size: isThumbSmall ? 'micro' : 'mini', weight: 'medium', children: getLabel(i) }))] }, i)))] }) }) }));
-});
-SliderRoot.displayName = 'SliderRoot';
+    return (jsxRuntime.jsx(react.Slider.Root, { className: slider({ variant, className }), thumbAlignment: 'edge', ...props, children: jsxRuntime.jsx(react.Slider.Control, { className: slider_module.default.control, children: jsxRuntime.jsxs(react.Slider.Track, { className: slider_module.default.track, children: [jsxRuntime.jsx(react.Slider.Indicator, { className: slider_module.default.indicator }), Array.from({ length: thumbCount }).map((_, i) => (jsxRuntime.jsxs(react.Slider.Thumb, { index: isRange ? i : undefined, className: classVarianceAuthority.cx(slider_module.default.thumb), "aria-label": getLabel(i) || (isRange ? `Thumb ${i + 1}` : 'Slider thumb'), "data-size": thumbSize, children: [isThumbSmall ? (jsxRuntime.jsx("div", { className: slider_module.default.thumbSmall })) : (jsxRuntime.jsxs("div", { className: slider_module.default.thumbLarge, children: [jsxRuntime.jsx("div", { className: slider_module.default.thumbLargeLine }), jsxRuntime.jsx("div", { className: slider_module.default.thumbLargeLine }), jsxRuntime.jsx("div", { className: slider_module.default.thumbLargeLine })] })), getLabel(i) && (jsxRuntime.jsx(text.Text, { className: slider_module.default.label, size: isThumbSmall ? 'micro' : 'mini', weight: 'medium', children: getLabel(i) }))] }, i)))] }) }) }));
+}
+SliderRoot.displayName = 'Slider';
 const Slider = Object.assign(SliderRoot, {
     Value: react.Slider.Value
 });
+Slider.Value.displayName = 'Slider.Value';
 
 exports.Slider = Slider;
 //# sourceMappingURL=slider.cjs.map

package/dist/components/slider/slider.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"slider.cjs","sources":["../../../components/slider/slider.tsx"],"sourcesContent":["'use client';\n\nimport { Slider as SliderPrimitive } from '@base-ui/react';\nimport { cva, cx, type VariantProps } from 'class-variance-authority';\nimport { type ElementRef, forwardRef, useCallback } from 'react';\nimport { Text } from '../text';\nimport styles from './slider.module.css';\n\nconst slider = cva(styles.slider, {\n  variants: {\n    variant: {\n      single: styles['slider-variant-single'],\n      range: styles['slider-variant-range']\n    }\n  },\n  defaultVariants: {\n    variant: 'single'\n  }\n});\n\nexport interface SliderProps\n  extends SliderPrimitive.Root.Props,\n    VariantProps<typeof slider> {\n  label?: string | [string, string];\n  thumbSize?: 'small' | 'large';\n}\n\nconst SliderRoot = forwardRef<\n  ElementRef<typeof SliderPrimitive.Root>,\n  SliderProps\n>(\n  (\n    { className, variant = 'single', label, thumbSize = 'large', ...props },\n    ref\n  ) => {\n    const isRange = variant === 'range';\n    const isThumbSmall = thumbSize === 'small';\n\n    const getLabel = useCallback(\n      (index: number) => {\n        if (!label) return undefined;\n        if (typeof label === 'string') return label;\n        return label[index];\n      },\n      [label]\n    );\n\n    const thumbCount = isRange ? 2 : 1;\n\n    return (\n      <SliderPrimitive.Root\n        ref={ref}\n        className={slider({ variant, className })}\n        thumbAlignment='edge'\n        {...props}\n      >\n        <SliderPrimitive.Control className={styles.control}>\n          <SliderPrimitive.Track className={styles.track}>\n            <SliderPrimitive.Indicator className={styles.indicator} />\n            {Array.from({ length: thumbCount }).map((_, i) => (\n              <SliderPrimitive.Thumb\n                key={i}\n                index={isRange ? i : undefined}\n                className={cx(styles.thumb)}\n                aria-label={\n                  getLabel(i) || (isRange ? `Thumb ${i + 1}` : 'Slider thumb')\n                }\n                data-size={thumbSize}\n              >\n                {isThumbSmall ? (\n                  <div className={styles.thumbSmall} />\n                ) : (\n                  <div className={styles.thumbLarge}>\n                    <div className={styles.thumbLargeLine} />\n                    <div className={styles.thumbLargeLine} />\n                    <div className={styles.thumbLargeLine} />\n                  </div>\n                )}\n                {getLabel(i) && (\n                  <Text\n                    className={styles.label}\n                    size={isThumbSmall ? 'micro' : 'mini'}\n                    weight='medium'\n                  >\n                    {getLabel(i)}\n                  </Text>\n                )}\n              </SliderPrimitive.Thumb>\n            ))}\n          </SliderPrimitive.Track>\n        </SliderPrimitive.Control>\n      </SliderPrimitive.Root>\n    );\n  }\n);\n\nSliderRoot.displayName = 'SliderRoot';\n\nexport const Slider = Object.assign(SliderRoot, {\n  Value: SliderPrimitive.Value\n});\n"],"names":[],"mappings":";;;;;;;;;;AAQA;AACE;AACE;AACE;AACA;AACD;AACF;AACD;AACE;AACD;AACF;AASD;AAQI;AACA;AAEA;AAEI;AAAY;;AACmB;AAC/B;AACF;;;AAkDJ;AAGF;;;AAIC;;"}
+{"version":3,"file":"slider.cjs","sources":["../../../components/slider/slider.tsx"],"sourcesContent":["'use client';\n\nimport { Slider as SliderPrimitive } from '@base-ui/react';\nimport { cva, cx, type VariantProps } from 'class-variance-authority';\nimport { useCallback } from 'react';\nimport { Text } from '../text';\nimport styles from './slider.module.css';\n\nconst slider = cva(styles.slider, {\n  variants: {\n    variant: {\n      single: styles['slider-variant-single'],\n      range: styles['slider-variant-range']\n    }\n  },\n  defaultVariants: {\n    variant: 'single'\n  }\n});\n\nexport interface SliderProps\n  extends SliderPrimitive.Root.Props,\n    VariantProps<typeof slider> {\n  label?: string | [string, string];\n  thumbSize?: 'small' | 'large';\n}\n\nfunction SliderRoot({\n  className,\n  variant = 'single',\n  label,\n  thumbSize = 'large',\n  ...props\n}: SliderProps) {\n  const isRange = variant === 'range';\n  const isThumbSmall = thumbSize === 'small';\n\n  const getLabel = useCallback(\n    (index: number) => {\n      if (!label) return undefined;\n      if (typeof label === 'string') return label;\n      return label[index];\n    },\n    [label]\n  );\n\n  const thumbCount = isRange ? 2 : 1;\n\n  return (\n    <SliderPrimitive.Root\n      className={slider({ variant, className })}\n      thumbAlignment='edge'\n      {...props}\n    >\n      <SliderPrimitive.Control className={styles.control}>\n        <SliderPrimitive.Track className={styles.track}>\n          <SliderPrimitive.Indicator className={styles.indicator} />\n          {Array.from({ length: thumbCount }).map((_, i) => (\n            <SliderPrimitive.Thumb\n              key={i}\n              index={isRange ? i : undefined}\n              className={cx(styles.thumb)}\n              aria-label={\n                getLabel(i) || (isRange ? `Thumb ${i + 1}` : 'Slider thumb')\n              }\n              data-size={thumbSize}\n            >\n              {isThumbSmall ? (\n                <div className={styles.thumbSmall} />\n              ) : (\n                <div className={styles.thumbLarge}>\n                  <div className={styles.thumbLargeLine} />\n                  <div className={styles.thumbLargeLine} />\n                  <div className={styles.thumbLargeLine} />\n                </div>\n              )}\n              {getLabel(i) && (\n                <Text\n                  className={styles.label}\n                  size={isThumbSmall ? 'micro' : 'mini'}\n                  weight='medium'\n                >\n                  {getLabel(i)}\n                </Text>\n              )}\n            </SliderPrimitive.Thumb>\n          ))}\n        </SliderPrimitive.Track>\n      </SliderPrimitive.Control>\n    </SliderPrimitive.Root>\n  );\n}\n\nSliderRoot.displayName = 'Slider';\n\nexport const Slider = Object.assign(SliderRoot, {\n  Value: SliderPrimitive.Value\n});\n\nSlider.Value.displayName = 'Slider.Value';\n"],"names":[],"mappings":";;;;;;;;;;AAQA;AACE;AACE;AACE;AACA;AACD;AACF;AACD;AACE;AACD;AACF;AASD;AAOE;AACA;AAEA;AAEI;AAAY;;AACmB;AAC/B;AACF;;;AAiDJ;AAEA;;;AAIC;AAED;;"}

package/dist/components/slider/slider.d.ts

@@ -7,7 +7,11 @@ export interface SliderProps extends SliderPrimitive.Root.Props, VariantProps<ty
     label?: string | [string, string];
     thumbSize?: 'small' | 'large';
 }
-export declare const Slider: import("react").ForwardRefExoticComponent<Omit<SliderProps, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
+declare function SliderRoot({ className, variant, label, thumbSize, ...props }: SliderProps): import("react/jsx-runtime").JSX.Element;
+declare namespace SliderRoot {
+    var displayName: string;
+}
+export declare const Slider: typeof SliderRoot & {
     Value: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").SliderValueProps, "ref"> & import("react").RefAttributes<HTMLOutputElement>>;
 };
 export {};

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

@@ -1 +1 @@
-{"version":3,"file":"slider.d.ts","sourceRoot":"","sources":["../../../components/slider/slider.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAC3D,OAAO,EAAW,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAKtE,QAAA,MAAM,MAAM;;8EAUV,CAAC;AAEH,MAAM,WAAW,WACf,SAAQ,eAAe,CAAC,IAAI,CAAC,KAAK,EAChC,YAAY,CAAC,OAAO,MAAM,CAAC;IAC7B,KAAK,CAAC,EAAE,MAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAClC,SAAS,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC;CAC/B;AAyED,eAAO,MAAM,MAAM;;CAEjB,CAAC"}
+{"version":3,"file":"slider.d.ts","sourceRoot":"","sources":["../../../components/slider/slider.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAC3D,OAAO,EAAW,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAKtE,QAAA,MAAM,MAAM;;8EAUV,CAAC;AAEH,MAAM,WAAW,WACf,SAAQ,eAAe,CAAC,IAAI,CAAC,KAAK,EAChC,YAAY,CAAC,OAAO,MAAM,CAAC;IAC7B,KAAK,CAAC,EAAE,MAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAClC,SAAS,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC;CAC/B;AAED,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,OAAkB,EAClB,KAAK,EACL,SAAmB,EACnB,GAAG,KAAK,EACT,EAAE,WAAW,2CA0Db;kBAhEQ,UAAU;;;AAoEnB,eAAO,MAAM,MAAM;;CAEjB,CAAC"}

package/dist/components/slider/slider.js

@@ -2,7 +2,7 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { Slider as Slider$1 } from '@base-ui/react';
 import { cva, cx } from 'class-variance-authority';
-import { forwardRef, useCallback } from 'react';
+import { useCallback } from 'react';
 import { Text } from '../text/text.js';
 import styles from './slider.module.css.js';
 
@@ -17,7 +17,7 @@ const slider = cva(styles.slider, {
         variant: 'single'
     }
 });
-const SliderRoot = forwardRef(({ className, variant = 'single', label, thumbSize = 'large', ...props }, ref) => {
+function SliderRoot({ className, variant = 'single', label, thumbSize = 'large', ...props }) {
     const isRange = variant === 'range';
     const isThumbSmall = thumbSize === 'small';
     const getLabel = useCallback((index) => {
@@ -28,12 +28,13 @@ const SliderRoot = forwardRef(({ className, variant = 'single', label, thumbSize
         return label[index];
     }, [label]);
     const thumbCount = isRange ? 2 : 1;
-    return (jsx(Slider$1.Root, { ref: ref, className: slider({ variant, className }), thumbAlignment: 'edge', ...props, children: jsx(Slider$1.Control, { className: styles.control, children: jsxs(Slider$1.Track, { className: styles.track, children: [jsx(Slider$1.Indicator, { className: styles.indicator }), Array.from({ length: thumbCount }).map((_, i) => (jsxs(Slider$1.Thumb, { index: isRange ? i : undefined, className: cx(styles.thumb), "aria-label": getLabel(i) || (isRange ? `Thumb ${i + 1}` : 'Slider thumb'), "data-size": thumbSize, children: [isThumbSmall ? (jsx("div", { className: styles.thumbSmall })) : (jsxs("div", { className: styles.thumbLarge, children: [jsx("div", { className: styles.thumbLargeLine }), jsx("div", { className: styles.thumbLargeLine }), jsx("div", { className: styles.thumbLargeLine })] })), getLabel(i) && (jsx(Text, { className: styles.label, size: isThumbSmall ? 'micro' : 'mini', weight: 'medium', children: getLabel(i) }))] }, i)))] }) }) }));
-});
-SliderRoot.displayName = 'SliderRoot';
+    return (jsx(Slider$1.Root, { className: slider({ variant, className }), thumbAlignment: 'edge', ...props, children: jsx(Slider$1.Control, { className: styles.control, children: jsxs(Slider$1.Track, { className: styles.track, children: [jsx(Slider$1.Indicator, { className: styles.indicator }), Array.from({ length: thumbCount }).map((_, i) => (jsxs(Slider$1.Thumb, { index: isRange ? i : undefined, className: cx(styles.thumb), "aria-label": getLabel(i) || (isRange ? `Thumb ${i + 1}` : 'Slider thumb'), "data-size": thumbSize, children: [isThumbSmall ? (jsx("div", { className: styles.thumbSmall })) : (jsxs("div", { className: styles.thumbLarge, children: [jsx("div", { className: styles.thumbLargeLine }), jsx("div", { className: styles.thumbLargeLine }), jsx("div", { className: styles.thumbLargeLine })] })), getLabel(i) && (jsx(Text, { className: styles.label, size: isThumbSmall ? 'micro' : 'mini', weight: 'medium', children: getLabel(i) }))] }, i)))] }) }) }));
+}
+SliderRoot.displayName = 'Slider';
 const Slider = Object.assign(SliderRoot, {
     Value: Slider$1.Value
 });
+Slider.Value.displayName = 'Slider.Value';
 
 export { Slider };
 //# sourceMappingURL=slider.js.map

package/dist/components/slider/slider.js.map

@@ -1 +1 @@
-{"version":3,"file":"slider.js","sources":["../../../components/slider/slider.tsx"],"sourcesContent":["'use client';\n\nimport { Slider as SliderPrimitive } from '@base-ui/react';\nimport { cva, cx, type VariantProps } from 'class-variance-authority';\nimport { type ElementRef, forwardRef, useCallback } from 'react';\nimport { Text } from '../text';\nimport styles from './slider.module.css';\n\nconst slider = cva(styles.slider, {\n  variants: {\n    variant: {\n      single: styles['slider-variant-single'],\n      range: styles['slider-variant-range']\n    }\n  },\n  defaultVariants: {\n    variant: 'single'\n  }\n});\n\nexport interface SliderProps\n  extends SliderPrimitive.Root.Props,\n    VariantProps<typeof slider> {\n  label?: string | [string, string];\n  thumbSize?: 'small' | 'large';\n}\n\nconst SliderRoot = forwardRef<\n  ElementRef<typeof SliderPrimitive.Root>,\n  SliderProps\n>(\n  (\n    { className, variant = 'single', label, thumbSize = 'large', ...props },\n    ref\n  ) => {\n    const isRange = variant === 'range';\n    const isThumbSmall = thumbSize === 'small';\n\n    const getLabel = useCallback(\n      (index: number) => {\n        if (!label) return undefined;\n        if (typeof label === 'string') return label;\n        return label[index];\n      },\n      [label]\n    );\n\n    const thumbCount = isRange ? 2 : 1;\n\n    return (\n      <SliderPrimitive.Root\n        ref={ref}\n        className={slider({ variant, className })}\n        thumbAlignment='edge'\n        {...props}\n      >\n        <SliderPrimitive.Control className={styles.control}>\n          <SliderPrimitive.Track className={styles.track}>\n            <SliderPrimitive.Indicator className={styles.indicator} />\n            {Array.from({ length: thumbCount }).map((_, i) => (\n              <SliderPrimitive.Thumb\n                key={i}\n                index={isRange ? i : undefined}\n                className={cx(styles.thumb)}\n                aria-label={\n                  getLabel(i) || (isRange ? `Thumb ${i + 1}` : 'Slider thumb')\n                }\n                data-size={thumbSize}\n              >\n                {isThumbSmall ? (\n                  <div className={styles.thumbSmall} />\n                ) : (\n                  <div className={styles.thumbLarge}>\n                    <div className={styles.thumbLargeLine} />\n                    <div className={styles.thumbLargeLine} />\n                    <div className={styles.thumbLargeLine} />\n                  </div>\n                )}\n                {getLabel(i) && (\n                  <Text\n                    className={styles.label}\n                    size={isThumbSmall ? 'micro' : 'mini'}\n                    weight='medium'\n                  >\n                    {getLabel(i)}\n                  </Text>\n                )}\n              </SliderPrimitive.Thumb>\n            ))}\n          </SliderPrimitive.Track>\n        </SliderPrimitive.Control>\n      </SliderPrimitive.Root>\n    );\n  }\n);\n\nSliderRoot.displayName = 'SliderRoot';\n\nexport const Slider = Object.assign(SliderRoot, {\n  Value: SliderPrimitive.Value\n});\n"],"names":[],"mappings":";;;;;;;;AAQA;AACE;AACE;AACE;AACA;AACD;AACF;AACD;AACE;AACD;AACF;AASD;AAQI;AACA;AAEA;AAEI;AAAY;;AACmB;AAC/B;AACF;;;AAkDJ;AAGF;;;AAIC;;"}
+{"version":3,"file":"slider.js","sources":["../../../components/slider/slider.tsx"],"sourcesContent":["'use client';\n\nimport { Slider as SliderPrimitive } from '@base-ui/react';\nimport { cva, cx, type VariantProps } from 'class-variance-authority';\nimport { useCallback } from 'react';\nimport { Text } from '../text';\nimport styles from './slider.module.css';\n\nconst slider = cva(styles.slider, {\n  variants: {\n    variant: {\n      single: styles['slider-variant-single'],\n      range: styles['slider-variant-range']\n    }\n  },\n  defaultVariants: {\n    variant: 'single'\n  }\n});\n\nexport interface SliderProps\n  extends SliderPrimitive.Root.Props,\n    VariantProps<typeof slider> {\n  label?: string | [string, string];\n  thumbSize?: 'small' | 'large';\n}\n\nfunction SliderRoot({\n  className,\n  variant = 'single',\n  label,\n  thumbSize = 'large',\n  ...props\n}: SliderProps) {\n  const isRange = variant === 'range';\n  const isThumbSmall = thumbSize === 'small';\n\n  const getLabel = useCallback(\n    (index: number) => {\n      if (!label) return undefined;\n      if (typeof label === 'string') return label;\n      return label[index];\n    },\n    [label]\n  );\n\n  const thumbCount = isRange ? 2 : 1;\n\n  return (\n    <SliderPrimitive.Root\n      className={slider({ variant, className })}\n      thumbAlignment='edge'\n      {...props}\n    >\n      <SliderPrimitive.Control className={styles.control}>\n        <SliderPrimitive.Track className={styles.track}>\n          <SliderPrimitive.Indicator className={styles.indicator} />\n          {Array.from({ length: thumbCount }).map((_, i) => (\n            <SliderPrimitive.Thumb\n              key={i}\n              index={isRange ? i : undefined}\n              className={cx(styles.thumb)}\n              aria-label={\n                getLabel(i) || (isRange ? `Thumb ${i + 1}` : 'Slider thumb')\n              }\n              data-size={thumbSize}\n            >\n              {isThumbSmall ? (\n                <div className={styles.thumbSmall} />\n              ) : (\n                <div className={styles.thumbLarge}>\n                  <div className={styles.thumbLargeLine} />\n                  <div className={styles.thumbLargeLine} />\n                  <div className={styles.thumbLargeLine} />\n                </div>\n              )}\n              {getLabel(i) && (\n                <Text\n                  className={styles.label}\n                  size={isThumbSmall ? 'micro' : 'mini'}\n                  weight='medium'\n                >\n                  {getLabel(i)}\n                </Text>\n              )}\n            </SliderPrimitive.Thumb>\n          ))}\n        </SliderPrimitive.Track>\n      </SliderPrimitive.Control>\n    </SliderPrimitive.Root>\n  );\n}\n\nSliderRoot.displayName = 'Slider';\n\nexport const Slider = Object.assign(SliderRoot, {\n  Value: SliderPrimitive.Value\n});\n\nSlider.Value.displayName = 'Slider.Value';\n"],"names":[],"mappings":";;;;;;;;AAQA;AACE;AACE;AACE;AACA;AACD;AACF;AACD;AACE;AACD;AACF;AASD;AAOE;AACA;AAEA;AAEI;AAAY;;AACmB;AAC/B;AACF;;;AAiDJ;AAEA;;;AAIC;AAED;;"}

package/dist/components/spinner/spinner.cjs

@@ -2,34 +2,35 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var classVarianceAuthority = require('class-variance-authority');
-var React = require('react');
 var spinner_module = require('./spinner.module.css.cjs');
 
 const spinner = classVarianceAuthority.cva(spinner_module.default.spinner, {
     variants: {
         size: {
-            1: spinner_module.default["spinner-size-1"],
-            2: spinner_module.default["spinner-size-2"],
-            3: spinner_module.default["spinner-size-3"],
-            4: spinner_module.default["spinner-size-4"],
-            5: spinner_module.default["spinner-size-5"],
-            6: spinner_module.default["spinner-size-6"],
+            1: spinner_module.default['spinner-size-1'],
+            2: spinner_module.default['spinner-size-2'],
+            3: spinner_module.default['spinner-size-3'],
+            4: spinner_module.default['spinner-size-4'],
+            5: spinner_module.default['spinner-size-5'],
+            6: spinner_module.default['spinner-size-6']
         },
         color: {
-            default: spinner_module.default["spinner-color-default"],
-            neutral: spinner_module.default["spinner-color-neutral"],
-            accent: spinner_module.default["spinner-color-accent"],
-            danger: spinner_module.default["spinner-color-danger"],
-            success: spinner_module.default["spinner-color-success"],
-            attention: spinner_module.default["spinner-color-attention"],
+            default: spinner_module.default['spinner-color-default'],
+            neutral: spinner_module.default['spinner-color-neutral'],
+            accent: spinner_module.default['spinner-color-accent'],
+            danger: spinner_module.default['spinner-color-danger'],
+            success: spinner_module.default['spinner-color-success'],
+            attention: spinner_module.default['spinner-color-attention']
         }
     },
     defaultVariants: {
         size: 1,
-        color: "neutral",
-    },
+        color: 'neutral'
+    }
 });
-const Spinner = React.forwardRef(({ className, size, color, ...props }, ref) => (jsxRuntime.jsx("div", { ref: ref, className: spinner({ size, color, className }), role: "status", "aria-hidden": "true", ...props, children: [...Array(8)].map((_, index) => (jsxRuntime.jsx("div", { className: spinner_module.default.pole }, index))) })));
+function Spinner({ className, size, color, ...props }) {
+    return (jsxRuntime.jsx("div", { className: spinner({ size, color, className }), role: 'status', "aria-hidden": 'true', ...props, children: [...Array(8)].map((_, index) => (jsxRuntime.jsx("div", { className: spinner_module.default.pole }, index))) }));
+}
 Spinner.displayName = 'Spinner';
 
 exports.Spinner = Spinner;

package/dist/components/spinner/spinner.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"spinner.cjs","sources":["../../../components/spinner/spinner.tsx"],"sourcesContent":["import { cva, VariantProps } from \"class-variance-authority\";\nimport { ComponentPropsWithoutRef, ElementRef, forwardRef } from \"react\";\n\nimport styles from './spinner.module.css';\n\nconst spinner = cva(styles.spinner, {\n  variants: {\n    size: {\n      1: styles[\"spinner-size-1\"],\n      2: styles[\"spinner-size-2\"],\n      3: styles[\"spinner-size-3\"],\n      4: styles[\"spinner-size-4\"],\n      5: styles[\"spinner-size-5\"],\n      6: styles[\"spinner-size-6\"],\n    },\n    color: {\n      default: styles[\"spinner-color-default\"],\n      neutral: styles[\"spinner-color-neutral\"],\n      accent: styles[\"spinner-color-accent\"],\n      danger: styles[\"spinner-color-danger\"],\n      success: styles[\"spinner-color-success\"],\n      attention: styles[\"spinner-color-attention\"],\n    }\n  },\n  defaultVariants: {\n    size: 1,\n    color: \"neutral\",\n  },\n});\n\nexport interface SpinnerProps\n  extends ComponentPropsWithoutRef<\"div\">,\n    VariantProps<typeof spinner> {\n  size?: 1 | 2 | 3 | 4 | 5 | 6;\n  color?: \"default\" | \"neutral\" | \"accent\" | \"danger\" | \"success\" | \"attention\";\n}\n\nexport const Spinner = forwardRef<ElementRef<\"div\">, SpinnerProps>(\n  ({ className, size, color, ...props }, ref) => (\n    <div\n      ref={ref}\n      className={spinner({ size, color, className })}\n      role=\"status\"\n      aria-hidden=\"true\"\n      {...props}\n    >\n      {[...Array(8)].map((_, index) => (\n        <div key={index} className={styles.pole} />\n      ))}\n    </div>\n  )\n);\n\nSpinner.displayName = 'Spinner';\n"],"names":["cva","styles","forwardRef","_jsx"],"mappings":";;;;;;;AAKA,MAAM,OAAO,GAAGA,0BAAG,CAACC,sBAAM,CAAC,OAAO,EAAE;AAClC,IAAA,QAAQ,EAAE;AACR,QAAA,IAAI,EAAE;AACJ,YAAA,CAAC,EAAEA,sBAAM,CAAC,gBAAgB,CAAC;AAC3B,YAAA,CAAC,EAAEA,sBAAM,CAAC,gBAAgB,CAAC;AAC3B,YAAA,CAAC,EAAEA,sBAAM,CAAC,gBAAgB,CAAC;AAC3B,YAAA,CAAC,EAAEA,sBAAM,CAAC,gBAAgB,CAAC;AAC3B,YAAA,CAAC,EAAEA,sBAAM,CAAC,gBAAgB,CAAC;AAC3B,YAAA,CAAC,EAAEA,sBAAM,CAAC,gBAAgB,CAAC;AAC5B,SAAA;AACD,QAAA,KAAK,EAAE;AACL,YAAA,OAAO,EAAEA,sBAAM,CAAC,uBAAuB,CAAC;AACxC,YAAA,OAAO,EAAEA,sBAAM,CAAC,uBAAuB,CAAC;AACxC,YAAA,MAAM,EAAEA,sBAAM,CAAC,sBAAsB,CAAC;AACtC,YAAA,MAAM,EAAEA,sBAAM,CAAC,sBAAsB,CAAC;AACtC,YAAA,OAAO,EAAEA,sBAAM,CAAC,uBAAuB,CAAC;AACxC,YAAA,SAAS,EAAEA,sBAAM,CAAC,yBAAyB,CAAC;AAC7C,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,IAAI,EAAE,CAAC;AACP,QAAA,KAAK,EAAE,SAAS;AACjB,KAAA;AACF,CAAA,CAAC,CAAC;AASU,MAAA,OAAO,GAAGC,gBAAU,CAC/B,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,MACxCC,cAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,OAAO,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,EAC9C,IAAI,EAAC,QAAQ,EAAA,aAAA,EACD,MAAM,EAAA,GACd,KAAK,EAER,QAAA,EAAA,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,MAC1BA,cAAiB,CAAA,KAAA,EAAA,EAAA,SAAS,EAAEF,sBAAM,CAAC,IAAI,EAAA,EAA7B,KAAK,CAA4B,CAC5C,CAAC,EACE,CAAA,CACP,EACD;AAEF,OAAO,CAAC,WAAW,GAAG,SAAS;;;;"}
+{"version":3,"file":"spinner.cjs","sources":["../../../components/spinner/spinner.tsx"],"sourcesContent":["import { cva, VariantProps } from 'class-variance-authority';\nimport { ComponentProps } from 'react';\n\nimport styles from './spinner.module.css';\n\nconst spinner = cva(styles.spinner, {\n  variants: {\n    size: {\n      1: styles['spinner-size-1'],\n      2: styles['spinner-size-2'],\n      3: styles['spinner-size-3'],\n      4: styles['spinner-size-4'],\n      5: styles['spinner-size-5'],\n      6: styles['spinner-size-6']\n    },\n    color: {\n      default: styles['spinner-color-default'],\n      neutral: styles['spinner-color-neutral'],\n      accent: styles['spinner-color-accent'],\n      danger: styles['spinner-color-danger'],\n      success: styles['spinner-color-success'],\n      attention: styles['spinner-color-attention']\n    }\n  },\n  defaultVariants: {\n    size: 1,\n    color: 'neutral'\n  }\n});\n\nexport interface SpinnerProps\n  extends ComponentProps<'div'>,\n    VariantProps<typeof spinner> {\n  size?: 1 | 2 | 3 | 4 | 5 | 6;\n  color?: 'default' | 'neutral' | 'accent' | 'danger' | 'success' | 'attention';\n}\n\nexport function Spinner({ className, size, color, ...props }: SpinnerProps) {\n  return (\n    <div\n      className={spinner({ size, color, className })}\n      role='status'\n      aria-hidden='true'\n      {...props}\n    >\n      {[...Array(8)].map((_, index) => (\n        <div key={index} className={styles.pole} />\n      ))}\n    </div>\n  );\n}\n\nSpinner.displayName = 'Spinner';\n"],"names":["cva","styles","_jsx"],"mappings":";;;;;;AAKA,MAAM,OAAO,GAAGA,0BAAG,CAACC,sBAAM,CAAC,OAAO,EAAE;AAClC,IAAA,QAAQ,EAAE;AACR,QAAA,IAAI,EAAE;AACJ,YAAA,CAAC,EAAEA,sBAAM,CAAC,gBAAgB,CAAC;AAC3B,YAAA,CAAC,EAAEA,sBAAM,CAAC,gBAAgB,CAAC;AAC3B,YAAA,CAAC,EAAEA,sBAAM,CAAC,gBAAgB,CAAC;AAC3B,YAAA,CAAC,EAAEA,sBAAM,CAAC,gBAAgB,CAAC;AAC3B,YAAA,CAAC,EAAEA,sBAAM,CAAC,gBAAgB,CAAC;AAC3B,YAAA,CAAC,EAAEA,sBAAM,CAAC,gBAAgB,CAAC;AAC5B,SAAA;AACD,QAAA,KAAK,EAAE;AACL,YAAA,OAAO,EAAEA,sBAAM,CAAC,uBAAuB,CAAC;AACxC,YAAA,OAAO,EAAEA,sBAAM,CAAC,uBAAuB,CAAC;AACxC,YAAA,MAAM,EAAEA,sBAAM,CAAC,sBAAsB,CAAC;AACtC,YAAA,MAAM,EAAEA,sBAAM,CAAC,sBAAsB,CAAC;AACtC,YAAA,OAAO,EAAEA,sBAAM,CAAC,uBAAuB,CAAC;AACxC,YAAA,SAAS,EAAEA,sBAAM,CAAC,yBAAyB,CAAC;AAC7C,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,IAAI,EAAE,CAAC;AACP,QAAA,KAAK,EAAE,SAAS;AACjB,KAAA;AACF,CAAA,CAAC,CAAC;AASa,SAAA,OAAO,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,KAAK,EAAgB,EAAA;IACxE,QACEC,cACE,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,OAAO,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,EAC9C,IAAI,EAAC,QAAQ,EAAA,aAAA,EACD,MAAM,EAAA,GACd,KAAK,EAAA,QAAA,EAER,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,MAC1BA,wBAAiB,SAAS,EAAED,sBAAM,CAAC,IAAI,EAAA,EAA7B,KAAK,CAA4B,CAC5C,CAAC,EACE,CAAA,EACN;AACJ,CAAC;AAED,OAAO,CAAC,WAAW,GAAG,SAAS;;;;"}

package/dist/components/spinner/spinner.d.ts

@@ -1,13 +1,16 @@
-import { VariantProps } from "class-variance-authority";
-import { ComponentPropsWithoutRef } from "react";
+import { VariantProps } from 'class-variance-authority';
+import { ComponentProps } from 'react';
 declare const spinner: (props?: ({
     size?: 1 | 2 | 3 | 4 | 5 | 6 | null | undefined;
-    color?: "accent" | "attention" | "danger" | "success" | "neutral" | "default" | null | undefined;
+    color?: "default" | "accent" | "attention" | "danger" | "success" | "neutral" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
-export interface SpinnerProps extends ComponentPropsWithoutRef<"div">, VariantProps<typeof spinner> {
+export interface SpinnerProps extends ComponentProps<'div'>, VariantProps<typeof spinner> {
     size?: 1 | 2 | 3 | 4 | 5 | 6;
-    color?: "default" | "neutral" | "accent" | "danger" | "success" | "attention";
+    color?: 'default' | 'neutral' | 'accent' | 'danger' | 'success' | 'attention';
+}
+export declare function Spinner({ className, size, color, ...props }: SpinnerProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace Spinner {
+    var displayName: string;
 }
-export declare const Spinner: import("react").ForwardRefExoticComponent<SpinnerProps & import("react").RefAttributes<HTMLDivElement>>;
 export {};
 //# sourceMappingURL=spinner.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"spinner.d.ts","sourceRoot":"","sources":["../../../components/spinner/spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAC7D,OAAO,EAAE,wBAAwB,EAA0B,MAAM,OAAO,CAAC;AAIzE,QAAA,MAAM,OAAO;;;8EAuBX,CAAC;AAEH,MAAM,WAAW,YACf,SAAQ,wBAAwB,CAAC,KAAK,CAAC,EACrC,YAAY,CAAC,OAAO,OAAO,CAAC;IAC9B,IAAI,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAC7B,KAAK,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,QAAQ,GAAG,SAAS,GAAG,WAAW,CAAC;CAC/E;AAED,eAAO,MAAM,OAAO,yGAcnB,CAAC"}
+{"version":3,"file":"spinner.d.ts","sourceRoot":"","sources":["../../../components/spinner/spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAC7D,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAIvC,QAAA,MAAM,OAAO;;;8EAuBX,CAAC;AAEH,MAAM,WAAW,YACf,SAAQ,cAAc,CAAC,KAAK,CAAC,EAC3B,YAAY,CAAC,OAAO,OAAO,CAAC;IAC9B,IAAI,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAC7B,KAAK,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,QAAQ,GAAG,SAAS,GAAG,WAAW,CAAC;CAC/E;AAED,wBAAgB,OAAO,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,2CAazE;yBAbe,OAAO"}

package/dist/components/spinner/spinner.js

@@ -1,33 +1,34 @@
 import { jsx } from 'react/jsx-runtime';
 import { cva } from 'class-variance-authority';
-import { forwardRef } from 'react';
 import styles from './spinner.module.css.js';
 
 const spinner = cva(styles.spinner, {
     variants: {
         size: {
-            1: styles["spinner-size-1"],
-            2: styles["spinner-size-2"],
-            3: styles["spinner-size-3"],
-            4: styles["spinner-size-4"],
-            5: styles["spinner-size-5"],
-            6: styles["spinner-size-6"],
+            1: styles['spinner-size-1'],
+            2: styles['spinner-size-2'],
+            3: styles['spinner-size-3'],
+            4: styles['spinner-size-4'],
+            5: styles['spinner-size-5'],
+            6: styles['spinner-size-6']
         },
         color: {
-            default: styles["spinner-color-default"],
-            neutral: styles["spinner-color-neutral"],
-            accent: styles["spinner-color-accent"],
-            danger: styles["spinner-color-danger"],
-            success: styles["spinner-color-success"],
-            attention: styles["spinner-color-attention"],
+            default: styles['spinner-color-default'],
+            neutral: styles['spinner-color-neutral'],
+            accent: styles['spinner-color-accent'],
+            danger: styles['spinner-color-danger'],
+            success: styles['spinner-color-success'],
+            attention: styles['spinner-color-attention']
         }
     },
     defaultVariants: {
         size: 1,
-        color: "neutral",
-    },
+        color: 'neutral'
+    }
 });
-const Spinner = forwardRef(({ className, size, color, ...props }, ref) => (jsx("div", { ref: ref, className: spinner({ size, color, className }), role: "status", "aria-hidden": "true", ...props, children: [...Array(8)].map((_, index) => (jsx("div", { className: styles.pole }, index))) })));
+function Spinner({ className, size, color, ...props }) {
+    return (jsx("div", { className: spinner({ size, color, className }), role: 'status', "aria-hidden": 'true', ...props, children: [...Array(8)].map((_, index) => (jsx("div", { className: styles.pole }, index))) }));
+}
 Spinner.displayName = 'Spinner';
 
 export { Spinner };

package/dist/components/spinner/spinner.js.map

@@ -1 +1 @@
-{"version":3,"file":"spinner.js","sources":["../../../components/spinner/spinner.tsx"],"sourcesContent":["import { cva, VariantProps } from \"class-variance-authority\";\nimport { ComponentPropsWithoutRef, ElementRef, forwardRef } from \"react\";\n\nimport styles from './spinner.module.css';\n\nconst spinner = cva(styles.spinner, {\n  variants: {\n    size: {\n      1: styles[\"spinner-size-1\"],\n      2: styles[\"spinner-size-2\"],\n      3: styles[\"spinner-size-3\"],\n      4: styles[\"spinner-size-4\"],\n      5: styles[\"spinner-size-5\"],\n      6: styles[\"spinner-size-6\"],\n    },\n    color: {\n      default: styles[\"spinner-color-default\"],\n      neutral: styles[\"spinner-color-neutral\"],\n      accent: styles[\"spinner-color-accent\"],\n      danger: styles[\"spinner-color-danger\"],\n      success: styles[\"spinner-color-success\"],\n      attention: styles[\"spinner-color-attention\"],\n    }\n  },\n  defaultVariants: {\n    size: 1,\n    color: \"neutral\",\n  },\n});\n\nexport interface SpinnerProps\n  extends ComponentPropsWithoutRef<\"div\">,\n    VariantProps<typeof spinner> {\n  size?: 1 | 2 | 3 | 4 | 5 | 6;\n  color?: \"default\" | \"neutral\" | \"accent\" | \"danger\" | \"success\" | \"attention\";\n}\n\nexport const Spinner = forwardRef<ElementRef<\"div\">, SpinnerProps>(\n  ({ className, size, color, ...props }, ref) => (\n    <div\n      ref={ref}\n      className={spinner({ size, color, className })}\n      role=\"status\"\n      aria-hidden=\"true\"\n      {...props}\n    >\n      {[...Array(8)].map((_, index) => (\n        <div key={index} className={styles.pole} />\n      ))}\n    </div>\n  )\n);\n\nSpinner.displayName = 'Spinner';\n"],"names":["_jsx"],"mappings":";;;;;AAKA,MAAM,OAAO,GAAG,GAAG,CAAC,MAAM,CAAC,OAAO,EAAE;AAClC,IAAA,QAAQ,EAAE;AACR,QAAA,IAAI,EAAE;AACJ,YAAA,CAAC,EAAE,MAAM,CAAC,gBAAgB,CAAC;AAC3B,YAAA,CAAC,EAAE,MAAM,CAAC,gBAAgB,CAAC;AAC3B,YAAA,CAAC,EAAE,MAAM,CAAC,gBAAgB,CAAC;AAC3B,YAAA,CAAC,EAAE,MAAM,CAAC,gBAAgB,CAAC;AAC3B,YAAA,CAAC,EAAE,MAAM,CAAC,gBAAgB,CAAC;AAC3B,YAAA,CAAC,EAAE,MAAM,CAAC,gBAAgB,CAAC;AAC5B,SAAA;AACD,QAAA,KAAK,EAAE;AACL,YAAA,OAAO,EAAE,MAAM,CAAC,uBAAuB,CAAC;AACxC,YAAA,OAAO,EAAE,MAAM,CAAC,uBAAuB,CAAC;AACxC,YAAA,MAAM,EAAE,MAAM,CAAC,sBAAsB,CAAC;AACtC,YAAA,MAAM,EAAE,MAAM,CAAC,sBAAsB,CAAC;AACtC,YAAA,OAAO,EAAE,MAAM,CAAC,uBAAuB,CAAC;AACxC,YAAA,SAAS,EAAE,MAAM,CAAC,yBAAyB,CAAC;AAC7C,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,IAAI,EAAE,CAAC;AACP,QAAA,KAAK,EAAE,SAAS;AACjB,KAAA;AACF,CAAA,CAAC,CAAC;AASU,MAAA,OAAO,GAAG,UAAU,CAC/B,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,MACxCA,GAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,OAAO,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,EAC9C,IAAI,EAAC,QAAQ,EAAA,aAAA,EACD,MAAM,EAAA,GACd,KAAK,EAER,QAAA,EAAA,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,MAC1BA,GAAiB,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,IAAI,EAAA,EAA7B,KAAK,CAA4B,CAC5C,CAAC,EACE,CAAA,CACP,EACD;AAEF,OAAO,CAAC,WAAW,GAAG,SAAS;;;;"}
+{"version":3,"file":"spinner.js","sources":["../../../components/spinner/spinner.tsx"],"sourcesContent":["import { cva, VariantProps } from 'class-variance-authority';\nimport { ComponentProps } from 'react';\n\nimport styles from './spinner.module.css';\n\nconst spinner = cva(styles.spinner, {\n  variants: {\n    size: {\n      1: styles['spinner-size-1'],\n      2: styles['spinner-size-2'],\n      3: styles['spinner-size-3'],\n      4: styles['spinner-size-4'],\n      5: styles['spinner-size-5'],\n      6: styles['spinner-size-6']\n    },\n    color: {\n      default: styles['spinner-color-default'],\n      neutral: styles['spinner-color-neutral'],\n      accent: styles['spinner-color-accent'],\n      danger: styles['spinner-color-danger'],\n      success: styles['spinner-color-success'],\n      attention: styles['spinner-color-attention']\n    }\n  },\n  defaultVariants: {\n    size: 1,\n    color: 'neutral'\n  }\n});\n\nexport interface SpinnerProps\n  extends ComponentProps<'div'>,\n    VariantProps<typeof spinner> {\n  size?: 1 | 2 | 3 | 4 | 5 | 6;\n  color?: 'default' | 'neutral' | 'accent' | 'danger' | 'success' | 'attention';\n}\n\nexport function Spinner({ className, size, color, ...props }: SpinnerProps) {\n  return (\n    <div\n      className={spinner({ size, color, className })}\n      role='status'\n      aria-hidden='true'\n      {...props}\n    >\n      {[...Array(8)].map((_, index) => (\n        <div key={index} className={styles.pole} />\n      ))}\n    </div>\n  );\n}\n\nSpinner.displayName = 'Spinner';\n"],"names":["_jsx"],"mappings":";;;;AAKA,MAAM,OAAO,GAAG,GAAG,CAAC,MAAM,CAAC,OAAO,EAAE;AAClC,IAAA,QAAQ,EAAE;AACR,QAAA,IAAI,EAAE;AACJ,YAAA,CAAC,EAAE,MAAM,CAAC,gBAAgB,CAAC;AAC3B,YAAA,CAAC,EAAE,MAAM,CAAC,gBAAgB,CAAC;AAC3B,YAAA,CAAC,EAAE,MAAM,CAAC,gBAAgB,CAAC;AAC3B,YAAA,CAAC,EAAE,MAAM,CAAC,gBAAgB,CAAC;AAC3B,YAAA,CAAC,EAAE,MAAM,CAAC,gBAAgB,CAAC;AAC3B,YAAA,CAAC,EAAE,MAAM,CAAC,gBAAgB,CAAC;AAC5B,SAAA;AACD,QAAA,KAAK,EAAE;AACL,YAAA,OAAO,EAAE,MAAM,CAAC,uBAAuB,CAAC;AACxC,YAAA,OAAO,EAAE,MAAM,CAAC,uBAAuB,CAAC;AACxC,YAAA,MAAM,EAAE,MAAM,CAAC,sBAAsB,CAAC;AACtC,YAAA,MAAM,EAAE,MAAM,CAAC,sBAAsB,CAAC;AACtC,YAAA,OAAO,EAAE,MAAM,CAAC,uBAAuB,CAAC;AACxC,YAAA,SAAS,EAAE,MAAM,CAAC,yBAAyB,CAAC;AAC7C,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,IAAI,EAAE,CAAC;AACP,QAAA,KAAK,EAAE,SAAS;AACjB,KAAA;AACF,CAAA,CAAC,CAAC;AASa,SAAA,OAAO,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,KAAK,EAAgB,EAAA;IACxE,QACEA,GACE,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,OAAO,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,EAC9C,IAAI,EAAC,QAAQ,EAAA,aAAA,EACD,MAAM,EAAA,GACd,KAAK,EAAA,QAAA,EAER,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,MAC1BA,aAAiB,SAAS,EAAE,MAAM,CAAC,IAAI,EAAA,EAA7B,KAAK,CAA4B,CAC5C,CAAC,EACE,CAAA,EACN;AACJ,CAAC;AAED,OAAO,CAAC,WAAW,GAAG,SAAS;;;;"}

package/dist/components/switch/switch.cjs

@@ -3,7 +3,6 @@
 var jsxRuntime = require('react/jsx-runtime');
 var _switch = require('@base-ui/react/switch');
 var classVarianceAuthority = require('class-variance-authority');
-var React = require('react');
 var switch_module = require('./switch.module.css.cjs');
 
 const switchVariants = classVarianceAuthority.cva(switch_module.default.switch, {
@@ -17,7 +16,9 @@ const switchVariants = classVarianceAuthority.cva(switch_module.default.switch,
         size: 'large'
     }
 });
-const Switch = React.forwardRef(({ className, size, ...props }, forwardedRef) => (jsxRuntime.jsx(_switch.Switch.Root, { ...props, ref: forwardedRef, className: switchVariants({ size, className }), children: jsxRuntime.jsx(_switch.Switch.Thumb, { className: switch_module.default.thumb }) })));
+function Switch({ className, size, ...props }) {
+    return (jsxRuntime.jsx(_switch.Switch.Root, { ...props, className: switchVariants({ size, className }), children: jsxRuntime.jsx(_switch.Switch.Thumb, { className: switch_module.default.thumb }) }));
+}
 Switch.displayName = 'Switch';
 
 exports.Switch = Switch;

package/dist/components/switch/switch.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"switch.cjs","sources":["../../../components/switch/switch.tsx"],"sourcesContent":["import { Switch as SwitchPrimitive } from '@base-ui/react/switch';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { forwardRef } from 'react';\n\nimport styles from './switch.module.css';\n\nconst switchVariants = cva(styles.switch, {\n  variants: {\n    size: {\n      large: styles.large,\n      small: styles.small\n    }\n  },\n  defaultVariants: {\n    size: 'large'\n  }\n});\n\nexport interface SwitchProps\n  extends SwitchPrimitive.Root.Props,\n    VariantProps<typeof switchVariants> {}\n\nexport const Switch = forwardRef<HTMLButtonElement, SwitchProps>(\n  ({ className, size, ...props }, forwardedRef) => (\n    <SwitchPrimitive.Root\n      {...props}\n      ref={forwardedRef}\n      className={switchVariants({ size, className })}\n    >\n      <SwitchPrimitive.Thumb className={styles.thumb} />\n    </SwitchPrimitive.Root>\n  )\n);\n\nSwitch.displayName = 'Switch';\n"],"names":["cva","styles","forwardRef","_jsx","SwitchPrimitive"],"mappings":";;;;;;;;AAMA,MAAM,cAAc,GAAGA,0BAAG,CAACC,qBAAM,CAAC,MAAM,EAAE;AACxC,IAAA,QAAQ,EAAE;AACR,QAAA,IAAI,EAAE;YACJ,KAAK,EAAEA,qBAAM,CAAC,KAAK;YACnB,KAAK,EAAEA,qBAAM,CAAC,KAAK;AACpB,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,IAAI,EAAE,OAAO;AACd,KAAA;AACF,CAAA,CAAC,CAAC;AAMU,MAAA,MAAM,GAAGC,gBAAU,CAC9B,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,MAC1CC,cAAA,CAACC,cAAe,CAAC,IAAI,EAAA,EAAA,GACf,KAAK,EACT,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,cAAc,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,EAAA,QAAA,EAE9CD,cAAC,CAAAC,cAAe,CAAC,KAAK,EAAC,EAAA,SAAS,EAAEH,qBAAM,CAAC,KAAK,EAAI,CAAA,EAAA,CAC7B,CACxB,EACD;AAEF,MAAM,CAAC,WAAW,GAAG,QAAQ;;;;"}
+{"version":3,"file":"switch.cjs","sources":["../../../components/switch/switch.tsx"],"sourcesContent":["import { Switch as SwitchPrimitive } from '@base-ui/react/switch';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport styles from './switch.module.css';\n\nconst switchVariants = cva(styles.switch, {\n  variants: {\n    size: {\n      large: styles.large,\n      small: styles.small\n    }\n  },\n  defaultVariants: {\n    size: 'large'\n  }\n});\n\nexport interface SwitchProps\n  extends SwitchPrimitive.Root.Props,\n    VariantProps<typeof switchVariants> {}\n\nexport function Switch({ className, size, ...props }: SwitchProps) {\n  return (\n    <SwitchPrimitive.Root\n      {...props}\n      className={switchVariants({ size, className })}\n    >\n      <SwitchPrimitive.Thumb className={styles.thumb} />\n    </SwitchPrimitive.Root>\n  );\n}\n\nSwitch.displayName = 'Switch';\n"],"names":["cva","styles","_jsx","SwitchPrimitive"],"mappings":";;;;;;;AAKA,MAAM,cAAc,GAAGA,0BAAG,CAACC,qBAAM,CAAC,MAAM,EAAE;AACxC,IAAA,QAAQ,EAAE;AACR,QAAA,IAAI,EAAE;YACJ,KAAK,EAAEA,qBAAM,CAAC,KAAK;YACnB,KAAK,EAAEA,qBAAM,CAAC,KAAK;AACpB,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,IAAI,EAAE,OAAO;AACd,KAAA;AACF,CAAA,CAAC,CAAC;AAMG,SAAU,MAAM,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,KAAK,EAAe,EAAA;AAC/D,IAAA,QACEC,cAAA,CAACC,cAAe,CAAC,IAAI,EACf,EAAA,GAAA,KAAK,EACT,SAAS,EAAE,cAAc,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,EAE9C,QAAA,EAAAD,cAAA,CAACC,cAAe,CAAC,KAAK,EAAC,EAAA,SAAS,EAAEF,qBAAM,CAAC,KAAK,EAAI,CAAA,EAAA,CAC7B,EACvB;AACJ,CAAC;AAED,MAAM,CAAC,WAAW,GAAG,QAAQ;;;;"}

package/dist/components/switch/switch.d.ts

@@ -5,6 +5,9 @@ declare const switchVariants: (props?: ({
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export interface SwitchProps extends SwitchPrimitive.Root.Props, VariantProps<typeof switchVariants> {
 }
-export declare const Switch: import("react").ForwardRefExoticComponent<Omit<SwitchProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+export declare function Switch({ className, size, ...props }: SwitchProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace Switch {
+    var displayName: string;
+}
 export {};
 //# sourceMappingURL=switch.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../../components/switch/switch.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAClE,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAKlE,QAAA,MAAM,cAAc;;8EAUlB,CAAC;AAEH,MAAM,WAAW,WACf,SAAQ,eAAe,CAAC,IAAI,CAAC,KAAK,EAChC,YAAY,CAAC,OAAO,cAAc,CAAC;CAAG;AAE1C,eAAO,MAAM,MAAM,wHAUlB,CAAC"}
+{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../../components/switch/switch.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAClE,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAIlE,QAAA,MAAM,cAAc;;8EAUlB,CAAC;AAEH,MAAM,WAAW,WACf,SAAQ,eAAe,CAAC,IAAI,CAAC,KAAK,EAChC,YAAY,CAAC,OAAO,cAAc,CAAC;CAAG;AAE1C,wBAAgB,MAAM,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,WAAW,2CAShE;yBATe,MAAM"}

package/dist/components/switch/switch.js

@@ -1,7 +1,6 @@
 import { jsx } from 'react/jsx-runtime';
 import { Switch as Switch$1 } from '@base-ui/react/switch';
 import { cva } from 'class-variance-authority';
-import { forwardRef } from 'react';
 import styles from './switch.module.css.js';
 
 const switchVariants = cva(styles.switch, {
@@ -15,7 +14,9 @@ const switchVariants = cva(styles.switch, {
         size: 'large'
     }
 });
-const Switch = forwardRef(({ className, size, ...props }, forwardedRef) => (jsx(Switch$1.Root, { ...props, ref: forwardedRef, className: switchVariants({ size, className }), children: jsx(Switch$1.Thumb, { className: styles.thumb }) })));
+function Switch({ className, size, ...props }) {
+    return (jsx(Switch$1.Root, { ...props, className: switchVariants({ size, className }), children: jsx(Switch$1.Thumb, { className: styles.thumb }) }));
+}
 Switch.displayName = 'Switch';
 
 export { Switch };

package/dist/components/switch/switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"switch.js","sources":["../../../components/switch/switch.tsx"],"sourcesContent":["import { Switch as SwitchPrimitive } from '@base-ui/react/switch';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { forwardRef } from 'react';\n\nimport styles from './switch.module.css';\n\nconst switchVariants = cva(styles.switch, {\n  variants: {\n    size: {\n      large: styles.large,\n      small: styles.small\n    }\n  },\n  defaultVariants: {\n    size: 'large'\n  }\n});\n\nexport interface SwitchProps\n  extends SwitchPrimitive.Root.Props,\n    VariantProps<typeof switchVariants> {}\n\nexport const Switch = forwardRef<HTMLButtonElement, SwitchProps>(\n  ({ className, size, ...props }, forwardedRef) => (\n    <SwitchPrimitive.Root\n      {...props}\n      ref={forwardedRef}\n      className={switchVariants({ size, className })}\n    >\n      <SwitchPrimitive.Thumb className={styles.thumb} />\n    </SwitchPrimitive.Root>\n  )\n);\n\nSwitch.displayName = 'Switch';\n"],"names":["_jsx","SwitchPrimitive"],"mappings":";;;;;;AAMA,MAAM,cAAc,GAAG,GAAG,CAAC,MAAM,CAAC,MAAM,EAAE;AACxC,IAAA,QAAQ,EAAE;AACR,QAAA,IAAI,EAAE;YACJ,KAAK,EAAE,MAAM,CAAC,KAAK;YACnB,KAAK,EAAE,MAAM,CAAC,KAAK;AACpB,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,IAAI,EAAE,OAAO;AACd,KAAA;AACF,CAAA,CAAC,CAAC;AAMU,MAAA,MAAM,GAAG,UAAU,CAC9B,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,MAC1CA,GAAA,CAACC,QAAe,CAAC,IAAI,EAAA,EAAA,GACf,KAAK,EACT,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,cAAc,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,EAAA,QAAA,EAE9CD,GAAC,CAAAC,QAAe,CAAC,KAAK,EAAC,EAAA,SAAS,EAAE,MAAM,CAAC,KAAK,EAAI,CAAA,EAAA,CAC7B,CACxB,EACD;AAEF,MAAM,CAAC,WAAW,GAAG,QAAQ;;;;"}
+{"version":3,"file":"switch.js","sources":["../../../components/switch/switch.tsx"],"sourcesContent":["import { Switch as SwitchPrimitive } from '@base-ui/react/switch';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport styles from './switch.module.css';\n\nconst switchVariants = cva(styles.switch, {\n  variants: {\n    size: {\n      large: styles.large,\n      small: styles.small\n    }\n  },\n  defaultVariants: {\n    size: 'large'\n  }\n});\n\nexport interface SwitchProps\n  extends SwitchPrimitive.Root.Props,\n    VariantProps<typeof switchVariants> {}\n\nexport function Switch({ className, size, ...props }: SwitchProps) {\n  return (\n    <SwitchPrimitive.Root\n      {...props}\n      className={switchVariants({ size, className })}\n    >\n      <SwitchPrimitive.Thumb className={styles.thumb} />\n    </SwitchPrimitive.Root>\n  );\n}\n\nSwitch.displayName = 'Switch';\n"],"names":["_jsx","SwitchPrimitive"],"mappings":";;;;;AAKA,MAAM,cAAc,GAAG,GAAG,CAAC,MAAM,CAAC,MAAM,EAAE;AACxC,IAAA,QAAQ,EAAE;AACR,QAAA,IAAI,EAAE;YACJ,KAAK,EAAE,MAAM,CAAC,KAAK;YACnB,KAAK,EAAE,MAAM,CAAC,KAAK;AACpB,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,IAAI,EAAE,OAAO;AACd,KAAA;AACF,CAAA,CAAC,CAAC;AAMG,SAAU,MAAM,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,KAAK,EAAe,EAAA;AAC/D,IAAA,QACEA,GAAA,CAACC,QAAe,CAAC,IAAI,EACf,EAAA,GAAA,KAAK,EACT,SAAS,EAAE,cAAc,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,EAE9C,QAAA,EAAAD,GAAA,CAACC,QAAe,CAAC,KAAK,EAAC,EAAA,SAAS,EAAE,MAAM,CAAC,KAAK,EAAI,CAAA,EAAA,CAC7B,EACvB;AACJ,CAAC;AAED,MAAM,CAAC,WAAW,GAAG,QAAQ;;;;"}