@particle-academy/react-fancy 4.3.0 → 4.4.0

package/dist/index.cjs

@@ -2396,6 +2396,8 @@ var Button = react.forwardRef(
     loading = false,
     disabled,
     href,
+    responsive,
+    labelClassName,
     ...props
   }, ref) => {
     const isCircle = variant === "circle";
@@ -2507,7 +2509,10 @@ var Button = react.forwardRef(
     const trailingAlert = renderAlertIcon(true);
     if (trailingAlert) trailingElements.push(trailingAlert);
     const classes = cn(
-      "inline-flex items-center justify-center font-medium transition-all duration-200",
+      // `text-left` overrides the UA <button> center default so a wrapped,
+      // width-constrained multi-word label stacks left-aligned. Overridable —
+      // twMerge lets a `text-center` / `text-right` in `className` win.
+      "inline-flex items-center justify-center text-left font-medium transition-all duration-200",
       "focus:outline-none focus:ring-2 focus:ring-offset-1",
       "disabled:opacity-50 disabled:cursor-not-allowed",
       isCircle ? "rounded-full" : "rounded-lg",
@@ -2529,7 +2534,22 @@ var Button = react.forwardRef(
       }
     ) : icon ? /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: icon, size: iconSizeMap[size] }) : children }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
       leadingElements,
-      children != null && /* @__PURE__ */ jsxRuntime.jsx("span", { children }),
+      children != null && /* @__PURE__ */ jsxRuntime.jsx(
+        "span",
+        {
+          "data-react-fancy-button-label": "",
+          className: cn(
+            // min-w-0 lets the label shrink + wrap inside the flex row instead
+            // of overflowing and shoving the icon out of place.
+            "min-w-0",
+            // `responsive` collapses to icon-only when squeezed, while keeping
+            // the label readable to screen readers.
+            responsive && "sr-only sm:not-sr-only",
+            labelClassName
+          ),
+          children
+        }
+      ),
       trailingElements
     ] });
     const safeHref = sanitizeHref(href);