@alfadocs/ui-kit 1.57.0 → 1.58.0

package/dist/_chunks/marketplace-app-shell-BZcA9Z06.js

@@ -1,555 +0,0 @@
-import { jsxs as r, jsx as a, Fragment as N } from "react/jsx-runtime";
-import { forwardRef as y, useState as G } from "react";
-import { useTranslation as C, Trans as J } from "react-i18next";
-import { c as h } from "./index-D2ZczOXr.js";
-import { A as M } from "./app-frame-B-0O9CrU.js";
-import { A as I } from "./avatar-WZY3eGE7.js";
-import { A as Q } from "./alert-BhCstf2h.js";
-import { C as B } from "./card-DMO2nkt4.js";
-import { D as p } from "./dropdown-menu-BQSNVp4x.js";
-import { T as U } from "./tab-bar-Bm-rJB7Y.js";
-import { a as E, H as X, g as Y, f as L, e as Z, c as aa, d as ea } from "./header-B9552pLh.js";
-import { H as sa } from "./header-settings-BMcCx2LC.js";
-import { S as ta } from "./sign-in-with-alfadocs-button-D91_x8DX.js";
-import { S as ra, g as na, b as da, a as ia, j as la, k as oa, i as ca, h as D } from "./sidebar-DLsG2AIk.js";
-import { T as ma } from "./theme-root-BOO73p5t.js";
-import { a as H } from "./tooltip-Cp-PLePW.js";
-import { u as pa } from "./use-theme-CAuo6EYT.js";
-import { A as ua, L as ha } from "./logo-hIsyVE96.js";
-import { A as fa } from "./Alfadocs_Logo_Mark-Z_b6ZI1g.js";
-import { M as ga } from "./maximize-2-BYd2Kti7.js";
-import { L as va } from "./log-out-oDS6zO5d.js";
-const xa = h("ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]"), ba = h(
-  [
-    "ds:[font-family:var(--font-serif)]",
-    "ds:font-semibold",
-    "ds:leading-none",
-    "ds:tracking-[0.01em]",
-    "ds:whitespace-nowrap",
-    // Forced-colors: drop the transparent text-fill and paint the label
-    // as solid CanvasText so it never disappears under Windows HCM —
-    // a gradient/transparent fill has no meaning there.
-    "ds:forced-colors:text-[CanvasText]",
-    "ds:forced-colors:[-webkit-text-fill-color:CanvasText]"
-  ],
-  {
-    variants: {
-      size: {
-        sm: "ds:text-[calc(var(--logo-size-sm)*0.95)]",
-        md: "ds:text-[calc(var(--logo-size-md)*0.95)]",
-        lg: "ds:text-[calc(var(--logo-size-lg)*0.95)]",
-        xl: "ds:text-[calc(var(--logo-size-xl)*0.95)]"
-      },
-      tone: {
-        // Brand gradient filled into the glyphs via background-clip:text.
-        // `--gradient-wordmark` rides the theme aliases, so it stays
-        // AA-safe and adapts per theme on its own (and flattens to a solid
-        // ink in the accessible / forced-colors blocks — see tokens).
-        gradient: [
-          "ds:italic",
-          "ds:bg-[image:var(--gradient-wordmark)]",
-          "ds:bg-clip-text",
-          "ds:text-transparent",
-          "ds:[-webkit-text-fill-color:transparent]"
-        ],
-        // Monochrome: solid currentColor ink, upright, no gradient — for
-        // print, single-colour work, and coloured chrome (e.g. app-shell
-        // headers) where the lockup must ride the surrounding ink.
-        solid: "ds:text-current"
-      }
-    },
-    defaultVariants: { size: "md", tone: "gradient" }
-  }
-), ka = h("ds:whitespace-nowrap", {
-  variants: {
-    size: {
-      sm: "ds:[--lockup-unit:var(--logo-size-sm)]",
-      md: "ds:[--lockup-unit:var(--logo-size-md)]",
-      lg: "ds:[--lockup-unit:var(--logo-size-lg)]",
-      xl: "ds:[--lockup-unit:var(--logo-size-xl)]"
-    }
-  },
-  defaultVariants: { size: "md" }
-}), x = y(
-  ({
-    name: s,
-    variant: n = "standard",
-    monochrome: e = !1,
-    tone: t = "auto",
-    size: d = "md",
-    className: l,
-    ...m
-  }, o) => {
-    const { t: i } = C("ui");
-    if (n === "maker") {
-      const c = t === "inherit", u = c ? "" : e ? "ds:text-[color:var(--foreground)]" : "ds:text-[color:var(--primary)]", f = c ? "" : e ? "ds:text-[color:var(--foreground)]" : "ds:text-[color:var(--primary)]", g = c ? "" : "ds:text-[color:var(--muted-foreground)]", v = c ? "" : "ds:text-[color:var(--foreground)]";
-      return /* @__PURE__ */ r(
-        "span",
-        {
-          ref: o,
-          role: "img",
-          "aria-label": i("productLockup.makerLabel", { name: s.trim() }),
-          className: ka({ size: d, className: l }),
-          "data-component": "product-lockup",
-          ...m,
-          children: [
-            /* @__PURE__ */ a(
-              fa,
-              {
-                "aria-hidden": !0,
-                className: `ds:inline-block ds:align-middle ds:me-[var(--spacing-sm)] ds:h-[calc(var(--lockup-unit)*0.88)] ds:w-auto ds:forced-colors:text-[CanvasText] ${u}`
-              }
-            ),
-            /* @__PURE__ */ a(
-              "span",
-              {
-                "aria-hidden": !0,
-                className: `ds:align-middle ds:[font-family:var(--font-serif)] ds:font-semibold ds:italic ds:leading-none ds:tracking-[0.01em] ${f} ds:text-[calc(var(--lockup-unit)*0.95)]`,
-                children: s
-              }
-            ),
-            /* @__PURE__ */ a(
-              "span",
-              {
-                "aria-hidden": !0,
-                className: `ds:align-text-top ds:ms-[var(--spacing-sm)] ds:inline-flex ds:items-baseline ds:gap-[var(--spacing-2xs)] ${g}`,
-                children: /* @__PURE__ */ a(
-                  J,
-                  {
-                    ns: "ui",
-                    t: i,
-                    i18nKey: "productLockup.attribution",
-                    components: {
-                      text: /* @__PURE__ */ a("span", { className: "ds:text-[calc(var(--lockup-unit)*0.4)] ds:leading-none" }),
-                      brand: /* @__PURE__ */ a(
-                        ua,
-                        {
-                          "aria-hidden": !0,
-                          viewBox: "168 0 637 125",
-                          className: `ds:h-[calc(var(--lockup-unit)*0.45)] ds:w-auto ds:forced-colors:text-[CanvasText] ${v}`
-                        }
-                      )
-                    }
-                  }
-                )
-              }
-            )
-          ]
-        }
-      );
-    }
-    return /* @__PURE__ */ r(
-      "span",
-      {
-        ref: o,
-        role: "img",
-        "aria-label": `Alfadocs ${s}`.trim(),
-        className: xa({ className: l }),
-        "data-component": "product-lockup",
-        ...m,
-        children: [
-          /* @__PURE__ */ a(
-            ha,
-            {
-              variant: e ? "monochrome" : "wordmark",
-              tone: t,
-              size: d,
-              decorative: !0
-            }
-          ),
-          /* @__PURE__ */ a(
-            "span",
-            {
-              "aria-hidden": !0,
-              className: ba({
-                size: d,
-                tone: e ? "solid" : "gradient"
-              }),
-              children: s
-            }
-          )
-        ]
-      }
-    );
-  }
-);
-x.displayName = "ProductLockup";
-function Na(s) {
-  return s > 99 ? "99+" : String(s);
-}
-function ya({
-  user: s,
-  labels: n,
-  onSignOut: e,
-  onToggleFullscreen: t
-}) {
-  const { t: d } = C("ui"), l = n.fullscreen ?? d("marketplaceAppShell.settings.fullscreen");
-  return (
-    // Non-modal: an account menu shouldn't inert/aria-hide the whole shell
-    // behind it (which leaves the still-focusable chrome inside an
-    // aria-hidden region — an `aria-hidden-focus` violation).
-    /* @__PURE__ */ r(p.Root, { modal: !1, children: [
-      /* @__PURE__ */ a(p.Trigger, { asChild: !0, children: /* @__PURE__ */ a(
-        "button",
-        {
-          type: "button",
-          "aria-label": n.accountMenu,
-          "data-testid": "marketplace-account-trigger",
-          className: "ds:inline-flex ds:items-center ds:justify-center ds:shrink-0 ds:size-10 ds:rounded-[var(--radius-full)] ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)] ds:forced-colors:focus-visible:outline-[CanvasText]",
-          children: /* @__PURE__ */ a("span", { "aria-hidden": "true", children: /* @__PURE__ */ a(I, { name: s.name, src: s.avatarSrc, size: "md" }) })
-        }
-      ) }),
-      /* @__PURE__ */ r(p.Content, { align: "end", collisionPadding: 16, children: [
-        /* @__PURE__ */ a(p.Label, { children: /* @__PURE__ */ r("span", { className: "ds:flex ds:items-center ds:gap-[var(--spacing-sm)]", children: [
-          /* @__PURE__ */ a("span", { "aria-hidden": "true", children: /* @__PURE__ */ a(I, { name: s.name, src: s.avatarSrc, size: "sm" }) }),
-          /* @__PURE__ */ r("span", { className: "ds:flex ds:flex-col ds:min-w-0", children: [
-            /* @__PURE__ */ a("span", { className: "type-label ds:text-[color:var(--foreground)] ds:truncate", children: s.name }),
-            s.email ? /* @__PURE__ */ a("span", { className: "type-meta ds:truncate", children: s.email }) : null
-          ] })
-        ] }) }),
-        t ? /* @__PURE__ */ r(N, { children: [
-          /* @__PURE__ */ a(p.Separator, {}),
-          /* @__PURE__ */ a(
-            p.Item,
-            {
-              startIcon: /* @__PURE__ */ a(ga, { "aria-hidden": !0 }),
-              onSelect: t,
-              "data-testid": "marketplace-fullscreen",
-              children: l
-            }
-          )
-        ] }) : null,
-        /* @__PURE__ */ a(p.Separator, {}),
-        /* @__PURE__ */ a(
-          p.Item,
-          {
-            startIcon: /* @__PURE__ */ a(va, { "aria-hidden": !0 }),
-            onSelect: e,
-            "data-testid": "marketplace-sign-out",
-            children: n.signOut
-          }
-        )
-      ] })
-    ] })
-  );
-}
-function Ca({
-  nav: s,
-  renderLink: n
-}) {
-  return /* @__PURE__ */ a(ia, { children: s.map((e) => {
-    const t = typeof e.badgeCount == "number" && e.badgeCount > 0 ? e.badgeCount : void 0, d = /* @__PURE__ */ r(N, { children: [
-      e.icon ? /* @__PURE__ */ a(la, { children: e.icon }) : null,
-      /* @__PURE__ */ a(oa, { children: e.label }),
-      t !== void 0 ? /* @__PURE__ */ a(ca, { children: Na(t) }) : null
-    ] });
-    return n ? /* @__PURE__ */ a(D, { asChild: !0, isActive: e.isActive, children: n({
-      href: e.href,
-      children: d,
-      "aria-current": e.isActive ? "page" : void 0
-    }) }, e.id) : /* @__PURE__ */ a(
-      D,
-      {
-        href: e.href,
-        "aria-label": e.label,
-        isActive: e.isActive,
-        ...e.onClick ? { onClick: e.onClick } : {},
-        children: d
-      },
-      e.id
-    );
-  }) });
-}
-const O = [
-  "ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]",
-  "ds:pt-[var(--spacing-lg)] ds:pb-[var(--spacing-md)]"
-].join(" "), k = h("ds:bg-[color:var(--app-shell-background)]", {
-  variants: {
-    variant: {
-      standalone: "",
-      embedded: `ds:flex-1 ${O}`
-    }
-  },
-  defaultVariants: { variant: "standalone" }
-}), wa = "ds:shrink-0 ds:bg-[color:var(--app-shell-background)]";
-function Sa({
-  nav: s,
-  ariaLabel: n,
-  renderLink: e
-}) {
-  const t = e ? ({
-    href: d,
-    className: l,
-    children: m,
-    "aria-current": o,
-    "data-tab-id": i
-  }) => e({
-    href: d,
-    className: l,
-    children: m,
-    "aria-current": o,
-    // Forward the agent DOM hook — without it a consumer-router tab is
-    // invisible to `[data-tab-id]` lookups (PRS §26 §6).
-    "data-tab-id": i
-  }) : void 0;
-  return /* @__PURE__ */ a(
-    U,
-    {
-      items: s,
-      ariaLabel: n,
-      ...t ? { renderLink: t } : {}
-    }
-  );
-}
-const Aa = y(
-  ({
-    productName: s,
-    productHref: n = "/",
-    nav: e,
-    renderLink: t,
-    user: d,
-    labels: l,
-    onSignOut: m,
-    onToggleFullscreen: o,
-    sidebarState: i,
-    collapsibleSidebar: c = !1,
-    mainAriaLabel: u,
-    variant: f = "standalone",
-    endSidebar: g,
-    children: v
-  }, w) => {
-    const { t: b } = C("ui"), V = t ? /* @__PURE__ */ a(E, { asChild: !0, children: t({
-      href: n,
-      children: /* @__PURE__ */ a(
-        x,
-        {
-          name: s,
-          size: "md",
-          monochrome: !0,
-          variant: "maker"
-        }
-      )
-    }) }) : /* @__PURE__ */ a(
-      E,
-      {
-        href: n,
-        logo: /* @__PURE__ */ a(
-          x,
-          {
-            name: s,
-            size: "md",
-            monochrome: !0,
-            variant: "maker"
-          }
-        )
-      }
-    ), { theme: $, accessibility: j, resolvedTheme: S } = pa(), R = $ !== "system" || j !== "system", W = S.startsWith("dark") ? "dark" : "light", P = S.endsWith("-accessible"), [_, A] = G(!1), K = /* @__PURE__ */ a(H, { children: /* @__PURE__ */ a(
-      M,
-      {
-        mainAriaLabel: u,
-        mainClassName: k({ variant: "standalone" }),
-        header: /* @__PURE__ */ r(X, { children: [
-          /* @__PURE__ */ r(Y, { children: [
-            /* @__PURE__ */ a(L, { href: "#main-content" }),
-            /* @__PURE__ */ a(Z, { onMenuOpen: () => A(!0) }),
-            V
-          ] }),
-          /* @__PURE__ */ a(aa, {}),
-          /* @__PURE__ */ r(ea, { children: [
-            /* @__PURE__ */ a(sa, { size: "sm" }),
-            /* @__PURE__ */ a(
-              ya,
-              {
-                user: d,
-                labels: l,
-                onSignOut: m,
-                onToggleFullscreen: o
-              }
-            )
-          ] })
-        ] }),
-        sidebar: /* @__PURE__ */ r(
-          ra,
-          {
-            ...i !== void 0 ? { state: i } : { defaultState: "expanded" },
-            open: _,
-            onOpenChange: A,
-            "aria-label": b("navigation.sidebar.label"),
-            "data-testid": "marketplace-app-shell-sidebar",
-            children: [
-              c && i === void 0 ? (
-                // No justify override: SidebarHeader centres its child in the
-                // icon rail (`justify-center`) and left-aligns it when expanded,
-                // matching the nav icons below. `justify-end` here would win over
-                // the icon-mode centring and offset the toggle in the rail.
-                /* @__PURE__ */ a(na, { children: /* @__PURE__ */ a(da, {}) })
-              ) : null,
-              /* @__PURE__ */ a(Ca, { nav: e, renderLink: t })
-            ]
-          }
-        ),
-        endSidebar: g,
-        children: v
-      }
-    ) }), z = /* @__PURE__ */ r(N, { children: [
-      /* @__PURE__ */ a(L, { href: "#main-content" }),
-      /* @__PURE__ */ a(
-        Sa,
-        {
-          nav: e,
-          ariaLabel: b("navigation.sidebar.label"),
-          renderLink: t
-        }
-      )
-    ] }), F = /* @__PURE__ */ a(H, { children: /* @__PURE__ */ a(
-      M,
-      {
-        mainAriaLabel: u,
-        mainClassName: k({ variant: "standalone" }),
-        padded: !1,
-        header: /* @__PURE__ */ a("div", { className: wa, children: z }),
-        sidebar: null,
-        endSidebar: g,
-        children: /* @__PURE__ */ a("div", { className: O, children: v })
-      }
-    ) }), q = (
-      // The shell owns the warm-grey canvas; TabBar's strip is transparent and
-      // floats its pill on it, and `<main>` continues the same surface.
-      /* @__PURE__ */ r("div", { className: "ds:flex ds:min-h-dvh ds:flex-col ds:bg-[color:var(--app-shell-background)]", children: [
-        z,
-        /* @__PURE__ */ a(
-          "main",
-          {
-            id: "main-content",
-            tabIndex: -1,
-            "aria-label": u ?? b("navigation.main.label", "Main content"),
-            className: k({ variant: "embedded" }),
-            children: v
-          }
-        )
-      ] })
-    ), T = f === "embedded" ? g ? F : q : K;
-    return R ? /* @__PURE__ */ a(
-      ma,
-      {
-        ref: w,
-        theme: W,
-        accessible: P,
-        className: "ds:contents",
-        "data-component": "marketplace-app-shell",
-        children: T
-      }
-    ) : /* @__PURE__ */ a(
-      "div",
-      {
-        ref: w,
-        className: "ds:contents",
-        "data-component": "marketplace-app-shell",
-        children: T
-      }
-    );
-  }
-);
-Aa.displayName = "MarketplaceAppShell";
-const za = h(
-  "ds:flex ds:min-h-dvh ds:bg-[color:var(--app-shell-background)]",
-  {
-    variants: {
-      layout: {
-        card: "",
-        split: "ds:flex-col ds:lg:flex-row"
-      }
-    },
-    defaultVariants: { layout: "card" }
-  }
-), Ta = h("ds:w-full", {
-  variants: {
-    layout: {
-      card: "ds:max-w-[400px]",
-      split: "ds:max-w-[400px] ds:lg:max-w-[480px]"
-    }
-  },
-  defaultVariants: { layout: "card" }
-}), Ma = h("", {
-  variants: {
-    layout: { card: "", split: "ds:lg:hidden" }
-  },
-  defaultVariants: { layout: "card" }
-}), Ia = y(
-  ({
-    productName: s,
-    title: n,
-    description: e,
-    connectLabel: t,
-    status: d = "idle",
-    error: l,
-    onConnect: m,
-    footer: o,
-    layout: i = "card",
-    brandPanel: c,
-    className: u
-  }, f) => /* @__PURE__ */ r(
-    "div",
-    {
-      ref: f,
-      "data-component": "connect-with-alfadocs",
-      className: `${za({ layout: i })} ${u ?? ""}`,
-      children: [
-        i === "split" ? (
-          // Desktop brand panel (lg+ only): a bold `--primary` surface with the
-          // monochrome lockup riding the `--primary-foreground` ink, plus an
-          // optional `brandPanel` slot. Decorative — the card carries the real
-          // heading + CTA, and shows its own lockup below `lg:`.
-          /* @__PURE__ */ r("div", { className: "ds:hidden ds:lg:flex ds:lg:w-[55%] ds:flex-col ds:items-center ds:justify-center ds:gap-[var(--spacing-lg)] ds:bg-[color:var(--primary)] ds:text-[color:var(--primary-foreground)] ds:ps-[var(--spacing-2xl)] ds:pe-[var(--spacing-2xl)] ds:pt-[var(--spacing-2xl)] ds:pb-[var(--spacing-2xl)] ds:text-start", children: [
-            /* @__PURE__ */ a(
-              x,
-              {
-                name: s,
-                size: "lg",
-                monochrome: !0,
-                tone: "inherit",
-                variant: "maker"
-              }
-            ),
-            c ? /* @__PURE__ */ a("div", { className: "type-body ds:max-w-[28rem] ds:text-start", children: c }) : null
-          ] })
-        ) : null,
-        /* @__PURE__ */ a("div", { className: "ds:flex ds:flex-1 ds:items-center ds:justify-center ds:p-[var(--spacing-lg)]", children: /* @__PURE__ */ a(B, { className: Ta({ layout: i }), children: /* @__PURE__ */ r(B.Body, { className: "ds:flex ds:flex-col ds:items-center ds:gap-[var(--spacing-lg)] ds:text-center", children: [
-          /* @__PURE__ */ a(
-            x,
-            {
-              name: s,
-              size: "lg",
-              variant: "maker",
-              className: Ma({ layout: i })
-            }
-          ),
-          /* @__PURE__ */ r("div", { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-xs)]", children: [
-            /* @__PURE__ */ a("h1", { className: "type-title-card", children: n }),
-            /* @__PURE__ */ a("p", { className: "type-body-sm ds:text-[color:var(--muted-foreground)]", children: e })
-          ] }),
-          d === "error" && l ? /* @__PURE__ */ a(Q, { variant: "error", className: "ds:w-full ds:text-start", children: l }) : null,
-          /* @__PURE__ */ a(
-            ta,
-            {
-              intent: "primary",
-              className: "ds:w-full",
-              loading: d === "connecting",
-              onClick: m,
-              label: t,
-              "data-testid": "connect-with-alfadocs-button"
-            }
-          ),
-          o ? /* @__PURE__ */ a("div", { className: "type-meta ds:text-[color:var(--muted-foreground)]", children: o }) : null
-        ] }) }) })
-      ]
-    }
-  )
-);
-Ia.displayName = "ConnectWithAlfadocs";
-export {
-  Ia as C,
-  Aa as M,
-  x as P
-};
-//# sourceMappingURL=marketplace-app-shell-BZcA9Z06.js.map