@7onic-ui/react 0.3.13 → 0.3.15

package/dist/components/breadcrumb.mjs

@@ -8,7 +8,7 @@ import {
   BreadcrumbPage,
   BreadcrumbSeparator,
   breadcrumbSizeMap
-} from "../chunk-ZN7DBSKH.mjs";
+} from "../chunk-MUAIQGMU.mjs";
 import "../chunk-53MIUPSY.mjs";
 export {
   Breadcrumb,

package/dist/components/button.mjs

@@ -2,7 +2,7 @@
 import {
   Button,
   buttonVariants
-} from "../chunk-IPCIC2BI.mjs";
+} from "../chunk-YJFM5CG5.mjs";
 import "../chunk-Q5WVLK2L.mjs";
 import "../chunk-53MIUPSY.mjs";
 export {

package/dist/components/icon-button.mjs

@@ -2,7 +2,7 @@
 import {
   IconButton,
   iconButtonVariants
-} from "../chunk-ZDRUTJ4T.mjs";
+} from "../chunk-CAKZAZRW.mjs";
 import "../chunk-Q5WVLK2L.mjs";
 import "../chunk-53MIUPSY.mjs";
 export {

package/dist/components/navigation-menu.mjs

@@ -10,7 +10,7 @@ import {
   NavigationMenuTrigger,
   NavigationMenuViewport,
   navigationMenuSizeMap
-} from "../chunk-C5D3VRNJ.mjs";
+} from "../chunk-4ATPYNTP.mjs";
 import "../chunk-53MIUPSY.mjs";
 export {
   NavigationMenu,

package/dist/index.d.ts

@@ -713,7 +713,7 @@ interface BadgeProps extends React.HTMLAttributes<HTMLSpanElement>, VariantProps
     icon?: React.ReactNode;
     /** Show a status dot before text */
     dot?: boolean;
-    /** Show a remove button */
+    /** Show a remove button (not rendered with asChild — a button inside a link is invalid HTML) */
     removable?: boolean;
     /** Callback when remove button is clicked */
     onRemove?: () => void;

package/dist/index.js

@@ -587,24 +587,30 @@ function flattenFragments(children) {
     ) : [node]
   );
 }
+function classifyNodes(nodes) {
+  const known = nodes.map((node) => {
+    const type = React2.isValidElement(node) ? node.type : null;
+    return type === BreadcrumbSeparator ? "separator" : type === BreadcrumbItem ? "item" : null;
+  });
+  if (known.every((kind) => kind === null)) {
+    return nodes.map((_, i) => i % 2 === 0 ? "item" : "separator");
+  }
+  return known.map((kind) => kind ?? "item");
+}
 function collapseItems(children, maxItems, before, after) {
   if (maxItems === void 0) return children;
   const nodes = flattenFragments(children);
+  const kinds = classifyNodes(nodes);
   const segments = [];
   let pendingSeparator = null;
-  for (const node of nodes) {
-    const type = React2.isValidElement(node) ? node.type : null;
-    if (type === BreadcrumbSeparator) {
+  nodes.forEach((node, i) => {
+    if (kinds[i] === "separator") {
       pendingSeparator = node;
-    } else if (type === BreadcrumbItem) {
+    } else {
       segments.push({ separator: pendingSeparator, nodes: [node] });
       pendingSeparator = null;
-    } else if (segments.length > 0) {
-      segments[segments.length - 1].nodes.push(node);
-    } else {
-      segments.push({ separator: null, nodes: [node] });
     }
-  }
+  });
   if (segments.length <= maxItems || before + after >= segments.length) return children;
   const head = segments.slice(0, before);
   const tail = segments.slice(segments.length - after);
@@ -860,6 +866,16 @@ var buttonVariants = (0, import_class_variance_authority3.cva)(
     }
   }
 );
+var REACT_LAZY_TYPE = /* @__PURE__ */ Symbol.for("react.lazy");
+function renderInsideChild(children, render) {
+  let child = children;
+  const resolve = React5.use;
+  if (typeof child === "object" && child !== null && child.$$typeof === REACT_LAZY_TYPE && typeof resolve === "function") {
+    child = resolve(child._payload);
+  }
+  if (!React5.isValidElement(child)) return render(children);
+  return React5.cloneElement(child, void 0, render(child.props.children));
+}
 var Button = React5.forwardRef(
   ({
     className,
@@ -903,6 +919,17 @@ var Button = React5.forwardRef(
       // icon-only → 20px
     }[size || "default"];
     const selectedStyles = selected ? variant === "outline" ? "bg-background-muted" : variant === "ghost" ? "font-semibold" : "" : "";
+    const renderContent = (content) => loading ? /* @__PURE__ */ React5.createElement(React5.Fragment, null, /* @__PURE__ */ React5.createElement(
+      "svg",
+      {
+        className: cn(iconSizeClass, "animate-spin"),
+        fill: "none",
+        viewBox: "0 0 24 24",
+        "aria-hidden": "true"
+      },
+      /* @__PURE__ */ React5.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }),
+      /* @__PURE__ */ React5.createElement("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })
+    ), /* @__PURE__ */ React5.createElement("span", null, content)) : /* @__PURE__ */ React5.createElement(React5.Fragment, null, leftIcon && /* @__PURE__ */ React5.createElement("span", { className: cn(iconSizeClass, "[&>svg]:w-full [&>svg]:h-full"), "aria-hidden": "true" }, leftIcon), content, rightIcon && /* @__PURE__ */ React5.createElement("span", { className: cn(iconSizeClass, "[&>svg]:w-full [&>svg]:h-full"), "aria-hidden": "true" }, rightIcon));
     return /* @__PURE__ */ React5.createElement(
       Comp,
       {
@@ -913,17 +940,7 @@ var Button = React5.forwardRef(
         "aria-pressed": selected || void 0,
         ...props
       },
-      loading ? /* @__PURE__ */ React5.createElement(React5.Fragment, null, /* @__PURE__ */ React5.createElement(
-        "svg",
-        {
-          className: cn(iconSizeClass, "animate-spin"),
-          fill: "none",
-          viewBox: "0 0 24 24",
-          "aria-hidden": "true"
-        },
-        /* @__PURE__ */ React5.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }),
-        /* @__PURE__ */ React5.createElement("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })
-      ), /* @__PURE__ */ React5.createElement("span", null, children)) : /* @__PURE__ */ React5.createElement(React5.Fragment, null, leftIcon && /* @__PURE__ */ React5.createElement("span", { className: cn(iconSizeClass, "[&>svg]:w-full [&>svg]:h-full"), "aria-hidden": "true" }, leftIcon), children, rightIcon && /* @__PURE__ */ React5.createElement("span", { className: cn(iconSizeClass, "[&>svg]:w-full [&>svg]:h-full"), "aria-hidden": "true" }, rightIcon))
+      asChild ? renderInsideChild(children, renderContent) : renderContent(children)
     );
   }
 );
@@ -989,6 +1006,16 @@ var iconButtonVariants = (0, import_class_variance_authority4.cva)(
     }
   }
 );
+var REACT_LAZY_TYPE2 = /* @__PURE__ */ Symbol.for("react.lazy");
+function renderInsideChild2(children, render) {
+  let child = children;
+  const resolve = React6.use;
+  if (typeof child === "object" && child !== null && child.$$typeof === REACT_LAZY_TYPE2 && typeof resolve === "function") {
+    child = resolve(child._payload);
+  }
+  if (!React6.isValidElement(child)) return render(children);
+  return React6.cloneElement(child, void 0, render(child.props.children));
+}
 var IconButton = React6.forwardRef(
   ({ className, variant: variantProp, color: colorProp, size: sizeProp, radius: radiusProp, asChild = false, loading, pressEffect, children, disabled: disabledProp, ...props }, ref) => {
     const groupContext = useButtonGroup();
@@ -1010,6 +1037,17 @@ var IconButton = React6.forwardRef(
       lg: "icon-lg"
       // 24px
     }[size || "default"];
+    const renderContent = (content) => loading ? /* @__PURE__ */ React6.createElement(
+      "svg",
+      {
+        className: cn(iconSize, "animate-spin"),
+        fill: "none",
+        viewBox: "0 0 24 24",
+        "aria-hidden": "true"
+      },
+      /* @__PURE__ */ React6.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }),
+      /* @__PURE__ */ React6.createElement("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })
+    ) : /* @__PURE__ */ React6.createElement("span", { className: cn(iconSize, "[&>svg]:w-full [&>svg]:h-full"), "aria-hidden": "true" }, content);
     return /* @__PURE__ */ React6.createElement(
       Comp,
       {
@@ -1019,17 +1057,7 @@ var IconButton = React6.forwardRef(
         "aria-busy": loading || void 0,
         ...props
       },
-      loading ? /* @__PURE__ */ React6.createElement(
-        "svg",
-        {
-          className: cn(iconSize, "animate-spin"),
-          fill: "none",
-          viewBox: "0 0 24 24",
-          "aria-hidden": "true"
-        },
-        /* @__PURE__ */ React6.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }),
-        /* @__PURE__ */ React6.createElement("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })
-      ) : /* @__PURE__ */ React6.createElement("span", { className: cn(iconSize, "[&>svg]:w-full [&>svg]:h-full"), "aria-hidden": "true" }, children)
+      asChild ? renderInsideChild2(children, renderContent) : renderContent(children)
     );
   }
 );
@@ -3521,6 +3549,16 @@ var dotColorMap = {
   error: "bg-error",
   info: "bg-info"
 };
+var REACT_LAZY_TYPE3 = /* @__PURE__ */ Symbol.for("react.lazy");
+function renderInsideChild3(children, render) {
+  let child = children;
+  const resolve = React21.use;
+  if (typeof child === "object" && child !== null && child.$$typeof === REACT_LAZY_TYPE3 && typeof resolve === "function") {
+    child = resolve(child._payload);
+  }
+  if (!React21.isValidElement(child)) return render(children);
+  return React21.cloneElement(child, void 0, render(child.props.children));
+}
 var Badge = React21.forwardRef(
   ({
     className,
@@ -3541,6 +3579,43 @@ var Badge = React21.forwardRef(
     const colorClasses = colorMap[color][variant];
     const outlineClasses = variant === "outline" ? "border bg-transparent" : "";
     const dotColor = variant === "solid" ? "bg-current" : dotColorMap[color];
+    const renderContent = (content) => /* @__PURE__ */ React21.createElement(React21.Fragment, null, dot && /* @__PURE__ */ React21.createElement(
+      "span",
+      {
+        className: cn("shrink-0 rounded-full", badgeDotSizes[resolvedSize], dotColor),
+        "aria-hidden": "true"
+      }
+    ), icon && /* @__PURE__ */ React21.createElement(
+      "span",
+      {
+        className: cn("shrink-0 [&>svg]:w-full [&>svg]:h-full", badgeIconSizes[resolvedSize]),
+        "aria-hidden": "true"
+      },
+      icon
+    ), content, removable && !asChild && /* @__PURE__ */ React21.createElement(
+      "button",
+      {
+        type: "button",
+        className: "shrink-0 -mr-0.5 ml-0.5 rounded-full p-0.5 opacity-70 hover:opacity-100 transition-opacity focus-visible:focus-ring",
+        onClick: (e) => {
+          e.stopPropagation();
+          onRemove?.();
+        },
+        "aria-label": "Remove"
+      },
+      /* @__PURE__ */ React21.createElement(
+        "svg",
+        {
+          className: "w-3 h-3",
+          fill: "none",
+          viewBox: "0 0 24 24",
+          stroke: "currentColor",
+          strokeWidth: 2,
+          "aria-hidden": "true"
+        },
+        /* @__PURE__ */ React21.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 18L18 6M6 6l12 12" })
+      )
+    ));
     return /* @__PURE__ */ React21.createElement(
       Comp,
       {
@@ -3553,46 +3628,7 @@ var Badge = React21.forwardRef(
         ),
         ...props
       },
-      dot && /* @__PURE__ */ React21.createElement(
-        "span",
-        {
-          className: cn("shrink-0 rounded-full", badgeDotSizes[resolvedSize], dotColor),
-          "aria-hidden": "true"
-        }
-      ),
-      icon && /* @__PURE__ */ React21.createElement(
-        "span",
-        {
-          className: cn("shrink-0 [&>svg]:w-full [&>svg]:h-full", badgeIconSizes[resolvedSize]),
-          "aria-hidden": "true"
-        },
-        icon
-      ),
-      children,
-      removable && /* @__PURE__ */ React21.createElement(
-        "button",
-        {
-          type: "button",
-          className: "shrink-0 -mr-0.5 ml-0.5 rounded-full p-0.5 opacity-70 hover:opacity-100 transition-opacity focus-visible:focus-ring",
-          onClick: (e) => {
-            e.stopPropagation();
-            onRemove?.();
-          },
-          "aria-label": "Remove"
-        },
-        /* @__PURE__ */ React21.createElement(
-          "svg",
-          {
-            className: "w-3 h-3",
-            fill: "none",
-            viewBox: "0 0 24 24",
-            stroke: "currentColor",
-            strokeWidth: 2,
-            "aria-hidden": "true"
-          },
-          /* @__PURE__ */ React21.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 18L18 6M6 6l12 12" })
-        )
-      )
+      asChild ? renderInsideChild3(children, renderContent) : renderContent(children)
     );
   }
 );
@@ -4287,6 +4323,16 @@ function ChevronDownIcon({ className }) {
 function ChevronRightIcon2({ className }) {
   return /* @__PURE__ */ React25.createElement("svg", { className, fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2, "aria-hidden": "true" }, /* @__PURE__ */ React25.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M9 5l7 7-7 7" }));
 }
+var REACT_LAZY_TYPE4 = /* @__PURE__ */ Symbol.for("react.lazy");
+function renderInsideChild4(children, render) {
+  let child = children;
+  const resolve = React25.use;
+  if (typeof child === "object" && child !== null && child.$$typeof === REACT_LAZY_TYPE4 && typeof resolve === "function") {
+    child = resolve(child._payload);
+  }
+  if (!React25.isValidElement(child)) return render(children);
+  return React25.cloneElement(child, void 0, render(child.props.children));
+}
 var contentRadiusMap3 = {
   sm: "rounded",
   // 4px
@@ -4636,7 +4682,10 @@ var NavigationMenuLink = React25.forwardRef(
       );
     }
     const Comp = asChild ? import_react_slot6.Slot : "a";
+    const iconNode = icon && /* @__PURE__ */ React25.createElement("span", { className: cn("shrink-0", s.icon) }, icon);
+    const childText = asChild && React25.isValidElement(children) ? children.props.children : children;
     if (inContent) {
+      const renderContent2 = (content) => /* @__PURE__ */ React25.createElement(React25.Fragment, null, iconNode, !collapsed && content);
       return /* @__PURE__ */ React25.createElement(
         Comp,
         {
@@ -4654,10 +4703,10 @@ var NavigationMenuLink = React25.forwardRef(
           ...active ? { "aria-current": "page" } : {},
           ...props
         },
-        icon && /* @__PURE__ */ React25.createElement("span", { className: cn("shrink-0", s.icon) }, icon),
-        !collapsed && children
+        asChild ? renderInsideChild4(children, renderContent2) : renderContent2(children)
       );
     }
+    const renderContent = (content) => /* @__PURE__ */ React25.createElement(React25.Fragment, null, iconNode, !collapsed && /* @__PURE__ */ React25.createElement("span", { className: "truncate" }, content));
     return /* @__PURE__ */ React25.createElement(
       Comp,
       {
@@ -4673,11 +4722,10 @@ var NavigationMenuLink = React25.forwardRef(
           className
         ),
         ...active ? { "aria-current": "page" } : {},
-        ...collapsed && typeof children === "string" ? { title: children } : {},
+        ...collapsed && typeof childText === "string" ? { title: childText } : {},
         ...props
       },
-      icon && /* @__PURE__ */ React25.createElement("span", { className: cn("shrink-0", s.icon) }, icon),
-      !collapsed && /* @__PURE__ */ React25.createElement("span", { className: "truncate" }, children)
+      asChild ? renderInsideChild4(children, renderContent) : renderContent(children)
     );
   }
 );