@usefragments/ui 1.5.4 → 1.7.0

package/dist/components/NavigationMenu/index.cjs

@@ -35,16 +35,17 @@ function composeNavMenuClickHandlers(childHandler, internalHandler) {
     internalHandler(event);
   };
 }
-function useIsMobile() {
+function useIsMobile(breakpoint) {
   const [isMobile, setIsMobile] = React__namespace.useState(false);
   React__namespace.useEffect(() => {
     if (typeof window === "undefined") return;
-    const mq = window.matchMedia("(max-width: 767px)");
+    const maxWidth = breakpoint === "lg" ? 1023 : 767;
+    const mq = window.matchMedia(`(max-width: ${maxWidth}px)`);
     setIsMobile(mq.matches);
     const handler = (e) => setIsMobile(e.matches);
     mq.addEventListener("change", handler);
     return () => mq.removeEventListener("change", handler);
-  }, []);
+  }, [breakpoint]);
   return isMobile;
 }
 function renderNavigationMenuIcon(slot, state) {
@@ -60,12 +61,13 @@ function NavigationMenuRoot({
   delayDuration = 200,
   skipDelayDuration = 300,
   icons,
+  mobileBreakpoint = "md",
   className,
   "aria-label": ariaLabel = "Main navigation",
   ...htmlProps
 }) {
   const rootId = React__namespace.useId();
-  const isMobile = useIsMobile();
+  const isMobile = useIsMobile(mobileBreakpoint);
   const state = useNavigationMenu.useNavigationMenu({
     value: controlledValue,
     defaultValue,
@@ -84,11 +86,21 @@ function NavigationMenuRoot({
     }),
     [state, orientation, isMobile, rootId, icons]
   );
-  return /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuContext.NavigationMenuContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsxs("nav", { ...htmlProps, className: classes, "aria-label": ariaLabel, "data-orientation": orientation, children: [
-    children,
-    isMobile && /* @__PURE__ */ jsxRuntime.jsx(MobileHamburger, {}),
-    isMobile && state.mobileOpen && /* @__PURE__ */ jsxRuntime.jsx(MobileDrawer, {})
-  ] }) });
+  return /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuContext.NavigationMenuContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsxs(
+    "nav",
+    {
+      ...htmlProps,
+      className: classes,
+      "aria-label": ariaLabel,
+      "data-orientation": orientation,
+      "data-mobile": isMobile || void 0,
+      children: [
+        children,
+        isMobile && /* @__PURE__ */ jsxRuntime.jsx(MobileHamburger, {}),
+        isMobile && state.mobileOpen && /* @__PURE__ */ jsxRuntime.jsx(MobileDrawer, {})
+      ]
+    }
+  ) });
 }
 function NavigationMenuList({ children, className }) {
   const { orientation, triggerOrder, triggerRefs, value } = NavigationMenuContext.useNavigationMenuContext();
@@ -375,12 +387,13 @@ function NavigationMenuLink({
       ctx.setValue("");
     }
   };
+  const inMobileDrawer = Boolean((ctx == null ? void 0 : ctx.isMobile) && (ctx == null ? void 0 : ctx.mobileOpen));
   if (isStructured) {
     const classes2 = [
-      NavigationMenu_module.default.link,
-      NavigationMenu_module.default.linkStructured,
-      active && NavigationMenu_module.default.linkActive,
-      featured && NavigationMenu_module.default.linkFeatured,
+      inMobileDrawer ? NavigationMenu_module.default.drawerLink : NavigationMenu_module.default.link,
+      !inMobileDrawer && NavigationMenu_module.default.linkStructured,
+      active && (inMobileDrawer ? NavigationMenu_module.default.drawerLinkActive : NavigationMenu_module.default.linkActive),
+      !inMobileDrawer && featured && NavigationMenu_module.default.linkFeatured,
       className
     ].filter(Boolean).join(" ");
     const linkProps2 = {
@@ -413,7 +426,11 @@ function NavigationMenuLink({
       ] })
     ] });
   }
-  const classes = [NavigationMenu_module.default.link, active && NavigationMenu_module.default.linkActive, className].filter(Boolean).join(" ");
+  const classes = [
+    inMobileDrawer ? NavigationMenu_module.default.drawerLink : NavigationMenu_module.default.link,
+    active && (inMobileDrawer ? NavigationMenu_module.default.drawerLinkActive : NavigationMenu_module.default.linkActive),
+    className
+  ].filter(Boolean).join(" ");
   const linkProps = {
     ...htmlProps,
     className: classes,
@@ -602,7 +619,7 @@ function MobileDrawer() {
               }
             )
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(index.ScrollArea, { orientation: "vertical", className: NavigationMenu_module.default.drawerBody, children: ctx.mobileContentChildren ? ctx.mobileContentChildren : /* @__PURE__ */ jsxRuntime.jsx("div", { className: NavigationMenu_module.default.drawerNav, children: autoItems.map(
+          /* @__PURE__ */ jsxRuntime.jsx(index.ScrollArea, { orientation: "vertical", showFades: true, className: NavigationMenu_module.default.drawerBody, children: ctx.mobileContentChildren ? ctx.mobileContentChildren : /* @__PURE__ */ jsxRuntime.jsx("div", { className: NavigationMenu_module.default.drawerNav, children: autoItems.map(
             (item) => item.contentChildren ? /* @__PURE__ */ jsxRuntime.jsx(
               MobileCollapsibleSection,
               {

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

@@ -1,5 +1,5 @@
-import * as React from 'react';
-import { type NavigationMenuIcons } from './NavigationMenuContext';
+import * as React from "react";
+import { type NavigationMenuIcons } from "./NavigationMenuContext";
 export interface NavigationMenuProps extends React.HTMLAttributes<HTMLElement> {
     children: React.ReactNode;
     /** Controlled open item value */
@@ -9,13 +9,19 @@ export interface NavigationMenuProps extends React.HTMLAttributes<HTMLElement> {
     /** Callback when open item changes */
     onValueChange?: (value: string) => void;
     /** Menu orientation */
-    orientation?: 'horizontal' | 'vertical';
+    orientation?: "horizontal" | "vertical";
     /** Delay before opening on hover (ms) */
     delayDuration?: number;
     /** Duration to skip delays between triggers (ms) */
     skipDelayDuration?: number;
     /** Optional icon overrides for trigger chevrons and mobile drawer controls */
     icons?: NavigationMenuIcons;
+    /**
+     * Viewport width where the canonical drawer replaces desktop navigation.
+     * `md` preserves the default 768px switch; `lg` lets rail-based shells
+     * retire their sidebar and desktop navigation together below 1024px.
+     */
+    mobileBreakpoint?: "md" | "lg";
 }
 export interface NavigationMenuListProps {
     children: React.ReactNode;
@@ -35,7 +41,7 @@ export interface NavigationMenuContentProps {
     children: React.ReactNode;
     className?: string;
 }
-export interface NavigationMenuLinkProps extends Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'title'> {
+export interface NavigationMenuLinkProps extends Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "title"> {
     /** Simple mode: children as text content */
     children?: React.ReactNode;
     /** Structured mode: title (string or ReactNode) */
@@ -68,7 +74,7 @@ export interface NavigationMenuMobileSectionProps {
     /** Section heading label */
     label?: string;
 }
-declare function NavigationMenuRoot({ children, value: controlledValue, defaultValue, onValueChange, orientation, delayDuration, skipDelayDuration, icons, className, 'aria-label': ariaLabel, ...htmlProps }: NavigationMenuProps): import("react/jsx-runtime").JSX.Element;
+declare function NavigationMenuRoot({ children, value: controlledValue, defaultValue, onValueChange, orientation, delayDuration, skipDelayDuration, icons, mobileBreakpoint, className, "aria-label": ariaLabel, ...htmlProps }: NavigationMenuProps): import("react/jsx-runtime").JSX.Element;
 declare function NavigationMenuList({ children, className }: NavigationMenuListProps): import("react/jsx-runtime").JSX.Element;
 declare function NavigationMenuItem({ children, value: valueProp, className }: NavigationMenuItemProps): import("react/jsx-runtime").JSX.Element;
 declare function NavigationMenuTrigger({ children, className }: NavigationMenuTriggerProps): import("react/jsx-runtime").JSX.Element;
@@ -92,5 +98,5 @@ export declare const NavigationMenu: typeof NavigationMenuRoot & {
     MobileSection: typeof NavigationMenuMobileSection;
 };
 export { NavigationMenuRoot, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger, NavigationMenuContent, NavigationMenuLink, NavigationMenuIndicator, NavigationMenuViewport, NavigationMenuMobileBrand, NavigationMenuMobileContent, NavigationMenuMobileSection, };
-export type { NavigationMenuIcons, NavigationMenuIconSlot, NavigationMenuIconRenderState, } from './NavigationMenuContext';
+export type { NavigationMenuIcons, NavigationMenuIconSlot, NavigationMenuIconRenderState, } from "./NavigationMenuContext";
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/NavigationMenu/index.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/NavigationMenu/index.tsx"],"names":[],"mappings":"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"}

package/dist/components/NavigationMenu/index.js

@@ -16,16 +16,17 @@ function composeNavMenuClickHandlers(childHandler, internalHandler) {
     internalHandler(event);
   };
 }
-function useIsMobile() {
+function useIsMobile(breakpoint) {
   const [isMobile, setIsMobile] = React.useState(false);
   React.useEffect(() => {
     if (typeof window === "undefined") return;
-    const mq = window.matchMedia("(max-width: 767px)");
+    const maxWidth = breakpoint === "lg" ? 1023 : 767;
+    const mq = window.matchMedia(`(max-width: ${maxWidth}px)`);
     setIsMobile(mq.matches);
     const handler = (e) => setIsMobile(e.matches);
     mq.addEventListener("change", handler);
     return () => mq.removeEventListener("change", handler);
-  }, []);
+  }, [breakpoint]);
   return isMobile;
 }
 function renderNavigationMenuIcon(slot, state) {
@@ -41,12 +42,13 @@ function NavigationMenuRoot({
   delayDuration = 200,
   skipDelayDuration = 300,
   icons,
+  mobileBreakpoint = "md",
   className,
   "aria-label": ariaLabel = "Main navigation",
   ...htmlProps
 }) {
   const rootId = React.useId();
-  const isMobile = useIsMobile();
+  const isMobile = useIsMobile(mobileBreakpoint);
   const state = useNavigationMenu({
     value: controlledValue,
     defaultValue,
@@ -65,11 +67,21 @@ function NavigationMenuRoot({
     }),
     [state, orientation, isMobile, rootId, icons]
   );
-  return /* @__PURE__ */ jsx(NavigationMenuContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxs("nav", { ...htmlProps, className: classes, "aria-label": ariaLabel, "data-orientation": orientation, children: [
-    children,
-    isMobile && /* @__PURE__ */ jsx(MobileHamburger, {}),
-    isMobile && state.mobileOpen && /* @__PURE__ */ jsx(MobileDrawer, {})
-  ] }) });
+  return /* @__PURE__ */ jsx(NavigationMenuContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxs(
+    "nav",
+    {
+      ...htmlProps,
+      className: classes,
+      "aria-label": ariaLabel,
+      "data-orientation": orientation,
+      "data-mobile": isMobile || void 0,
+      children: [
+        children,
+        isMobile && /* @__PURE__ */ jsx(MobileHamburger, {}),
+        isMobile && state.mobileOpen && /* @__PURE__ */ jsx(MobileDrawer, {})
+      ]
+    }
+  ) });
 }
 function NavigationMenuList({ children, className }) {
   const { orientation, triggerOrder, triggerRefs, value } = useNavigationMenuContext();
@@ -356,12 +368,13 @@ function NavigationMenuLink({
       ctx.setValue("");
     }
   };
+  const inMobileDrawer = Boolean((ctx == null ? void 0 : ctx.isMobile) && (ctx == null ? void 0 : ctx.mobileOpen));
   if (isStructured) {
     const classes2 = [
-      styles.link,
-      styles.linkStructured,
-      active && styles.linkActive,
-      featured && styles.linkFeatured,
+      inMobileDrawer ? styles.drawerLink : styles.link,
+      !inMobileDrawer && styles.linkStructured,
+      active && (inMobileDrawer ? styles.drawerLinkActive : styles.linkActive),
+      !inMobileDrawer && featured && styles.linkFeatured,
       className
     ].filter(Boolean).join(" ");
     const linkProps2 = {
@@ -394,7 +407,11 @@ function NavigationMenuLink({
       ] })
     ] });
   }
-  const classes = [styles.link, active && styles.linkActive, className].filter(Boolean).join(" ");
+  const classes = [
+    inMobileDrawer ? styles.drawerLink : styles.link,
+    active && (inMobileDrawer ? styles.drawerLinkActive : styles.linkActive),
+    className
+  ].filter(Boolean).join(" ");
   const linkProps = {
     ...htmlProps,
     className: classes,
@@ -583,7 +600,7 @@ function MobileDrawer() {
               }
             )
           ] }),
-          /* @__PURE__ */ jsx(ScrollArea, { orientation: "vertical", className: styles.drawerBody, children: ctx.mobileContentChildren ? ctx.mobileContentChildren : /* @__PURE__ */ jsx("div", { className: styles.drawerNav, children: autoItems.map(
+          /* @__PURE__ */ jsx(ScrollArea, { orientation: "vertical", showFades: true, className: styles.drawerBody, children: ctx.mobileContentChildren ? ctx.mobileContentChildren : /* @__PURE__ */ jsx("div", { className: styles.drawerNav, children: autoItems.map(
             (item) => item.contentChildren ? /* @__PURE__ */ jsx(
               MobileCollapsibleSection,
               {

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

@@ -1,26 +1,35 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const pagination = "_pagination_lk556_1";
-const list = "_list_lk556_7";
-const item = "_item_lk556_16";
-const itemActive = "_itemActive_lk556_57";
-const itemDisabled = "_itemDisabled_lk556_66";
-const navButton = "_navButton_lk556_72";
-const ellipsis = "_ellipsis_lk556_77";
+const pagination = "_pagination_j3g9h_1";
+const list = "_list_j3g9h_7";
+const item = "_item_j3g9h_16";
+const itemActive = "_itemActive_j3g9h_57";
+const itemDisabled = "_itemDisabled_j3g9h_66";
+const ellipsis = "_ellipsis_j3g9h_72";
+const sm = "_sm_j3g9h_89";
+const md = "_md_j3g9h_105";
+const lg = "_lg_j3g9h_121";
+const navButton = "_navButton_j3g9h_137";
 const styles = {
   pagination,
   list,
   item,
   itemActive,
   itemDisabled,
-  navButton,
-  ellipsis
+  ellipsis,
+  sm,
+  md,
+  lg,
+  navButton
 };
 exports.default = styles;
 exports.ellipsis = ellipsis;
 exports.item = item;
 exports.itemActive = itemActive;
 exports.itemDisabled = itemDisabled;
+exports.lg = lg;
 exports.list = list;
+exports.md = md;
 exports.navButton = navButton;
 exports.pagination = pagination;
+exports.sm = sm;

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

@@ -1,18 +1,24 @@
-const pagination = "_pagination_lk556_1";
-const list = "_list_lk556_7";
-const item = "_item_lk556_16";
-const itemActive = "_itemActive_lk556_57";
-const itemDisabled = "_itemDisabled_lk556_66";
-const navButton = "_navButton_lk556_72";
-const ellipsis = "_ellipsis_lk556_77";
+const pagination = "_pagination_j3g9h_1";
+const list = "_list_j3g9h_7";
+const item = "_item_j3g9h_16";
+const itemActive = "_itemActive_j3g9h_57";
+const itemDisabled = "_itemDisabled_j3g9h_66";
+const ellipsis = "_ellipsis_j3g9h_72";
+const sm = "_sm_j3g9h_89";
+const md = "_md_j3g9h_105";
+const lg = "_lg_j3g9h_121";
+const navButton = "_navButton_j3g9h_137";
 const styles = {
   pagination,
   list,
   item,
   itemActive,
   itemDisabled,
-  navButton,
-  ellipsis
+  ellipsis,
+  sm,
+  md,
+  lg,
+  navButton
 };
 export {
   styles as default,
@@ -20,7 +26,10 @@ export {
   item,
   itemActive,
   itemDisabled,
+  lg,
   list,
+  md,
   navButton,
-  pagination
+  pagination,
+  sm
 };

package/dist/components/Pagination/index.cjs

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
+const index = require("../ComponentDefaults/index.cjs");
 const Pagination_module = require("./Pagination.module.scss.cjs");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
@@ -124,10 +125,12 @@ function PaginationRoot({
   onPageChange,
   edgeCount = 1,
   siblingCount = 1,
+  size: sizeProp,
   className,
   "aria-label": ariaLabel,
   ...htmlProps
 }) {
+  const size = index.useResolvedControlSize(sizeProp);
   const totalPages = Math.max(0, Math.floor(rawTotalPages));
   const [uncontrolledPage, setUncontrolledPage] = React__namespace.useState(
     () => totalPages > 0 ? clamp(defaultPage, 1, totalPages) : 1
@@ -156,7 +159,7 @@ function PaginationRoot({
       {
         ...htmlProps,
         "aria-label": ariaLabel ?? "Pagination",
-        className: [Pagination_module.default.pagination, className].filter(Boolean).join(" ")
+        className: [Pagination_module.default.pagination, Pagination_module.default[size], className].filter(Boolean).join(" ")
       }
     );
   }
@@ -165,7 +168,7 @@ function PaginationRoot({
     {
       ...htmlProps,
       "aria-label": ariaLabel ?? "Pagination",
-      className: [Pagination_module.default.pagination, className].filter(Boolean).join(" "),
+      className: [Pagination_module.default.pagination, Pagination_module.default[size], className].filter(Boolean).join(" "),
       children: /* @__PURE__ */ jsxRuntime.jsx("ul", { className: Pagination_module.default.list, children })
     }
   ) });

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

@@ -13,6 +13,8 @@ export interface PaginationProps extends Omit<React.HTMLAttributes<HTMLElement>,
     edgeCount?: number;
     /** Number of pages shown around current: default 1 */
     siblingCount?: number;
+    /** Visible action size. Resolves through ComponentDefaults when omitted. */
+    size?: 'sm' | 'md' | 'lg';
 }
 export interface PaginationItemProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
     children?: React.ReactNode;
@@ -20,7 +22,7 @@ export interface PaginationItemProps extends React.ButtonHTMLAttributes<HTMLButt
     page?: number;
     className?: string;
 }
-declare function PaginationRoot({ children, totalPages: rawTotalPages, page: controlledPage, defaultPage, onPageChange, edgeCount, siblingCount, className, 'aria-label': ariaLabel, ...htmlProps }: PaginationProps): import("react/jsx-runtime").JSX.Element;
+declare function PaginationRoot({ children, totalPages: rawTotalPages, page: controlledPage, defaultPage, onPageChange, edgeCount, siblingCount, size: sizeProp, className, 'aria-label': ariaLabel, ...htmlProps }: PaginationProps): import("react/jsx-runtime").JSX.Element;
 declare function PaginationPrevious({ className, ...htmlProps }: React.ButtonHTMLAttributes<HTMLButtonElement>): import("react/jsx-runtime").JSX.Element;
 declare function PaginationNext({ className, ...htmlProps }: React.ButtonHTMLAttributes<HTMLButtonElement>): import("react/jsx-runtime").JSX.Element;
 declare function PaginationItems(): import("react/jsx-runtime").JSX.Element;

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,UAAU,CAAC;IAC1F,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,yFAAyF;IACzF,UAAU,EAAE,MAAM,CAAC;IACnB,uEAAuE;IACvE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,0EAA0E;IAC1E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,+BAA+B;IAC/B,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,gDAAgD;IAChD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sDAAsD;IACtD,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IACxF,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,iEAAiE;IACjE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AA2JD,iBAAS,cAAc,CAAC,EACtB,QAAQ,EACR,UAAU,EAAE,aAAa,EACzB,IAAI,EAAE,cAAc,EACpB,WAAe,EACf,YAAY,EACZ,SAAa,EACb,YAAgB,EAChB,SAAS,EACT,YAAY,EAAE,SAAS,EACvB,GAAG,SAAS,EACb,EAAE,eAAe,2CAoDjB;AAED,iBAAS,kBAAkB,CAAC,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EAAE,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,2CAmBrG;AAED,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EAAE,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,2CAmBjG;AAED,iBAAS,eAAe,4CAoCvB;AAED,iBAAS,cAAc,CAAC,EACtB,QAAQ,EACR,IAAI,EAAE,QAAQ,EACd,SAAS,EACT,GAAG,SAAS,EACb,EAAE,mBAAmB,2CAoBrB;AAED,iBAAS,kBAAkB,CAAC,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,2CAQ7F;AAMD,eAAO,MAAM,UAAU;;;;;;CAMrB,CAAC;AAEH,OAAO,EACL,cAAc,EACd,kBAAkB,EAClB,cAAc,EACd,eAAe,EACf,cAAc,EACd,kBAAkB,GACnB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,UAAU,CAAC;IAC1F,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,yFAAyF;IACzF,UAAU,EAAE,MAAM,CAAC;IACnB,uEAAuE;IACvE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,0EAA0E;IAC1E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,+BAA+B;IAC/B,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,gDAAgD;IAChD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sDAAsD;IACtD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,4EAA4E;IAC5E,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;CAC3B;AAED,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IACxF,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,iEAAiE;IACjE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AA2JD,iBAAS,cAAc,CAAC,EACtB,QAAQ,EACR,UAAU,EAAE,aAAa,EACzB,IAAI,EAAE,cAAc,EACpB,WAAe,EACf,YAAY,EACZ,SAAa,EACb,YAAgB,EAChB,IAAI,EAAE,QAAQ,EACd,SAAS,EACT,YAAY,EAAE,SAAS,EACvB,GAAG,SAAS,EACb,EAAE,eAAe,2CAqDjB;AAED,iBAAS,kBAAkB,CAAC,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EAAE,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,2CAmBrG;AAED,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EAAE,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,2CAmBjG;AAED,iBAAS,eAAe,4CAoCvB;AAED,iBAAS,cAAc,CAAC,EACtB,QAAQ,EACR,IAAI,EAAE,QAAQ,EACd,SAAS,EACT,GAAG,SAAS,EACb,EAAE,mBAAmB,2CAoBrB;AAED,iBAAS,kBAAkB,CAAC,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,2CAQ7F;AAMD,eAAO,MAAM,UAAU;;;;;;CAMrB,CAAC;AAEH,OAAO,EACL,cAAc,EACd,kBAAkB,EAClB,cAAc,EACd,eAAe,EACf,cAAc,EACd,kBAAkB,GACnB,CAAC"}

package/dist/components/Pagination/index.js

@@ -1,6 +1,7 @@
 "use client";
 import { jsx, Fragment } from "react/jsx-runtime";
 import * as React from "react";
+import { useResolvedControlSize } from "../ComponentDefaults/index.js";
 import styles from "./Pagination.module.scss.js";
 const PaginationContext = React.createContext(null);
 function usePaginationContext() {
@@ -105,10 +106,12 @@ function PaginationRoot({
   onPageChange,
   edgeCount = 1,
   siblingCount = 1,
+  size: sizeProp,
   className,
   "aria-label": ariaLabel,
   ...htmlProps
 }) {
+  const size = useResolvedControlSize(sizeProp);
   const totalPages = Math.max(0, Math.floor(rawTotalPages));
   const [uncontrolledPage, setUncontrolledPage] = React.useState(
     () => totalPages > 0 ? clamp(defaultPage, 1, totalPages) : 1
@@ -137,7 +140,7 @@ function PaginationRoot({
       {
         ...htmlProps,
         "aria-label": ariaLabel ?? "Pagination",
-        className: [styles.pagination, className].filter(Boolean).join(" ")
+        className: [styles.pagination, styles[size], className].filter(Boolean).join(" ")
       }
     );
   }
@@ -146,7 +149,7 @@ function PaginationRoot({
     {
       ...htmlProps,
       "aria-label": ariaLabel ?? "Pagination",
-      className: [styles.pagination, className].filter(Boolean).join(" "),
+      className: [styles.pagination, styles[size], className].filter(Boolean).join(" "),
       children: /* @__PURE__ */ jsx("ul", { className: styles.list, children })
     }
   ) });

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

@@ -1,15 +1,15 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const positioner = "_positioner_1pyvn_1";
-const popup = "_popup_1pyvn_6";
-const sm = "_sm_1pyvn_47";
-const lg = "_lg_1pyvn_52";
-const title = "_title_1pyvn_57";
-const description = "_description_1pyvn_65";
-const close = "_close_1pyvn_72";
-const arrow = "_arrow_1pyvn_119";
-const body = "_body_1pyvn_143";
-const footer = "_footer_1pyvn_147";
+const positioner = "_positioner_wq09b_1";
+const popup = "_popup_wq09b_6";
+const sm = "_sm_wq09b_49";
+const lg = "_lg_wq09b_54";
+const title = "_title_wq09b_59";
+const description = "_description_wq09b_69";
+const close = "_close_wq09b_79";
+const arrow = "_arrow_wq09b_165";
+const body = "_body_wq09b_189";
+const footer = "_footer_wq09b_193";
 const styles = {
   positioner,
   popup,

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

@@ -1,13 +1,13 @@
-const positioner = "_positioner_1pyvn_1";
-const popup = "_popup_1pyvn_6";
-const sm = "_sm_1pyvn_47";
-const lg = "_lg_1pyvn_52";
-const title = "_title_1pyvn_57";
-const description = "_description_1pyvn_65";
-const close = "_close_1pyvn_72";
-const arrow = "_arrow_1pyvn_119";
-const body = "_body_1pyvn_143";
-const footer = "_footer_1pyvn_147";
+const positioner = "_positioner_wq09b_1";
+const popup = "_popup_wq09b_6";
+const sm = "_sm_wq09b_49";
+const lg = "_lg_wq09b_54";
+const title = "_title_wq09b_59";
+const description = "_description_wq09b_69";
+const close = "_close_wq09b_79";
+const arrow = "_arrow_wq09b_165";
+const body = "_body_wq09b_189";
+const footer = "_footer_wq09b_193";
 const styles = {
   positioner,
   popup,

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

@@ -1,31 +1,30 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const root = "_root_le29r_1";
-const header = "_header_le29r_9";
-const label = "_label_le29r_16";
-const value = "_value_le29r_22";
-const track = "_track_le29r_28";
-const trackSm = "_trackSm_le29r_36";
-const trackMd = "_trackMd_le29r_40";
-const trackLg = "_trackLg_le29r_44";
-const indicator = "_indicator_le29r_48";
-const indicatorNeutral = "_indicatorNeutral_le29r_55";
-const indicatorSuccess = "_indicatorSuccess_le29r_59";
-const indicatorWarning = "_indicatorWarning_le29r_63";
-const indicatorDanger = "_indicatorDanger_le29r_67";
-const indicatorIndeterminate = "_indicatorIndeterminate_le29r_71";
-const circular = "_circular_le29r_91";
-const circularSvg = "_circularSvg_le29r_98";
-const circularTrack = "_circularTrack_le29r_102";
-const circularIndicator = "_circularIndicator_le29r_107";
-const circularIndicatorSuccess = "_circularIndicatorSuccess_le29r_114";
-const circularIndicatorWarning = "_circularIndicatorWarning_le29r_118";
-const circularIndicatorDanger = "_circularIndicatorDanger_le29r_122";
-const circularIndicatorIndeterminate = "_circularIndicatorIndeterminate_le29r_126";
-const circularValue = "_circularValue_le29r_143";
-const circularSm = "_circularSm_le29r_151";
-const circularMd = "_circularMd_le29r_159";
-const circularLg = "_circularLg_le29r_164";
+const root = "_root_cypmg_1";
+const header = "_header_cypmg_8";
+const label = "_label_cypmg_20";
+const value = "_value_cypmg_24";
+const track = "_track_cypmg_29";
+const trackSm = "_trackSm_cypmg_38";
+const trackMd = "_trackMd_cypmg_45";
+const trackLg = "_trackLg_cypmg_52";
+const indicator = "_indicator_cypmg_59";
+const indicatorNeutral = "_indicatorNeutral_cypmg_66";
+const indicatorSuccess = "_indicatorSuccess_cypmg_70";
+const indicatorWarning = "_indicatorWarning_cypmg_74";
+const indicatorDanger = "_indicatorDanger_cypmg_78";
+const indicatorIndeterminate = "_indicatorIndeterminate_cypmg_82";
+const circular = "_circular_cypmg_98";
+const circularSvg = "_circularSvg_cypmg_107";
+const circularTrack = "_circularTrack_cypmg_113";
+const circularIndicator = "_circularIndicator_cypmg_118";
+const circularIndicatorSuccess = "_circularIndicatorSuccess_cypmg_126";
+const circularIndicatorWarning = "_circularIndicatorWarning_cypmg_130";
+const circularIndicatorDanger = "_circularIndicatorDanger_cypmg_134";
+const circularIndicatorIndeterminate = "_circularIndicatorIndeterminate_cypmg_138";
+const circularValue = "_circularValue_cypmg_155";
+const circularValueCompact = "_circularValueCompact_cypmg_161";
+const circularValueStandard = "_circularValueStandard_cypmg_169";
 const styles = {
   root,
   header,
@@ -50,9 +49,8 @@ const styles = {
   circularIndicatorDanger,
   circularIndicatorIndeterminate,
   circularValue,
-  circularSm,
-  circularMd,
-  circularLg
+  circularValueCompact,
+  circularValueStandard
 };
 exports.circular = circular;
 exports.circularIndicator = circularIndicator;
@@ -60,12 +58,11 @@ exports.circularIndicatorDanger = circularIndicatorDanger;
 exports.circularIndicatorIndeterminate = circularIndicatorIndeterminate;
 exports.circularIndicatorSuccess = circularIndicatorSuccess;
 exports.circularIndicatorWarning = circularIndicatorWarning;
-exports.circularLg = circularLg;
-exports.circularMd = circularMd;
-exports.circularSm = circularSm;
 exports.circularSvg = circularSvg;
 exports.circularTrack = circularTrack;
 exports.circularValue = circularValue;
+exports.circularValueCompact = circularValueCompact;
+exports.circularValueStandard = circularValueStandard;
 exports.default = styles;
 exports.header = header;
 exports.indicator = indicator;