prime-ui-kit 0.9.1 → 0.9.3

package/dist/chunks/{chunk-NHOWNIAR.js → chunk-6JTZOA5I.js}

@@ -15,31 +15,9 @@ function useControlSize(sizeProp) {
   return sizeProp ?? host ?? "m";
 }
 
-// src/components/scroll-container/ScrollContainer.tsx
-import * as React3 from "react";
-
-// src/hooks/useMergedRefs.ts
+// src/components/spinner/Spinner.tsx
 import * as React2 from "react";
 
-// src/internal/mergeRefs.ts
-function mergeRefs(...refs) {
-  return (value) => {
-    for (const ref of refs) {
-      if (ref == null) continue;
-      if (typeof ref === "function") {
-        ref(value);
-      } else {
-        ref.current = value;
-      }
-    }
-  };
-}
-
-// src/hooks/useMergedRefs.ts
-function useMergedRefs(...refs) {
-  return React2.useMemo(() => mergeRefs(...refs), refs);
-}
-
 // src/internal/cx.ts
 function cx(...classNames) {
   return classNames.filter(Boolean).join(" ");
@@ -58,102 +36,6 @@ function toDataAttributes(input) {
   return result;
 }
 
-// src/components/scroll-container/ScrollContainer.module.css
-var ScrollContainer_default = {
-  root: "ScrollContainer_root",
-  vertical: "ScrollContainer_vertical",
-  horizontal: "ScrollContainer_horizontal",
-  both: "ScrollContainer_both",
-  overscrollContain: "ScrollContainer_overscrollContain",
-  overscrollNone: "ScrollContainer_overscrollNone",
-  scrollbarHidden: "ScrollContainer_scrollbarHidden"
-};
-
-// src/components/scroll-container/ScrollContainer.tsx
-import { jsx as jsx2 } from "react/jsx-runtime";
-var axisClass = {
-  vertical: ScrollContainer_default.vertical,
-  horizontal: ScrollContainer_default.horizontal,
-  both: ScrollContainer_default.both
-};
-function useEdgeOverflow(ref, enabled, horizontal) {
-  const [overflow, setOverflow] = React3.useState({ start: false, end: false });
-  React3.useLayoutEffect(() => {
-    const node = ref.current;
-    if (!enabled || !node) return;
-    const update = () => {
-      const position = horizontal ? Math.abs(node.scrollLeft) : node.scrollTop;
-      const max = horizontal ? node.scrollWidth - node.clientWidth : node.scrollHeight - node.clientHeight;
-      const start = position > 1;
-      const end = max - position > 1;
-      setOverflow((prev) => prev.start === start && prev.end === end ? prev : { start, end });
-    };
-    let frame = 0;
-    const schedule = () => {
-      if (frame) return;
-      frame = requestAnimationFrame(() => {
-        frame = 0;
-        update();
-      });
-    };
-    update();
-    node.addEventListener("scroll", schedule, { passive: true });
-    const resize = typeof ResizeObserver === "undefined" ? null : new ResizeObserver(schedule);
-    const observeChildren = () => {
-      for (const child of Array.from(node.children)) resize?.observe(child);
-    };
-    resize?.observe(node);
-    observeChildren();
-    const mutation = new MutationObserver(() => {
-      observeChildren();
-      schedule();
-    });
-    mutation.observe(node, { childList: true });
-    return () => {
-      cancelAnimationFrame(frame);
-      node.removeEventListener("scroll", schedule);
-      resize?.disconnect();
-      mutation.disconnect();
-    };
-  }, [ref, enabled, horizontal]);
-  return enabled ? overflow : { start: false, end: false };
-}
-function ScrollContainer({
-  as: Component = "div",
-  axis = "vertical",
-  overscrollBehavior = "contain",
-  fade = false,
-  scrollbar = "thin",
-  className,
-  ref,
-  ...rest
-}) {
-  const innerRef = React3.useRef(null);
-  const mergedRef = useMergedRefs(innerRef, ref);
-  const horizontal = axis === "horizontal";
-  const overflow = useEdgeOverflow(innerRef, fade, horizontal);
-  return /* @__PURE__ */ jsx2(
-    Component,
-    {
-      ref: mergedRef,
-      className: cx(
-        ScrollContainer_default.root,
-        axisClass[axis],
-        overscrollBehavior === "contain" && ScrollContainer_default.overscrollContain,
-        overscrollBehavior === "none" && ScrollContainer_default.overscrollNone,
-        scrollbar === "hidden" && ScrollContainer_default.scrollbarHidden,
-        className
-      ),
-      ...toDataAttributes({
-        fade: fade ? horizontal ? "horizontal" : "vertical" : void 0,
-        "overflow-start": overflow.start || void 0,
-        "overflow-end": overflow.end || void 0
-      }),
-      ...rest
-    }
-  );
-}
-
 // src/internal/iconBox.module.css
 var iconBox_default = {
   box: "iconBox_box",
@@ -175,216 +57,16 @@ var textTone_default = {
   tone: "textTone_tone"
 };
 
-// src/icons/Icon.module.css
-var Icon_default = {
-  root: "Icon_root"
-};
-
-// src/icons/registry.ts
-import {
-  Activity,
-  AlertTriangle,
-  ArrowDown,
-  ArrowUp,
-  ArrowUpDown,
-  Bell,
-  Bold,
-  BookOpen,
-  Calendar,
-  ChartColumn,
-  Check,
-  CheckCircle2,
-  ChevronDown,
-  ChevronLeft,
-  ChevronRight,
-  ChevronsLeft,
-  ChevronsUpDown,
-  ChevronUp,
-  Circle,
-  CloudOff,
-  CloudUpload,
-  Code2,
-  Copy,
-  Download,
-  ExternalLink,
-  Eye,
-  EyeOff,
-  FileText,
-  GripVertical,
-  HardDrive,
-  House,
-  Image,
-  Inbox,
-  Info,
-  Italic,
-  KeyRound,
-  LayoutDashboard,
-  LayoutGrid,
-  Link2,
-  List,
-  ListFilter,
-  ListTodo,
-  Lock,
-  LogIn,
-  LogOut,
-  Mail,
-  MailCheck,
-  Menu,
-  MessageSquare,
-  Minus,
-  Monitor,
-  Moon,
-  MoreHorizontal,
-  Package,
-  PanelLeftClose,
-  PanelLeftOpen,
-  Pipette,
-  Plus,
-  Receipt,
-  RefreshCw,
-  Rocket,
-  Search,
-  Send,
-  Settings,
-  ShoppingCart,
-  Smartphone,
-  Sun,
-  Tablet,
-  Trash2,
-  Truck,
-  Underline,
-  UserRound,
-  Users,
-  Wallet,
-  X,
-  XCircle
-} from "lucide-react";
-var iconRegistry = {
-  "nav.chevronDown": ChevronDown,
-  "nav.chevronLeft": ChevronLeft,
-  "nav.chevronRight": ChevronRight,
-  "nav.chevronUp": ChevronUp,
-  "nav.chevronsLeft": ChevronsLeft,
-  "nav.chevronsUpDown": ChevronsUpDown,
-  "nav.dashboard": LayoutDashboard,
-  "nav.home": House,
-  "nav.itemDot": Circle,
-  "nav.layoutGrid": LayoutGrid,
-  "nav.menu": Menu,
-  "nav.sidebarCollapse": PanelLeftClose,
-  "nav.sidebarExpand": PanelLeftOpen,
-  "action.add": Plus,
-  "action.check": Check,
-  "action.close": X,
-  "action.copy": Copy,
-  "action.delete": Trash2,
-  "action.download": Download,
-  "action.drag": GripVertical,
-  "action.externalLink": ExternalLink,
-  "action.eyedropper": Pipette,
-  "action.filter": ListFilter,
-  "action.login": LogIn,
-  "action.logout": LogOut,
-  "action.more": MoreHorizontal,
-  "action.refresh": RefreshCw,
-  "action.remove": Minus,
-  "action.search": Search,
-  "action.send": Send,
-  "action.settings": Settings,
-  "action.upload": CloudUpload,
-  "field.calendar": Calendar,
-  "field.email": Mail,
-  "field.password.show": Eye,
-  "field.password.hide": EyeOff,
-  "format.bold": Bold,
-  "format.italic": Italic,
-  "format.link": Link2,
-  "format.list": List,
-  "format.underline": Underline,
-  "object.activity": Activity,
-  "object.bell": Bell,
-  "object.book": BookOpen,
-  "object.cart": ShoppingCart,
-  "object.chart": ChartColumn,
-  "object.document": FileText,
-  "object.image": Image,
-  "object.inbox": Inbox,
-  "object.key": KeyRound,
-  "object.message": MessageSquare,
-  "object.package": Package,
-  "object.receipt": Receipt,
-  "object.rocket": Rocket,
-  "object.storage": HardDrive,
-  "object.tasks": ListTodo,
-  "object.truck": Truck,
-  "object.user": UserRound,
-  "object.users": Users,
-  "object.wallet": Wallet,
-  "sort.ascending": ArrowUp,
-  "sort.descending": ArrowDown,
-  "sort.none": ArrowUpDown,
-  "status.danger": XCircle,
-  "status.emailSent": MailCheck,
-  "status.info": Info,
-  "status.locked": Lock,
-  "status.offline": CloudOff,
-  "status.success": CheckCircle2,
-  "status.warning": AlertTriangle,
-  "theme.dark": Moon,
-  "theme.light": Sun,
-  "view.code": Code2,
-  "view.preview": Eye,
-  "viewport.desktop": Monitor,
-  "viewport.mobile": Smartphone,
-  "viewport.tablet": Tablet
-};
-
-// src/icons/Icon.tsx
-import { jsx as jsx3 } from "react/jsx-runtime";
-function IconSvg({
-  glyph: GlyphSvg,
-  className,
-  size,
-  tone = "default",
-  strokeWidth = 1.75,
-  ...rest
-}) {
-  const tier = useOptionalControlSize();
-  return /* @__PURE__ */ jsx3(
-    GlyphSvg,
-    {
-      className: cx(Icon_default.root, iconBoxClass(size, tier), textTone_default.tone, className),
-      "data-tone": tone === "default" ? void 0 : tone,
-      strokeWidth,
-      "aria-hidden": "true",
-      ...rest
-    }
-  );
-}
-function Icon({ name, ...rest }) {
-  return /* @__PURE__ */ jsx3(IconSvg, { glyph: iconRegistry[name], ...rest });
-}
-function createIcon(glyph) {
-  function DomainIcon(props) {
-    return /* @__PURE__ */ jsx3(IconSvg, { glyph, ...props });
-  }
-  DomainIcon.displayName = `Icon(${glyph.displayName ?? "Glyph"})`;
-  return DomainIcon;
-}
-
-// src/components/spinner/Spinner.tsx
-import * as React4 from "react";
-
-// src/internal/VisuallyHidden.module.css
-var VisuallyHidden_default = {
-  root: "VisuallyHidden_root"
+// src/internal/VisuallyHidden.module.css
+var VisuallyHidden_default = {
+  root: "VisuallyHidden_root"
 };
 
 // src/internal/VisuallyHidden.tsx
-import { jsx as jsx4 } from "react/jsx-runtime";
+import { jsx as jsx2 } from "react/jsx-runtime";
 var visuallyHiddenClass = VisuallyHidden_default.root;
 function VisuallyHidden({ className, ...rest }) {
-  return /* @__PURE__ */ jsx4("span", { className: cx(VisuallyHidden_default.root, className), ...rest });
+  return /* @__PURE__ */ jsx2("span", { className: cx(VisuallyHidden_default.root, className), ...rest });
 }
 
 // src/components/spinner/Spinner.module.css
@@ -395,7 +77,7 @@ var Spinner_default = {
 };
 
 // src/components/spinner/Spinner.tsx
-import { jsx as jsx5, jsxs } from "react/jsx-runtime";
+import { jsx as jsx3, jsxs } from "react/jsx-runtime";
 var SPINNER_LABELS = {
   loading: "\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430"
 };
@@ -407,7 +89,7 @@ function Spinner({
   ...rest
 }) {
   const controlSize = useOptionalControlSize();
-  const labels = React4.useMemo(() => ({ ...SPINNER_LABELS, ...labelsProp }), [labelsProp]);
+  const labels = React2.useMemo(() => ({ ...SPINNER_LABELS, ...labelsProp }), [labelsProp]);
   const size = sizeProp ?? controlSize ?? "m";
   return /* @__PURE__ */ jsxs(
     "span",
@@ -417,13 +99,16 @@ function Spinner({
       ...toDataAttributes({ size, tone: tone === "default" ? void 0 : tone }),
       ...rest,
       children: [
-        /* @__PURE__ */ jsx5("span", { className: Spinner_default.ring, "aria-hidden": "true" }),
-        /* @__PURE__ */ jsx5(VisuallyHidden, { children: labels.loading })
+        /* @__PURE__ */ jsx3("span", { className: Spinner_default.ring, "aria-hidden": "true" }),
+        /* @__PURE__ */ jsx3(VisuallyHidden, { children: labels.loading })
       ]
     }
   );
 }
 
+// src/components/button/Button.tsx
+import * as React8 from "react";
+
 // src/internal/fieldSurface.module.css
 var fieldSurface_default = {
   surface: "fieldSurface_surface"
@@ -445,12 +130,12 @@ var fieldTierClass = fieldTier_default.tier;
 var fieldTriggerClass = `${fieldTier_default.tier} ${fieldSurface_default.surface} ${fieldTrigger_default.trigger}`;
 
 // src/internal/iconLayout.ts
-import * as React5 from "react";
+import * as React3 from "react";
 function iconLayout(children, iconType) {
-  const content = React5.Children.toArray(children).filter(
+  const content = React3.Children.toArray(children).filter(
     (child) => !(typeof child === "string" && child.trim() === "")
   );
-  const isIcon = (child) => React5.isValidElement(child) && child.type === iconType;
+  const isIcon = (child) => React3.isValidElement(child) && child.type === iconType;
   const iconOnly = content.length > 0 && content.every(isIcon);
   return {
     iconOnly,
@@ -459,9 +144,174 @@ function iconLayout(children, iconType) {
   };
 }
 
+// src/internal/MorphText.tsx
+import * as React5 from "react";
+
+// src/hooks/usePresence.ts
+import * as React4 from "react";
+var DURATION_FALLBACK_MS = {
+  fast: 230,
+  base: 380,
+  slow: 570
+};
+var TIMEOUT_SLACK_MS = 50;
+function prefersReducedMotion() {
+  return typeof window !== "undefined" && typeof window.matchMedia === "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+}
+function parseDurationMs(raw) {
+  const value = raw.trim();
+  if (value === "") return null;
+  const n = Number.parseFloat(value);
+  if (Number.isNaN(n)) return null;
+  if (value.endsWith("ms")) return n;
+  if (value.endsWith("s")) return n * 1e3;
+  return null;
+}
+function motionDurationMs(token) {
+  if (typeof document === "undefined") return DURATION_FALLBACK_MS[token];
+  const raw = getComputedStyle(document.documentElement).getPropertyValue(
+    `--prime-motion-duration-${token}`
+  );
+  return parseDurationMs(raw) ?? DURATION_FALLBACK_MS[token];
+}
+function exitTimeoutMs(token) {
+  return motionDurationMs(token) + TIMEOUT_SLACK_MS;
+}
+function usePresence(open, options = {}) {
+  const { exitDuration = "base" } = options;
+  const [mounted, setMounted] = React4.useState(open);
+  if (open && !mounted) setMounted(true);
+  if (!open && mounted && prefersReducedMotion()) setMounted(false);
+  const openRef = React4.useRef(open);
+  openRef.current = open;
+  React4.useEffect(() => {
+    if (open || !mounted) return;
+    const id = window.setTimeout(() => setMounted(false), exitTimeoutMs(exitDuration));
+    return () => window.clearTimeout(id);
+  }, [open, mounted, exitDuration]);
+  const onExitEnd = React4.useCallback((event) => {
+    if (event.target !== event.currentTarget) return;
+    if (!openRef.current) setMounted(false);
+  }, []);
+  return { mounted: open || mounted, state: open ? "open" : "closed", onExitEnd };
+}
+
+// src/internal/MorphText.module.css
+var MorphText_default = {
+  root: "MorphText_root",
+  morphing: "MorphText_morphing",
+  sizer: "MorphText_sizer",
+  layer: "MorphText_layer",
+  letter: "MorphText_letter",
+  letterOut: "MorphText_letterOut",
+  primeMorphOut: "MorphText_primeMorphOut",
+  letterIn: "MorphText_letterIn",
+  primeMorphIn: "MorphText_primeMorphIn"
+};
+
+// src/internal/MorphText.tsx
+import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
+function digitsOnly(a, b) {
+  return a.replace(/\d/g, "") === b.replace(/\d/g, "");
+}
+function letters(text, kind) {
+  return [...text].map((char, i) => /* @__PURE__ */ jsx4(
+    "span",
+    {
+      className: cx(MorphText_default.letter, kind === "in" ? MorphText_default.letterIn : MorphText_default.letterOut),
+      style: { "--morph-i": i },
+      children: char
+    },
+    i
+  ));
+}
+function settleMs(text, root) {
+  const css = getComputedStyle(root);
+  const read = (name) => Number.parseFloat(css.getPropertyValue(name)) || 0;
+  const base = read("--prime-motion-duration-base");
+  const step = read("--prime-motion-stagger") / 6;
+  return base + step * text.length + 50;
+}
+function MorphText({ children: text, className }) {
+  const rootRef = React5.useRef(null);
+  const sizerRef = React5.useRef(null);
+  const prevText = React5.useRef(null);
+  const restWidth = React5.useRef(0);
+  const nextId = React5.useRef(0);
+  const [morph, setMorph] = React5.useState(null);
+  const morphRef = React5.useRef(morph);
+  morphRef.current = morph;
+  React5.useLayoutEffect(() => {
+    const root = rootRef.current;
+    const prev = prevText.current;
+    prevText.current = text;
+    if (!root || prev === null || prev === text) return;
+    if (prefersReducedMotion() || digitsOnly(prev, text)) {
+      setMorph(null);
+      return;
+    }
+    const running = morphRef.current;
+    const width = running ? root.getBoundingClientRect().width : restWidth.current;
+    nextId.current += 1;
+    setMorph({ id: nextId.current, from: running ? running.to : prev, to: text, width });
+  }, [text]);
+  React5.useLayoutEffect(() => {
+    if (!morph) return;
+    const root = rootRef.current;
+    const sizer = sizerRef.current;
+    if (!root || !sizer) return;
+    const target = sizer.getBoundingClientRect().width;
+    if (target !== morph.width) {
+      root.style.width = `${morph.width}px`;
+      root.getBoundingClientRect();
+      root.style.width = `${target}px`;
+    }
+    const timer = window.setTimeout(() => setMorph(null), settleMs(morph.to, root));
+    return () => window.clearTimeout(timer);
+  }, [morph]);
+  React5.useLayoutEffect(() => {
+    if (morph || !rootRef.current) return;
+    rootRef.current.style.width = "";
+    restWidth.current = rootRef.current.getBoundingClientRect().width;
+  });
+  if (!morph) {
+    return /* @__PURE__ */ jsx4("span", { ref: rootRef, className: cx(MorphText_default.root, className), children: text });
+  }
+  return /* @__PURE__ */ jsxs2("span", { ref: rootRef, className: cx(MorphText_default.root, MorphText_default.morphing, className), children: [
+    /* @__PURE__ */ jsx4("span", { ref: sizerRef, className: MorphText_default.sizer, "aria-hidden": "true", children: morph.to }),
+    /* @__PURE__ */ jsx4("span", { className: MorphText_default.layer, "aria-hidden": "true", children: letters(morph.from, "out") }, `out-${morph.id}`),
+    /* @__PURE__ */ jsx4("span", { className: MorphText_default.layer, "aria-hidden": "true", children: letters(morph.to, "in") }, `in-${morph.id}`),
+    /* @__PURE__ */ jsx4(VisuallyHidden, { children: morph.to })
+  ] });
+}
+
 // src/internal/slot.tsx
+import * as React7 from "react";
+
+// src/hooks/useMergedRefs.ts
 import * as React6 from "react";
-import { Fragment, jsx as jsx6 } from "react/jsx-runtime";
+
+// src/internal/mergeRefs.ts
+function mergeRefs(...refs) {
+  return (value) => {
+    for (const ref of refs) {
+      if (ref == null) continue;
+      if (typeof ref === "function") {
+        ref(value);
+      } else {
+        ref.current = value;
+      }
+    }
+  };
+}
+
+// src/hooks/useMergedRefs.ts
+function useMergedRefs(...refs) {
+  return React6.useMemo(() => mergeRefs(...refs), refs);
+}
+
+// src/internal/slot.tsx
+import { Fragment, jsx as jsx5 } from "react/jsx-runtime";
 var isPrevented = (event) => typeof event === "object" && event !== null && event.defaultPrevented === true;
 function mergeProps(slotProps, childProps) {
   const merged = { ...slotProps };
@@ -500,26 +350,82 @@ function blockDisabledClick(event) {
   event.stopPropagation();
 }
 function Slot({ children, ref, ...slotProps }) {
-  const child = React6.isValidElement(children) ? children : null;
+  const child = React7.isValidElement(children) ? children : null;
   const childRef = child?.props.ref ?? void 0;
   const composedRef = useMergedRefs(ref, childRef);
-  if (!child) return /* @__PURE__ */ jsx6(Fragment, { children });
+  if (!child) return /* @__PURE__ */ jsx5(Fragment, { children });
   const merged = mergeProps(slotProps, child.props);
   const disabled = slotProps["aria-disabled"] === true || slotProps["aria-disabled"] === "true";
   if (disabled) merged.onClickCapture = blockDisabledClick;
-  return React6.cloneElement(child, { ...merged, ref: composedRef });
+  return React7.cloneElement(child, { ...merged, ref: composedRef });
 }
 Slot.displayName = "Slot";
 
+// src/internal/touchTarget.module.css
+var touchTarget_default = {
+  target: "touchTarget_target",
+  targetBlock: "touchTarget_targetBlock"
+};
+
+// src/internal/touchTarget.ts
+var touchTargetClass = touchTarget_default.target;
+var touchTargetBlockClass = touchTarget_default.targetBlock;
+
 // src/components/button/Button.module.css
 var Button_default = {
   root: "Button_root",
   icon: "Button_icon",
-  spinner: "Button_spinner"
+  spinner: "Button_spinner",
+  fillTrack: "Button_fillTrack",
+  fill: "Button_fill"
 };
 
 // src/components/button/Button.tsx
-import { jsx as jsx7, jsxs as jsxs2 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
+var BUTTON_LABELS = { holdHint: "\u0423\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0439\u0442\u0435, \u0447\u0442\u043E\u0431\u044B \u043F\u043E\u0434\u0442\u0432\u0435\u0440\u0434\u0438\u0442\u044C" };
+var HOLD_MS = 1200;
+function useHoldToConfirm(enabled, onConfirm) {
+  const [phase, setPhase] = React8.useState("idle");
+  const timer = React8.useRef(void 0);
+  const confirm = React8.useRef(onConfirm);
+  confirm.current = onConfirm;
+  React8.useEffect(() => () => window.clearTimeout(timer.current), []);
+  const start = () => {
+    if (!enabled || phase === "holding" || phase === "done") return;
+    setPhase("holding");
+    timer.current = window.setTimeout(() => {
+      setPhase("done");
+      confirm.current?.();
+    }, HOLD_MS);
+  };
+  const stop = () => {
+    window.clearTimeout(timer.current);
+    setPhase(
+      (current) => current === "holding" ? "cancel" : current === "done" ? "idle" : current
+    );
+  };
+  return { phase, start, stop };
+}
+function morphLabels(children) {
+  const out = [];
+  let run = null;
+  const flush = () => {
+    if (run !== null && run !== "") {
+      out.push(/* @__PURE__ */ jsx6(MorphText, { children: run }, `label-${out.length}`));
+    }
+    run = null;
+  };
+  for (const child of React8.Children.toArray(children)) {
+    if (typeof child === "string" || typeof child === "number") {
+      run = (run ?? "") + String(child);
+    } else {
+      flush();
+      out.push(child);
+    }
+  }
+  flush();
+  return out;
+}
 function ButtonRoot({
   children,
   className,
@@ -529,6 +435,10 @@ function ButtonRoot({
   fullWidth,
   type = "button",
   loading = false,
+  progress,
+  holdToConfirm = false,
+  onConfirm,
+  labels,
   disabled,
   asChild = false,
   onClick: onClick2,
@@ -538,6 +448,11 @@ function ButtonRoot({
   const size = useControlSize(sizeProp);
   const isDisabled = disabled || loading;
   const layout = iconLayout(children, ButtonIcon);
+  const hold = useHoldToConfirm(holdToConfirm && !isDisabled, onConfirm);
+  const hintId = React8.useId();
+  const inProgress = progress !== void 0;
+  const [fillUsed, setFillUsed] = React8.useState(false);
+  if ((inProgress || holdToConfirm) && !fillUsed) setFillUsed(true);
   const dataAttrs = toDataAttributes({
     variant,
     tone,
@@ -550,11 +465,13 @@ function ButtonRoot({
     "leading-icon": layout.leadingIcon || void 0,
     "trailing-icon": layout.trailingIcon || void 0,
     // Without a leading icon the spinner is centered over the hidden label: width stays put.
-    "loading-overlay": loading && !asChild && !layout.leadingIcon && !layout.iconOnly || void 0
+    "loading-overlay": loading && !asChild && !layout.leadingIcon && !layout.iconOnly || void 0,
+    progress: inProgress || void 0,
+    hold: holdToConfirm ? hold.phase : void 0
   });
-  const classes = cx(fieldTierClass, Button_default.root, className);
+  const classes = cx(fieldTierClass, touchTargetClass, Button_default.root, className);
   if (asChild) {
-    return /* @__PURE__ */ jsx7(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsx7(
+    return /* @__PURE__ */ jsx6(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsx6(
       Slot,
       {
         ...rest,
@@ -568,31 +485,427 @@ function ButtonRoot({
       }
     ) });
   }
-  return /* @__PURE__ */ jsx7(
+  const {
+    onPointerDown: onPointerDown2,
+    onPointerUp,
+    onPointerLeave,
+    onPointerCancel,
+    onKeyDown: onKeyDown2,
+    onKeyUp,
+    onBlur
+  } = rest;
+  const holdHandlers = holdToConfirm ? {
+    onPointerDown: (event) => {
+      onPointerDown2?.(event);
+      if (event.button === 0) hold.start();
+    },
+    onPointerUp: (event) => {
+      onPointerUp?.(event);
+      hold.stop();
+    },
+    onPointerLeave: (event) => {
+      onPointerLeave?.(event);
+      hold.stop();
+    },
+    onPointerCancel: (event) => {
+      onPointerCancel?.(event);
+      hold.stop();
+    },
+    onKeyDown: (event) => {
+      onKeyDown2?.(event);
+      if ((event.key === " " || event.key === "Enter") && !event.repeat) {
+        event.preventDefault();
+        hold.start();
+      }
+    },
+    onKeyUp: (event) => {
+      onKeyUp?.(event);
+      if (event.key === " " || event.key === "Enter") hold.stop();
+    },
+    onBlur: (event) => {
+      onBlur?.(event);
+      hold.stop();
+    },
+    onContextMenu: (event) => {
+      rest.onContextMenu?.(event);
+      if (hold.phase === "holding" || hold.phase === "done") event.preventDefault();
+    }
+  } : null;
+  const describedBy = holdToConfirm ? cx(rest["aria-describedby"], hintId) || void 0 : rest["aria-describedby"];
+  const button = /* @__PURE__ */ jsxs3(
     "button",
     {
       ...rest,
+      ...holdHandlers,
       ref,
       type,
       className: classes,
       disabled: isDisabled,
-      "aria-busy": loading || void 0,
+      "aria-busy": loading || inProgress || void 0,
+      "aria-describedby": describedBy,
       onClick: onClick2,
+      style: inProgress || holdToConfirm ? {
+        ...rest.style,
+        "--btn-progress": inProgress ? Math.min(1, Math.max(0, progress)) : void 0,
+        "--btn-hold-duration": holdToConfirm ? `${HOLD_MS}ms` : void 0
+      } : rest.style,
       ...dataAttrs,
-      children: /* @__PURE__ */ jsxs2(ControlSizeProvider, { value: size, children: [
-        loading ? /* @__PURE__ */ jsx7(Spinner, { className: Button_default.spinner, "aria-hidden": "true" }) : null,
-        children
-      ] })
+      children: [
+        fillUsed ? /* @__PURE__ */ jsx6("span", { className: Button_default.fillTrack, "aria-hidden": "true", children: /* @__PURE__ */ jsx6("span", { className: Button_default.fill }) }) : null,
+        /* @__PURE__ */ jsxs3(ControlSizeProvider, { value: size, children: [
+          loading ? /* @__PURE__ */ jsx6(Spinner, { className: Button_default.spinner, "aria-hidden": "true" }) : null,
+          morphLabels(children)
+        ] })
+      ]
     }
   );
+  if (!holdToConfirm) return button;
+  return /* @__PURE__ */ jsxs3(Fragment2, { children: [
+    button,
+    /* @__PURE__ */ jsx6(VisuallyHidden, { id: hintId, children: { ...BUTTON_LABELS, ...labels }.holdHint })
+  ] });
 }
 ButtonRoot.displayName = "Button.Root";
 function ButtonIcon({ children, className, ...rest }) {
-  return /* @__PURE__ */ jsx7("span", { className: cx(Button_default.icon, className), "aria-hidden": "true", ...rest, children });
+  return /* @__PURE__ */ jsx6("span", { className: cx(Button_default.icon, className), "aria-hidden": "true", ...rest, children });
 }
 ButtonIcon.displayName = "Button.Icon";
 var Button = { Root: ButtonRoot, Icon: ButtonIcon };
 
+// src/components/divider/Divider.module.css
+var Divider_default = {
+  root: "Divider_root",
+  content: "Divider_content"
+};
+
+// src/components/divider/Divider.tsx
+import { jsx as jsx7 } from "react/jsx-runtime";
+function Divider({
+  orientation = "horizontal",
+  align = "center",
+  size = "m",
+  children,
+  className,
+  role = "separator",
+  ...rest
+}) {
+  return /* @__PURE__ */ jsx7(
+    "div",
+    {
+      ...rest,
+      className: cx(Divider_default.root, className),
+      role,
+      ...orientation === "vertical" ? { "aria-orientation": "vertical" } : {},
+      ...toDataAttributes({ orientation, align, size }),
+      children: children != null ? /* @__PURE__ */ jsx7(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsx7("span", { className: Divider_default.content, children }) }) : null
+    }
+  );
+}
+
+// src/icons/Icon.module.css
+var Icon_default = {
+  root: "Icon_root"
+};
+
+// src/icons/registry.ts
+import {
+  Activity,
+  AlertTriangle,
+  ArrowDown,
+  ArrowUp,
+  ArrowUpDown,
+  Bell,
+  Bold,
+  BookOpen,
+  Calendar,
+  ChartColumn,
+  Check,
+  CheckCircle2,
+  ChevronDown,
+  ChevronLeft,
+  ChevronRight,
+  ChevronsLeft,
+  ChevronsUpDown,
+  ChevronUp,
+  Circle,
+  CloudOff,
+  CloudUpload,
+  Code2,
+  Copy,
+  Download,
+  ExternalLink,
+  Eye,
+  EyeOff,
+  FileText,
+  GripVertical,
+  HardDrive,
+  House,
+  Image,
+  Inbox,
+  Info,
+  Italic,
+  KeyRound,
+  LayoutDashboard,
+  LayoutGrid,
+  Link2,
+  List,
+  ListFilter,
+  ListTodo,
+  Lock,
+  LogIn,
+  LogOut,
+  Mail,
+  MailCheck,
+  Menu,
+  MessageSquare,
+  Minus,
+  Monitor,
+  Moon,
+  MoreHorizontal,
+  Package,
+  PanelLeftClose,
+  PanelLeftOpen,
+  Pipette,
+  Plus,
+  Receipt,
+  RefreshCw,
+  Rocket,
+  Search,
+  Send,
+  Settings,
+  ShoppingCart,
+  Smartphone,
+  Sun,
+  Tablet,
+  Trash2,
+  Truck,
+  Underline,
+  UserRound,
+  Users,
+  Wallet,
+  X,
+  XCircle
+} from "lucide-react";
+var iconRegistry = {
+  "nav.chevronDown": ChevronDown,
+  "nav.chevronLeft": ChevronLeft,
+  "nav.chevronRight": ChevronRight,
+  "nav.chevronUp": ChevronUp,
+  "nav.chevronsLeft": ChevronsLeft,
+  "nav.chevronsUpDown": ChevronsUpDown,
+  "nav.dashboard": LayoutDashboard,
+  "nav.home": House,
+  "nav.itemDot": Circle,
+  "nav.layoutGrid": LayoutGrid,
+  "nav.menu": Menu,
+  "nav.sidebarCollapse": PanelLeftClose,
+  "nav.sidebarExpand": PanelLeftOpen,
+  "action.add": Plus,
+  "action.check": Check,
+  "action.close": X,
+  "action.copy": Copy,
+  "action.delete": Trash2,
+  "action.download": Download,
+  "action.drag": GripVertical,
+  "action.externalLink": ExternalLink,
+  "action.eyedropper": Pipette,
+  "action.filter": ListFilter,
+  "action.login": LogIn,
+  "action.logout": LogOut,
+  "action.more": MoreHorizontal,
+  "action.refresh": RefreshCw,
+  "action.remove": Minus,
+  "action.search": Search,
+  "action.send": Send,
+  "action.settings": Settings,
+  "action.upload": CloudUpload,
+  "field.calendar": Calendar,
+  "field.email": Mail,
+  "field.password.show": Eye,
+  "field.password.hide": EyeOff,
+  "format.bold": Bold,
+  "format.italic": Italic,
+  "format.link": Link2,
+  "format.list": List,
+  "format.underline": Underline,
+  "object.activity": Activity,
+  "object.bell": Bell,
+  "object.book": BookOpen,
+  "object.cart": ShoppingCart,
+  "object.chart": ChartColumn,
+  "object.document": FileText,
+  "object.image": Image,
+  "object.inbox": Inbox,
+  "object.key": KeyRound,
+  "object.message": MessageSquare,
+  "object.package": Package,
+  "object.receipt": Receipt,
+  "object.rocket": Rocket,
+  "object.storage": HardDrive,
+  "object.tasks": ListTodo,
+  "object.truck": Truck,
+  "object.user": UserRound,
+  "object.users": Users,
+  "object.wallet": Wallet,
+  "sort.ascending": ArrowUp,
+  "sort.descending": ArrowDown,
+  "sort.none": ArrowUpDown,
+  "status.danger": XCircle,
+  "status.emailSent": MailCheck,
+  "status.info": Info,
+  "status.locked": Lock,
+  "status.offline": CloudOff,
+  "status.success": CheckCircle2,
+  /** A rising trend; a falling one is the same arrow turned half a turn (it rotates between them). */
+  "status.trendUp": ArrowUp,
+  "status.warning": AlertTriangle,
+  "theme.dark": Moon,
+  "theme.light": Sun,
+  "view.code": Code2,
+  "view.preview": Eye,
+  "viewport.desktop": Monitor,
+  "viewport.mobile": Smartphone,
+  "viewport.tablet": Tablet
+};
+
+// src/icons/Icon.tsx
+import { jsx as jsx8 } from "react/jsx-runtime";
+function IconSvg({
+  glyph: GlyphSvg,
+  className,
+  size,
+  tone = "default",
+  strokeWidth = 1.75,
+  ...rest
+}) {
+  const tier = useOptionalControlSize();
+  return /* @__PURE__ */ jsx8(
+    GlyphSvg,
+    {
+      className: cx(Icon_default.root, iconBoxClass(size, tier), textTone_default.tone, className),
+      "data-tone": tone === "default" ? void 0 : tone,
+      strokeWidth,
+      "aria-hidden": "true",
+      ...rest
+    }
+  );
+}
+function Icon({ name, ...rest }) {
+  return /* @__PURE__ */ jsx8(IconSvg, { glyph: iconRegistry[name], ...rest });
+}
+function createIcon(glyph) {
+  function DomainIcon(props) {
+    return /* @__PURE__ */ jsx8(IconSvg, { glyph, ...props });
+  }
+  DomainIcon.displayName = `Icon(${glyph.displayName ?? "Glyph"})`;
+  return DomainIcon;
+}
+
+// src/components/scroll-container/ScrollContainer.tsx
+import * as React10 from "react";
+
+// src/hooks/useEdgeOverflow.ts
+import * as React9 from "react";
+var NONE = { start: false, end: false };
+function useEdgeOverflow(ref, enabled, horizontal) {
+  const [overflow, setOverflow] = React9.useState(NONE);
+  React9.useLayoutEffect(() => {
+    const node = ref.current;
+    if (!enabled || !node) return;
+    const update = () => {
+      const position = horizontal ? Math.abs(node.scrollLeft) : node.scrollTop;
+      const max = horizontal ? node.scrollWidth - node.clientWidth : node.scrollHeight - node.clientHeight;
+      const start = position > 1;
+      const end = max - position > 1;
+      node.style.setProperty("--edge-start", `${Math.max(0, position)}px`);
+      node.style.setProperty("--edge-end", `${Math.max(0, max - position)}px`);
+      setOverflow((prev) => prev.start === start && prev.end === end ? prev : { start, end });
+    };
+    let frame = 0;
+    const schedule = () => {
+      if (frame) return;
+      frame = requestAnimationFrame(() => {
+        frame = 0;
+        update();
+      });
+    };
+    update();
+    node.addEventListener("scroll", schedule, { passive: true });
+    const resize = typeof ResizeObserver === "undefined" ? null : new ResizeObserver(schedule);
+    const observeChildren = () => {
+      for (const child of Array.from(node.children)) resize?.observe(child);
+    };
+    resize?.observe(node);
+    observeChildren();
+    const mutation = new MutationObserver(() => {
+      observeChildren();
+      schedule();
+    });
+    mutation.observe(node, { childList: true });
+    return () => {
+      cancelAnimationFrame(frame);
+      node.removeEventListener("scroll", schedule);
+      resize?.disconnect();
+      mutation.disconnect();
+    };
+  }, [ref, enabled, horizontal]);
+  return enabled ? overflow : NONE;
+}
+
+// src/components/scroll-container/ScrollContainer.module.css
+var ScrollContainer_default = {
+  root: "ScrollContainer_root",
+  vertical: "ScrollContainer_vertical",
+  horizontal: "ScrollContainer_horizontal",
+  both: "ScrollContainer_both",
+  overscrollContain: "ScrollContainer_overscrollContain",
+  overscrollNone: "ScrollContainer_overscrollNone",
+  scrollbarHidden: "ScrollContainer_scrollbarHidden"
+};
+
+// src/components/scroll-container/ScrollContainer.tsx
+import { jsx as jsx9 } from "react/jsx-runtime";
+var axisClass = {
+  vertical: ScrollContainer_default.vertical,
+  horizontal: ScrollContainer_default.horizontal,
+  both: ScrollContainer_default.both
+};
+function ScrollContainer({
+  as: Component = "div",
+  axis = "vertical",
+  overscrollBehavior = "contain",
+  fade = false,
+  scrollbar = "thin",
+  className,
+  ref,
+  ...rest
+}) {
+  const innerRef = React10.useRef(null);
+  const mergedRef = useMergedRefs(innerRef, ref);
+  const horizontal = axis === "horizontal";
+  const overflow = useEdgeOverflow(innerRef, fade, horizontal);
+  return /* @__PURE__ */ jsx9(
+    Component,
+    {
+      ref: mergedRef,
+      className: cx(
+        ScrollContainer_default.root,
+        axisClass[axis],
+        overscrollBehavior === "contain" && ScrollContainer_default.overscrollContain,
+        overscrollBehavior === "none" && ScrollContainer_default.overscrollNone,
+        scrollbar === "hidden" && ScrollContainer_default.scrollbarHidden,
+        className
+      ),
+      ...toDataAttributes({
+        fade: fade ? horizontal ? "horizontal" : "vertical" : void 0,
+        "overflow-start": overflow.start || void 0,
+        "overflow-end": overflow.end || void 0
+      }),
+      ...rest
+    }
+  );
+}
+
 // src/internal/states.ts
 var controlSizes = ["xs", "s", "m", "l", "xl"];
 function stepDown(size, n = 1) {
@@ -646,9 +959,9 @@ var Hint_default = {
 };
 
 // src/components/hint/Hint.tsx
-import { jsx as jsx8 } from "react/jsx-runtime";
+import { jsx as jsx10 } from "react/jsx-runtime";
 function HintRoot({ className, size = "m", invalid, disabled, children, ...rest }) {
-  return /* @__PURE__ */ jsx8(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx10(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsx10(
     "p",
     {
       ...rest,
@@ -664,7 +977,7 @@ function HintRoot({ className, size = "m", invalid, disabled, children, ...rest
 }
 HintRoot.displayName = "Hint.Root";
 function HintIcon({ className, ...rest }) {
-  return /* @__PURE__ */ jsx8("span", { "aria-hidden": "true", className: cx(Hint_default.icon, className), ...rest });
+  return /* @__PURE__ */ jsx10("span", { "aria-hidden": "true", className: cx(Hint_default.icon, className), ...rest });
 }
 HintIcon.displayName = "Hint.Icon";
 var Hint = { Root: HintRoot, Icon: HintIcon };
@@ -679,7 +992,7 @@ var Label_default = {
 };
 
 // src/components/label/Label.tsx
-import { jsx as jsx9, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx11, jsxs as jsxs4 } from "react/jsx-runtime";
 var LABEL_LABELS = { optional: "\u043D\u0435\u043E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u043E" };
 function LabelRoot({
   className,
@@ -695,7 +1008,7 @@ function LabelRoot({
   const size = useControlSize(sizeProp);
   return (
     // biome-ignore lint/a11y/noLabelWithoutControl: field label primitive; association via htmlFor or wrapping control is caller responsibility
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx11(
       "label",
       {
         ref,
@@ -703,10 +1016,10 @@ function LabelRoot({
         "aria-disabled": disabled || void 0,
         ...rest,
         ...toDataAttributes({ disabled: disabled || void 0, size }),
-        children: /* @__PURE__ */ jsxs3(ControlSizeProvider, { value: size, children: [
+        children: /* @__PURE__ */ jsxs4(ControlSizeProvider, { value: size, children: [
           children,
-          required ? /* @__PURE__ */ jsx9("span", { className: Label_default.asterisk, "aria-hidden": "true", children: "*" }) : null,
-          optional ? /* @__PURE__ */ jsx9("span", { className: Label_default.optional, children: labels?.optional ?? LABEL_LABELS.optional }) : null
+          required ? /* @__PURE__ */ jsx11("span", { className: Label_default.asterisk, "aria-hidden": "true", children: "*" }) : null,
+          optional ? /* @__PURE__ */ jsx11("span", { className: Label_default.optional, children: labels?.optional ?? LABEL_LABELS.optional }) : null
         ] })
       }
     )
@@ -714,11 +1027,11 @@ function LabelRoot({
 }
 LabelRoot.displayName = "Label.Root";
 function LabelIcon({ className, ...rest }) {
-  return /* @__PURE__ */ jsx9("span", { className: cx(Label_default.icon, className), "aria-hidden": "true", ...rest });
+  return /* @__PURE__ */ jsx11("span", { className: cx(Label_default.icon, className), "aria-hidden": "true", ...rest });
 }
 LabelIcon.displayName = "Label.Icon";
 function LabelDescription({ className, ...rest }) {
-  return /* @__PURE__ */ jsx9("span", { className: cx(Label_default.description, className), ...rest });
+  return /* @__PURE__ */ jsx11("span", { className: cx(Label_default.description, className), ...rest });
 }
 LabelDescription.displayName = "Label.Description";
 var Label = {
@@ -728,21 +1041,21 @@ var Label = {
 };
 
 // src/components/checkbox/Checkbox.tsx
-import * as React9 from "react";
+import * as React13 from "react";
 
 // src/hooks/useControllableState.ts
-import * as React7 from "react";
+import * as React11 from "react";
 function useControllableState({
   value,
   defaultValue,
   onChange
 }) {
-  const [internalValue, setInternalValue] = React7.useState(defaultValue);
+  const [internalValue, setInternalValue] = React11.useState(defaultValue);
   const isControlled = value !== void 0;
   const currentValue = isControlled ? value : internalValue;
-  const currentValueRef = React7.useRef(currentValue);
+  const currentValueRef = React11.useRef(currentValue);
   currentValueRef.current = currentValue;
-  const setValue = React7.useCallback(
+  const setValue = React11.useCallback(
     (nextValue) => {
       const previousValue = currentValueRef.current;
       const computedValue = typeof nextValue === "function" ? nextValue(previousValue) : nextValue;
@@ -760,6 +1073,32 @@ function useControllableState({
   return [currentValue, setValue];
 }
 
+// src/internal/CheckMark.module.css
+var CheckMark_default = {
+  svg: "CheckMark_svg",
+  check: "CheckMark_check",
+  bar: "CheckMark_bar"
+};
+
+// src/internal/CheckMark.tsx
+import { jsx as jsx12, jsxs as jsxs5 } from "react/jsx-runtime";
+function CheckMark({ state, className }) {
+  return /* @__PURE__ */ jsxs5(
+    "svg",
+    {
+      viewBox: "0 0 24 24",
+      className: cx(CheckMark_default.svg, className),
+      "data-state": state,
+      "aria-hidden": "true",
+      focusable: "false",
+      children: [
+        /* @__PURE__ */ jsx12("path", { d: "M5.5 12.5l4.25 4.25L18.5 8", pathLength: 1, className: CheckMark_default.check }),
+        /* @__PURE__ */ jsx12("path", { d: "M7 12h10", pathLength: 1, className: CheckMark_default.bar })
+      ]
+    }
+  );
+}
+
 // src/internal/ChoiceField.module.css
 var ChoiceField_default = {
   tier: "ChoiceField_tier",
@@ -773,7 +1112,7 @@ var ChoiceField_default = {
 };
 
 // src/internal/ChoiceField.tsx
-import { jsx as jsx10, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx13, jsxs as jsxs6 } from "react/jsx-runtime";
 var choiceInputClass = ChoiceField_default.input;
 var choiceVisualClass = ChoiceField_default.visual;
 var choiceTierClass = ChoiceField_default.tier;
@@ -789,7 +1128,7 @@ function ChoiceField({
   className,
   children
 }) {
-  return /* @__PURE__ */ jsx10(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsxs4(
+  return /* @__PURE__ */ jsx13(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsxs6(
     "div",
     {
       className: cx(ChoiceField_default.tier, ChoiceField_default.field, className),
@@ -801,21 +1140,21 @@ function ChoiceField({
         readonly: readOnly || void 0
       }),
       children: [
-        /* @__PURE__ */ jsxs4("label", { htmlFor: ids.controlId, className: ChoiceField_default.row, children: [
-          /* @__PURE__ */ jsx10("span", { className: ChoiceField_default.controlCell, children: control }),
+        /* @__PURE__ */ jsxs6("label", { htmlFor: ids.controlId, className: ChoiceField_default.row, children: [
+          /* @__PURE__ */ jsx13("span", { className: cx(ChoiceField_default.controlCell, touchTargetClass), children: control }),
           children
         ] }),
-        ids.showError ? /* @__PURE__ */ jsx10(Hint.Root, { id: ids.errorId, size, invalid: true, className: ChoiceField_default.support, children: error }) : ids.showHint ? /* @__PURE__ */ jsx10(Hint.Root, { id: ids.hintId, size, disabled, className: ChoiceField_default.support, children: hint }) : null
+        ids.showError ? /* @__PURE__ */ jsx13(Hint.Root, { id: ids.errorId, size, invalid: true, className: ChoiceField_default.support, children: error }) : ids.showHint ? /* @__PURE__ */ jsx13(Hint.Root, { id: ids.hintId, size, disabled, className: ChoiceField_default.support, children: hint }) : null
       ]
     }
   ) });
 }
 function ChoiceLabel({ className, ...rest }) {
-  return /* @__PURE__ */ jsx10("span", { className: cx(ChoiceField_default.text, className), ...rest });
+  return /* @__PURE__ */ jsx13("span", { className: cx(ChoiceField_default.text, className), ...rest });
 }
 
 // src/internal/FieldFrame.tsx
-import * as React8 from "react";
+import * as React12 from "react";
 
 // src/internal/formatLabel.ts
 function formatLabel(template, values) {
@@ -825,6 +1164,31 @@ function formatLabel(template, values) {
   ).trim();
 }
 
+// src/internal/RollingNumber.module.css
+var RollingNumber_default = {
+  root: "RollingNumber_root",
+  digit: "RollingNumber_digit",
+  char: "RollingNumber_char"
+};
+
+// src/internal/RollingNumber.tsx
+import { jsx as jsx14 } from "react/jsx-runtime";
+function RollingNumber({ children, className }) {
+  const chars = [...String(children)];
+  return /* @__PURE__ */ jsx14("span", { className: cx(RollingNumber_default.root, className), children: chars.map((char, i) => {
+    const key = chars.length - i;
+    return /\d/.test(char) ? /* @__PURE__ */ jsx14(
+      "span",
+      {
+        className: RollingNumber_default.digit,
+        style: { "--rolling-n": char },
+        children: char
+      },
+      `d${key}`
+    ) : /* @__PURE__ */ jsx14("span", { className: RollingNumber_default.char, children: char }, `c${key}`);
+  }) });
+}
+
 // src/internal/FieldFrame.module.css
 var FieldFrame_default = {
   root: "FieldFrame_root",
@@ -838,7 +1202,7 @@ var FieldFrame_default = {
 };
 
 // src/internal/FieldFrame.tsx
-import { jsx as jsx11, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx15, jsxs as jsxs7 } from "react/jsx-runtime";
 function hasContent(node) {
   return node != null && node !== false && node !== "";
 }
@@ -848,7 +1212,7 @@ function useFieldFrame(explicitId, {
   error,
   invalid
 }, ariaDescribedBy) {
-  const generated = React8.useId();
+  const generated = React12.useId();
   const controlId = explicitId ?? generated;
   const labelId = `${controlId}-label`;
   const hintId = `${controlId}-hint`;
@@ -888,7 +1252,7 @@ function FieldFrame({
 }) {
   const { showError, showHint } = ids;
   const showSupport = showError || showHint || counter != null || reserveSupportRow;
-  const labelNode = hasContent(label) ? /* @__PURE__ */ jsx11(
+  const labelNode = hasContent(label) ? /* @__PURE__ */ jsx15(
     Label.Root,
     {
       id: ids.labelId,
@@ -902,7 +1266,7 @@ function FieldFrame({
       children: label
     }
   ) : null;
-  return /* @__PURE__ */ jsxs5(
+  return /* @__PURE__ */ jsxs7(
     "div",
     {
       ...rest,
@@ -913,19 +1277,19 @@ function FieldFrame({
         disabled: disabled || void 0
       }),
       children: [
-        labelEnd != null ? /* @__PURE__ */ jsxs5("div", { className: FieldFrame_default.labelRow, children: [
+        labelEnd != null ? /* @__PURE__ */ jsxs7("div", { className: FieldFrame_default.labelRow, children: [
           labelNode,
-          /* @__PURE__ */ jsx11("span", { className: FieldFrame_default.labelEnd, children: labelEnd })
+          /* @__PURE__ */ jsx15("span", { className: FieldFrame_default.labelEnd, children: labelEnd })
         ] }) : labelNode,
-        /* @__PURE__ */ jsxs5("div", { className: FieldFrame_default.body, children: [
+        /* @__PURE__ */ jsxs7("div", { className: FieldFrame_default.body, children: [
           children,
-          showSupport ? /* @__PURE__ */ jsxs5(
+          showSupport ? /* @__PURE__ */ jsxs7(
             "div",
             {
               className: FieldFrame_default.support,
               ...toDataAttributes({ size, reserve: reserveSupportRow || void 0 }),
               children: [
-                showError ? /* @__PURE__ */ jsx11(Hint.Root, { id: ids.errorId, size, invalid: true, className: FieldFrame_default.supportText, children: error }) : showHint ? /* @__PURE__ */ jsx11(
+                showError ? /* @__PURE__ */ jsx15(Hint.Root, { id: ids.errorId, size, invalid: true, className: FieldFrame_default.supportText, children: error }) : showHint ? /* @__PURE__ */ jsx15(
                   Hint.Root,
                   {
                     id: ids.hintId,
@@ -934,7 +1298,7 @@ function FieldFrame({
                     className: FieldFrame_default.supportText,
                     children: hint
                   }
-                ) : /* @__PURE__ */ jsx11("span", { className: FieldFrame_default.supportText }),
+                ) : /* @__PURE__ */ jsx15("span", { className: FieldFrame_default.supportText }),
                 counter
               ]
             }
@@ -945,7 +1309,7 @@ function FieldFrame({
   );
 }
 function FieldCounter({ current, max, size, label, className, ...rest }) {
-  return /* @__PURE__ */ jsxs5(
+  return /* @__PURE__ */ jsxs7(
     "span",
     {
       ...rest,
@@ -954,12 +1318,12 @@ function FieldCounter({ current, max, size, label, className, ...rest }) {
       "data-invalid": current > max || void 0,
       "aria-live": "polite",
       children: [
-        /* @__PURE__ */ jsxs5("span", { "aria-hidden": "true", children: [
-          current,
+        /* @__PURE__ */ jsxs7("span", { "aria-hidden": "true", children: [
+          /* @__PURE__ */ jsx15(RollingNumber, { children: current }),
           "/",
           max
         ] }),
-        /* @__PURE__ */ jsx11(VisuallyHidden, { children: formatLabel(label, { current, max }) })
+        /* @__PURE__ */ jsx15(VisuallyHidden, { children: formatLabel(label, { current, max }) })
       ]
     }
   );
@@ -969,20 +1333,11 @@ function FieldCounter({ current, max, size, label, className, ...rest }) {
 var Checkbox_default = {
   root: "Checkbox_root",
   indicator: "Checkbox_indicator",
-  control: "Checkbox_control",
-  svg: "Checkbox_svg",
-  checkPath: "Checkbox_checkPath",
-  indeterminateLine: "Checkbox_indeterminateLine"
+  control: "Checkbox_control"
 };
 
 // src/components/checkbox/Checkbox.tsx
-import { Fragment as Fragment2, jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
-function CheckboxMark() {
-  return /* @__PURE__ */ jsxs6("svg", { viewBox: "0 0 24 24", className: Checkbox_default.svg, "aria-hidden": "true", focusable: "false", children: [
-    /* @__PURE__ */ jsx12("path", { d: "M5.5 12.5l4.25 4.25L18.5 8", pathLength: 1, className: Checkbox_default.checkPath }),
-    /* @__PURE__ */ jsx12("path", { d: "M7 12h10", pathLength: 1, className: Checkbox_default.indeterminateLine })
-  ] });
-}
+import { Fragment as Fragment3, jsx as jsx16, jsxs as jsxs8 } from "react/jsx-runtime";
 function CheckboxRoot({
   id,
   checked: checkedProp,
@@ -1008,12 +1363,12 @@ function CheckboxRoot({
     defaultValue: defaultChecked,
     onChange: onCheckedChange
   });
-  const internalRef = React9.useRef(null);
+  const internalRef = React13.useRef(null);
   const mergedRef = useMergedRefs(internalRef, ref);
-  React9.useEffect(() => {
+  React13.useEffect(() => {
     if (internalRef.current) internalRef.current.indeterminate = indeterminate;
   }, [indeterminate]);
-  return /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsx16(
     ChoiceField,
     {
       ids,
@@ -1024,8 +1379,8 @@ function CheckboxRoot({
       hint,
       error,
       className: cx(Checkbox_default.root, className),
-      control: /* @__PURE__ */ jsxs6(Fragment2, { children: [
-        /* @__PURE__ */ jsx12(
+      control: /* @__PURE__ */ jsxs8(Fragment3, { children: [
+        /* @__PURE__ */ jsx16(
           "input",
           {
             ...inputRest,
@@ -1043,7 +1398,12 @@ function CheckboxRoot({
             "aria-describedby": ids.describedBy
           }
         ),
-        /* @__PURE__ */ jsx12("span", { className: cx(choiceVisualClass, Checkbox_default.control), "aria-hidden": "true", children: /* @__PURE__ */ jsx12(CheckboxMark, {}) })
+        /* @__PURE__ */ jsx16("span", { className: cx(choiceVisualClass, Checkbox_default.control), "aria-hidden": "true", children: /* @__PURE__ */ jsx16(
+          CheckMark,
+          {
+            state: indeterminate ? "indeterminate" : checked ? "checked" : "unchecked"
+          }
+        ) })
       ] }),
       children
     }
@@ -1051,7 +1411,7 @@ function CheckboxRoot({
 }
 CheckboxRoot.displayName = "Checkbox.Root";
 function CheckboxLabel(props) {
-  return /* @__PURE__ */ jsx12(ChoiceLabel, { ...props });
+  return /* @__PURE__ */ jsx16(ChoiceLabel, { ...props });
 }
 CheckboxLabel.displayName = "Checkbox.Label";
 function CheckboxIndicator({
@@ -1063,7 +1423,7 @@ function CheckboxIndicator({
   ...rest
 }) {
   const size = useControlSize(sizeProp);
-  return /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsx16(
     "span",
     {
       "aria-hidden": "true",
@@ -1080,7 +1440,7 @@ function CheckboxIndicator({
         disabled: disabled || void 0
       }),
       ...rest,
-      children: /* @__PURE__ */ jsx12(CheckboxMark, {})
+      children: /* @__PURE__ */ jsx16(CheckMark, { state: indeterminate ? "indeterminate" : checked ? "checked" : "unchecked" })
     }
   );
 }
@@ -1092,7 +1452,7 @@ var Checkbox = {
 };
 
 // src/internal/swatch.tsx
-import * as React10 from "react";
+import * as React14 from "react";
 
 // src/internal/swatch.module.css
 var swatch_default = {
@@ -1105,7 +1465,7 @@ var swatch_default = {
 };
 
 // src/internal/swatch.tsx
-import { Fragment as Fragment3, jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx17, jsxs as jsxs9 } from "react/jsx-runtime";
 var COLOR_PRESETS = [
   { value: "#ef4444", label: "\u041A\u0440\u0430\u0441\u043D\u044B\u0439" },
   { value: "#f97316", label: "\u041E\u0440\u0430\u043D\u0436\u0435\u0432\u044B\u0439" },
@@ -1125,7 +1485,7 @@ var COLOR_PRESETS = [
   { value: "#be185d", label: "\u0422\u0451\u043C\u043D\u043E-\u0440\u043E\u0437\u043E\u0432\u044B\u0439" }
 ];
 function useSwatchOptions(presets, allowEmpty, emptyLabel) {
-  return React10.useMemo(
+  return React14.useMemo(
     () => [
       ...presets.map((preset) => ({ ...preset, contrast: markContrast(preset.value) })),
       ...allowEmpty ? [{ value: null, label: emptyLabel, contrast: "dark" }] : []
@@ -1136,17 +1496,17 @@ function useSwatchOptions(presets, allowEmpty, emptyLabel) {
 var swatchClass = swatch_default.swatch;
 var swatchTierClass = swatch_default.tier;
 function SwatchFill({ value }) {
-  if (value == null) return /* @__PURE__ */ jsx13("span", { "aria-hidden": true, className: swatch_default.checker });
-  return /* @__PURE__ */ jsx13("svg", { className: swatch_default.fill, "aria-hidden": "true", viewBox: "0 0 1 1", preserveAspectRatio: "none", children: /* @__PURE__ */ jsx13("rect", { width: "1", height: "1", fill: value }) });
+  if (value == null) return /* @__PURE__ */ jsx17("span", { "aria-hidden": true, className: swatch_default.checker });
+  return /* @__PURE__ */ jsx17("svg", { className: swatch_default.fill, "aria-hidden": "true", viewBox: "0 0 1 1", preserveAspectRatio: "none", children: /* @__PURE__ */ jsx17("rect", { width: "1", height: "1", fill: value }) });
 }
 function SwatchContent({ value, selected }) {
-  return /* @__PURE__ */ jsxs7(Fragment3, { children: [
-    /* @__PURE__ */ jsx13(SwatchFill, { value }),
-    selected ? /* @__PURE__ */ jsx13(Icon, { name: "action.check", strokeWidth: 3, className: swatch_default.check }) : null
+  return /* @__PURE__ */ jsxs9(Fragment4, { children: [
+    /* @__PURE__ */ jsx17(SwatchFill, { value }),
+    /* @__PURE__ */ jsx17(CheckMark, { state: selected ? "checked" : "unchecked", className: swatch_default.check })
   ] });
 }
 function SwatchChip({ value, className, ...rest }) {
-  return /* @__PURE__ */ jsx13("span", { ...rest, "aria-hidden": true, className: cx(swatch_default.chip, className), children: /* @__PURE__ */ jsx13(SwatchFill, { value }) });
+  return /* @__PURE__ */ jsx17("span", { ...rest, "aria-hidden": true, className: cx(swatch_default.chip, className), children: /* @__PURE__ */ jsx17(SwatchFill, { value }) });
 }
 function sameColor(a, b) {
   return (a ?? "").trim().toLowerCase() === (b ?? "").trim().toLowerCase();
@@ -1190,7 +1550,7 @@ function markContrast(value) {
 }
 
 // src/components/color-swatches/ColorSwatches.tsx
-import * as React11 from "react";
+import * as React15 from "react";
 
 // src/internal/rovingFocus.ts
 var PREV = {
@@ -1239,7 +1599,7 @@ var ColorSwatches_default = {
 };
 
 // src/components/color-swatches/ColorSwatches.tsx
-import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx18, jsxs as jsxs10 } from "react/jsx-runtime";
 var COLOR_SWATCHES_LABELS = {
   group: "\u0426\u0432\u0435\u0442",
   empty: "\u0411\u0435\u0437 \u0446\u0432\u0435\u0442\u0430",
@@ -1284,7 +1644,7 @@ function ColorSwatches({
   const options = useSwatchOptions(presets, allowEmpty, labels.empty);
   const selectedIndex = options.findIndex((option) => sameColor(option.value, value));
   const focusIndex = Math.max(0, selectedIndex);
-  const itemRefs = React11.useRef([]);
+  const itemRefs = React15.useRef([]);
   const labelledBy = ariaLabelledBy ?? ids.labelledBy;
   const onKeyDown2 = (event) => {
     const current = itemRefs.current.indexOf(document.activeElement);
@@ -1299,7 +1659,7 @@ function ColorSwatches({
     setValue(options[next].value);
     itemRefs.current[next]?.focus();
   };
-  return /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsx18(
     FieldFrame,
     {
       ...rest,
@@ -1314,7 +1674,7 @@ function ColorSwatches({
       optionalLabel: labels.optional,
       group: true,
       className,
-      children: /* @__PURE__ */ jsxs8(
+      children: /* @__PURE__ */ jsxs10(
         "div",
         {
           id: ids.controlId,
@@ -1336,7 +1696,7 @@ function ColorSwatches({
               const selected = index === selectedIndex;
               return (
                 // biome-ignore lint/a11y/useSemanticElements: a swatch is a styled button in a roving radiogroup; a native radio cannot carry the color fill and check mark
-                /* @__PURE__ */ jsx14(
+                /* @__PURE__ */ jsx18(
                   "button",
                   {
                     ref: (el) => {
@@ -1355,13 +1715,13 @@ function ColorSwatches({
                       contrast: option.contrast
                     }),
                     onClick: () => setValue(option.value),
-                    children: /* @__PURE__ */ jsx14(SwatchContent, { value: option.value, selected })
+                    children: /* @__PURE__ */ jsx18(SwatchContent, { value: option.value, selected })
                   },
                   option.value ?? "empty"
                 )
               );
             }),
-            name ? /* @__PURE__ */ jsx14("input", { type: "hidden", name, value: value ?? "" }) : null
+            name ? /* @__PURE__ */ jsx18("input", { type: "hidden", name, value: value ?? "" }) : null
           ]
         }
       )
@@ -1379,7 +1739,7 @@ var EmptyPage_default = {
 };
 
 // src/components/empty-page/EmptyPage.tsx
-import { jsx as jsx15 } from "react/jsx-runtime";
+import { jsx as jsx19 } from "react/jsx-runtime";
 function EmptyPageRoot({
   size = "m",
   layout = "default",
@@ -1387,31 +1747,31 @@ function EmptyPageRoot({
   children,
   ...rest
 }) {
-  return /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsx19(
     "div",
     {
       className: cx(EmptyPage_default.root, layout !== "compact" && enterMotion_default.enterBaseChildren, className),
       ...rest,
       ...toDataAttributes({ size, layout: layout === "default" ? void 0 : layout }),
-      children: /* @__PURE__ */ jsx15(ControlSizeProvider, { value: size, children })
+      children: /* @__PURE__ */ jsx19(ControlSizeProvider, { value: size, children })
     }
   );
 }
 EmptyPageRoot.displayName = "EmptyPage.Root";
 function EmptyPageIcon({ tone = "neutral", className, ...rest }) {
-  return /* @__PURE__ */ jsx15("div", { className: cx(EmptyPage_default.iconWrap, className), "data-tone": tone, ...rest });
+  return /* @__PURE__ */ jsx19("div", { className: cx(EmptyPage_default.iconWrap, className), "data-tone": tone, ...rest });
 }
 EmptyPageIcon.displayName = "EmptyPage.Icon";
 function EmptyPageTitle({ as: Tag = "h2", className, ref, ...rest }) {
-  return /* @__PURE__ */ jsx15(Tag, { ref, className: cx(EmptyPage_default.title, className), ...rest });
+  return /* @__PURE__ */ jsx19(Tag, { ref, className: cx(EmptyPage_default.title, className), ...rest });
 }
 EmptyPageTitle.displayName = "EmptyPage.Title";
 function EmptyPageDescription({ className, ...rest }) {
-  return /* @__PURE__ */ jsx15("p", { className: cx(EmptyPage_default.description, className), ...rest });
+  return /* @__PURE__ */ jsx19("p", { className: cx(EmptyPage_default.description, className), ...rest });
 }
 EmptyPageDescription.displayName = "EmptyPage.Description";
 function EmptyPageActions({ className, ...rest }) {
-  return /* @__PURE__ */ jsx15("div", { className: cx(EmptyPage_default.actions, className), ...rest });
+  return /* @__PURE__ */ jsx19("div", { className: cx(EmptyPage_default.actions, className), ...rest });
 }
 EmptyPageActions.displayName = "EmptyPage.Actions";
 var EmptyPage = {
@@ -1422,46 +1782,208 @@ var EmptyPage = {
   Actions: EmptyPageActions
 };
 
-// src/components/divider/Divider.module.css
-var Divider_default = {
-  root: "Divider_root",
-  content: "Divider_content"
+// src/components/progress-bar/ProgressBar.tsx
+import * as React16 from "react";
+
+// src/internal/progressSegments.ts
+function resolveValue(value, max) {
+  const top = max !== void 0 && max > 0 ? max : 100;
+  const clamped = Math.min(top, Math.max(Number.isFinite(value) ? value : 0, 0));
+  return {
+    value: clamped,
+    max: top,
+    ratio: clamped / top,
+    percent: Math.round(clamped / top * 100)
+  };
+}
+var DEFAULT_PROGRESS_SEGMENTS_LABELS = {
+  empty: "\u041D\u0435\u0442 \u0441\u0435\u0433\u043C\u0435\u043D\u0442\u043E\u0432",
+  allEmpty: "\u0412\u0441\u0435 \u0441\u0435\u0433\u043C\u0435\u043D\u0442\u044B \u043F\u0443\u0441\u0442\u044B"
 };
+function nonNegative(n) {
+  return Number.isFinite(n) && n > 0 ? n : 0;
+}
+function resolveSegments(input, max, labels) {
+  const segments = input.map((s) => ({ ...s, value: nonNegative(s.value) }));
+  const total = segments.reduce((acc, s) => acc + s.value, 0);
+  const scale = max !== void 0 && max > 0 ? Math.max(max, total) : total;
+  let text;
+  if (segments.length === 0) text = labels.empty;
+  else if (scale <= 0) text = labels.allEmpty;
+  else
+    text = segments.map((s) => {
+      const pct = Math.round(s.value / scale * 100);
+      return s.label ? `${s.label}: ${pct}%` : `${pct}%`;
+    }).join(", ");
+  return {
+    segments,
+    total,
+    scale,
+    rest: scale - total,
+    percent: scale > 0 ? Math.round(total / scale * 100) : 0,
+    text
+  };
+}
 
-// src/components/divider/Divider.tsx
-import { jsx as jsx16 } from "react/jsx-runtime";
-function Divider({
-  orientation = "horizontal",
-  align = "center",
-  size = "m",
-  children,
-  className,
-  role = "separator",
-  ...rest
-}) {
-  return /* @__PURE__ */ jsx16(
-    "div",
-    {
-      ...rest,
-      className: cx(Divider_default.root, className),
-      role,
-      ...orientation === "vertical" ? { "aria-orientation": "vertical" } : {},
-      ...toDataAttributes({ orientation, align, size }),
-      children: children != null ? /* @__PURE__ */ jsx16(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsx16("span", { className: Divider_default.content, children }) }) : null
-    }
+// src/components/progress-bar/ProgressBar.module.css
+var ProgressBar_default = {
+  root: "ProgressBar_root",
+  segment: "ProgressBar_segment",
+  header: "ProgressBar_header",
+  label: "ProgressBar_label",
+  value: "ProgressBar_value",
+  native: "ProgressBar_native",
+  bar: "ProgressBar_bar",
+  fill: "ProgressBar_fill",
+  segments: "ProgressBar_segments",
+  rest: "ProgressBar_rest",
+  step: "ProgressBar_step"
+};
+
+// src/components/progress-bar/ProgressBar.tsx
+import { Fragment as Fragment5, jsx as jsx20, jsxs as jsxs11 } from "react/jsx-runtime";
+var MIN_STEPS = 2;
+var MAX_STEPS = 12;
+function useStepOrder(filled, count) {
+  const prev = React16.useRef(filled);
+  const from = prev.current;
+  React16.useEffect(() => {
+    prev.current = filled;
+  }, [filled]);
+  return Array.from(
+    { length: count },
+    (_, i) => filled >= from ? Math.max(0, i - from) : Math.max(0, from - 1 - i)
   );
 }
+function ProgressBar(props) {
+  const {
+    label,
+    size = "m",
+    showValue = false,
+    className,
+    value: valueProp,
+    max: maxProp,
+    tone: toneProp,
+    segments: segmentsProp,
+    segmentGap = "none",
+    steps = false,
+    labels,
+    "aria-label": ariaLabel,
+    ...rest
+  } = props;
+  const labelId = React16.useId();
+  const descriptionId = React16.useId();
+  const stepResolved = !segmentsProp && steps ? resolveValue(valueProp ?? 0, maxProp) : null;
+  const stepCount = stepResolved ? Math.min(MAX_STEPS, Math.max(MIN_STEPS, Math.round(stepResolved.max))) : 0;
+  const stepFilled = stepResolved ? Math.round(stepResolved.value / stepResolved.max * stepCount) : 0;
+  const stepOrder = useStepOrder(stepFilled, stepCount);
+  let percent;
+  let tone;
+  let bar;
+  if (segmentsProp) {
+    const resolved = resolveSegments(segmentsProp, maxProp, {
+      ...DEFAULT_PROGRESS_SEGMENTS_LABELS,
+      ...labels
+    });
+    const { segments, total, rest: free, text } = resolved;
+    percent = resolved.percent;
+    const named = Boolean(label || ariaLabel);
+    const a11y = named ? {
+      "aria-labelledby": label ? labelId : void 0,
+      "aria-label": label ? void 0 : ariaLabel,
+      "aria-describedby": descriptionId
+    } : { "aria-label": text };
+    bar = /* @__PURE__ */ jsxs11(Fragment5, { children: [
+      named ? /* @__PURE__ */ jsx20(VisuallyHidden, { id: descriptionId, children: text }) : null,
+      /* @__PURE__ */ jsxs11(
+        "div",
+        {
+          className: ProgressBar_default.bar,
+          role: "group",
+          ...a11y,
+          ...toDataAttributes({ "segment-gap": segmentGap }),
+          children: [
+            total > 0 ? /* @__PURE__ */ jsx20("span", { className: ProgressBar_default.segments, style: { flexGrow: total }, children: segments.map((seg, i) => /* @__PURE__ */ jsx20(
+              "span",
+              {
+                className: ProgressBar_default.segment,
+                style: { flexGrow: seg.value },
+                title: seg.label,
+                ...toDataAttributes({ tone: seg.tone ?? "accent" })
+              },
+              i
+            )) }) : null,
+            free > 0 || total === 0 ? /* @__PURE__ */ jsx20("span", { className: ProgressBar_default.rest, style: { flexGrow: free > 0 ? free : 1 } }) : null
+          ]
+        }
+      )
+    ] });
+  } else {
+    const resolved = resolveValue(valueProp ?? 0, maxProp);
+    const { value, max } = resolved;
+    percent = resolved.percent;
+    tone = toneProp ?? "accent";
+    bar = /* @__PURE__ */ jsxs11(Fragment5, { children: [
+      /* @__PURE__ */ jsx20(
+        "progress",
+        {
+          value,
+          max,
+          "aria-labelledby": label ? labelId : void 0,
+          "aria-label": label ? void 0 : ariaLabel,
+          className: ProgressBar_default.native
+        }
+      ),
+      steps ? /* @__PURE__ */ jsx20("span", { className: ProgressBar_default.bar, "aria-hidden": "true", "data-steps": "true", children: stepOrder.map((order, i) => /* @__PURE__ */ jsx20(
+        "span",
+        {
+          className: ProgressBar_default.step,
+          "data-filled": i < stepFilled || void 0,
+          style: { "--pb-step-order": order }
+        },
+        i
+      )) }) : /* @__PURE__ */ jsx20(
+        "span",
+        {
+          className: ProgressBar_default.bar,
+          "aria-hidden": "true",
+          style: { "--pb-ratio": resolved.ratio },
+          children: /* @__PURE__ */ jsx20("span", { className: ProgressBar_default.fill })
+        }
+      )
+    ] });
+  }
+  return /* @__PURE__ */ jsxs11("div", { className: cx(ProgressBar_default.root, className), ...rest, ...toDataAttributes({ size, tone }), children: [
+    label || showValue ? /* @__PURE__ */ jsxs11("div", { className: ProgressBar_default.header, children: [
+      label ? /* @__PURE__ */ jsx20("span", { className: ProgressBar_default.label, id: labelId, children: label }) : null,
+      showValue ? /* @__PURE__ */ jsxs11("span", { className: ProgressBar_default.value, "aria-hidden": "true", children: [
+        percent,
+        "%"
+      ] }) : null
+    ] }) : null,
+    bar
+  ] });
+}
+
+// src/components/input/passwordStrength.ts
+var SHORT = 8;
+function getPasswordStrength(value) {
+  if (value.length === 0) return 0;
+  const points = Number(/\p{Ll}/u.test(value)) + Number(/\p{Lu}/u.test(value)) + Number(/\p{N}/u.test(value)) + Number(/[^\p{L}\p{N}\s]/u.test(value)) + Number(value.length >= 10) + Number(value.length >= 14);
+  const level = points >= 5 ? 4 : points === 4 ? 3 : points === 3 ? 2 : 1;
+  return value.length < SHORT ? Math.min(level, 2) : level;
+}
 
 // src/components/input/Input.tsx
-import * as React13 from "react";
+import * as React18 from "react";
 
 // src/internal/context.ts
-import * as React12 from "react";
+import * as React17 from "react";
 function createComponentContext(displayName) {
-  const Ctx = React12.createContext(null);
+  const Ctx = React17.createContext(null);
   Ctx.displayName = `${displayName}Context`;
   function useComponentContext() {
-    const value = React12.useContext(Ctx);
+    const value = React17.useContext(Ctx);
     if (value === null) {
       throw new Error(
         `[prime-ui-kit] \`${displayName}\` sub-component must be used inside \`${displayName}.Root\`.`
@@ -1480,15 +2002,27 @@ var Input_default = {
   field: "Input_field",
   inlineAffix: "Input_inlineAffix",
   icon: "Input_icon",
-  action: "Input_action"
+  action: "Input_action",
+  strengthWord: "Input_strengthWord"
 };
 
 // src/components/input/Input.tsx
-import { jsx as jsx17 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx21, jsxs as jsxs12 } from "react/jsx-runtime";
 var INPUT_LABELS = {
   optional: "\u043D\u0435\u043E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u043E",
   clear: "\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C",
-  counter: "{current} \u0438\u0437 {max} \u0441\u0438\u043C\u0432\u043E\u043B\u043E\u0432"
+  counter: "{current} \u0438\u0437 {max} \u0441\u0438\u043C\u0432\u043E\u043B\u043E\u0432",
+  strength: "\u041D\u0430\u0434\u0451\u0436\u043D\u043E\u0441\u0442\u044C \u043F\u0430\u0440\u043E\u043B\u044F",
+  strengthWeak: "\u0421\u043B\u0430\u0431\u044B\u0439",
+  strengthEasy: "\u041B\u0451\u0433\u043A\u0438\u0439",
+  strengthMedium: "\u0421\u0440\u0435\u0434\u043D\u0438\u0439",
+  strengthHard: "\u0421\u043B\u043E\u0436\u043D\u044B\u0439"
+};
+var STRENGTH_TONES = {
+  1: "danger",
+  2: "warning",
+  3: "accent",
+  4: "success"
 };
 var [InputProvider, useInputContext] = createComponentContext("Input");
 function InputRoot({
@@ -1503,17 +2037,20 @@ function InputRoot({
   counter,
   reserveSupportRow = false,
   id,
+  strength = false,
+  getStrength = getPasswordStrength,
   labels: labelsProp,
   children,
   className,
   ...rest
 }) {
+  const [strengthValue, setStrengthValue] = React18.useState("");
   const size = useControlSize(sizeProp);
   const ids = useFieldFrame(id, { label, hint, error, invalid });
-  const labels = React13.useMemo(() => ({ ...INPUT_LABELS, ...labelsProp }), [labelsProp]);
+  const labels = React18.useMemo(() => ({ ...INPUT_LABELS, ...labelsProp }), [labelsProp]);
   const { invalid: isInvalid, controlId: inputId, describedBy } = ids;
-  const inputRef = React13.useRef(null);
-  const contextValue = React13.useMemo(
+  const inputRef = React18.useRef(null);
+  const contextValue = React18.useMemo(
     () => ({
       size,
       invalid: isInvalid,
@@ -1522,11 +2059,14 @@ function InputRoot({
       inputId,
       inputRef,
       describedBy,
-      labels
+      labels,
+      reportValue: strength ? setStrengthValue : null
     }),
-    [size, isInvalid, focusRing, required, inputId, describedBy, labels]
+    [size, isInvalid, focusRing, required, inputId, describedBy, labels, strength]
   );
-  return /* @__PURE__ */ jsx17(InputProvider, { value: contextValue, children: /* @__PURE__ */ jsx17(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsx17(
+  const level = strength ? getStrength(strengthValue) : 0;
+  const levelWord = level ? [labels.strengthWeak, labels.strengthEasy, labels.strengthMedium, labels.strengthHard][level - 1] : "";
+  return /* @__PURE__ */ jsx21(InputProvider, { value: contextValue, children: /* @__PURE__ */ jsx21(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsxs12(
     FieldFrame,
     {
       ...rest,
@@ -1537,18 +2077,45 @@ function InputRoot({
       optional,
       hint,
       error,
-      counter,
-      reserveSupportRow,
+      counter: strength ? /* @__PURE__ */ jsxs12(Fragment6, { children: [
+        /* @__PURE__ */ jsx21(
+          "span",
+          {
+            className: Input_default.strengthWord,
+            "data-tone": level ? STRENGTH_TONES[level] : void 0,
+            "aria-live": "polite",
+            children: levelWord ? /* @__PURE__ */ jsxs12(Fragment6, { children: [
+              /* @__PURE__ */ jsx21(VisuallyHidden, { children: `${labels.strength}: ` }),
+              /* @__PURE__ */ jsx21(MorphText, { children: levelWord })
+            ] }) : null
+          }
+        ),
+        counter
+      ] }) : counter,
+      reserveSupportRow: reserveSupportRow || strength,
       optionalLabel: labels.optional,
       className: cx(fieldTierClass, Input_default.root, className),
-      children
+      children: [
+        children,
+        strength ? /* @__PURE__ */ jsx21(
+          ProgressBar,
+          {
+            steps: true,
+            value: level,
+            max: 4,
+            tone: level ? STRENGTH_TONES[level] : "neutral",
+            size: "xs",
+            "aria-label": labels.strength
+          }
+        ) : null
+      ]
     }
   ) }) });
 }
 InputRoot.displayName = "Input.Root";
 function InputWrapper({ children, className, ...rest }) {
   const { size, invalid, focusRing } = useInputContext();
-  return /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsx21(
     "div",
     {
       ...rest,
@@ -1572,10 +2139,23 @@ function InputField({
   ref,
   ...rest
 }) {
-  const { inputId, inputRef, invalid, required: requiredCtx, describedBy } = useInputContext();
+  const {
+    inputId,
+    inputRef,
+    invalid,
+    required: requiredCtx,
+    describedBy,
+    reportValue
+  } = useInputContext();
   const setRefs = useMergedRefs(inputRef, ref);
+  const controlled = rest.value;
+  React18.useEffect(() => {
+    if (!reportValue) return;
+    if (controlled !== void 0) reportValue(String(controlled));
+    else if (inputRef.current) reportValue(inputRef.current.value);
+  }, [reportValue, controlled, inputRef]);
   const resolvedDescribedBy = [ariaDescribedBy, describedBy].filter(Boolean).join(" ") || void 0;
-  return /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsx21(
     "input",
     {
       ...rest,
@@ -1588,21 +2168,22 @@ function InputField({
       onChange: (event) => {
         onChange?.(event);
         onValueChange?.(event.target.value);
+        reportValue?.(event.target.value);
       }
     }
   );
 }
 InputField.displayName = "Input.Field";
 function InputIcon({ side, children, className, ...rest }) {
-  return /* @__PURE__ */ jsx17("span", { ...rest, className: cx(Input_default.icon, className), "data-side": side, "aria-hidden": "true", children });
+  return /* @__PURE__ */ jsx21("span", { ...rest, className: cx(Input_default.icon, className), "data-side": side, "aria-hidden": "true", children });
 }
 InputIcon.displayName = "Input.Icon";
 function InputAffix({ side, children, className, ...rest }) {
-  return /* @__PURE__ */ jsx17("div", { ...rest, className: cx(Input_default.affix, className), "data-side": side, "aria-hidden": "true", children });
+  return /* @__PURE__ */ jsx21("div", { ...rest, className: cx(Input_default.affix, className), "data-side": side, "aria-hidden": "true", children });
 }
 InputAffix.displayName = "Input.Affix";
 function InputInlineAffix({ side, children, className, ...rest }) {
-  return /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsx21(
     "span",
     {
       ...rest,
@@ -1616,7 +2197,7 @@ function InputInlineAffix({ side, children, className, ...rest }) {
 InputInlineAffix.displayName = "Input.InlineAffix";
 function InputClearButton({ className, onClick: onClick2, ref, ...rest }) {
   const { inputId, inputRef, labels } = useInputContext();
-  return /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsx21(
     "button",
     {
       ...rest,
@@ -1629,14 +2210,14 @@ function InputClearButton({ className, onClick: onClick2, ref, ...rest }) {
         onClick2?.(event);
         if (!event.defaultPrevented) inputRef.current?.focus();
       },
-      children: /* @__PURE__ */ jsx17(Icon, { name: "action.close" })
+      children: /* @__PURE__ */ jsx21(Icon, { name: "action.close" })
     }
   );
 }
 InputClearButton.displayName = "Input.ClearButton";
 function InputCounter(props) {
   const { size, labels } = useInputContext();
-  return /* @__PURE__ */ jsx17(FieldCounter, { ...props, size, label: labels.counter });
+  return /* @__PURE__ */ jsx21(FieldCounter, { ...props, size, label: labels.counter });
 }
 InputCounter.displayName = "Input.Counter";
 var Input = {
@@ -1651,17 +2232,17 @@ var Input = {
 };
 
 // src/internal/imageSlot.tsx
-import * as React15 from "react";
+import * as React20 from "react";
 
 // src/hooks/useImageStatus.ts
-import * as React14 from "react";
+import * as React19 from "react";
 function useImageStatus(report, { onLoad, onError } = {}) {
-  const [status, setStatus] = React14.useState("loading");
-  React14.useLayoutEffect(() => {
+  const [status, setStatus] = React19.useState("loading");
+  React19.useLayoutEffect(() => {
     report("loading");
     return () => report("idle");
   }, [report]);
-  const handleLoad = React14.useCallback(
+  const handleLoad = React19.useCallback(
     (event) => {
       setStatus("loaded");
       report("loaded");
@@ -1669,7 +2250,7 @@ function useImageStatus(report, { onLoad, onError } = {}) {
     },
     [onLoad, report]
   );
-  const handleError = React14.useCallback(
+  const handleError = React19.useCallback(
     (event) => {
       setStatus("error");
       report("error");
@@ -1681,18 +2262,18 @@ function useImageStatus(report, { onLoad, onError } = {}) {
 }
 
 // src/internal/imageSlot.tsx
-import { jsx as jsx18 } from "react/jsx-runtime";
+import { jsx as jsx22 } from "react/jsx-runtime";
 function createImageSlot(name, classNames) {
   const [Provider, useSlotContext] = createComponentContext(name);
   function ImageSlotProvider({ children }) {
-    const [imageStatus, setImageStatus] = React15.useState("idle");
-    const value = React15.useMemo(() => ({ imageStatus, setImageStatus }), [imageStatus]);
-    return /* @__PURE__ */ jsx18(Provider, { value, children });
+    const [imageStatus, setImageStatus] = React20.useState("idle");
+    const value = React20.useMemo(() => ({ imageStatus, setImageStatus }), [imageStatus]);
+    return /* @__PURE__ */ jsx22(Provider, { value, children });
   }
   function ImageInner({ src, alt = "", className, onLoad, onError, ...rest }) {
     const { setImageStatus } = useSlotContext();
     const image = useImageStatus(setImageStatus, { onLoad, onError });
-    return /* @__PURE__ */ jsx18(
+    return /* @__PURE__ */ jsx22(
       "img",
       {
         src,
@@ -1706,12 +2287,12 @@ function createImageSlot(name, classNames) {
     );
   }
   function Image2(props) {
-    return /* @__PURE__ */ jsx18(ImageInner, { ...props }, props.src);
+    return /* @__PURE__ */ jsx22(ImageInner, { ...props }, props.src);
   }
   Image2.displayName = `${name}.Image`;
   function Fallback({ className, ...rest }) {
     const { imageStatus } = useSlotContext();
-    return /* @__PURE__ */ jsx18(
+    return /* @__PURE__ */ jsx22(
       "span",
       {
         className: cx(classNames.fallback, className),
@@ -1742,7 +2323,7 @@ var Thumbnail_default = {
 };
 
 // src/components/thumbnail/Thumbnail.tsx
-import { jsx as jsx19 } from "react/jsx-runtime";
+import { jsx as jsx23 } from "react/jsx-runtime";
 var slot = createImageSlot("Thumbnail", { image: Thumbnail_default.image, fallback: Thumbnail_default.fallback });
 function ThumbnailRoot({
   size = "m",
@@ -1755,7 +2336,7 @@ function ThumbnailRoot({
   children,
   ...rest
 }) {
-  return /* @__PURE__ */ jsx19(slot.ImageSlotProvider, { children: /* @__PURE__ */ jsx19(
+  return /* @__PURE__ */ jsx23(slot.ImageSlotProvider, { children: /* @__PURE__ */ jsx23(
     "div",
     {
       className: cx(Thumbnail_default.root, palette_default.hue, className),
@@ -1774,7 +2355,7 @@ function ThumbnailRoot({
 }
 ThumbnailRoot.displayName = "Thumbnail.Root";
 function ThumbnailImage({ fit = "cover", ...rest }) {
-  return /* @__PURE__ */ jsx19(slot.Image, { ...rest, "data-fit": fit });
+  return /* @__PURE__ */ jsx23(slot.Image, { ...rest, "data-fit": fit });
 }
 ThumbnailImage.displayName = "Thumbnail.Image";
 var ThumbnailFallback = slot.Fallback;
@@ -1785,10 +2366,10 @@ var Thumbnail = {
 };
 
 // src/components/select/Select.tsx
-import * as React26 from "react";
+import * as React34 from "react";
 
 // src/internal/listbox.ts
-import * as React16 from "react";
+import * as React21 from "react";
 var optionDomId = (listboxId, value) => `${listboxId}-opt-${value.replace(/\s+/g, "_")}`;
 function enabledOptions(container) {
   if (!container) return [];
@@ -1813,11 +2394,11 @@ function createStore(initial) {
   };
 }
 function useCreateStore(initial) {
-  return React16.useState(() => createStore(initial))[0];
+  return React21.useState(() => createStore(initial))[0];
 }
 function useStoreSlice(store, select) {
   const read = () => select(store.get());
-  return React16.useSyncExternalStore(store.subscribe, read, read);
+  return React21.useSyncExternalStore(store.subscribe, read, read);
 }
 function handleListboxKeyDown(event, { items, highlight, onSelect }) {
   if (items.length === 0) return;
@@ -1839,10 +2420,10 @@ function handleListboxKeyDown(event, { items, highlight, onSelect }) {
 }
 var TYPEAHEAD_RESET_MS = 500;
 function useTypeahead() {
-  const state = React16.useRef({ buffer: "", timer: 0 });
-  React16.useEffect(() => () => window.clearTimeout(state.current.timer), []);
-  const isTyping = React16.useCallback(() => state.current.buffer !== "", []);
-  const find = React16.useCallback(
+  const state = React21.useRef({ buffer: "", timer: 0 });
+  React21.useEffect(() => () => window.clearTimeout(state.current.timer), []);
+  const isTyping = React21.useCallback(() => state.current.buffer !== "", []);
+  const find = React21.useCallback(
     (key, items, highlighted) => {
       const s = state.current;
       window.clearTimeout(s.timer);
@@ -1864,7 +2445,7 @@ function useTypeahead() {
 }
 
 // src/internal/MenuGroup.tsx
-import * as React17 from "react";
+import * as React22 from "react";
 
 // src/internal/menu.module.css
 var menu_default = {
@@ -1873,6 +2454,7 @@ var menu_default = {
   item: "menu_item",
   itemIcon: "menu_itemIcon",
   shortcut: "menu_shortcut",
+  check: "menu_check",
   group: "menu_group",
   groupLabel: "menu_groupLabel",
   separator: "menu_separator",
@@ -1881,12 +2463,12 @@ var menu_default = {
 };
 
 // src/internal/MenuGroup.tsx
-import { jsx as jsx20, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx24, jsxs as jsxs13 } from "react/jsx-runtime";
 function MenuGroup({ label, className, children, ...rest }) {
-  const labelId = React17.useId();
+  const labelId = React22.useId();
   return (
     // biome-ignore lint/a11y/useSemanticElements: role="group" inside a menu / listbox; <fieldset> is not allowed there
-    /* @__PURE__ */ jsxs9(
+    /* @__PURE__ */ jsxs13(
       "div",
       {
         ...rest,
@@ -1894,7 +2476,7 @@ function MenuGroup({ label, className, children, ...rest }) {
         "aria-labelledby": label != null ? labelId : void 0,
         className: cx(menu_default.group, className),
         children: [
-          label != null ? /* @__PURE__ */ jsx20("div", { id: labelId, role: "presentation", className: menu_default.groupLabel, children: label }) : null,
+          label != null ? /* @__PURE__ */ jsx24("div", { id: labelId, role: "presentation", className: menu_default.groupLabel, children: label }) : null,
           children
         ]
       }
@@ -1905,13 +2487,17 @@ function MenuGroup({ label, className, children, ...rest }) {
 // src/internal/floatingSurface.module.css
 var floatingSurface_default = {
   surface: "floatingSurface_surface",
-  layer: "floatingSurface_layer"
+  layer: "floatingSurface_layer",
+  scrim: "floatingSurface_scrim",
+  sheet: "floatingSurface_sheet",
+  sheetContent: "floatingSurface_sheetContent"
 };
 
 // src/internal/overlayMotion.module.css
 var overlayMotion_default = {
   dialog: "overlayMotion_dialog",
   drawer: "overlayMotion_drawer",
+  sheet: "overlayMotion_sheet",
   floating: "overlayMotion_floating",
   scrim: "overlayMotion_scrim",
   overlayFadeIn: "overlayMotion_overlayFadeIn",
@@ -1927,11 +2513,11 @@ var overlayMotion_default = {
 };
 
 // src/internal/Portal.tsx
-import * as React18 from "react";
+import * as React23 from "react";
 import { createPortal } from "react-dom";
 function Portal({ children, container }) {
-  const [mounted, setMounted] = React18.useState(false);
-  React18.useLayoutEffect(() => {
+  const [mounted, setMounted] = React23.useState(false);
+  React23.useLayoutEffect(() => {
     setMounted(true);
     return () => setMounted(false);
   }, []);
@@ -1939,8 +2525,35 @@ function Portal({ children, container }) {
   return createPortal(children, container ?? document.body);
 }
 
+// src/internal/sheet.module.css
+var sheet_default = {
+  handle: "sheet_handle",
+  swipeY: "sheet_swipeY",
+  swipeX: "sheet_swipeX"
+};
+
+// src/internal/surfaceDepth.tsx
+import * as React24 from "react";
+var SurfaceDepthContext = React24.createContext(0);
+SurfaceDepthContext.displayName = "SurfaceDepthContext";
+function nextSurfaceDepth(depth) {
+  if (typeof depth === "number") return Math.min(depth + 1, 4);
+  if (depth === "tinted") return 1;
+  return depth === "floating" ? "floating-1" : "floating-2";
+}
+function useNestedSurfaceDepth() {
+  return nextSurfaceDepth(React24.useContext(SurfaceDepthContext));
+}
+var SurfaceDepthProvider = SurfaceDepthContext.Provider;
+var StageDepthContext = React24.createContext(0);
+StageDepthContext.displayName = "StageDepthContext";
+var StageDepthProvider = StageDepthContext.Provider;
+function useStageDepth() {
+  return React24.useContext(StageDepthContext);
+}
+
 // src/internal/overlay/layerStack.ts
-import * as React19 from "react";
+import * as React25 from "react";
 
 // src/internal/overlay/focus.ts
 var FOCUSABLE = [
@@ -2061,22 +2674,22 @@ function push(entry) {
     if (stack.length === 0) listen(false);
   };
 }
-var LayerContext = React19.createContext(null);
+var LayerContext = React25.createContext(null);
 var LayerProvider = LayerContext.Provider;
 function useLayer(open, options) {
-  const parent = React19.useContext(LayerContext);
-  const [entry] = React19.useState(() => ({ parent, trap: false, ...options }));
+  const parent = React25.useContext(LayerContext);
+  const [entry] = React25.useState(() => ({ parent, trap: false, ...options }));
   entry.parent = parent;
   entry.refs = options.refs;
   entry.dismiss = options.dismiss;
   entry.trap = options.trap ?? false;
   entry.onDismiss = options.onDismiss;
-  React19.useLayoutEffect(() => open ? push(entry) : void 0, [open, entry]);
+  React25.useLayoutEffect(() => open ? push(entry) : void 0, [open, entry]);
   return entry;
 }
 
 // src/internal/overlay/FloatingPanel.tsx
-import { jsx as jsx21 } from "react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx25, jsxs as jsxs14 } from "react/jsx-runtime";
 function FloatingPanel({
   floating,
   size,
@@ -2088,43 +2701,96 @@ function FloatingPanel({
   ref,
   ...rest
 }) {
-  const panelRef = useMergedRefs(floating.panelRef, ref);
+  const mergedRef = useMergedRefs(floating.panelRef, ref);
   if (!floating.mounted) return null;
+  const { sheet, presence } = floating;
+  const panelRef = sheet ? ref : mergedRef;
   const props = {
     ...rest,
-    className: cx(
+    className: sheet ? cx(floatingSurface_default.sheetContent, className) : cx(
       surface && floatingSurface_default.surface,
       floatingSurface_default.layer,
       overlayMotion_default.floating,
       className
     ),
-    "data-state": floating.presence.state,
-    "data-side": floating.side,
     "data-size": size,
-    onAnimationEnd: floating.presence.onExitEnd,
+    ...surface && !sheet ? { "data-depth": "floating" } : null,
+    ...sheet ? null : {
+      "data-state": presence.state,
+      "data-side": floating.side,
+      onAnimationEnd: presence.onExitEnd
+    },
     onKeyDown: (event) => {
       onKeyDown2?.(event);
       floating.onKeyDown(event);
     }
   };
-  return /* @__PURE__ */ jsx21(Portal, { children: /* @__PURE__ */ jsx21(LayerProvider, { value: floating.layer, children: /* @__PURE__ */ jsx21(ControlSizeProvider, { value: size, children: scroll ? /* @__PURE__ */ jsx21(ScrollContainer, { ...props, ref: panelRef, children }) : /* @__PURE__ */ jsx21("div", { ...props, ref: panelRef, children }) }) }) });
+  const panel = scroll ? /* @__PURE__ */ jsx25(ScrollContainer, { ...props, ref: panelRef, children }) : /* @__PURE__ */ jsx25("div", { ...props, ref: panelRef, children });
+  return /* @__PURE__ */ jsx25(Portal, { children: /* @__PURE__ */ jsx25(LayerProvider, { value: floating.layer, children: /* @__PURE__ */ jsx25(SurfaceDepthProvider, { value: "floating", children: /* @__PURE__ */ jsx25(ControlSizeProvider, { value: size, children: sheet ? /* @__PURE__ */ jsxs14(Fragment7, { children: [
+    /* @__PURE__ */ jsx25(
+      "div",
+      {
+        role: "presentation",
+        className: cx(floatingSurface_default.scrim, floatingSurface_default.layer, overlayMotion_default.scrim),
+        "data-state": presence.state
+      }
+    ),
+    /* @__PURE__ */ jsxs14(
+      "div",
+      {
+        ref: floating.panelRef,
+        className: cx(
+          floatingSurface_default.sheet,
+          floatingSurface_default.layer,
+          overlayMotion_default.sheet,
+          sheet_default.swipeY
+        ),
+        "data-depth": "floating",
+        "data-state": presence.state,
+        onAnimationEnd: presence.onExitEnd,
+        onPointerDown: floating.onSheetPointerDown,
+        children: [
+          /* @__PURE__ */ jsx25("div", { className: sheet_default.handle, "data-swipe-handle": "", "aria-hidden": "true" }),
+          panel
+        ]
+      }
+    )
+  ] }) : panel }) }) }) });
 }
 function FloatingTrigger({ triggerProps, children, ...forwarded }) {
-  return /* @__PURE__ */ jsx21(Slot, { ...forwarded, children: /* @__PURE__ */ jsx21(Slot, { ...triggerProps, children }) });
+  return /* @__PURE__ */ jsx25(Slot, { ...forwarded, children: /* @__PURE__ */ jsx25(Slot, { ...triggerProps, children }) });
 }
 
 // src/internal/overlay/useFloatingLayer.ts
-import * as React23 from "react";
+import * as React31 from "react";
+
+// src/hooks/useMediaQuery.ts
+import * as React26 from "react";
+var COMPACT_QUERY = "(max-width: 639px)";
+function useMediaQuery(query, enabled = true) {
+  const subscribe = React26.useCallback(
+    (onChange) => {
+      if (!enabled || typeof window === "undefined" || !window.matchMedia) return () => {
+      };
+      const mq = window.matchMedia(query);
+      mq.addEventListener("change", onChange);
+      return () => mq.removeEventListener("change", onChange);
+    },
+    [enabled, query]
+  );
+  const getSnapshot = () => enabled && typeof window !== "undefined" && !!window.matchMedia ? window.matchMedia(query).matches : false;
+  return React26.useSyncExternalStore(subscribe, getSnapshot, () => false);
+}
 
 // src/hooks/usePosition.ts
-import * as React21 from "react";
+import * as React28 from "react";
 
 // src/internal/AnchorRectContext.tsx
-import * as React20 from "react";
-var AnchorRectContext = React20.createContext(null);
+import * as React27 from "react";
+var AnchorRectContext = React27.createContext(null);
 var AnchorRectProvider = AnchorRectContext.Provider;
 function useAnchorRectResolver() {
-  return React20.useContext(AnchorRectContext);
+  return React27.useContext(AnchorRectContext);
 }
 
 // src/internal/layoutPxFromPrimitives.ts
@@ -2249,11 +2915,11 @@ function usePosition(enabled, anchorRef, layerRef, {
   offsetToken = "--prime-panel-offset",
   arrowInset
 } = {}) {
-  const [attached, setAttached] = React21.useState(false);
-  const [resolvedSide, setResolvedSide] = React21.useState(preferredSide);
+  const [attached, setAttached] = React28.useState(false);
+  const [resolvedSide, setResolvedSide] = React28.useState(preferredSide);
   const resolveAnchorRect = useAnchorRectResolver();
-  const metricsRef = React21.useRef(null);
-  const update = React21.useCallback(
+  const metricsRef = React28.useRef(null);
+  const update = React28.useCallback(
     (remeasure) => {
       const anchor = anchorRef.current;
       const layer = layerRef.current;
@@ -2307,9 +2973,9 @@ function usePosition(enabled, anchorRef, layerRef, {
       resolveAnchorRect
     ]
   );
-  const updateRef = React21.useRef(update);
+  const updateRef = React28.useRef(update);
   updateRef.current = update;
-  const attachLayer = React21.useCallback(
+  const attachLayer = React28.useCallback(
     (node) => {
       layerRef.current = node;
       setAttached(node !== null);
@@ -2317,10 +2983,10 @@ function usePosition(enabled, anchorRef, layerRef, {
     [layerRef]
   );
   const active = enabled && attached;
-  React21.useLayoutEffect(() => {
+  React28.useLayoutEffect(() => {
     if (active) update(true);
   }, [active, update]);
-  React21.useLayoutEffect(() => {
+  React28.useLayoutEffect(() => {
     if (!active) return;
     let frame = 0;
     let remeasure = false;
@@ -2354,53 +3020,158 @@ function usePosition(enabled, anchorRef, layerRef, {
   return { side: resolvedSide, attachLayer };
 }
 
-// src/hooks/usePresence.ts
-import * as React22 from "react";
-var DURATION_FALLBACK_MS = {
-  fast: 230,
-  base: 380,
-  slow: 570
-};
-var TIMEOUT_SLACK_MS = 50;
-function prefersReducedMotion() {
-  return typeof window !== "undefined" && typeof window.matchMedia === "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+// src/hooks/useScrollLock.ts
+import * as React29 from "react";
+var lockCount = 0;
+var saved = null;
+function lockScroll() {
+  if (lockCount === 0) {
+    const { body, documentElement } = document;
+    const scrollbarWidth = window.innerWidth - documentElement.clientWidth;
+    saved = { overflow: body.style.overflow, paddingRight: body.style.paddingRight };
+    if (scrollbarWidth > 0) {
+      const padding = Number.parseFloat(window.getComputedStyle(body).paddingRight) || 0;
+      body.style.paddingRight = `${padding + scrollbarWidth}px`;
+    }
+    body.style.overflow = "hidden";
+  }
+  lockCount++;
+}
+function unlockScroll() {
+  lockCount = Math.max(0, lockCount - 1);
+  if (lockCount === 0 && saved) {
+    document.body.style.overflow = saved.overflow;
+    document.body.style.paddingRight = saved.paddingRight;
+    saved = null;
+  }
 }
-function parseDurationMs(raw) {
-  const value = raw.trim();
-  if (value === "") return null;
-  const n = Number.parseFloat(value);
-  if (Number.isNaN(n)) return null;
-  if (value.endsWith("ms")) return n;
-  if (value.endsWith("s")) return n * 1e3;
-  return null;
+function useScrollLock(enabled) {
+  React29.useEffect(() => {
+    if (!enabled) return;
+    lockScroll();
+    return unlockScroll;
+  }, [enabled]);
+}
+
+// src/hooks/useSwipeDismiss.ts
+import * as React30 from "react";
+var SLOP_PX = 8;
+var DISTANCE_RATIO = 0.3;
+var FLICK_VELOCITY = 0.5;
+var VELOCITY_WINDOW_MS = 100;
+var NO_DRAG = "input, textarea, select, [contenteditable], [role='slider']";
+var SWIPE_OFFSET_VAR = "--swipe-offset";
+var OVERPULL_PX = 24;
+function rubberBand(distance) {
+  return -OVERPULL_PX * (1 - 1 / (1 + Math.abs(distance) / OVERPULL_PX));
+}
+function inCrossScroller(target, panel, horizontal) {
+  for (let node = target; node && node !== panel; node = node.parentElement) {
+    const style = getComputedStyle(node);
+    const overflow = horizontal ? style.overflowX : style.overflowY;
+    const scrolls = horizontal ? node.scrollWidth > node.clientWidth : node.scrollHeight > node.clientHeight;
+    if (scrolls && (overflow === "auto" || overflow === "scroll")) return true;
+  }
+  return false;
 }
-function motionDurationMs(token) {
-  if (typeof document === "undefined") return DURATION_FALLBACK_MS[token];
-  const raw = getComputedStyle(document.documentElement).getPropertyValue(
-    `--prime-motion-duration-${token}`
+function useSwipeDismiss({
+  enabled,
+  direction,
+  onDismiss,
+  handle,
+  touchAnywhere = false,
+  onProgress
+}) {
+  const optionsRef = React30.useRef({ direction, onDismiss, handle, touchAnywhere, onProgress });
+  optionsRef.current = { direction, onDismiss, handle, touchAnywhere, onProgress };
+  const cleanupRef = React30.useRef(null);
+  React30.useEffect(() => () => cleanupRef.current?.(), []);
+  const onPointerDown2 = React30.useCallback(
+    (event) => {
+      if (!enabled || event.defaultPrevented || !event.isPrimary || event.button !== 0) return;
+      const { direction: direction2, handle: handle2, touchAnywhere: touchAnywhere2 } = optionsRef.current;
+      const panel = event.currentTarget;
+      const target = event.target;
+      if (target.closest(NO_DRAG)) return;
+      const fromHandle = target.closest(handle2) !== null && panel.contains(target.closest(handle2));
+      const horizontal = direction2 !== "down";
+      if (!fromHandle) {
+        if (!touchAnywhere2 || event.pointerType !== "touch") return;
+        if (inCrossScroller(target, panel, horizontal)) return;
+      }
+      cleanupRef.current?.();
+      const pointerId = event.pointerId;
+      const sign = direction2 === "left" ? -1 : 1;
+      const start = horizontal ? event.clientX : event.clientY;
+      const startCross = horizontal ? event.clientY : event.clientX;
+      let dragging = false;
+      let offset = 0;
+      let samples = [];
+      const full = horizontal ? panel.offsetWidth : panel.offsetHeight;
+      const write = (value, progress = full > 0 ? value / full : value > 0 ? 1 : 0) => {
+        panel.style.setProperty(SWIPE_OFFSET_VAR, `${value * sign}px`);
+        optionsRef.current.onProgress?.(Math.min(1, Math.max(0, progress)));
+      };
+      const finish = () => {
+        window.removeEventListener("pointermove", onMove);
+        window.removeEventListener("pointerup", onUp);
+        window.removeEventListener("pointercancel", onCancel);
+        cleanupRef.current = null;
+      };
+      const settle = (dismiss) => {
+        delete panel.dataset.swiping;
+        if (dismiss) {
+          panel.dataset.swipeDismissed = "";
+          write(full, 1);
+          optionsRef.current.onDismiss();
+        } else {
+          write(0);
+        }
+      };
+      const onMove = (move) => {
+        if (move.pointerId !== pointerId) return;
+        const along = ((horizontal ? move.clientX : move.clientY) - start) * sign;
+        const across = (horizontal ? move.clientY : move.clientX) - startCross;
+        if (!dragging) {
+          if (Math.abs(along) < SLOP_PX && Math.abs(across) < SLOP_PX) return;
+          if (Math.abs(across) > Math.abs(along) || !fromHandle && along < 0) {
+            finish();
+            return;
+          }
+          dragging = true;
+          panel.dataset.swiping = "";
+          panel.setPointerCapture?.(pointerId);
+        }
+        move.preventDefault();
+        offset = along > 0 ? along : rubberBand(along);
+        write(offset);
+        const now = move.timeStamp;
+        samples.push({ t: now, d: along });
+        samples = samples.filter((s) => now - s.t <= VELOCITY_WINDOW_MS);
+      };
+      const onUp = (up) => {
+        if (up.pointerId !== pointerId) return;
+        finish();
+        if (!dragging) return;
+        const first = samples[0];
+        const last = samples[samples.length - 1];
+        const elapsed = first && last ? last.t - first.t : 0;
+        const velocity = elapsed > 0 ? (last.d - first.d) / elapsed : 0;
+        settle(offset > full * DISTANCE_RATIO || offset > SLOP_PX && velocity > FLICK_VELOCITY);
+      };
+      const onCancel = (cancel) => {
+        if (cancel.pointerId !== pointerId) return;
+        finish();
+        if (dragging) settle(false);
+      };
+      window.addEventListener("pointermove", onMove, { passive: false });
+      window.addEventListener("pointerup", onUp);
+      window.addEventListener("pointercancel", onCancel);
+      cleanupRef.current = finish;
+    },
+    [enabled]
   );
-  return parseDurationMs(raw) ?? DURATION_FALLBACK_MS[token];
-}
-function exitTimeoutMs(token) {
-  return motionDurationMs(token) + TIMEOUT_SLACK_MS;
-}
-function usePresence(open, options = {}) {
-  const { exitDuration = "base" } = options;
-  const [mounted, setMounted] = React22.useState(open);
-  if (open && !mounted) setMounted(true);
-  if (!open && mounted && prefersReducedMotion()) setMounted(false);
-  const openRef = React22.useRef(open);
-  openRef.current = open;
-  React22.useEffect(() => {
-    if (open || !mounted) return;
-    const id = window.setTimeout(() => setMounted(false), exitTimeoutMs(exitDuration));
-    return () => window.clearTimeout(id);
-  }, [open, mounted, exitDuration]);
-  const onExitEnd = React22.useCallback((event) => {
-    if (event.target !== event.currentTarget) return;
-    if (!openRef.current) setMounted(false);
-  }, []);
-  return { mounted: open || mounted, state: open ? "open" : "closed", onExitEnd };
+  return { onPointerDown: onPointerDown2 };
 }
 
 // src/internal/overlay/useFloatingLayer.ts
@@ -2416,32 +3187,44 @@ function useFloatingLayer({
   tabExit = "none",
   exitDuration = "fast",
   skipExit = false,
+  sheet: sheetOption = false,
   ...positionOptions
 }) {
-  const presence = usePresence(open, { exitDuration });
+  const sheet = useMediaQuery(COMPACT_QUERY, sheetOption);
+  const presence = usePresence(open, { exitDuration: sheet ? "base" : exitDuration });
   const mounted = presence.mounted && (open || !skipExit);
-  const contentRef = React23.useRef(null);
-  const position = usePosition(mounted, triggerRef, contentRef, positionOptions);
-  const [panel, setPanel] = React23.useState(null);
+  const contentRef = React31.useRef(null);
+  const position = usePosition(mounted && !sheet, triggerRef, contentRef, positionOptions);
+  useScrollLock(open && sheet);
+  const [panel, setPanel] = React31.useState(null);
   const { attachLayer } = position;
-  const panelRef = React23.useCallback(
+  const panelRef = React31.useCallback(
     (node) => {
       attachLayer(node);
       setPanel(node);
     },
     [attachLayer]
   );
-  const outsideRef = React23.useRef(false);
-  const close = React23.useCallback(() => {
+  const outsideRef = React31.useRef(false);
+  const close = React31.useCallback(() => {
     outsideRef.current = false;
     onOpenChange(false);
   }, [onOpenChange]);
+  const dismissOutside = React31.useCallback(() => {
+    outsideRef.current = true;
+    onOpenChange(false);
+  }, [onOpenChange]);
+  const swipe = useSwipeDismiss({
+    enabled: sheet && open && closeOnOutsideClick,
+    direction: "down",
+    onDismiss: dismissOutside,
+    handle: "[data-swipe-handle]"
+  });
   const onDismiss = (reason) => {
     if (reason === "escape") {
       if (closeOnEscape) close();
     } else if (closeOnOutsideClick) {
-      outsideRef.current = true;
-      onOpenChange(false);
+      dismissOutside();
     }
   };
   const layer = useLayer(open, {
@@ -2451,7 +3234,7 @@ function useFloatingLayer({
     onDismiss
   });
   const passive = dismiss === "none";
-  React23.useEffect(() => {
+  React31.useEffect(() => {
     if (!open || !panel || passive) return;
     outsideRef.current = false;
     if (focusOnOpen) focusInto(panel);
@@ -2482,6 +3265,8 @@ function useFloatingLayer({
     presence,
     mounted,
     side: position.side,
+    sheet,
+    onSheetPointerDown: swipe.onPointerDown,
     panelRef,
     contentRef,
     layer,
@@ -2510,15 +3295,14 @@ var Select_default = {
   itemTitle: "Select_itemTitle",
   itemDescription: "Select_itemDescription",
   itemMeta: "Select_itemMeta",
-  media: "Select_media",
-  check: "Select_check"
+  media: "Select_media"
 };
 
 // src/components/select/SelectItem.tsx
-import * as React25 from "react";
+import * as React33 from "react";
 
 // src/internal/HighlightMatch.tsx
-import * as React24 from "react";
+import * as React32 from "react";
 
 // src/internal/HighlightMatch.module.css
 var HighlightMatch_default = {
@@ -2526,7 +3310,7 @@ var HighlightMatch_default = {
 };
 
 // src/internal/HighlightMatch.tsx
-import { Fragment as Fragment4, jsx as jsx22, jsxs as jsxs10 } from "react/jsx-runtime";
+import { Fragment as Fragment8, jsx as jsx26, jsxs as jsxs15 } from "react/jsx-runtime";
 function matchIndex(text, query) {
   if (!query) return -1;
   return text.toLowerCase().indexOf(query.toLowerCase());
@@ -2534,18 +3318,18 @@ function matchIndex(text, query) {
 function HighlightMatch({ text, query }) {
   const q = query.trim();
   const at = matchIndex(text, q);
-  if (at < 0) return /* @__PURE__ */ jsx22(Fragment4, { children: text });
-  return /* @__PURE__ */ jsxs10("span", { children: [
+  if (at < 0) return /* @__PURE__ */ jsx26(Fragment8, { children: text });
+  return /* @__PURE__ */ jsxs15("span", { children: [
     text.slice(0, at),
-    /* @__PURE__ */ jsx22("mark", { className: HighlightMatch_default.match, children: text.slice(at, at + q.length) }),
+    /* @__PURE__ */ jsx26("mark", { className: HighlightMatch_default.match, children: text.slice(at, at + q.length) }),
     text.slice(at + q.length)
   ] });
 }
 function highlightChildren(children, query) {
   if (!query.trim()) return children;
-  return React24.Children.map(
+  return React32.Children.map(
     children,
-    (child) => typeof child === "string" || typeof child === "number" ? /* @__PURE__ */ jsx22(HighlightMatch, { text: String(child), query }) : child
+    (child) => typeof child === "string" || typeof child === "number" ? /* @__PURE__ */ jsx26(HighlightMatch, { text: String(child), query }) : child
   );
 }
 
@@ -2579,24 +3363,24 @@ function createItemRegistry() {
 var [SelectProvider, useSelectContext] = createComponentContext("Select");
 
 // src/components/select/SelectItem.tsx
-import { jsx as jsx23, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx27, jsxs as jsxs16 } from "react/jsx-runtime";
 var MEDIA_SIZE = { xs: "xs", s: "xs", m: "s", l: "s", xl: "m" };
 function textOf(node) {
   if (node == null || typeof node === "boolean") return "";
   if (typeof node === "string" || typeof node === "number") return String(node);
   if (Array.isArray(node)) return node.map(textOf).join("");
-  if (React25.isValidElement(node))
+  if (React33.isValidElement(node))
     return textOf(node.props.children);
   return "";
 }
 function SelectItemIcon({ className, ...rest }) {
-  return /* @__PURE__ */ jsx23("span", { "aria-hidden": "true", className: cx(menu_default.itemIcon, className), ...rest });
+  return /* @__PURE__ */ jsx27("span", { "aria-hidden": "true", className: cx(menu_default.itemIcon, className), ...rest });
 }
 SelectItemIcon.displayName = "Select.ItemIcon";
-var OptionQueryContext = React25.createContext("");
+var OptionQueryContext = React33.createContext("");
 function SelectItemText({ children, className, ...rest }) {
-  const query = React25.useContext(OptionQueryContext);
-  return /* @__PURE__ */ jsx23("span", { ...rest, className: cx(Select_default.itemTitle, className), children: highlightChildren(children, query) });
+  const query = React33.useContext(OptionQueryContext);
+  return /* @__PURE__ */ jsx27("span", { ...rest, className: cx(Select_default.itemTitle, className), children: highlightChildren(children, query) });
 }
 SelectItemText.displayName = "Select.ItemText";
 function SelectItemDescription({
@@ -2604,12 +3388,12 @@ function SelectItemDescription({
   className,
   ...rest
 }) {
-  const query = React25.useContext(OptionQueryContext);
-  return /* @__PURE__ */ jsx23("span", { ...rest, className: cx(Select_default.itemDescription, className), children: highlightChildren(children, query) });
+  const query = React33.useContext(OptionQueryContext);
+  return /* @__PURE__ */ jsx27("span", { ...rest, className: cx(Select_default.itemDescription, className), children: highlightChildren(children, query) });
 }
 SelectItemDescription.displayName = "Select.ItemDescription";
 function SelectItemMeta({ children, className, ...rest }) {
-  return /* @__PURE__ */ jsx23("span", { ...rest, className: cx(Select_default.itemMeta, className), children });
+  return /* @__PURE__ */ jsx27("span", { ...rest, className: cx(Select_default.itemMeta, className), children });
 }
 SelectItemMeta.displayName = "Select.ItemMeta";
 function splitItemChildren(children) {
@@ -2622,11 +3406,11 @@ function splitItemChildren(children) {
     description: ""
   };
   let plain = "";
-  for (const child of React25.Children.toArray(children)) {
-    if (!React25.isValidElement(child)) {
+  for (const child of React33.Children.toArray(children)) {
+    if (!React33.isValidElement(child)) {
       plain += textOf(child);
       parts.body.push(child);
-    } else if (child.type === React25.Fragment) {
+    } else if (child.type === React33.Fragment) {
       const inner = splitItemChildren(child.props.children);
       parts.leading.push(...inner.leading);
       parts.body.push(...inner.body);
@@ -2656,7 +3440,7 @@ function splitItemChildren(children) {
 }
 function sizeMedia(leading, size) {
   return leading.map(
-    (node) => React25.isValidElement(node) && node.type === Thumbnail.Root ? React25.cloneElement(node, {
+    (node) => React33.isValidElement(node) && node.type === Thumbnail.Root ? React33.cloneElement(node, {
       size: node.props.size ?? MEDIA_SIZE[size],
       className: cx(Select_default.media, node.props.className),
       "aria-hidden": true
@@ -2678,7 +3462,7 @@ function SelectItem({
   const haystack = normalize(`${resolvedLabel} ${parts.description} ${keywords ?? ""}`);
   const isSelected = selected.includes(value);
   const isHighlighted = useStoreSlice(highlight, (current) => current === value);
-  React25.useLayoutEffect(
+  React33.useLayoutEffect(
     () => registry.register(value, resolvedLabel, haystack),
     [registry, value, resolvedLabel, haystack]
   );
@@ -2687,7 +3471,7 @@ function SelectItem({
   return (
     // biome-ignore lint/a11y/useFocusableInteractive: focus stays on the listbox / search (aria-activedescendant)
     // biome-ignore lint/a11y/useKeyWithClickEvents: the keyboard is handled on the listbox
-    /* @__PURE__ */ jsxs11(
+    /* @__PURE__ */ jsxs16(
       "div",
       {
         ref,
@@ -2711,11 +3495,11 @@ function SelectItem({
           rich: parts.rich || void 0
         }),
         children: [
-          multiple ? /* @__PURE__ */ jsx23(Checkbox.Indicator, { checked: isSelected, disabled, size: stepDown(size) }) : null,
+          multiple ? /* @__PURE__ */ jsx27(Checkbox.Indicator, { checked: isSelected, disabled, size: stepDown(size) }) : null,
           sizeMedia(parts.leading, size),
-          /* @__PURE__ */ jsx23("span", { className: Select_default.itemText, children: /* @__PURE__ */ jsx23(OptionQueryContext.Provider, { value: query, children: highlightChildren(parts.body, query) }) }),
+          /* @__PURE__ */ jsx27("span", { className: Select_default.itemText, children: /* @__PURE__ */ jsx27(OptionQueryContext.Provider, { value: query, children: highlightChildren(parts.body, query) }) }),
           parts.meta,
-          multiple ? null : /* @__PURE__ */ jsx23("span", { className: Select_default.check, "aria-hidden": "true", children: isSelected ? /* @__PURE__ */ jsx23(Icon, { name: "action.check" }) : null })
+          multiple ? null : /* @__PURE__ */ jsx27("span", { className: menu_default.check, "aria-hidden": "true", children: isSelected ? /* @__PURE__ */ jsx27(Icon, { name: "action.check" }) : null })
         ]
       }
     )
@@ -2724,7 +3508,7 @@ function SelectItem({
 SelectItem.displayName = "Select.Item";
 
 // src/components/select/Select.tsx
-import { jsx as jsx24, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx28, jsxs as jsxs17 } from "react/jsx-runtime";
 var SELECT_LABELS = {
   search: "\u041F\u043E\u0438\u0441\u043A",
   empty: "\u041D\u0438\u0447\u0435\u0433\u043E \u043D\u0435 \u043D\u0430\u0439\u0434\u0435\u043D\u043E",
@@ -2761,14 +3545,14 @@ function SelectRoot(props) {
     ...rest
   } = props;
   const multiple = props.multiple === true;
-  const labels = React26.useMemo(() => ({ ...SELECT_LABELS, ...labelsProp }), [labelsProp]);
+  const labels = React34.useMemo(() => ({ ...SELECT_LABELS, ...labelsProp }), [labelsProp]);
   const ids = useFieldFrame(id, { hint, error, invalid });
   const [value, setValue] = useControllableState({
     value: props.value,
     defaultValue: props.defaultValue ?? (multiple ? [] : void 0),
     onChange: props.onValueChange
   });
-  const selected = React26.useMemo(
+  const selected = React34.useMemo(
     () => Array.isArray(value) ? value : value ? [value] : [],
     [value]
   );
@@ -2778,11 +3562,11 @@ function SelectRoot(props) {
     onChange: onOpenChange
   });
   const highlight = useCreateStore(void 0);
-  const [registry] = React26.useState(createItemRegistry);
-  const [query, setQuery] = React26.useState("");
-  const triggerRef = React26.useRef(null);
+  const [registry] = React34.useState(createItemRegistry);
+  const [query, setQuery] = React34.useState("");
+  const triggerRef = React34.useRef(null);
   if (!isOpen && query !== "") setQuery("");
-  const pick = React26.useCallback(
+  const pick = React34.useCallback(
     (optionValue) => {
       if (multiple) {
         setValue((prev) => {
@@ -2796,8 +3580,8 @@ function SelectRoot(props) {
     },
     [multiple, setValue, setOpen]
   );
-  const clear = React26.useCallback(() => setValue(multiple ? [] : ""), [multiple, setValue]);
-  const context = React26.useMemo(
+  const clear = React34.useCallback(() => setValue(multiple ? [] : ""), [multiple, setValue]);
+  const context = React34.useMemo(
     () => ({
       size,
       invalid: ids.invalid,
@@ -2846,7 +3630,7 @@ function SelectRoot(props) {
       labels
     ]
   );
-  return /* @__PURE__ */ jsx24(
+  return /* @__PURE__ */ jsx28(
     FieldFrame,
     {
       ...rest,
@@ -2860,7 +3644,7 @@ function SelectRoot(props) {
       disabled,
       optionalLabel: labels.optional,
       className,
-      children: /* @__PURE__ */ jsx24(SelectProvider, { value: context, children: /* @__PURE__ */ jsx24(ControlSizeProvider, { value: size, children }) })
+      children: /* @__PURE__ */ jsx28(SelectProvider, { value: context, children: /* @__PURE__ */ jsx28(ControlSizeProvider, { value: size, children }) })
     }
   );
 }
@@ -2894,7 +3678,7 @@ function SelectTrigger({
   } = useSelectContext();
   const mergedRef = useMergedRefs(triggerRef, ref);
   const showClear = clearable && selected.length > 0 && !disabled && !loading;
-  return /* @__PURE__ */ jsxs12(
+  return /* @__PURE__ */ jsxs17(
     "button",
     {
       ...rest,
@@ -2935,11 +3719,11 @@ function SelectTrigger({
         "focus-ring": focusRing ? void 0 : false
       }),
       children: [
-        /* @__PURE__ */ jsx24("span", { className: Select_default.triggerMain, children }),
+        /* @__PURE__ */ jsx28("span", { className: Select_default.triggerMain, children }),
         showClear ? (
           // A segment, not a button: interactive content inside a <button> is invalid. The keyboard
           // clears with Delete / Backspace on the trigger.
-          /* @__PURE__ */ jsx24(
+          /* @__PURE__ */ jsx28(
             "span",
             {
               className: Select_default.clear,
@@ -2951,11 +3735,11 @@ function SelectTrigger({
                 event.stopPropagation();
                 clear();
               },
-              children: /* @__PURE__ */ jsx24(Icon, { name: "action.close" })
+              children: /* @__PURE__ */ jsx28(Icon, { name: "action.close" })
             }
           )
         ) : null,
-        /* @__PURE__ */ jsx24("span", { className: Select_default.chevron, "aria-hidden": "true", children: loading ? /* @__PURE__ */ jsx24(Spinner, { "aria-hidden": "true" }) : /* @__PURE__ */ jsx24(Icon, { name: "nav.chevronDown" }) })
+        /* @__PURE__ */ jsx28("span", { className: Select_default.chevron, "aria-hidden": "true", children: loading ? /* @__PURE__ */ jsx28(Spinner, { "aria-hidden": "true" }) : /* @__PURE__ */ jsx28(Icon, { name: "nav.chevronDown" }) })
       ]
     }
   );
@@ -2967,7 +3751,7 @@ function SelectValue({ renderValue, className, ...rest }) {
   if (selected.length > 0 && renderValue && !multiple) {
     const value = selected[0] ?? "";
     const parts = splitItemChildren(renderValue({ value, label: text }));
-    return /* @__PURE__ */ jsxs12(
+    return /* @__PURE__ */ jsxs17(
       "span",
       {
         ...rest,
@@ -2975,12 +3759,12 @@ function SelectValue({ renderValue, className, ...rest }) {
         ...toDataAttributes({ rich: parts.rich || void 0 }),
         children: [
           sizeMedia(parts.leading, size),
-          /* @__PURE__ */ jsx24("span", { className: Select_default.valueBody, children: parts.body })
+          /* @__PURE__ */ jsx28("span", { className: Select_default.valueBody, children: parts.body })
         ]
       }
     );
   }
-  return /* @__PURE__ */ jsx24(
+  return /* @__PURE__ */ jsx28(
     "span",
     {
       ...rest,
@@ -2992,7 +3776,7 @@ function SelectValue({ renderValue, className, ...rest }) {
 }
 SelectValue.displayName = "Select.Value";
 function SelectTriggerIcon({ className, ...rest }) {
-  return /* @__PURE__ */ jsx24("span", { "aria-hidden": "true", className: cx(Select_default.triggerIcon, className), ...rest });
+  return /* @__PURE__ */ jsx28("span", { "aria-hidden": "true", className: cx(Select_default.triggerIcon, className), ...rest });
 }
 SelectTriggerIcon.displayName = "Select.TriggerIcon";
 function SelectContent({ searchable = false, className, children, ...rest }) {
@@ -3012,7 +3796,7 @@ function SelectContent({ searchable = false, className, children, ...rest }) {
     labels,
     registry
   } = useSelectContext();
-  const listboxRef = React26.useRef(null);
+  const listboxRef = React34.useRef(null);
   const floating = useFloatingLayer({
     open: isOpen,
     onOpenChange: setOpen,
@@ -3021,7 +3805,8 @@ function SelectContent({ searchable = false, className, children, ...rest }) {
     align: "start",
     matchAnchorWidth: true,
     focusOnOpen: true,
-    tabExit: "always"
+    tabExit: "always",
+    sheet: true
   });
   const highlighted = useStoreSlice(highlight, (value) => value);
   const isEmpty = useStoreSlice(registry.version, () => !registry.anyMatch(normalize(query)));
@@ -3042,9 +3827,9 @@ function SelectContent({ searchable = false, className, children, ...rest }) {
     }
     handleListboxKeyDown(event, { items, highlight, onSelect: pick });
   };
-  if (!floating.mounted) return /* @__PURE__ */ jsx24("div", { hidden: true, children });
+  if (!floating.mounted) return /* @__PURE__ */ jsx28("div", { hidden: true, children });
   const activeDescendant = isOpen && highlighted !== void 0 ? optionDomId(listboxId, highlighted) : void 0;
-  return /* @__PURE__ */ jsxs12(
+  return /* @__PURE__ */ jsxs17(
     FloatingPanel,
     {
       ...rest,
@@ -3056,9 +3841,9 @@ function SelectContent({ searchable = false, className, children, ...rest }) {
       children: [
         searchable ? (
           // The permanent focus of the panel: no ring, the caret is the indicator (foundation §7).
-          /* @__PURE__ */ jsxs12("div", { className: cx(menu_default.searchRow, Select_default.search), "data-focus-ring": "false", children: [
-            /* @__PURE__ */ jsx24(Icon, { name: "action.search", size: "s" }),
-            /* @__PURE__ */ jsx24(
+          /* @__PURE__ */ jsxs17("div", { className: cx(menu_default.searchRow, Select_default.search), "data-focus-ring": "false", children: [
+            /* @__PURE__ */ jsx28(Icon, { name: "action.search", size: "s" }),
+            /* @__PURE__ */ jsx28(
               "input",
               {
                 type: "text",
@@ -3077,11 +3862,11 @@ function SelectContent({ searchable = false, className, children, ...rest }) {
             )
           ] })
         ) : null,
-        loading ? /* @__PURE__ */ jsxs12("div", { className: Select_default.status, role: "status", children: [
-          /* @__PURE__ */ jsx24(Spinner, { "aria-hidden": "true" }),
+        loading ? /* @__PURE__ */ jsxs17("div", { className: Select_default.status, role: "status", children: [
+          /* @__PURE__ */ jsx28(Spinner, { "aria-hidden": "true" }),
           labels.loading
         ] }) : null,
-        /* @__PURE__ */ jsx24(
+        /* @__PURE__ */ jsx28(
           ScrollContainer,
           {
             ref: listboxRef,
@@ -3097,11 +3882,11 @@ function SelectContent({ searchable = false, className, children, ...rest }) {
             children
           }
         ),
-        isEmpty && !loading ? /* @__PURE__ */ jsxs12(EmptyPage.Root, { layout: "compact", role: "status", children: [
-          /* @__PURE__ */ jsx24(EmptyPage.Title, { as: "p", children: labels.empty }),
-          query !== "" && labels.emptyHint ? /* @__PURE__ */ jsx24(EmptyPage.Description, { children: labels.emptyHint }) : null
+        isEmpty && !loading ? /* @__PURE__ */ jsxs17(EmptyPage.Root, { layout: "compact", role: "status", children: [
+          /* @__PURE__ */ jsx28(EmptyPage.Title, { as: "p", children: labels.empty }),
+          query !== "" && labels.emptyHint ? /* @__PURE__ */ jsx28(EmptyPage.Description, { children: labels.emptyHint }) : null
         ] }) : null,
-        /* @__PURE__ */ jsx24(HighlightOnOpen, { listboxRef, highlight })
+        /* @__PURE__ */ jsx28(HighlightOnOpen, { listboxRef, highlight })
       ]
     }
   );
@@ -3112,9 +3897,9 @@ function HighlightOnOpen({
   highlight
 }) {
   const { isOpen, query, selected } = useSelectContext();
-  const selectedRef = React26.useRef(selected);
+  const selectedRef = React34.useRef(selected);
   selectedRef.current = selected;
-  React26.useLayoutEffect(() => {
+  React34.useLayoutEffect(() => {
     if (!isOpen) return;
     const options = enabledOptions(listboxRef.current);
     const first = options.find((item) => selectedRef.current.includes(item.dataset.value ?? ""));
@@ -3122,17 +3907,17 @@ function HighlightOnOpen({
     first?.scrollIntoView?.({ block: "nearest" });
     return () => highlight.set(void 0);
   }, [isOpen, listboxRef, highlight]);
-  React26.useLayoutEffect(() => {
+  React34.useLayoutEffect(() => {
     if (query !== "") highlight.set(enabledOptions(listboxRef.current)[0]?.dataset.value);
   }, [query, listboxRef, highlight]);
   return null;
 }
 function SelectGroup({ className, ...rest }) {
-  return /* @__PURE__ */ jsx24(MenuGroup, { ...rest, className: cx(Select_default.group, className) });
+  return /* @__PURE__ */ jsx28(MenuGroup, { ...rest, className: cx(Select_default.group, className) });
 }
 SelectGroup.displayName = "Select.Group";
 function SelectSeparator({ className, ...rest }) {
-  return /* @__PURE__ */ jsx24(Divider, { ...rest, className: cx(menu_default.separator, Select_default.separator, className) });
+  return /* @__PURE__ */ jsx28(Divider, { ...rest, className: cx(menu_default.separator, Select_default.separator, className) });
 }
 SelectSeparator.displayName = "Select.Separator";
 var Select = {
@@ -3154,28 +3939,40 @@ export {
   ControlSizeProvider,
   useOptionalControlSize,
   useControlSize,
-  useMergedRefs,
   cx,
   toDataAttributes,
-  ScrollContainer,
-  createComponentContext,
-  createImageSlot,
-  palette_default,
-  textTone_default,
-  Icon,
-  createIcon,
   fieldSurfaceClass,
   fieldTierClass,
   fieldTriggerClass,
   iconLayout,
-  Slot,
+  prefersReducedMotion,
+  motionDurationMs,
+  exitTimeoutMs,
+  usePresence,
   visuallyHiddenClass,
   VisuallyHidden,
+  useMergedRefs,
+  Slot,
+  touchTargetBlockClass,
+  textTone_default,
   Spinner,
   Button,
+  Divider,
+  Icon,
+  createIcon,
+  useEdgeOverflow,
+  ScrollContainer,
+  palette_default,
+  RollingNumber,
+  createComponentContext,
+  createImageSlot,
   useControllableState,
   overlayMotion_default,
   Portal,
+  sheet_default,
+  useNestedSurfaceDepth,
+  SurfaceDepthProvider,
+  useStageDepth,
   focusInto,
   focusBack,
   activeElement,
@@ -3183,13 +3980,13 @@ export {
   useLayer,
   FloatingPanel,
   FloatingTrigger,
+  COMPACT_QUERY,
+  useMediaQuery,
   AnchorRectProvider,
   readCssLengthPx,
   getViewportPadPx,
-  prefersReducedMotion,
-  motionDurationMs,
-  exitTimeoutMs,
-  usePresence,
+  useScrollLock,
+  useSwipeDismiss,
   useFloatingLayer,
   rovingIndex,
   gridIndex,
@@ -3232,7 +4029,11 @@ export {
   handleListboxKeyDown,
   menu_default,
   MenuGroup,
-  Divider,
+  resolveValue,
+  DEFAULT_PROGRESS_SEGMENTS_LABELS,
+  resolveSegments,
+  ProgressBar,
+  getPasswordStrength,
   Input,
   Thumbnail,
   Select