@rafal.lemieszewski/tide-ui 0.85.1 → 0.87.0

package/dist/es/components/product/attributes-list.js

@@ -3,12 +3,13 @@ import * as e from "react";
 import { cn as i } from "../../lib/utils.js";
 import { Collapsible as A, CollapsibleTrigger as w, CollapsibleContent as R } from "../fundamental/collapsible.js";
 import { Icon as N } from "../fundamental/icon.js";
-const h = e.createContext("s"), I = /* @__PURE__ */ e.forwardRef(
+import { ExternalLink as I } from "lucide-react";
+const h = e.createContext("s"), P = /* @__PURE__ */ e.forwardRef(
   ({
-    className: a,
+    className: o,
     children: t,
     size: r = "s",
-    showHiddenLabel: o = "More details",
+    showHiddenLabel: a = "More details",
     hideLabel: d = "Less details",
     defaultShowHidden: f = !1,
     labelWidth: p,
@@ -22,7 +23,7 @@ const h = e.createContext("s"), I = /* @__PURE__ */ e.forwardRef(
         className: i(
           "grid",
           r === "s" ? "gap-y-[12px]" : "gap-y-[8px]",
-          a
+          o
         ),
         style: {
           gridTemplateColumns: `${c || "auto"} 1fr`,
@@ -44,7 +45,7 @@ const h = e.createContext("s"), I = /* @__PURE__ */ e.forwardRef(
               ),
               style: { gridColumn: "1 / -1" },
               children: [
-                s ? d : o,
+                s ? d : a,
                 /* @__PURE__ */ n(
                   N,
                   {
@@ -65,10 +66,10 @@ const h = e.createContext("s"), I = /* @__PURE__ */ e.forwardRef(
     ) });
   }
 );
-I.displayName = "AttributesList";
-const P = /* @__PURE__ */ e.memo(
+P.displayName = "AttributesList";
+const H = /* @__PURE__ */ e.memo(
   /* @__PURE__ */ e.forwardRef(
-    ({ className: a, ...t }, r) => /* @__PURE__ */ n(
+    ({ className: o, ...t }, r) => /* @__PURE__ */ n(
       "div",
       {
         ref: r,
@@ -76,7 +77,7 @@ const P = /* @__PURE__ */ e.memo(
         "aria-hidden": "true",
         className: i(
           "h-px bg-[var(--color-border-primary-subtle)] my-[var(--space-s)]",
-          a
+          o
         ),
         style: { gridColumn: "1 / -1" },
         ...t
@@ -84,13 +85,13 @@ const P = /* @__PURE__ */ e.memo(
     )
   )
 );
-P.displayName = "AttributesSeparator";
-const H = /* @__PURE__ */ e.forwardRef(
+H.displayName = "AttributesSeparator";
+const M = /* @__PURE__ */ e.forwardRef(
   ({
-    className: a,
+    className: o,
     label: t,
     children: r,
-    showHiddenLabel: o = "More details",
+    showHiddenLabel: a = "More details",
     hideLabel: d = "Less details",
     defaultShowHidden: f = !1,
     ...p
@@ -103,7 +104,7 @@ const H = /* @__PURE__ */ e.forwardRef(
         className: i(
           "grid",
           l === "s" ? "gap-y-[12px]" : "gap-y-[8px]",
-          a
+          o
         ),
         style: {
           gridColumn: "1 / -1",
@@ -137,7 +138,7 @@ const H = /* @__PURE__ */ e.forwardRef(
               ),
               style: { gridColumn: "1 / -1" },
               children: [
-                s ? d : o,
+                s ? d : a,
                 /* @__PURE__ */ n(
                   N,
                   {
@@ -158,13 +159,13 @@ const H = /* @__PURE__ */ e.forwardRef(
     );
   }
 );
-H.displayName = "AttributesGroup";
-const M = /* @__PURE__ */ e.forwardRef(
+M.displayName = "AttributesGroup";
+const S = /* @__PURE__ */ e.forwardRef(
   ({
-    className: a,
+    className: o,
     children: t,
     collapsible: r = !1,
-    defaultOpen: o,
+    defaultOpen: a,
     open: d,
     onOpenChange: f,
     hidden: p,
@@ -174,10 +175,10 @@ const M = /* @__PURE__ */ e.forwardRef(
     A,
     {
       ref: s,
-      defaultOpen: o,
+      defaultOpen: a,
       open: d,
       onOpenChange: f,
-      className: i("w-full group grid", a),
+      className: i("w-full group grid", o),
       style: {
         gridColumn: "1 / -1",
         gridTemplateColumns: "subgrid",
@@ -192,7 +193,7 @@ const M = /* @__PURE__ */ e.forwardRef(
     "div",
     {
       ref: s,
-      className: i(a),
+      className: i(o),
       style: { display: "contents", ...u },
       "data-hidden": p,
       ...l,
@@ -200,11 +201,11 @@ const M = /* @__PURE__ */ e.forwardRef(
     }
   )
 );
-M.displayName = "AttributesItem";
-const S = /* @__PURE__ */ e.forwardRef(
-  ({ className: a, children: t, asCollapsibleTrigger: r, externalLink: o, style: d, ...f }, p) => {
+S.displayName = "AttributesItem";
+const V = /* @__PURE__ */ e.forwardRef(
+  ({ className: o, children: t, asCollapsibleTrigger: r, externalLink: a, style: d, ...f }, p) => {
     const u = e.useContext(h), l = e.useMemo(() => {
-      if (!o) return t;
+      if (!a) return t;
       const b = e.Children.toArray(t);
       if (b.length >= 2) {
         const y = b[0], g = b[1], c = b.slice(2);
@@ -215,7 +216,7 @@ const S = /* @__PURE__ */ e.forwardRef(
             /* @__PURE__ */ x(
               "a",
               {
-                href: o.href,
+                href: a.href,
                 className: i(
                   "text-[var(--color-text-brand-bold)] hover:text-[var(--color-text-brand-bold-hovered)] inline-flex items-center no-underline shrink-0 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring-color)] focus-visible:ring-offset-2 rounded-s",
                   u === "s" ? "gap-[var(--space-s)]" : "gap-[var(--space-xs)]",
@@ -223,10 +224,10 @@ const S = /* @__PURE__ */ e.forwardRef(
                 ),
                 target: "_blank",
                 rel: "noopener noreferrer",
-                "aria-label": `${o.label} (opens in new tab)`,
+                "aria-label": `${a.label} (opens in new tab)`,
                 children: [
-                  o.label,
-                  /* @__PURE__ */ n(N, { name: "external-link", size: "s", "aria-hidden": "true" })
+                  a.label,
+                  /* @__PURE__ */ n(N, { name: I, size: "s", "aria-hidden": "true" })
                 ]
               }
             )
@@ -235,14 +236,14 @@ const S = /* @__PURE__ */ e.forwardRef(
         ];
       }
       return t;
-    }, [t, o, u]), s = /* @__PURE__ */ n(
+    }, [t, a, u]), s = /* @__PURE__ */ n(
       "div",
       {
         ref: r ? void 0 : p,
         className: i(
           "grid items-center",
           r && "cursor-pointer hover:bg-[var(--color-surface-secondary)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring-color)] focus-visible:ring-offset-2 transition-colors rounded-s px-[var(--space-s)] py-[var(--space-xs)] -mx-[var(--space-s)]",
-          a
+          o
         ),
         style: {
           gridColumn: "1 / -1",
@@ -257,19 +258,19 @@ const S = /* @__PURE__ */ e.forwardRef(
     return r ? /* @__PURE__ */ n(w, { asChild: !0, hideIcon: !0, children: s }) : s;
   }
 );
-S.displayName = "AttributesRow";
-const V = /* @__PURE__ */ e.memo(
+V.displayName = "AttributesRow";
+const k = /* @__PURE__ */ e.memo(
   /* @__PURE__ */ e.forwardRef(
-    ({ className: a, children: t, ...r }, o) => {
+    ({ className: o, children: t, ...r }, a) => {
       const d = e.useContext(h);
       return /* @__PURE__ */ n(
         "div",
         {
-          ref: o,
+          ref: a,
           className: i(
             "text-[var(--color-text-secondary)] [[data-hidden='true']_&]:text-[var(--color-text-tertiary)] shrink-0",
             d === "s" ? "[&]:text-body-medium-sm" : "[&]:text-body-medium-xsm",
-            a
+            o
           ),
           ...r,
           children: t
@@ -278,20 +279,20 @@ const V = /* @__PURE__ */ e.memo(
     }
   )
 );
-V.displayName = "AttributesLabel";
-const k = /* @__PURE__ */ e.memo(
+k.displayName = "AttributesLabel";
+const z = /* @__PURE__ */ e.memo(
   /* @__PURE__ */ e.forwardRef(
-    ({ className: a, children: t, ...r }, o) => {
+    ({ className: o, children: t, ...r }, a) => {
       const d = e.useContext(h);
       return /* @__PURE__ */ n(
         "div",
         {
-          ref: o,
+          ref: a,
           className: i(
             "text-[var(--color-text-primary)] [[data-hidden='true']_&]:text-[var(--color-text-tertiary)] flex items-center",
             d === "s" ? "gap-[var(--space-s)]" : "gap-[var(--space-xs)]",
             d === "s" ? "[&]:text-body-sm" : "[&]:text-body-xsm",
-            a
+            o
           ),
           ...r,
           children: t
@@ -300,29 +301,29 @@ const k = /* @__PURE__ */ e.memo(
     }
   )
 );
-k.displayName = "AttributesValue";
-const z = /* @__PURE__ */ e.forwardRef(({ className: a, children: t, style: r, ...o }, d) => /* @__PURE__ */ n(
+z.displayName = "AttributesValue";
+const G = /* @__PURE__ */ e.forwardRef(({ className: o, children: t, style: r, ...a }, d) => /* @__PURE__ */ n(
   R,
   {
     ref: d,
     className: i(
       "pt-[var(--space-s)] pb-[var(--space-s)]",
-      a
+      o
     ),
     style: { gridColumn: "1 / -1", ...r },
-    ...o,
+    ...a,
     children: t
   }
 ));
-z.displayName = "AttributesContent";
-const G = /* @__PURE__ */ e.memo(
+G.displayName = "AttributesContent";
+const E = /* @__PURE__ */ e.memo(
   /* @__PURE__ */ e.forwardRef(
-    ({ className: a, ...t }, r) => /* @__PURE__ */ n(
+    ({ className: o, ...t }, r) => /* @__PURE__ */ n(
       "div",
       {
         ref: r,
         "aria-hidden": "true",
-        className: i("shrink-0 -ml-[4px]", a),
+        className: i("shrink-0 -ml-[4px]", o),
         ...t,
         children: /* @__PURE__ */ n(
           N,
@@ -337,15 +338,15 @@ const G = /* @__PURE__ */ e.memo(
     )
   )
 );
-G.displayName = "AttributesChevron";
+E.displayName = "AttributesChevron";
 export {
-  G as AttributesChevron,
-  z as AttributesContent,
-  H as AttributesGroup,
-  M as AttributesItem,
-  V as AttributesLabel,
-  I as AttributesList,
-  S as AttributesRow,
-  P as AttributesSeparator,
-  k as AttributesValue
+  E as AttributesChevron,
+  G as AttributesContent,
+  M as AttributesGroup,
+  S as AttributesItem,
+  k as AttributesLabel,
+  P as AttributesList,
+  V as AttributesRow,
+  H as AttributesSeparator,
+  z as AttributesValue
 };