prime-ui-kit 0.21.3 → 0.21.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (30) hide show
  1. package/dist/chunks/{chunk-JO7E6SZQ.js → chunk-PFASPQSJ.js} +365 -337
  2. package/dist/chunks/{chunk-R5LI5BO3.js → chunk-UNNQITFE.js} +11 -6
  3. package/dist/chunks/{chunk-BAJRN3QN.js → chunk-WGXXPJDR.js} +4 -1
  4. package/dist/color-picker.js +2 -2
  5. package/dist/components/input/Input.d.ts +1 -1
  6. package/dist/components/login-form/LoginForm.d.ts +5 -1
  7. package/dist/components/textarea/Textarea.d.ts +1 -1
  8. package/dist/index.js +2 -2
  9. package/dist/internal/autofill.d.ts +30 -0
  10. package/dist/skill/checklist.md +2 -0
  11. package/dist/skill/reference/components/button/examples/in-form.tsx +0 -1
  12. package/dist/skill/reference/components/drawer/examples/screen.tsx +1 -5
  13. package/dist/skill/reference/components/input/COMPONENT.md +3 -0
  14. package/dist/skill/reference/components/input/examples/in-form.tsx +0 -1
  15. package/dist/skill/reference/components/input/examples/validation.tsx +1 -1
  16. package/dist/skill/reference/components/login-form/COMPONENT.md +2 -2
  17. package/dist/skill/reference/components/login-form/examples/sizes.tsx +6 -2
  18. package/dist/skill/reference/components/tabs/examples/orientation.tsx +1 -1
  19. package/dist/skill/reference/components/textarea/COMPONENT.md +2 -0
  20. package/dist/skill/ux.md +19 -2
  21. package/package.json +1 -1
  22. package/src/components/button/examples/in-form.tsx +0 -1
  23. package/src/components/drawer/examples/screen.tsx +1 -5
  24. package/src/components/input/COMPONENT.md +3 -0
  25. package/src/components/input/examples/in-form.tsx +0 -1
  26. package/src/components/input/examples/validation.tsx +1 -1
  27. package/src/components/login-form/COMPONENT.md +2 -2
  28. package/src/components/login-form/examples/sizes.tsx +6 -2
  29. package/src/components/tabs/examples/orientation.tsx +1 -1
  30. package/src/components/textarea/COMPONENT.md +2 -0
@@ -5283,10 +5283,31 @@ function getPasswordStrength(value) {
5283
5283
  }
5284
5284
 
5285
5285
  // src/components/input/Input.tsx
5286
- import * as React51 from "react";
5286
+ import * as React52 from "react";
5287
5287
 
5288
- // src/internal/FieldAction.tsx
5288
+ // src/internal/autofill.tsx
5289
5289
  import * as React44 from "react";
5290
+ import { jsx as jsx24 } from "react/jsx-runtime";
5291
+ var AUTOFILL_OFF = {
5292
+ autoComplete: "off",
5293
+ "data-1p-ignore": "true",
5294
+ "data-lpignore": "true",
5295
+ "data-bwignore": "true",
5296
+ "data-form-type": "other"
5297
+ };
5298
+ var AutofillContext = React44.createContext(false);
5299
+ function AutofillScope({ children }) {
5300
+ return /* @__PURE__ */ jsx24(AutofillContext.Provider, { value: true, children });
5301
+ }
5302
+ function useAutofill(autoComplete) {
5303
+ const scoped = React44.useContext(AutofillContext);
5304
+ if (autoComplete && autoComplete !== "off") return { autoComplete };
5305
+ if (scoped && !autoComplete) return {};
5306
+ return AUTOFILL_OFF;
5307
+ }
5308
+
5309
+ // src/internal/FieldAction.tsx
5310
+ import * as React45 from "react";
5290
5311
 
5291
5312
  // src/internal/FieldAction.module.css
5292
5313
  var FieldAction_default = {
@@ -5294,7 +5315,7 @@ var FieldAction_default = {
5294
5315
  };
5295
5316
 
5296
5317
  // src/internal/FieldAction.tsx
5297
- import { Fragment as Fragment7, jsx as jsx24, jsxs as jsxs13 } from "react/jsx-runtime";
5318
+ import { Fragment as Fragment7, jsx as jsx25, jsxs as jsxs13 } from "react/jsx-runtime";
5298
5319
  var fieldActionClass = cx(FieldAction_default.action, touchTargetBlockClass);
5299
5320
  function FieldActionButton({
5300
5321
  label,
@@ -5313,17 +5334,17 @@ function FieldActionButton({
5313
5334
  "aria-label": label,
5314
5335
  "data-field-action": ""
5315
5336
  };
5316
- const segment = asChild ? /* @__PURE__ */ jsx24(Slot, { ...shared, ref, "aria-disabled": disabled || void 0, children }) : /* @__PURE__ */ jsx24("button", { ...shared, ref, type, disabled, children: /* @__PURE__ */ jsx24(GlyphSwap, { children }) });
5337
+ const segment = asChild ? /* @__PURE__ */ jsx25(Slot, { ...shared, ref, "aria-disabled": disabled || void 0, children }) : /* @__PURE__ */ jsx25("button", { ...shared, ref, type, disabled, children: /* @__PURE__ */ jsx25(GlyphSwap, { children }) });
5317
5338
  if (!tooltip) return segment;
5318
5339
  return /* @__PURE__ */ jsxs13(Tooltip.Root, { children: [
5319
- /* @__PURE__ */ jsx24(Tooltip.Trigger, { children: segment }),
5320
- /* @__PURE__ */ jsx24(Tooltip.Content, { children: label })
5340
+ /* @__PURE__ */ jsx25(Tooltip.Trigger, { children: segment }),
5341
+ /* @__PURE__ */ jsx25(Tooltip.Content, { children: label })
5321
5342
  ] });
5322
5343
  }
5323
5344
  var COPY_FEEDBACK_MS = 1600;
5324
5345
  function FieldCopyButton({ getText, labels, onClick: onClick2, ...rest }) {
5325
- const [state, setState] = React44.useState("idle");
5326
- React44.useEffect(() => {
5346
+ const [state, setState] = React45.useState("idle");
5347
+ React45.useEffect(() => {
5327
5348
  if (state === "idle") return;
5328
5349
  const timer = window.setTimeout(() => setState("idle"), COPY_FEEDBACK_MS);
5329
5350
  return () => window.clearTimeout(timer);
@@ -5331,7 +5352,7 @@ function FieldCopyButton({ getText, labels, onClick: onClick2, ...rest }) {
5331
5352
  const label = state === "copied" ? labels.copied : state === "error" ? labels.copyError : labels.copy;
5332
5353
  const glyph = state === "copied" ? "action.check" : "action.copy";
5333
5354
  return /* @__PURE__ */ jsxs13(Fragment7, { children: [
5334
- /* @__PURE__ */ jsx24(
5355
+ /* @__PURE__ */ jsx25(
5335
5356
  FieldActionButton,
5336
5357
  {
5337
5358
  ...rest,
@@ -5347,15 +5368,15 @@ function FieldCopyButton({ getText, labels, onClick: onClick2, ...rest }) {
5347
5368
  setState("error");
5348
5369
  }
5349
5370
  },
5350
- children: /* @__PURE__ */ jsx24(Icon, { name: glyph })
5371
+ children: /* @__PURE__ */ jsx25(Icon, { name: glyph })
5351
5372
  }
5352
5373
  ),
5353
- /* @__PURE__ */ jsx24(VisuallyHidden, { live: "polite", children: state === "idle" ? "" : label })
5374
+ /* @__PURE__ */ jsx25(VisuallyHidden, { live: "polite", children: state === "idle" ? "" : label })
5354
5375
  ] });
5355
5376
  }
5356
5377
 
5357
5378
  // src/internal/FieldCommit.tsx
5358
- import * as React45 from "react";
5379
+ import * as React46 from "react";
5359
5380
 
5360
5381
  // src/internal/controlValue.ts
5361
5382
  function setControlValue(control, value) {
@@ -5370,36 +5391,36 @@ var FieldCommit_default = {
5370
5391
  };
5371
5392
 
5372
5393
  // src/internal/FieldCommit.tsx
5373
- import { Fragment as Fragment8, jsx as jsx25, jsxs as jsxs14 } from "react/jsx-runtime";
5394
+ import { Fragment as Fragment8, jsx as jsx26, jsxs as jsxs14 } from "react/jsx-runtime";
5374
5395
  var SAVED_MS = 1600;
5375
5396
  function useFieldCommit(controlRef, onCommit) {
5376
- const [state, setState] = React45.useState("idle");
5377
- const committed = React45.useRef(null);
5378
- const started = React45.useRef(0);
5379
- const settled = React45.useRef(0);
5380
- const pending2 = React45.useRef(0);
5381
- const onCommitRef = React45.useRef(onCommit);
5397
+ const [state, setState] = React46.useState("idle");
5398
+ const committed = React46.useRef(null);
5399
+ const started = React46.useRef(0);
5400
+ const settled = React46.useRef(0);
5401
+ const pending2 = React46.useRef(0);
5402
+ const onCommitRef = React46.useRef(onCommit);
5382
5403
  onCommitRef.current = onCommit;
5383
- React45.useLayoutEffect(() => {
5404
+ React46.useLayoutEffect(() => {
5384
5405
  if (committed.current === null && controlRef.current) {
5385
5406
  committed.current = controlRef.current.value;
5386
5407
  }
5387
5408
  }, [controlRef]);
5388
- React45.useEffect(() => {
5409
+ React46.useEffect(() => {
5389
5410
  if (state !== "saved") return;
5390
5411
  const timer = window.setTimeout(() => setState("idle"), SAVED_MS);
5391
5412
  return () => window.clearTimeout(timer);
5392
5413
  }, [state]);
5393
- const sync = React45.useCallback(() => {
5414
+ const sync = React46.useCallback(() => {
5394
5415
  if (pending2.current === 0 && controlRef.current) committed.current = controlRef.current.value;
5395
5416
  }, [controlRef]);
5396
- const revert = React45.useCallback(() => {
5417
+ const revert = React46.useCallback(() => {
5397
5418
  const control = controlRef.current;
5398
5419
  if (!control || committed.current === null || control.value === committed.current) return false;
5399
5420
  setControlValue(control, committed.current);
5400
5421
  return true;
5401
5422
  }, [controlRef]);
5402
- const commit = React45.useCallback(() => {
5423
+ const commit = React46.useCallback(() => {
5403
5424
  const control = controlRef.current;
5404
5425
  const handler = onCommitRef.current;
5405
5426
  if (!control || !handler) return;
@@ -5453,11 +5474,11 @@ function FieldCommitStatus({
5453
5474
  }) {
5454
5475
  const shown = state !== "idle";
5455
5476
  const presence = usePresence(shown, { exitDuration: "fast" });
5456
- const last = React45.useRef(state);
5477
+ const last = React46.useRef(state);
5457
5478
  if (shown) last.current = state;
5458
5479
  const glyph = shown ? state : last.current;
5459
5480
  return /* @__PURE__ */ jsxs14(Fragment8, { children: [
5460
- presence.mounted ? /* @__PURE__ */ jsx25(
5481
+ presence.mounted ? /* @__PURE__ */ jsx26(
5461
5482
  "span",
5462
5483
  {
5463
5484
  className: cx(
@@ -5468,21 +5489,21 @@ function FieldCommitStatus({
5468
5489
  "data-commit": glyph,
5469
5490
  "aria-hidden": "true",
5470
5491
  onAnimationEnd: presence.onExitEnd,
5471
- children: /* @__PURE__ */ jsx25(GlyphSwap, { children: glyph === "saved" ? /* @__PURE__ */ jsx25(Icon, { name: "action.check" }) : /* @__PURE__ */ jsx25(Spinner, { "aria-hidden": "true" }) })
5492
+ children: /* @__PURE__ */ jsx26(GlyphSwap, { children: glyph === "saved" ? /* @__PURE__ */ jsx26(Icon, { name: "action.check" }) : /* @__PURE__ */ jsx26(Spinner, { "aria-hidden": "true" }) })
5472
5493
  }
5473
5494
  ) : null,
5474
- /* @__PURE__ */ jsx25(VisuallyHidden, { live: "polite", children: state === "pending" ? labels.saving : state === "saved" ? labels.saved : "" })
5495
+ /* @__PURE__ */ jsx26(VisuallyHidden, { live: "polite", children: state === "pending" ? labels.saving : state === "saved" ? labels.saved : "" })
5475
5496
  ] });
5476
5497
  }
5477
5498
 
5478
5499
  // src/internal/FieldFrame.tsx
5479
- import * as React47 from "react";
5500
+ import * as React48 from "react";
5480
5501
 
5481
5502
  // src/internal/fieldCell.ts
5482
- import * as React46 from "react";
5483
- var FieldCellContext = React46.createContext(null);
5503
+ import * as React47 from "react";
5504
+ var FieldCellContext = React47.createContext(null);
5484
5505
  function useFieldCell() {
5485
- return React46.useContext(FieldCellContext);
5506
+ return React47.useContext(FieldCellContext);
5486
5507
  }
5487
5508
 
5488
5509
  // src/internal/FieldFrame.module.css
@@ -5500,7 +5521,7 @@ var FieldFrame_default = {
5500
5521
  };
5501
5522
 
5502
5523
  // src/internal/FieldFrame.tsx
5503
- import { jsx as jsx26, jsxs as jsxs15 } from "react/jsx-runtime";
5524
+ import { jsx as jsx27, jsxs as jsxs15 } from "react/jsx-runtime";
5504
5525
  var REQUIRED_ROLES = /* @__PURE__ */ new Set([
5505
5526
  "checkbox",
5506
5527
  "combobox",
@@ -5519,7 +5540,7 @@ function useFieldFrame(explicitId, {
5519
5540
  invalid,
5520
5541
  required
5521
5542
  }, ariaDescribedBy) {
5522
- const generated = React47.useId();
5543
+ const generated = React48.useId();
5523
5544
  const cell = useFieldCell();
5524
5545
  const controlId = explicitId ?? generated;
5525
5546
  const labelId = `${controlId}-label`;
@@ -5559,9 +5580,9 @@ function useFieldFrame(explicitId, {
5559
5580
  }
5560
5581
  function useErrorShake(invalid, error) {
5561
5582
  const key = !invalid ? null : typeof error === "string" || typeof error === "number" ? String(error) : "invalid";
5562
- const previous = React47.useRef(key);
5563
- const [count, setCount] = React47.useState(0);
5564
- React47.useEffect(() => {
5583
+ const previous = React48.useRef(key);
5584
+ const [count, setCount] = React48.useState(0);
5585
+ React48.useEffect(() => {
5565
5586
  if (key !== null && key !== previous.current) setCount((n) => n + 1);
5566
5587
  previous.current = key;
5567
5588
  }, [key]);
@@ -5569,7 +5590,7 @@ function useErrorShake(invalid, error) {
5569
5590
  return count % 2 ? "odd" : "even";
5570
5591
  }
5571
5592
  function useLeavingError(showError, error) {
5572
- const last = React47.useRef(error);
5593
+ const last = React48.useRef(error);
5573
5594
  if (showError) last.current = error;
5574
5595
  const presence = usePresence(showError, { exitDuration: "fast" });
5575
5596
  if (showError || !presence.mounted) return null;
@@ -5589,9 +5610,9 @@ function FieldSupport({
5589
5610
  }) {
5590
5611
  let text = null;
5591
5612
  if (ids.showError) {
5592
- text = /* @__PURE__ */ jsx26(Hint.Root, { id: ids.errorId, size, invalid: true, className: textClassName, children: error });
5613
+ text = /* @__PURE__ */ jsx27(Hint.Root, { id: ids.errorId, size, invalid: true, className: textClassName, children: error });
5593
5614
  } else if (leaving) {
5594
- text = /* @__PURE__ */ jsx26(
5615
+ text = /* @__PURE__ */ jsx27(
5595
5616
  Hint.Root,
5596
5617
  {
5597
5618
  size,
@@ -5603,7 +5624,7 @@ function FieldSupport({
5603
5624
  }
5604
5625
  );
5605
5626
  } else if (ids.showHint) {
5606
- text = /* @__PURE__ */ jsx26(
5627
+ text = /* @__PURE__ */ jsx27(
5607
5628
  Hint.Root,
5608
5629
  {
5609
5630
  id: ids.hintId,
@@ -5615,7 +5636,7 @@ function FieldSupport({
5615
5636
  }
5616
5637
  );
5617
5638
  }
5618
- return /* @__PURE__ */ jsx26("div", { className, "aria-live": live ? "polite" : void 0, children: text });
5639
+ return /* @__PURE__ */ jsx27("div", { className, "aria-live": live ? "polite" : void 0, children: text });
5619
5640
  }
5620
5641
  function FieldFrame({
5621
5642
  size,
@@ -5642,7 +5663,7 @@ function FieldFrame({
5642
5663
  const shake = useErrorShake(ids.invalid, error);
5643
5664
  const cell = useFieldCell();
5644
5665
  const shownLabel = hasContent(label) ? label : cell?.label;
5645
- const labelNode = hasContent(shownLabel) ? /* @__PURE__ */ jsx26(
5666
+ const labelNode = hasContent(shownLabel) ? /* @__PURE__ */ jsx27(
5646
5667
  Label.Root,
5647
5668
  {
5648
5669
  id: ids.labelId,
@@ -5674,7 +5695,7 @@ function FieldFrame({
5674
5695
  children: [
5675
5696
  labelEnd != null ? /* @__PURE__ */ jsxs15("div", { className: FieldFrame_default.labelRow, children: [
5676
5697
  labelNode,
5677
- /* @__PURE__ */ jsx26("span", { className: FieldFrame_default.labelEnd, children: labelEnd })
5698
+ /* @__PURE__ */ jsx27("span", { className: FieldFrame_default.labelEnd, children: labelEnd })
5678
5699
  ] }) : labelNode,
5679
5700
  /* @__PURE__ */ jsxs15("div", { className: cx(FieldFrame_default.body, enterMotion_default.shakeParts), "data-shake": shake, children: [
5680
5701
  children,
@@ -5689,7 +5710,7 @@ function FieldFrame({
5689
5710
  empty: !showSupport || void 0
5690
5711
  }),
5691
5712
  children: [
5692
- /* @__PURE__ */ jsx26(
5713
+ /* @__PURE__ */ jsx27(
5693
5714
  FieldSupport,
5694
5715
  {
5695
5716
  ids,
@@ -5708,7 +5729,7 @@ function FieldFrame({
5708
5729
  }
5709
5730
  )
5710
5731
  ] }),
5711
- requiredLabel && ids.required ? /* @__PURE__ */ jsx26(VisuallyHidden, { id: ids.requiredId, children: requiredLabel }) : null
5732
+ requiredLabel && ids.required ? /* @__PURE__ */ jsx27(VisuallyHidden, { id: ids.requiredId, children: requiredLabel }) : null
5712
5733
  ]
5713
5734
  }
5714
5735
  );
@@ -5723,18 +5744,18 @@ function FieldCounter({ current, max, size, label, className, ...rest }) {
5723
5744
  "data-invalid": current > max || void 0,
5724
5745
  children: [
5725
5746
  /* @__PURE__ */ jsxs15("span", { "aria-hidden": "true", children: [
5726
- /* @__PURE__ */ jsx26(RollingNumber, { children: current }),
5747
+ /* @__PURE__ */ jsx27(RollingNumber, { children: current }),
5727
5748
  "/",
5728
5749
  max
5729
5750
  ] }),
5730
- /* @__PURE__ */ jsx26(VisuallyHidden, { live: "polite", children: formatLabel(label, { current, max }) })
5751
+ /* @__PURE__ */ jsx27(VisuallyHidden, { live: "polite", children: formatLabel(label, { current, max }) })
5731
5752
  ]
5732
5753
  }
5733
5754
  );
5734
5755
  }
5735
5756
 
5736
5757
  // src/internal/listbox.ts
5737
- import * as React48 from "react";
5758
+ import * as React49 from "react";
5738
5759
 
5739
5760
  // src/internal/rovingFocus.ts
5740
5761
  var PREV = {
@@ -5802,11 +5823,11 @@ function createStore(initial) {
5802
5823
  };
5803
5824
  }
5804
5825
  function useCreateStore(initial) {
5805
- return React48.useState(() => createStore(initial))[0];
5826
+ return React49.useState(() => createStore(initial))[0];
5806
5827
  }
5807
5828
  function useStoreSlice(store, select) {
5808
5829
  const read = () => select(store.get());
5809
- return React48.useSyncExternalStore(store.subscribe, read, read);
5830
+ return React49.useSyncExternalStore(store.subscribe, read, read);
5810
5831
  }
5811
5832
  function createListboxRegistry() {
5812
5833
  const entries = /* @__PURE__ */ new Map();
@@ -5863,19 +5884,19 @@ function createListboxRegistry() {
5863
5884
  };
5864
5885
  }
5865
5886
  function useListboxRegistry() {
5866
- return React48.useState(createListboxRegistry)[0];
5887
+ return React49.useState(createListboxRegistry)[0];
5867
5888
  }
5868
5889
  function useListboxView(registry, query = "", filter = true) {
5869
5890
  const read = () => registry.view(query, filter);
5870
- return React48.useSyncExternalStore(registry.subscribe, read, read);
5891
+ return React49.useSyncExternalStore(registry.subscribe, read, read);
5871
5892
  }
5872
5893
  function useListboxItem(registry, id, item, nodeRef) {
5873
- const activateRef = React48.useRef(item.onActivate);
5874
- React48.useLayoutEffect(() => {
5894
+ const activateRef = React49.useRef(item.onActivate);
5895
+ React49.useLayoutEffect(() => {
5875
5896
  activateRef.current = item.onActivate;
5876
5897
  });
5877
5898
  const { label, haystack, disabled = false, persistent = false } = item;
5878
- React48.useLayoutEffect(
5899
+ React49.useLayoutEffect(
5879
5900
  () => registry.register(
5880
5901
  id,
5881
5902
  { label, haystack, disabled, persistent, onActivate: () => activateRef.current() },
@@ -5908,10 +5929,10 @@ function handleListboxKeyDown(event, { ids, highlight, activate }) {
5908
5929
  }
5909
5930
  var TYPEAHEAD_RESET_MS = 500;
5910
5931
  function useTypeahead() {
5911
- const state = React48.useRef({ buffer: "", timer: 0 });
5912
- React48.useEffect(() => () => window.clearTimeout(state.current.timer), []);
5913
- const isTyping = React48.useCallback(() => state.current.buffer !== "", []);
5914
- const find = React48.useCallback(
5932
+ const state = React49.useRef({ buffer: "", timer: 0 });
5933
+ React49.useEffect(() => () => window.clearTimeout(state.current.timer), []);
5934
+ const isTyping = React49.useCallback(() => state.current.buffer !== "", []);
5935
+ const find = React49.useCallback(
5915
5936
  (key, ids, highlighted, labelOf) => {
5916
5937
  const s = state.current;
5917
5938
  window.clearTimeout(s.timer);
@@ -5946,10 +5967,10 @@ var Input_default = {
5946
5967
  };
5947
5968
 
5948
5969
  // src/components/input/inputSuggestions.tsx
5949
- import * as React50 from "react";
5970
+ import * as React51 from "react";
5950
5971
 
5951
5972
  // src/internal/HighlightMatch.tsx
5952
- import * as React49 from "react";
5973
+ import * as React50 from "react";
5953
5974
 
5954
5975
  // src/internal/HighlightMatch.module.css
5955
5976
  var HighlightMatch_default = {
@@ -5957,7 +5978,7 @@ var HighlightMatch_default = {
5957
5978
  };
5958
5979
 
5959
5980
  // src/internal/HighlightMatch.tsx
5960
- import { Fragment as Fragment9, jsx as jsx27, jsxs as jsxs16 } from "react/jsx-runtime";
5981
+ import { Fragment as Fragment9, jsx as jsx28, jsxs as jsxs16 } from "react/jsx-runtime";
5961
5982
  function matchIndex(text, query) {
5962
5983
  if (!query) return -1;
5963
5984
  return text.toLowerCase().indexOf(query.toLowerCase());
@@ -5969,11 +5990,11 @@ function HighlightMatch({
5969
5990
  }) {
5970
5991
  const q = query.trim();
5971
5992
  const at = matchIndex(text, q);
5972
- if (at < 0) return /* @__PURE__ */ jsx27(Fragment9, { children: text });
5993
+ if (at < 0) return /* @__PURE__ */ jsx28(Fragment9, { children: text });
5973
5994
  if (!all) {
5974
5995
  return /* @__PURE__ */ jsxs16("span", { children: [
5975
5996
  text.slice(0, at),
5976
- /* @__PURE__ */ jsx27("mark", { className: HighlightMatch_default.match, children: text.slice(at, at + q.length) }),
5997
+ /* @__PURE__ */ jsx28("mark", { className: HighlightMatch_default.match, children: text.slice(at, at + q.length) }),
5977
5998
  text.slice(at + q.length)
5978
5999
  ] });
5979
6000
  }
@@ -5984,18 +6005,18 @@ function HighlightMatch({
5984
6005
  for (let found = at; found >= 0; found = lower.indexOf(needle, from)) {
5985
6006
  if (found > from) pieces.push(text.slice(from, found));
5986
6007
  pieces.push(
5987
- /* @__PURE__ */ jsx27("mark", { className: HighlightMatch_default.match, children: text.slice(found, found + q.length) }, found)
6008
+ /* @__PURE__ */ jsx28("mark", { className: HighlightMatch_default.match, children: text.slice(found, found + q.length) }, found)
5988
6009
  );
5989
6010
  from = found + q.length;
5990
6011
  }
5991
6012
  if (from < text.length) pieces.push(text.slice(from));
5992
- return /* @__PURE__ */ jsx27("span", { children: pieces });
6013
+ return /* @__PURE__ */ jsx28("span", { children: pieces });
5993
6014
  }
5994
6015
  function highlightChildren(children, query) {
5995
6016
  if (!query.trim()) return children;
5996
- return React49.Children.map(
6017
+ return React50.Children.map(
5997
6018
  children,
5998
- (child) => typeof child === "string" || typeof child === "number" ? /* @__PURE__ */ jsx27(HighlightMatch, { text: String(child), query }) : child
6019
+ (child) => typeof child === "string" || typeof child === "number" ? /* @__PURE__ */ jsx28(HighlightMatch, { text: String(child), query }) : child
5999
6020
  );
6000
6021
  }
6001
6022
 
@@ -6021,26 +6042,26 @@ var menu_default = {
6021
6042
  };
6022
6043
 
6023
6044
  // src/components/input/inputSuggestions.tsx
6024
- import { jsx as jsx28 } from "react/jsx-runtime";
6045
+ import { jsx as jsx29 } from "react/jsx-runtime";
6025
6046
  function matchesOf(items, text) {
6026
6047
  const query = text.trim().toLocaleLowerCase();
6027
6048
  const found = items.filter((item) => item.toLocaleLowerCase().includes(query));
6028
6049
  return found.length === 1 && found[0]?.toLocaleLowerCase() === query ? [] : found;
6029
6050
  }
6030
6051
  function useInputSuggestions(items, inputRef, listboxId, labelledBy, { closeOnEscape, closeOnOutsideClick }) {
6031
- const [open, setOpen] = React50.useState(false);
6032
- const [query, setQuery] = React50.useState("");
6052
+ const [open, setOpen] = React51.useState(false);
6053
+ const [query, setQuery] = React51.useState("");
6033
6054
  const highlight = useCreateStore(void 0);
6034
- const anchorRef = React50.useRef(null);
6035
- const pickingRef = React50.useRef(false);
6055
+ const anchorRef = React51.useRef(null);
6056
+ const pickingRef = React51.useRef(false);
6036
6057
  const list = items ?? [];
6037
- const matches = React50.useMemo(() => items ? matchesOf(items, query) : [], [items, query]);
6058
+ const matches = React51.useMemo(() => items ? matchesOf(items, query) : [], [items, query]);
6038
6059
  const shown = open && matches.length > 0;
6039
- React50.useEffect(() => {
6060
+ React51.useEffect(() => {
6040
6061
  const current = highlight.get();
6041
6062
  if (current !== void 0 && !matches.includes(current)) highlight.set(void 0);
6042
6063
  }, [matches, highlight]);
6043
- const close = React50.useCallback(() => {
6064
+ const close = React51.useCallback(() => {
6044
6065
  setOpen(false);
6045
6066
  highlight.set(void 0);
6046
6067
  }, [highlight]);
@@ -6132,7 +6153,7 @@ function InputSuggestionList({
6132
6153
  closeOnOutsideClick: suggest.closeOnOutsideClick,
6133
6154
  matchAnchorWidth: true
6134
6155
  });
6135
- return /* @__PURE__ */ jsx28(
6156
+ return /* @__PURE__ */ jsx29(
6136
6157
  FloatingPanel,
6137
6158
  {
6138
6159
  floating,
@@ -6140,7 +6161,7 @@ function InputSuggestionList({
6140
6161
  scroll: true,
6141
6162
  width: "trigger",
6142
6163
  className: cx(fieldTierClass, menu_default.tier, menu_default.menu),
6143
- children: /* @__PURE__ */ jsx28("div", { id: suggest.listboxId, role: "listbox", "aria-labelledby": suggest.labelledBy, children: suggest.matches.map((item) => /* @__PURE__ */ jsx28(SuggestionOption, { item, suggest }, item)) })
6164
+ children: /* @__PURE__ */ jsx29("div", { id: suggest.listboxId, role: "listbox", "aria-labelledby": suggest.labelledBy, children: suggest.matches.map((item) => /* @__PURE__ */ jsx29(SuggestionOption, { item, suggest }, item)) })
6144
6165
  }
6145
6166
  );
6146
6167
  }
@@ -6148,7 +6169,7 @@ function SuggestionOption({ item, suggest }) {
6148
6169
  const highlighted = useStoreSlice(suggest.highlight, (value) => value === item);
6149
6170
  return (
6150
6171
  // biome-ignore lint/a11y/useKeyWithClickEvents: the keyboard stays in the field (`aria-activedescendant`)
6151
- /* @__PURE__ */ jsx28(
6172
+ /* @__PURE__ */ jsx29(
6152
6173
  "div",
6153
6174
  {
6154
6175
  id: optionDomId(suggest.listboxId, item),
@@ -6162,14 +6183,14 @@ function SuggestionOption({ item, suggest }) {
6162
6183
  if (!highlighted) suggest.highlight.set(item);
6163
6184
  },
6164
6185
  onClick: () => suggest.pick(item),
6165
- children: /* @__PURE__ */ jsx28(HighlightMatch, { text: item, query: suggest.query })
6186
+ children: /* @__PURE__ */ jsx29(HighlightMatch, { text: item, query: suggest.query })
6166
6187
  }
6167
6188
  )
6168
6189
  );
6169
6190
  }
6170
6191
 
6171
6192
  // src/components/input/Input.tsx
6172
- import { Fragment as Fragment10, jsx as jsx29, jsxs as jsxs17 } from "react/jsx-runtime";
6193
+ import { Fragment as Fragment10, jsx as jsx30, jsxs as jsxs17 } from "react/jsx-runtime";
6173
6194
  var INPUT_LABELS = {
6174
6195
  optional: "\u043D\u0435\u043E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u043E",
6175
6196
  clear: "\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C",
@@ -6195,7 +6216,7 @@ var STRENGTH_TONES = {
6195
6216
  4: "success"
6196
6217
  };
6197
6218
  var [InputProvider, useInputContext] = createComponentContext("Input");
6198
- var InputSegmentContext = React51.createContext(false);
6219
+ var InputSegmentContext = React52.createContext(false);
6199
6220
  var NO_HIGHLIGHT = createStore(void 0);
6200
6221
  function InputRoot({
6201
6222
  size: sizeProp,
@@ -6223,18 +6244,18 @@ function InputRoot({
6223
6244
  className,
6224
6245
  ...rest
6225
6246
  }) {
6226
- const [strengthValue, setStrengthValue] = React51.useState("");
6247
+ const [strengthValue, setStrengthValue] = React52.useState("");
6227
6248
  const tier = useHostTier(sizeProp);
6228
6249
  const { size } = tier;
6229
6250
  const labels = useLabels(INPUT_LABELS, labelsProp);
6230
6251
  const level = strength ? getStrength(strengthValue) : 0;
6231
6252
  const tooWeak = level > 0 && minStrength !== void 0 && level < minStrength;
6232
- const [weakReported, setWeakReported] = React51.useState(false);
6233
- const reportInvalid = React51.useCallback(() => setWeakReported(true), []);
6253
+ const [weakReported, setWeakReported] = React52.useState(false);
6254
+ const reportInvalid = React52.useCallback(() => setWeakReported(true), []);
6234
6255
  const shownError = error ?? (weakReported && tooWeak ? labels.strengthTooWeak : void 0);
6235
6256
  const ids = useFieldFrame(id, { label, hint, error: shownError, invalid, required });
6236
6257
  const { invalid: isInvalid, controlId: inputId, describedBy, required: isRequired } = ids;
6237
- const inputRef = React51.useRef(null);
6258
+ const inputRef = React52.useRef(null);
6238
6259
  const suggest = useInputSuggestions(
6239
6260
  suggestions,
6240
6261
  inputRef,
@@ -6244,14 +6265,14 @@ function InputRoot({
6244
6265
  );
6245
6266
  const commit = useFieldCommit(inputRef, onCommit);
6246
6267
  const hasCommit = onCommit !== void 0;
6247
- const [revealed, setRevealed] = React51.useState(false);
6248
- const selectionRef = React51.useRef(null);
6249
- const mountedRef = React51.useRef(false);
6250
- React51.useEffect(() => {
6268
+ const [revealed, setRevealed] = React52.useState(false);
6269
+ const selectionRef = React52.useRef(null);
6270
+ const mountedRef = React52.useRef(false);
6271
+ React52.useEffect(() => {
6251
6272
  mountedRef.current = true;
6252
6273
  }, []);
6253
- const [affixes, setAffixes] = React51.useState([]);
6254
- const addAffix = React51.useCallback((affixId) => {
6274
+ const [affixes, setAffixes] = React52.useState([]);
6275
+ const addAffix = React52.useCallback((affixId) => {
6255
6276
  setAffixes((current) => [...current, affixId]);
6256
6277
  return () => setAffixes((current) => current.filter((item) => item !== affixId));
6257
6278
  }, []);
@@ -6259,7 +6280,7 @@ function InputRoot({
6259
6280
  const isValid = Boolean(valid) && !isInvalid;
6260
6281
  const validId = valid === void 0 ? "" : `${inputId}-valid`;
6261
6282
  const customValidity = minStrength === void 0 ? null : tooWeak ? labels.strengthTooWeak : "";
6262
- const contextValue = React51.useMemo(
6283
+ const contextValue = React52.useMemo(
6263
6284
  () => ({
6264
6285
  size,
6265
6286
  invalid: isInvalid,
@@ -6307,7 +6328,7 @@ function InputRoot({
6307
6328
  );
6308
6329
  const levelTone = tooWeak ? "danger" : level ? STRENGTH_TONES[level] : void 0;
6309
6330
  const levelWord = level ? [labels.strengthWeak, labels.strengthEasy, labels.strengthMedium, labels.strengthHard][level - 1] : "";
6310
- return /* @__PURE__ */ jsx29(InputProvider, { value: contextValue, children: tier.provide(
6331
+ return /* @__PURE__ */ jsx30(InputProvider, { value: contextValue, children: tier.provide(
6311
6332
  /* @__PURE__ */ jsxs17(
6312
6333
  FieldFrame,
6313
6334
  {
@@ -6321,15 +6342,15 @@ function InputRoot({
6321
6342
  hintTone,
6322
6343
  error: shownError,
6323
6344
  counter: strength ? /* @__PURE__ */ jsxs17(Fragment10, { children: [
6324
- /* @__PURE__ */ jsx29(
6345
+ /* @__PURE__ */ jsx30(
6325
6346
  "span",
6326
6347
  {
6327
6348
  className: cx(textTone_default.tone, Input_default.strengthWord),
6328
6349
  "data-tone": levelTone,
6329
6350
  "aria-live": "polite",
6330
6351
  children: levelWord ? /* @__PURE__ */ jsxs17(Fragment10, { children: [
6331
- /* @__PURE__ */ jsx29(VisuallyHidden, { children: `${labels.strength}: ` }),
6332
- /* @__PURE__ */ jsx29(MorphText, { children: levelWord })
6352
+ /* @__PURE__ */ jsx30(VisuallyHidden, { children: `${labels.strength}: ` }),
6353
+ /* @__PURE__ */ jsx30(MorphText, { children: levelWord })
6333
6354
  ] }) : null
6334
6355
  }
6335
6356
  ),
@@ -6340,7 +6361,7 @@ function InputRoot({
6340
6361
  className: cx(fieldTierClass, Input_default.root, className),
6341
6362
  children: [
6342
6363
  children,
6343
- strength ? /* @__PURE__ */ jsx29(
6364
+ strength ? /* @__PURE__ */ jsx30(
6344
6365
  ProgressBar,
6345
6366
  {
6346
6367
  steps: true,
@@ -6373,11 +6394,11 @@ function InputWrapper({ children, className, ref, ...rest }) {
6373
6394
  "focus-ring": focusRing
6374
6395
  }),
6375
6396
  children: [
6376
- /* @__PURE__ */ jsx29(InputSegmentContext, { value: true, children }),
6377
- valid ? /* @__PURE__ */ jsx29(InputValidMark, {}) : null,
6378
- validId ? /* @__PURE__ */ jsx29(VisuallyHidden, { id: validId, live: "polite", children: valid ? labels.valid : "" }) : null,
6379
- hasCommit ? /* @__PURE__ */ jsx29(FieldCommitStatus, { state: commit.state, labels, className: Input_default.status }) : null,
6380
- suggest ? /* @__PURE__ */ jsx29(InputSuggestionList, { suggest, size }) : null
6397
+ /* @__PURE__ */ jsx30(InputSegmentContext, { value: true, children }),
6398
+ valid ? /* @__PURE__ */ jsx30(InputValidMark, {}) : null,
6399
+ validId ? /* @__PURE__ */ jsx30(VisuallyHidden, { id: validId, live: "polite", children: valid ? labels.valid : "" }) : null,
6400
+ hasCommit ? /* @__PURE__ */ jsx30(FieldCommitStatus, { state: commit.state, labels, className: Input_default.status }) : null,
6401
+ suggest ? /* @__PURE__ */ jsx30(InputSuggestionList, { suggest, size }) : null
6381
6402
  ]
6382
6403
  }
6383
6404
  );
@@ -6385,21 +6406,21 @@ function InputWrapper({ children, className, ref, ...rest }) {
6385
6406
  InputWrapper.displayName = "Input.Wrapper";
6386
6407
  function InputValidMark() {
6387
6408
  const { mountedRef } = useInputContext();
6388
- const [arrived] = React51.useState(() => mountedRef.current);
6389
- const [drawn, setDrawn] = React51.useState(!arrived);
6390
- React51.useEffect(() => {
6409
+ const [arrived] = React52.useState(() => mountedRef.current);
6410
+ const [drawn, setDrawn] = React52.useState(!arrived);
6411
+ React52.useEffect(() => {
6391
6412
  if (drawn) return;
6392
6413
  const frame2 = requestAnimationFrame(() => setDrawn(true));
6393
6414
  return () => cancelAnimationFrame(frame2);
6394
6415
  }, [drawn]);
6395
6416
  const presence = usePartPresence({ axis: "inline" });
6396
- return /* @__PURE__ */ jsx29(
6417
+ return /* @__PURE__ */ jsx30(
6397
6418
  "span",
6398
6419
  {
6399
6420
  ref: presence.ref,
6400
6421
  className: cx(iconSlotClass, Input_default.validMark, arrived && enterMotion_default.enter),
6401
6422
  "aria-hidden": "true",
6402
- children: /* @__PURE__ */ jsx29(Icon, { name: "action.check", drawn })
6423
+ children: /* @__PURE__ */ jsx30(Icon, { name: "action.check", drawn })
6403
6424
  }
6404
6425
  );
6405
6426
  }
@@ -6409,6 +6430,7 @@ function InputField({
6409
6430
  required,
6410
6431
  disabled: disabledProp,
6411
6432
  type,
6433
+ autoComplete,
6412
6434
  onChange,
6413
6435
  onValueChange,
6414
6436
  onFocus,
@@ -6440,8 +6462,9 @@ function InputField({
6440
6462
  const setRefs = useMergedRefs(inputRef, ref);
6441
6463
  const highlighted = useStoreSlice(suggest?.highlight ?? NO_HIGHLIGHT, (value) => value);
6442
6464
  const disabled = useInheritedDisabled(disabledProp);
6465
+ const autofill = useAutofill(autoComplete);
6443
6466
  const fieldType = type === "password" && revealed ? "text" : type;
6444
- React51.useLayoutEffect(() => {
6467
+ React52.useLayoutEffect(() => {
6445
6468
  const selection = selectionRef.current;
6446
6469
  const input = inputRef.current;
6447
6470
  if (!selection || !input || input.type !== (fieldType ?? "text")) return;
@@ -6449,16 +6472,16 @@ function InputField({
6449
6472
  input.setSelectionRange(selection[0], selection[1]);
6450
6473
  }, [fieldType, selectionRef, inputRef]);
6451
6474
  const controlled = rest.value;
6452
- React51.useEffect(() => {
6475
+ React52.useEffect(() => {
6453
6476
  if (!reportValue) return;
6454
6477
  if (controlled !== void 0) reportValue(String(controlled));
6455
6478
  else if (inputRef.current) reportValue(inputRef.current.value);
6456
6479
  }, [reportValue, controlled, inputRef]);
6457
- React51.useEffect(() => {
6480
+ React52.useEffect(() => {
6458
6481
  if (customValidity !== null) inputRef.current?.setCustomValidity(customValidity);
6459
6482
  }, [customValidity, inputRef]);
6460
6483
  const resolvedDescribedBy = [ariaDescribedBy, affixIds, describedBy, valid ? validId : void 0].filter(Boolean).join(" ") || void 0;
6461
- return /* @__PURE__ */ jsx29(
6484
+ return /* @__PURE__ */ jsx30(
6462
6485
  "input",
6463
6486
  {
6464
6487
  ...rest,
@@ -6471,9 +6494,11 @@ function InputField({
6471
6494
  required: required ?? (requiredCtx || void 0),
6472
6495
  type: fieldType,
6473
6496
  "aria-busy": commit.state === "pending" || void 0,
6497
+ ...autofill,
6474
6498
  ...suggest ? {
6499
+ // The kit's own list: no browser or password-manager list on top of it.
6500
+ ...AUTOFILL_OFF,
6475
6501
  role: "combobox",
6476
- autoComplete: "off",
6477
6502
  "aria-autocomplete": "list",
6478
6503
  "aria-expanded": suggest.shown,
6479
6504
  "aria-controls": suggest.shown ? suggest.listboxId : void 0,
@@ -6514,7 +6539,7 @@ function InputField({
6514
6539
  }
6515
6540
  InputField.displayName = "Input.Field";
6516
6541
  function InputIcon({ side, children, className, ...rest }) {
6517
- return /* @__PURE__ */ jsx29(
6542
+ return /* @__PURE__ */ jsx30(
6518
6543
  "span",
6519
6544
  {
6520
6545
  ...rest,
@@ -6528,12 +6553,12 @@ function InputIcon({ side, children, className, ...rest }) {
6528
6553
  InputIcon.displayName = "Input.Icon";
6529
6554
  function useAffixDescription(id, spokenText) {
6530
6555
  const { addAffix } = useInputContext();
6531
- const generated = React51.useId();
6556
+ const generated = React52.useId();
6532
6557
  const target = spokenText ? generated : id ?? generated;
6533
- React51.useLayoutEffect(() => addAffix(target), [addAffix, target]);
6558
+ React52.useLayoutEffect(() => addAffix(target), [addAffix, target]);
6534
6559
  return spokenText ? {
6535
6560
  id,
6536
- spoken: /* @__PURE__ */ jsx29("span", { id: generated, hidden: true, children: spokenText })
6561
+ spoken: /* @__PURE__ */ jsx30("span", { id: generated, hidden: true, children: spokenText })
6537
6562
  } : { id: target, spoken: null };
6538
6563
  }
6539
6564
  function InputAffix({
@@ -6588,10 +6613,10 @@ function InputInlineAffix({
6588
6613
  InputInlineAffix.displayName = "Input.InlineAffix";
6589
6614
  function InputClearButton({ onClick: onClick2, className, ref, ...rest }) {
6590
6615
  const { inputId, inputRef, labels, mountedRef } = useInputContext();
6591
- const [arrived] = React51.useState(() => mountedRef.current);
6616
+ const [arrived] = React52.useState(() => mountedRef.current);
6592
6617
  const presence = usePartPresence({ axis: "inline" });
6593
6618
  const setRefs = useMergedRefs(presence.ref, ref);
6594
- return /* @__PURE__ */ jsx29(
6619
+ return /* @__PURE__ */ jsx30(
6595
6620
  FieldActionButton,
6596
6621
  {
6597
6622
  tooltip: false,
@@ -6604,18 +6629,18 @@ function InputClearButton({ onClick: onClick2, className, ref, ...rest }) {
6604
6629
  onClick2?.(event);
6605
6630
  if (!event.defaultPrevented) inputRef.current?.focus();
6606
6631
  },
6607
- children: /* @__PURE__ */ jsx29(Icon, { name: "action.close" })
6632
+ children: /* @__PURE__ */ jsx30(Icon, { name: "action.close" })
6608
6633
  }
6609
6634
  );
6610
6635
  }
6611
6636
  InputClearButton.displayName = "Input.ClearButton";
6612
6637
  function InputAction(props) {
6613
- return /* @__PURE__ */ jsx29(FieldActionButton, { ...props });
6638
+ return /* @__PURE__ */ jsx30(FieldActionButton, { ...props });
6614
6639
  }
6615
6640
  InputAction.displayName = "Input.Action";
6616
6641
  function InputCopyButton({ value, ...rest }) {
6617
6642
  const { inputRef, labels } = useInputContext();
6618
- return /* @__PURE__ */ jsx29(
6643
+ return /* @__PURE__ */ jsx30(
6619
6644
  FieldCopyButton,
6620
6645
  {
6621
6646
  ...rest,
@@ -6628,7 +6653,7 @@ InputCopyButton.displayName = "Input.CopyButton";
6628
6653
  function InputRevealButton({ onClick: onClick2, onMouseDown, ref, ...rest }) {
6629
6654
  const { inputId, inputRef, labels, revealed, setRevealed, selectionRef } = useInputContext();
6630
6655
  const glyph = revealed ? "field.password.hide" : "field.password.show";
6631
- return /* @__PURE__ */ jsx29(
6656
+ return /* @__PURE__ */ jsx30(
6632
6657
  FieldActionButton,
6633
6658
  {
6634
6659
  tooltip: false,
@@ -6652,14 +6677,14 @@ function InputRevealButton({ onClick: onClick2, onMouseDown, ref, ...rest }) {
6652
6677
  }
6653
6678
  setRevealed((shown) => !shown);
6654
6679
  },
6655
- children: /* @__PURE__ */ jsx29(Icon, { name: glyph })
6680
+ children: /* @__PURE__ */ jsx30(Icon, { name: glyph })
6656
6681
  }
6657
6682
  );
6658
6683
  }
6659
6684
  InputRevealButton.displayName = "Input.RevealButton";
6660
6685
  function InputCounter(props) {
6661
6686
  const { size, labels } = useInputContext();
6662
- return /* @__PURE__ */ jsx29(FieldCounter, { ...props, size, label: labels.counter });
6687
+ return /* @__PURE__ */ jsx30(FieldCounter, { ...props, size, label: labels.counter });
6663
6688
  }
6664
6689
  InputCounter.displayName = "Input.Counter";
6665
6690
  var Input = {
@@ -6677,7 +6702,7 @@ var Input = {
6677
6702
  };
6678
6703
 
6679
6704
  // src/components/empty-page/EmptyPage.tsx
6680
- import * as React52 from "react";
6705
+ import * as React53 from "react";
6681
6706
 
6682
6707
  // src/components/empty-page/EmptyPage.module.css
6683
6708
  var EmptyPage_default = {
@@ -6689,7 +6714,7 @@ var EmptyPage_default = {
6689
6714
  };
6690
6715
 
6691
6716
  // src/components/empty-page/EmptyPage.tsx
6692
- import { jsx as jsx30, jsxs as jsxs18 } from "react/jsx-runtime";
6717
+ import { jsx as jsx31, jsxs as jsxs18 } from "react/jsx-runtime";
6693
6718
  var EMPTY_PAGE_LABELS = { retry: "\u041F\u043E\u0432\u0442\u043E\u0440\u0438\u0442\u044C" };
6694
6719
  var TITLE_ROLE = {
6695
6720
  xs: textRole_default.titleS,
@@ -6705,7 +6730,7 @@ var DESCRIPTION_ROLE = {
6705
6730
  l: textRole_default.bodyM,
6706
6731
  xl: textRole_default.bodyL
6707
6732
  };
6708
- var EmptyPageContext = React52.createContext({
6733
+ var EmptyPageContext = React53.createContext({
6709
6734
  tone: "neutral",
6710
6735
  size: "m",
6711
6736
  compact: false,
@@ -6732,7 +6757,7 @@ function EmptyPageRoot({
6732
6757
  labels: mergedLabels
6733
6758
  };
6734
6759
  return provide(
6735
- /* @__PURE__ */ jsx30(
6760
+ /* @__PURE__ */ jsx31(
6736
6761
  "div",
6737
6762
  {
6738
6763
  className: cx(EmptyPage_default.root, appear.entering && enterMotion_default.enterBaseChildren, className),
@@ -6744,17 +6769,17 @@ function EmptyPageRoot({
6744
6769
  layout: layout === "default" ? void 0 : layout,
6745
6770
  tone: tone === "neutral" ? void 0 : tone
6746
6771
  }),
6747
- children: /* @__PURE__ */ jsx30(EmptyPageContext.Provider, { value: context, children })
6772
+ children: /* @__PURE__ */ jsx31(EmptyPageContext.Provider, { value: context, children })
6748
6773
  }
6749
6774
  )
6750
6775
  );
6751
6776
  }
6752
6777
  EmptyPageRoot.displayName = "EmptyPage.Root";
6753
6778
  function EmptyPageIcon({ tone: toneProp, className, ...rest }) {
6754
- const { tone: rootTone, size, compact } = React52.useContext(EmptyPageContext);
6779
+ const { tone: rootTone, size, compact } = React53.useContext(EmptyPageContext);
6755
6780
  return (
6756
6781
  // The tile is decorative: the title says what the state is.
6757
- /* @__PURE__ */ jsx30(
6782
+ /* @__PURE__ */ jsx31(
6758
6783
  "div",
6759
6784
  {
6760
6785
  "aria-hidden": "true",
@@ -6768,8 +6793,8 @@ function EmptyPageIcon({ tone: toneProp, className, ...rest }) {
6768
6793
  }
6769
6794
  EmptyPageIcon.displayName = "EmptyPage.Icon";
6770
6795
  function EmptyPageTitle({ as: Tag = "h2", className, ref, ...rest }) {
6771
- const { size, compact } = React52.useContext(EmptyPageContext);
6772
- return /* @__PURE__ */ jsx30(
6796
+ const { size, compact } = React53.useContext(EmptyPageContext);
6797
+ return /* @__PURE__ */ jsx31(
6773
6798
  Tag,
6774
6799
  {
6775
6800
  ref,
@@ -6780,8 +6805,8 @@ function EmptyPageTitle({ as: Tag = "h2", className, ref, ...rest }) {
6780
6805
  }
6781
6806
  EmptyPageTitle.displayName = "EmptyPage.Title";
6782
6807
  function EmptyPageDescription({ className, ...rest }) {
6783
- const { size, compact } = React52.useContext(EmptyPageContext);
6784
- return /* @__PURE__ */ jsx30(
6808
+ const { size, compact } = React53.useContext(EmptyPageContext);
6809
+ return /* @__PURE__ */ jsx31(
6785
6810
  "p",
6786
6811
  {
6787
6812
  className: cx(
@@ -6795,11 +6820,11 @@ function EmptyPageDescription({ className, ...rest }) {
6795
6820
  }
6796
6821
  EmptyPageDescription.displayName = "EmptyPage.Description";
6797
6822
  function EmptyPageActions({ className, ...rest }) {
6798
- return /* @__PURE__ */ jsx30("div", { className: cx(EmptyPage_default.actions, className), ...rest });
6823
+ return /* @__PURE__ */ jsx31("div", { className: cx(EmptyPage_default.actions, className), ...rest });
6799
6824
  }
6800
6825
  EmptyPageActions.displayName = "EmptyPage.Actions";
6801
6826
  function EmptyPageRetryButton({ onRetry, children, disabled, ...rest }) {
6802
- const { labels } = React52.useContext(EmptyPageContext);
6827
+ const { labels } = React53.useContext(EmptyPageContext);
6803
6828
  const retry = usePendingAction(onRetry);
6804
6829
  return /* @__PURE__ */ jsxs18(
6805
6830
  Button.Root,
@@ -6811,7 +6836,7 @@ function EmptyPageRetryButton({ onRetry, children, disabled, ...rest }) {
6811
6836
  disabled,
6812
6837
  onClick: () => retry.run?.(),
6813
6838
  children: [
6814
- /* @__PURE__ */ jsx30(Button.Icon, { children: /* @__PURE__ */ jsx30(Icon, { name: "action.refresh" }) }),
6839
+ /* @__PURE__ */ jsx31(Button.Icon, { children: /* @__PURE__ */ jsx31(Icon, { name: "action.refresh" }) }),
6815
6840
  children ?? labels.retry
6816
6841
  ]
6817
6842
  }
@@ -6828,21 +6853,21 @@ var EmptyPage = {
6828
6853
  };
6829
6854
 
6830
6855
  // src/components/avatar/Avatar.tsx
6831
- import * as React56 from "react";
6856
+ import * as React57 from "react";
6832
6857
 
6833
6858
  // src/internal/imageSlot.tsx
6834
- import * as React54 from "react";
6859
+ import * as React55 from "react";
6835
6860
 
6836
6861
  // src/hooks/useImageStatus.ts
6837
- import * as React53 from "react";
6862
+ import * as React54 from "react";
6838
6863
  function useImageStatus(report, { onLoad, onError, decode = false } = {}) {
6839
- const [status, setStatus] = React53.useState("loading");
6840
- const settled = React53.useRef(false);
6841
- React53.useLayoutEffect(() => {
6864
+ const [status, setStatus] = React54.useState("loading");
6865
+ const settled = React54.useRef(false);
6866
+ React54.useLayoutEffect(() => {
6842
6867
  report("loading");
6843
6868
  return () => report("idle");
6844
6869
  }, [report]);
6845
- const loaded = React53.useCallback(
6870
+ const loaded = React54.useCallback(
6846
6871
  (element, event) => {
6847
6872
  const settle2 = () => {
6848
6873
  if (decode && (settled.current || !element.isConnected)) return;
@@ -6859,11 +6884,11 @@ function useImageStatus(report, { onLoad, onError, decode = false } = {}) {
6859
6884
  },
6860
6885
  [decode, onLoad, report]
6861
6886
  );
6862
- const handleLoad = React53.useCallback(
6887
+ const handleLoad = React54.useCallback(
6863
6888
  (event) => loaded(event.currentTarget, event),
6864
6889
  [loaded]
6865
6890
  );
6866
- const handleError = React53.useCallback(
6891
+ const handleError = React54.useCallback(
6867
6892
  (event) => {
6868
6893
  setStatus("error");
6869
6894
  report("error");
@@ -6871,7 +6896,7 @@ function useImageStatus(report, { onLoad, onError, decode = false } = {}) {
6871
6896
  },
6872
6897
  [onError, report]
6873
6898
  );
6874
- const ref = React53.useCallback(
6899
+ const ref = React54.useCallback(
6875
6900
  (element) => {
6876
6901
  if (decode && element instanceof HTMLImageElement && element.complete && element.naturalWidth > 0) {
6877
6902
  loaded(element, null);
@@ -6883,18 +6908,18 @@ function useImageStatus(report, { onLoad, onError, decode = false } = {}) {
6883
6908
  }
6884
6909
 
6885
6910
  // src/internal/imageSlot.tsx
6886
- import { Fragment as Fragment11, jsx as jsx31, jsxs as jsxs19 } from "react/jsx-runtime";
6911
+ import { Fragment as Fragment11, jsx as jsx32, jsxs as jsxs19 } from "react/jsx-runtime";
6887
6912
  function createImageSlot(name, classNames) {
6888
6913
  const [Provider, useSlotContext] = createComponentContext(name);
6889
6914
  function ImageSlotProvider({ children }) {
6890
- const [imageStatus, setImageStatus] = React54.useState("idle");
6891
- const value = React54.useMemo(() => ({ imageStatus, setImageStatus }), [imageStatus]);
6892
- return /* @__PURE__ */ jsx31(Provider, { value, children });
6915
+ const [imageStatus, setImageStatus] = React55.useState("idle");
6916
+ const value = React55.useMemo(() => ({ imageStatus, setImageStatus }), [imageStatus]);
6917
+ return /* @__PURE__ */ jsx32(Provider, { value, children });
6893
6918
  }
6894
6919
  function ImageInner({ src, alt = "", className, onLoad, onError, ...rest }) {
6895
6920
  const { setImageStatus } = useSlotContext();
6896
6921
  const image = useImageStatus(setImageStatus, { onLoad, onError });
6897
- return /* @__PURE__ */ jsx31(
6922
+ return /* @__PURE__ */ jsx32(
6898
6923
  "img",
6899
6924
  {
6900
6925
  loading: "lazy",
@@ -6911,7 +6936,7 @@ function createImageSlot(name, classNames) {
6911
6936
  }
6912
6937
  function LeavingImage({ image }) {
6913
6938
  const { ref: _ref, src, alt: _alt, className, ...rest } = image;
6914
- return /* @__PURE__ */ jsx31(
6939
+ return /* @__PURE__ */ jsx32(
6915
6940
  "img",
6916
6941
  {
6917
6942
  ...rest,
@@ -6925,23 +6950,23 @@ function createImageSlot(name, classNames) {
6925
6950
  );
6926
6951
  }
6927
6952
  function Image2({ onLoad, onError, onTransitionEnd, ...props }) {
6928
- const [shown, setShown] = React54.useState(null);
6929
- const [leaving, setLeaving] = React54.useState(null);
6930
- const [src, setSrc] = React54.useState(props.src);
6953
+ const [shown, setShown] = React55.useState(null);
6954
+ const [leaving, setLeaving] = React55.useState(null);
6955
+ const [src, setSrc] = React55.useState(props.src);
6931
6956
  if (props.src !== src) {
6932
6957
  setSrc(props.src);
6933
6958
  setLeaving(shown && !prefersReducedMotion() ? shown : null);
6934
6959
  setShown(null);
6935
6960
  }
6936
6961
  const leavingSrc = leaving?.src;
6937
- React54.useEffect(() => {
6962
+ React55.useEffect(() => {
6938
6963
  if (!leavingSrc || !shown) return;
6939
6964
  const timer = window.setTimeout(() => setLeaving(null), exitTimeoutMs("slow"));
6940
6965
  return () => window.clearTimeout(timer);
6941
6966
  }, [leavingSrc, shown]);
6942
6967
  return /* @__PURE__ */ jsxs19(Fragment11, { children: [
6943
- leaving ? /* @__PURE__ */ jsx31(LeavingImage, { image: leaving }) : null,
6944
- /* @__PURE__ */ jsx31(
6968
+ leaving ? /* @__PURE__ */ jsx32(LeavingImage, { image: leaving }) : null,
6969
+ /* @__PURE__ */ jsx32(
6945
6970
  ImageInner,
6946
6971
  {
6947
6972
  ...props,
@@ -6965,7 +6990,7 @@ function createImageSlot(name, classNames) {
6965
6990
  Image2.displayName = `${name}.Image`;
6966
6991
  function Fallback({ className, ...rest }) {
6967
6992
  const { imageStatus } = useSlotContext();
6968
- return /* @__PURE__ */ jsx31(
6993
+ return /* @__PURE__ */ jsx32(
6969
6994
  "span",
6970
6995
  {
6971
6996
  className: cx(classNames.fallback, className),
@@ -6985,22 +7010,22 @@ function createImageSlot(name, classNames) {
6985
7010
  }
6986
7011
 
6987
7012
  // src/internal/mediaSlot.tsx
6988
- import * as React55 from "react";
6989
- import { jsx as jsx32 } from "react/jsx-runtime";
6990
- var MediaSlotContext = React55.createContext(null);
7013
+ import * as React56 from "react";
7014
+ import { jsx as jsx33 } from "react/jsx-runtime";
7015
+ var MediaSlotContext = React56.createContext(null);
6991
7016
  var MEDIA_SLOT_SIZE = { avatar: "l", thumbnail: "m" };
6992
7017
  function useMediaSlotHost() {
6993
- const [count, setCount] = React55.useState(0);
6994
- const value = React55.useMemo(
7018
+ const [count, setCount] = React56.useState(0);
7019
+ const value = React56.useMemo(
6995
7020
  () => ({ report: (present) => setCount((n) => Math.max(0, n + (present ? 1 : -1))) }),
6996
7021
  []
6997
7022
  );
6998
- const provide = (children) => /* @__PURE__ */ jsx32(MediaSlotContext.Provider, { value, children });
7023
+ const provide = (children) => /* @__PURE__ */ jsx33(MediaSlotContext.Provider, { value, children });
6999
7024
  return { media: count > 0, provide };
7000
7025
  }
7001
7026
  function useMediaSlotSize(kind) {
7002
- const slot3 = React55.useContext(MediaSlotContext);
7003
- React55.useLayoutEffect(() => {
7027
+ const slot3 = React56.useContext(MediaSlotContext);
7028
+ React56.useLayoutEffect(() => {
7004
7029
  if (!slot3) return;
7005
7030
  slot3.report(true);
7006
7031
  return () => slot3.report(false);
@@ -7019,16 +7044,16 @@ var Avatar_default = {
7019
7044
  };
7020
7045
 
7021
7046
  // src/components/avatar/Avatar.tsx
7022
- import { jsx as jsx33 } from "react/jsx-runtime";
7047
+ import { jsx as jsx34 } from "react/jsx-runtime";
7023
7048
  var slot = createImageSlot("Avatar", {
7024
7049
  image: Avatar_default.image,
7025
7050
  fallback: cx(Avatar_default.fallback, iconSlotClass)
7026
7051
  });
7027
- var AvatarGroupSizeContext = React56.createContext(void 0);
7052
+ var AvatarGroupSizeContext = React57.createContext(void 0);
7028
7053
  function AvatarRoot({ size, color = "gray", className, children, ...rest }) {
7029
- const groupSize = React56.useContext(AvatarGroupSizeContext);
7054
+ const groupSize = React57.useContext(AvatarGroupSizeContext);
7030
7055
  const slotSize = useMediaSlotSize("avatar");
7031
- return /* @__PURE__ */ jsx33(slot.ImageSlotProvider, { children: /* @__PURE__ */ jsx33(
7056
+ return /* @__PURE__ */ jsx34(slot.ImageSlotProvider, { children: /* @__PURE__ */ jsx34(
7032
7057
  "div",
7033
7058
  {
7034
7059
  role: namedRole(rest, "img"),
@@ -7050,7 +7075,7 @@ var AVATAR_STATUS_LABELS = {
7050
7075
  };
7051
7076
  function AvatarStatus({ status, labels, className, ...rest }) {
7052
7077
  slot.useImageSlot();
7053
- return /* @__PURE__ */ jsx33(
7078
+ return /* @__PURE__ */ jsx34(
7054
7079
  "span",
7055
7080
  {
7056
7081
  role: "img",
@@ -7063,7 +7088,7 @@ function AvatarStatus({ status, labels, className, ...rest }) {
7063
7088
  }
7064
7089
  AvatarStatus.displayName = "Avatar.Status";
7065
7090
  function AvatarGroup({ size, className, role = "group", ...rest }) {
7066
- return /* @__PURE__ */ jsx33(AvatarGroupSizeContext.Provider, { value: size, children: /* @__PURE__ */ jsx33(
7091
+ return /* @__PURE__ */ jsx34(AvatarGroupSizeContext.Provider, { value: size, children: /* @__PURE__ */ jsx34(
7067
7092
  "div",
7068
7093
  {
7069
7094
  role,
@@ -7075,8 +7100,8 @@ function AvatarGroup({ size, className, role = "group", ...rest }) {
7075
7100
  }
7076
7101
  AvatarGroup.displayName = "Avatar.Group";
7077
7102
  function AvatarOverflow({ size, className, ...rest }) {
7078
- const groupSize = React56.useContext(AvatarGroupSizeContext);
7079
- return /* @__PURE__ */ jsx33(
7103
+ const groupSize = React57.useContext(AvatarGroupSizeContext);
7104
+ return /* @__PURE__ */ jsx34(
7080
7105
  "div",
7081
7106
  {
7082
7107
  role: namedRole(rest, "img"),
@@ -7097,7 +7122,7 @@ var Avatar = {
7097
7122
  };
7098
7123
 
7099
7124
  // src/components/checkbox/Checkbox.tsx
7100
- import * as React58 from "react";
7125
+ import * as React59 from "react";
7101
7126
 
7102
7127
  // src/internal/CheckMark.module.css
7103
7128
  var CheckMark_default = {
@@ -7107,7 +7132,7 @@ var CheckMark_default = {
7107
7132
  };
7108
7133
 
7109
7134
  // src/internal/CheckMark.tsx
7110
- import { jsx as jsx34, jsxs as jsxs20 } from "react/jsx-runtime";
7135
+ import { jsx as jsx35, jsxs as jsxs20 } from "react/jsx-runtime";
7111
7136
  function CheckMark({ state, className }) {
7112
7137
  return /* @__PURE__ */ jsxs20(
7113
7138
  "svg",
@@ -7118,15 +7143,15 @@ function CheckMark({ state, className }) {
7118
7143
  "aria-hidden": "true",
7119
7144
  focusable: "false",
7120
7145
  children: [
7121
- /* @__PURE__ */ jsx34("path", { d: "M5.5 12.5l4.25 4.25L18.5 8", pathLength: 1, className: CheckMark_default.check }),
7122
- /* @__PURE__ */ jsx34("path", { d: "M7 12h10", pathLength: 1, className: CheckMark_default.bar })
7146
+ /* @__PURE__ */ jsx35("path", { d: "M5.5 12.5l4.25 4.25L18.5 8", pathLength: 1, className: CheckMark_default.check }),
7147
+ /* @__PURE__ */ jsx35("path", { d: "M7 12h10", pathLength: 1, className: CheckMark_default.bar })
7123
7148
  ]
7124
7149
  }
7125
7150
  );
7126
7151
  }
7127
7152
 
7128
7153
  // src/internal/ChoiceField.tsx
7129
- import * as React57 from "react";
7154
+ import * as React58 from "react";
7130
7155
 
7131
7156
  // src/internal/ChoiceField.module.css
7132
7157
  var ChoiceField_default = {
@@ -7142,12 +7167,12 @@ var ChoiceField_default = {
7142
7167
  };
7143
7168
 
7144
7169
  // src/internal/ChoiceField.tsx
7145
- import { Fragment as Fragment12, jsx as jsx35, jsxs as jsxs21 } from "react/jsx-runtime";
7170
+ import { Fragment as Fragment12, jsx as jsx36, jsxs as jsxs21 } from "react/jsx-runtime";
7146
7171
  var choiceInputClass = ChoiceField_default.input;
7147
7172
  var choiceVisualClass = cx(ChoiceField_default.visual, press_default.pressPartCompact);
7148
7173
  var choiceBoxClass = ChoiceField_default.box;
7149
7174
  var choiceTrackClass = ChoiceField_default.track;
7150
- var ChoiceMarksContext = React57.createContext(null);
7175
+ var ChoiceMarksContext = React58.createContext(null);
7151
7176
  function ChoiceField({
7152
7177
  ids,
7153
7178
  size,
@@ -7168,11 +7193,11 @@ function ChoiceField({
7168
7193
  }) {
7169
7194
  const shake = useErrorShake(!groupOption && ids.invalid, error);
7170
7195
  const leaving = useLeavingError(ids.showError, error);
7171
- const marks = React57.useMemo(
7196
+ const marks = React58.useMemo(
7172
7197
  () => ({ required, optional, optionalLabel, disabled }),
7173
7198
  [required, optional, optionalLabel, disabled]
7174
7199
  );
7175
- return /* @__PURE__ */ jsx35(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsxs21(
7200
+ return /* @__PURE__ */ jsx36(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsxs21(
7176
7201
  "div",
7177
7202
  {
7178
7203
  className: cx(fieldTierClass, ChoiceField_default.field, className),
@@ -7191,7 +7216,7 @@ function ChoiceField({
7191
7216
  className: cx(ChoiceField_default.row, press_default.pressHost),
7192
7217
  "data-loading": busy || void 0,
7193
7218
  children: [
7194
- /* @__PURE__ */ jsx35(
7219
+ /* @__PURE__ */ jsx36(
7195
7220
  "span",
7196
7221
  {
7197
7222
  className: cx(ChoiceField_default.controlCell, enterMotion_default.shake, touchTargetClass),
@@ -7199,11 +7224,11 @@ function ChoiceField({
7199
7224
  children: control
7200
7225
  }
7201
7226
  ),
7202
- /* @__PURE__ */ jsx35(ChoiceMarksContext, { value: marks, children })
7227
+ /* @__PURE__ */ jsx36(ChoiceMarksContext, { value: marks, children })
7203
7228
  ]
7204
7229
  }
7205
7230
  ),
7206
- /* @__PURE__ */ jsx35(
7231
+ /* @__PURE__ */ jsx36(
7207
7232
  FieldSupport,
7208
7233
  {
7209
7234
  ids,
@@ -7222,13 +7247,13 @@ function ChoiceField({
7222
7247
  ) });
7223
7248
  }
7224
7249
  function ChoiceLabel({ className, children, ...rest }) {
7225
- const marks = React57.use(ChoiceMarksContext);
7250
+ const marks = React58.use(ChoiceMarksContext);
7226
7251
  const marked = marks && (marks.required || marks.optional);
7227
7252
  return /* @__PURE__ */ jsxs21("span", { className: cx(ChoiceField_default.text, className), ...rest, children: [
7228
7253
  children,
7229
7254
  marked ? /* @__PURE__ */ jsxs21(Fragment12, { children: [
7230
7255
  " ",
7231
- /* @__PURE__ */ jsx35(
7256
+ /* @__PURE__ */ jsx36(
7232
7257
  LabelMarks,
7233
7258
  {
7234
7259
  required: marks.required,
@@ -7249,7 +7274,7 @@ var Checkbox_default = {
7249
7274
  };
7250
7275
 
7251
7276
  // src/components/checkbox/Checkbox.tsx
7252
- import { Fragment as Fragment13, jsx as jsx36, jsxs as jsxs22 } from "react/jsx-runtime";
7277
+ import { Fragment as Fragment13, jsx as jsx37, jsxs as jsxs22 } from "react/jsx-runtime";
7253
7278
  var CHECKBOX_LABELS = { optional: "\u043D\u0435\u043E\u0431\u044F\u0437\u0430\u0442\u0435\u043B\u044C\u043D\u043E" };
7254
7279
  function CheckboxRoot({
7255
7280
  id,
@@ -7282,12 +7307,12 @@ function CheckboxRoot({
7282
7307
  defaultValue: defaultChecked,
7283
7308
  onChange: onCheckedChange
7284
7309
  });
7285
- const internalRef = React58.useRef(null);
7310
+ const internalRef = React59.useRef(null);
7286
7311
  const mergedRef = useMergedRefs(internalRef, ref);
7287
- React58.useLayoutEffect(() => {
7312
+ React59.useLayoutEffect(() => {
7288
7313
  if (internalRef.current) internalRef.current.indeterminate = indeterminate;
7289
7314
  });
7290
- return /* @__PURE__ */ jsx36(
7315
+ return /* @__PURE__ */ jsx37(
7291
7316
  ChoiceField,
7292
7317
  {
7293
7318
  ids,
@@ -7303,7 +7328,7 @@ function CheckboxRoot({
7303
7328
  error,
7304
7329
  className: cx(Checkbox_default.root, className),
7305
7330
  control: /* @__PURE__ */ jsxs22(Fragment13, { children: [
7306
- /* @__PURE__ */ jsx36(
7331
+ /* @__PURE__ */ jsx37(
7307
7332
  "input",
7308
7333
  {
7309
7334
  ...inputRest,
@@ -7322,13 +7347,13 @@ function CheckboxRoot({
7322
7347
  "aria-describedby": ids.describedBy
7323
7348
  }
7324
7349
  ),
7325
- /* @__PURE__ */ jsx36(
7350
+ /* @__PURE__ */ jsx37(
7326
7351
  "span",
7327
7352
  {
7328
7353
  className: cx(choiceVisualClass, choiceBoxClass, Checkbox_default.control),
7329
7354
  "data-shape": shape,
7330
7355
  "aria-hidden": "true",
7331
- children: /* @__PURE__ */ jsx36(
7356
+ children: /* @__PURE__ */ jsx37(
7332
7357
  CheckMark,
7333
7358
  {
7334
7359
  state: indeterminate ? "indeterminate" : checked ? "checked" : "unchecked"
@@ -7343,7 +7368,7 @@ function CheckboxRoot({
7343
7368
  }
7344
7369
  CheckboxRoot.displayName = "Checkbox.Root";
7345
7370
  function CheckboxLabel(props) {
7346
- return /* @__PURE__ */ jsx36(ChoiceLabel, { ...props });
7371
+ return /* @__PURE__ */ jsx37(ChoiceLabel, { ...props });
7347
7372
  }
7348
7373
  CheckboxLabel.displayName = "Checkbox.Label";
7349
7374
  function CheckboxIndicator({
@@ -7356,7 +7381,7 @@ function CheckboxIndicator({
7356
7381
  ...rest
7357
7382
  }) {
7358
7383
  const size = useControlSize(sizeProp);
7359
- return /* @__PURE__ */ jsx36(
7384
+ return /* @__PURE__ */ jsx37(
7360
7385
  "span",
7361
7386
  {
7362
7387
  "aria-hidden": "true",
@@ -7375,7 +7400,7 @@ function CheckboxIndicator({
7375
7400
  disabled: disabled || void 0
7376
7401
  }),
7377
7402
  ...rest,
7378
- children: /* @__PURE__ */ jsx36(CheckMark, { state: indeterminate ? "indeterminate" : checked ? "checked" : "unchecked" })
7403
+ children: /* @__PURE__ */ jsx37(CheckMark, { state: indeterminate ? "indeterminate" : checked ? "checked" : "unchecked" })
7379
7404
  }
7380
7405
  );
7381
7406
  }
@@ -7387,7 +7412,7 @@ var Checkbox = {
7387
7412
  };
7388
7413
 
7389
7414
  // src/components/thumbnail/Thumbnail.tsx
7390
- import * as React60 from "react";
7415
+ import * as React61 from "react";
7391
7416
 
7392
7417
  // src/internal/formatClock.ts
7393
7418
  var pad = (value) => String(value).padStart(2, "0");
@@ -7459,20 +7484,20 @@ var mediaDisk_default = {
7459
7484
  };
7460
7485
 
7461
7486
  // src/internal/mediaDisk.tsx
7462
- import { jsx as jsx37 } from "react/jsx-runtime";
7487
+ import { jsx as jsx38 } from "react/jsx-runtime";
7463
7488
  var mediaDiskClass = cx(fieldTierClass, mediaPill_default.ink, mediaDisk_default.disk);
7464
7489
  function MediaPlayMark({
7465
7490
  shown = true,
7466
7491
  className
7467
7492
  }) {
7468
- return /* @__PURE__ */ jsx37(
7493
+ return /* @__PURE__ */ jsx38(
7469
7494
  "span",
7470
7495
  {
7471
7496
  className: cx(mediaDiskClass, className),
7472
7497
  "data-size": "l",
7473
7498
  "data-shown": shown,
7474
7499
  "aria-hidden": "true",
7475
- children: /* @__PURE__ */ jsx37(Icon, { name: "action.play", fill: "currentColor" })
7500
+ children: /* @__PURE__ */ jsx38(Icon, { name: "action.play", fill: "currentColor" })
7476
7501
  }
7477
7502
  );
7478
7503
  }
@@ -7483,7 +7508,7 @@ function firstFrame(src) {
7483
7508
  }
7484
7509
 
7485
7510
  // src/internal/mediaSession.ts
7486
- import * as React59 from "react";
7511
+ import * as React60 from "react";
7487
7512
  var active = null;
7488
7513
  var audible = (media) => !media.muted && media.volume > 0;
7489
7514
  function claimPlayback(media) {
@@ -7495,7 +7520,7 @@ function releasePlayback(media) {
7495
7520
  if (active === media) active = null;
7496
7521
  }
7497
7522
  function useMediaSession(ref) {
7498
- React59.useEffect(() => {
7523
+ React60.useEffect(() => {
7499
7524
  const media = ref.current;
7500
7525
  if (!media) return;
7501
7526
  const claim = () => claimPlayback(media);
@@ -7532,7 +7557,7 @@ var Thumbnail_default = {
7532
7557
  };
7533
7558
 
7534
7559
  // src/components/thumbnail/Thumbnail.tsx
7535
- import { Fragment as Fragment14, jsx as jsx38, jsxs as jsxs23 } from "react/jsx-runtime";
7560
+ import { Fragment as Fragment14, jsx as jsx39, jsxs as jsxs23 } from "react/jsx-runtime";
7536
7561
  var slot2 = createImageSlot("Thumbnail", { image: Thumbnail_default.image, fallback: Thumbnail_default.fallback });
7537
7562
  function ThumbnailRoot({
7538
7563
  size: sizeProp,
@@ -7574,7 +7599,7 @@ function ThumbnailRoot({
7574
7599
  if (selectable) {
7575
7600
  const { onClick: onClick2 } = rest;
7576
7601
  return provide(
7577
- /* @__PURE__ */ jsx38(slot2.ImageSlotProvider, { children: /* @__PURE__ */ jsxs23(
7602
+ /* @__PURE__ */ jsx39(slot2.ImageSlotProvider, { children: /* @__PURE__ */ jsxs23(
7578
7603
  "button",
7579
7604
  {
7580
7605
  ...rest,
@@ -7589,7 +7614,7 @@ function ThumbnailRoot({
7589
7614
  },
7590
7615
  children: [
7591
7616
  children,
7592
- /* @__PURE__ */ jsx38("span", { className: cx(Thumbnail_default.check, mediaPill_default.choice), "aria-hidden": "true", children: /* @__PURE__ */ jsx38(Checkbox.Indicator, { checked, size: fullWidth ? "s" : compactTier(size) }) })
7617
+ /* @__PURE__ */ jsx39("span", { className: cx(Thumbnail_default.check, mediaPill_default.choice), "aria-hidden": "true", children: /* @__PURE__ */ jsx39(Checkbox.Indicator, { checked, size: fullWidth ? "s" : compactTier(size) }) })
7593
7618
  ]
7594
7619
  }
7595
7620
  ) })
@@ -7597,16 +7622,16 @@ function ThumbnailRoot({
7597
7622
  }
7598
7623
  if (asChild) {
7599
7624
  return provide(
7600
- /* @__PURE__ */ jsx38(slot2.ImageSlotProvider, { children: /* @__PURE__ */ jsx38(Slot, { ...rest, ...frame2, ref, children }) })
7625
+ /* @__PURE__ */ jsx39(slot2.ImageSlotProvider, { children: /* @__PURE__ */ jsx39(Slot, { ...rest, ...frame2, ref, children }) })
7601
7626
  );
7602
7627
  }
7603
7628
  return provide(
7604
- /* @__PURE__ */ jsx38(slot2.ImageSlotProvider, { children: /* @__PURE__ */ jsx38("div", { ref, ...frame2, ...rest, children }) })
7629
+ /* @__PURE__ */ jsx39(slot2.ImageSlotProvider, { children: /* @__PURE__ */ jsx39("div", { ref, ...frame2, ...rest, children }) })
7605
7630
  );
7606
7631
  }
7607
7632
  ThumbnailRoot.displayName = "Thumbnail.Root";
7608
7633
  function ThumbnailImage({ fit = "cover", ...rest }) {
7609
- return /* @__PURE__ */ jsx38(slot2.Image, { ...rest, "data-fit": fit });
7634
+ return /* @__PURE__ */ jsx39(slot2.Image, { ...rest, "data-fit": fit });
7610
7635
  }
7611
7636
  ThumbnailImage.displayName = "Thumbnail.Image";
7612
7637
  function ThumbnailVideoInner({
@@ -7626,22 +7651,22 @@ function ThumbnailVideoInner({
7626
7651
  ...rest
7627
7652
  }) {
7628
7653
  const report = slot2.useReportStatus();
7629
- const mute = React60.useCallback(
7654
+ const mute = React61.useCallback(
7630
7655
  (node) => {
7631
7656
  if (node) node.muted = autoPlay && !controls;
7632
7657
  },
7633
7658
  [autoPlay, controls]
7634
7659
  );
7635
- const sessionRef = React60.useRef(null);
7660
+ const sessionRef = React61.useRef(null);
7636
7661
  useMediaSession(sessionRef);
7637
7662
  const videoRef = useMergedRefs(mute, sessionRef, ref);
7638
7663
  const media = useImageStatus(report, { onError });
7639
- const [duration, setDuration] = React60.useState(null);
7640
- const [playing, setPlaying] = React60.useState(false);
7641
- const [still] = React60.useState(prefersReducedMotion);
7664
+ const [duration, setDuration] = React61.useState(null);
7665
+ const [playing, setPlaying] = React61.useState(false);
7666
+ const [still] = React61.useState(prefersReducedMotion);
7642
7667
  const loops = autoPlay && !still && !controls;
7643
7668
  return /* @__PURE__ */ jsxs23(Fragment14, { children: [
7644
- /* @__PURE__ */ jsx38(
7669
+ /* @__PURE__ */ jsx39(
7645
7670
  "video",
7646
7671
  {
7647
7672
  ...rest,
@@ -7676,12 +7701,12 @@ function ThumbnailVideoInner({
7676
7701
  }
7677
7702
  }
7678
7703
  ),
7679
- !controls && !loops ? /* @__PURE__ */ jsx38(MediaPlayMark, { shown: !playing, className: Thumbnail_default.play }) : null,
7680
- !controls && duration !== null ? /* @__PURE__ */ jsx38("span", { className: cx(textRole_default.caption, mediaPill_default.pill, Thumbnail_default.duration), children: formatDuration(duration) }) : null
7704
+ !controls && !loops ? /* @__PURE__ */ jsx39(MediaPlayMark, { shown: !playing, className: Thumbnail_default.play }) : null,
7705
+ !controls && duration !== null ? /* @__PURE__ */ jsx39("span", { className: cx(textRole_default.caption, mediaPill_default.pill, Thumbnail_default.duration), children: formatDuration(duration) }) : null
7681
7706
  ] });
7682
7707
  }
7683
7708
  function ThumbnailVideo(props) {
7684
- return /* @__PURE__ */ jsx38(ThumbnailVideoInner, { ...props }, props.src);
7709
+ return /* @__PURE__ */ jsx39(ThumbnailVideoInner, { ...props }, props.src);
7685
7710
  }
7686
7711
  ThumbnailVideo.displayName = "Thumbnail.Video";
7687
7712
  var ThumbnailFallback = slot2.Fallback;
@@ -7693,10 +7718,10 @@ var Thumbnail = {
7693
7718
  };
7694
7719
 
7695
7720
  // src/components/select/Select.tsx
7696
- import * as React64 from "react";
7721
+ import * as React65 from "react";
7697
7722
 
7698
7723
  // src/hooks/useLoadMore.ts
7699
- import * as React61 from "react";
7724
+ import * as React62 from "react";
7700
7725
  var LIST_ROOT_MARGIN = "0px 0px 48px 0px";
7701
7726
  var NONE2 = /* @__PURE__ */ Symbol("none");
7702
7727
  function useLoadMore({
@@ -7706,19 +7731,19 @@ function useLoadMore({
7706
7731
  round,
7707
7732
  rootMargin = LIST_ROOT_MARGIN
7708
7733
  }) {
7709
- const sentinelRef = React61.useRef(null);
7710
- const handlerRef = React61.useRef(onLoadMore);
7734
+ const sentinelRef = React62.useRef(null);
7735
+ const handlerRef = React62.useRef(onLoadMore);
7711
7736
  handlerRef.current = onLoadMore;
7712
- const askedIn = React61.useRef(NONE2);
7713
- React61.useLayoutEffect(() => {
7737
+ const askedIn = React62.useRef(NONE2);
7738
+ React62.useLayoutEffect(() => {
7714
7739
  if (!enabled) askedIn.current = NONE2;
7715
7740
  }, [enabled]);
7716
- const request = React61.useCallback(() => {
7741
+ const request = React62.useCallback(() => {
7717
7742
  if (!enabled || Object.is(askedIn.current, round)) return;
7718
7743
  askedIn.current = round;
7719
7744
  void handlerRef.current?.();
7720
7745
  }, [enabled, round]);
7721
- React61.useEffect(() => {
7746
+ React62.useEffect(() => {
7722
7747
  const root = scrollRef.current;
7723
7748
  const target = sentinelRef.current;
7724
7749
  if (!enabled || !root || !target || typeof IntersectionObserver === "undefined") return;
@@ -7735,10 +7760,10 @@ function useLoadMore({
7735
7760
  }
7736
7761
 
7737
7762
  // src/internal/MenuGroup.tsx
7738
- import * as React62 from "react";
7739
- import { jsx as jsx39, jsxs as jsxs24 } from "react/jsx-runtime";
7763
+ import * as React63 from "react";
7764
+ import { jsx as jsx40, jsxs as jsxs24 } from "react/jsx-runtime";
7740
7765
  function MenuGroup({ label, className, children, ...rest }) {
7741
- const labelId = React62.useId();
7766
+ const labelId = React63.useId();
7742
7767
  return (
7743
7768
  // biome-ignore lint/a11y/useSemanticElements: role="group" inside a menu / listbox; <fieldset> is not allowed there
7744
7769
  /* @__PURE__ */ jsxs24(
@@ -7749,7 +7774,7 @@ function MenuGroup({ label, className, children, ...rest }) {
7749
7774
  "aria-labelledby": label != null ? labelId : void 0,
7750
7775
  className: cx(menu_default.group, className),
7751
7776
  children: [
7752
- label != null ? /* @__PURE__ */ jsx39("div", { id: labelId, role: "presentation", className: cx(textRole_default.caption, menu_default.groupLabel), children: label }) : null,
7777
+ label != null ? /* @__PURE__ */ jsx40("div", { id: labelId, role: "presentation", className: cx(textRole_default.caption, menu_default.groupLabel), children: label }) : null,
7753
7778
  children
7754
7779
  ]
7755
7780
  }
@@ -7783,22 +7808,22 @@ var Select_default = {
7783
7808
  };
7784
7809
 
7785
7810
  // src/components/select/SelectItem.tsx
7786
- import * as React63 from "react";
7811
+ import * as React64 from "react";
7787
7812
 
7788
7813
  // src/components/select/selectContext.ts
7789
7814
  var normalize = (text) => text.trim().toLocaleLowerCase();
7790
7815
  var [SelectProvider, useSelectContext] = createComponentContext("Select");
7791
7816
 
7792
7817
  // src/components/select/SelectItem.tsx
7793
- import { jsx as jsx40, jsxs as jsxs25 } from "react/jsx-runtime";
7818
+ import { jsx as jsx41, jsxs as jsxs25 } from "react/jsx-runtime";
7794
7819
  function SelectItemIcon({ className, ...rest }) {
7795
- return /* @__PURE__ */ jsx40("span", { "aria-hidden": "true", className: cx(menu_default.itemIcon, iconSlotClass, className), ...rest });
7820
+ return /* @__PURE__ */ jsx41("span", { "aria-hidden": "true", className: cx(menu_default.itemIcon, iconSlotClass, className), ...rest });
7796
7821
  }
7797
7822
  SelectItemIcon.displayName = "Select.ItemIcon";
7798
- var OptionQueryContext = React63.createContext("");
7823
+ var OptionQueryContext = React64.createContext("");
7799
7824
  function SelectItemText({ children, className, ...rest }) {
7800
- const query = React63.useContext(OptionQueryContext);
7801
- return /* @__PURE__ */ jsx40("span", { ...rest, className: cx(Select_default.itemTitle, className), children: highlightChildren(children, query) });
7825
+ const query = React64.useContext(OptionQueryContext);
7826
+ return /* @__PURE__ */ jsx41("span", { ...rest, className: cx(Select_default.itemTitle, className), children: highlightChildren(children, query) });
7802
7827
  }
7803
7828
  SelectItemText.displayName = "Select.ItemText";
7804
7829
  function SelectItemDescription({
@@ -7806,12 +7831,12 @@ function SelectItemDescription({
7806
7831
  className,
7807
7832
  ...rest
7808
7833
  }) {
7809
- const query = React63.useContext(OptionQueryContext);
7810
- return /* @__PURE__ */ jsx40("span", { ...rest, className: cx(Select_default.itemDescription, className), children: highlightChildren(children, query) });
7834
+ const query = React64.useContext(OptionQueryContext);
7835
+ return /* @__PURE__ */ jsx41("span", { ...rest, className: cx(Select_default.itemDescription, className), children: highlightChildren(children, query) });
7811
7836
  }
7812
7837
  SelectItemDescription.displayName = "Select.ItemDescription";
7813
7838
  function SelectItemMeta({ children, className, ...rest }) {
7814
- return /* @__PURE__ */ jsx40("span", { ...rest, className: cx(Select_default.itemMeta, className), children });
7839
+ return /* @__PURE__ */ jsx41("span", { ...rest, className: cx(Select_default.itemMeta, className), children });
7815
7840
  }
7816
7841
  SelectItemMeta.displayName = "Select.ItemMeta";
7817
7842
  function splitItemChildren(children) {
@@ -7824,11 +7849,11 @@ function splitItemChildren(children) {
7824
7849
  description: ""
7825
7850
  };
7826
7851
  let plain = "";
7827
- for (const child of React63.Children.toArray(children)) {
7828
- if (!React63.isValidElement(child)) {
7852
+ for (const child of React64.Children.toArray(children)) {
7853
+ if (!React64.isValidElement(child)) {
7829
7854
  plain += nodeText(child);
7830
7855
  parts.body.push(child);
7831
- } else if (child.type === React63.Fragment) {
7856
+ } else if (child.type === React64.Fragment) {
7832
7857
  const inner = splitItemChildren(child.props.children);
7833
7858
  parts.leading.push(...inner.leading);
7834
7859
  parts.body.push(...inner.body);
@@ -7858,7 +7883,7 @@ function splitItemChildren(children) {
7858
7883
  }
7859
7884
  function sizeMedia(leading, size) {
7860
7885
  return leading.map(
7861
- (node) => React63.isValidElement(node) && (node.type === Thumbnail.Root || node.type === Avatar.Root) ? React63.cloneElement(node, {
7886
+ (node) => React64.isValidElement(node) && (node.type === Thumbnail.Root || node.type === Avatar.Root) ? React64.cloneElement(node, {
7862
7887
  size: node.props.size ?? tierMappings.rowMedia[size],
7863
7888
  className: cx(Select_default.media, node.props.className),
7864
7889
  "aria-hidden": true
@@ -7883,7 +7908,7 @@ function SelectItem({
7883
7908
  const haystack = normalize(`${resolvedLabel} ${parts.description} ${keywords ?? ""}`);
7884
7909
  const isSelected = selected.includes(value);
7885
7910
  const isHighlighted = useStoreSlice(highlight, (current) => current === value);
7886
- const nodeRef = React63.useRef(null);
7911
+ const nodeRef = React64.useRef(null);
7887
7912
  const setRefs = useMergedRefs(nodeRef, ref);
7888
7913
  useListboxItem(
7889
7914
  registry,
@@ -7922,11 +7947,11 @@ function SelectItem({
7922
7947
  rich: parts.rich || void 0
7923
7948
  }),
7924
7949
  children: [
7925
- multiple ? /* @__PURE__ */ jsx40(Checkbox.Indicator, { checked: isSelected, disabled, size: stepDown(size) }) : null,
7950
+ multiple ? /* @__PURE__ */ jsx41(Checkbox.Indicator, { checked: isSelected, disabled, size: stepDown(size) }) : null,
7926
7951
  sizeMedia(parts.leading, size),
7927
- /* @__PURE__ */ jsx40("span", { className: Select_default.itemText, children: /* @__PURE__ */ jsx40(OptionQueryContext.Provider, { value: query, children: highlightChildren(parts.body, query) }) }),
7952
+ /* @__PURE__ */ jsx41("span", { className: Select_default.itemText, children: /* @__PURE__ */ jsx41(OptionQueryContext.Provider, { value: query, children: highlightChildren(parts.body, query) }) }),
7928
7953
  parts.meta,
7929
- multiple ? null : /* @__PURE__ */ jsx40("span", { className: menu_default.check, "aria-hidden": "true", children: isSelected ? /* @__PURE__ */ jsx40(Icon, { name: "action.check" }) : null })
7954
+ multiple ? null : /* @__PURE__ */ jsx41("span", { className: menu_default.check, "aria-hidden": "true", children: isSelected ? /* @__PURE__ */ jsx41(Icon, { name: "action.check" }) : null })
7930
7955
  ]
7931
7956
  }
7932
7957
  )
@@ -7946,10 +7971,10 @@ function SelectAction({
7946
7971
  ...rest
7947
7972
  }) {
7948
7973
  const { highlight, listboxId, setOpen, size, registry } = useSelectContext();
7949
- const value = `${ACTION_PREFIX}${React63.useId()}`;
7974
+ const value = `${ACTION_PREFIX}${React64.useId()}`;
7950
7975
  const isHighlighted = useStoreSlice(highlight, (current) => current === value);
7951
7976
  const parts = splitItemChildren(children);
7952
- const nodeRef = React63.useRef(null);
7977
+ const nodeRef = React64.useRef(null);
7953
7978
  const setRefs = useMergedRefs(nodeRef, ref);
7954
7979
  useListboxItem(
7955
7980
  registry,
@@ -7994,7 +8019,7 @@ function SelectAction({
7994
8019
  }),
7995
8020
  children: [
7996
8021
  sizeMedia(parts.leading, size),
7997
- /* @__PURE__ */ jsx40("span", { className: Select_default.itemText, children: parts.body })
8022
+ /* @__PURE__ */ jsx41("span", { className: Select_default.itemText, children: parts.body })
7998
8023
  ]
7999
8024
  }
8000
8025
  )
@@ -8003,7 +8028,7 @@ function SelectAction({
8003
8028
  SelectAction.displayName = "Select.Action";
8004
8029
 
8005
8030
  // src/components/select/Select.tsx
8006
- import { Fragment as Fragment16, jsx as jsx41, jsxs as jsxs26 } from "react/jsx-runtime";
8031
+ import { Fragment as Fragment16, jsx as jsx42, jsxs as jsxs26 } from "react/jsx-runtime";
8007
8032
  var SELECT_LABELS = {
8008
8033
  search: "\u041F\u043E\u0438\u0441\u043A",
8009
8034
  empty: "\u041D\u0438\u0447\u0435\u0433\u043E \u043D\u0435 \u043D\u0430\u0439\u0434\u0435\u043D\u043E",
@@ -8067,7 +8092,7 @@ function SelectRoot(props) {
8067
8092
  const changes = usePendingChanges(stored, takeNext);
8068
8093
  const value = changes.shown;
8069
8094
  const saving = changes.pending.length > 0;
8070
- const [announcement, setAnnouncement] = React64.useState("");
8095
+ const [announcement, setAnnouncement] = React65.useState("");
8071
8096
  const onValueChange = props.onValueChange;
8072
8097
  const commit = (next) => {
8073
8098
  if (saving || Object.is(next, value)) return;
@@ -8082,9 +8107,9 @@ function SelectRoot(props) {
8082
8107
  onReject: () => setAnnouncement(labels.changeFailed)
8083
8108
  });
8084
8109
  };
8085
- const commitRef = React64.useRef(commit);
8110
+ const commitRef = React65.useRef(commit);
8086
8111
  commitRef.current = commit;
8087
- const selected = React64.useMemo(
8112
+ const selected = React65.useMemo(
8088
8113
  () => Array.isArray(value) ? value : value ? [value] : [],
8089
8114
  [value]
8090
8115
  );
@@ -8096,18 +8121,18 @@ function SelectRoot(props) {
8096
8121
  defaultValue: defaultSearch,
8097
8122
  onChange: onSearchChange
8098
8123
  });
8099
- const triggerRef = React64.useRef(null);
8100
- const inSegment = React64.useContext(InputSegmentContext);
8101
- const segment = React64.useMemo(
8124
+ const triggerRef = React65.useRef(null);
8125
+ const inSegment = React65.useContext(InputSegmentContext);
8126
+ const segment = React65.useMemo(
8102
8127
  () => inSegment ? { label: ariaLabel } : null,
8103
8128
  [inSegment, ariaLabel]
8104
8129
  );
8105
- const wasOpenRef = React64.useRef(isOpen);
8106
- React64.useEffect(() => {
8130
+ const wasOpenRef = React65.useRef(isOpen);
8131
+ React65.useEffect(() => {
8107
8132
  if (wasOpenRef.current && !isOpen) setQuery("");
8108
8133
  wasOpenRef.current = isOpen;
8109
8134
  }, [isOpen, setQuery]);
8110
- const pick = React64.useCallback(
8135
+ const pick = React65.useCallback(
8111
8136
  (optionValue) => {
8112
8137
  if (multiple) {
8113
8138
  const list = Array.isArray(value) ? value : [];
@@ -8121,8 +8146,8 @@ function SelectRoot(props) {
8121
8146
  },
8122
8147
  [multiple, value, setOpen]
8123
8148
  );
8124
- const clear = React64.useCallback(() => commitRef.current(multiple ? [] : ""), [multiple]);
8125
- const context = React64.useMemo(
8149
+ const clear = React65.useCallback(() => commitRef.current(multiple ? [] : ""), [multiple]);
8150
+ const context = React65.useMemo(
8126
8151
  () => ({
8127
8152
  size,
8128
8153
  invalid: ids.invalid,
@@ -8193,13 +8218,13 @@ function SelectRoot(props) {
8193
8218
  ]
8194
8219
  );
8195
8220
  const body = /* @__PURE__ */ jsxs26(Fragment16, { children: [
8196
- /* @__PURE__ */ jsx41(SelectProvider, { value: context, children }),
8197
- name ? (selected.length > 0 || multiple ? selected : [""]).map((item) => /* @__PURE__ */ jsx41("input", { type: "hidden", name, value: item, disabled }, item)) : null,
8198
- /* @__PURE__ */ jsx41(VisuallyHidden, { live: "polite", children: announcement })
8221
+ /* @__PURE__ */ jsx42(SelectProvider, { value: context, children }),
8222
+ name ? (selected.length > 0 || multiple ? selected : [""]).map((item) => /* @__PURE__ */ jsx42("input", { type: "hidden", name, value: item, disabled }, item)) : null,
8223
+ /* @__PURE__ */ jsx42(VisuallyHidden, { live: "polite", children: announcement })
8199
8224
  ] });
8200
8225
  if (segment) {
8201
8226
  return tier.provide(
8202
- /* @__PURE__ */ jsx41(
8227
+ /* @__PURE__ */ jsx42(
8203
8228
  "div",
8204
8229
  {
8205
8230
  ...rest,
@@ -8212,7 +8237,7 @@ function SelectRoot(props) {
8212
8237
  );
8213
8238
  }
8214
8239
  return tier.provide(
8215
- /* @__PURE__ */ jsx41(
8240
+ /* @__PURE__ */ jsx42(
8216
8241
  FieldFrame,
8217
8242
  {
8218
8243
  ...rest,
@@ -8269,8 +8294,8 @@ function SelectTrigger({
8269
8294
  useListboxView(registry);
8270
8295
  const valueText = selected.map(registry.labelOf).join(", ");
8271
8296
  const segmentName = segment?.label ? valueText ? `${segment.label}: ${valueText}` : segment.label : void 0;
8272
- const parts = React64.Children.toArray(children);
8273
- const iconOnly = parts.some((node) => React64.isValidElement(node) && node.type === SelectTriggerIcon) && !parts.some((node) => React64.isValidElement(node) && node.type === SelectValue);
8297
+ const parts = React65.Children.toArray(children);
8298
+ const iconOnly = parts.some((node) => React65.isValidElement(node) && node.type === SelectTriggerIcon) && !parts.some((node) => React65.isValidElement(node) && node.type === SelectValue);
8274
8299
  const busy = loading || saving;
8275
8300
  const showClear = clearable && selected.length > 0 && !disabled && !busy;
8276
8301
  const clearPresence = usePartPresence({ present: showClear, axis: "inline" });
@@ -8326,13 +8351,13 @@ function SelectTrigger({
8326
8351
  children: [
8327
8352
  /* @__PURE__ */ jsxs26("span", { className: Select_default.triggerMain, children: [
8328
8353
  children,
8329
- iconOnly ? /* @__PURE__ */ jsx41(SelectValue, { className: visuallyHiddenClass }) : null
8354
+ iconOnly ? /* @__PURE__ */ jsx42(SelectValue, { className: visuallyHiddenClass }) : null
8330
8355
  ] }),
8331
8356
  showClear ? (
8332
8357
  // A segment, not a button: interactive content inside a <button> is invalid. The keyboard
8333
8358
  // clears with Delete / Backspace on the trigger. A touch target in height, like the clear
8334
8359
  // segment of a field (`FieldAction`).
8335
- /* @__PURE__ */ jsx41(
8360
+ /* @__PURE__ */ jsx42(
8336
8361
  "span",
8337
8362
  {
8338
8363
  ref: clearPresence.ref,
@@ -8345,11 +8370,11 @@ function SelectTrigger({
8345
8370
  event.stopPropagation();
8346
8371
  clear();
8347
8372
  },
8348
- children: /* @__PURE__ */ jsx41(Icon, { name: "action.close" })
8373
+ children: /* @__PURE__ */ jsx42(Icon, { name: "action.close" })
8349
8374
  }
8350
8375
  )
8351
8376
  ) : null,
8352
- /* @__PURE__ */ jsx41("span", { className: Select_default.chevron, "aria-hidden": "true", children: /* @__PURE__ */ jsx41(GlyphSwap, { children: busy ? /* @__PURE__ */ jsx41(Spinner, { "aria-hidden": "true" }) : /* @__PURE__ */ jsx41(Icon, { name: "nav.chevronDown" }) }) })
8377
+ /* @__PURE__ */ jsx42("span", { className: Select_default.chevron, "aria-hidden": "true", children: /* @__PURE__ */ jsx42(GlyphSwap, { children: busy ? /* @__PURE__ */ jsx42(Spinner, { "aria-hidden": "true" }) : /* @__PURE__ */ jsx42(Icon, { name: "nav.chevronDown" }) }) })
8353
8378
  ]
8354
8379
  }
8355
8380
  );
@@ -8373,13 +8398,13 @@ function SelectValue({ renderValue, className, ...rest }) {
8373
8398
  }),
8374
8399
  children: [
8375
8400
  sizeMedia(parts.leading, size),
8376
- /* @__PURE__ */ jsx41("span", { className: Select_default.valueBody, children: parts.body }),
8401
+ /* @__PURE__ */ jsx42("span", { className: Select_default.valueBody, children: parts.body }),
8377
8402
  parts.meta
8378
8403
  ]
8379
8404
  }
8380
8405
  );
8381
8406
  }
8382
- return /* @__PURE__ */ jsx41(
8407
+ return /* @__PURE__ */ jsx42(
8383
8408
  "span",
8384
8409
  {
8385
8410
  ...rest,
@@ -8391,19 +8416,19 @@ function SelectValue({ renderValue, className, ...rest }) {
8391
8416
  }
8392
8417
  SelectValue.displayName = "Select.Value";
8393
8418
  function SelectTriggerIcon({ className, ...rest }) {
8394
- return /* @__PURE__ */ jsx41("span", { "aria-hidden": "true", className: cx(Select_default.triggerIcon, className), ...rest });
8419
+ return /* @__PURE__ */ jsx42("span", { "aria-hidden": "true", className: cx(Select_default.triggerIcon, className), ...rest });
8395
8420
  }
8396
8421
  SelectTriggerIcon.displayName = "Select.TriggerIcon";
8397
8422
  var LOADING_ROWS2 = 4;
8398
8423
  var LOADING_MORE_ROWS = 2;
8399
8424
  function SkeletonRows({ count }) {
8400
- return Array.from({ length: count }, (_, index) => /* @__PURE__ */ jsx41(
8425
+ return Array.from({ length: count }, (_, index) => /* @__PURE__ */ jsx42(
8401
8426
  "div",
8402
8427
  {
8403
8428
  "aria-hidden": "true",
8404
8429
  className: cx(menu_default.item, menu_default.skeletonRow),
8405
8430
  "data-skeleton": "",
8406
- children: /* @__PURE__ */ jsx41(Skeleton, {})
8431
+ children: /* @__PURE__ */ jsx42(Skeleton, {})
8407
8432
  },
8408
8433
  index
8409
8434
  ));
@@ -8433,12 +8458,12 @@ function SelectContent({ searchable = false, className, children, ...rest }) {
8433
8458
  labels,
8434
8459
  registry
8435
8460
  } = useSelectContext();
8436
- const listboxRef = React64.useRef(null);
8461
+ const listboxRef = React65.useRef(null);
8437
8462
  const setListboxRef = useMergedRefs(listboxRef);
8438
8463
  const items = [];
8439
8464
  const actions = [];
8440
- for (const child of React64.Children.toArray(children)) {
8441
- (React64.isValidElement(child) && child.type === SelectAction ? actions : items).push(child);
8465
+ for (const child of React65.Children.toArray(children)) {
8466
+ (React65.isValidElement(child) && child.type === SelectAction ? actions : items).push(child);
8442
8467
  }
8443
8468
  const actionsId = `${listboxId}-actions`;
8444
8469
  const floating = useFloatingLayer({
@@ -8465,7 +8490,7 @@ function SelectContent({ searchable = false, className, children, ...rest }) {
8465
8490
  });
8466
8491
  const setSentinelRef = useMergedRefs(sentinelRef);
8467
8492
  const lastOption = view.navigable.filter((id) => !isActionValue(id)).at(-1);
8468
- React64.useEffect(() => {
8493
+ React65.useEffect(() => {
8469
8494
  if (highlighted !== void 0 && highlighted === lastOption) requestMore();
8470
8495
  }, [highlighted, lastOption, requestMore]);
8471
8496
  const handleKeyDown = (event) => {
@@ -8496,7 +8521,7 @@ function SelectContent({ searchable = false, className, children, ...rest }) {
8496
8521
  });
8497
8522
  if (moved !== null) revealHighlighted(registry.nodeOf(moved));
8498
8523
  };
8499
- if (!floating.mounted) return /* @__PURE__ */ jsx41("div", { hidden: true, children: items });
8524
+ if (!floating.mounted) return /* @__PURE__ */ jsx42("div", { hidden: true, children: items });
8500
8525
  const activeDescendant = isOpen && highlighted !== void 0 ? optionDomId(listboxId, highlighted) : void 0;
8501
8526
  return /* @__PURE__ */ jsxs26(
8502
8527
  FloatingPanel,
@@ -8511,11 +8536,11 @@ function SelectContent({ searchable = false, className, children, ...rest }) {
8511
8536
  searchable ? (
8512
8537
  // The permanent focus of the panel: no ring, the caret is the indicator (foundation §7).
8513
8538
  /* @__PURE__ */ jsxs26("div", { className: cx(menu_default.searchRow, Select_default.search), children: [
8514
- /* @__PURE__ */ jsx41(Icon, { name: "action.search", size: "s" }),
8515
- /* @__PURE__ */ jsx41(
8539
+ /* @__PURE__ */ jsx42(Icon, { name: "action.search", size: "s" }),
8540
+ /* @__PURE__ */ jsx42(
8516
8541
  "input",
8517
8542
  {
8518
- type: "text",
8543
+ type: "search",
8519
8544
  className: menu_default.searchInput,
8520
8545
  value: query,
8521
8546
  placeholder: labels.search,
@@ -8523,7 +8548,7 @@ function SelectContent({ searchable = false, className, children, ...rest }) {
8523
8548
  "aria-controls": region === "error" ? void 0 : listboxId,
8524
8549
  "aria-activedescendant": activeDescendant,
8525
8550
  "aria-autocomplete": "list",
8526
- autoComplete: "off",
8551
+ ...AUTOFILL_OFF,
8527
8552
  spellCheck: false,
8528
8553
  "data-autofocus": "",
8529
8554
  onChange: (event) => setQuery(event.target.value)
@@ -8531,10 +8556,10 @@ function SelectContent({ searchable = false, className, children, ...rest }) {
8531
8556
  )
8532
8557
  ] })
8533
8558
  ) : null,
8534
- /* @__PURE__ */ jsx41(RegionSwap, { state: region, fill: true, children: region === "error" ? /* @__PURE__ */ jsxs26(EmptyPage.Root, { layout: "compact", size, role: "alert", children: [
8535
- /* @__PURE__ */ jsx41(EmptyPage.Title, { as: "p", children: loadError }),
8536
- onRetry ? /* @__PURE__ */ jsx41(EmptyPage.Actions, { children: /* @__PURE__ */ jsxs26(Button.Root, { variant: "soft", tone: "neutral", onClick: onRetry, children: [
8537
- /* @__PURE__ */ jsx41(Button.Icon, { children: /* @__PURE__ */ jsx41(Icon, { name: "action.refresh" }) }),
8559
+ /* @__PURE__ */ jsx42(RegionSwap, { state: region, fill: true, children: region === "error" ? /* @__PURE__ */ jsxs26(EmptyPage.Root, { layout: "compact", size, role: "alert", children: [
8560
+ /* @__PURE__ */ jsx42(EmptyPage.Title, { as: "p", children: loadError }),
8561
+ onRetry ? /* @__PURE__ */ jsx42(EmptyPage.Actions, { children: /* @__PURE__ */ jsxs26(Button.Root, { variant: "soft", tone: "neutral", onClick: onRetry, children: [
8562
+ /* @__PURE__ */ jsx42(Button.Icon, { children: /* @__PURE__ */ jsx42(Icon, { name: "action.refresh" }) }),
8538
8563
  labels.retry
8539
8564
  ] }) }) : null
8540
8565
  ] }) : /* @__PURE__ */ jsxs26(Fragment16, { children: [
@@ -8554,22 +8579,22 @@ function SelectContent({ searchable = false, className, children, ...rest }) {
8554
8579
  className: Select_default.listbox,
8555
8580
  children: [
8556
8581
  items,
8557
- region === "loading" ? /* @__PURE__ */ jsx41(SkeletonRows, { count: LOADING_ROWS2 }) : null,
8558
- region === "ready" && hasMore ? /* @__PURE__ */ jsx41("div", { ref: setSentinelRef, "aria-hidden": "true", className: menu_default.loadSentinel }) : null,
8559
- region === "ready" && loadingMore ? /* @__PURE__ */ jsx41(SkeletonRows, { count: LOADING_MORE_ROWS }) : null
8582
+ region === "loading" ? /* @__PURE__ */ jsx42(SkeletonRows, { count: LOADING_ROWS2 }) : null,
8583
+ region === "ready" && hasMore ? /* @__PURE__ */ jsx42("div", { ref: setSentinelRef, "aria-hidden": "true", className: menu_default.loadSentinel }) : null,
8584
+ region === "ready" && loadingMore ? /* @__PURE__ */ jsx42(SkeletonRows, { count: LOADING_MORE_ROWS }) : null
8560
8585
  ]
8561
8586
  }
8562
8587
  ),
8563
- region === "ready" && isEmpty ? /* @__PURE__ */ jsx41(EmptyPage.Root, { layout: "compact", size, role: "status", children: /* @__PURE__ */ jsx41(EmptyPage.Title, { as: "p", children: labels.empty }) }) : null,
8588
+ region === "ready" && isEmpty ? /* @__PURE__ */ jsx42(EmptyPage.Root, { layout: "compact", size, role: "status", children: /* @__PURE__ */ jsx42(EmptyPage.Title, { as: "p", children: labels.empty }) }) : null,
8564
8589
  actions.length > 0 ? (
8565
8590
  // Owned by the listbox (`aria-owns`): its options for assistive tech, pinned under
8566
8591
  // the scroller and the empty state for the eye.
8567
8592
  // biome-ignore lint/a11y/useSemanticElements: a group of options inside a listbox, not a form fieldset
8568
- /* @__PURE__ */ jsx41("div", { id: actionsId, role: "group", className: Select_default.actions, children: actions })
8593
+ /* @__PURE__ */ jsx42("div", { id: actionsId, role: "group", className: Select_default.actions, children: actions })
8569
8594
  ) : null
8570
8595
  ] }) }),
8571
- /* @__PURE__ */ jsx41(VisuallyHidden, { live: "polite", children: loading || loadingMore ? labels.loading : "" }),
8572
- /* @__PURE__ */ jsx41(HighlightOnOpen, {})
8596
+ /* @__PURE__ */ jsx42(VisuallyHidden, { live: "polite", children: loading || loadingMore ? labels.loading : "" }),
8597
+ /* @__PURE__ */ jsx42(HighlightOnOpen, {})
8573
8598
  ]
8574
8599
  }
8575
8600
  );
@@ -8578,9 +8603,9 @@ SelectContent.displayName = "Select.Content";
8578
8603
  function HighlightOnOpen() {
8579
8604
  const { isOpen, query, filter, selected, registry, highlight } = useSelectContext();
8580
8605
  const view = useListboxView(registry, query, filter);
8581
- const latest = React64.useRef({ query, filter, selected });
8606
+ const latest = React65.useRef({ query, filter, selected });
8582
8607
  latest.current = { query, filter, selected };
8583
- React64.useLayoutEffect(() => {
8608
+ React65.useLayoutEffect(() => {
8584
8609
  if (!isOpen) return;
8585
8610
  const { query: text, filter: filtered, selected: picked } = latest.current;
8586
8611
  const first = registry.view(text, filtered).navigable.find((id) => picked.includes(id));
@@ -8588,12 +8613,12 @@ function HighlightOnOpen() {
8588
8613
  if (first !== void 0) revealHighlighted(registry.nodeOf(first));
8589
8614
  return () => highlight.set(void 0);
8590
8615
  }, [isOpen, registry, highlight]);
8591
- const latestView = React64.useRef(view);
8616
+ const latestView = React65.useRef(view);
8592
8617
  latestView.current = view;
8593
- React64.useLayoutEffect(() => {
8618
+ React65.useLayoutEffect(() => {
8594
8619
  if (query !== "") highlight.set(latestView.current.navigable[0]);
8595
8620
  }, [query, highlight]);
8596
- React64.useLayoutEffect(() => {
8621
+ React65.useLayoutEffect(() => {
8597
8622
  if (query === "") return;
8598
8623
  const current = highlight.get();
8599
8624
  if (current === void 0 || isActionValue(current) || !view.navigable.includes(current)) {
@@ -8603,11 +8628,11 @@ function HighlightOnOpen() {
8603
8628
  return null;
8604
8629
  }
8605
8630
  function SelectGroup({ className, ...rest }) {
8606
- return /* @__PURE__ */ jsx41(MenuGroup, { ...rest, className: cx(Select_default.group, className) });
8631
+ return /* @__PURE__ */ jsx42(MenuGroup, { ...rest, className: cx(Select_default.group, className) });
8607
8632
  }
8608
8633
  SelectGroup.displayName = "Select.Group";
8609
8634
  function SelectSeparator({ className, ...rest }) {
8610
- return /* @__PURE__ */ jsx41(Divider, { ...rest, className: cx(menu_default.separator, Select_default.separator, className) });
8635
+ return /* @__PURE__ */ jsx42(Divider, { ...rest, className: cx(menu_default.separator, Select_default.separator, className) });
8611
8636
  }
8612
8637
  SelectSeparator.displayName = "Select.Separator";
8613
8638
  var Select = {
@@ -8627,7 +8652,7 @@ var Select = {
8627
8652
  };
8628
8653
 
8629
8654
  // src/internal/swatch.tsx
8630
- import * as React65 from "react";
8655
+ import * as React66 from "react";
8631
8656
 
8632
8657
  // src/internal/swatch.module.css
8633
8658
  var swatch_default = {
@@ -8644,7 +8669,7 @@ var swatch_default = {
8644
8669
  };
8645
8670
 
8646
8671
  // src/internal/swatch.tsx
8647
- import { Fragment as Fragment17, jsx as jsx42, jsxs as jsxs27 } from "react/jsx-runtime";
8672
+ import { Fragment as Fragment17, jsx as jsx43, jsxs as jsxs27 } from "react/jsx-runtime";
8648
8673
  var COLOR_PRESETS = [
8649
8674
  { value: "#ef4444", label: "\u041A\u0440\u0430\u0441\u043D\u044B\u0439" },
8650
8675
  { value: "#f97316", label: "\u041E\u0440\u0430\u043D\u0436\u0435\u0432\u044B\u0439" },
@@ -8677,7 +8702,7 @@ var PALETTE_COLOR_NAMES = {
8677
8702
  };
8678
8703
  var PALETTE_ORDER = Object.keys(PALETTE_COLOR_NAMES);
8679
8704
  function useSwatchOptions(presets, allowEmpty, emptyLabel) {
8680
- return React65.useMemo(
8705
+ return React66.useMemo(
8681
8706
  () => [
8682
8707
  ...presets.map((preset) => ({ ...preset, contrast: markContrast(preset.value) })),
8683
8708
  ...allowEmpty ? [{ value: null, label: emptyLabel, contrast: "surface" }] : []
@@ -8686,7 +8711,7 @@ function useSwatchOptions(presets, allowEmpty, emptyLabel) {
8686
8711
  );
8687
8712
  }
8688
8713
  function usePaletteOptions(palette, allowEmpty, emptyLabel, names) {
8689
- return React65.useMemo(
8714
+ return React66.useMemo(
8690
8715
  () => [
8691
8716
  ...palette.map((hue) => ({ value: hue, label: names[hue], contrast: "hue" })),
8692
8717
  ...allowEmpty ? [{ value: null, label: emptyLabel, contrast: "surface" }] : []
@@ -8700,9 +8725,9 @@ var swatchTierClass = cx(fieldTierClass, swatch_default.tier);
8700
8725
  var swatchGridClass = swatch_default.grid;
8701
8726
  var checkerboardClass = swatch_default.checkerboard;
8702
8727
  function SwatchFill({ value, hue = false }) {
8703
- if (value == null) return /* @__PURE__ */ jsx42("span", { "aria-hidden": true, className: swatch_default.checker });
8704
- if (hue) return /* @__PURE__ */ jsx42("span", { "aria-hidden": true, className: cx(swatch_default.fill, swatch_default.hueFill) });
8705
- return /* @__PURE__ */ jsx42("svg", { className: swatch_default.fill, "aria-hidden": "true", viewBox: "0 0 1 1", preserveAspectRatio: "none", children: /* @__PURE__ */ jsx42("rect", { width: "1", height: "1", fill: value }) });
8728
+ if (value == null) return /* @__PURE__ */ jsx43("span", { "aria-hidden": true, className: swatch_default.checker });
8729
+ if (hue) return /* @__PURE__ */ jsx43("span", { "aria-hidden": true, className: cx(swatch_default.fill, swatch_default.hueFill) });
8730
+ return /* @__PURE__ */ jsx43("svg", { className: swatch_default.fill, "aria-hidden": "true", viewBox: "0 0 1 1", preserveAspectRatio: "none", children: /* @__PURE__ */ jsx43("rect", { width: "1", height: "1", fill: value }) });
8706
8731
  }
8707
8732
  function SwatchContent({
8708
8733
  value,
@@ -8710,12 +8735,12 @@ function SwatchContent({
8710
8735
  hue = false
8711
8736
  }) {
8712
8737
  return /* @__PURE__ */ jsxs27(Fragment17, { children: [
8713
- /* @__PURE__ */ jsx42(SwatchFill, { value, hue }),
8714
- /* @__PURE__ */ jsx42(CheckMark, { state: selected ? "checked" : "unchecked", className: swatch_default.check })
8738
+ /* @__PURE__ */ jsx43(SwatchFill, { value, hue }),
8739
+ /* @__PURE__ */ jsx43(CheckMark, { state: selected ? "checked" : "unchecked", className: swatch_default.check })
8715
8740
  ] });
8716
8741
  }
8717
8742
  function SwatchChip({ value, className, ...rest }) {
8718
- return /* @__PURE__ */ jsx42("span", { ...rest, "aria-hidden": true, className: cx(swatch_default.chip, className), children: /* @__PURE__ */ jsx42(SwatchFill, { value }) });
8743
+ return /* @__PURE__ */ jsx43("span", { ...rest, "aria-hidden": true, className: cx(swatch_default.chip, className), children: /* @__PURE__ */ jsx43(SwatchFill, { value }) });
8719
8744
  }
8720
8745
  function parseHexColor(text) {
8721
8746
  const hex = /^#?([0-9a-f]{3}|[0-9a-f]{6})$/i.exec(text.trim())?.[1]?.toLowerCase();
@@ -8769,15 +8794,15 @@ function balancedColumns(count, width, cell, gap) {
8769
8794
  return Math.ceil(count / rows);
8770
8795
  }
8771
8796
  function useBalancedColumns(gridRef, count, cellSelector) {
8772
- const [columns, setColumns] = React65.useState();
8773
- const measure = React65.useCallback(() => {
8797
+ const [columns, setColumns] = React66.useState();
8798
+ const measure = React66.useCallback(() => {
8774
8799
  const grid = gridRef.current;
8775
8800
  if (!grid) return;
8776
8801
  const cell = grid.querySelector(cellSelector)?.offsetHeight ?? 0;
8777
8802
  const gap = Number.parseFloat(getComputedStyle(grid).columnGap) || 0;
8778
8803
  setColumns(cell > 0 ? balancedColumns(count, grid.clientWidth, cell, gap) : void 0);
8779
8804
  }, [gridRef, count, cellSelector]);
8780
- React65.useLayoutEffect(measure, [measure]);
8805
+ React66.useLayoutEffect(measure, [measure]);
8781
8806
  useResizeEffect(gridRef, measure);
8782
8807
  return columns;
8783
8808
  }
@@ -8787,14 +8812,14 @@ function firstRowLength(items) {
8787
8812
  return Math.max(1, count === -1 ? items.length : count);
8788
8813
  }
8789
8814
  function useSwatchGrid(count) {
8790
- const items = React65.useRef([]);
8791
- const itemRef = React65.useCallback(
8815
+ const items = React66.useRef([]);
8816
+ const itemRef = React66.useCallback(
8792
8817
  (index) => (node) => {
8793
8818
  items.current[index] = node;
8794
8819
  },
8795
8820
  []
8796
8821
  );
8797
- const move = React65.useCallback(
8822
+ const move = React66.useCallback(
8798
8823
  (event, from, columns) => {
8799
8824
  const focused = document.activeElement;
8800
8825
  const current = focused instanceof HTMLElement ? items.current.indexOf(focused) : -1;
@@ -8811,14 +8836,14 @@ function useSwatchGrid(count) {
8811
8836
  },
8812
8837
  [count]
8813
8838
  );
8814
- const focus = React65.useCallback((index) => {
8839
+ const focus = React66.useCallback((index) => {
8815
8840
  items.current[index]?.focus({ preventScroll: true });
8816
8841
  }, []);
8817
8842
  return { itemRef, move, focus };
8818
8843
  }
8819
8844
 
8820
8845
  // src/components/color-swatches/ColorSwatches.tsx
8821
- import * as React66 from "react";
8846
+ import * as React67 from "react";
8822
8847
 
8823
8848
  // src/components/color-swatches/ColorSwatches.module.css
8824
8849
  var ColorSwatches_default = {
@@ -8826,7 +8851,7 @@ var ColorSwatches_default = {
8826
8851
  };
8827
8852
 
8828
8853
  // src/components/color-swatches/ColorSwatches.tsx
8829
- import { jsx as jsx43, jsxs as jsxs28 } from "react/jsx-runtime";
8854
+ import { jsx as jsx44, jsxs as jsxs28 } from "react/jsx-runtime";
8830
8855
  var COLOR_SWATCHES_LABELS = {
8831
8856
  group: "\u0426\u0432\u0435\u0442",
8832
8857
  empty: "\u0411\u0435\u0437 \u0446\u0432\u0435\u0442\u0430",
@@ -8843,7 +8868,7 @@ function ColorSwatches(props) {
8843
8868
  palette = PALETTE_ORDER,
8844
8869
  ...rest
8845
8870
  } = props;
8846
- return /* @__PURE__ */ jsx43(
8871
+ return /* @__PURE__ */ jsx44(
8847
8872
  SwatchGrid,
8848
8873
  {
8849
8874
  ...rest,
@@ -8886,7 +8911,7 @@ function SwatchGrid({
8886
8911
  const disabled = useInheritedDisabled(disabledProp);
8887
8912
  const frameSize = useControlSize(void 0);
8888
8913
  const merged = useLabels(COLOR_SWATCHES_LABELS, labelsProp);
8889
- const labels = React66.useMemo(
8914
+ const labels = React67.useMemo(
8890
8915
  () => ({
8891
8916
  ...merged,
8892
8917
  colorNames: { ...COLOR_SWATCHES_LABELS.colorNames, ...labelsProp?.colorNames }
@@ -8905,14 +8930,14 @@ function SwatchGrid({
8905
8930
  const selectedIndex = options.findIndex((option) => sameColor(option.value, value));
8906
8931
  const focusIndex = Math.max(0, selectedIndex);
8907
8932
  const grid = useSwatchGrid(options.length);
8908
- const gridRef = React66.useRef(null);
8933
+ const gridRef = React67.useRef(null);
8909
8934
  const columns = useBalancedColumns(gridRef, options.length, "[role='radio']");
8910
8935
  const labelledBy = ariaLabelledBy ?? ids.labelledBy;
8911
8936
  const onKeyDown2 = (event) => {
8912
8937
  const next = grid.move(event, focusIndex);
8913
8938
  if (next !== null) setValue(options[next]?.value ?? null);
8914
8939
  };
8915
- return /* @__PURE__ */ jsx43(
8940
+ return /* @__PURE__ */ jsx44(
8916
8941
  FieldFrame,
8917
8942
  {
8918
8943
  ...rest,
@@ -8957,7 +8982,7 @@ function SwatchGrid({
8957
8982
  const selected = index === selectedIndex;
8958
8983
  return (
8959
8984
  // 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
8960
- /* @__PURE__ */ jsx43(
8985
+ /* @__PURE__ */ jsx44(
8961
8986
  "button",
8962
8987
  {
8963
8988
  ref: grid.itemRef(index),
@@ -8975,13 +9000,13 @@ function SwatchGrid({
8975
9000
  color: hues ? option.value ?? void 0 : void 0
8976
9001
  }),
8977
9002
  onClick: () => setValue(option.value),
8978
- children: /* @__PURE__ */ jsx43(SwatchContent, { value: option.value, selected, hue: hues })
9003
+ children: /* @__PURE__ */ jsx44(SwatchContent, { value: option.value, selected, hue: hues })
8979
9004
  },
8980
9005
  option.value ?? "empty"
8981
9006
  )
8982
9007
  );
8983
9008
  }),
8984
- name ? /* @__PURE__ */ jsx43("input", { type: "hidden", name, value: value ?? "" }) : null
9009
+ name ? /* @__PURE__ */ jsx44("input", { type: "hidden", name, value: value ?? "" }) : null
8985
9010
  ]
8986
9011
  }
8987
9012
  )
@@ -9118,6 +9143,9 @@ export {
9118
9143
  useFieldFrame,
9119
9144
  FieldFrame,
9120
9145
  FieldCounter,
9146
+ AUTOFILL_OFF,
9147
+ AutofillScope,
9148
+ useAutofill,
9121
9149
  FieldActionButton,
9122
9150
  FieldCopyButton,
9123
9151
  setControlValue,