@acronis-platform/ui-react 4.0.0 → 5.0.0

package/dist/components/ui/popover/popover.js

@@ -1,98 +1,53 @@
-import { jsx as a } from "react/jsx-runtime";
-import * as i from "react";
-import { Popover as t } from "@base-ui/react/popover";
-import { cn as n } from "../../../lib/utils.js";
-import { usePortalContainer as y } from "../../../lib/portal-container.js";
-const T = t.Root, k = t.Trigger, D = t.Portal;
-function p(o) {
-  return o == null ? null : "current" in o ? o.current : o;
+import { cn as e } from "../../../lib/utils.js";
+import { usePortalContainer as t } from "../../../lib/portal-container.js";
+import * as n from "react";
+import { jsx as r } from "react/jsx-runtime";
+import { Popover as i } from "@base-ui/react/popover";
+//#region src/components/ui/popover/popover.tsx
+var a = i.Root, o = i.Trigger, s = i.Portal;
+function c(e) {
+	return e == null ? null : "current" in e ? e.current : e;
 }
-function N(o) {
-  const [e, r] = i.useState(
-    () => p(o)
-  );
-  return i.useLayoutEffect(() => {
-    r(p(o));
-  }, [o]), e;
+function l(e) {
+	let [t, r] = n.useState(() => c(e));
+	return n.useLayoutEffect(() => {
+		r(c(e));
+	}, [e]), t;
 }
-const C = i.forwardRef(
-  ({
-    className: o,
-    side: e = "bottom",
-    align: r = "center",
-    sideOffset: u = 4,
-    portal: d = !0,
-    portalContainer: f,
-    keepMounted: v,
-    collisionBoundary: c,
-    positionMethod: m,
-    ...b
-  }, g) => {
-    const P = y(), l = f ?? P, h = N(l), x = d && h != null, w = m ?? (x ? "fixed" : void 0), s = /* @__PURE__ */ a(
-      t.Positioner,
-      {
-        side: e,
-        align: r,
-        sideOffset: u,
-        collisionBoundary: c,
-        positionMethod: w,
-        className: "z-50",
-        children: /* @__PURE__ */ a(
-          t.Popup,
-          {
-            ref: g,
-            className: n(
-              "min-w-[var(--ui-popover-container-min-width)] max-w-[var(--ui-popover-container-max-width)] rounded-[var(--ui-popover-container-border-radius)] border-[length:var(--ui-popover-container-border-width)] border-solid border-[var(--ui-popover-container-border-color)] bg-[var(--ui-popover-container-color)] text-foreground outline-none",
-              "duration-200 data-[open]:animate-in data-[closed]:animate-out data-[open]:fade-in-0 data-[closed]:fade-out-0 data-[open]:zoom-in-95 data-[closed]:zoom-out-95",
-              "data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2",
-              o
-            ),
-            ...b
-          }
-        )
-      }
-    );
-    return d ? /* @__PURE__ */ a(
-      t.Portal,
-      {
-        container: l,
-        keepMounted: v,
-        children: s
-      }
-    ) : s;
-  }
-);
-C.displayName = "PopoverContent";
-const R = i.forwardRef(({ className: o, ...e }, r) => /* @__PURE__ */ a(
-  "div",
-  {
-    ref: r,
-    className: n(
-      "flex w-full flex-col gap-[var(--ui-popover-body-gap)] px-4 py-[var(--ui-popover-body-padding-y)]",
-      o
-    ),
-    ...e
-  }
-));
-R.displayName = "PopoverBody";
-const z = i.forwardRef(({ className: o, ...e }, r) => /* @__PURE__ */ a(
-  "div",
-  {
-    ref: r,
-    className: n(
-      "flex h-[var(--ui-footer-global-height)] w-full shrink-0 items-center justify-end gap-[var(--ui-footer-global-gap)] border-t-[length:var(--ui-footer-default-border-width)] border-solid border-[var(--ui-footer-default-border-color)] bg-[var(--ui-footer-default-color)] px-[var(--ui-footer-global-padding-x)]",
-      o
-    ),
-    ...e
-  }
-));
-z.displayName = "PopoverFooter";
-export {
-  T as Popover,
-  R as PopoverBody,
-  C as PopoverContent,
-  z as PopoverFooter,
-  D as PopoverPortal,
-  k as PopoverTrigger
-};
-//# sourceMappingURL=popover.js.map
+var u = n.forwardRef(({ className: n, side: a = "bottom", align: o = "center", sideOffset: s = 4, portal: c = !0, portalContainer: u, keepMounted: d, collisionBoundary: f, positionMethod: p, ...m }, h) => {
+	let g = t(), _ = u ?? g, v = l(_), y = p ?? (c && v != null ? "fixed" : void 0), b = /* @__PURE__ */ r(i.Positioner, {
+		side: a,
+		align: o,
+		sideOffset: s,
+		collisionBoundary: f,
+		positionMethod: y,
+		className: "z-50",
+		children: /* @__PURE__ */ r(i.Popup, {
+			ref: h,
+			className: e("min-w-[var(--ui-popover-container-min-width)] max-w-[var(--ui-popover-container-max-width)] rounded-[var(--ui-popover-container-border-radius)] border-[length:var(--ui-popover-container-border-width)] border-solid border-[var(--ui-popover-container-border-color)] bg-[var(--ui-popover-container-color)] text-foreground outline-none", "duration-200 data-[open]:animate-in data-[closed]:animate-out data-[open]:fade-in-0 data-[closed]:fade-out-0 data-[open]:zoom-in-95 data-[closed]:zoom-out-95", "data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2", n),
+			...m
+		})
+	});
+	return c ? /* @__PURE__ */ r(i.Portal, {
+		container: _,
+		keepMounted: d,
+		children: b
+	}) : b;
+});
+u.displayName = "PopoverContent";
+var d = n.forwardRef(({ className: t, ...n }, i) => /* @__PURE__ */ r("div", {
+	ref: i,
+	className: e("flex w-full flex-col gap-[var(--ui-popover-body-gap)] px-4 py-[var(--ui-popover-body-padding-y)]", t),
+	...n
+}));
+d.displayName = "PopoverBody";
+var f = n.forwardRef(({ className: t, ...n }, i) => /* @__PURE__ */ r("div", {
+	ref: i,
+	className: e("flex h-[var(--ui-footer-global-height)] w-full shrink-0 items-center justify-end gap-[var(--ui-footer-global-gap)] border-t-[length:var(--ui-footer-default-border-width)] border-solid border-[var(--ui-footer-default-border-color)] bg-[var(--ui-footer-default-color)] px-[var(--ui-footer-global-padding-x)]", t),
+	...n
+}));
+f.displayName = "PopoverFooter";
+//#endregion
+export { a as Popover, d as PopoverBody, u as PopoverContent, f as PopoverFooter, s as PopoverPortal, o as PopoverTrigger };
+
+//# sourceMappingURL=popover.js.map

package/dist/components/ui/popover/popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"popover.js","sources":["../../../../src/components/ui/popover/popover.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Popover as PopoverPrimitive } from '@base-ui/react/popover';\n\nimport { cn } from '@/lib/utils';\nimport { usePortalContainer } from '@/lib/portal-container';\n\n// Ported from `@acronis-platform/shadcn-uikit`'s `popover`\n// (packages/ui-legacy/src/components/ui/popover.tsx). A floating panel anchored\n// to a trigger, built on the Base UI Popover primitive (positioning, focus\n// management, outside-press / Esc dismissal, ARIA come from Base UI). Themed by\n// the `--ui-popover-*` tier (container chrome: color, border, radius, min/max\n// width) per Figma node 6364:17907. The optional `PopoverBody`/`PopoverFooter`\n// parts mirror that node's `Body` slot and `FooterDefault` recipe — `PopoverBody`\n// from `--ui-popover-body-*`, `PopoverFooter` from the shared `--ui-footer-*`\n// tier (also used by other components' default action-row footer). Text color\n// stays on the bridged semantic token (--ui-text-on-surface-primary), which the\n// design references directly rather than a Popover-specific token.\n// Enter/exit animations use `tw-animate-css` keyed to Base UI's data-[open] /\n// data-[closed] / data-[side] attributes.\n\nconst Popover = PopoverPrimitive.Root;\n\nconst PopoverTrigger = PopoverPrimitive.Trigger;\n\nconst PopoverPortal = PopoverPrimitive.Portal;\n\n// Mirrors Base UI's own container resolution (FloatingPortal): a `container`\n// prop may be the node itself or a ref object wrapping it. A ref object is\n// always truthy, so a raw `Boolean(container)` would treat `ref.current ===\n// null` as a resolved container when Base UI actually falls back to\n// `document.body`.\nfunction resolvePortalContainerNode(\n  container: PopoverPrimitive.Portal.Props['container']\n): HTMLElement | ShadowRoot | null {\n  if (container == null) return null;\n  return 'current' in container ? container.current : container;\n}\n\n// Base UI resolves the same `container` prop inside a layout effect (see\n// FloatingPortal's useFloatingPortalNode), because a ref pointing at a node\n// rendered in the same commit isn't populated until after commit — React\n// attaches every ref in a commit before running any layout effect in it.\n// Resolving inline during render (as a plain expression) would race that:\n// on the ref's first commit `current` is still null, and since nothing\n// re-renders on a ref mutation, a wrong 'absolute' default could stick\n// indefinitely. Mirroring Base UI's own two-phase timing here — a state\n// value corrected by a layout effect — picks up a same-commit ref\n// correctly, same as Base UI does for its own portaling.\nfunction useResolvedPortalContainerNode(\n  container: PopoverPrimitive.Portal.Props['container']\n): HTMLElement | ShadowRoot | null {\n  const [node, setNode] = React.useState(() =>\n    resolvePortalContainerNode(container)\n  );\n\n  React.useLayoutEffect(() => {\n    setNode(resolvePortalContainerNode(container));\n  }, [container]);\n\n  return node;\n}\n\nexport interface PopoverContentProps extends React.ComponentPropsWithoutRef<\n  typeof PopoverPrimitive.Popup\n> {\n  /** Which side of the trigger to render on. */\n  side?: PopoverPrimitive.Positioner.Props['side'];\n  /** Alignment along the chosen side. */\n  align?: PopoverPrimitive.Positioner.Props['align'];\n  /** Distance in px from the trigger. */\n  sideOffset?: number;\n  /**\n   * Render inside a portal (default `true`). Set `false` for inline usage\n   * (e.g. when supplying your own `PopoverPortal`).\n   */\n  portal?: boolean;\n  /**\n   * Portal container. Pass a shadow-root mount for isolated-style previews\n   * (the docs demos do this via `useShadowMount`), or a constrained\n   * MFE/Shadow DOM mount point (see `PortalContainerProvider`).\n   */\n  portalContainer?: PopoverPrimitive.Portal.Props['container'];\n  /** Keep the content mounted while closed (Base UI `Portal` prop). */\n  keepMounted?: PopoverPrimitive.Portal.Props['keepMounted'];\n  /**\n   * Element/rect the popup is confined to when avoiding collisions. Defaults\n   * to Base UI's own `'clipping-ancestors'` behavior — left alone here,\n   * since pairing it with the `positionMethod` default below already avoids\n   * clipping inside a constrained `portalContainer` (see that prop's doc).\n   * Override explicitly if a different boundary is needed.\n   */\n  collisionBoundary?: PopoverPrimitive.Positioner.Props['collisionBoundary'];\n  /**\n   * Which CSS `position` the popup uses. Defaults to `'fixed'` whenever the\n   * popup is portaled (`portal` is not `false`) into a resolved\n   * `portalContainer` — an `'absolute'`-positioned popup\n   * (Base UI's own default) is still clipped by a `portalContainer` ancestor\n   * that constrains overflow (e.g. a Shadow DOM host with `overflow: hidden`)\n   * no matter how the collision boundary is computed, since it shares that\n   * ancestor's containing block. `'fixed'` escapes a plain overflow-clipping\n   * ancestor — for a `fixed`-positioned popup, the collision-detection\n   * library (floating-ui) drops overflow ancestors that don't establish\n   * their own containing block, so it clips against the real viewport\n   * instead, which is also unaffected by page scroll (unlike measuring\n   * `document.documentElement`'s own bounding rect, which shrinks by the\n   * scroll offset). Note this is not an absolute guarantee: an ancestor with\n   * `transform`, `filter`, `will-change`, `backdrop-filter`, `perspective`,\n   * or `contain: paint`/`layout` *does* establish a containing block, so it\n   * still clips (and repositions relative to) a `fixed` descendant. Override\n   * explicitly if a different strategy is needed.\n   */\n  positionMethod?: PopoverPrimitive.Positioner.Props['positionMethod'];\n}\n\nconst PopoverContent = React.forwardRef<\n  React.ElementRef<typeof PopoverPrimitive.Popup>,\n  PopoverContentProps\n>(\n  (\n    {\n      className,\n      side = 'bottom',\n      align = 'center',\n      sideOffset = 4,\n      portal = true,\n      portalContainer,\n      keepMounted,\n      collisionBoundary,\n      positionMethod,\n      ...props\n    },\n    ref\n  ) => {\n    const ctxContainer = usePortalContainer();\n    const resolvedContainer = portalContainer ?? ctxContainer;\n    const resolvedContainerNode =\n      useResolvedPortalContainerNode(resolvedContainer);\n    // Gated on this component's own `portal` prop, not on whether the popup\n    // actually ends up inside a constrained containing block: `portal={false}`\n    // opts out of the viewport-escape defaults so inline content keeps its\n    // intended scroll-with-content behavior. A consumer who wraps this in\n    // their own ancestor Portal targeting the same constrained container can\n    // still get clipped — pass `positionMethod` explicitly in that case.\n    const appliesContainerDefaults = portal && resolvedContainerNode != null;\n    // 'absolute' (Base UI's default) shares its portal container's\n    // containing block, so a container that constrains overflow (e.g.\n    // `overflow: hidden` on a Shadow DOM host) clips the popup at its own\n    // edge no matter how the collision boundary is computed. 'fixed' escapes\n    // a plain overflow-clipping ancestor instead: floating-ui's clipping-\n    // ancestor detection drops overflow ancestors that don't establish their\n    // own containing block for a `fixed`-positioned element, so the platform\n    // default collision boundary ('clipping-ancestors') already resolves to\n    // the real (scroll-independent) viewport without needing an explicit\n    // `collisionBoundary` override here.\n    const resolvedPositionMethod =\n      positionMethod ?? (appliesContainerDefaults ? 'fixed' : undefined);\n\n    const positioner = (\n      <PopoverPrimitive.Positioner\n        side={side}\n        align={align}\n        sideOffset={sideOffset}\n        collisionBoundary={collisionBoundary}\n        positionMethod={resolvedPositionMethod}\n        className=\"z-50\"\n      >\n        <PopoverPrimitive.Popup\n          ref={ref}\n          className={cn(\n            'min-w-[var(--ui-popover-container-min-width)] max-w-[var(--ui-popover-container-max-width)] rounded-[var(--ui-popover-container-border-radius)] border-[length:var(--ui-popover-container-border-width)] border-solid border-[var(--ui-popover-container-border-color)] bg-[var(--ui-popover-container-color)] text-foreground outline-none',\n            'duration-200 data-[open]:animate-in data-[closed]:animate-out data-[open]:fade-in-0 data-[closed]:fade-out-0 data-[open]:zoom-in-95 data-[closed]:zoom-out-95',\n            'data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2',\n            className\n          )}\n          {...props}\n        />\n      </PopoverPrimitive.Positioner>\n    );\n\n    return portal ? (\n      <PopoverPrimitive.Portal\n        container={resolvedContainer}\n        keepMounted={keepMounted}\n      >\n        {positioner}\n      </PopoverPrimitive.Portal>\n    ) : (\n      positioner\n    );\n  }\n);\nPopoverContent.displayName = 'PopoverContent';\n\n/**\n * Vertical-rhythm wrapper for a `PopoverContent`'s main content — the `Body`\n * slot in the Figma node. Themed from `--ui-popover-body-*` (gap, padding-y);\n * horizontal inset is a plain utility since the design has no dedicated\n * component token for it.\n */\nconst PopoverBody = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex w-full flex-col gap-[var(--ui-popover-body-gap)] px-4 py-[var(--ui-popover-body-padding-y)]',\n      className\n    )}\n    {...props}\n  />\n));\nPopoverBody.displayName = 'PopoverBody';\n\n/**\n * Default action-row footer — the `FooterDefault` (`variant=default`) recipe\n * from the Figma node. Themed from the shared `--ui-footer-*` tier.\n */\nconst PopoverFooter = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex h-[var(--ui-footer-global-height)] w-full shrink-0 items-center justify-end gap-[var(--ui-footer-global-gap)] border-t-[length:var(--ui-footer-default-border-width)] border-solid border-[var(--ui-footer-default-border-color)] bg-[var(--ui-footer-default-color)] px-[var(--ui-footer-global-padding-x)]',\n      className\n    )}\n    {...props}\n  />\n));\nPopoverFooter.displayName = 'PopoverFooter';\n\nexport {\n  Popover,\n  PopoverTrigger,\n  PopoverPortal,\n  PopoverContent,\n  PopoverBody,\n  PopoverFooter,\n};\n"],"names":["Popover","PopoverPrimitive","PopoverTrigger","PopoverPortal","resolvePortalContainerNode","container","useResolvedPortalContainerNode","node","setNode","React","PopoverContent","className","side","align","sideOffset","portal","portalContainer","keepMounted","collisionBoundary","positionMethod","props","ref","ctxContainer","usePortalContainer","resolvedContainer","resolvedContainerNode","appliesContainerDefaults","resolvedPositionMethod","positioner","jsx","cn","PopoverBody","PopoverFooter"],"mappings":";;;;;AAoBA,MAAMA,IAAUC,EAAiB,MAE3BC,IAAiBD,EAAiB,SAElCE,IAAgBF,EAAiB;AAOvC,SAASG,EACPC,GACiC;AACjC,SAAIA,KAAa,OAAa,OACvB,aAAaA,IAAYA,EAAU,UAAUA;AACtD;AAYA,SAASC,EACPD,GACiC;AACjC,QAAM,CAACE,GAAMC,CAAO,IAAIC,EAAM;AAAA,IAAS,MACrCL,EAA2BC,CAAS;AAAA,EAAA;AAGtC,SAAAI,EAAM,gBAAgB,MAAM;AAC1B,IAAAD,EAAQJ,EAA2BC,CAAS,CAAC;AAAA,EAC/C,GAAG,CAACA,CAAS,CAAC,GAEPE;AACT;AAsDA,MAAMG,IAAiBD,EAAM;AAAA,EAI3B,CACE;AAAA,IACE,WAAAE;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,OAAAC,IAAQ;AAAA,IACR,YAAAC,IAAa;AAAA,IACb,QAAAC,IAAS;AAAA,IACT,iBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,MACG;AACH,UAAMC,IAAeC,EAAA,GACfC,IAAoBR,KAAmBM,GACvCG,IACJnB,EAA+BkB,CAAiB,GAO5CE,IAA2BX,KAAUU,KAAyB,MAW9DE,IACJR,MAAmBO,IAA2B,UAAU,SAEpDE,IACJ,gBAAAC;AAAA,MAAC5B,EAAiB;AAAA,MAAjB;AAAA,QACC,MAAAW;AAAA,QACA,OAAAC;AAAA,QACA,YAAAC;AAAA,QACA,mBAAAI;AAAA,QACA,gBAAgBS;AAAA,QAChB,WAAU;AAAA,QAEV,UAAA,gBAAAE;AAAA,UAAC5B,EAAiB;AAAA,UAAjB;AAAA,YACC,KAAAoB;AAAA,YACA,WAAWS;AAAA,cACT;AAAA,cACA;AAAA,cACA;AAAA,cACAnB;AAAA,YAAA;AAAA,YAED,GAAGS;AAAA,UAAA;AAAA,QAAA;AAAA,MACN;AAAA,IAAA;AAIJ,WAAOL,IACL,gBAAAc;AAAA,MAAC5B,EAAiB;AAAA,MAAjB;AAAA,QACC,WAAWuB;AAAA,QACX,aAAAP;AAAA,QAEC,UAAAW;AAAA,MAAA;AAAA,IAAA,IAGHA;AAAA,EAEJ;AACF;AACAlB,EAAe,cAAc;AAQ7B,MAAMqB,IAActB,EAAM,WAGxB,CAAC,EAAE,WAAAE,GAAW,GAAGS,EAAA,GAASC,MAC1B,gBAAAQ;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAR;AAAA,IACA,WAAWS;AAAA,MACT;AAAA,MACAnB;AAAA,IAAA;AAAA,IAED,GAAGS;AAAA,EAAA;AACN,CACD;AACDW,EAAY,cAAc;AAM1B,MAAMC,IAAgBvB,EAAM,WAG1B,CAAC,EAAE,WAAAE,GAAW,GAAGS,EAAA,GAASC,MAC1B,gBAAAQ;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAR;AAAA,IACA,WAAWS;AAAA,MACT;AAAA,MACAnB;AAAA,IAAA;AAAA,IAED,GAAGS;AAAA,EAAA;AACN,CACD;AACDY,EAAc,cAAc;"}
+{"version":3,"file":"popover.js","names":[],"sources":["../../../../src/components/ui/popover/popover.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Popover as PopoverPrimitive } from '@base-ui/react/popover';\n\nimport { cn } from '@/lib/utils';\nimport { usePortalContainer } from '@/lib/portal-container';\n\n// Ported from `@acronis-platform/shadcn-uikit`'s `popover`\n// (packages/ui-legacy/src/components/ui/popover.tsx). A floating panel anchored\n// to a trigger, built on the Base UI Popover primitive (positioning, focus\n// management, outside-press / Esc dismissal, ARIA come from Base UI). Themed by\n// the `--ui-popover-*` tier (container chrome: color, border, radius, min/max\n// width) per Figma node 6364:17907. The optional `PopoverBody`/`PopoverFooter`\n// parts mirror that node's `Body` slot and `FooterDefault` recipe — `PopoverBody`\n// from `--ui-popover-body-*`, `PopoverFooter` from the shared `--ui-footer-*`\n// tier (also used by other components' default action-row footer). Text color\n// stays on the bridged semantic token (--ui-text-on-surface-primary), which the\n// design references directly rather than a Popover-specific token.\n// Enter/exit animations use `tw-animate-css` keyed to Base UI's data-[open] /\n// data-[closed] / data-[side] attributes.\n\nconst Popover = PopoverPrimitive.Root;\n\nconst PopoverTrigger = PopoverPrimitive.Trigger;\n\nconst PopoverPortal = PopoverPrimitive.Portal;\n\n// Mirrors Base UI's own container resolution (FloatingPortal): a `container`\n// prop may be the node itself or a ref object wrapping it. A ref object is\n// always truthy, so a raw `Boolean(container)` would treat `ref.current ===\n// null` as a resolved container when Base UI actually falls back to\n// `document.body`.\nfunction resolvePortalContainerNode(\n  container: PopoverPrimitive.Portal.Props['container']\n): HTMLElement | ShadowRoot | null {\n  if (container == null) return null;\n  return 'current' in container ? container.current : container;\n}\n\n// Base UI resolves the same `container` prop inside a layout effect (see\n// FloatingPortal's useFloatingPortalNode), because a ref pointing at a node\n// rendered in the same commit isn't populated until after commit — React\n// attaches every ref in a commit before running any layout effect in it.\n// Resolving inline during render (as a plain expression) would race that:\n// on the ref's first commit `current` is still null, and since nothing\n// re-renders on a ref mutation, a wrong 'absolute' default could stick\n// indefinitely. Mirroring Base UI's own two-phase timing here — a state\n// value corrected by a layout effect — picks up a same-commit ref\n// correctly, same as Base UI does for its own portaling.\nfunction useResolvedPortalContainerNode(\n  container: PopoverPrimitive.Portal.Props['container']\n): HTMLElement | ShadowRoot | null {\n  const [node, setNode] = React.useState(() =>\n    resolvePortalContainerNode(container)\n  );\n\n  React.useLayoutEffect(() => {\n    setNode(resolvePortalContainerNode(container));\n  }, [container]);\n\n  return node;\n}\n\nexport interface PopoverContentProps extends React.ComponentPropsWithoutRef<\n  typeof PopoverPrimitive.Popup\n> {\n  /** Which side of the trigger to render on. */\n  side?: PopoverPrimitive.Positioner.Props['side'];\n  /** Alignment along the chosen side. */\n  align?: PopoverPrimitive.Positioner.Props['align'];\n  /** Distance in px from the trigger. */\n  sideOffset?: number;\n  /**\n   * Render inside a portal (default `true`). Set `false` for inline usage\n   * (e.g. when supplying your own `PopoverPortal`).\n   */\n  portal?: boolean;\n  /**\n   * Portal container. Pass a shadow-root mount for isolated-style previews\n   * (the docs demos do this via `useShadowMount`), or a constrained\n   * MFE/Shadow DOM mount point (see `PortalContainerProvider`).\n   */\n  portalContainer?: PopoverPrimitive.Portal.Props['container'];\n  /** Keep the content mounted while closed (Base UI `Portal` prop). */\n  keepMounted?: PopoverPrimitive.Portal.Props['keepMounted'];\n  /**\n   * Element/rect the popup is confined to when avoiding collisions. Defaults\n   * to Base UI's own `'clipping-ancestors'` behavior — left alone here,\n   * since pairing it with the `positionMethod` default below already avoids\n   * clipping inside a constrained `portalContainer` (see that prop's doc).\n   * Override explicitly if a different boundary is needed.\n   */\n  collisionBoundary?: PopoverPrimitive.Positioner.Props['collisionBoundary'];\n  /**\n   * Which CSS `position` the popup uses. Defaults to `'fixed'` whenever the\n   * popup is portaled (`portal` is not `false`) into a resolved\n   * `portalContainer` — an `'absolute'`-positioned popup\n   * (Base UI's own default) is still clipped by a `portalContainer` ancestor\n   * that constrains overflow (e.g. a Shadow DOM host with `overflow: hidden`)\n   * no matter how the collision boundary is computed, since it shares that\n   * ancestor's containing block. `'fixed'` escapes a plain overflow-clipping\n   * ancestor — for a `fixed`-positioned popup, the collision-detection\n   * library (floating-ui) drops overflow ancestors that don't establish\n   * their own containing block, so it clips against the real viewport\n   * instead, which is also unaffected by page scroll (unlike measuring\n   * `document.documentElement`'s own bounding rect, which shrinks by the\n   * scroll offset). Note this is not an absolute guarantee: an ancestor with\n   * `transform`, `filter`, `will-change`, `backdrop-filter`, `perspective`,\n   * or `contain: paint`/`layout` *does* establish a containing block, so it\n   * still clips (and repositions relative to) a `fixed` descendant. Override\n   * explicitly if a different strategy is needed.\n   */\n  positionMethod?: PopoverPrimitive.Positioner.Props['positionMethod'];\n}\n\nconst PopoverContent = React.forwardRef<\n  React.ElementRef<typeof PopoverPrimitive.Popup>,\n  PopoverContentProps\n>(\n  (\n    {\n      className,\n      side = 'bottom',\n      align = 'center',\n      sideOffset = 4,\n      portal = true,\n      portalContainer,\n      keepMounted,\n      collisionBoundary,\n      positionMethod,\n      ...props\n    },\n    ref\n  ) => {\n    const ctxContainer = usePortalContainer();\n    const resolvedContainer = portalContainer ?? ctxContainer;\n    const resolvedContainerNode =\n      useResolvedPortalContainerNode(resolvedContainer);\n    // Gated on this component's own `portal` prop, not on whether the popup\n    // actually ends up inside a constrained containing block: `portal={false}`\n    // opts out of the viewport-escape defaults so inline content keeps its\n    // intended scroll-with-content behavior. A consumer who wraps this in\n    // their own ancestor Portal targeting the same constrained container can\n    // still get clipped — pass `positionMethod` explicitly in that case.\n    const appliesContainerDefaults = portal && resolvedContainerNode != null;\n    // 'absolute' (Base UI's default) shares its portal container's\n    // containing block, so a container that constrains overflow (e.g.\n    // `overflow: hidden` on a Shadow DOM host) clips the popup at its own\n    // edge no matter how the collision boundary is computed. 'fixed' escapes\n    // a plain overflow-clipping ancestor instead: floating-ui's clipping-\n    // ancestor detection drops overflow ancestors that don't establish their\n    // own containing block for a `fixed`-positioned element, so the platform\n    // default collision boundary ('clipping-ancestors') already resolves to\n    // the real (scroll-independent) viewport without needing an explicit\n    // `collisionBoundary` override here.\n    const resolvedPositionMethod =\n      positionMethod ?? (appliesContainerDefaults ? 'fixed' : undefined);\n\n    const positioner = (\n      <PopoverPrimitive.Positioner\n        side={side}\n        align={align}\n        sideOffset={sideOffset}\n        collisionBoundary={collisionBoundary}\n        positionMethod={resolvedPositionMethod}\n        className=\"z-50\"\n      >\n        <PopoverPrimitive.Popup\n          ref={ref}\n          className={cn(\n            'min-w-[var(--ui-popover-container-min-width)] max-w-[var(--ui-popover-container-max-width)] rounded-[var(--ui-popover-container-border-radius)] border-[length:var(--ui-popover-container-border-width)] border-solid border-[var(--ui-popover-container-border-color)] bg-[var(--ui-popover-container-color)] text-foreground outline-none',\n            'duration-200 data-[open]:animate-in data-[closed]:animate-out data-[open]:fade-in-0 data-[closed]:fade-out-0 data-[open]:zoom-in-95 data-[closed]:zoom-out-95',\n            'data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2',\n            className\n          )}\n          {...props}\n        />\n      </PopoverPrimitive.Positioner>\n    );\n\n    return portal ? (\n      <PopoverPrimitive.Portal\n        container={resolvedContainer}\n        keepMounted={keepMounted}\n      >\n        {positioner}\n      </PopoverPrimitive.Portal>\n    ) : (\n      positioner\n    );\n  }\n);\nPopoverContent.displayName = 'PopoverContent';\n\n/**\n * Vertical-rhythm wrapper for a `PopoverContent`'s main content — the `Body`\n * slot in the Figma node. Themed from `--ui-popover-body-*` (gap, padding-y);\n * horizontal inset is a plain utility since the design has no dedicated\n * component token for it.\n */\nconst PopoverBody = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex w-full flex-col gap-[var(--ui-popover-body-gap)] px-4 py-[var(--ui-popover-body-padding-y)]',\n      className\n    )}\n    {...props}\n  />\n));\nPopoverBody.displayName = 'PopoverBody';\n\n/**\n * Default action-row footer — the `FooterDefault` (`variant=default`) recipe\n * from the Figma node. Themed from the shared `--ui-footer-*` tier.\n */\nconst PopoverFooter = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex h-[var(--ui-footer-global-height)] w-full shrink-0 items-center justify-end gap-[var(--ui-footer-global-gap)] border-t-[length:var(--ui-footer-default-border-width)] border-solid border-[var(--ui-footer-default-border-color)] bg-[var(--ui-footer-default-color)] px-[var(--ui-footer-global-padding-x)]',\n      className\n    )}\n    {...props}\n  />\n));\nPopoverFooter.displayName = 'PopoverFooter';\n\nexport {\n  Popover,\n  PopoverTrigger,\n  PopoverPortal,\n  PopoverContent,\n  PopoverBody,\n  PopoverFooter,\n};\n"],"mappings":";;;;;;AAoBA,IAAM,IAAU,EAAiB,MAE3B,IAAiB,EAAiB,SAElC,IAAgB,EAAiB;AAOvC,SAAS,EACP,GACiC;CAEjC,OADI,KAAa,OAAa,OACvB,aAAa,IAAY,EAAU,UAAU;AACtD;AAYA,SAAS,EACP,GACiC;CACjC,IAAM,CAAC,GAAM,KAAW,EAAM,eAC5B,EAA2B,CAAS,CACtC;CAMA,OAJA,EAAM,sBAAsB;EAC1B,EAAQ,EAA2B,CAAS,CAAC;CAC/C,GAAG,CAAC,CAAS,CAAC,GAEP;AACT;AAsDA,IAAM,IAAiB,EAAM,YAKzB,EACE,cACA,UAAO,UACP,WAAQ,UACR,gBAAa,GACb,YAAS,IACT,oBACA,gBACA,sBACA,mBACA,GAAG,KAEL,MACG;CACH,IAAM,IAAe,EAAmB,GAClC,IAAoB,KAAmB,GACvC,IACJ,EAA+B,CAAiB,GAkB5C,IACJ,MAZ+B,KAAU,KAAyB,OAYpB,UAAU,KAAA,IAEpD,IACJ,kBAAC,EAAiB,YAAlB;EACQ;EACC;EACK;EACO;EACnB,gBAAgB;EAChB,WAAU;EAEV,UAAA,kBAAC,EAAiB,OAAlB;GACO;GACL,WAAW,EACT,+UACA,iKACA,+JACA,CACF;GACA,GAAI;EACL,CAAA;CAC0B,CAAA;CAG/B,OAAO,IACL,kBAAC,EAAiB,QAAlB;EACE,WAAW;EACE;EAEZ,UAAA;CACsB,CAAA,IAEzB;AAEJ,CACF;AACA,EAAe,cAAc;AAQ7B,IAAM,IAAc,EAAM,YAGvB,EAAE,cAAW,GAAG,KAAS,MAC1B,kBAAC,OAAD;CACO;CACL,WAAW,EACT,oGACA,CACF;CACA,GAAI;AACL,CAAA,CACF;AACD,EAAY,cAAc;AAM1B,IAAM,IAAgB,EAAM,YAGzB,EAAE,cAAW,GAAG,KAAS,MAC1B,kBAAC,OAAD;CACO;CACL,WAAW,EACT,qTACA,CACF;CACA,GAAI;AACL,CAAA,CACF;AACD,EAAc,cAAc"}

package/dist/components/ui/progress/progress.js

@@ -1,30 +1,24 @@
-import { jsx as e } from "react/jsx-runtime";
-import * as i from "react";
+"use client";
+import { cn as e } from "../../../lib/utils.js";
+import * as t from "react";
+import { jsx as n } from "react/jsx-runtime";
 import { Progress as r } from "@base-ui/react";
-import { cn as n } from "../../../lib/utils.js";
-const s = i.forwardRef(
-  ({ className: o, value: a, ...l }, t) => /* @__PURE__ */ e(
-    r.Root,
-    {
-      ref: t,
-      value: a ?? null,
-      className: n(
-        "relative h-2 w-full overflow-hidden rounded-full",
-        o
-      ),
-      ...l,
-      children: /* @__PURE__ */ e(r.Track, { className: "relative h-full w-full overflow-hidden bg-input", children: /* @__PURE__ */ e(
-        r.Indicator,
-        {
-          className: "h-full bg-secondary transition-all data-[indeterminate]:animate-indeterminate-progress data-[indeterminate]:transition-none",
-          style: a == null ? { width: "33%" } : void 0
-        }
-      ) })
-    }
-  )
-);
-s.displayName = "Progress";
-export {
-  s as Progress
-};
-//# sourceMappingURL=progress.js.map
+//#region src/components/ui/progress/progress.tsx
+var i = t.forwardRef(({ className: t, value: i, ...a }, o) => /* @__PURE__ */ n(r.Root, {
+	ref: o,
+	value: i ?? null,
+	className: e("relative h-2 w-full overflow-hidden rounded-full", t),
+	...a,
+	children: /* @__PURE__ */ n(r.Track, {
+		className: "relative h-full w-full overflow-hidden bg-input",
+		children: /* @__PURE__ */ n(r.Indicator, {
+			className: "h-full bg-secondary transition-all data-[indeterminate]:animate-indeterminate-progress data-[indeterminate]:transition-none",
+			style: i == null ? { width: "33%" } : void 0
+		})
+	})
+}));
+i.displayName = "Progress";
+//#endregion
+export { i as Progress };
+
+//# sourceMappingURL=progress.js.map

package/dist/components/ui/progress/progress.js.map

@@ -1 +1 @@
-{"version":3,"file":"progress.js","sources":["../../../../src/components/ui/progress/progress.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Progress as ProgressPrimitive } from '@base-ui/react';\n\nimport { cn } from '@/lib/utils';\n\n// Ported from `@acronis-platform/shadcn-uikit`'s `progress`\n// (packages/ui-legacy/src/components/ui/progress.tsx). Wraps Base UI's Progress\n// primitive (Root → Track → Indicator). No `--ui-progress-*` tier yet: the\n// track uses the shared border token via `bg-input`, and the filled indicator\n// uses the brand action blue via `bg-secondary` (--ui-background-brand-secondary,\n// the same remap Spinner uses — ui-react's `primary` is the dark navy, not the\n// action color legacy's `bg-primary` meant). When `value` is `null` the bar is\n// indeterminate: Base UI sets `data-indeterminate`, which swaps the determinate\n// width transition for the sliding `indeterminate-progress` keyframe (registered\n// in src/styles/index.css).\n// Base UI types `value` as required; we make it optional so `<Progress />`\n// renders an indeterminate bar (the `value ?? null` below normalizes it).\nexport type ProgressProps = Omit<\n  React.ComponentPropsWithoutRef<typeof ProgressPrimitive.Root>,\n  'value'\n> & {\n  value?: number | null;\n};\n\nconst Progress = React.forwardRef<HTMLDivElement, ProgressProps>(\n  ({ className, value, ...props }, ref) => (\n    <ProgressPrimitive.Root\n      ref={ref}\n      value={value ?? null}\n      className={cn(\n        'relative h-2 w-full overflow-hidden rounded-full',\n        className\n      )}\n      {...props}\n    >\n      <ProgressPrimitive.Track className=\"relative h-full w-full overflow-hidden bg-input\">\n        <ProgressPrimitive.Indicator\n          className=\"h-full bg-secondary transition-all data-[indeterminate]:animate-indeterminate-progress data-[indeterminate]:transition-none\"\n          style={value == null ? { width: '33%' } : undefined}\n        />\n      </ProgressPrimitive.Track>\n    </ProgressPrimitive.Root>\n  )\n);\nProgress.displayName = 'Progress';\n\nexport { Progress };\n"],"names":["Progress","React","className","value","props","ref","jsx","ProgressPrimitive","cn"],"mappings":";;;;AA0BA,MAAMA,IAAWC,EAAM;AAAA,EACrB,CAAC,EAAE,WAAAC,GAAW,OAAAC,GAAO,GAAGC,EAAA,GAASC,MAC/B,gBAAAC;AAAA,IAACC,EAAkB;AAAA,IAAlB;AAAA,MACC,KAAAF;AAAA,MACA,OAAOF,KAAS;AAAA,MAChB,WAAWK;AAAA,QACT;AAAA,QACAN;AAAA,MAAA;AAAA,MAED,GAAGE;AAAA,MAEJ,UAAA,gBAAAE,EAACC,EAAkB,OAAlB,EAAwB,WAAU,mDACjC,UAAA,gBAAAD;AAAA,QAACC,EAAkB;AAAA,QAAlB;AAAA,UACC,WAAU;AAAA,UACV,OAAOJ,KAAS,OAAO,EAAE,OAAO,UAAU;AAAA,QAAA;AAAA,MAAA,EAC5C,CACF;AAAA,IAAA;AAAA,EAAA;AAGN;AACAH,EAAS,cAAc;"}
+{"version":3,"file":"progress.js","names":[],"sources":["../../../../src/components/ui/progress/progress.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Progress as ProgressPrimitive } from '@base-ui/react';\n\nimport { cn } from '@/lib/utils';\n\n// Ported from `@acronis-platform/shadcn-uikit`'s `progress`\n// (packages/ui-legacy/src/components/ui/progress.tsx). Wraps Base UI's Progress\n// primitive (Root → Track → Indicator). No `--ui-progress-*` tier yet: the\n// track uses the shared border token via `bg-input`, and the filled indicator\n// uses the brand action blue via `bg-secondary` (--ui-background-brand-secondary,\n// the same remap Spinner uses — ui-react's `primary` is the dark navy, not the\n// action color legacy's `bg-primary` meant). When `value` is `null` the bar is\n// indeterminate: Base UI sets `data-indeterminate`, which swaps the determinate\n// width transition for the sliding `indeterminate-progress` keyframe (registered\n// in src/styles/index.css).\n// Base UI types `value` as required; we make it optional so `<Progress />`\n// renders an indeterminate bar (the `value ?? null` below normalizes it).\nexport type ProgressProps = Omit<\n  React.ComponentPropsWithoutRef<typeof ProgressPrimitive.Root>,\n  'value'\n> & {\n  value?: number | null;\n};\n\nconst Progress = React.forwardRef<HTMLDivElement, ProgressProps>(\n  ({ className, value, ...props }, ref) => (\n    <ProgressPrimitive.Root\n      ref={ref}\n      value={value ?? null}\n      className={cn(\n        'relative h-2 w-full overflow-hidden rounded-full',\n        className\n      )}\n      {...props}\n    >\n      <ProgressPrimitive.Track className=\"relative h-full w-full overflow-hidden bg-input\">\n        <ProgressPrimitive.Indicator\n          className=\"h-full bg-secondary transition-all data-[indeterminate]:animate-indeterminate-progress data-[indeterminate]:transition-none\"\n          style={value == null ? { width: '33%' } : undefined}\n        />\n      </ProgressPrimitive.Track>\n    </ProgressPrimitive.Root>\n  )\n);\nProgress.displayName = 'Progress';\n\nexport { Progress };\n"],"mappings":";;;;;;AA0BA,IAAM,IAAW,EAAM,YACpB,EAAE,cAAW,UAAO,GAAG,KAAS,MAC/B,kBAAC,EAAkB,MAAnB;CACO;CACL,OAAO,KAAS;CAChB,WAAW,EACT,oDACA,CACF;CACA,GAAI;CAEJ,UAAA,kBAAC,EAAkB,OAAnB;EAAyB,WAAU;EACjC,UAAA,kBAAC,EAAkB,WAAnB;GACE,WAAU;GACV,OAAO,KAAS,OAAO,EAAE,OAAO,MAAM,IAAI,KAAA;EAC3C,CAAA;CACsB,CAAA;AACH,CAAA,CAE5B;AACA,EAAS,cAAc"}

package/dist/components/ui/progress-circle/progress-circle.js

@@ -1,115 +1,99 @@
-import { jsxs as x, jsx as e } from "react/jsx-runtime";
-import * as I from "react";
-import { Progress as M } from "@base-ui/react/progress";
-import { CircleCheckIcon as R, TriangleWarningIcon as g, CircleTimesIcon as j } from "@acronis-platform/icons-react/stroke-mono";
-import { cva as P } from "../../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
-import { cn as c } from "../../../lib/utils.js";
-const S = {
-  tiny: { d: 16, stroke: 2, font: "text-[10px] leading-none" },
-  sm: { d: 24, stroke: 3, font: "text-[10px] leading-none" },
-  md: { d: 40, stroke: 4, font: "text-xs font-semibold" },
-  lg: { d: 64, stroke: 5, font: "text-sm font-semibold" }
-}, T = {
-  brand: "stroke-[var(--ui-background-brand-secondary)]",
-  danger: "stroke-[var(--ui-text-on-status-danger)]",
-  critical: "stroke-[var(--ui-text-on-status-critical)]",
-  warning: "stroke-[var(--ui-text-on-status-warning)]",
-  success: "stroke-[var(--ui-text-on-status-success)]"
-}, _ = {
-  danger: /* @__PURE__ */ e(j, { className: "text-[var(--ui-text-on-status-danger)]" }),
-  critical: /* @__PURE__ */ e(g, { className: "text-[var(--ui-text-on-status-critical)]" }),
-  warning: /* @__PURE__ */ e(g, { className: "text-[var(--ui-text-on-status-warning)]" }),
-  success: /* @__PURE__ */ e(R, { className: "text-[var(--ui-text-on-status-success)]" })
+"use client";
+import { cn as e } from "../../../lib/utils.js";
+import { cva as t } from "../../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
+import * as n from "react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { CircleCheckIcon as a, CircleTimesIcon as o, TriangleWarningIcon as s } from "@acronis-platform/icons-react/stroke-mono";
+import { Progress as c } from "@base-ui/react/progress";
+//#region src/components/ui/progress-circle/progress-circle.tsx
+var l = {
+	tiny: {
+		d: 16,
+		stroke: 2,
+		font: "text-[10px] leading-none"
+	},
+	sm: {
+		d: 24,
+		stroke: 3,
+		font: "text-[10px] leading-none"
+	},
+	md: {
+		d: 40,
+		stroke: 4,
+		font: "text-xs font-semibold"
+	},
+	lg: {
+		d: 64,
+		stroke: 5,
+		font: "text-sm font-semibold"
+	}
+}, u = {
+	brand: "stroke-[var(--ui-background-brand-secondary)]",
+	danger: "stroke-[var(--ui-text-on-status-danger)]",
+	critical: "stroke-[var(--ui-text-on-status-critical)]",
+	warning: "stroke-[var(--ui-text-on-status-warning)]",
+	success: "stroke-[var(--ui-text-on-status-success)]"
+}, d = {
+	danger: /* @__PURE__ */ r(o, { className: "text-[var(--ui-text-on-status-danger)]" }),
+	critical: /* @__PURE__ */ r(s, { className: "text-[var(--ui-text-on-status-critical)]" }),
+	warning: /* @__PURE__ */ r(s, { className: "text-[var(--ui-text-on-status-warning)]" }),
+	success: /* @__PURE__ */ r(a, { className: "text-[var(--ui-text-on-status-success)]" })
 };
-function O(s) {
-  return s >= 0.8 ? "success" : s >= 0.6 ? "warning" : s >= 0.4 ? "critical" : "danger";
+function f(e) {
+	return e >= .8 ? "success" : e >= .6 ? "warning" : e >= .4 ? "critical" : "danger";
 }
-const W = P(
-  "relative inline-flex shrink-0 items-center justify-center",
-  {
-    variants: {
-      size: { tiny: "", sm: "", md: "", lg: "" }
-    },
-    defaultVariants: { size: "sm" }
-  }
-), $ = I.forwardRef(
-  ({
-    className: s,
-    value: l = 0,
-    max: n = 100,
-    size: u = "sm",
-    status: h,
-    showValue: k = !1,
-    showIcon: v = !1,
-    children: p,
-    ...N
-  }, y) => {
-    const { d: t, stroke: o, font: C } = S[u], w = n > 0 ? n : 100, a = Math.min(1, Math.max(0, l / w)), d = h ?? O(a), i = (t - o) / 2, f = 2 * Math.PI * i, r = t / 2, b = v ? _[d] : void 0, m = p ?? b ?? (k ? `${Math.round(a * 100)}%` : null);
-    return /* @__PURE__ */ x(
-      M.Root,
-      {
-        ref: y,
-        value: l,
-        max: n,
-        className: c(W({ size: u }), s),
-        style: { width: t, height: t },
-        ...N,
-        children: [
-          /* @__PURE__ */ x(
-            "svg",
-            {
-              width: t,
-              height: t,
-              viewBox: `0 0 ${t} ${t}`,
-              className: "-rotate-90",
-              "aria-hidden": "true",
-              children: [
-                /* @__PURE__ */ e(
-                  "circle",
-                  {
-                    className: "stroke-[var(--ui-border-on-surface-border)]",
-                    fill: "none",
-                    strokeWidth: o,
-                    cx: r,
-                    cy: r,
-                    r: i
-                  }
-                ),
-                /* @__PURE__ */ e(
-                  "circle",
-                  {
-                    className: c(T[d], "transition-[stroke-dashoffset]"),
-                    fill: "none",
-                    strokeWidth: o,
-                    strokeLinecap: "round",
-                    cx: r,
-                    cy: r,
-                    r: i,
-                    strokeDasharray: f,
-                    strokeDashoffset: f * (1 - a)
-                  }
-                )
-              ]
-            }
-          ),
-          m != null && /* @__PURE__ */ e(
-            "span",
-            {
-              className: c(
-                "absolute inset-0 flex items-center justify-center text-foreground [&_svg]:size-[60%]",
-                C
-              ),
-              children: m
-            }
-          )
-        ]
-      }
-    );
-  }
-);
-$.displayName = "ProgressCircle";
-export {
-  $ as ProgressCircle,
-  W as progressCircleVariants
-};
-//# sourceMappingURL=progress-circle.js.map
+var p = t("relative inline-flex shrink-0 items-center justify-center", {
+	variants: { size: {
+		tiny: "",
+		sm: "",
+		md: "",
+		lg: ""
+	} },
+	defaultVariants: { size: "sm" }
+}), m = n.forwardRef(({ className: t, value: n = 0, max: a = 100, size: o = "sm", status: s, showValue: m = !1, showIcon: h = !1, children: g, ..._ }, v) => {
+	let { d: y, stroke: b, font: x } = l[o], S = Math.min(1, Math.max(0, n / (a > 0 ? a : 100))), C = s ?? f(S), w = (y - b) / 2, T = 2 * Math.PI * w, E = y / 2, D = h ? d[C] : void 0, O = g ?? D ?? (m ? `${Math.round(S * 100)}%` : null);
+	return /* @__PURE__ */ i(c.Root, {
+		ref: v,
+		value: n,
+		max: a,
+		className: e(p({ size: o }), t),
+		style: {
+			width: y,
+			height: y
+		},
+		..._,
+		children: [/* @__PURE__ */ i("svg", {
+			width: y,
+			height: y,
+			viewBox: `0 0 ${y} ${y}`,
+			className: "-rotate-90",
+			"aria-hidden": "true",
+			children: [/* @__PURE__ */ r("circle", {
+				className: "stroke-[var(--ui-border-on-surface-border)]",
+				fill: "none",
+				strokeWidth: b,
+				cx: E,
+				cy: E,
+				r: w
+			}), /* @__PURE__ */ r("circle", {
+				className: e(u[C], "transition-[stroke-dashoffset]"),
+				fill: "none",
+				strokeWidth: b,
+				strokeLinecap: "round",
+				cx: E,
+				cy: E,
+				r: w,
+				strokeDasharray: T,
+				strokeDashoffset: T * (1 - S)
+			})]
+		}), O != null && /* @__PURE__ */ r("span", {
+			className: e("absolute inset-0 flex items-center justify-center text-foreground [&_svg]:size-[60%]", x),
+			children: O
+		})]
+	});
+});
+m.displayName = "ProgressCircle";
+//#endregion
+export { m as ProgressCircle, p as progressCircleVariants };
+
+//# sourceMappingURL=progress-circle.js.map

package/dist/components/ui/progress-circle/progress-circle.js.map

@@ -1 +1 @@
-{"version":3,"file":"progress-circle.js","sources":["../../../../src/components/ui/progress-circle/progress-circle.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Progress as ProgressPrimitive } from '@base-ui/react/progress';\nimport {\n  CircleCheckIcon,\n  CircleTimesIcon,\n  TriangleWarningIcon,\n} from '@acronis-platform/icons-react/stroke-mono';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '@/lib/utils';\n\n// A circular (radial) progress indicator — an SVG ring whose arc fills with the\n// value and whose color tracks the level (danger → critical → warning →\n// success). Built from the Cyber-Compliance \"Compliance %\" design (node\n// 2396-186059) and the Vue kit's `AvProgressRadial`. The ring is wrapped in the\n// Base UI Progress primitive so it carries the proper `role=\"progressbar\"` +\n// `aria-valuenow/min/max`; the visuals are a hand-drawn SVG (Base UI's Track/\n// Indicator are linear-only). No `--ui-progress-circle-*` tier — the arc uses the\n// shared status colors (`--ui-text-on-status-*`), the track the border token, and\n// the center label the surface foreground.\n\n// `brand` is the neutral single-color mode (matches the linear Progress accent);\n// the others are score levels. With no `status`, the level is derived from the\n// value (like the Vue ProgressRadial).\nexport type ProgressCircleStatus =\n  | 'brand'\n  | 'danger'\n  | 'critical'\n  | 'warning'\n  | 'success';\n\n// Size → [diameter px, stroke px, center font class]. The table cell uses the\n// smaller sizes; lg suits cards/widgets.\nconst SIZES = {\n  tiny: { d: 16, stroke: 2, font: 'text-[10px] leading-none' },\n  sm: { d: 24, stroke: 3, font: 'text-[10px] leading-none' },\n  md: { d: 40, stroke: 4, font: 'text-xs font-semibold' },\n  lg: { d: 64, stroke: 5, font: 'text-sm font-semibold' },\n} as const;\n\nexport type ProgressCircleSize = keyof typeof SIZES;\n\nconst ARC_COLOR: Record<ProgressCircleStatus, string> = {\n  brand: 'stroke-[var(--ui-background-brand-secondary)]',\n  danger: 'stroke-[var(--ui-text-on-status-danger)]',\n  critical: 'stroke-[var(--ui-text-on-status-critical)]',\n  warning: 'stroke-[var(--ui-text-on-status-warning)]',\n  success: 'stroke-[var(--ui-text-on-status-success)]',\n};\n\n// `brand` has no score icon — only the level statuses do.\nconst ICON_BY_STATUS: Partial<Record<ProgressCircleStatus, React.ReactNode>> = {\n  danger: <CircleTimesIcon className=\"text-[var(--ui-text-on-status-danger)]\" />,\n  critical: (\n    <TriangleWarningIcon className=\"text-[var(--ui-text-on-status-critical)]\" />\n  ),\n  warning: (\n    <TriangleWarningIcon className=\"text-[var(--ui-text-on-status-warning)]\" />\n  ),\n  success: (\n    <CircleCheckIcon className=\"text-[var(--ui-text-on-status-success)]\" />\n  ),\n};\n\n// Default value → status thresholds (confirm exact breakpoints with design — the\n// Figma shows ~25% danger, 50% critical, 75% warning, 80%+ success).\nfunction statusForFraction(fraction: number): ProgressCircleStatus {\n  if (fraction >= 0.8) return 'success';\n  if (fraction >= 0.6) return 'warning';\n  if (fraction >= 0.4) return 'critical';\n  return 'danger';\n}\n\nconst progressCircleVariants = cva(\n  'relative inline-flex shrink-0 items-center justify-center',\n  {\n    variants: {\n      size: { tiny: '', sm: '', md: '', lg: '' },\n    },\n    defaultVariants: { size: 'sm' },\n  }\n);\n\nexport interface ProgressCircleProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'>,\n    VariantProps<typeof progressCircleVariants> {\n  /** Current progress; clamped to `[0, max]`. */\n  value?: number;\n  /** Value representing full completion. */\n  max?: number;\n  /** Ring diameter + stroke. Defaults to `sm`. */\n  size?: ProgressCircleSize;\n  /** Color level for the arc. Omit to derive from `value`/`max` by thresholds. */\n  status?: ProgressCircleStatus;\n  /** Show the rounded percentage in the center. */\n  showValue?: boolean;\n  /** Show a status icon in the center (takes priority over `showValue`). */\n  showIcon?: boolean;\n  /** Custom center content (takes priority over icon/value). */\n  children?: React.ReactNode;\n}\n\nconst ProgressCircle = React.forwardRef<HTMLDivElement, ProgressCircleProps>(\n  (\n    {\n      className,\n      value = 0,\n      max = 100,\n      size = 'sm',\n      status,\n      showValue = false,\n      showIcon = false,\n      children,\n      ...props\n    },\n    ref\n  ) => {\n    const { d, stroke, font } = SIZES[size];\n    const safeMax = max > 0 ? max : 100;\n    const fraction = Math.min(1, Math.max(0, value / safeMax));\n    const level = status ?? statusForFraction(fraction);\n    const radius = (d - stroke) / 2;\n    const circumference = 2 * Math.PI * radius;\n    const center = d / 2;\n    const icon = showIcon ? ICON_BY_STATUS[level] : undefined;\n    const centerContent =\n      children ?? icon ?? (showValue ? `${Math.round(fraction * 100)}%` : null);\n\n    return (\n      <ProgressPrimitive.Root\n        ref={ref}\n        value={value}\n        max={max}\n        className={cn(progressCircleVariants({ size }), className)}\n        style={{ width: d, height: d }}\n        {...props}\n      >\n        <svg\n          width={d}\n          height={d}\n          viewBox={`0 0 ${d} ${d}`}\n          className=\"-rotate-90\"\n          aria-hidden=\"true\"\n        >\n          <circle\n            className=\"stroke-[var(--ui-border-on-surface-border)]\"\n            fill=\"none\"\n            strokeWidth={stroke}\n            cx={center}\n            cy={center}\n            r={radius}\n          />\n          <circle\n            className={cn(ARC_COLOR[level], 'transition-[stroke-dashoffset]')}\n            fill=\"none\"\n            strokeWidth={stroke}\n            strokeLinecap=\"round\"\n            cx={center}\n            cy={center}\n            r={radius}\n            strokeDasharray={circumference}\n            strokeDashoffset={circumference * (1 - fraction)}\n          />\n        </svg>\n        {centerContent != null && (\n          <span\n            className={cn(\n              'absolute inset-0 flex items-center justify-center text-foreground [&_svg]:size-[60%]',\n              font\n            )}\n          >\n            {centerContent}\n          </span>\n        )}\n      </ProgressPrimitive.Root>\n    );\n  }\n);\nProgressCircle.displayName = 'ProgressCircle';\n\nexport { ProgressCircle, progressCircleVariants };\n"],"names":["SIZES","ARC_COLOR","ICON_BY_STATUS","jsx","CircleTimesIcon","TriangleWarningIcon","CircleCheckIcon","statusForFraction","fraction","progressCircleVariants","cva","ProgressCircle","React","className","value","max","size","status","showValue","showIcon","children","props","ref","d","stroke","font","safeMax","level","radius","circumference","center","icon","centerContent","jsxs","ProgressPrimitive","cn"],"mappings":";;;;;;AAmCA,MAAMA,IAAQ;AAAA,EACZ,MAAM,EAAE,GAAG,IAAI,QAAQ,GAAG,MAAM,2BAAA;AAAA,EAChC,IAAI,EAAE,GAAG,IAAI,QAAQ,GAAG,MAAM,2BAAA;AAAA,EAC9B,IAAI,EAAE,GAAG,IAAI,QAAQ,GAAG,MAAM,wBAAA;AAAA,EAC9B,IAAI,EAAE,GAAG,IAAI,QAAQ,GAAG,MAAM,wBAAA;AAChC,GAIMC,IAAkD;AAAA,EACtD,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,SAAS;AAAA,EACT,SAAS;AACX,GAGMC,IAAyE;AAAA,EAC7E,QAAQ,gBAAAC,EAACC,GAAA,EAAgB,WAAU,yCAAA,CAAyC;AAAA,EAC5E,UACE,gBAAAD,EAACE,GAAA,EAAoB,WAAU,2CAAA,CAA2C;AAAA,EAE5E,SACE,gBAAAF,EAACE,GAAA,EAAoB,WAAU,0CAAA,CAA0C;AAAA,EAE3E,SACE,gBAAAF,EAACG,GAAA,EAAgB,WAAU,0CAAA,CAA0C;AAEzE;AAIA,SAASC,EAAkBC,GAAwC;AACjE,SAAIA,KAAY,MAAY,YACxBA,KAAY,MAAY,YACxBA,KAAY,MAAY,aACrB;AACT;AAEA,MAAMC,IAAyBC;AAAA,EAC7B;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,MAAM,EAAE,MAAM,IAAI,IAAI,IAAI,IAAI,IAAI,IAAI,GAAA;AAAA,IAAG;AAAA,IAE3C,iBAAiB,EAAE,MAAM,KAAA;AAAA,EAAK;AAElC,GAqBMC,IAAiBC,EAAM;AAAA,EAC3B,CACE;AAAA,IACE,WAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA,IACR,KAAAC,IAAM;AAAA,IACN,MAAAC,IAAO;AAAA,IACP,QAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,IACZ,UAAAC,IAAW;AAAA,IACX,UAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,MACG;AACH,UAAM,EAAE,GAAAC,GAAG,QAAAC,GAAQ,MAAAC,EAAA,IAASzB,EAAMgB,CAAI,GAChCU,IAAUX,IAAM,IAAIA,IAAM,KAC1BP,IAAW,KAAK,IAAI,GAAG,KAAK,IAAI,GAAGM,IAAQY,CAAO,CAAC,GACnDC,IAAQV,KAAUV,EAAkBC,CAAQ,GAC5CoB,KAAUL,IAAIC,KAAU,GACxBK,IAAgB,IAAI,KAAK,KAAKD,GAC9BE,IAASP,IAAI,GACbQ,IAAOZ,IAAWjB,EAAeyB,CAAK,IAAI,QAC1CK,IACJZ,KAAYW,MAASb,IAAY,GAAG,KAAK,MAAMV,IAAW,GAAG,CAAC,MAAM;AAEtE,WACE,gBAAAyB;AAAA,MAACC,EAAkB;AAAA,MAAlB;AAAA,QACC,KAAAZ;AAAA,QACA,OAAAR;AAAA,QACA,KAAAC;AAAA,QACA,WAAWoB,EAAG1B,EAAuB,EAAE,MAAAO,EAAA,CAAM,GAAGH,CAAS;AAAA,QACzD,OAAO,EAAE,OAAOU,GAAG,QAAQA,EAAA;AAAA,QAC1B,GAAGF;AAAA,QAEJ,UAAA;AAAA,UAAA,gBAAAY;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,OAAOV;AAAA,cACP,QAAQA;AAAA,cACR,SAAS,OAAOA,CAAC,IAAIA,CAAC;AAAA,cACtB,WAAU;AAAA,cACV,eAAY;AAAA,cAEZ,UAAA;AAAA,gBAAA,gBAAApB;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,WAAU;AAAA,oBACV,MAAK;AAAA,oBACL,aAAaqB;AAAA,oBACb,IAAIM;AAAA,oBACJ,IAAIA;AAAA,oBACJ,GAAGF;AAAA,kBAAA;AAAA,gBAAA;AAAA,gBAEL,gBAAAzB;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,WAAWgC,EAAGlC,EAAU0B,CAAK,GAAG,gCAAgC;AAAA,oBAChE,MAAK;AAAA,oBACL,aAAaH;AAAA,oBACb,eAAc;AAAA,oBACd,IAAIM;AAAA,oBACJ,IAAIA;AAAA,oBACJ,GAAGF;AAAA,oBACH,iBAAiBC;AAAA,oBACjB,kBAAkBA,KAAiB,IAAIrB;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACzC;AAAA,YAAA;AAAA,UAAA;AAAA,UAEDwB,KAAiB,QAChB,gBAAA7B;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAWgC;AAAA,gBACT;AAAA,gBACAV;AAAA,cAAA;AAAA,cAGD,UAAAO;AAAA,YAAA;AAAA,UAAA;AAAA,QACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAIR;AACF;AACArB,EAAe,cAAc;"}
+{"version":3,"file":"progress-circle.js","names":[],"sources":["../../../../src/components/ui/progress-circle/progress-circle.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Progress as ProgressPrimitive } from '@base-ui/react/progress';\nimport {\n  CircleCheckIcon,\n  CircleTimesIcon,\n  TriangleWarningIcon,\n} from '@acronis-platform/icons-react/stroke-mono';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '@/lib/utils';\n\n// A circular (radial) progress indicator — an SVG ring whose arc fills with the\n// value and whose color tracks the level (danger → critical → warning →\n// success). Built from the Cyber-Compliance \"Compliance %\" design (node\n// 2396-186059) and the Vue kit's `AvProgressRadial`. The ring is wrapped in the\n// Base UI Progress primitive so it carries the proper `role=\"progressbar\"` +\n// `aria-valuenow/min/max`; the visuals are a hand-drawn SVG (Base UI's Track/\n// Indicator are linear-only). No `--ui-progress-circle-*` tier — the arc uses the\n// shared status colors (`--ui-text-on-status-*`), the track the border token, and\n// the center label the surface foreground.\n\n// `brand` is the neutral single-color mode (matches the linear Progress accent);\n// the others are score levels. With no `status`, the level is derived from the\n// value (like the Vue ProgressRadial).\nexport type ProgressCircleStatus =\n  | 'brand'\n  | 'danger'\n  | 'critical'\n  | 'warning'\n  | 'success';\n\n// Size → [diameter px, stroke px, center font class]. The table cell uses the\n// smaller sizes; lg suits cards/widgets.\nconst SIZES = {\n  tiny: { d: 16, stroke: 2, font: 'text-[10px] leading-none' },\n  sm: { d: 24, stroke: 3, font: 'text-[10px] leading-none' },\n  md: { d: 40, stroke: 4, font: 'text-xs font-semibold' },\n  lg: { d: 64, stroke: 5, font: 'text-sm font-semibold' },\n} as const;\n\nexport type ProgressCircleSize = keyof typeof SIZES;\n\nconst ARC_COLOR: Record<ProgressCircleStatus, string> = {\n  brand: 'stroke-[var(--ui-background-brand-secondary)]',\n  danger: 'stroke-[var(--ui-text-on-status-danger)]',\n  critical: 'stroke-[var(--ui-text-on-status-critical)]',\n  warning: 'stroke-[var(--ui-text-on-status-warning)]',\n  success: 'stroke-[var(--ui-text-on-status-success)]',\n};\n\n// `brand` has no score icon — only the level statuses do.\nconst ICON_BY_STATUS: Partial<Record<ProgressCircleStatus, React.ReactNode>> = {\n  danger: <CircleTimesIcon className=\"text-[var(--ui-text-on-status-danger)]\" />,\n  critical: (\n    <TriangleWarningIcon className=\"text-[var(--ui-text-on-status-critical)]\" />\n  ),\n  warning: (\n    <TriangleWarningIcon className=\"text-[var(--ui-text-on-status-warning)]\" />\n  ),\n  success: (\n    <CircleCheckIcon className=\"text-[var(--ui-text-on-status-success)]\" />\n  ),\n};\n\n// Default value → status thresholds (confirm exact breakpoints with design — the\n// Figma shows ~25% danger, 50% critical, 75% warning, 80%+ success).\nfunction statusForFraction(fraction: number): ProgressCircleStatus {\n  if (fraction >= 0.8) return 'success';\n  if (fraction >= 0.6) return 'warning';\n  if (fraction >= 0.4) return 'critical';\n  return 'danger';\n}\n\nconst progressCircleVariants = cva(\n  'relative inline-flex shrink-0 items-center justify-center',\n  {\n    variants: {\n      size: { tiny: '', sm: '', md: '', lg: '' },\n    },\n    defaultVariants: { size: 'sm' },\n  }\n);\n\nexport interface ProgressCircleProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'>,\n    VariantProps<typeof progressCircleVariants> {\n  /** Current progress; clamped to `[0, max]`. */\n  value?: number;\n  /** Value representing full completion. */\n  max?: number;\n  /** Ring diameter + stroke. Defaults to `sm`. */\n  size?: ProgressCircleSize;\n  /** Color level for the arc. Omit to derive from `value`/`max` by thresholds. */\n  status?: ProgressCircleStatus;\n  /** Show the rounded percentage in the center. */\n  showValue?: boolean;\n  /** Show a status icon in the center (takes priority over `showValue`). */\n  showIcon?: boolean;\n  /** Custom center content (takes priority over icon/value). */\n  children?: React.ReactNode;\n}\n\nconst ProgressCircle = React.forwardRef<HTMLDivElement, ProgressCircleProps>(\n  (\n    {\n      className,\n      value = 0,\n      max = 100,\n      size = 'sm',\n      status,\n      showValue = false,\n      showIcon = false,\n      children,\n      ...props\n    },\n    ref\n  ) => {\n    const { d, stroke, font } = SIZES[size];\n    const safeMax = max > 0 ? max : 100;\n    const fraction = Math.min(1, Math.max(0, value / safeMax));\n    const level = status ?? statusForFraction(fraction);\n    const radius = (d - stroke) / 2;\n    const circumference = 2 * Math.PI * radius;\n    const center = d / 2;\n    const icon = showIcon ? ICON_BY_STATUS[level] : undefined;\n    const centerContent =\n      children ?? icon ?? (showValue ? `${Math.round(fraction * 100)}%` : null);\n\n    return (\n      <ProgressPrimitive.Root\n        ref={ref}\n        value={value}\n        max={max}\n        className={cn(progressCircleVariants({ size }), className)}\n        style={{ width: d, height: d }}\n        {...props}\n      >\n        <svg\n          width={d}\n          height={d}\n          viewBox={`0 0 ${d} ${d}`}\n          className=\"-rotate-90\"\n          aria-hidden=\"true\"\n        >\n          <circle\n            className=\"stroke-[var(--ui-border-on-surface-border)]\"\n            fill=\"none\"\n            strokeWidth={stroke}\n            cx={center}\n            cy={center}\n            r={radius}\n          />\n          <circle\n            className={cn(ARC_COLOR[level], 'transition-[stroke-dashoffset]')}\n            fill=\"none\"\n            strokeWidth={stroke}\n            strokeLinecap=\"round\"\n            cx={center}\n            cy={center}\n            r={radius}\n            strokeDasharray={circumference}\n            strokeDashoffset={circumference * (1 - fraction)}\n          />\n        </svg>\n        {centerContent != null && (\n          <span\n            className={cn(\n              'absolute inset-0 flex items-center justify-center text-foreground [&_svg]:size-[60%]',\n              font\n            )}\n          >\n            {centerContent}\n          </span>\n        )}\n      </ProgressPrimitive.Root>\n    );\n  }\n);\nProgressCircle.displayName = 'ProgressCircle';\n\nexport { ProgressCircle, progressCircleVariants };\n"],"mappings":";;;;;;;;AAmCA,IAAM,IAAQ;CACZ,MAAM;EAAE,GAAG;EAAI,QAAQ;EAAG,MAAM;CAA2B;CAC3D,IAAI;EAAE,GAAG;EAAI,QAAQ;EAAG,MAAM;CAA2B;CACzD,IAAI;EAAE,GAAG;EAAI,QAAQ;EAAG,MAAM;CAAwB;CACtD,IAAI;EAAE,GAAG;EAAI,QAAQ;EAAG,MAAM;CAAwB;AACxD,GAIM,IAAkD;CACtD,OAAO;CACP,QAAQ;CACR,UAAU;CACV,SAAS;CACT,SAAS;AACX,GAGM,IAAyE;CAC7E,QAAQ,kBAAC,GAAD,EAAiB,WAAU,yCAA0C,CAAA;CAC7E,UACE,kBAAC,GAAD,EAAqB,WAAU,2CAA4C,CAAA;CAE7E,SACE,kBAAC,GAAD,EAAqB,WAAU,0CAA2C,CAAA;CAE5E,SACE,kBAAC,GAAD,EAAiB,WAAU,0CAA2C,CAAA;AAE1E;AAIA,SAAS,EAAkB,GAAwC;CAIjE,OAHI,KAAY,KAAY,YACxB,KAAY,KAAY,YACxB,KAAY,KAAY,aACrB;AACT;AAEA,IAAM,IAAyB,EAC7B,6DACA;CACE,UAAU,EACR,MAAM;EAAE,MAAM;EAAI,IAAI;EAAI,IAAI;EAAI,IAAI;CAAG,EAC3C;CACA,iBAAiB,EAAE,MAAM,KAAK;AAChC,CACF,GAqBM,IAAiB,EAAM,YAEzB,EACE,cACA,WAAQ,GACR,SAAM,KACN,UAAO,MACP,WACA,eAAY,IACZ,cAAW,IACX,aACA,GAAG,KAEL,MACG;CACH,IAAM,EAAE,MAAG,WAAQ,YAAS,EAAM,IAE5B,IAAW,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,KADzB,IAAM,IAAI,IAAM,IACwB,CAAC,GACnD,IAAQ,KAAU,EAAkB,CAAQ,GAC5C,KAAU,IAAI,KAAU,GACxB,IAAgB,IAAI,KAAK,KAAK,GAC9B,IAAS,IAAI,GACb,IAAO,IAAW,EAAe,KAAS,KAAA,GAC1C,IACJ,KAAY,MAAS,IAAY,GAAG,KAAK,MAAM,IAAW,GAAG,EAAE,KAAK;CAEtE,OACE,kBAAC,EAAkB,MAAnB;EACO;EACE;EACF;EACL,WAAW,EAAG,EAAuB,EAAE,QAAK,CAAC,GAAG,CAAS;EACzD,OAAO;GAAE,OAAO;GAAG,QAAQ;EAAE;EAC7B,GAAI;EANN,UAAA,CAQE,kBAAC,OAAD;GACE,OAAO;GACP,QAAQ;GACR,SAAS,OAAO,EAAE,GAAG;GACrB,WAAU;GACV,eAAY;GALd,UAAA,CAOE,kBAAC,UAAD;IACE,WAAU;IACV,MAAK;IACL,aAAa;IACb,IAAI;IACJ,IAAI;IACJ,GAAG;GACJ,CAAA,GACD,kBAAC,UAAD;IACE,WAAW,EAAG,EAAU,IAAQ,gCAAgC;IAChE,MAAK;IACL,aAAa;IACb,eAAc;IACd,IAAI;IACJ,IAAI;IACJ,GAAG;IACH,iBAAiB;IACjB,kBAAkB,KAAiB,IAAI;GACxC,CAAA,CACE;EACJ,CAAA,GAAA,KAAiB,QAChB,kBAAC,QAAD;GACE,WAAW,EACT,wFACA,CACF;GAEC,UAAA;EACG,CAAA,CAEc;;AAE5B,CACF;AACA,EAAe,cAAc"}