@alfadocs/ui-kit 1.12.6 → 1.14.0

package/dist/_chunks/key-value-pair-BubG4fUa.js

@@ -1,144 +0,0 @@
-import { jsx as a, jsxs as i, Fragment as f } from "react/jsx-runtime";
-import { forwardRef as g, useState as y, useCallback as z } from "react";
-import { c as P } from "./index-D2ZczOXr.js";
-import { useTranslation as I } from "react-i18next";
-import { I as K } from "./icon-button-DA2CAGHZ.js";
-import { C as T } from "./check-DrFSN__t.js";
-import { C as j } from "./copy-vRpqqHtY.js";
-const B = P("ds:flex", {
-  variants: {
-    layout: {
-      horizontal: "ds:flex-row ds:items-center ds:gap-[var(--spacing-sm)]",
-      vertical: "ds:flex-col ds:gap-[var(--spacing-xs)]"
-    },
-    /** Internal — flips the root to a horizontal flex when an icon
-        is present so the icon can sit at the leading edge of both
-        horizontal and vertical inner stacks. `items-start` keeps the
-        icon anchored to the label row even when the value wraps. */
-    hasIcon: {
-      true: "ds:flex-row ds:items-start ds:gap-[var(--spacing-sm)]",
-      false: ""
-    }
-  },
-  defaultVariants: {
-    layout: "horizontal",
-    hasIcon: !1
-  }
-}), _ = g(
-  ({
-    label: o,
-    value: e,
-    layout: s = "horizontal",
-    mono: r = !1,
-    copyable: l = !1,
-    copyText: v,
-    icon: d,
-    className: h,
-    ...k
-  }, x) => {
-    const { t: n } = I(), [C, m] = y(!1), [N, t] = y(""), c = v ?? (typeof e == "string" ? e : void 0), V = z(async () => {
-      if (c)
-        try {
-          await navigator.clipboard.writeText(c), m(!0), t(n("keyValuePair.copied")), setTimeout(() => {
-            m(!1), t("");
-          }, 2e3);
-        } catch {
-          t(n("keyValuePair.notAvailable")), setTimeout(() => t(""), 3e3);
-        }
-    }, [c, n]), b = [
-      "type-body ds:text-foreground ds:min-w-0 ds:shrink ds:[unicode-bidi:isolate]",
-      // `flex-1` lets the value absorb the remaining inline space
-      // when the KVP root flexes the icon / label / value as direct
-      // siblings (`hasIcon && layout === 'horizontal'`). Without it,
-      // the value would shrink to its content width and the row
-      // would leave inline-end whitespace. Vertical layout doesn't
-      // need it because the value is below the label, not beside it.
-      s === "horizontal" ? "ds:flex-1" : "",
-      r ? "ds:font-[family-name:var(--font-mono)]" : ""
-    ].filter(Boolean).join(" "), u = d != null, w = "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)] ds:min-w-0 ds:flex-1", p = /* @__PURE__ */ i(f, { children: [
-      /* @__PURE__ */ i("span", { className: "type-label ds:text-muted-foreground ds:shrink-0", children: [
-        o,
-        /* @__PURE__ */ a("span", { className: "ds:sr-only", children: ": " })
-      ] }),
-      /* @__PURE__ */ a("span", { className: b, children: e }),
-      l && /* @__PURE__ */ a(
-        K,
-        {
-          icon: C ? /* @__PURE__ */ a(T, {}) : /* @__PURE__ */ a(j, {}),
-          size: "sm",
-          "aria-label": n("keyValuePair.copy", { label: o }),
-          onClick: V,
-          intent: "ghost",
-          className: s === "horizontal" ? "ds:ms-auto ds:shrink-0" : "ds:self-start"
-        }
-      )
-    ] });
-    return /* @__PURE__ */ i(
-      "div",
-      {
-        ref: x,
-        className: B({ layout: s, hasIcon: u, className: h }),
-        "data-component": "key-value-pair",
-        ...k,
-        children: [
-          u ? /* @__PURE__ */ i(f, { children: [
-            /* @__PURE__ */ a(
-              "span",
-              {
-                "aria-hidden": "true",
-                className: "ds:inline-flex ds:shrink-0 ds:translate-y-0.5 ds:text-[color:var(--key-value-pair-icon-color)] ds:[&_svg]:size-4",
-                children: d
-              }
-            ),
-            s === "horizontal" ? p : /* @__PURE__ */ a("div", { className: w, children: p })
-          ] }) : p,
-          /* @__PURE__ */ a("span", { role: "status", "aria-live": "polite", className: "ds:sr-only", children: N })
-        ]
-      }
-    );
-  }
-);
-_.displayName = "KeyValuePair";
-const A = {
-  sm: "ds:gap-y-[var(--spacing-sm)]",
-  md: "ds:gap-y-[var(--spacing-md)]",
-  lg: "ds:gap-y-[var(--spacing-lg)]"
-}, L = g(
-  ({ children: o, className: e, rowGap: s = "md", ...r }, l) => /* @__PURE__ */ a(
-    "div",
-    {
-      ref: l,
-      "data-component": "key-value-list",
-      className: [
-        "ds:grid ds:grid-cols-[auto_auto_minmax(0,1fr)]",
-        "ds:gap-x-[var(--spacing-md)]",
-        A[s],
-        // Each direct `data-component="key-value-pair"` child becomes
-        // a subgrid row spanning all three columns. The KVP's own
-        // flex layout still works inside the cell (icon shrinks-0,
-        // label shrinks-0, value flexes) — subgrid just aligns the
-        // boundaries between siblings.
-        'ds:[&>[data-component="key-value-pair"]]:grid',
-        'ds:[&>[data-component="key-value-pair"]]:grid-cols-subgrid',
-        'ds:[&>[data-component="key-value-pair"]]:col-span-3',
-        'ds:[&>[data-component="key-value-pair"]]:items-baseline',
-        // Unset the KVP's intra-row `gap-sm` so the subgrid inherits
-        // the parent KeyValueList's `gap-x-md` for every track gap
-        // (icon→label and label→value). `gap-0` here would override
-        // the parent's gap and crowd the icon against the label;
-        // `[gap:normal]` is the subgrid-spec way to defer to the
-        // parent.
-        'ds:[&>[data-component="key-value-pair"]]:[gap:normal]',
-        e
-      ].filter(Boolean).join(" "),
-      ...r,
-      children: o
-    }
-  )
-);
-L.displayName = "KeyValueList";
-export {
-  L as K,
-  _ as a
-};
-//# sourceMappingURL=key-value-pair-BubG4fUa.js.map