@usefragments/ui 1.5.4 → 1.7.0

package/dist/components/Sidebar/index.js

@@ -98,7 +98,7 @@ function useSidebar() {
       isMobile: false,
       position: "left",
       width: "240px",
-      collapsedWidth: "56px",
+      collapsedWidth: "var(--fui-navigation-sidebar-collapsed-width, 56px)",
       collapsible: "icon",
       hasIcons: true,
       toggleSidebar: () => {
@@ -175,7 +175,7 @@ function SidebarProvider({
   defaultOpen = false,
   onOpenChange,
   width = "240px",
-  collapsedWidth = "56px",
+  collapsedWidth = "var(--fui-navigation-sidebar-collapsed-width, 56px)",
   position = "left",
   collapsible = "icon",
   enableKeyboardShortcut = true
@@ -187,11 +187,7 @@ function SidebarProvider({
     defaultCollapsed,
     onCollapsedChange
   );
-  const [open, setOpen] = useControllableState(
-    controlledOpen,
-    defaultOpen,
-    onOpenChange
-  );
+  const [open, setOpen] = useControllableState(controlledOpen, defaultOpen, onOpenChange);
   const toggleSidebar = React.useCallback(() => {
     if (collapsible === "none") return;
     if (isMobile) {
@@ -251,9 +247,10 @@ function SidebarRoot({
   defaultOpen = false,
   onOpenChange,
   width = "240px",
-  collapsedWidth = "56px",
+  collapsedWidth = "var(--fui-navigation-sidebar-collapsed-width, 56px)",
   position = "left",
-  collapsible = "icon",
+  collapsible,
+  activeIndicator = "start",
   className,
   style: styleProp,
   "aria-label": ariaLabel,
@@ -271,14 +268,15 @@ function SidebarRoot({
     defaultOpen,
     onOpenChange
   );
-  const collapsed = existingContext ? existingContext.collapsed : internalCollapsed;
-  const setCollapsed = existingContext ? existingContext.setCollapsed : setInternalCollapsed;
+  const isCollapsedControlled = controlledCollapsed !== void 0;
+  const collapsed = isCollapsedControlled || !existingContext ? internalCollapsed : existingContext.collapsed;
+  const setCollapsed = isCollapsedControlled || !existingContext ? setInternalCollapsed : existingContext.setCollapsed;
   const open = existingContext ? existingContext.open : internalOpen;
   const setOpen = existingContext ? existingContext.setOpen : setInternalOpen;
   const resolvedPosition = existingContext ? existingContext.position : position;
   const resolvedWidth = existingContext ? existingContext.width : width;
   const resolvedCollapsedWidth = existingContext ? existingContext.collapsedWidth : collapsedWidth;
-  const resolvedCollapsible = existingContext ? existingContext.collapsible : collapsible;
+  const resolvedCollapsible = collapsible ?? (existingContext ? existingContext.collapsible : "icon");
   const hasIcons = React.useMemo(() => hasSidebarItemIcons(children), [children]);
   const shouldCollapseToZero = !isMobile && resolvedCollapsible === "icon" && collapsed && !hasIcons;
   const isOffcanvasCollapsed = !isMobile && resolvedCollapsible === "offcanvas" && collapsed;
@@ -362,10 +360,12 @@ function SidebarRoot({
       role: isMobile ? "dialog" : void 0,
       "aria-modal": isMobile && open ? true : void 0,
       "aria-hidden": isMobile && !open ? true : void 0,
+      inert: isMobile && !open ? true : void 0,
       "aria-label": isMobile ? ariaLabel || "Sidebar navigation" : ariaLabel,
       "data-state": isMobile ? open ? "open" : "closed" : collapsed ? "collapsed" : "expanded",
       "data-position": resolvedPosition,
       "data-collapsible": resolvedCollapsible,
+      "data-active-indicator": activeIndicator,
       "data-icon-collapse": resolvedCollapsible === "icon" ? hasIcons ? "icons" : "none" : void 0,
       children
     }
@@ -403,10 +403,7 @@ function SidebarSection({
   ...htmlProps
 }) {
   const { collapsed, isMobile } = useSidebarContext();
-  const classes = [
-    styles.section,
-    className
-  ].filter(Boolean).join(" ");
+  const classes = [styles.section, className].filter(Boolean).join(" ");
   const showLabel = label && (!collapsed || isMobile);
   const showAction = action && (!collapsed || isMobile);
   const isCollapsible = isCollapsibleProp && showLabel;
@@ -421,14 +418,7 @@ function SidebarSection({
   }
   return /* @__PURE__ */ jsx("div", { ...htmlProps, className: classes, role: "group", "aria-label": label, children: /* @__PURE__ */ jsxs(Collapsible, { defaultOpen, className: styles.sectionCollapsible, children: [
     /* @__PURE__ */ jsxs("div", { className: styles.sectionHeader, children: [
-      /* @__PURE__ */ jsx(
-        Collapsible.Trigger,
-        {
-          className: styles.sectionTrigger,
-          chevronPosition: "end",
-          children: /* @__PURE__ */ jsx("span", { className: styles.sectionLabel, children: label })
-        }
-      ),
+      /* @__PURE__ */ jsx(Collapsible.Trigger, { className: styles.sectionTrigger, chevronPosition: "end", children: /* @__PURE__ */ jsx("span", { className: styles.sectionLabel, children: label }) }),
       showAction && /* @__PURE__ */ jsx("div", { className: styles.sectionActionWrapper, children: action })
     ] }),
     /* @__PURE__ */ jsx(Collapsible.Content, { className: styles.sectionContent, children: /* @__PURE__ */ jsx("ul", { className: styles.sectionList, children }) })
@@ -541,10 +531,7 @@ function SidebarItem({
     itemElement = /* @__PURE__ */ jsx("button", { ...itemProps, ...rest, type: "button", children: itemContent });
   }
   const wrappedItem = isCollapsed ? /* @__PURE__ */ jsx(Tooltip, { content: labelText || children, side: "right", delay: 100, children: itemElement }) : itemElement;
-  const wrapperClasses = [
-    styles.itemWrapper,
-    expanded && styles.itemExpanded
-  ].filter(Boolean).join(" ");
+  const wrapperClasses = [styles.itemWrapper, expanded && styles.itemExpanded].filter(Boolean).join(" ");
   return /* @__PURE__ */ jsx("li", { className: wrapperClasses, children: wrappedItem });
 }
 function SidebarSubItem({
@@ -644,11 +631,7 @@ function SidebarCollapseToggle({
     return null;
   }
   const shouldFloat = collapsed && (collapsible === "icon" && !hasIcons || collapsible === "offcanvas");
-  const classes = [
-    styles.collapseToggle,
-    shouldFloat && styles.collapseToggleFloating,
-    className
-  ].filter(Boolean).join(" ");
+  const classes = [styles.collapseToggle, shouldFloat && styles.collapseToggleFloating, className].filter(Boolean).join(" ");
   const label = ariaLabel || (collapsed ? "Expand sidebar" : "Collapse sidebar");
   return /* @__PURE__ */ jsx(
     "button",
@@ -673,11 +656,7 @@ function SidebarRail({
   if (isMobile || collapsible === "none") {
     return null;
   }
-  const classes = [
-    styles.rail,
-    collapsed && styles.railCollapsed,
-    className
-  ].filter(Boolean).join(" ");
+  const classes = [styles.rail, collapsed && styles.railCollapsed, className].filter(Boolean).join(" ");
   return /* @__PURE__ */ jsx(
     "button",
     {

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

@@ -1,67 +1,79 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const skeleton = "_skeleton_1x5gx_9";
-const skeletonPulse = "_skeleton-pulse_1x5gx_1";
-const fill = "_fill_1x5gx_20";
-const text = "_text_1x5gx_25";
-const heading = "_heading_1x5gx_31";
-const avatar = "_avatar_1x5gx_37";
-const avatarSm = "_avatar-sm_1x5gx_41";
-const avatarMd = "_avatar-md_1x5gx_46";
-const avatarLg = "_avatar-lg_1x5gx_51";
-const button = "_button_1x5gx_56";
-const buttonSm = "_button-sm_1x5gx_60";
-const buttonMd = "_button-md_1x5gx_65";
-const buttonLg = "_button-lg_1x5gx_70";
-const input = "_input_1x5gx_75";
-const radiusNone = "_radius-none_1x5gx_81";
-const radiusSm = "_radius-sm_1x5gx_85";
-const radiusMd = "_radius-md_1x5gx_89";
-const radiusLg = "_radius-lg_1x5gx_93";
-const radiusFull = "_radius-full_1x5gx_97";
-const textContainer = "_textContainer_1x5gx_101";
-const gapSm = "_gap-sm_1x5gx_107";
-const gapMd = "_gap-md_1x5gx_111";
-const textLine = "_textLine_1x5gx_115";
+const skeleton = "_skeleton_r1dn3_9";
+const skeletonShimmer = "_skeleton-shimmer_r1dn3_1";
+const fill = "_fill_r1dn3_29";
+const text = "_text_r1dn3_34";
+const heading = "_heading_r1dn3_40";
+const avatar = "_avatar_r1dn3_46";
+const avatarSm = "_avatar-sm_r1dn3_50";
+const avatarMd = "_avatar-md_r1dn3_55";
+const avatarLg = "_avatar-lg_r1dn3_60";
+const button = "_button_r1dn3_65";
+const buttonSm = "_button-sm_r1dn3_69";
+const buttonMd = "_button-md_r1dn3_73";
+const buttonLg = "_button-lg_r1dn3_77";
+const input = "_input_r1dn3_93";
+const inputSm = "_input-sm_r1dn3_98";
+const inputMd = "_input-md_r1dn3_102";
+const inputLg = "_input-lg_r1dn3_106";
+const radiusNone = "_radius-none_r1dn3_110";
+const radiusSm = "_radius-sm_r1dn3_114";
+const radiusMd = "_radius-md_r1dn3_118";
+const radiusLg = "_radius-lg_r1dn3_122";
+const radiusFull = "_radius-full_r1dn3_126";
+const textContainer = "_textContainer_r1dn3_130";
+const gapSm = "_gap-sm_r1dn3_136";
+const gapMd = "_gap-md_r1dn3_140";
+const textLine = "_textLine_r1dn3_144";
+const skeletonPulse = "_skeleton-pulse_r1dn3_1";
 const styles = {
   skeleton,
-  "skeleton-pulse": "_skeleton-pulse_1x5gx_1",
-  skeletonPulse,
-  "static": "_static_1x5gx_16",
+  "skeleton-shimmer": "_skeleton-shimmer_r1dn3_1",
+  skeletonShimmer,
+  "static": "_static_r1dn3_18",
   fill,
   text,
   heading,
   avatar,
-  "avatar-sm": "_avatar-sm_1x5gx_41",
+  "avatar-sm": "_avatar-sm_r1dn3_50",
   avatarSm,
-  "avatar-md": "_avatar-md_1x5gx_46",
+  "avatar-md": "_avatar-md_r1dn3_55",
   avatarMd,
-  "avatar-lg": "_avatar-lg_1x5gx_51",
+  "avatar-lg": "_avatar-lg_r1dn3_60",
   avatarLg,
   button,
-  "button-sm": "_button-sm_1x5gx_60",
+  "button-sm": "_button-sm_r1dn3_69",
   buttonSm,
-  "button-md": "_button-md_1x5gx_65",
+  "button-md": "_button-md_r1dn3_73",
   buttonMd,
-  "button-lg": "_button-lg_1x5gx_70",
+  "button-lg": "_button-lg_r1dn3_77",
   buttonLg,
   input,
-  "radius-none": "_radius-none_1x5gx_81",
+  "input-sm": "_input-sm_r1dn3_98",
+  inputSm,
+  "input-md": "_input-md_r1dn3_102",
+  inputMd,
+  "input-lg": "_input-lg_r1dn3_106",
+  inputLg,
+  "radius-none": "_radius-none_r1dn3_110",
   radiusNone,
-  "radius-sm": "_radius-sm_1x5gx_85",
+  "radius-sm": "_radius-sm_r1dn3_114",
   radiusSm,
-  "radius-md": "_radius-md_1x5gx_89",
+  "radius-md": "_radius-md_r1dn3_118",
   radiusMd,
-  "radius-lg": "_radius-lg_1x5gx_93",
+  "radius-lg": "_radius-lg_r1dn3_122",
   radiusLg,
-  "radius-full": "_radius-full_1x5gx_97",
+  "radius-full": "_radius-full_r1dn3_126",
   radiusFull,
   textContainer,
-  "gap-sm": "_gap-sm_1x5gx_107",
+  "gap-sm": "_gap-sm_r1dn3_136",
   gapSm,
-  "gap-md": "_gap-md_1x5gx_111",
+  "gap-md": "_gap-md_r1dn3_140",
   gapMd,
-  textLine
+  textLine,
+  "skeleton-pulse": "_skeleton-pulse_r1dn3_1",
+  skeletonPulse
 };
 exports.avatar = avatar;
 exports.avatarLg = avatarLg;
@@ -77,6 +89,9 @@ exports.gapMd = gapMd;
 exports.gapSm = gapSm;
 exports.heading = heading;
 exports.input = input;
+exports.inputLg = inputLg;
+exports.inputMd = inputMd;
+exports.inputSm = inputSm;
 exports.radiusFull = radiusFull;
 exports.radiusLg = radiusLg;
 exports.radiusMd = radiusMd;
@@ -84,6 +99,7 @@ exports.radiusNone = radiusNone;
 exports.radiusSm = radiusSm;
 exports.skeleton = skeleton;
 exports.skeletonPulse = skeletonPulse;
+exports.skeletonShimmer = skeletonShimmer;
 exports.text = text;
 exports.textContainer = textContainer;
 exports.textLine = textLine;

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

@@ -1,65 +1,77 @@
-const skeleton = "_skeleton_1x5gx_9";
-const skeletonPulse = "_skeleton-pulse_1x5gx_1";
-const fill = "_fill_1x5gx_20";
-const text = "_text_1x5gx_25";
-const heading = "_heading_1x5gx_31";
-const avatar = "_avatar_1x5gx_37";
-const avatarSm = "_avatar-sm_1x5gx_41";
-const avatarMd = "_avatar-md_1x5gx_46";
-const avatarLg = "_avatar-lg_1x5gx_51";
-const button = "_button_1x5gx_56";
-const buttonSm = "_button-sm_1x5gx_60";
-const buttonMd = "_button-md_1x5gx_65";
-const buttonLg = "_button-lg_1x5gx_70";
-const input = "_input_1x5gx_75";
-const radiusNone = "_radius-none_1x5gx_81";
-const radiusSm = "_radius-sm_1x5gx_85";
-const radiusMd = "_radius-md_1x5gx_89";
-const radiusLg = "_radius-lg_1x5gx_93";
-const radiusFull = "_radius-full_1x5gx_97";
-const textContainer = "_textContainer_1x5gx_101";
-const gapSm = "_gap-sm_1x5gx_107";
-const gapMd = "_gap-md_1x5gx_111";
-const textLine = "_textLine_1x5gx_115";
+const skeleton = "_skeleton_r1dn3_9";
+const skeletonShimmer = "_skeleton-shimmer_r1dn3_1";
+const fill = "_fill_r1dn3_29";
+const text = "_text_r1dn3_34";
+const heading = "_heading_r1dn3_40";
+const avatar = "_avatar_r1dn3_46";
+const avatarSm = "_avatar-sm_r1dn3_50";
+const avatarMd = "_avatar-md_r1dn3_55";
+const avatarLg = "_avatar-lg_r1dn3_60";
+const button = "_button_r1dn3_65";
+const buttonSm = "_button-sm_r1dn3_69";
+const buttonMd = "_button-md_r1dn3_73";
+const buttonLg = "_button-lg_r1dn3_77";
+const input = "_input_r1dn3_93";
+const inputSm = "_input-sm_r1dn3_98";
+const inputMd = "_input-md_r1dn3_102";
+const inputLg = "_input-lg_r1dn3_106";
+const radiusNone = "_radius-none_r1dn3_110";
+const radiusSm = "_radius-sm_r1dn3_114";
+const radiusMd = "_radius-md_r1dn3_118";
+const radiusLg = "_radius-lg_r1dn3_122";
+const radiusFull = "_radius-full_r1dn3_126";
+const textContainer = "_textContainer_r1dn3_130";
+const gapSm = "_gap-sm_r1dn3_136";
+const gapMd = "_gap-md_r1dn3_140";
+const textLine = "_textLine_r1dn3_144";
+const skeletonPulse = "_skeleton-pulse_r1dn3_1";
 const styles = {
   skeleton,
-  "skeleton-pulse": "_skeleton-pulse_1x5gx_1",
-  skeletonPulse,
-  "static": "_static_1x5gx_16",
+  "skeleton-shimmer": "_skeleton-shimmer_r1dn3_1",
+  skeletonShimmer,
+  "static": "_static_r1dn3_18",
   fill,
   text,
   heading,
   avatar,
-  "avatar-sm": "_avatar-sm_1x5gx_41",
+  "avatar-sm": "_avatar-sm_r1dn3_50",
   avatarSm,
-  "avatar-md": "_avatar-md_1x5gx_46",
+  "avatar-md": "_avatar-md_r1dn3_55",
   avatarMd,
-  "avatar-lg": "_avatar-lg_1x5gx_51",
+  "avatar-lg": "_avatar-lg_r1dn3_60",
   avatarLg,
   button,
-  "button-sm": "_button-sm_1x5gx_60",
+  "button-sm": "_button-sm_r1dn3_69",
   buttonSm,
-  "button-md": "_button-md_1x5gx_65",
+  "button-md": "_button-md_r1dn3_73",
   buttonMd,
-  "button-lg": "_button-lg_1x5gx_70",
+  "button-lg": "_button-lg_r1dn3_77",
   buttonLg,
   input,
-  "radius-none": "_radius-none_1x5gx_81",
+  "input-sm": "_input-sm_r1dn3_98",
+  inputSm,
+  "input-md": "_input-md_r1dn3_102",
+  inputMd,
+  "input-lg": "_input-lg_r1dn3_106",
+  inputLg,
+  "radius-none": "_radius-none_r1dn3_110",
   radiusNone,
-  "radius-sm": "_radius-sm_1x5gx_85",
+  "radius-sm": "_radius-sm_r1dn3_114",
   radiusSm,
-  "radius-md": "_radius-md_1x5gx_89",
+  "radius-md": "_radius-md_r1dn3_118",
   radiusMd,
-  "radius-lg": "_radius-lg_1x5gx_93",
+  "radius-lg": "_radius-lg_r1dn3_122",
   radiusLg,
-  "radius-full": "_radius-full_1x5gx_97",
+  "radius-full": "_radius-full_r1dn3_126",
   radiusFull,
   textContainer,
-  "gap-sm": "_gap-sm_1x5gx_107",
+  "gap-sm": "_gap-sm_r1dn3_136",
   gapSm,
-  "gap-md": "_gap-md_1x5gx_111",
+  "gap-md": "_gap-md_r1dn3_140",
   gapMd,
-  textLine
+  textLine,
+  "skeleton-pulse": "_skeleton-pulse_r1dn3_1",
+  skeletonPulse
 };
 export {
   avatar,
@@ -76,6 +88,9 @@ export {
   gapSm,
   heading,
   input,
+  inputLg,
+  inputMd,
+  inputSm,
   radiusFull,
   radiusLg,
   radiusMd,
@@ -83,6 +98,7 @@ export {
   radiusSm,
   skeleton,
   skeletonPulse,
+  skeletonShimmer,
   text,
   textContainer,
   textLine

package/dist/components/Skeleton/index.cjs

@@ -20,47 +20,46 @@ function _interopNamespaceDefault(e) {
   return Object.freeze(n);
 }
 const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
-const SkeletonBase = React__namespace.forwardRef(
-  function SkeletonBase2({
-    variant = "rect",
-    size = "md",
-    width,
-    height,
-    fill = false,
-    radius,
-    static: isStatic = false,
-    className,
-    ...htmlProps
-  }, ref) {
-    const classes = [
-      Skeleton_module.default.skeleton,
-      Skeleton_module.default[variant],
-      variant === "avatar" && Skeleton_module.default[`avatar-${size}`],
-      variant === "button" && Skeleton_module.default[`button-${size}`],
-      fill && Skeleton_module.default.fill,
-      radius && Skeleton_module.default[`radius-${radius}`],
-      isStatic && Skeleton_module.default.static,
-      className
-    ].filter(Boolean).join(" ");
-    const style = {};
-    if (width !== void 0) {
-      style.width = typeof width === "number" ? `${width}px` : width;
-    }
-    if (height !== void 0) {
-      style.height = typeof height === "number" ? `${height}px` : height;
-    }
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        ref,
-        ...htmlProps,
-        className: classes,
-        style: Object.keys(style).length > 0 ? style : void 0,
-        "aria-hidden": "true"
-      }
-    );
+const SkeletonBase = React__namespace.forwardRef(function SkeletonBase2({
+  variant = "rect",
+  size = "md",
+  width,
+  height,
+  fill = false,
+  radius,
+  static: isStatic = false,
+  className,
+  ...htmlProps
+}, ref) {
+  const classes = [
+    Skeleton_module.default.skeleton,
+    Skeleton_module.default[variant],
+    variant === "avatar" && Skeleton_module.default[`avatar-${size}`],
+    variant === "button" && Skeleton_module.default[`button-${size}`],
+    variant === "input" && Skeleton_module.default[`input-${size}`],
+    fill && Skeleton_module.default.fill,
+    radius && Skeleton_module.default[`radius-${radius}`],
+    isStatic && Skeleton_module.default.static,
+    className
+  ].filter(Boolean).join(" ");
+  const style = {};
+  if (width !== void 0) {
+    style.width = typeof width === "number" ? `${width}px` : width;
+  }
+  if (height !== void 0) {
+    style.height = typeof height === "number" ? `${height}px` : height;
   }
-);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      ...htmlProps,
+      className: classes,
+      style: Object.keys(style).length > 0 ? style : void 0,
+      "aria-hidden": "true"
+    }
+  );
+});
 function SkeletonText({
   lines = 3,
   lastLineWidth = 80,
@@ -68,11 +67,7 @@ function SkeletonText({
   className,
   ...htmlProps
 }) {
-  const containerClasses = [
-    Skeleton_module.default.textContainer,
-    Skeleton_module.default[`gap-${gap}`],
-    className
-  ].filter(Boolean).join(" ");
+  const containerClasses = [Skeleton_module.default.textContainer, Skeleton_module.default[`gap-${gap}`], className].filter(Boolean).join(" ");
   return /* @__PURE__ */ jsxRuntime.jsx("div", { ...htmlProps, className: containerClasses, "aria-hidden": "true", children: Array.from({ length: lines }, (_, lineIdx) => {
     const isLast = lineIdx === lines - 1;
     return /* @__PURE__ */ jsxRuntime.jsx(
@@ -90,16 +85,7 @@ function SkeletonCircle({
   className
 }) {
   if (typeof size === "number") {
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      SkeletonBase,
-      {
-        variant: "rect",
-        width: size,
-        height: size,
-        radius: "full",
-        className
-      }
-    );
+    return /* @__PURE__ */ jsxRuntime.jsx(SkeletonBase, { variant: "rect", width: size, height: size, radius: "full", className });
   }
   return /* @__PURE__ */ jsxRuntime.jsx(SkeletonBase, { variant: "avatar", size, className });
 }

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

@@ -1,6 +1,6 @@
-import * as React from 'react';
-export type SkeletonVariant = 'text' | 'heading' | 'avatar' | 'button' | 'input' | 'rect';
-export type SkeletonSize = 'sm' | 'md' | 'lg';
+import * as React from "react";
+export type SkeletonVariant = "text" | "heading" | "avatar" | "button" | "input" | "rect";
+export type SkeletonSize = "sm" | "md" | "lg";
 export interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {
     /**
      * Semantic variant that auto-sizes based on design tokens.
@@ -8,7 +8,7 @@ export interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {
      */
     variant?: SkeletonVariant;
     /**
-     * Size variant for avatar/button. Ignored for text/heading/input.
+     * Size variant for avatar, button, and input placeholders.
      * @default 'md'
      */
     size?: SkeletonSize;
@@ -28,14 +28,14 @@ export interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {
     /**
      * Border radius override. Auto-determined for most variants.
      */
-    radius?: 'none' | 'sm' | 'md' | 'lg' | 'full';
+    radius?: "none" | "sm" | "md" | "lg" | "full";
     /**
      * Disable animation for reduced motion preference.
      * @default false
      */
     static?: boolean;
 }
-export interface SkeletonTextProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {
+export interface SkeletonTextProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "children"> {
     /** Number of text lines to render */
     lines?: number;
     /**
@@ -45,7 +45,7 @@ export interface SkeletonTextProps extends Omit<React.HTMLAttributes<HTMLDivElem
      */
     lastLineWidth?: number;
     /** Gap between lines. Uses spacing tokens. */
-    gap?: 'sm' | 'md';
+    gap?: "sm" | "md";
 }
 declare function SkeletonText({ lines, lastLineWidth, gap, className, ...htmlProps }: SkeletonTextProps): import("react/jsx-runtime").JSX.Element;
 declare function SkeletonCircle({ size, className, }: {

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Skeleton/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,MAAM,MAAM,eAAe,GACvB,MAAM,GACN,SAAS,GACT,QAAQ,GACR,QAAQ,GACR,OAAO,GACP,MAAM,CAAC;AAEX,MAAM,MAAM,YAAY,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE9C,MAAM,WAAW,aAAc,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACzE;;;OAGG;IACH,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B;;;OAGG;IACH,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;IAC9C;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IAC/F,qCAAqC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,8CAA8C;IAC9C,GAAG,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;CACnB;AAyDD,iBAAS,YAAY,CAAC,EACpB,KAAS,EACT,aAAkB,EAClB,GAAU,EACV,SAAS,EACT,GAAG,SAAS,EACb,EAAE,iBAAiB,2CAqBnB;AAMD,iBAAS,cAAc,CAAC,EACtB,IAAW,EACX,SAAS,GACV,EAAE;IACD,IAAI,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,2CAaA;AAMD,eAAO,MAAM,QAAQ;;;CAGnB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Skeleton/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,MAAM,MAAM,eAAe,GACvB,MAAM,GACN,SAAS,GACT,QAAQ,GACR,QAAQ,GACR,OAAO,GACP,MAAM,CAAC;AAEX,MAAM,MAAM,YAAY,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE9C,MAAM,WAAW,aAAc,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACzE;;;OAGG;IACH,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B;;;OAGG;IACH,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;IAC9C;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IAC/F,qCAAqC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,8CAA8C;IAC9C,GAAG,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;CACnB;AA0DD,iBAAS,YAAY,CAAC,EACpB,KAAS,EACT,aAAkB,EAClB,GAAU,EACV,SAAS,EACT,GAAG,SAAS,EACb,EAAE,iBAAiB,2CAmBnB;AAMD,iBAAS,cAAc,CAAC,EACtB,IAAW,EACX,SAAS,GACV,EAAE;IACD,IAAI,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,2CAOA;AAMD,eAAO,MAAM,QAAQ;;;CAGnB,CAAC"}