@usefragments/ui 1.5.4 → 1.7.0

package/dist/components/Loading/index.cjs

@@ -51,68 +51,53 @@ function PulseAnimation({ className }) {
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: Loading_module.default.pulseDot })
   ] });
 }
-const LoadingRoot = React__namespace.forwardRef(
-  function LoadingRoot2({
-    size = "md",
-    variant = "spinner",
-    label = "Loading...",
-    centered = false,
-    fill = false,
-    overlay = false,
-    color = "accent",
-    className,
-    ...htmlProps
-  }, ref) {
-    const classes = [
-      Loading_module.default.loading,
-      Loading_module.default[size],
-      Loading_module.default[variant],
-      Loading_module.default[`color-${color}`],
-      centered && Loading_module.default.centered,
-      fill && Loading_module.default.fill,
-      overlay && Loading_module.default.overlay,
-      className
-    ].filter(Boolean).join(" ");
-    const animation = variant === "dots" ? /* @__PURE__ */ jsxRuntime.jsx(DotsAnimation, { className: Loading_module.default.dots }) : variant === "pulse" ? /* @__PURE__ */ jsxRuntime.jsx(PulseAnimation, { className: Loading_module.default.pulse }) : /* @__PURE__ */ jsxRuntime.jsx(SpinnerIcon, { className: Loading_module.default.spinnerIcon });
-    const content = /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        ref,
-        className: classes,
-        role: "status",
-        "aria-label": label,
-        "aria-live": "polite",
-        ...htmlProps,
-        children: animation
-      }
-    );
-    if (overlay) {
-      return /* @__PURE__ */ jsxRuntime.jsx("div", { className: Loading_module.default.overlayBackdrop, children: content });
-    }
-    return content;
-  }
-);
-function LoadingInline({
-  size = "sm",
+const LoadingRoot = React__namespace.forwardRef(function LoadingRoot2({
+  size = "md",
+  variant = "spinner",
   label = "Loading...",
+  centered = false,
+  fill = false,
+  overlay = false,
+  color = "accent",
   className,
   ...htmlProps
-}) {
+}, ref) {
   const classes = [
-    Loading_module.default.inline,
-    Loading_module.default[`inline-${size}`],
+    Loading_module.default.loading,
+    Loading_module.default[size],
+    Loading_module.default[variant],
+    Loading_module.default[`color-${color}`],
+    centered && Loading_module.default.centered,
+    fill && Loading_module.default.fill,
+    overlay && Loading_module.default.overlay,
     className
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "span",
+  const animation = variant === "dots" ? /* @__PURE__ */ jsxRuntime.jsx(DotsAnimation, { className: Loading_module.default.dotsTrack }) : variant === "pulse" ? /* @__PURE__ */ jsxRuntime.jsx(PulseAnimation, { className: Loading_module.default.pulseTrack }) : /* @__PURE__ */ jsxRuntime.jsx(SpinnerIcon, { className: Loading_module.default.spinnerIcon });
+  const content = /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
     {
+      ref,
       className: classes,
       role: "status",
       "aria-label": label,
+      "aria-live": "polite",
       ...htmlProps,
-      children: /* @__PURE__ */ jsxRuntime.jsx(SpinnerIcon, { className: Loading_module.default.inlineSpinner })
+      children: animation
     }
   );
+  if (overlay) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: Loading_module.default.overlayBackdrop, children: content });
+  }
+  return content;
+});
+function LoadingInline({
+  size = "sm",
+  label = "Loading...",
+  className,
+  ...htmlProps
+}) {
+  const classes = [Loading_module.default.inline, Loading_module.default[`inline-${size}`], className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { className: classes, role: "status", "aria-label": label, ...htmlProps, children: /* @__PURE__ */ jsxRuntime.jsx(SpinnerIcon, { className: Loading_module.default.inlineSpinner }) });
 }
 function LoadingScreen({
   size = "lg",
@@ -122,24 +107,11 @@ function LoadingScreen({
   className,
   ...htmlProps
 }) {
-  const classes = [
-    Loading_module.default.screen,
-    className
-  ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      className: classes,
-      role: "status",
-      "aria-label": label,
-      "aria-live": "polite",
-      ...htmlProps,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(LoadingRoot, { size, variant, label }),
-        showLabel && /* @__PURE__ */ jsxRuntime.jsx("span", { className: Loading_module.default.screenLabel, children: label })
-      ]
-    }
-  );
+  const classes = [Loading_module.default.screen, className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes, role: "status", "aria-label": label, "aria-live": "polite", ...htmlProps, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(LoadingRoot, { size, variant, label }),
+    showLabel && /* @__PURE__ */ jsxRuntime.jsx("span", { className: Loading_module.default.screenLabel, children: label })
+  ] });
 }
 const Loading = Object.assign(LoadingRoot, {
   Inline: LoadingInline,

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

@@ -1,6 +1,6 @@
-import * as React from 'react';
-export type LoadingSize = 'sm' | 'md' | 'lg' | 'xl';
-export type LoadingVariant = 'spinner' | 'dots' | 'pulse';
+import * as React from "react";
+export type LoadingSize = "sm" | "md" | "lg" | "xl";
+export type LoadingVariant = "spinner" | "dots" | "pulse";
 export interface LoadingProps extends React.HTMLAttributes<HTMLDivElement> {
     /** Size of the loading indicator */
     size?: LoadingSize;
@@ -15,11 +15,11 @@ export interface LoadingProps extends React.HTMLAttributes<HTMLDivElement> {
     /** Whether to show the loading indicator with a backdrop overlay */
     overlay?: boolean;
     /** Color variant - uses accent color by default, 'current' inherits text color */
-    color?: 'accent' | 'current' | 'muted';
+    color?: "accent" | "current" | "muted";
 }
 export interface LoadingInlineProps extends React.HTMLAttributes<HTMLSpanElement> {
     /** Size of the loading indicator */
-    size?: 'sm' | 'md';
+    size?: "sm" | "md";
     /** Accessible label */
     label?: string;
 }
@@ -40,5 +40,5 @@ export declare const Loading: React.ForwardRefExoticComponent<LoadingProps & Rea
     Inline: typeof LoadingInline;
     Screen: typeof LoadingScreen;
 };
-export { LoadingRoot, LoadingInline, LoadingScreen, };
+export { LoadingRoot, LoadingInline, LoadingScreen };
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Loading/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,MAAM,MAAM,WAAW,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AACpD,MAAM,MAAM,cAAc,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,CAAC;AAE1D,MAAM,WAAW,YAAa,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACxE,oCAAoC;IACpC,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,4CAA4C;IAC5C,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,0CAA0C;IAC1C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2CAA2C;IAC3C,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,oEAAoE;IACpE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kFAAkF;IAClF,KAAK,CAAC,EAAE,QAAQ,GAAG,SAAS,GAAG,OAAO,CAAC;CACxC;AAED,MAAM,WAAW,kBAAmB,SAAQ,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;IAC/E,oCAAoC;IACpC,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB,uBAAuB;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,kBAAmB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC9E,6BAA6B;IAC7B,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,gCAAgC;IAChC,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,qCAAqC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,8CAA8C;IAC9C,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AA+CD,QAAA,MAAM,WAAW,qFAyDhB,CAAC;AAMF,iBAAS,aAAa,CAAC,EACrB,IAAW,EACX,KAAoB,EACpB,SAAS,EACT,GAAG,SAAS,EACb,EAAE,kBAAkB,2CAmBpB;AAMD,iBAAS,aAAa,CAAC,EACrB,IAAW,EACX,OAAmB,EACnB,KAAoB,EACpB,SAAiB,EACjB,SAAS,EACT,GAAG,SAAS,EACb,EAAE,kBAAkB,2CAoBpB;AAMD,eAAO,MAAM,OAAO;;;CAGlB,CAAC;AAGH,OAAO,EACL,WAAW,EACX,aAAa,EACb,aAAa,GACd,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Loading/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,MAAM,MAAM,WAAW,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AACpD,MAAM,MAAM,cAAc,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,CAAC;AAE1D,MAAM,WAAW,YAAa,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACxE,oCAAoC;IACpC,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,4CAA4C;IAC5C,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,0CAA0C;IAC1C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2CAA2C;IAC3C,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,oEAAoE;IACpE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kFAAkF;IAClF,KAAK,CAAC,EAAE,QAAQ,GAAG,SAAS,GAAG,OAAO,CAAC;CACxC;AAED,MAAM,WAAW,kBAAmB,SAAQ,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;IAC/E,oCAAoC;IACpC,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB,uBAAuB;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,kBAAmB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC9E,6BAA6B;IAC7B,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,gCAAgC;IAChC,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,qCAAqC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,8CAA8C;IAC9C,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AA+CD,QAAA,MAAM,WAAW,qFAsDf,CAAC;AAMH,iBAAS,aAAa,CAAC,EACrB,IAAW,EACX,KAAoB,EACpB,SAAS,EACT,GAAG,SAAS,EACb,EAAE,kBAAkB,2CAQpB;AAMD,iBAAS,aAAa,CAAC,EACrB,IAAW,EACX,OAAmB,EACnB,KAAoB,EACpB,SAAiB,EACjB,SAAS,EACT,GAAG,SAAS,EACb,EAAE,kBAAkB,2CASpB;AAMD,eAAO,MAAM,OAAO;;;CAGlB,CAAC;AAGH,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,aAAa,EAAE,CAAC"}

package/dist/components/Loading/index.js

@@ -32,68 +32,53 @@ function PulseAnimation({ className }) {
     /* @__PURE__ */ jsx("span", { className: styles.pulseDot })
   ] });
 }
-const LoadingRoot = React.forwardRef(
-  function LoadingRoot2({
-    size = "md",
-    variant = "spinner",
-    label = "Loading...",
-    centered = false,
-    fill = false,
-    overlay = false,
-    color = "accent",
-    className,
-    ...htmlProps
-  }, ref) {
-    const classes = [
-      styles.loading,
-      styles[size],
-      styles[variant],
-      styles[`color-${color}`],
-      centered && styles.centered,
-      fill && styles.fill,
-      overlay && styles.overlay,
-      className
-    ].filter(Boolean).join(" ");
-    const animation = variant === "dots" ? /* @__PURE__ */ jsx(DotsAnimation, { className: styles.dots }) : variant === "pulse" ? /* @__PURE__ */ jsx(PulseAnimation, { className: styles.pulse }) : /* @__PURE__ */ jsx(SpinnerIcon, { className: styles.spinnerIcon });
-    const content = /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref,
-        className: classes,
-        role: "status",
-        "aria-label": label,
-        "aria-live": "polite",
-        ...htmlProps,
-        children: animation
-      }
-    );
-    if (overlay) {
-      return /* @__PURE__ */ jsx("div", { className: styles.overlayBackdrop, children: content });
-    }
-    return content;
-  }
-);
-function LoadingInline({
-  size = "sm",
+const LoadingRoot = React.forwardRef(function LoadingRoot2({
+  size = "md",
+  variant = "spinner",
   label = "Loading...",
+  centered = false,
+  fill = false,
+  overlay = false,
+  color = "accent",
   className,
   ...htmlProps
-}) {
+}, ref) {
   const classes = [
-    styles.inline,
-    styles[`inline-${size}`],
+    styles.loading,
+    styles[size],
+    styles[variant],
+    styles[`color-${color}`],
+    centered && styles.centered,
+    fill && styles.fill,
+    overlay && styles.overlay,
     className
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ jsx(
-    "span",
+  const animation = variant === "dots" ? /* @__PURE__ */ jsx(DotsAnimation, { className: styles.dotsTrack }) : variant === "pulse" ? /* @__PURE__ */ jsx(PulseAnimation, { className: styles.pulseTrack }) : /* @__PURE__ */ jsx(SpinnerIcon, { className: styles.spinnerIcon });
+  const content = /* @__PURE__ */ jsx(
+    "div",
     {
+      ref,
       className: classes,
       role: "status",
       "aria-label": label,
+      "aria-live": "polite",
       ...htmlProps,
-      children: /* @__PURE__ */ jsx(SpinnerIcon, { className: styles.inlineSpinner })
+      children: animation
     }
   );
+  if (overlay) {
+    return /* @__PURE__ */ jsx("div", { className: styles.overlayBackdrop, children: content });
+  }
+  return content;
+});
+function LoadingInline({
+  size = "sm",
+  label = "Loading...",
+  className,
+  ...htmlProps
+}) {
+  const classes = [styles.inline, styles[`inline-${size}`], className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsx("span", { className: classes, role: "status", "aria-label": label, ...htmlProps, children: /* @__PURE__ */ jsx(SpinnerIcon, { className: styles.inlineSpinner }) });
 }
 function LoadingScreen({
   size = "lg",
@@ -103,24 +88,11 @@ function LoadingScreen({
   className,
   ...htmlProps
 }) {
-  const classes = [
-    styles.screen,
-    className
-  ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: classes,
-      role: "status",
-      "aria-label": label,
-      "aria-live": "polite",
-      ...htmlProps,
-      children: [
-        /* @__PURE__ */ jsx(LoadingRoot, { size, variant, label }),
-        showLabel && /* @__PURE__ */ jsx("span", { className: styles.screenLabel, children: label })
-      ]
-    }
-  );
+  const classes = [styles.screen, className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxs("div", { className: classes, role: "status", "aria-label": label, "aria-live": "polite", ...htmlProps, children: [
+    /* @__PURE__ */ jsx(LoadingRoot, { size, variant, label }),
+    showLabel && /* @__PURE__ */ jsx("span", { className: styles.screenLabel, children: label })
+  ] });
 }
 const Loading = Object.assign(LoadingRoot, {
   Inline: LoadingInline,

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

@@ -1,12 +1,12 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const root = "_root_1wv9j_1";
-const full = "_full_1wv9j_10";
-const narrow = "_narrow_1wv9j_14";
-const header = "_header_1wv9j_18";
-const description = "_description_1wv9j_19";
-const content = "_content_1wv9j_20";
-const footer = "_footer_1wv9j_21";
+const root = "_root_1gcej_1";
+const full = "_full_1gcej_10";
+const narrow = "_narrow_1gcej_14";
+const header = "_header_1gcej_18";
+const description = "_description_1gcej_19";
+const content = "_content_1gcej_20";
+const footer = "_footer_1gcej_21";
 const styles = {
   root,
   full,

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

@@ -1,10 +1,10 @@
-const root = "_root_1wv9j_1";
-const full = "_full_1wv9j_10";
-const narrow = "_narrow_1wv9j_14";
-const header = "_header_1wv9j_18";
-const description = "_description_1wv9j_19";
-const content = "_content_1wv9j_20";
-const footer = "_footer_1wv9j_21";
+const root = "_root_1gcej_1";
+const full = "_full_1gcej_10";
+const narrow = "_narrow_1gcej_14";
+const header = "_header_1gcej_18";
+const description = "_description_1gcej_19";
+const content = "_content_1gcej_20";
+const footer = "_footer_1gcej_21";
 const styles = {
   root,
   full,

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

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const markdown = "_markdown_1396t_1";
+const markdown = "_markdown_v14j4_2";
 const styles = {
   markdown
 };

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

@@ -1,4 +1,4 @@
-const markdown = "_markdown_1396t_1";
+const markdown = "_markdown_v14j4_2";
 const styles = {
   markdown
 };

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

@@ -1,6 +1,6 @@
-import * as React from 'react';
+import * as React from "react";
 type MarkdownComponentMap = Record<string, React.ComponentType<any>>;
-export interface MarkdownProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {
+export interface MarkdownProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "children"> {
     /** Markdown string to render */
     content: string;
     /** Override map for markdown element components */

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Markdown/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,KAAK,oBAAoB,GAAG,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC;AAErE,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IAC3F,gCAAgC;IAChC,OAAO,EAAE,MAAM,CAAC;IAChB,mDAAmD;IACnD,UAAU,CAAC,EAAE,oBAAoB,CAAC;IAClC,4BAA4B;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAiBD;;;;;;;;GAQG;AACH,iBAAS,QAAQ,IAAI,OAAO,CAAC,IAAI,CAAC,CA2BjC;AAiED,eAAO,MAAM,QAAQ;;IAEnB;;;;OAIG;;CAEH,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Markdown/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,KAAK,oBAAoB,GAAG,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC;AAErE,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IAC3F,gCAAgC;IAChC,OAAO,EAAE,MAAM,CAAC;IAChB,mDAAmD;IACnD,UAAU,CAAC,EAAE,oBAAoB,CAAC;IAClC,4BAA4B;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAiBD;;;;;;;;GAQG;AACH,iBAAS,QAAQ,IAAI,OAAO,CAAC,IAAI,CAAC,CA2BjC;AA+DD,eAAO,MAAM,QAAQ;;IAEnB;;;;OAIG;;CAEH,CAAC"}

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

@@ -1,19 +1,19 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const positioner = "_positioner_v24st_1";
-const popup = "_popup_v24st_7";
-const viewport = "_viewport_v24st_32";
-const item = "_item_v24st_37";
-const itemDanger = "_itemDanger_v24st_78";
-const itemIcon = "_itemIcon_v24st_86";
-const itemLabel = "_itemLabel_v24st_102";
-const itemShortcut = "_itemShortcut_v24st_106";
-const checkIndicator = "_checkIndicator_v24st_112";
-const radioIndicator = "_radioIndicator_v24st_126";
-const radioItem = "_radioItem_v24st_139";
-const separator = "_separator_v24st_144";
-const groupLabel = "_groupLabel_v24st_150";
-const submenuTrigger = "_submenuTrigger_v24st_183";
+const positioner = "_positioner_13yql_1";
+const popup = "_popup_13yql_9";
+const viewport = "_viewport_13yql_59";
+const item = "_item_13yql_66";
+const itemDanger = "_itemDanger_13yql_90";
+const itemIcon = "_itemIcon_13yql_98";
+const checkIndicator = "_checkIndicator_13yql_99";
+const radioIndicator = "_radioIndicator_13yql_100";
+const itemLabel = "_itemLabel_13yql_120";
+const itemShortcut = "_itemShortcut_13yql_125";
+const radioItem = "_radioItem_13yql_151";
+const separator = "_separator_13yql_156";
+const groupLabel = "_groupLabel_13yql_162";
+const submenuTrigger = "_submenuTrigger_13yql_176";
 const styles = {
   positioner,
   popup,
@@ -21,10 +21,10 @@ const styles = {
   item,
   itemDanger,
   itemIcon,
-  itemLabel,
-  itemShortcut,
   checkIndicator,
   radioIndicator,
+  itemLabel,
+  itemShortcut,
   radioItem,
   separator,
   groupLabel,

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

@@ -1,17 +1,17 @@
-const positioner = "_positioner_v24st_1";
-const popup = "_popup_v24st_7";
-const viewport = "_viewport_v24st_32";
-const item = "_item_v24st_37";
-const itemDanger = "_itemDanger_v24st_78";
-const itemIcon = "_itemIcon_v24st_86";
-const itemLabel = "_itemLabel_v24st_102";
-const itemShortcut = "_itemShortcut_v24st_106";
-const checkIndicator = "_checkIndicator_v24st_112";
-const radioIndicator = "_radioIndicator_v24st_126";
-const radioItem = "_radioItem_v24st_139";
-const separator = "_separator_v24st_144";
-const groupLabel = "_groupLabel_v24st_150";
-const submenuTrigger = "_submenuTrigger_v24st_183";
+const positioner = "_positioner_13yql_1";
+const popup = "_popup_13yql_9";
+const viewport = "_viewport_13yql_59";
+const item = "_item_13yql_66";
+const itemDanger = "_itemDanger_13yql_90";
+const itemIcon = "_itemIcon_13yql_98";
+const checkIndicator = "_checkIndicator_13yql_99";
+const radioIndicator = "_radioIndicator_13yql_100";
+const itemLabel = "_itemLabel_13yql_120";
+const itemShortcut = "_itemShortcut_13yql_125";
+const radioItem = "_radioItem_13yql_151";
+const separator = "_separator_13yql_156";
+const groupLabel = "_groupLabel_13yql_162";
+const submenuTrigger = "_submenuTrigger_13yql_176";
 const styles = {
   positioner,
   popup,
@@ -19,10 +19,10 @@ const styles = {
   item,
   itemDanger,
   itemIcon,
-  itemLabel,
-  itemShortcut,
   checkIndicator,
   radioIndicator,
+  itemLabel,
+  itemShortcut,
   radioItem,
   separator,
   groupLabel,

package/dist/components/Menu/index.cjs

@@ -4,6 +4,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const menu = require("@base-ui/react/menu");
+const popup = require("../../recipes/popup.cjs");
 const Menu_module = require("./Menu.module.scss.cjs");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
@@ -54,30 +55,23 @@ function DotIcon() {
     }
   );
 }
-function MenuRoot({
-  children,
-  open,
-  defaultOpen,
-  onOpenChange,
-  modal = true
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    menu.Menu.Root,
-    {
-      open,
-      defaultOpen,
-      onOpenChange,
-      modal,
-      children
-    }
-  );
+function MenuRoot({ children, open, defaultOpen, onOpenChange, modal = true }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(menu.Menu.Root, { open, defaultOpen, onOpenChange, modal, children });
 }
 function MenuTrigger({ children, asChild, className, ...htmlProps }) {
   if (asChild) {
     if (!React__namespace.isValidElement(children)) {
       throw new Error("Menu.Trigger with asChild requires a single valid React element child.");
     }
-    return /* @__PURE__ */ jsxRuntime.jsx(menu.Menu.Trigger, { ...htmlProps, className, render: children, children: null });
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      menu.Menu.Trigger,
+      {
+        ...htmlProps,
+        className,
+        render: children,
+        children: null
+      }
+    );
   }
   return /* @__PURE__ */ jsxRuntime.jsx(
     menu.Menu.Trigger,
@@ -94,7 +88,7 @@ function MenuContent({
   className,
   side = "bottom",
   align = "start",
-  sideOffset = 4,
+  sideOffset = popup.POPUP_OFFSET_PX,
   ...htmlProps
 }) {
   const popupClasses = [Menu_module.default.popup, className].filter(Boolean).join(" ");
@@ -129,11 +123,7 @@ function MenuItem({
     [htmlProps, onSelect]
   );
   const hasChecked = checked !== void 0;
-  const classes = [
-    Menu_module.default.item,
-    danger && Menu_module.default.itemDanger,
-    className
-  ].filter(Boolean).join(" ");
+  const classes = [Menu_module.default.item, danger && Menu_module.default.itemDanger, className].filter(Boolean).join(" ");
   return /* @__PURE__ */ jsxRuntime.jsxs(
     menu.Menu.Item,
     {
@@ -186,29 +176,10 @@ function MenuCheckboxItem({
     }
   );
 }
-function MenuRadioGroup({
-  children,
-  value,
-  defaultValue,
-  onValueChange
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    menu.Menu.RadioGroup,
-    {
-      value,
-      defaultValue,
-      onValueChange,
-      children
-    }
-  );
+function MenuRadioGroup({ children, value, defaultValue, onValueChange }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(menu.Menu.RadioGroup, { value, defaultValue, onValueChange, children });
 }
-function MenuRadioItem({
-  children,
-  value,
-  disabled,
-  className,
-  ...htmlProps
-}) {
+function MenuRadioItem({ children, value, disabled, className, ...htmlProps }) {
   const classes = [Menu_module.default.item, Menu_module.default.radioItem, className].filter(Boolean).join(" ");
   return /* @__PURE__ */ jsxRuntime.jsxs(menu.Menu.RadioItem, { ...htmlProps, value, disabled, className: classes, children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: Menu_module.default.radioIndicator, children: /* @__PURE__ */ jsxRuntime.jsx(DotIcon, {}) }),
@@ -227,21 +198,8 @@ function MenuSeparator({ className, ...htmlProps }) {
   const classes = [Menu_module.default.separator, className].filter(Boolean).join(" ");
   return /* @__PURE__ */ jsxRuntime.jsx(menu.Menu.Separator, { ...htmlProps, className: classes });
 }
-function MenuSubmenu({
-  children,
-  open,
-  defaultOpen,
-  onOpenChange
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    menu.Menu.SubmenuRoot,
-    {
-      open,
-      defaultOpen,
-      onOpenChange,
-      children
-    }
-  );
+function MenuSubmenu({ children, open, defaultOpen, onOpenChange }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(menu.Menu.SubmenuRoot, { open, defaultOpen, onOpenChange, children });
 }
 function MenuSubmenuTrigger({
   children,