xmlui 0.10.24 → 0.10.25

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 (36) hide show
  1. package/dist/lib/{index-DoIVkz5T.mjs → index-CCEPGw_x.mjs} +476 -477
  2. package/dist/lib/index.css +1 -1
  3. package/dist/lib/{initMock-CSGEd746.mjs → initMock-DFcCR7ey.mjs} +1 -1
  4. package/dist/lib/xmlui.d.ts +1 -0
  5. package/dist/lib/xmlui.mjs +1 -1
  6. package/dist/metadata/{collectedComponentMetadata-B3Hs8_cV.mjs → collectedComponentMetadata-mwkNkxN_.mjs} +472 -473
  7. package/dist/metadata/{initMock-DQrGwkya.mjs → initMock-BVxHA6wu.mjs} +1 -1
  8. package/dist/metadata/style.css +1 -1
  9. package/dist/metadata/xmlui-metadata.mjs +1 -1
  10. package/dist/metadata/xmlui-metadata.umd.js +3 -3
  11. package/dist/scripts/package.json +1 -1
  12. package/dist/scripts/src/components/AppHeader/AppHeaderNative.js +2 -1
  13. package/dist/scripts/src/components/AutoComplete/AutoComplete.spec.js +1 -1
  14. package/dist/scripts/src/components/AutoComplete/AutoCompleteNative.js +30 -5
  15. package/dist/scripts/src/components/Form/Form.spec.js +2 -2
  16. package/dist/scripts/src/components/FormItem/FormItemNative.js +5 -1
  17. package/dist/scripts/src/components/ModalDialog/ModalDialog.js +4 -6
  18. package/dist/scripts/src/components/ModalDialog/ModalDialog.spec.js +19 -0
  19. package/dist/scripts/src/components/NavGroup/NavGroup.spec.js +103 -11
  20. package/dist/scripts/src/components/NavGroup/NavGroupNative.js +6 -1
  21. package/dist/scripts/src/components/Option/Option.spec.js +3 -1
  22. package/dist/scripts/src/components/Select/HiddenOption.js +3 -3
  23. package/dist/scripts/src/components/Select/Select.js +2 -3
  24. package/dist/scripts/src/components/Select/Select.spec.js +4 -6
  25. package/dist/scripts/src/components/Select/SelectNative.js +187 -47
  26. package/dist/scripts/src/components-core/rendering/ComponentAdapter.js +11 -0
  27. package/dist/scripts/src/components-core/rendering/Container.js +3 -4
  28. package/dist/scripts/src/components-core/rendering/StateContainer.js +16 -18
  29. package/dist/scripts/src/components-core/rendering/reducer.js +6 -3
  30. package/dist/scripts/src/testing/ComponentDrivers.js +1 -1
  31. package/dist/standalone/xmlui-standalone.es.d.ts +1 -0
  32. package/dist/standalone/xmlui-standalone.umd.js +18 -18
  33. package/package.json +1 -1
  34. package/dist/scripts/src/components/Select/MultiSelectOption.js +0 -42
  35. package/dist/scripts/src/components/Select/SelectOption.js +0 -34
  36. package/dist/scripts/src/components/Select/SimpleSelect.js +0 -57
@@ -17,17 +17,15 @@ import * as ReactDropdownMenu from "@radix-ui/react-dropdown-menu";
17
17
  import { DropdownMenu as DropdownMenu$1, DropdownMenuTrigger, DropdownMenuPortal, DropdownMenuContent as DropdownMenuContent$1, DropdownMenuItem as DropdownMenuItem$1, DropdownMenuSub, DropdownMenuSubTrigger as DropdownMenuSubTrigger$1, DropdownMenuSubContent as DropdownMenuSubContent$1 } from "@radix-ui/react-dropdown-menu";
18
18
  import { createContext as createContext$1, useContextSelector } from "use-context-selector";
19
19
  import { DayPicker } from "react-day-picker";
20
- import { Popover, PopoverTrigger, PopoverPortal, PopoverContent, Portal as Portal$1 } from "@radix-ui/react-popover";
20
+ import { Popover, PopoverTrigger, PopoverPortal, PopoverContent, Portal } from "@radix-ui/react-popover";
21
21
  import EmojiPicker, { EmojiStyle } from "emoji-picker-react";
22
22
  import * as dropzone from "react-dropzone";
23
23
  import produce, { createDraft, finishDraft, enableMapSet } from "immer";
24
24
  import memoizeOne from "memoize-one";
25
25
  import { parseRegExpLiteral } from "@eslint-community/regexpp";
26
- import { FocusScope } from "@radix-ui/react-focus-scope";
27
- import { Item as Item$1, ItemText, ItemIndicator, Root, Trigger, Portal, Content, ScrollUpButton, Viewport, ScrollDownButton, SelectItemText } from "@radix-ui/react-select";
28
26
  import * as InnerRadioGroup from "@radix-ui/react-radio-group";
29
27
  import TextareaAutosize from "react-textarea-autosize";
30
- import { Root as Root$2, Track, Range, Thumb } from "@radix-ui/react-slider";
28
+ import { Root as Root$1, Track, Range, Thumb } from "@radix-ui/react-slider";
31
29
  import * as RadixTooltip from "@radix-ui/react-tooltip";
32
30
  import ReactMarkdown from "react-markdown";
33
31
  import remarkGfm from "remark-gfm";
@@ -41,7 +39,7 @@ import { RenderPropSticky } from "react-sticky-el";
41
39
  import * as HoverCard from "@radix-ui/react-hover-card";
42
40
  import { useSpring, useInView, animated } from "@react-spring/web";
43
41
  import Papa from "papaparse";
44
- import { Root as Root$1, List, Trigger as Trigger$1, Content as Content$1 } from "@radix-ui/react-tabs";
42
+ import { Root, List, Trigger, Content } from "@radix-ui/react-tabs";
45
43
  import scrollIntoView from "scroll-into-view-if-needed";
46
44
  import * as RAccordion from "@radix-ui/react-accordion";
47
45
  import useEmblaCarousel from "embla-carousel-react";
@@ -467,18 +465,19 @@ function getElementRef(element) {
467
465
  return element.props.ref || element.ref;
468
466
  }
469
467
  const themeVars$11 = `'{"textColor-FormItemLabel": "var(--xmlui-textColor-FormItemLabel)", "fontFamily-FormItemLabel": "var(--xmlui-fontFamily-FormItemLabel)", "fontSize-FormItemLabel": "var(--xmlui-fontSize-FormItemLabel)", "fontWeight-FormItemLabel": "var(--xmlui-fontWeight-FormItemLabel)", "fontStyle-FormItemLabel": "var(--xmlui-fontStyle-FormItemLabel)", "textTransform-FormItemLabel": "var(--xmlui-textTransform-FormItemLabel)", "textColor-FormItemLabel-required": "var(--xmlui-textColor-FormItemLabel-required)", "fontSize-FormItemLabel-required": "var(--xmlui-fontSize-FormItemLabel-required)", "fontWeight-FormItemLabel-required": "var(--xmlui-fontWeight-FormItemLabel-required)", "fontStyle-FormItemLabel-required": "var(--xmlui-fontStyle-FormItemLabel-required)", "textTransform-FormItemLabel-required": "var(--xmlui-textTransform-FormItemLabel-required)", "textColor-FormItemLabel-requiredMark": "var(--xmlui-textColor-FormItemLabel-requiredMark)"}'`;
470
- const container$3 = "_container_1pi4w_14";
471
- const top$1 = "_top_1pi4w_21";
472
- const end = "_end_1pi4w_26";
473
- const bottom$1 = "_bottom_1pi4w_32";
474
- const start = "_start_1pi4w_37";
475
- const shrinkToLabel = "_shrinkToLabel_1pi4w_43";
476
- const inputLabel = "_inputLabel_1pi4w_46";
477
- const disabled$c = "_disabled_1pi4w_59";
478
- const labelBreak = "_labelBreak_1pi4w_63";
479
- const required = "_required_1pi4w_68";
480
- const requiredMark = "_requiredMark_1pi4w_75";
481
- const itemWithLabel = "_itemWithLabel_1pi4w_79";
468
+ const container$3 = "_container_1bx6o_14";
469
+ const top$1 = "_top_1bx6o_21";
470
+ const end = "_end_1bx6o_26";
471
+ const bottom$1 = "_bottom_1bx6o_32";
472
+ const start = "_start_1bx6o_37";
473
+ const shrinkToLabel = "_shrinkToLabel_1bx6o_43";
474
+ const inputLabel = "_inputLabel_1bx6o_46";
475
+ const disabled$c = "_disabled_1bx6o_59";
476
+ const labelBreak = "_labelBreak_1bx6o_63";
477
+ const required = "_required_1bx6o_68";
478
+ const requiredMark = "_requiredMark_1bx6o_75";
479
+ const itemWithLabel = "_itemWithLabel_1bx6o_79";
480
+ const helperTextContainer = "_helperTextContainer_1bx6o_85";
482
481
  const styles$1j = {
483
482
  themeVars: themeVars$11,
484
483
  container: container$3,
@@ -492,7 +491,8 @@ const styles$1j = {
492
491
  labelBreak,
493
492
  required,
494
493
  requiredMark,
495
- itemWithLabel
494
+ itemWithLabel,
495
+ helperTextContainer
496
496
  };
497
497
  const themeVars$10 = `'{"size-Spinner": "var(--xmlui-size-Spinner)", "thickness-Spinner": "var(--xmlui-thickness-Spinner)", "borderColor-Spinner": "var(--xmlui-borderColor-Spinner)"}'`;
498
498
  const fullScreenSpinnerWrapper = "_fullScreenSpinnerWrapper_b1pgc_50";
@@ -8076,13 +8076,18 @@ const ExpandableNavGroup = forwardRef(function ExpandableNavGroup2({
8076
8076
  ...style2,
8077
8077
  "--nav-link-level": layoutIsVertical ? level : 0
8078
8078
  };
8079
+ const handleClick = (e) => {
8080
+ e.preventDefault();
8081
+ e.stopPropagation();
8082
+ setExpanded((prev) => !prev);
8083
+ };
8079
8084
  return /* @__PURE__ */ jsxs(Fragment, { children: [
8080
8085
  /* @__PURE__ */ jsxs(
8081
8086
  NavLink,
8082
8087
  {
8083
8088
  ...rest,
8084
8089
  style: toggleStyle,
8085
- onClick: () => setExpanded((prev) => !prev),
8090
+ onClick: handleClick,
8086
8091
  icon: icon2,
8087
8092
  to,
8088
8093
  disabled: disabled2,
@@ -8287,6 +8292,7 @@ const NavLink = forwardRef(function NavLink2({
8287
8292
  }
8288
8293
  return content2;
8289
8294
  });
8295
+ const PART_HAMBURGER = "hamburger";
8290
8296
  const defaultProps$15 = {
8291
8297
  showLogo: true,
8292
8298
  showNavPanelIf: true
@@ -8337,6 +8343,7 @@ const AppHeader = ({
8337
8343
  hasRegisteredNavPanel && showNavPanelIf && /* @__PURE__ */ jsx(
8338
8344
  Button,
8339
8345
  {
8346
+ "data-part-id": PART_HAMBURGER,
8340
8347
  onClick: toggleDrawer,
8341
8348
  icon: /* @__PURE__ */ jsx(Icon$l, { name: "hamburger" }),
8342
8349
  variant: "ghost",
@@ -13581,32 +13588,24 @@ function ValidationSummary({
13581
13588
  });
13582
13589
  return ret;
13583
13590
  }, [fieldValidationResults, generalValidationResults]);
13584
- return /* @__PURE__ */ jsxs(
13585
- "div",
13586
- {
13587
- ref: animateContainerRef,
13588
- className: styles$R.summaryContainer,
13589
- "data-validation-summary": true,
13590
- children: [
13591
- /* @__PURE__ */ jsx(
13592
- ValidationDisplay,
13593
- {
13594
- issues: groupedInvalidResults.warning,
13595
- severity: "warning",
13596
- heading: "Validation warnings"
13597
- }
13598
- ),
13599
- /* @__PURE__ */ jsx(
13600
- ValidationDisplay,
13601
- {
13602
- issues: groupedInvalidResults.error,
13603
- severity: "error",
13604
- heading: "Validation errors"
13605
- }
13606
- )
13607
- ]
13608
- }
13609
- );
13591
+ return /* @__PURE__ */ jsxs("div", { ref: animateContainerRef, className: styles$R.summaryContainer, "data-validation-summary": true, children: [
13592
+ /* @__PURE__ */ jsx(
13593
+ ValidationDisplay,
13594
+ {
13595
+ issues: groupedInvalidResults.warning,
13596
+ severity: "warning",
13597
+ heading: "Validation warnings"
13598
+ }
13599
+ ),
13600
+ /* @__PURE__ */ jsx(
13601
+ ValidationDisplay,
13602
+ {
13603
+ issues: groupedInvalidResults.error,
13604
+ severity: "error",
13605
+ heading: "Validation errors"
13606
+ }
13607
+ )
13608
+ ] });
13610
13609
  }
13611
13610
  const ValidationDisplay = ({
13612
13611
  heading: heading2,
@@ -21971,72 +21970,48 @@ function useLongPress(elementRef, action2, delay2 = 500) {
21971
21970
  };
21972
21971
  }, [elementRef, action2, delay2]);
21973
21972
  }
21974
- const SelectContext = createContext({
21975
- value: null,
21976
- onChange: (selectedValue) => {
21977
- },
21978
- setOpen: (open) => {
21979
- },
21980
- setSelectedIndex: (index) => {
21981
- },
21982
- options: /* @__PURE__ */ new Set(),
21983
- optionRenderer: void 0
21984
- });
21985
- function useSelect() {
21986
- return useContext(SelectContext);
21987
- }
21988
- const OptionContext = createContext({
21989
- onOptionAdd: () => {
21990
- },
21991
- onOptionRemove: () => {
21992
- }
21993
- });
21994
- function useOption() {
21995
- return useContext(OptionContext);
21996
- }
21997
21973
  const themeVars$z = `'{"border-Select": "var(--xmlui-border-Select)", "borderHorizontal-Select": "var(--xmlui-borderHorizontal-Select, var(--xmlui-border-Select))", "borderVertical-Select": "var(--xmlui-borderVertical-Select, var(--xmlui-border-Select))", "borderLeft-Select": "var(--xmlui-borderLeft-Select, var(--xmlui-borderHorizontal-Select, var(--xmlui-border-Select)))", "borderRight-Select": "var(--xmlui-borderRight-Select, var(--xmlui-borderHorizontal-Select, var(--xmlui-border-Select)))", "borderTop-Select": "var(--xmlui-borderTop-Select, var(--xmlui-borderVertical-Select, var(--xmlui-border-Select)))", "borderBottom-Select": "var(--xmlui-borderBottom-Select, var(--xmlui-borderVertical-Select, var(--xmlui-border-Select)))", "borderWidth-Select": "var(--xmlui-borderWidth-Select)", "borderHorizontalWidth-Select": "var(--xmlui-borderHorizontalWidth-Select, var(--xmlui-borderWidth-Select))", "borderLeftWidth-Select": "var(--xmlui-borderLeftWidth-Select, var(--xmlui-borderHorizontalWidth-Select, var(--xmlui-borderWidth-Select)))", "borderRightWidth-Select": "var(--xmlui-borderRightWidth-Select, var(--xmlui-borderHorizontalWidth-Select, var(--xmlui-borderWidth-Select)))", "borderVerticalWidth-Select": "var(--xmlui-borderVerticalWidth-Select, var(--xmlui-borderWidth-Select))", "borderTopWidth-Select": "var(--xmlui-borderTopWidth-Select, var(--xmlui-borderVerticalWidth-Select, var(--xmlui-borderWidth-Select)))", "borderBottomWidth-Select": "var(--xmlui-borderBottomWidth-Select, var(--xmlui-borderVerticalWidth-Select, var(--xmlui-borderWidth-Select)))", "borderStyle-Select": "var(--xmlui-borderStyle-Select)", "borderHorizontalStyle-Select": "var(--xmlui-borderHorizontalStyle-Select, var(--xmlui-borderStyle-Select))", "borderLeftStyle-Select": "var(--xmlui-borderLeftStyle-Select, var(--xmlui-borderHorizontalStyle-Select, var(--xmlui-borderStyle-Select)))", "borderRightStyle-Select": "var(--xmlui-borderRightStyle-Select, var(--xmlui-borderHorizontalStyle-Select, var(--xmlui-borderStyle-Select)))", "borderVerticalStyle-Select": "var(--xmlui-borderVerticalStyle-Select, var(--xmlui-borderStyle-Select))", "borderTopStyle-Select": "var(--xmlui-borderTopStyle-Select, var(--xmlui-borderVerticalStyle-Select, var(--xmlui-borderStyle-Select)))", "borderBottomStyle-Select": "var(--xmlui-borderBottomStyle-Select, var(--xmlui-borderVerticalStyle-Select, var(--xmlui-borderStyle-Select)))", "borderColor-Select": "var(--xmlui-borderColor-Select)", "borderHorizontalColor-Select": "var(--xmlui-borderHorizontalColor-Select, var(--xmlui-borderColor-Select))", "borderLeftColor-Select": "var(--xmlui-borderLeftColor-Select, var(--xmlui-borderHorizontalColor-Select, var(--xmlui-borderColor-Select)))", "borderRightColor-Select": "var(--xmlui-borderRightColor-Select, var(--xmlui-borderHorizontalColor-Select, var(--xmlui-borderColor-Select)))", "borderVerticalColor-Select": "var(--xmlui-borderVerticalColor-Select, var(--xmlui-borderColor-Select))", "borderTopColor-Select": "var(--xmlui-borderTopColor-Select, var(--xmlui-borderVerticalColor-Select, var(--xmlui-borderColor-Select)))", "borderBottomColor-Select": "var(--xmlui-borderBottomColor-Select, var(--xmlui-borderVerticalColor-Select, var(--xmlui-borderColor-Select)))", "borderStartStartRadius-Select": "var(--xmlui-borderStartStartRadius-Select, var(--xmlui-borderRadius-Select))", "borderStartEndRadius-Select": "var(--xmlui-borderStartEndRadius-Select, var(--xmlui-borderRadius-Select))", "borderEndStartRadius-Select": "var(--xmlui-borderEndStartRadius-Select, var(--xmlui-borderRadius-Select))", "borderEndEndRadius-Select": "var(--xmlui-borderEndEndRadius-Select, var(--xmlui-borderRadius-Select))", "padding-Select": "var(--xmlui-padding-Select)", "paddingHorizontal-Select": "var(--xmlui-paddingHorizontal-Select, var(--xmlui-padding-Select))", "paddingVertical-Select": "var(--xmlui-paddingVertical-Select, var(--xmlui-padding-Select))", "paddingLeft-Select": "var(--xmlui-paddingLeft-Select, var(--xmlui-paddingHorizontal-Select, var(--xmlui-padding-Select)))", "paddingRight-Select": "var(--xmlui-paddingRight-Select, var(--xmlui-paddingHorizontal-Select, var(--xmlui-padding-Select)))", "paddingTop-Select": "var(--xmlui-paddingTop-Select, var(--xmlui-paddingVertical-Select, var(--xmlui-padding-Select)))", "paddingBottom-Select": "var(--xmlui-paddingBottom-Select, var(--xmlui-paddingVertical-Select, var(--xmlui-padding-Select)))", "padding-item-Select": "var(--xmlui-padding-item-Select)", "paddingHorizontal-item-Select": "var(--xmlui-paddingHorizontal-item-Select, var(--xmlui-padding-item-Select))", "paddingVertical-item-Select": "var(--xmlui-paddingVertical-item-Select, var(--xmlui-padding-item-Select))", "paddingLeft-item-Select": "var(--xmlui-paddingLeft-item-Select, var(--xmlui-paddingHorizontal-item-Select, var(--xmlui-padding-item-Select)))", "paddingRight-item-Select": "var(--xmlui-paddingRight-item-Select, var(--xmlui-paddingHorizontal-item-Select, var(--xmlui-padding-item-Select)))", "paddingTop-item-Select": "var(--xmlui-paddingTop-item-Select, var(--xmlui-paddingVertical-item-Select, var(--xmlui-padding-item-Select)))", "paddingBottom-item-Select": "var(--xmlui-paddingBottom-item-Select, var(--xmlui-paddingVertical-item-Select, var(--xmlui-padding-item-Select)))", "Input:borderRadius-Select-default": "var(--xmlui-borderRadius-Select-default)", "Input:borderColor-Select-default": "var(--xmlui-borderColor-Select-default)", "Input:borderWidth-Select-default": "var(--xmlui-borderWidth-Select-default)", "Input:borderStyle-Select-default": "var(--xmlui-borderStyle-Select-default)", "Input:fontSize-Select-default": "var(--xmlui-fontSize-Select-default)", "Input:backgroundColor-Select-default": "var(--xmlui-backgroundColor-Select-default)", "Input:boxShadow-Select-default": "var(--xmlui-boxShadow-Select-default)", "Input:textColor-Select-default": "var(--xmlui-textColor-Select-default)", "Input:borderColor-Select-default--hover": "var(--xmlui-borderColor-Select-default--hover)", "Input:backgroundColor-Select-default--hover": "var(--xmlui-backgroundColor-Select-default--hover)", "Input:boxShadow-Select-default--hover": "var(--xmlui-boxShadow-Select-default--hover)", "Input:textColor-Select-default--hover": "var(--xmlui-textColor-Select-default--hover)", "Input:outlineWidth-Select-default--focus": "var(--xmlui-outlineWidth-Select-default--focus)", "Input:outlineColor-Select-default--focus": "var(--xmlui-outlineColor-Select-default--focus)", "Input:outlineStyle-Select-default--focus": "var(--xmlui-outlineStyle-Select-default--focus)", "Input:outlineOffset-Select-default--focus": "var(--xmlui-outlineOffset-Select-default--focus)", "Input:textColor-placeholder-Select-default": "var(--xmlui-textColor-placeholder-Select-default)", "Input:fontSize-placeholder-Select-default": "var(--xmlui-fontSize-placeholder-Select-default)", "Input:borderRadius-Select-error": "var(--xmlui-borderRadius-Select-error)", "Input:borderColor-Select-error": "var(--xmlui-borderColor-Select-error)", "Input:borderWidth-Select-error": "var(--xmlui-borderWidth-Select-error)", "Input:borderStyle-Select-error": "var(--xmlui-borderStyle-Select-error)", "Input:fontSize-Select-error": "var(--xmlui-fontSize-Select-error)", "Input:backgroundColor-Select-error": "var(--xmlui-backgroundColor-Select-error)", "Input:boxShadow-Select-error": "var(--xmlui-boxShadow-Select-error)", "Input:textColor-Select-error": "var(--xmlui-textColor-Select-error)", "Input:borderColor-Select-error--hover": "var(--xmlui-borderColor-Select-error--hover)", "Input:backgroundColor-Select-error--hover": "var(--xmlui-backgroundColor-Select-error--hover)", "Input:boxShadow-Select-error--hover": "var(--xmlui-boxShadow-Select-error--hover)", "Input:textColor-Select-error--hover": "var(--xmlui-textColor-Select-error--hover)", "Input:outlineWidth-Select-error--focus": "var(--xmlui-outlineWidth-Select-error--focus)", "Input:outlineColor-Select-error--focus": "var(--xmlui-outlineColor-Select-error--focus)", "Input:outlineStyle-Select-error--focus": "var(--xmlui-outlineStyle-Select-error--focus)", "Input:outlineOffset-Select-error--focus": "var(--xmlui-outlineOffset-Select-error--focus)", "Input:textColor-placeholder-Select-error": "var(--xmlui-textColor-placeholder-Select-error)", "Input:fontSize-placeholder-Select-error": "var(--xmlui-fontSize-placeholder-Select-error)", "Input:borderRadius-Select-warning": "var(--xmlui-borderRadius-Select-warning)", "Input:borderColor-Select-warning": "var(--xmlui-borderColor-Select-warning)", "Input:borderWidth-Select-warning": "var(--xmlui-borderWidth-Select-warning)", "Input:borderStyle-Select-warning": "var(--xmlui-borderStyle-Select-warning)", "Input:fontSize-Select-warning": "var(--xmlui-fontSize-Select-warning)", "Input:backgroundColor-Select-warning": "var(--xmlui-backgroundColor-Select-warning)", "Input:boxShadow-Select-warning": "var(--xmlui-boxShadow-Select-warning)", "Input:textColor-Select-warning": "var(--xmlui-textColor-Select-warning)", "Input:borderColor-Select-warning--hover": "var(--xmlui-borderColor-Select-warning--hover)", "Input:backgroundColor-Select-warning--hover": "var(--xmlui-backgroundColor-Select-warning--hover)", "Input:boxShadow-Select-warning--hover": "var(--xmlui-boxShadow-Select-warning--hover)", "Input:textColor-Select-warning--hover": "var(--xmlui-textColor-Select-warning--hover)", "Input:outlineWidth-Select-warning--focus": "var(--xmlui-outlineWidth-Select-warning--focus)", "Input:outlineColor-Select-warning--focus": "var(--xmlui-outlineColor-Select-warning--focus)", "Input:outlineStyle-Select-warning--focus": "var(--xmlui-outlineStyle-Select-warning--focus)", "Input:outlineOffset-Select-warning--focus": "var(--xmlui-outlineOffset-Select-warning--focus)", "Input:textColor-placeholder-Select-warning": "var(--xmlui-textColor-placeholder-Select-warning)", "Input:fontSize-placeholder-Select-warning": "var(--xmlui-fontSize-placeholder-Select-warning)", "Input:borderRadius-Select-success": "var(--xmlui-borderRadius-Select-success)", "Input:borderColor-Select-success": "var(--xmlui-borderColor-Select-success)", "Input:borderWidth-Select-success": "var(--xmlui-borderWidth-Select-success)", "Input:borderStyle-Select-success": "var(--xmlui-borderStyle-Select-success)", "Input:fontSize-Select-success": "var(--xmlui-fontSize-Select-success)", "Input:backgroundColor-Select-success": "var(--xmlui-backgroundColor-Select-success)", "Input:boxShadow-Select-success": "var(--xmlui-boxShadow-Select-success)", "Input:textColor-Select-success": "var(--xmlui-textColor-Select-success)", "Input:borderColor-Select-success--hover": "var(--xmlui-borderColor-Select-success--hover)", "Input:backgroundColor-Select-success--hover": "var(--xmlui-backgroundColor-Select-success--hover)", "Input:boxShadow-Select-success--hover": "var(--xmlui-boxShadow-Select-success--hover)", "Input:textColor-Select-success--hover": "var(--xmlui-textColor-Select-success--hover)", "Input:outlineWidth-Select-success--focus": "var(--xmlui-outlineWidth-Select-success--focus)", "Input:outlineColor-Select-success--focus": "var(--xmlui-outlineColor-Select-success--focus)", "Input:outlineStyle-Select-success--focus": "var(--xmlui-outlineStyle-Select-success--focus)", "Input:outlineOffset-Select-success--focus": "var(--xmlui-outlineOffset-Select-success--focus)", "Input:textColor-placeholder-Select-success": "var(--xmlui-textColor-placeholder-Select-success)", "Input:fontSize-placeholder-Select-success": "var(--xmlui-fontSize-placeholder-Select-success)", "Input:backgroundColor-Select--disabled": "var(--xmlui-backgroundColor-Select--disabled)", "Input:textColor-Select--disabled": "var(--xmlui-textColor-Select--disabled)", "Input:borderColor-Select--disabled": "var(--xmlui-borderColor-Select--disabled)", "Input:outlineWidth-Select--focus": "var(--xmlui-outlineWidth-Select--focus)", "Input:outlineColor-Select--focus": "var(--xmlui-outlineColor-Select--focus)", "Input:outlineStyle-Select--focus": "var(--xmlui-outlineStyle-Select--focus)", "Input:outlineOffset-Select--focus": "var(--xmlui-outlineOffset-Select--focus)", "Input:textColor-placeholder-Select": "var(--xmlui-textColor-placeholder-Select)", "paddingVertical-Select-badge": "var(--xmlui-paddingVertical-Select-badge)", "paddingHorizontal-Select-badge": "var(--xmlui-paddingHorizontal-Select-badge)", "borderRadius-Select-badge": "var(--xmlui-borderRadius-Select-badge)", "Input:fontSize-Select-badge": "var(--xmlui-fontSize-Select-badge)", "Input:backgroundColor-Select-badge": "var(--xmlui-backgroundColor-Select-badge)", "Input:textColor-Select-badge": "var(--xmlui-textColor-Select-badge)", "Input:backgroundColor-Select-badge--hover": "var(--xmlui-backgroundColor-Select-badge--hover)", "Input:textColor-Select-badge--hover": "var(--xmlui-textColor-Select-badge--hover)", "Input:backgroundColor-Select-badge--active": "var(--xmlui-backgroundColor-Select-badge--active)", "Input:textColor-Select-badge--active": "var(--xmlui-textColor-Select-badge--active)", "Input:backgroundColor-menu-Select": "var(--xmlui-backgroundColor-menu-Select)", "Input:borderRadius-menu-Select": "var(--xmlui-borderRadius-menu-Select)", "Input:boxShadow-menu-Select": "var(--xmlui-boxShadow-menu-Select)", "Input:borderWidth-menu-Select": "var(--xmlui-borderWidth-menu-Select)", "Input:borderColor-menu-Select": "var(--xmlui-borderColor-menu-Select)", "backgroundColor-item-Select": "var(--xmlui-backgroundColor-item-Select)", "backgroundColor-item-Select--active": "var(--xmlui-backgroundColor-item-Select--active)", "backgroundColor-item-Select--hover": "var(--xmlui-backgroundColor-item-Select--hover)", "textColor-item-Select--disabled": "var(--xmlui-textColor-item-Select--disabled)", "opacity-text-item-Select--disabled": "var(--xmlui-opacity-text-item-Select--disabled)", "textColor-indicator-Select": "var(--xmlui-textColor-indicator-Select)"}'`;
21998
- const selectTrigger = "_selectTrigger_1v71t_17";
21999
- const error$8 = "_error_1v71t_54";
22000
- const warning$9 = "_warning_1v71t_80";
22001
- const valid$8 = "_valid_1v71t_106";
22002
- const disabled$7 = "_disabled_1v71t_132";
22003
- const focused$3 = "_focused_1v71t_139";
22004
- const placeholder = "_placeholder_1v71t_145";
22005
- const actions$1 = "_actions_1v71t_162";
22006
- const action$1 = "_action_1v71t_162";
22007
- const emptyList = "_emptyList_1v71t_173";
22008
- const badgeListContainer = "_badgeListContainer_1v71t_185";
22009
- const badgeList$1 = "_badgeList_1v71t_185";
22010
- const inputWrapper$1 = "_inputWrapper_1v71t_198";
22011
- const badge$1 = "_badge_1v71t_185";
22012
- const selectContent = "_selectContent_1v71t_233";
22013
- const command$1 = "_command_1v71t_241";
22014
- const commandInputContainer = "_commandInputContainer_1v71t_246";
22015
- const commandInput$1 = "_commandInput_1v71t_246";
22016
- const commandList$1 = "_commandList_1v71t_265";
22017
- const multiSelectOption = "_multiSelectOption_1v71t_272";
22018
- const multiSelectOptionContent = "_multiSelectOptionContent_1v71t_286";
22019
- const highlighted$1 = "_highlighted_1v71t_295";
22020
- const disabledOption$1 = "_disabledOption_1v71t_301";
22021
- const selectValue = "_selectValue_1v71t_316";
22022
- const selectDropdownContent = "_selectDropdownContent_1v71t_331";
22023
- const fadeIn = "_fadeIn_1v71t_1";
22024
- const zoomIn = "_zoomIn_1v71t_1";
22025
- const fadeOut = "_fadeOut_1v71t_1";
22026
- const zoomOut = "_zoomOut_1v71t_1";
22027
- const slideInFromTop = "_slideInFromTop_1v71t_1";
22028
- const slideInFromRight = "_slideInFromRight_1v71t_1";
22029
- const slideInFromLeft = "_slideInFromLeft_1v71t_1";
22030
- const slideInFromBottom = "_slideInFromBottom_1v71t_1";
22031
- const selectViewport = "_selectViewport_1v71t_364";
22032
- const selectScrollUpButton = "_selectScrollUpButton_1v71t_368";
22033
- const selectScrollDownButton = "_selectScrollDownButton_1v71t_376";
22034
- const selectEmpty = "_selectEmpty_1v71t_384";
22035
- const selectOption = "_selectOption_1v71t_397";
22036
- const selectOptionContent = "_selectOptionContent_1v71t_420";
22037
- const selectOptionIndicator = "_selectOptionIndicator_1v71t_434";
22038
- const loading = "_loading_1v71t_444";
22039
- const srOnly = "_srOnly_1v71t_447";
21974
+ const selectTrigger = "_selectTrigger_1rbu9_17";
21975
+ const error$8 = "_error_1rbu9_54";
21976
+ const warning$9 = "_warning_1rbu9_80";
21977
+ const valid$8 = "_valid_1rbu9_106";
21978
+ const disabled$7 = "_disabled_1rbu9_132";
21979
+ const placeholder = "_placeholder_1rbu9_145";
21980
+ const actions$1 = "_actions_1rbu9_162";
21981
+ const action$1 = "_action_1rbu9_162";
21982
+ const emptyList = "_emptyList_1rbu9_173";
21983
+ const badgeListContainer = "_badgeListContainer_1rbu9_185";
21984
+ const badgeList$1 = "_badgeList_1rbu9_185";
21985
+ const inputWrapper$1 = "_inputWrapper_1rbu9_198";
21986
+ const badge$1 = "_badge_1rbu9_185";
21987
+ const selectContent = "_selectContent_1rbu9_233";
21988
+ const command$1 = "_command_1rbu9_242";
21989
+ const commandInputContainer = "_commandInputContainer_1rbu9_247";
21990
+ const commandInput$1 = "_commandInput_1rbu9_247";
21991
+ const commandList$1 = "_commandList_1rbu9_266";
21992
+ const multiSelectOption = "_multiSelectOption_1rbu9_273";
21993
+ const multiSelectOptionContent = "_multiSelectOptionContent_1rbu9_287";
21994
+ const highlighted$1 = "_highlighted_1rbu9_296";
21995
+ const disabledOption$1 = "_disabledOption_1rbu9_302";
21996
+ const selectValue = "_selectValue_1rbu9_317";
21997
+ const selectDropdownContent = "_selectDropdownContent_1rbu9_332";
21998
+ const fadeIn = "_fadeIn_1rbu9_1";
21999
+ const zoomIn = "_zoomIn_1rbu9_1";
22000
+ const fadeOut = "_fadeOut_1rbu9_1";
22001
+ const zoomOut = "_zoomOut_1rbu9_1";
22002
+ const slideInFromTop = "_slideInFromTop_1rbu9_1";
22003
+ const slideInFromRight = "_slideInFromRight_1rbu9_1";
22004
+ const slideInFromLeft = "_slideInFromLeft_1rbu9_1";
22005
+ const slideInFromBottom = "_slideInFromBottom_1rbu9_1";
22006
+ const selectViewport = "_selectViewport_1rbu9_365";
22007
+ const selectScrollUpButton = "_selectScrollUpButton_1rbu9_369";
22008
+ const selectScrollDownButton = "_selectScrollDownButton_1rbu9_377";
22009
+ const selectEmpty = "_selectEmpty_1rbu9_385";
22010
+ const selectOption = "_selectOption_1rbu9_398";
22011
+ const selectOptionContent = "_selectOptionContent_1rbu9_421";
22012
+ const selectOptionIndicator = "_selectOptionIndicator_1rbu9_435";
22013
+ const loading = "_loading_1rbu9_445";
22014
+ const srOnly = "_srOnly_1rbu9_448";
22040
22015
  const styles$O = {
22041
22016
  themeVars: themeVars$z,
22042
22017
  selectTrigger,
@@ -22044,7 +22019,6 @@ const styles$O = {
22044
22019
  warning: warning$9,
22045
22020
  valid: valid$8,
22046
22021
  disabled: disabled$7,
22047
- focused: focused$3,
22048
22022
  placeholder,
22049
22023
  actions: actions$1,
22050
22024
  action: action$1,
@@ -22082,57 +22056,20 @@ const styles$O = {
22082
22056
  loading,
22083
22057
  srOnly
22084
22058
  };
22085
- const SelectOption = forwardRef(
22086
- function SelectOption2(option, ref) {
22087
- const visibleContentRef = useRef(null);
22088
- const { value, label: label2, enabled: enabled2 = true, children, className } = option;
22089
- const { value: selectedValue, optionRenderer } = useSelect();
22090
- const { onOptionRemove, onOptionAdd } = useOption();
22091
- const opt = useMemo(() => {
22092
- return {
22093
- ...option,
22094
- label: label2 ?? "",
22095
- keywords: [label2 ?? ""]
22096
- };
22097
- }, [option, label2]);
22098
- useEffect(() => {
22099
- onOptionAdd(opt);
22100
- return () => onOptionRemove(opt);
22101
- }, [opt, onOptionAdd, onOptionRemove]);
22102
- return /* @__PURE__ */ jsxs(
22103
- Item$1,
22104
- {
22105
- ref,
22106
- className: classnames(className, styles$O.selectOption),
22107
- value,
22108
- textValue: label2,
22109
- disabled: !enabled2,
22110
- onClick: (event) => {
22111
- event.stopPropagation();
22112
- },
22113
- "data-state": selectedValue === value && "checked",
22114
- children: [
22115
- /* @__PURE__ */ jsx("span", { style: { display: "none" }, children: /* @__PURE__ */ jsx(ItemText, { children: label2 }) }),
22116
- children ? /* @__PURE__ */ jsxs(Fragment, { children: [
22117
- /* @__PURE__ */ jsx("div", { className: styles$O.selectOptionContent, ref: visibleContentRef, children }),
22118
- selectedValue === value && /* @__PURE__ */ jsx(ItemIndicator, { className: styles$O.selectOptionIndicator, children: /* @__PURE__ */ jsx(Icon$l, { name: "checkmark" }) })
22119
- ] }) : optionRenderer ? /* @__PURE__ */ jsx("div", { className: styles$O.selectOptionContent, ref: visibleContentRef, children: optionRenderer(
22120
- {
22121
- label: label2,
22122
- value,
22123
- enabled: enabled2
22124
- },
22125
- selectedValue,
22126
- false
22127
- ) }) : /* @__PURE__ */ jsxs(Fragment, { children: [
22128
- /* @__PURE__ */ jsx("div", { className: styles$O.selectOptionContent, ref: visibleContentRef, children: label2 }),
22129
- selectedValue === value && /* @__PURE__ */ jsx(ItemIndicator, { className: styles$O.selectItemIndicator, children: /* @__PURE__ */ jsx(Icon$l, { name: "checkmark" }) })
22130
- ] })
22131
- ]
22132
- }
22133
- );
22134
- }
22135
- );
22059
+ const SelectContext = createContext({
22060
+ value: null,
22061
+ onChange: (selectedValue) => {
22062
+ },
22063
+ setOpen: (open) => {
22064
+ },
22065
+ setSelectedIndex: (index) => {
22066
+ },
22067
+ options: /* @__PURE__ */ new Set(),
22068
+ optionRenderer: void 0
22069
+ });
22070
+ function useSelect() {
22071
+ return useContext(SelectContext);
22072
+ }
22136
22073
  const OptionTypeContext = React__default.createContext(null);
22137
22074
  function useOptionType() {
22138
22075
  return React__default.useContext(OptionTypeContext);
@@ -22143,9 +22080,18 @@ function OptionTypeProvider({
22143
22080
  }) {
22144
22081
  return /* @__PURE__ */ jsx(OptionTypeContext.Provider, { value: Component, children });
22145
22082
  }
22083
+ const OptionContext = createContext({
22084
+ onOptionAdd: () => {
22085
+ },
22086
+ onOptionRemove: () => {
22087
+ }
22088
+ });
22089
+ function useOption() {
22090
+ return useContext(OptionContext);
22091
+ }
22146
22092
  function HiddenOption(option) {
22147
22093
  const { label: label2 } = option;
22148
- const { onOptionRemove, onOptionAdd } = useOption();
22094
+ const { onOptionAdd } = useOption();
22149
22095
  const [node, setNode] = useState(null);
22150
22096
  const opt = useMemo(() => {
22151
22097
  return {
@@ -22157,165 +22103,10 @@ function HiddenOption(option) {
22157
22103
  }, [option, node, label2]);
22158
22104
  useEffect(() => {
22159
22105
  onOptionAdd(opt);
22160
- return () => onOptionRemove(opt);
22161
- }, [opt, onOptionAdd, onOptionRemove]);
22106
+ }, [opt, onOptionAdd]);
22162
22107
  return /* @__PURE__ */ jsx("div", { ref: (el) => setNode(el), style: { display: "none" }, children: option.children });
22163
22108
  }
22164
- const SimpleSelect = forwardRef(
22165
- function SimpleSelect2(props, forwardedRef) {
22166
- const { root: root2 } = useTheme();
22167
- const {
22168
- enabled: enabled2,
22169
- onBlur,
22170
- autoFocus,
22171
- onValueChange,
22172
- validationStatus,
22173
- value,
22174
- height,
22175
- style: style2,
22176
- placeholder: placeholder2,
22177
- id,
22178
- triggerRef,
22179
- onFocus,
22180
- width,
22181
- children,
22182
- readOnly: readOnly2,
22183
- emptyListNode,
22184
- className,
22185
- ...rest
22186
- } = props;
22187
- const { options: options2 } = useSelect();
22188
- const composedRef = forwardRef ? composeRefs(triggerRef, forwardedRef) : triggerRef;
22189
- const stringValue = useMemo(() => {
22190
- return value != void 0 ? String(value) : void 0;
22191
- }, [value]);
22192
- const handleValueChange = useCallback(
22193
- (val) => {
22194
- if (readOnly2) return;
22195
- onValueChange(val);
22196
- },
22197
- [onValueChange, readOnly2]
22198
- );
22199
- const optionsArray = useMemo(() => Array.from(options2), [options2]);
22200
- const selectedOption = useMemo(() => {
22201
- return optionsArray.find((option) => String(option.value) === String(value));
22202
- }, [optionsArray, value]);
22203
- return /* @__PURE__ */ jsxs(Root, { value: stringValue, onValueChange: handleValueChange, children: [
22204
- /* @__PURE__ */ jsxs(
22205
- Trigger,
22206
- {
22207
- ...rest,
22208
- id,
22209
- ref: composedRef,
22210
- "aria-haspopup": "listbox",
22211
- style: style2,
22212
- onFocus,
22213
- onBlur,
22214
- disabled: !enabled2,
22215
- className: classnames(className, styles$O.selectTrigger, {
22216
- [styles$O.error]: validationStatus === "error",
22217
- [styles$O.warning]: validationStatus === "warning",
22218
- [styles$O.valid]: validationStatus === "valid"
22219
- }),
22220
- onClick: (event) => {
22221
- event.stopPropagation();
22222
- },
22223
- autoFocus,
22224
- children: [
22225
- /* @__PURE__ */ jsx(
22226
- "div",
22227
- {
22228
- className: classnames(styles$O.selectValue, {
22229
- [styles$O.placeholder]: value === void 0
22230
- }),
22231
- children: selectedOption ? selectedOption.label : readOnly2 ? "" : placeholder2
22232
- }
22233
- ),
22234
- /* @__PURE__ */ jsx("span", { className: styles$O.action, children: /* @__PURE__ */ jsx(Icon$l, { name: "chevrondown" }) })
22235
- ]
22236
- }
22237
- ),
22238
- /* @__PURE__ */ jsx(Portal, { container: root2, children: /* @__PURE__ */ jsxs(
22239
- Content,
22240
- {
22241
- className: styles$O.selectDropdownContent,
22242
- position: "popper",
22243
- style: { maxHeight: height, minWidth: width },
22244
- children: [
22245
- /* @__PURE__ */ jsx(ScrollUpButton, { className: styles$O.selectScrollUpButton, children: /* @__PURE__ */ jsx(Icon$l, { name: "chevronup" }) }),
22246
- /* @__PURE__ */ jsxs(Viewport, { className: styles$O.selectViewport, role: "listbox", children: [
22247
- children,
22248
- optionsArray.length === 0 && emptyListNode
22249
- ] }),
22250
- /* @__PURE__ */ jsx(ScrollDownButton, { className: styles$O.selectScrollDownButton, children: /* @__PURE__ */ jsx(Icon$l, { name: "chevrondown" }) })
22251
- ]
22252
- }
22253
- ) })
22254
- ] });
22255
- }
22256
- );
22257
- const MultiSelectOption = forwardRef(function MultiSelectOption2(option, forwardedRef) {
22258
- const id = useId();
22259
- const {
22260
- label: label2,
22261
- value,
22262
- enabled: enabled2 = true,
22263
- keywords,
22264
- readOnly: readOnly2,
22265
- children,
22266
- isHighlighted = false,
22267
- itemIndex
22268
- } = option;
22269
- const {
22270
- value: selectedValue,
22271
- onChange,
22272
- multiSelect,
22273
- setOpen,
22274
- setSelectedIndex,
22275
- optionRenderer
22276
- } = useSelect();
22277
- const selected2 = useMemo(() => {
22278
- return Array.isArray(selectedValue) && multiSelect ? selectedValue.map((v) => String(v)).includes(value) : String(selectedValue) === String(value);
22279
- }, [selectedValue, value, multiSelect]);
22280
- const handleClick = () => {
22281
- if (readOnly2) {
22282
- setOpen(false);
22283
- return;
22284
- }
22285
- if (enabled2) {
22286
- onChange(value);
22287
- }
22288
- };
22289
- return /* @__PURE__ */ jsx(
22290
- "div",
22291
- {
22292
- id,
22293
- ref: forwardedRef,
22294
- role: "option",
22295
- "aria-disabled": !enabled2,
22296
- "aria-selected": selected2,
22297
- className: classnames(styles$O.multiSelectOption, {
22298
- [styles$O.disabledOption]: !enabled2,
22299
- [styles$O.highlighted]: isHighlighted
22300
- }),
22301
- onMouseDown: (e) => {
22302
- e.preventDefault();
22303
- e.stopPropagation();
22304
- },
22305
- onMouseEnter: () => {
22306
- if (itemIndex !== void 0 && setSelectedIndex && enabled2) {
22307
- setSelectedIndex(itemIndex);
22308
- }
22309
- },
22310
- onClick: handleClick,
22311
- "data-state": selected2 ? "checked" : void 0,
22312
- children: /* @__PURE__ */ jsx("div", { className: styles$O.multiSelectOptionContent, children: optionRenderer ? optionRenderer({ label: label2, value, enabled: enabled2, keywords }, selectedValue, false) : /* @__PURE__ */ jsxs(Fragment, { children: [
22313
- children || label2,
22314
- selected2 && /* @__PURE__ */ jsx(Icon$l, { name: "checkmark" })
22315
- ] }) })
22316
- }
22317
- );
22318
- });
22109
+ const PART_LIST_WRAPPER$1 = "listWrapper";
22319
22110
  const defaultProps$L = {
22320
22111
  enabled: true,
22321
22112
  placeholder: "",
@@ -22437,7 +22228,6 @@ const Select = forwardRef(function Select2({
22437
22228
  const observer = useRef();
22438
22229
  const { root: root2 } = useTheme();
22439
22230
  const [options2, setOptions] = useState(/* @__PURE__ */ new Set());
22440
- const isInForm = useIsInsideForm();
22441
22231
  const [searchTerm, setSearchTerm] = useState("");
22442
22232
  const [selectedIndex, setSelectedIndex] = useState(-1);
22443
22233
  const filteredOptions = useMemo(() => {
@@ -22492,15 +22282,16 @@ const Select = forwardRef(function Select2({
22492
22282
  }, [multiSelect, updateState, onDidChange]);
22493
22283
  const findNextEnabledIndex = useCallback(
22494
22284
  (currentIndex) => {
22285
+ if (filteredOptions.length === 0) return -1;
22495
22286
  for (let i = currentIndex + 1; i < filteredOptions.length; i++) {
22496
22287
  const item2 = filteredOptions[i];
22497
- if (item2.enabled !== false) {
22288
+ if (item2 && item2.enabled !== false) {
22498
22289
  return i;
22499
22290
  }
22500
22291
  }
22501
22292
  for (let i = 0; i <= currentIndex; i++) {
22502
22293
  const item2 = filteredOptions[i];
22503
- if (item2.enabled !== false) {
22294
+ if (item2 && item2.enabled !== false) {
22504
22295
  return i;
22505
22296
  }
22506
22297
  }
@@ -22510,15 +22301,16 @@ const Select = forwardRef(function Select2({
22510
22301
  );
22511
22302
  const findPreviousEnabledIndex = useCallback(
22512
22303
  (currentIndex) => {
22304
+ if (filteredOptions.length === 0) return -1;
22513
22305
  for (let i = currentIndex - 1; i >= 0; i--) {
22514
22306
  const item2 = filteredOptions[i];
22515
- if (item2.enabled !== false) {
22307
+ if (item2 && item2.enabled !== false) {
22516
22308
  return i;
22517
22309
  }
22518
22310
  }
22519
22311
  for (let i = filteredOptions.length - 1; i >= currentIndex; i--) {
22520
22312
  const item2 = filteredOptions[i];
22521
- if (item2.enabled !== false) {
22313
+ if (item2 && item2.enabled !== false) {
22522
22314
  return i;
22523
22315
  }
22524
22316
  }
@@ -22548,8 +22340,11 @@ const Select = forwardRef(function Select2({
22548
22340
  event.preventDefault();
22549
22341
  if (selectedIndex >= 0 && selectedIndex < filteredOptions.length) {
22550
22342
  const selectedItem = filteredOptions[selectedIndex];
22551
- if (selectedItem.enabled !== false) {
22343
+ if (selectedItem && selectedItem.enabled !== false) {
22552
22344
  toggleOption(selectedItem.value);
22345
+ if (!multiSelect) {
22346
+ setOpen(false);
22347
+ }
22553
22348
  }
22554
22349
  }
22555
22350
  break;
@@ -22564,6 +22359,7 @@ const Select = forwardRef(function Select2({
22564
22359
  selectedIndex,
22565
22360
  filteredOptions,
22566
22361
  toggleOption,
22362
+ multiSelect,
22567
22363
  findNextEnabledIndex,
22568
22364
  findPreviousEnabledIndex
22569
22365
  ]
@@ -22597,7 +22393,15 @@ const Select = forwardRef(function Select2({
22597
22393
  [emptyListTemplate]
22598
22394
  );
22599
22395
  const onOptionAdd = useCallback((option) => {
22600
- setOptions((prev) => new Set(prev).add(option));
22396
+ setOptions((prev) => {
22397
+ const exists = Array.from(prev).some((opt) => opt.value === option.value);
22398
+ if (exists) {
22399
+ return prev;
22400
+ }
22401
+ const newSet = new Set(prev);
22402
+ newSet.add(option);
22403
+ return newSet;
22404
+ });
22601
22405
  }, []);
22602
22406
  const onOptionRemove = useCallback((option) => {
22603
22407
  setOptions((prev) => {
@@ -22616,138 +22420,286 @@ const Select = forwardRef(function Select2({
22616
22420
  const selectContextValue = useMemo(
22617
22421
  () => ({
22618
22422
  multiSelect,
22423
+ readOnly: readOnly2,
22619
22424
  value,
22620
22425
  onChange: toggleOption,
22621
22426
  setOpen,
22622
22427
  setSelectedIndex,
22623
22428
  options: options2,
22429
+ highlightedValue: selectedIndex >= 0 && selectedIndex < filteredOptions.length && filteredOptions[selectedIndex] ? filteredOptions[selectedIndex].value : void 0,
22624
22430
  optionRenderer
22625
22431
  }),
22626
- [multiSelect, toggleOption, value, options2, optionRenderer]
22432
+ [
22433
+ multiSelect,
22434
+ readOnly2,
22435
+ value,
22436
+ toggleOption,
22437
+ options2,
22438
+ selectedIndex,
22439
+ filteredOptions,
22440
+ optionRenderer
22441
+ ]
22627
22442
  );
22628
- return /* @__PURE__ */ jsx(SelectContext.Provider, { value: selectContextValue, children: /* @__PURE__ */ jsx(OptionContext.Provider, { value: optionContextValue, children: searchable || multiSelect ? /* @__PURE__ */ jsxs(OptionTypeProvider, { Component: HiddenOption, children: [
22629
- /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, modal: false, children: [
22630
- /* @__PURE__ */ jsxs(
22631
- PopoverTrigger,
22632
- {
22633
- ...rest,
22634
- ref: composeRefs(setReferenceElement, forwardedRef),
22635
- id,
22636
- "aria-haspopup": "listbox",
22637
- style: style2,
22638
- onFocus,
22639
- onBlur,
22640
- disabled: !enabled2,
22641
- "aria-expanded": open,
22642
- onClick: (event) => {
22643
- event.stopPropagation();
22644
- setOpen((prev) => !prev);
22645
- },
22646
- className: classnames(
22647
- styles$O.selectTrigger,
22648
- styles$O[validationStatus],
22443
+ return /* @__PURE__ */ jsx(SelectContext.Provider, { value: selectContextValue, children: /* @__PURE__ */ jsxs(OptionContext.Provider, { value: optionContextValue, children: [
22444
+ /* @__PURE__ */ jsx(OptionTypeProvider, { Component: VisibleSelectOption, children: /* @__PURE__ */ jsxs(
22445
+ Popover,
22446
+ {
22447
+ open,
22448
+ onOpenChange: (isOpen) => {
22449
+ if (!enabled2) return;
22450
+ setOpen(isOpen);
22451
+ setSelectedIndex(-1);
22452
+ },
22453
+ modal: false,
22454
+ children: [
22455
+ /* @__PURE__ */ jsxs(
22456
+ PopoverTrigger,
22649
22457
  {
22650
- [styles$O.disabled]: !enabled2,
22651
- [styles$O.multi]: multiSelect
22652
- },
22653
- className
22654
- ),
22655
- autoFocus,
22656
- children: [
22657
- /* @__PURE__ */ jsx(
22658
- SelectTriggerValue,
22659
- {
22660
- value,
22661
- placeholder: placeholder2,
22662
- readOnly: readOnly2,
22663
- multiSelect,
22664
- options: options2,
22665
- valueRenderer,
22666
- toggleOption
22667
- }
22668
- ),
22669
- /* @__PURE__ */ jsx(
22670
- SelectTriggerActions,
22671
- {
22672
- value,
22673
- multiSelect,
22674
- enabled: enabled2,
22675
- readOnly: readOnly2,
22676
- clearValue
22677
- }
22678
- )
22679
- ]
22680
- }
22681
- ),
22682
- open && /* @__PURE__ */ jsx(Portal$1, { container: root2, children: /* @__PURE__ */ jsx(FocusScope, { asChild: true, loop: true, trapped: true, children: /* @__PURE__ */ jsx(
22683
- PopoverContent,
22684
- {
22685
- style: { minWidth: width, height: dropdownHeight },
22686
- className: styles$O.selectContent,
22687
- onKeyDown: handleKeyDown,
22688
- children: /* @__PURE__ */ jsxs("div", { className: styles$O.command, children: [
22689
- searchable ? /* @__PURE__ */ jsxs("div", { className: styles$O.commandInputContainer, children: [
22690
- /* @__PURE__ */ jsx(Icon$l, { name: "search" }),
22691
- /* @__PURE__ */ jsx(
22692
- "input",
22693
- {
22694
- role: "combobox",
22695
- className: classnames(styles$O.commandInput),
22696
- placeholder: "Search...",
22697
- value: searchTerm,
22698
- onChange: (e) => setSearchTerm(e.target.value),
22699
- autoFocus: true
22458
+ ...rest,
22459
+ ref: composeRefs(setReferenceElement, forwardedRef),
22460
+ id,
22461
+ "aria-haspopup": "listbox",
22462
+ style: style2,
22463
+ onFocus,
22464
+ onBlur,
22465
+ disabled: !enabled2,
22466
+ "aria-expanded": open,
22467
+ "data-part-id": PART_LIST_WRAPPER$1,
22468
+ className: classnames(className, styles$O.selectTrigger, styles$O[validationStatus], {
22469
+ [styles$O.disabled]: !enabled2,
22470
+ [styles$O.multi]: multiSelect
22471
+ }),
22472
+ role: "combobox",
22473
+ onClick: (event) => {
22474
+ if (!enabled2) return;
22475
+ event.stopPropagation();
22476
+ setOpen((prev) => !prev);
22477
+ },
22478
+ onKeyDown: (event) => {
22479
+ if (!enabled2 || readOnly2) return;
22480
+ if (!open && (event.key === "ArrowDown" || event.key === "ArrowUp" || event.key === " " || event.key === "Enter")) {
22481
+ event.preventDefault();
22482
+ setOpen(true);
22483
+ if (filteredOptions.length > 0) {
22484
+ const firstEnabledIndex = findNextEnabledIndex(-1);
22485
+ setSelectedIndex(firstEnabledIndex !== -1 ? firstEnabledIndex : 0);
22486
+ }
22487
+ return;
22700
22488
  }
22701
- )
22702
- ] }) : /* @__PURE__ */ jsx("button", { autoFocus: true, "aria-hidden": "true", className: styles$O.srOnly }),
22703
- /* @__PURE__ */ jsxs("div", { role: "listbox", className: styles$O.commandList, children: [
22704
- inProgress && /* @__PURE__ */ jsx("div", { className: styles$O.loading, children: inProgressNotificationMessage }),
22705
- filteredOptions.map(({ value: value2, label: label2, enabled: enabled22, keywords }, index) => /* @__PURE__ */ jsx(
22706
- MultiSelectOption,
22707
- {
22708
- readOnly: readOnly2,
22709
- value: value2,
22710
- label: label2,
22711
- enabled: enabled22,
22712
- keywords,
22713
- isHighlighted: selectedIndex === index,
22714
- itemIndex: index
22715
- },
22716
- value2
22717
- )),
22718
- !inProgress && filteredOptions.length === 0 && /* @__PURE__ */ jsx("div", { children: emptyListNode })
22719
- ] })
22720
- ] })
22721
- }
22722
- ) }) })
22723
- ] }),
22724
- children
22725
- ] }) : /* @__PURE__ */ jsx(OptionTypeProvider, { Component: SelectOption, children: /* @__PURE__ */ createElement(
22726
- SimpleSelect,
22727
- {
22728
- ...rest,
22729
- readOnly: !!readOnly2,
22730
- ref: forwardedRef,
22731
- key: isInForm ? value ? `status-${value}` : "status-initial" : void 0,
22732
- value,
22733
- onValueChange: toggleOption,
22734
- id,
22735
- style: style2,
22736
- className,
22737
- onFocus,
22738
- onBlur,
22739
- enabled: enabled2,
22740
- validationStatus,
22741
- triggerRef: setReferenceElement,
22742
- autoFocus,
22743
- placeholder: placeholder2,
22744
- height: dropdownHeight,
22745
- width,
22746
- emptyListNode
22747
- },
22748
- children
22749
- ) }) }) });
22489
+ if (open) {
22490
+ handleKeyDown(event);
22491
+ }
22492
+ },
22493
+ autoFocus,
22494
+ children: [
22495
+ /* @__PURE__ */ jsx(
22496
+ SelectTriggerValue,
22497
+ {
22498
+ value,
22499
+ placeholder: placeholder2,
22500
+ readOnly: readOnly2,
22501
+ multiSelect,
22502
+ options: options2,
22503
+ valueRenderer,
22504
+ toggleOption
22505
+ }
22506
+ ),
22507
+ /* @__PURE__ */ jsx(
22508
+ SelectTriggerActions,
22509
+ {
22510
+ value,
22511
+ multiSelect,
22512
+ enabled: enabled2,
22513
+ readOnly: readOnly2,
22514
+ clearValue
22515
+ }
22516
+ )
22517
+ ]
22518
+ }
22519
+ ),
22520
+ open && /* @__PURE__ */ jsx(Portal, { container: root2, children: /* @__PURE__ */ jsx(
22521
+ PopoverContent,
22522
+ {
22523
+ style: { minWidth: width, height: dropdownHeight },
22524
+ className: styles$O.selectContent,
22525
+ onKeyDown: handleKeyDown,
22526
+ children: /* @__PURE__ */ jsxs("div", { className: styles$O.command, children: [
22527
+ searchable ? /* @__PURE__ */ jsxs("div", { className: styles$O.commandInputContainer, children: [
22528
+ /* @__PURE__ */ jsx(Icon$l, { name: "search" }),
22529
+ /* @__PURE__ */ jsx(
22530
+ "input",
22531
+ {
22532
+ role: "searchbox",
22533
+ className: classnames(styles$O.commandInput),
22534
+ placeholder: "Search...",
22535
+ value: searchTerm,
22536
+ onChange: (e) => setSearchTerm(e.target.value)
22537
+ }
22538
+ )
22539
+ ] }) : /* @__PURE__ */ jsx("button", { "aria-hidden": "true", className: styles$O.srOnly }),
22540
+ /* @__PURE__ */ jsx("div", { role: "listbox", className: styles$O.commandList, children: inProgress ? /* @__PURE__ */ jsx("div", { className: styles$O.loading, children: inProgressNotificationMessage }) : searchable && searchTerm ? (
22541
+ // When searching, show only filtered options
22542
+ filteredOptions.length === 0 ? /* @__PURE__ */ jsx("div", { children: emptyListNode }) : filteredOptions.map(({ value: value2, label: label2, enabled: enabled22, keywords }, index) => /* @__PURE__ */ jsx(
22543
+ SelectOptionItem,
22544
+ {
22545
+ readOnly: readOnly2,
22546
+ value: value2,
22547
+ label: label2,
22548
+ enabled: enabled22,
22549
+ keywords,
22550
+ isHighlighted: selectedIndex === index,
22551
+ itemIndex: index
22552
+ },
22553
+ value2
22554
+ ))
22555
+ ) : (
22556
+ // When not searching, show all children (includes Options and other components like Button)
22557
+ /* @__PURE__ */ jsxs(Fragment, { children: [
22558
+ children,
22559
+ options2.size === 0 && /* @__PURE__ */ jsx("div", { children: emptyListNode })
22560
+ ] })
22561
+ ) })
22562
+ ] })
22563
+ }
22564
+ ) })
22565
+ ]
22566
+ }
22567
+ ) }),
22568
+ !open && /* @__PURE__ */ jsx("div", { style: { display: "none" }, children: /* @__PURE__ */ jsx(OptionTypeProvider, { Component: HiddenOption, children }) })
22569
+ ] }) });
22750
22570
  });
22571
+ function VisibleSelectOption(option) {
22572
+ const { value, label: label2, enabled: enabled2 = true, children } = option;
22573
+ const { onOptionAdd } = useOption();
22574
+ const {
22575
+ value: selectedValue,
22576
+ onChange,
22577
+ multiSelect,
22578
+ readOnly: readOnly2,
22579
+ setOpen,
22580
+ highlightedValue,
22581
+ optionRenderer
22582
+ } = useSelect();
22583
+ const optionRef = useRef(null);
22584
+ const opt = useMemo(() => {
22585
+ return {
22586
+ ...option,
22587
+ label: label2 ?? "",
22588
+ keywords: option.keywords || [label2 ?? ""]
22589
+ };
22590
+ }, [option, label2]);
22591
+ useEffect(() => {
22592
+ onOptionAdd(opt);
22593
+ }, [opt, onOptionAdd]);
22594
+ const selected2 = useMemo(() => {
22595
+ return Array.isArray(selectedValue) && multiSelect ? selectedValue.map((v) => String(v)).includes(value) : String(selectedValue) === String(value);
22596
+ }, [selectedValue, value, multiSelect]);
22597
+ const isHighlighted = useMemo(() => {
22598
+ return highlightedValue !== void 0 && String(highlightedValue) === String(value);
22599
+ }, [highlightedValue, value]);
22600
+ useEffect(() => {
22601
+ if (isHighlighted && optionRef.current) {
22602
+ optionRef.current.scrollIntoView({ block: "nearest", behavior: "smooth" });
22603
+ }
22604
+ }, [isHighlighted]);
22605
+ const handleClick = () => {
22606
+ if (readOnly2) {
22607
+ setOpen(false);
22608
+ return;
22609
+ }
22610
+ if (enabled2) {
22611
+ onChange(value);
22612
+ }
22613
+ };
22614
+ return /* @__PURE__ */ jsx(
22615
+ "div",
22616
+ {
22617
+ ref: optionRef,
22618
+ role: "option",
22619
+ "aria-disabled": !enabled2,
22620
+ "aria-selected": selected2,
22621
+ className: classnames(styles$O.multiSelectOption, {
22622
+ [styles$O.disabledOption]: !enabled2,
22623
+ [styles$O.highlighted]: isHighlighted
22624
+ }),
22625
+ onMouseDown: (e) => {
22626
+ e.preventDefault();
22627
+ e.stopPropagation();
22628
+ },
22629
+ onClick: handleClick,
22630
+ "data-state": selected2 ? "checked" : void 0,
22631
+ children: /* @__PURE__ */ jsx("div", { className: styles$O.multiSelectOptionContent, children: optionRenderer ? optionRenderer({ label: label2, value, enabled: enabled2 }, selectedValue, false) : /* @__PURE__ */ jsxs(Fragment, { children: [
22632
+ children || label2,
22633
+ selected2 && /* @__PURE__ */ jsx(Icon$l, { name: "checkmark" })
22634
+ ] }) })
22635
+ }
22636
+ );
22637
+ }
22638
+ function SelectOptionItem(option) {
22639
+ const {
22640
+ value,
22641
+ label: label2,
22642
+ enabled: enabled2 = true,
22643
+ readOnly: readOnly2,
22644
+ children,
22645
+ isHighlighted = false,
22646
+ itemIndex
22647
+ } = option;
22648
+ const {
22649
+ value: selectedValue,
22650
+ onChange,
22651
+ multiSelect,
22652
+ setOpen,
22653
+ setSelectedIndex,
22654
+ optionRenderer
22655
+ } = useSelect();
22656
+ const optionRef = useRef(null);
22657
+ const selected2 = useMemo(() => {
22658
+ return Array.isArray(selectedValue) && multiSelect ? selectedValue.map((v) => String(v)).includes(value) : String(selectedValue) === String(value);
22659
+ }, [selectedValue, value, multiSelect]);
22660
+ useEffect(() => {
22661
+ if (isHighlighted && optionRef.current) {
22662
+ optionRef.current.scrollIntoView({ block: "nearest", behavior: "smooth" });
22663
+ }
22664
+ }, [isHighlighted]);
22665
+ const handleClick = () => {
22666
+ if (readOnly2) {
22667
+ setOpen(false);
22668
+ return;
22669
+ }
22670
+ if (enabled2) {
22671
+ onChange(value);
22672
+ }
22673
+ };
22674
+ return /* @__PURE__ */ jsx(
22675
+ "div",
22676
+ {
22677
+ ref: optionRef,
22678
+ role: "option",
22679
+ "aria-disabled": !enabled2,
22680
+ "aria-selected": selected2,
22681
+ className: classnames(styles$O.multiSelectOption, {
22682
+ [styles$O.disabledOption]: !enabled2,
22683
+ [styles$O.highlighted]: isHighlighted
22684
+ }),
22685
+ onMouseDown: (e) => {
22686
+ e.preventDefault();
22687
+ e.stopPropagation();
22688
+ },
22689
+ onMouseEnter: () => {
22690
+ if (itemIndex !== void 0 && setSelectedIndex && enabled2) {
22691
+ setSelectedIndex(itemIndex);
22692
+ }
22693
+ },
22694
+ onClick: handleClick,
22695
+ "data-state": selected2 ? "checked" : void 0,
22696
+ children: /* @__PURE__ */ jsx("div", { className: styles$O.multiSelectOptionContent, children: optionRenderer ? optionRenderer({ label: label2, value, enabled: enabled2 }, selectedValue, false) : /* @__PURE__ */ jsxs(Fragment, { children: [
22697
+ children || label2,
22698
+ selected2 && /* @__PURE__ */ jsx(Icon$l, { name: "checkmark" })
22699
+ ] }) })
22700
+ }
22701
+ );
22702
+ }
22751
22703
  const themeVars$y = `'{"gap-RadioGroupOption": "var(--xmlui-gap-RadioGroupOption)", "borderWidth-RadioGroupOption": "var(--xmlui-borderWidth-RadioGroupOption)", "borderWidth-RadioGroupOption-validation": "var(--xmlui-borderWidth-RadioGroupOption-validation)", "Input:borderColor-RadioGroupOption-default": "var(--xmlui-borderColor-RadioGroupOption-default)", "Input:borderColor-checked-RadioGroupOption": "var(--xmlui-borderColor-checked-RadioGroupOption)", "Input:borderColor-RadioGroupOption-default--hover": "var(--xmlui-borderColor-RadioGroupOption-default--hover)", "Input:borderColor-RadioGroupOption-default--active": "var(--xmlui-borderColor-RadioGroupOption-default--active)", "Input:borderColor-RadioGroupOption--disabled": "var(--xmlui-borderColor-RadioGroupOption--disabled)", "Input:borderColor-RadioGroupOption-error": "var(--xmlui-borderColor-RadioGroupOption-error)", "Input:borderColor-RadioGroupOption-warning": "var(--xmlui-borderColor-RadioGroupOption-warning)", "Input:borderColor-RadioGroupOption-success": "var(--xmlui-borderColor-RadioGroupOption-success)", "Input:backgroundColor-RadioGroupOption-default": "var(--xmlui-backgroundColor-RadioGroupOption-default)", "Input:backgroundColor-checked-RadioGroupOption": "var(--xmlui-backgroundColor-checked-RadioGroupOption)", "Input:backgroundColor-checked-RadioGroupOption--disabled": "var(--xmlui-backgroundColor-checked-RadioGroupOption--disabled)", "Input:color-RadioGroupOption--disabled": "var(--xmlui-color-RadioGroupOption--disabled)", "Input:fontSize-RadioGroupOption": "var(--xmlui-fontSize-RadioGroupOption)", "Input:fontWeight-RadioGroupOption": "var(--xmlui-fontWeight-RadioGroupOption)", "Input:textColor-RadioGroupOption-default": "var(--xmlui-textColor-RadioGroupOption-default)", "Input:textColor-RadioGroupOption-error": "var(--xmlui-textColor-RadioGroupOption-error)", "Input:textColor-RadioGroupOption-warning": "var(--xmlui-textColor-RadioGroupOption-warning)", "Input:textColor-RadioGroupOption-success": "var(--xmlui-textColor-RadioGroupOption-success)", "Input:outlineWidth-RadioGroupOption--focus": "var(--xmlui-outlineWidth-RadioGroupOption--focus)", "Input:outlineColor-RadioGroupOption--focus": "var(--xmlui-outlineColor-RadioGroupOption--focus)", "Input:outlineStyle-RadioGroupOption--focus": "var(--xmlui-outlineStyle-RadioGroupOption--focus)", "Input:outlineOffset-RadioGroupOption--focus": "var(--xmlui-outlineOffset-RadioGroupOption--focus)"}'`;
22752
22704
  const radioGroupContainer = "_radioGroupContainer_fn2iu_14";
22753
22705
  const radioOptionContainer = "_radioOptionContainer_fn2iu_20";
@@ -23492,7 +23444,15 @@ const AutoComplete = forwardRef(function AutoComplete2({
23492
23444
  onDidChange(newValue);
23493
23445
  }, [multi, updateState, onDidChange]);
23494
23446
  const onOptionAdd = useCallback((option) => {
23495
- setOptions((prev) => new Set(prev).add(option));
23447
+ setOptions((prev) => {
23448
+ const newSet = new Set(prev);
23449
+ const existing = Array.from(prev).find((opt) => opt.value === option.value);
23450
+ if (existing) {
23451
+ newSet.delete(existing);
23452
+ }
23453
+ newSet.add(option);
23454
+ return newSet;
23455
+ });
23496
23456
  }, []);
23497
23457
  const onOptionRemove = useCallback((option) => {
23498
23458
  setOptions((prev) => {
@@ -23708,6 +23668,14 @@ const AutoComplete = forwardRef(function AutoComplete2({
23708
23668
  }
23709
23669
  ),
23710
23670
  "aria-expanded": open,
23671
+ onClick: (event) => {
23672
+ if (readOnly2) return;
23673
+ if (multi && open) {
23674
+ return;
23675
+ }
23676
+ event.stopPropagation();
23677
+ setOpen((prev) => !prev);
23678
+ },
23711
23679
  children: [
23712
23680
  Array.isArray(selectedValue) && selectedValue.length > 0 && /* @__PURE__ */ jsx("div", { className: styles$L.badgeList, children: selectedValue.map((v, index) => /* @__PURE__ */ jsxs("span", { className: styles$L.badge, children: [
23713
23681
  v == null ? void 0 : v.label,
@@ -23805,7 +23773,7 @@ const AutoComplete = forwardRef(function AutoComplete2({
23805
23773
  ]
23806
23774
  }
23807
23775
  ) }),
23808
- open && /* @__PURE__ */ jsx(Portal$1, { container: root2, children: /* @__PURE__ */ jsx(
23776
+ open && /* @__PURE__ */ jsx(Portal, { container: root2, children: /* @__PURE__ */ jsx(
23809
23777
  PopoverContent,
23810
23778
  {
23811
23779
  style: { width, height: dropdownHeight },
@@ -23855,7 +23823,7 @@ const AutoComplete = forwardRef(function AutoComplete2({
23855
23823
  ] }) }) });
23856
23824
  });
23857
23825
  function CreatableItem({ onNewItem, isHighlighted = false }) {
23858
- const { value, options: options2, searchTerm, onChange, setOpen, setSelectedIndex } = useAutoComplete();
23826
+ const { value, options: options2, searchTerm, onChange, setOpen, setSelectedIndex, multi } = useAutoComplete();
23859
23827
  const { onOptionAdd } = useOption();
23860
23828
  if (isOptionsExist(options2, [{ value: searchTerm, label: searchTerm }]) || Array.isArray(value) && (value == null ? void 0 : value.find((s) => s === searchTerm)) || searchTerm === value) {
23861
23829
  return /* @__PURE__ */ jsx("span", { style: { display: "none" } });
@@ -23865,7 +23833,9 @@ function CreatableItem({ onNewItem, isHighlighted = false }) {
23865
23833
  onOptionAdd(newOption);
23866
23834
  onNewItem == null ? void 0 : onNewItem(searchTerm);
23867
23835
  onChange(searchTerm);
23868
- setOpen(false);
23836
+ if (!multi) {
23837
+ setOpen(false);
23838
+ }
23869
23839
  };
23870
23840
  const Item2 = /* @__PURE__ */ jsx(
23871
23841
  "div",
@@ -23916,7 +23886,9 @@ function AutoCompleteOption(option) {
23916
23886
  const handleClick = () => {
23917
23887
  if (!readOnly2 && enabled2) {
23918
23888
  onChange(value);
23919
- setOpen(false);
23889
+ if (!multi) {
23890
+ setOpen(false);
23891
+ }
23920
23892
  }
23921
23893
  };
23922
23894
  return /* @__PURE__ */ jsx(
@@ -30080,6 +30052,7 @@ const modalViewComponentRenderer = createComponentRenderer(
30080
30052
  ModalDialogMd,
30081
30053
  ({
30082
30054
  node,
30055
+ contextVars,
30083
30056
  extractValue,
30084
30057
  className,
30085
30058
  renderChild: renderChild2,
@@ -30103,7 +30076,11 @@ const modalViewComponentRenderer = createComponentRenderer(
30103
30076
  node,
30104
30077
  renderChild: renderChild2,
30105
30078
  layoutContext: { _insideModalFrame: true },
30106
- contextVars: { $param: openParams == null ? void 0 : openParams[0], $params: openParams }
30079
+ contextVars: {
30080
+ ...contextVars,
30081
+ $param: openParams == null ? void 0 : openParams[0],
30082
+ $params: openParams
30083
+ }
30107
30084
  }
30108
30085
  );
30109
30086
  }
@@ -33591,7 +33568,7 @@ const selectComponentRenderer = createComponentRenderer(
33591
33568
  updateState: isControlled ? void 0 : updateState,
33592
33569
  searchable,
33593
33570
  initialValue: extractValue(node.props.initialValue),
33594
- value: isControlled ? extractValue(node.props.value) : state == null ? void 0 : state.value,
33571
+ value: state == null ? void 0 : state.value,
33595
33572
  autoFocus: extractValue.asOptionalBoolean(node.props.autoFocus),
33596
33573
  enabled: extractValue.asOptionalBoolean(node.props.enabled),
33597
33574
  placeholder: extractValue.asOptionalString(node.props.placeholder),
@@ -33626,7 +33603,7 @@ const selectComponentRenderer = createComponentRenderer(
33626
33603
  $selectedValue: val,
33627
33604
  $inTrigger: inTrigger
33628
33605
  },
33629
- renderChild: (...args) => multiSelect || searchable ? renderChild2(...args) : /* @__PURE__ */ jsx(SelectItemText, { children: renderChild2(...args) })
33606
+ renderChild: renderChild2
33630
33607
  }
33631
33608
  );
33632
33609
  } : void 0,
@@ -39064,7 +39041,7 @@ const Tabs = forwardRef(function Tabs2({
39064
39041
  className: classnames(className, styles$o.tabs, styles$o.accordionView),
39065
39042
  style: style2,
39066
39043
  children: /* @__PURE__ */ jsx(
39067
- Root$1,
39044
+ Root,
39068
39045
  {
39069
39046
  value: `${currentTab}`,
39070
39047
  onValueChange: (tab) => {
@@ -39080,7 +39057,7 @@ const Tabs = forwardRef(function Tabs2({
39080
39057
  className: styles$o.accordionRoot,
39081
39058
  children: /* @__PURE__ */ jsxs("div", { className: styles$o.accordionInterleaved, children: [
39082
39059
  /* @__PURE__ */ jsx(List, { className: styles$o.accordionList, children: tabItems.map((tab, index) => /* @__PURE__ */ jsx(
39083
- Trigger$1,
39060
+ Trigger,
39084
39061
  {
39085
39062
  value: tab.innerId,
39086
39063
  asChild: true,
@@ -39115,7 +39092,7 @@ const Tabs = forwardRef(function Tabs2({
39115
39092
  ) });
39116
39093
  }
39117
39094
  return /* @__PURE__ */ jsx(TabContext.Provider, { value: tabContextValue, children: /* @__PURE__ */ jsxs(
39118
- Root$1,
39095
+ Root,
39119
39096
  {
39120
39097
  ...rest,
39121
39098
  id: tabsId,
@@ -39147,7 +39124,7 @@ const Tabs = forwardRef(function Tabs2({
39147
39124
  children: [
39148
39125
  !distributeEvenly2 && !headerRenderer && tabAlignment === "end" && /* @__PURE__ */ jsx("div", { className: styles$o.filler, "data-orientation": orientation }),
39149
39126
  !distributeEvenly2 && !headerRenderer && tabAlignment === "center" && /* @__PURE__ */ jsx("div", { className: styles$o.filler, "data-orientation": orientation }),
39150
- tabItems.map((tab, index) => /* @__PURE__ */ jsx(Trigger$1, { value: tab.innerId, asChild: true, children: /* @__PURE__ */ jsx(
39127
+ tabItems.map((tab, index) => /* @__PURE__ */ jsx(Trigger, { value: tab.innerId, asChild: true, children: /* @__PURE__ */ jsx(
39151
39128
  "div",
39152
39129
  {
39153
39130
  role: "tab",
@@ -39743,7 +39720,7 @@ const TabItemComponent = forwardRef(function TabItemComponent2({ children, label
39743
39720
  const tabIndex = (tabItems == null ? void 0 : tabItems.findIndex((item2) => item2.innerId === innerId)) ?? 0;
39744
39721
  const contentOrder = tabIndex * 2 + 1;
39745
39722
  return /* @__PURE__ */ createElement(
39746
- Content$1,
39723
+ Content,
39747
39724
  {
39748
39725
  ...rest,
39749
39726
  key: innerId,
@@ -47744,7 +47721,7 @@ function IconProvider({ children }) {
47744
47721
  /* @__PURE__ */ jsx("svg", { style: { display: "none" }, ref: spriteRootRef })
47745
47722
  ] });
47746
47723
  }
47747
- const version = "0.10.24";
47724
+ const version = "0.10.25";
47748
47725
  const miscellaneousUtils = {
47749
47726
  capitalize,
47750
47727
  pluralize: pluralize$1,
@@ -48021,21 +47998,21 @@ function createContainerReducer(debugView) {
48021
47998
  case ContainerActionKind.EVENT_HANDLER_STARTED: {
48022
47999
  const { eventName } = action2.payload;
48023
48000
  const inProgressFlagName = `${eventName}InProgress`;
48024
- state[uid] = { ...state[uid], [inProgressFlagName]: true };
48001
+ state[uid] = state[uid] ? { ...state[uid], [inProgressFlagName]: true } : { [inProgressFlagName]: true };
48025
48002
  storeNextValue(state[uid]);
48026
48003
  break;
48027
48004
  }
48028
48005
  case ContainerActionKind.EVENT_HANDLER_COMPLETED: {
48029
48006
  const { eventName } = action2.payload;
48030
48007
  const inProgressFlagName = `${eventName}InProgress`;
48031
- state[uid] = { ...state[uid], [inProgressFlagName]: false };
48008
+ state[uid] = state[uid] ? { ...state[uid], [inProgressFlagName]: false } : { [inProgressFlagName]: false };
48032
48009
  storeNextValue(state[uid]);
48033
48010
  break;
48034
48011
  }
48035
48012
  case ContainerActionKind.EVENT_HANDLER_ERROR: {
48036
48013
  const { eventName } = action2.payload;
48037
48014
  const inProgressFlagName = `${eventName}InProgress`;
48038
- state[uid] = { ...state[uid], [inProgressFlagName]: false };
48015
+ state[uid] = state[uid] ? { ...state[uid], [inProgressFlagName]: false } : { [inProgressFlagName]: false };
48039
48016
  storeNextValue(state[uid]);
48040
48017
  break;
48041
48018
  }
@@ -49609,7 +49586,9 @@ const Container = memo(
49609
49586
  const runCodeAsync = useEvent(
49610
49587
  async (source, componentUid, options2, ...eventArgs) => {
49611
49588
  var _a3, _b, _c;
49612
- const canSignEventLifecycle = () => componentUid.description !== void 0 && (options2 == null ? void 0 : options2.eventName) !== void 0;
49589
+ const canSignEventLifecycle = () => {
49590
+ return componentUid.description !== void 0 && (options2 == null ? void 0 : options2.eventName) !== void 0;
49591
+ };
49613
49592
  let changes = [];
49614
49593
  const getComponentStateClone = () => {
49615
49594
  changes.length = 0;
@@ -50261,7 +50240,9 @@ const StateContainer = memo(
50261
50240
  const routingParams = useRoutingParams();
50262
50241
  const memoedVars = useRef(/* @__PURE__ */ new Map());
50263
50242
  const stateFromOutside = useShallowCompareMemoize(
50264
- useMemo(() => extractScopedState(parentState, node.uses), [node.uses, parentState])
50243
+ useMemo(() => {
50244
+ return extractScopedState(parentState, node.uses);
50245
+ }, [node.uses, parentState])
50265
50246
  );
50266
50247
  const debugView = useDebugView();
50267
50248
  const containerReducer = createContainerReducer(debugView);
@@ -50270,10 +50251,15 @@ const StateContainer = memo(
50270
50251
  const componentStateWithApis = useShallowCompareMemoize(
50271
50252
  useMemo(() => {
50272
50253
  const ret = { ...componentState };
50254
+ const registeredApiKeys = new Set(
50255
+ Object.getOwnPropertySymbols(componentApis).map((s) => s.description).filter((d2) => d2 !== void 0)
50256
+ );
50273
50257
  for (const stateKey of Object.getOwnPropertySymbols(componentState)) {
50274
50258
  const value = componentState[stateKey];
50275
50259
  if (stateKey.description) {
50276
- ret[stateKey.description] = value;
50260
+ if (registeredApiKeys.has(stateKey.description)) {
50261
+ ret[stateKey.description] = value;
50262
+ }
50277
50263
  }
50278
50264
  }
50279
50265
  if (Reflect.ownKeys(componentApis).length === 0) {
@@ -50337,8 +50323,11 @@ const StateContainer = memo(
50337
50323
  const mergedWithVars = useMergedState(resolvedLocalVars, componentStateWithApis);
50338
50324
  const combinedState = useCombinedState(
50339
50325
  stateFromOutside,
50326
+ // Parent state (lower priority) - allows local vars to shadow
50340
50327
  node.contextVars,
50328
+ // Context vars like $item
50341
50329
  mergedWithVars,
50330
+ // Local vars and component state (higher priority) - enables shadowing
50342
50331
  routingParams
50343
50332
  );
50344
50333
  const registerComponentApi = useCallback((uid, api) => {
@@ -51222,9 +51211,19 @@ const ComponentAdapter = forwardRef(function ComponentAdapter2({
51222
51211
  const stableLayoutCss = useShallowCompareMemoize(cssProps);
51223
51212
  const className = useComponentStyle(stableLayoutCss);
51224
51213
  const { inspectId, refreshInspection } = useInspector(safeNode, uid);
51214
+ const contextVars = useMemo(() => {
51215
+ const vars2 = {};
51216
+ for (const key of Object.keys(state)) {
51217
+ if (key.startsWith("$")) {
51218
+ vars2[key] = state[key];
51219
+ }
51220
+ }
51221
+ return vars2;
51222
+ }, [state]);
51225
51223
  const rendererContext = {
51226
51224
  node: safeNode,
51227
51225
  state: state[uid] || EMPTY_OBJECT,
51226
+ contextVars,
51228
51227
  updateState: memoedUpdateState,
51229
51228
  appContext,
51230
51229
  extractValue: valueExtractor,
@@ -52197,7 +52196,7 @@ function ApiInterceptorProvider({
52197
52196
  return;
52198
52197
  }
52199
52198
  void (async () => {
52200
- const { initMock } = await import("./initMock-DQrGwkya.mjs");
52199
+ const { initMock } = await import("./initMock-BVxHA6wu.mjs");
52201
52200
  const apiInstance2 = await initMock(interceptor);
52202
52201
  setApiInstance(apiInstance2);
52203
52202
  setInitialized(true);
@@ -52214,7 +52213,7 @@ function ApiInterceptorProvider({
52214
52213
  if (define_process_env_default$2.VITE_MOCK_ENABLED) {
52215
52214
  const [{ createApiInterceptorWorker }, { initMock }] = await Promise.all([
52216
52215
  useWorker ? import("./apiInterceptorWorker-Dql7QGw2.mjs") : Promise.resolve({ createApiInterceptorWorker: () => null }),
52217
- import("./initMock-DQrGwkya.mjs")
52216
+ import("./initMock-BVxHA6wu.mjs")
52218
52217
  ]);
52219
52218
  if (interceptor || forceInitialize) {
52220
52219
  const apiInstance2 = await initMock(interceptor || {});
@@ -52251,7 +52250,7 @@ function ApiInterceptorProvider({
52251
52250
  void (async () => {
52252
52251
  const [{ createApiInterceptorWorker }, { initMock }] = await Promise.all([
52253
52252
  import("./apiInterceptorWorker-Dql7QGw2.mjs"),
52254
- import("./initMock-DQrGwkya.mjs")
52253
+ import("./initMock-BVxHA6wu.mjs")
52255
52254
  ]);
52256
52255
  const apiInstance2 = await initMock(interceptor);
52257
52256
  await createApiInterceptorWorker(apiInstance2, parentInterceptorWorker);
@@ -57216,7 +57215,7 @@ const Slider = forwardRef(
57216
57215
  thumbsRef.current = thumbsRef.current.slice(0, displayValue.length);
57217
57216
  }, [displayValue.length]);
57218
57217
  return /* @__PURE__ */ jsx("div", { ...rest, ref, style: style2, className: classnames(styles$K.sliderContainer, className), "data-slider-container": true, children: /* @__PURE__ */ jsxs(
57219
- Root$2,
57218
+ Root$1,
57220
57219
  {
57221
57220
  ref: inputRef,
57222
57221
  minStepsBetweenThumbs,
@@ -57745,7 +57744,7 @@ const FormItem = memo(function FormItem2({
57745
57744
  onBlur,
57746
57745
  style: style2,
57747
57746
  className,
57748
- validationResult: /* @__PURE__ */ jsx("div", { ref: animateContainerRef, children: isHelperTextShown && (validationResult == null ? void 0 : validationResult.validations.map((singleValidation, i) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
57747
+ validationResult: /* @__PURE__ */ jsx("div", { ref: animateContainerRef, className: styles$1j.helperTextContainer, children: isHelperTextShown && (validationResult == null ? void 0 : validationResult.validations.map((singleValidation, i) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
57749
57748
  singleValidation.isValid && !!singleValidation.validMessage && /* @__PURE__ */ jsx(
57750
57749
  HelperText,
57751
57750
  {