@easypost/easy-ui 1.0.0-alpha.4 → 1.0.0-alpha.6

package/Select/index.js

@@ -0,0 +1,816 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __knownSymbol = (name, symbol) => {
+  if (symbol = Symbol[name])
+    return symbol;
+  throw Error("Symbol." + name + " is not defined");
+};
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __await = function(promise, isYieldStar) {
+  this[0] = promise;
+  this[1] = isYieldStar;
+};
+var __yieldStar = (value) => {
+  var obj = value[__knownSymbol("asyncIterator")];
+  var isAwait = false;
+  var method;
+  var it = {};
+  if (obj == null) {
+    obj = value[__knownSymbol("iterator")]();
+    method = (k) => it[k] = (x) => obj[k](x);
+  } else {
+    obj = obj.call(value);
+    method = (k) => it[k] = (v) => {
+      if (isAwait) {
+        isAwait = false;
+        if (k === "throw")
+          throw v;
+        return v;
+      }
+      isAwait = true;
+      return {
+        done: false,
+        value: new __await(new Promise((resolve) => {
+          var x = obj[k](v);
+          if (!(x instanceof Object))
+            throw TypeError("Object expected");
+          resolve(x);
+        }), 1)
+      };
+    };
+  }
+  return it[__knownSymbol("iterator")] = () => it, method("next"), "throw" in obj ? method("throw") : it.throw = (x) => {
+    throw x;
+  }, "return" in obj && method("return"), it;
+};
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const React = require("react");
+const utilities_css = require("../utilities/css.js");
+const InputIcon = require("../__chunks__/InputIcon-d3963cf8.js");
+const Text_index = require("../Text/index.js");
+const ExpandMore400 = require("../__chunks__/ExpandMore400-92646971.js");
+const UnstyledButton_index = require("../__chunks__/index-3985350a.js");
+const _import = require("../__chunks__/import-a1e0f814.js");
+const useTriggerWidth = require("../__chunks__/useTriggerWidth-156b038a.js");
+const _import$1 = require("../__chunks__/import-2b302763.js");
+const _import$2 = require("../__chunks__/import-24a482e1.js");
+const _import$3 = require("../__chunks__/import-a2023d8f.js");
+const realModule = require("../__chunks__/real-module-e36b1436.js");
+const _import$4 = require("../__chunks__/import-dea5a24d.js");
+require("../Icon/index.js");
+require("../__chunks__/omit-fca26542.js");
+require("react-dom");
+const $b1f0cad8af73213b$export$3585ede4d035bf14 = /* @__PURE__ */ new WeakMap();
+function $b1f0cad8af73213b$var$normalizeKey(key) {
+  if (typeof key === "string")
+    return key.replace(/\s*/g, "");
+  return "" + key;
+}
+function $b1f0cad8af73213b$export$9145995848b05025(state, itemKey) {
+  let data = $b1f0cad8af73213b$export$3585ede4d035bf14.get(state);
+  if (!data)
+    throw new Error("Unknown list");
+  return `${data.id}-option-${$b1f0cad8af73213b$var$normalizeKey(itemKey)}`;
+}
+function $c132121280ec012d$export$50eacbbf140a3141(props, state, ref) {
+  let domProps = _import.$65484d02dcb7eb3e$export$457c3d6518dd4c6f(props, {
+    labelable: true
+  });
+  let { listProps } = useTriggerWidth.$982254629710d113$export$b95089534ab7c1fd(__spreadProps(__spreadValues({}, props), {
+    ref,
+    selectionManager: state.selectionManager,
+    collection: state.collection,
+    disabledKeys: state.disabledKeys
+  }));
+  let { focusWithinProps } = _import$1.$9ab94262bd0047c7$export$420e68273165f4ec({
+    onFocusWithin: props.onFocus,
+    onBlurWithin: props.onBlur,
+    onFocusWithinChange: props.onFocusChange
+  });
+  let id = _import.$bdb11010cef70236$export$f680877a34711e37(props.id);
+  $b1f0cad8af73213b$export$3585ede4d035bf14.set(state, {
+    id,
+    shouldUseVirtualFocus: props.shouldUseVirtualFocus,
+    shouldSelectOnPressUp: props.shouldSelectOnPressUp,
+    shouldFocusOnHover: props.shouldFocusOnHover,
+    isVirtualized: props.isVirtualized,
+    onAction: props.onAction
+  });
+  let { labelProps, fieldProps } = _import$2.$d191a55c9702f145$export$8467354a121f1b9f(__spreadProps(__spreadValues({}, props), {
+    id,
+    // listbox is not an HTML input element so it
+    // shouldn't be labeled by a <label> element.
+    labelElementType: "span"
+  }));
+  return {
+    labelProps,
+    listBoxProps: _import.$3ef42575df84b30b$export$9d1611c77c2fe928(domProps, focusWithinProps, state.selectionManager.selectionMode === "multiple" ? {
+      "aria-multiselectable": "true"
+    } : {}, __spreadValues({
+      role: "listbox"
+    }, _import.$3ef42575df84b30b$export$9d1611c77c2fe928(fieldProps, listProps)))
+  };
+}
+function $293f70390ea03370$export$497855f14858aa34(props, state, ref) {
+  let { key } = props;
+  let data = $b1f0cad8af73213b$export$3585ede4d035bf14.get(state);
+  var _props_isDisabled;
+  let isDisabled = (_props_isDisabled = props.isDisabled) !== null && _props_isDisabled !== void 0 ? _props_isDisabled : state.disabledKeys.has(key);
+  var _props_isSelected;
+  let isSelected = (_props_isSelected = props.isSelected) !== null && _props_isSelected !== void 0 ? _props_isSelected : state.selectionManager.isSelected(key);
+  var _props_shouldSelectOnPressUp;
+  let shouldSelectOnPressUp = (_props_shouldSelectOnPressUp = props.shouldSelectOnPressUp) !== null && _props_shouldSelectOnPressUp !== void 0 ? _props_shouldSelectOnPressUp : data === null || data === void 0 ? void 0 : data.shouldSelectOnPressUp;
+  var _props_shouldFocusOnHover;
+  let shouldFocusOnHover = (_props_shouldFocusOnHover = props.shouldFocusOnHover) !== null && _props_shouldFocusOnHover !== void 0 ? _props_shouldFocusOnHover : data === null || data === void 0 ? void 0 : data.shouldFocusOnHover;
+  var _props_shouldUseVirtualFocus;
+  let shouldUseVirtualFocus = (_props_shouldUseVirtualFocus = props.shouldUseVirtualFocus) !== null && _props_shouldUseVirtualFocus !== void 0 ? _props_shouldUseVirtualFocus : data === null || data === void 0 ? void 0 : data.shouldUseVirtualFocus;
+  var _props_isVirtualized;
+  let isVirtualized = (_props_isVirtualized = props.isVirtualized) !== null && _props_isVirtualized !== void 0 ? _props_isVirtualized : data === null || data === void 0 ? void 0 : data.isVirtualized;
+  let labelId = _import.$bdb11010cef70236$export$b4cc09c592e8fdb8();
+  let descriptionId = _import.$bdb11010cef70236$export$b4cc09c592e8fdb8();
+  let optionProps = {
+    role: "option",
+    "aria-disabled": isDisabled || void 0,
+    "aria-selected": state.selectionManager.selectionMode !== "none" ? isSelected : void 0
+  };
+  if (!(_import.$c87311424ea30a05$export$9ac100e40613ea10() && _import.$c87311424ea30a05$export$78551043582a6a98())) {
+    optionProps["aria-label"] = props["aria-label"];
+    optionProps["aria-labelledby"] = labelId;
+    optionProps["aria-describedby"] = descriptionId;
+  }
+  if (isVirtualized) {
+    var _state_collection_getItem;
+    let index = Number((_state_collection_getItem = state.collection.getItem(key)) === null || _state_collection_getItem === void 0 ? void 0 : _state_collection_getItem.index);
+    optionProps["aria-posinset"] = Number.isNaN(index) ? void 0 : index + 1;
+    optionProps["aria-setsize"] = useTriggerWidth.$453cc9f0df89c0a5$export$77d5aafae4e095b2(state.collection);
+  }
+  let { itemProps, isPressed, isFocused, hasAction, allowsSelection } = useTriggerWidth.$880e95eb8b93ba9a$export$ecf600387e221c37({
+    selectionManager: state.selectionManager,
+    key,
+    ref,
+    shouldSelectOnPressUp,
+    allowsDifferentPressOrigin: shouldSelectOnPressUp && shouldFocusOnHover,
+    isVirtualized,
+    shouldUseVirtualFocus,
+    isDisabled,
+    onAction: (data === null || data === void 0 ? void 0 : data.onAction) ? () => {
+      var _data_onAction;
+      return data === null || data === void 0 ? void 0 : (_data_onAction = data.onAction) === null || _data_onAction === void 0 ? void 0 : _data_onAction.call(data, key);
+    } : void 0
+  });
+  let { hoverProps } = _import$1.$6179b936705e76d3$export$ae780daf29e6d456({
+    isDisabled: isDisabled || !shouldFocusOnHover,
+    onHoverStart() {
+      if (!_import$1.$507fabe10e71c6fb$export$b9b3dfddab17db27()) {
+        state.selectionManager.setFocused(true);
+        state.selectionManager.setFocusedKey(key);
+      }
+    }
+  });
+  return {
+    optionProps: __spreadProps(__spreadValues(__spreadValues({}, optionProps), _import.$3ef42575df84b30b$export$9d1611c77c2fe928(itemProps, hoverProps)), {
+      id: $b1f0cad8af73213b$export$9145995848b05025(state, key)
+    }),
+    labelProps: {
+      id: labelId
+    },
+    descriptionProps: {
+      id: descriptionId
+    },
+    isFocused,
+    isFocusVisible: isFocused && _import$1.$507fabe10e71c6fb$export$b9b3dfddab17db27(),
+    isSelected,
+    isDisabled,
+    isPressed,
+    allowsSelection,
+    hasAction
+  };
+}
+function $af383d3bef1cfdc9$export$c3f9f39876e4bc7(props) {
+  let { heading, "aria-label": ariaLabel } = props;
+  let headingId = _import.$bdb11010cef70236$export$f680877a34711e37();
+  return {
+    itemProps: {
+      role: "presentation"
+    },
+    headingProps: heading ? {
+      // Techincally, listbox cannot contain headings according to ARIA.
+      // We hide the heading from assistive technology, using role="presentation",
+      // and only use it as a visual label for the nested group.
+      id: headingId,
+      role: "presentation"
+    } : {},
+    groupProps: {
+      role: "group",
+      "aria-label": ariaLabel,
+      "aria-labelledby": heading ? headingId : void 0
+    }
+  };
+}
+function $58aed456727eb0f3$export$e64b2f635402ca43(props, state, ref) {
+  let { keyboardDelegate, isDisabled } = props;
+  let collator = realModule.$325a3faab7a68acd$export$a16aca283550c30d({
+    usage: "search",
+    sensitivity: "base"
+  });
+  let delegate = React.useMemo(() => keyboardDelegate || new useTriggerWidth.$2a25aae57d74318e$export$a05409b8bb224a5a(state.collection, state.disabledKeys, null, collator), [
+    keyboardDelegate,
+    state.collection,
+    state.disabledKeys,
+    collator
+  ]);
+  let { menuTriggerProps, menuProps } = useTriggerWidth.$168583247155ddda$export$dc9c12ed27dd1b49({
+    isDisabled,
+    type: "listbox"
+  }, state, ref);
+  let onKeyDown = (e) => {
+    switch (e.key) {
+      case "ArrowLeft": {
+        e.preventDefault();
+        let key = state.selectedKey != null ? delegate.getKeyAbove(state.selectedKey) : delegate.getFirstKey();
+        if (key)
+          state.setSelectedKey(key);
+        break;
+      }
+      case "ArrowRight": {
+        e.preventDefault();
+        let key = state.selectedKey != null ? delegate.getKeyBelow(state.selectedKey) : delegate.getFirstKey();
+        if (key)
+          state.setSelectedKey(key);
+        break;
+      }
+    }
+  };
+  let { typeSelectProps } = useTriggerWidth.$fb3050f43d946246$export$e32c88dfddc6e1d8({
+    keyboardDelegate: delegate,
+    selectionManager: state.selectionManager,
+    onTypeSelect(key) {
+      state.setSelectedKey(key);
+    }
+  });
+  let { labelProps, fieldProps, descriptionProps, errorMessageProps } = _import$2.$2baaea4c71418dea$export$294aa081a6c6f55d(__spreadProps(__spreadValues({}, props), {
+    labelElementType: "span"
+  }));
+  typeSelectProps.onKeyDown = typeSelectProps.onKeyDownCapture;
+  delete typeSelectProps.onKeyDownCapture;
+  let domProps = _import.$65484d02dcb7eb3e$export$457c3d6518dd4c6f(props, {
+    labelable: true
+  });
+  let triggerProps = _import.$3ef42575df84b30b$export$9d1611c77c2fe928(typeSelectProps, menuTriggerProps, fieldProps);
+  let valueId = _import.$bdb11010cef70236$export$f680877a34711e37();
+  return {
+    labelProps: __spreadProps(__spreadValues({}, labelProps), {
+      onClick: () => {
+        if (!props.isDisabled) {
+          ref.current.focus();
+          _import$1.$507fabe10e71c6fb$export$8397ddfc504fdb9a("keyboard");
+        }
+      }
+    }),
+    triggerProps: _import.$3ef42575df84b30b$export$9d1611c77c2fe928(domProps, __spreadProps(__spreadValues({}, triggerProps), {
+      isDisabled,
+      onKeyDown: _import.$ff5963eb1fccf552$export$e08e3b67e392101e(triggerProps.onKeyDown, onKeyDown, props.onKeyDown),
+      onKeyUp: props.onKeyUp,
+      "aria-labelledby": [
+        valueId,
+        triggerProps["aria-labelledby"],
+        triggerProps["aria-label"] && !triggerProps["aria-labelledby"] ? triggerProps.id : null
+      ].filter(Boolean).join(" "),
+      onFocus(e) {
+        if (state.isFocused)
+          return;
+        if (props.onFocus)
+          props.onFocus(e);
+        if (props.onFocusChange)
+          props.onFocusChange(true);
+        state.setFocused(true);
+      },
+      onBlur(e) {
+        if (state.isOpen)
+          return;
+        if (props.onBlur)
+          props.onBlur(e);
+        if (props.onFocusChange)
+          props.onFocusChange(false);
+        state.setFocused(false);
+      }
+    })),
+    valueProps: {
+      id: valueId
+    },
+    menuProps: __spreadProps(__spreadValues({}, menuProps), {
+      autoFocus: state.focusStrategy || true,
+      shouldSelectOnPressUp: true,
+      shouldFocusOnHover: true,
+      disallowEmptySelection: true,
+      onBlur: (e) => {
+        if (e.currentTarget.contains(e.relatedTarget))
+          return;
+        if (props.onBlur)
+          props.onBlur(e);
+        if (props.onFocusChange)
+          props.onFocusChange(false);
+        state.setFocused(false);
+      },
+      "aria-labelledby": [
+        fieldProps["aria-labelledby"],
+        triggerProps["aria-label"] && !fieldProps["aria-labelledby"] ? triggerProps.id : null
+      ].filter(Boolean).join(" ")
+    }),
+    descriptionProps,
+    errorMessageProps
+  };
+}
+function $bdd25dc72710631f$export$f809e80f58e251d1(props, state, triggerRef) {
+  let { autoComplete, name, isDisabled } = props;
+  let modality = _import$1.$507fabe10e71c6fb$export$98e20ec92f614cfe();
+  let { visuallyHiddenProps } = _import$3.$5c3e21d68f1c4674$export$a966af930f325cab();
+  var _state_selectedKey;
+  return {
+    containerProps: __spreadProps(__spreadValues({}, visuallyHiddenProps), {
+      "aria-hidden": true
+    }),
+    inputProps: {
+      type: "text",
+      tabIndex: modality == null || state.isFocused || state.isOpen ? -1 : 0,
+      style: {
+        fontSize: 16
+      },
+      onFocus: () => triggerRef.current.focus(),
+      disabled: isDisabled
+    },
+    selectProps: {
+      tabIndex: -1,
+      autoComplete,
+      disabled: isDisabled,
+      name,
+      size: state.collection.size,
+      value: (_state_selectedKey = state.selectedKey) !== null && _state_selectedKey !== void 0 ? _state_selectedKey : "",
+      onChange: (e) => state.setSelectedKey(e.target.value)
+    }
+  };
+}
+function $bdd25dc72710631f$export$cbd84cdb2e668835(props) {
+  let { state, triggerRef, label, name, isDisabled } = props;
+  let { containerProps, inputProps, selectProps } = $bdd25dc72710631f$export$f809e80f58e251d1(props, state, triggerRef);
+  var _state_selectedKey;
+  if (state.collection.size <= 300)
+    return /* @__PURE__ */ React.createElement("div", containerProps, /* @__PURE__ */ React.createElement("input", inputProps), /* @__PURE__ */ React.createElement("label", null, label, /* @__PURE__ */ React.createElement("select", selectProps, /* @__PURE__ */ React.createElement("option", null), [
+      ...state.collection.getKeys()
+    ].map((key) => {
+      let item = state.collection.getItem(key);
+      if (item.type === "item")
+        return /* @__PURE__ */ React.createElement("option", {
+          key: item.key,
+          value: item.key
+        }, item.textValue);
+    }))));
+  else if (name)
+    return /* @__PURE__ */ React.createElement("input", {
+      type: "hidden",
+      autoComplete: selectProps.autoComplete,
+      name,
+      disabled: isDisabled,
+      value: (_state_selectedKey = state.selectedKey) !== null && _state_selectedKey !== void 0 ? _state_selectedKey : ""
+    });
+  return null;
+}
+class $a02d57049d202695$export$d085fb9e920b5ca7 {
+  *[Symbol.iterator]() {
+    yield* __yieldStar(this.iterable);
+  }
+  get size() {
+    return this.keyMap.size;
+  }
+  getKeys() {
+    return this.keyMap.keys();
+  }
+  getKeyBefore(key) {
+    let node = this.keyMap.get(key);
+    return node ? node.prevKey : null;
+  }
+  getKeyAfter(key) {
+    let node = this.keyMap.get(key);
+    return node ? node.nextKey : null;
+  }
+  getFirstKey() {
+    return this.firstKey;
+  }
+  getLastKey() {
+    return this.lastKey;
+  }
+  getItem(key) {
+    return this.keyMap.get(key);
+  }
+  at(idx) {
+    const keys = [
+      ...this.getKeys()
+    ];
+    return this.getItem(keys[idx]);
+  }
+  getChildren(key) {
+    let node = this.keyMap.get(key);
+    return (node === null || node === void 0 ? void 0 : node.childNodes) || [];
+  }
+  constructor(nodes) {
+    this.keyMap = /* @__PURE__ */ new Map();
+    this.iterable = nodes;
+    let visit = (node) => {
+      this.keyMap.set(node.key, node);
+      if (node.childNodes && node.type === "section")
+        for (let child of node.childNodes)
+          visit(child);
+    };
+    for (let node of nodes)
+      visit(node);
+    let last;
+    let index = 0;
+    for (let [key, node] of this.keyMap) {
+      if (last) {
+        last.nextKey = key;
+        node.prevKey = last.key;
+      } else {
+        this.firstKey = key;
+        node.prevKey = void 0;
+      }
+      if (node.type === "item")
+        node.index = index++;
+      last = node;
+      last.nextKey = void 0;
+    }
+    this.lastKey = last === null || last === void 0 ? void 0 : last.key;
+  }
+}
+function $e72dd72e1c76a225$export$2f645645f7bca764(props) {
+  let { filter } = props;
+  let selectionState = useTriggerWidth.$7af3f5b51489e0b5$export$253fe78d46329472(props);
+  let disabledKeys = React.useMemo(() => props.disabledKeys ? new Set(props.disabledKeys) : /* @__PURE__ */ new Set(), [
+    props.disabledKeys
+  ]);
+  let factory = React.useCallback((nodes) => filter ? new $a02d57049d202695$export$d085fb9e920b5ca7(filter(nodes)) : new $a02d57049d202695$export$d085fb9e920b5ca7(nodes), [
+    filter
+  ]);
+  let context = React.useMemo(() => ({
+    suppressTextValueWarning: props.suppressTextValueWarning
+  }), [
+    props.suppressTextValueWarning
+  ]);
+  let collection = useTriggerWidth.$7613b1592d41b092$export$6cd28814d92fa9c9(props, factory, context);
+  let selectionManager = React.useMemo(() => new useTriggerWidth.$d496c0a20b6e58ec$export$6c8a5aaad13c9852(collection, selectionState), [
+    collection,
+    selectionState
+  ]);
+  const cachedCollection = React.useRef(null);
+  React.useEffect(() => {
+    if (selectionState.focusedKey != null && !collection.getItem(selectionState.focusedKey)) {
+      const startItem = cachedCollection.current.getItem(selectionState.focusedKey);
+      const cachedItemNodes = [
+        ...cachedCollection.current.getKeys()
+      ].map((key) => {
+        const itemNode = cachedCollection.current.getItem(key);
+        return itemNode.type === "item" ? itemNode : null;
+      }).filter((node) => node !== null);
+      const itemNodes = [
+        ...collection.getKeys()
+      ].map((key) => {
+        const itemNode = collection.getItem(key);
+        return itemNode.type === "item" ? itemNode : null;
+      }).filter((node) => node !== null);
+      const diff = cachedItemNodes.length - itemNodes.length;
+      let index = Math.min(diff > 1 ? Math.max(startItem.index - diff + 1, 0) : startItem.index, itemNodes.length - 1);
+      let newNode;
+      while (index >= 0) {
+        if (!selectionManager.isDisabled(itemNodes[index].key)) {
+          newNode = itemNodes[index];
+          break;
+        }
+        if (index < itemNodes.length - 1)
+          index++;
+        else {
+          if (index > startItem.index)
+            index = startItem.index;
+          index--;
+        }
+      }
+      selectionState.setFocusedKey(newNode ? newNode.key : null);
+    }
+    cachedCollection.current = collection;
+  }, [
+    collection,
+    selectionManager,
+    selectionState,
+    selectionState.focusedKey
+  ]);
+  return {
+    collection,
+    disabledKeys,
+    selectionManager
+  };
+}
+function $a0d645289fe9b86b$export$e7f05e985daf4b5f(props) {
+  var _props_defaultSelectedKey;
+  let [selectedKey, setSelectedKey] = _import$4.$458b0a5536c1a7cf$export$40bfa8c7b0832715(props.selectedKey, (_props_defaultSelectedKey = props.defaultSelectedKey) !== null && _props_defaultSelectedKey !== void 0 ? _props_defaultSelectedKey : null, props.onSelectionChange);
+  let selectedKeys = React.useMemo(() => selectedKey != null ? [
+    selectedKey
+  ] : [], [
+    selectedKey
+  ]);
+  let { collection, disabledKeys, selectionManager } = $e72dd72e1c76a225$export$2f645645f7bca764(__spreadProps(__spreadValues({}, props), {
+    selectionMode: "single",
+    disallowEmptySelection: true,
+    allowDuplicateSelectionEvents: true,
+    selectedKeys,
+    onSelectionChange: (keys) => {
+      let key = keys.values().next().value;
+      if (key === selectedKey && props.onSelectionChange)
+        props.onSelectionChange(key);
+      setSelectedKey(key);
+    }
+  }));
+  let selectedItem = selectedKey != null ? collection.getItem(selectedKey) : null;
+  return {
+    collection,
+    disabledKeys,
+    selectionManager,
+    selectedKey,
+    setSelectedKey,
+    selectedItem
+  };
+}
+function $2bc3a590c5373a4e$export$5159ec8b34d4ec12(props) {
+  let triggerState = useTriggerWidth.$a28c903ee9ad8dc5$export$79fefeb1c2091ac3(props);
+  let listState = $a0d645289fe9b86b$export$e7f05e985daf4b5f(__spreadProps(__spreadValues({}, props), {
+    onSelectionChange: (key) => {
+      if (props.onSelectionChange != null)
+        props.onSelectionChange(key);
+      triggerState.close();
+    }
+  }));
+  let [isFocused, setFocused] = React.useState(false);
+  return __spreadProps(__spreadValues(__spreadValues({}, listState), triggerState), {
+    open() {
+      if (listState.collection.size !== 0)
+        triggerState.open();
+    },
+    toggle(focusStrategy) {
+      if (listState.collection.size !== 0)
+        triggerState.toggle(focusStrategy);
+    },
+    isFocused,
+    setFocused
+  });
+}
+const InternalSelectContext = React.createContext(null);
+function useInternalSelectContext() {
+  const selectContext = React.useContext(InternalSelectContext);
+  if (!selectContext) {
+    throw new Error("InternalSelectContext must be used inside a <Select />");
+  }
+  return selectContext;
+}
+const underlay = "_underlay_134q0_5";
+const listboxRoot = "_listboxRoot_134q0_10";
+const listbox = "_listbox_134q0_10";
+const listboxList = "_listboxList_134q0_65";
+const sectionList = "_sectionList_134q0_66";
+const optionContent = "_optionContent_134q0_72";
+const separator = "_separator_134q0_73";
+const option = "_option_134q0_72";
+const fieldRoot = "_fieldRoot_134q0_116";
+const selectField = "_selectField_134q0_137";
+const selectSizeSm = "_selectSizeSm_134q0_176";
+const selectSizeLg = "_selectSizeLg_134q0_190";
+const selectFieldError = "_selectFieldError_134q0_198";
+const selectFieldIconStart = "_selectFieldIconStart_134q0_206";
+const selectFieldIconEnd = "_selectFieldIconEnd_134q0_210";
+const selectFieldIconContainer = "_selectFieldIconContainer_134q0_214";
+const selectFieldText = "_selectFieldText_134q0_220";
+const listboxOpen = "_listboxOpen_134q0_224";
+const styles = {
+  underlay,
+  listboxRoot,
+  listbox,
+  listboxList,
+  sectionList,
+  optionContent,
+  separator,
+  option,
+  fieldRoot,
+  selectField,
+  selectSizeSm,
+  selectSizeLg,
+  selectFieldError,
+  selectFieldIconStart,
+  selectFieldIconEnd,
+  selectFieldIconContainer,
+  selectFieldText,
+  listboxOpen
+};
+function SelectTrigger(props) {
+  const { size = "md", valueProps, iconAtStart, hasError, isDisabled, children } = props;
+  const { triggerProps, triggerRef, selectState } = useInternalSelectContext();
+  const hasStartIcon = !!iconAtStart;
+  const className = utilities_css.classNames(styles.selectField, styles.selectFieldIconEnd, selectState.isOpen && styles.listboxOpen, hasError && styles.selectFieldError, hasStartIcon && styles.selectFieldIconStart, styles[utilities_css.variationName("selectSize", size)]);
+  return React.createElement("div", {
+    className: styles.selectFieldIconContainer
+  }, hasStartIcon && React.createElement(InputIcon.InputIcon, {
+    alignment: "start",
+    icon: iconAtStart,
+    size,
+    isDisabled
+  }), React.createElement(UnstyledButton_index.UnstyledButton, __spreadProps(__spreadValues({}, triggerProps), {
+    ref: triggerRef,
+    className
+  }), React.createElement("span", __spreadProps(__spreadValues({}, valueProps), {
+    className: styles.selectFieldText
+  }), children)), React.createElement(InputIcon.InputIcon, {
+    alignment: "end",
+    icon: ExpandMore400.ExpandMore400,
+    size,
+    isDisabled
+  }));
+}
+function SelectField(props) {
+  const { isLabelVisuallyHidden = false, isDisabled = false, validationState = "valid", isLabelEmphasized = false, size = "md", label, errorText, helperText, placeholder, iconAtStart, labelProps, valueProps, errorTextProps, helperTextProps } = props;
+  const { triggerRef, selectState } = useInternalSelectContext();
+  const hasError = validationState === "invalid";
+  const showErrorText = hasError && errorText;
+  const showHelperText = !showErrorText && helperText;
+  const captionProps = showHelperText ? helperTextProps : errorTextProps;
+  const captionText = showHelperText ? helperText : errorText;
+  return React.createElement("div", {
+    className: utilities_css.classNames(styles.fieldRoot)
+  }, React.createElement(InputIcon.Label, __spreadValues({
+    isLabelVisuallyHidden,
+    fieldSize: size,
+    hasError,
+    isLabelEmphasized
+  }, labelProps), label), React.createElement($bdd25dc72710631f$export$cbd84cdb2e668835, {
+    isDisabled,
+    state: selectState,
+    triggerRef,
+    label
+  }), React.createElement(SelectTrigger, {
+    valueProps,
+    iconAtStart,
+    hasError,
+    isDisabled,
+    size
+  }, selectState.selectedItem ? selectState.selectedItem.rendered : React.createElement(Text_index.Text, {
+    color: "subdued"
+  }, placeholder)), (showErrorText || showHelperText) && React.createElement(InputIcon.InputCaption, __spreadValues({
+    variant: showHelperText ? "helper" : "error"
+  }, captionProps), captionText));
+}
+function SelectOption(_props) {
+  return null;
+}
+Object.assign(SelectOption, useTriggerWidth.$c1d7fb2ec91bae71$export$6d08773d2e66f8f2);
+function SelectOptionContent({ item, state }) {
+  const ref = React.useRef(null);
+  const { optionProps, isSelected, isFocused, isDisabled } = $293f70390ea03370$export$497855f14858aa34({
+    key: item.key
+  }, state, ref);
+  return React.createElement("li", __spreadProps(__spreadValues({}, optionProps), {
+    ref,
+    className: styles.option,
+    "data-is-disabled": isDisabled,
+    "data-is-focused": isFocused,
+    "data-is-selected": isSelected
+  }), React.createElement("div", {
+    className: styles.optionContent
+  }, React.createElement(Text_index.Text, {
+    variant: "body1",
+    truncate: true
+  }, item.rendered)));
+}
+function SelectSection(_props) {
+  return null;
+}
+Object.assign(SelectSection, useTriggerWidth.$9fc4852771d079eb$export$6e2c8f0811a474ce);
+function SelectSectionContent({ section, state }) {
+  const { itemProps, groupProps } = $af383d3bef1cfdc9$export$c3f9f39876e4bc7({
+    "aria-label": section["aria-label"]
+  });
+  const { separatorProps } = useTriggerWidth.$f4b273590fab9f93$export$52210f68a14655d0({
+    elementType: "li"
+  });
+  return React.createElement(React.Fragment, null, section.key !== state.collection.getFirstKey() && React.createElement("li", __spreadProps(__spreadValues({}, separatorProps), {
+    className: styles.separator
+  })), React.createElement("li", __spreadValues({}, itemProps), section.hasChildNodes && React.createElement("ul", __spreadProps(__spreadValues({}, groupProps), {
+    className: styles.sectionList
+  }), [...section.childNodes].map((item) => {
+    return React.createElement(SelectOptionContent, {
+      key: item.key,
+      item,
+      state
+    });
+  }))));
+}
+function SelectOverlay() {
+  const { selectState, triggerWidth } = useInternalSelectContext();
+  if (!selectState.isOpen || triggerWidth === null) {
+    return null;
+  }
+  return React.createElement(SelectOverlayContent, null);
+}
+function SelectOverlayContent() {
+  const { selectState, triggerRef, listBoxPropsFromSelect, triggerWidth } = useInternalSelectContext();
+  const popoverRef = React.useRef(null);
+  const listBoxRef = React.useRef(null);
+  const { popoverProps, underlayProps } = _import$3.$f2f8a6077418541e$export$542a6fd13ac93354({
+    containerPadding: useTriggerWidth.OVERLAY_PADDING_FROM_CONTAINER,
+    maxHeight: useTriggerWidth.ITEM_HEIGHT * Infinity + useTriggerWidth.Y_PADDING_INSIDE_OVERLAY * 2 + 2,
+    offset: useTriggerWidth.OVERLAY_OFFSET,
+    placement: useTriggerWidth.DEFAULT_PLACEMENT,
+    popoverRef,
+    scrollRef: listBoxRef,
+    triggerRef
+  }, selectState);
+  const { listBoxProps } = $c132121280ec012d$export$50eacbbf140a3141(listBoxPropsFromSelect, selectState, listBoxRef);
+  const style = __spreadValues(__spreadValues({}, popoverProps.style), useTriggerWidth.getUnmergedPopoverStyles(useTriggerWidth.DEFAULT_WIDTH, triggerWidth));
+  return React.createElement(_import$3.$f57aed4a881a3485$export$b47c3594eab58386, null, React.createElement("div", __spreadProps(__spreadValues({}, underlayProps), {
+    className: styles.underlay
+  })), React.createElement("div", __spreadProps(__spreadValues({}, _import.$3ef42575df84b30b$export$9d1611c77c2fe928(popoverProps, {
+    style
+  })), {
+    ref: popoverRef,
+    className: styles.listboxRoot
+  }), React.createElement(_import$3.$86ea4cb521eb2e37$export$2317d149ed6f78c4, {
+    onDismiss: selectState.close
+  }), React.createElement("div", __spreadProps(__spreadValues({}, listBoxProps), {
+    ref: listBoxRef,
+    className: styles.listbox,
+    "data-width": useTriggerWidth.DEFAULT_WIDTH,
+    "data-max-items-until-scroll": Infinity,
+    "data-overlayscrollbars-initialize": true
+  }), React.createElement("ul", {
+    className: styles.listboxList
+  }, [...selectState.collection].map((item) => {
+    return item.type === "section" ? React.createElement(SelectSectionContent, {
+      key: item.key,
+      section: item,
+      state: selectState
+    }) : React.createElement(SelectOptionContent, {
+      key: item.key,
+      item,
+      state: selectState
+    });
+  }))), React.createElement(_import$3.$86ea4cb521eb2e37$export$2317d149ed6f78c4, {
+    onDismiss: selectState.close
+  })));
+}
+function Select(props) {
+  const { isLabelVisuallyHidden, isDisabled, validationState, isLabelEmphasized, size = "md", label, errorText, helperText, placeholder, iconAtStart } = props;
+  const triggerRef = React.useRef(null);
+  const selectState = $2bc3a590c5373a4e$export$5159ec8b34d4ec12(props);
+  const { labelProps, valueProps, triggerProps, menuProps: listBoxPropsFromSelect, descriptionProps: helperTextProps, errorMessageProps: errorTextProps } = $58aed456727eb0f3$export$e64b2f635402ca43(props, selectState, triggerRef);
+  const triggerWidth = useTriggerWidth.useTriggerWidth(triggerRef);
+  const context = React.useMemo(() => {
+    return {
+      triggerProps,
+      listBoxPropsFromSelect,
+      triggerRef,
+      selectState,
+      triggerWidth
+    };
+  }, [triggerProps, listBoxPropsFromSelect, selectState, triggerWidth]);
+  return React.createElement(InternalSelectContext.Provider, {
+    value: context
+  }, React.createElement(SelectField, {
+    isLabelVisuallyHidden,
+    isDisabled,
+    validationState,
+    isLabelEmphasized,
+    size,
+    label,
+    errorText,
+    helperText,
+    placeholder,
+    iconAtStart,
+    labelProps,
+    valueProps,
+    helperTextProps,
+    errorTextProps
+  }), React.createElement(SelectOverlay, null));
+}
+Select.Section = SelectSection;
+Select.Option = SelectOption;
+exports.Select = Select;