@charcoal-ui/react 2.0.1 → 2.1.0

package/dist/index.module.js

@@ -1,4371 +0,0 @@
-import React, { useContext, useCallback, createContext, useMemo, useRef, useState, useEffect, useImperativeHandle, memo, Fragment, forwardRef } from 'react';
-import { useSSRSafeId, useIsSSR } from '@react-aria/ssr';
-export { SSRProvider } from '@react-aria/ssr';
-import styled, { css, useTheme, keyframes } from 'styled-components';
-import { createTheme, useMedia } from '@charcoal-ui/styled';
-import { disabledSelector, px, maxWidth } from '@charcoal-ui/utils';
-import warning from 'warning';
-import { useSwitch } from '@react-aria/switch';
-import { useToggleState, useSelectState, Item, useRadioGroupState } from 'react-stately';
-import { useTextField } from '@react-aria/textfield';
-import { useVisuallyHidden } from '@react-aria/visually-hidden';
-import '@charcoal-ui/icons';
-import { useOverlay, usePreventScroll, useModalOverlay, Overlay, DismissButton } from '@react-aria/overlays';
-import { FocusScope, focusSafely, getFocusableTreeWalker, useFocusRing } from '@react-aria/focus';
-import { useDialog } from '@react-aria/dialog';
-import { animated, useTransition, easings } from 'react-spring';
-import { transparentize } from 'polished';
-import { useSelect, HiddenSelect } from '@react-aria/select';
-import { useButton } from '@react-aria/button';
-import { useRadioGroup, useRadio } from '@react-aria/radio';
-import { useCheckbox } from '@react-aria/checkbox';
-
-function _extends() {
-  _extends = Object.assign || function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-
-    return target;
-  };
-
-  return _extends.apply(this, arguments);
-}
-
-function _objectWithoutPropertiesLoose(source, excluded) {
-  if (source == null) return {};
-  var target = {};
-  var sourceKeys = Object.keys(source);
-  var key, i;
-
-  for (i = 0; i < sourceKeys.length; i++) {
-    key = sourceKeys[i];
-    if (excluded.indexOf(key) >= 0) continue;
-    target[key] = source[key];
-  }
-
-  return target;
-}
-
-function _taggedTemplateLiteralLoose(strings, raw) {
-  if (!raw) {
-    raw = strings.slice(0);
-  }
-
-  strings.raw = raw;
-  return strings;
-}
-
-function _unsupportedIterableToArray(o, minLen) {
-  if (!o) return;
-  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
-  var n = Object.prototype.toString.call(o).slice(8, -1);
-  if (n === "Object" && o.constructor) n = o.constructor.name;
-  if (n === "Map" || n === "Set") return Array.from(o);
-  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
-}
-
-function _arrayLikeToArray(arr, len) {
-  if (len == null || len > arr.length) len = arr.length;
-
-  for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
-
-  return arr2;
-}
-
-function _createForOfIteratorHelperLoose(o, allowArrayLike) {
-  var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"];
-  if (it) return (it = it.call(o)).next.bind(it);
-
-  if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") {
-    if (it) o = it;
-    var i = 0;
-    return function () {
-      if (i >= o.length) return {
-        done: true
-      };
-      return {
-        done: false,
-        value: o[i++]
-      };
-    };
-  }
-
-  throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-}
-
-var _excluded$d = ["to", "children"];
-var DefaultLink = React.forwardRef(function DefaultLink(_ref, ref) {
-  var to = _ref.to,
-      children = _ref.children,
-      rest = _objectWithoutPropertiesLoose(_ref, _excluded$d);
-
-  return /*#__PURE__*/React.createElement("a", _extends({
-    href: to,
-    ref: ref
-  }, rest), children);
-});
-var DefaultValue = {
-  Link: DefaultLink
-};
-var ComponentAbstractionContext = React.createContext(DefaultValue);
-function ComponentAbstraction(_ref2) {
-  var children = _ref2.children,
-      components = _ref2.components;
-  return /*#__PURE__*/React.createElement(ComponentAbstractionContext.Provider, {
-    value: _extends({}, DefaultValue, components)
-  }, children);
-}
-function useComponentAbstraction() {
-  return useContext(ComponentAbstractionContext);
-}
-
-/**
- * 今後ポートされる予定の汎用的な関数群
- */
-function unreachable(value) {
-  throw new Error(arguments.length === 0 ? 'unreachable' : "unreachable (" + JSON.stringify(value) + ")");
-}
-
-var theme$2 = createTheme(styled);
-
-var _templateObject$e, _templateObject2$c, _templateObject3$c;
-
-var _excluded$c = ["onClick", "disabled"];
-var Clickable = React.forwardRef(function Clickable(props, ref) {
-  var _useComponentAbstract = useComponentAbstraction(),
-      Link = _useComponentAbstract.Link;
-
-  if ('to' in props) {
-    var onClick = props.onClick,
-        _props$disabled = props.disabled,
-        disabled = _props$disabled === void 0 ? false : _props$disabled,
-        rest = _objectWithoutPropertiesLoose(props, _excluded$c);
-
-    return /*#__PURE__*/React.createElement(A, _extends({}, rest, {
-      as: disabled ? undefined : Link,
-      onClick: disabled ? undefined : onClick,
-      "aria-disabled": disabled,
-      ref: ref
-    }));
-  } else {
-    return /*#__PURE__*/React.createElement(Button$1, _extends({}, props, {
-      ref: ref
-    }));
-  }
-});
-var clickableCss = css(_templateObject$e || (_templateObject$e = _taggedTemplateLiteralLoose(["\n  /* Clickable style */\n  cursor: pointer;\n\n  ", " {\n    cursor: default;\n  }\n"])), disabledSelector);
-var Button$1 = styled.button(_templateObject2$c || (_templateObject2$c = _taggedTemplateLiteralLoose(["\n  /* Reset button appearance */\n  appearance: none;\n  background: transparent;\n  padding: 0;\n  border-style: none;\n  outline: none;\n  color: inherit;\n  text-rendering: inherit;\n  letter-spacing: inherit;\n  word-spacing: inherit;\n\n  &:focus {\n    outline: none;\n  }\n\n  /* Change the font styles in all browsers. */\n  font: inherit;\n\n  /* Remove the margin in Firefox and Safari. */\n  margin: 0;\n\n  /* Show the overflow in Edge. */\n  overflow: visible;\n\n  /* Remove the inheritance of text transform in Firefox. */\n  text-transform: none;\n\n  /* Remove the inner border and padding in Firefox. */\n  &::-moz-focus-inner {\n    border-style: none;\n    padding: 0;\n  }\n\n  ", "\n"])), clickableCss);
-var A = styled.span(_templateObject3$c || (_templateObject3$c = _taggedTemplateLiteralLoose(["\n  /* Reset a-tag appearance */\n  color: inherit;\n\n  &:focus {\n    outline: none;\n  }\n\n  .text {\n    top: calc(1em + 2em);\n  }\n\n  ", "\n"])), clickableCss);
-
-var _templateObject$d;
-
-var _excluded$b = ["children", "variant", "size", "fixed", "disabled"];
-var Button = React.forwardRef(function Button(_ref, ref) {
-  var children = _ref.children,
-      _ref$variant = _ref.variant,
-      variant = _ref$variant === void 0 ? 'Default' : _ref$variant,
-      _ref$size = _ref.size,
-      size = _ref$size === void 0 ? 'M' : _ref$size,
-      _ref$fixed = _ref.fixed,
-      fixed = _ref$fixed === void 0 ? false : _ref$fixed,
-      _ref$disabled = _ref.disabled,
-      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-      rest = _objectWithoutPropertiesLoose(_ref, _excluded$b);
-
-  return /*#__PURE__*/React.createElement(StyledButton, _extends({}, rest, {
-    disabled: disabled,
-    variant: variant,
-    size: size,
-    fixed: fixed,
-    ref: ref
-  }), children);
-});
-var StyledButton = styled(Clickable).withConfig({
-  shouldForwardProp: function shouldForwardProp(prop) {
-    // fixed は <button> 要素に渡ってはいけない
-    return prop !== 'fixed';
-  }
-}).attrs(styledProps$1)(_templateObject$d || (_templateObject$d = _taggedTemplateLiteralLoose(["\n  width: ", ";\n  display: inline-grid;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  user-select: none;\n  white-space: nowrap;\n\n  ", "\n\n  /* \u3088\u304F\u8003\u3048\u305F\u3089height=32\u3063\u3066\u5B9A\u7FA9\u304C\u5B58\u5728\u3057\u306A\u3044\u306A... */\n  height: ", "px;\n"])), function (p) {
-  return p.fixed ? 'stretch' : 'min-content';
-}, function (p) {
-  return theme$2(function (o) {
-    return [o.font[p.font].hover.press, o.bg[p.background].hover.press, o.typography(14).bold.preserveHalfLeading, o.padding.horizontal(p.padding), o.disabled, o.borderRadius('oval'), o.outline["default"].focus];
-  });
-}, function (p) {
-  return p.height;
-});
-
-function styledProps$1(props) {
-  return _extends({}, props, variantToProps$1(props.variant), sizeToProps$1(props.size));
-}
-
-function variantToProps$1(variant) {
-  switch (variant) {
-    case 'Overlay':
-      return {
-        font: 'text5',
-        background: 'surface4'
-      };
-
-    case 'Default':
-      return {
-        font: 'text2',
-        background: 'surface3'
-      };
-
-    case 'Primary':
-      return {
-        font: 'text5',
-        background: 'brand'
-      };
-
-    case 'Navigation':
-      return {
-        font: 'text5',
-        background: 'surface6'
-      };
-
-    case 'Danger':
-      return {
-        font: 'text5',
-        background: 'assertive'
-      };
-
-    default:
-      return unreachable(variant);
-  }
-}
-
-function sizeToProps$1(size) {
-  switch (size) {
-    case 'S':
-      return {
-        height: 32,
-        padding: 16
-      };
-
-    case 'M':
-      return {
-        height: 40,
-        padding: 24
-      };
-  }
-}
-
-var _templateObject$c;
-
-var _excluded$a = ["variant", "size", "icon"];
-var IconButton = React.forwardRef(function IconButtonInner(_ref, ref) {
-  var _ref$variant = _ref.variant,
-      variant = _ref$variant === void 0 ? 'Default' : _ref$variant,
-      _ref$size = _ref.size,
-      size = _ref$size === void 0 ? 'M' : _ref$size,
-      icon = _ref.icon,
-      rest = _objectWithoutPropertiesLoose(_ref, _excluded$a);
-
-  validateIconSize(size, icon);
-  return /*#__PURE__*/React.createElement(StyledIconButton, _extends({}, rest, {
-    ref: ref,
-    variant: variant,
-    size: size
-  }), /*#__PURE__*/React.createElement("pixiv-icon", {
-    name: icon
-  }));
-});
-var StyledIconButton = styled(Clickable).attrs(styledProps)(_templateObject$c || (_templateObject$c = _taggedTemplateLiteralLoose(["\n  user-select: none;\n\n  width: ", "px;\n  height: ", "px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  ", "\n"])), function (p) {
-  return p.width;
-}, function (p) {
-  return p.height;
-}, function (_ref2) {
-  var font = _ref2.font,
-      background = _ref2.background;
-  return theme$2(function (o) {
-    return [o.font[font], o.bg[background].hover.press, o.disabled, o.borderRadius('oval'), o.outline["default"].focus];
-  });
-});
-
-function styledProps(props) {
-  return _extends({}, props, variantToProps(props.variant), sizeToProps(props.size));
-}
-
-function variantToProps(variant) {
-  switch (variant) {
-    case 'Default':
-      return {
-        font: 'text3',
-        background: 'transparent'
-      };
-
-    case 'Overlay':
-      return {
-        font: 'text5',
-        background: 'surface4'
-      };
-  }
-}
-
-function sizeToProps(size) {
-  switch (size) {
-    case 'XS':
-      return {
-        width: 20,
-        height: 20
-      };
-
-    case 'S':
-      return {
-        width: 32,
-        height: 32
-      };
-
-    case 'M':
-      return {
-        width: 40,
-        height: 40
-      };
-  }
-}
-/**
- * validates matches of size and icon
- */
-
-
-function validateIconSize(size, icon) {
-  var requiredIconSize;
-
-  switch (size) {
-    case 'XS':
-      requiredIconSize = '16';
-      break;
-
-    case 'S':
-    case 'M':
-      requiredIconSize = '24';
-      break;
-  } // アイコン名は サイズ/名前
-
-
-  var result = /^[0-9]*/.exec(icon);
-
-  if (result == null) {
-    throw new Error('Invalid icon name');
-  }
-
-  var iconSize = result[0];
-
-  if (iconSize !== requiredIconSize) {
-    // eslint-disable-next-line no-console
-    console.warn("IconButton with size \"" + size + "\" expect icon size \"" + requiredIconSize + ", but got \"" + iconSize + "\"");
-  }
-}
-
-var _templateObject$b, _templateObject2$b, _templateObject3$b, _templateObject4$9;
-function Radio(_ref) {
-  var value = _ref.value,
-      _ref$forceChecked = _ref.forceChecked,
-      forceChecked = _ref$forceChecked === void 0 ? false : _ref$forceChecked,
-      _ref$disabled = _ref.disabled,
-      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-      children = _ref.children;
-
-  var _useContext = useContext(RadioGroupContext),
-      name = _useContext.name,
-      selected = _useContext.selected,
-      isParentDisabled = _useContext.disabled,
-      readonly = _useContext.readonly,
-      hasError = _useContext.hasError,
-      onChange = _useContext.onChange;
-
-  warning( // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-  name !== undefined, "\"name\" is not Provided for <Radio>. Perhaps you forgot to wrap with <RadioGroup> ?");
-  var isSelected = value === selected;
-  var isDisabled = disabled || isParentDisabled;
-  var isReadonly = readonly && !isSelected;
-  var handleChange = useCallback(function (e) {
-    onChange(e.currentTarget.value);
-  }, [onChange]);
-  return /*#__PURE__*/React.createElement(RadioRoot, {
-    "aria-disabled": isDisabled || isReadonly
-  }, /*#__PURE__*/React.createElement(RadioInput, {
-    name: name,
-    value: value,
-    checked: forceChecked || isSelected,
-    hasError: hasError,
-    onChange: handleChange,
-    disabled: isDisabled || isReadonly
-  }), children != null && /*#__PURE__*/React.createElement(RadioLabel$1, null, children));
-}
-var RadioRoot = styled.label(_templateObject$b || (_templateObject$b = _taggedTemplateLiteralLoose(["\n  display: grid;\n  grid-template-columns: auto 1fr;\n  grid-gap: ", ";\n  align-items: center;\n  cursor: pointer;\n\n  ", "\n"])), function (_ref2) {
-  var theme = _ref2.theme;
-  return px(theme.spacing[4]);
-}, theme$2(function (o) {
-  return [o.disabled];
-}));
-var RadioInput = styled.input.attrs({
-  type: 'radio'
-})(_templateObject2$b || (_templateObject2$b = _taggedTemplateLiteralLoose(["\n  /** Make prior to browser default style */\n  &[type='radio'] {\n    appearance: none;\n    display: block;\n    box-sizing: border-box;\n\n    padding: 6px;\n\n    width: 20px;\n    height: 20px;\n\n    ", ";\n\n    &:not(:checked) {\n      border-width: 2px;\n      border-style: solid;\n      border-color: ", ";\n    }\n\n    &:checked {\n      ", "\n\n      &::after {\n        content: '';\n        display: block;\n        width: 8px;\n        height: 8px;\n        pointer-events: none;\n\n        ", "\n      }\n    }\n\n    ", "\n  }\n"])), function (_ref3) {
-  var _ref3$hasError = _ref3.hasError,
-      hasError = _ref3$hasError === void 0 ? false : _ref3$hasError;
-  return theme$2(function (o) {
-    return [o.borderRadius('oval'), o.bg.text5.hover.press, hasError && o.outline.assertive];
-  });
-}, function (_ref4) {
-  var theme = _ref4.theme;
-  return theme.color.text4;
-}, theme$2(function (o) {
-  return o.bg.brand.hover.press;
-}), theme$2(function (o) {
-  return [o.bg.text5.hover.press, o.borderRadius('oval')];
-}), theme$2(function (o) {
-  return o.outline["default"].focus;
-}));
-var RadioLabel$1 = styled.div(_templateObject3$b || (_templateObject3$b = _taggedTemplateLiteralLoose(["\n  ", "\n"])), theme$2(function (o) {
-  return [o.typography(14)];
-})); // TODO: use (or polyfill) flex gap
-
-var StyledRadioGroup = styled.div(_templateObject4$9 || (_templateObject4$9 = _taggedTemplateLiteralLoose(["\n  display: grid;\n  grid-template-columns: 1fr;\n  grid-gap: ", ";\n"])), function (_ref5) {
-  var theme = _ref5.theme;
-  return px(theme.spacing[8]);
-});
-var RadioGroupContext = React.createContext({
-  name: undefined,
-  selected: undefined,
-  disabled: false,
-  readonly: false,
-  hasError: false,
-  onChange: function onChange() {
-    throw new Error('Cannot find onChange() handler. Perhaps you forgot to wrap with <RadioGroup> ?');
-  }
-});
-function RadioGroup(_ref6) {
-  var className = _ref6.className,
-      value = _ref6.value,
-      label = _ref6.label,
-      name = _ref6.name,
-      onChange = _ref6.onChange,
-      disabled = _ref6.disabled,
-      readonly = _ref6.readonly,
-      hasError = _ref6.hasError,
-      children = _ref6.children;
-  var handleChange = useCallback(function (next) {
-    onChange(next);
-  }, [onChange]);
-  return /*#__PURE__*/React.createElement(RadioGroupContext.Provider, {
-    value: {
-      name: name,
-      selected: value,
-      disabled: disabled != null ? disabled : false,
-      readonly: readonly != null ? readonly : false,
-      hasError: hasError != null ? hasError : false,
-      onChange: handleChange
-    }
-  }, /*#__PURE__*/React.createElement(StyledRadioGroup, {
-    role: "radiogroup",
-    "aria-orientation": "vertical",
-    "aria-label": label,
-    "aria-invalid": hasError,
-    className: className
-  }, children));
-}
-
-var MultiSelectGroupContext = createContext({
-  name: undefined,
-  selected: [],
-  disabled: false,
-  readonly: false,
-  hasError: false,
-  onChange: function onChange() {
-    throw new Error('Cannot find `onChange()` handler. Perhaps you forgot to wrap it with `<MultiSelectGroup />` ?');
-  }
-});
-
-var _templateObject$a, _templateObject2$a, _templateObject3$a, _templateObject4$8, _templateObject5$7;
-function MultiSelect(_ref) {
-  var value = _ref.value,
-      _ref$forceChecked = _ref.forceChecked,
-      forceChecked = _ref$forceChecked === void 0 ? false : _ref$forceChecked,
-      _ref$disabled = _ref.disabled,
-      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-      onChange = _ref.onChange,
-      _ref$variant = _ref.variant,
-      variant = _ref$variant === void 0 ? 'default' : _ref$variant,
-      children = _ref.children;
-
-  var _useContext = useContext(MultiSelectGroupContext),
-      name = _useContext.name,
-      selected = _useContext.selected,
-      parentDisabled = _useContext.disabled,
-      readonly = _useContext.readonly,
-      hasError = _useContext.hasError,
-      parentOnChange = _useContext.onChange;
-
-  warning( // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-  name !== undefined, "\"name\" is not Provided for <MultiSelect>. Perhaps you forgot to wrap with <MultiSelectGroup> ?");
-  var isSelected = selected.includes(value) || forceChecked;
-  var isDisabled = disabled || parentDisabled || readonly;
-  var handleChange = useCallback(function (event) {
-    if (!(event.currentTarget instanceof HTMLInputElement)) {
-      return;
-    }
-
-    if (onChange) onChange({
-      value: value,
-      selected: event.currentTarget.checked
-    });
-    parentOnChange({
-      value: value,
-      selected: event.currentTarget.checked
-    });
-  }, [onChange, parentOnChange, value]);
-  return /*#__PURE__*/React.createElement(MultiSelectRoot, {
-    "aria-disabled": isDisabled
-  }, /*#__PURE__*/React.createElement(MultiSelectInput, {
-    name: name,
-    value: value,
-    hasError: hasError,
-    checked: isSelected,
-    disabled: isDisabled,
-    onChange: handleChange,
-    overlay: variant === 'overlay',
-    "aria-invalid": hasError
-  }), /*#__PURE__*/React.createElement(MultiSelectInputOverlay, {
-    overlay: variant === 'overlay',
-    hasError: hasError,
-    "aria-hidden": true
-  }, /*#__PURE__*/React.createElement("pixiv-icon", {
-    name: "24/Check",
-    "unsafe-non-guideline-scale": 16 / 24
-  })), Boolean(children) && /*#__PURE__*/React.createElement(MultiSelectLabel, null, children));
-}
-var MultiSelectRoot = styled.label(_templateObject$a || (_templateObject$a = _taggedTemplateLiteralLoose(["\n  display: grid;\n  grid-template-columns: auto 1fr;\n  align-items: center;\n  position: relative;\n  cursor: pointer;\n  ", " {\n    cursor: default;\n  }\n  gap: ", ";\n  ", "\n"])), disabledSelector, function (_ref2) {
-  var theme = _ref2.theme;
-  return px(theme.spacing[4]);
-}, theme$2(function (o) {
-  return o.disabled;
-}));
-var MultiSelectLabel = styled.div(_templateObject2$a || (_templateObject2$a = _taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  ", "\n"])), theme$2(function (o) {
-  return [o.typography(14), o.font.text1];
-}));
-var MultiSelectInput = styled.input.attrs({
-  type: 'checkbox'
-})(_templateObject3$a || (_templateObject3$a = _taggedTemplateLiteralLoose(["\n  &[type='checkbox'] {\n    appearance: none;\n    display: block;\n    width: 20px;\n    height: 20px;\n    margin: 0;\n\n    &:checked {\n      ", "\n    }\n\n    ", ";\n  }\n"])), theme$2(function (o) {
-  return o.bg.brand.hover.press;
-}), function (_ref3) {
-  var hasError = _ref3.hasError,
-      overlay = _ref3.overlay;
-  return theme$2(function (o) {
-    return [o.bg.text3.hover.press, o.borderRadius('oval'), hasError && !overlay && o.outline.assertive, overlay && o.bg.surface4];
-  });
-});
-var MultiSelectInputOverlay = styled.div(_templateObject4$8 || (_templateObject4$8 = _taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: -2px;\n  left: -2px;\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  ", "\n\n  ", "\n"])), function (_ref4) {
-  var hasError = _ref4.hasError,
-      overlay = _ref4.overlay;
-  return theme$2(function (o) {
-    return [o.width.px(24), o.height.px(24), o.borderRadius('oval'), o.font.text5, hasError && overlay && o.outline.assertive];
-  });
-}, function (_ref5) {
-  var overlay = _ref5.overlay;
-  return overlay && css(_templateObject5$7 || (_templateObject5$7 = _taggedTemplateLiteralLoose(["\n      border-color: ", ";\n      border-width: 2px;\n      border-style: solid;\n    "])), function (_ref6) {
-    var theme = _ref6.theme;
-    return theme.color.text5;
-  });
-});
-function MultiSelectGroup(_ref7) {
-  var className = _ref7.className,
-      name = _ref7.name,
-      ariaLabel = _ref7.ariaLabel,
-      selected = _ref7.selected,
-      onChange = _ref7.onChange,
-      _ref7$disabled = _ref7.disabled,
-      disabled = _ref7$disabled === void 0 ? false : _ref7$disabled,
-      _ref7$readonly = _ref7.readonly,
-      readonly = _ref7$readonly === void 0 ? false : _ref7$readonly,
-      _ref7$hasError = _ref7.hasError,
-      hasError = _ref7$hasError === void 0 ? false : _ref7$hasError,
-      children = _ref7.children;
-  var handleChange = useCallback(function (payload) {
-    var index = selected.indexOf(payload.value);
-
-    if (payload.selected) {
-      if (index < 0) {
-        onChange([].concat(selected, [payload.value]));
-      }
-    } else {
-      if (index >= 0) {
-        onChange([].concat(selected.slice(0, index), selected.slice(index + 1)));
-      }
-    }
-  }, [onChange, selected]);
-  return /*#__PURE__*/React.createElement(MultiSelectGroupContext.Provider, {
-    value: {
-      name: name,
-      selected: Array.from(new Set(selected)),
-      disabled: disabled,
-      readonly: readonly,
-      hasError: hasError,
-      onChange: handleChange
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    className: className,
-    "aria-label": ariaLabel,
-    "data-testid": "SelectGroup"
-  }, children));
-}
-
-var _templateObject$9, _templateObject2$9, _templateObject3$9;
-
-var _excluded$9 = ["className", "type"];
-function SwitchCheckbox(props) {
-  var disabled = props.disabled,
-      className = props.className;
-  var ariaSwitchProps = useMemo(function () {
-    return _extends({}, props, {
-      // children がいない場合は aria-label をつけないといけない
-      'aria-label': 'children' in props ? undefined : props.label,
-      isDisabled: props.disabled,
-      isSelected: props.checked
-    });
-  }, [props]);
-  var state = useToggleState(ariaSwitchProps);
-  var ref = useRef(null);
-
-  var _useSwitch = useSwitch(ariaSwitchProps, state, ref),
-      _useSwitch$inputProps = _useSwitch.inputProps,
-      rest = _objectWithoutPropertiesLoose(_useSwitch$inputProps, _excluded$9);
-
-  return /*#__PURE__*/React.createElement(Label$1, {
-    className: className,
-    "aria-disabled": disabled
-  }, /*#__PURE__*/React.createElement(SwitchInput, _extends({}, rest, {
-    ref: ref
-  })), 'children' in props ?
-  /*#__PURE__*/
-  // eslint-disable-next-line react/destructuring-assignment
-  React.createElement(LabelInner, null, props.children) : undefined);
-}
-var Label$1 = styled.label(_templateObject$9 || (_templateObject$9 = _taggedTemplateLiteralLoose(["\n  display: inline-grid;\n  grid-template-columns: auto 1fr;\n  gap: ", ";\n  cursor: pointer;\n  outline: 0;\n\n  ", "\n\n  ", " {\n    cursor: default;\n  }\n"])), function (_ref) {
-  var theme = _ref.theme;
-  return px(theme.spacing[4]);
-}, theme$2(function (o) {
-  return o.disabled;
-}), disabledSelector);
-var LabelInner = styled.div(_templateObject2$9 || (_templateObject2$9 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), theme$2(function (o) {
-  return o.typography(14);
-}));
-var SwitchInput = styled.input.attrs({
-  type: 'checkbox'
-})(_templateObject3$9 || (_templateObject3$9 = _taggedTemplateLiteralLoose(["\n  &[type='checkbox'] {\n    appearance: none;\n    display: inline-flex;\n    position: relative;\n    box-sizing: border-box;\n    width: 28px;\n    border: 2px solid transparent;\n    transition: box-shadow 0.2s, background-color 0.2s;\n    cursor: inherit;\n    ", "\n\n    &::after {\n      content: '';\n      position: absolute;\n      display: block;\n      top: 0;\n      left: 0;\n      width: 12px;\n      height: 12px;\n      transform: translateX(0);\n      transition: transform 0.2s;\n      ", "\n    }\n\n    &:checked {\n      ", "\n\n      &::after {\n        transform: translateX(12px);\n      }\n    }\n  }\n"])), theme$2(function (o) {
-  return [o.borderRadius(16), o.height.px(16), o.bg.text4.hover.press, o.outline["default"].focus];
-}), theme$2(function (o) {
-  return [o.bg.text5.hover.press, o.borderRadius('oval')];
-}), theme$2(function (o) {
-  return o.bg.brand.hover.press;
-}));
-
-var _templateObject$8, _templateObject2$8, _templateObject3$8, _templateObject4$7;
-
-var _excluded$8 = ["style", "className", "label", "required", "requiredText", "subLabel"];
-var FieldLabel = React.forwardRef(function FieldLabel(_ref, ref) {
-  var style = _ref.style,
-      className = _ref.className,
-      label = _ref.label,
-      _ref$required = _ref.required,
-      required = _ref$required === void 0 ? false : _ref$required,
-      requiredText = _ref.requiredText,
-      subLabel = _ref.subLabel,
-      labelProps = _objectWithoutPropertiesLoose(_ref, _excluded$8);
-
-  return /*#__PURE__*/React.createElement(FieldLabelWrapper, {
-    style: style,
-    className: className
-  }, /*#__PURE__*/React.createElement(Label, _extends({
-    ref: ref
-  }, labelProps), label), required && /*#__PURE__*/React.createElement(RequiredText, null, requiredText), /*#__PURE__*/React.createElement(SubLabelClickable, null, /*#__PURE__*/React.createElement("span", null, subLabel)));
-});
-var theme$1 = createTheme(styled);
-var Label = styled.label(_templateObject$8 || (_templateObject$8 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), theme$1(function (o) {
-  return [o.typography(14).bold, o.font.text1];
-}));
-var RequiredText = styled.span(_templateObject2$8 || (_templateObject2$8 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), theme$1(function (o) {
-  return [o.typography(14), o.font.text3];
-}));
-var SubLabelClickable = styled.div(_templateObject3$8 || (_templateObject3$8 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), theme$1(function (o) {
-  return [o.typography(14), o.font.text3.hover.press, o.outline["default"].focus];
-}));
-var FieldLabelWrapper = styled.div(_templateObject4$7 || (_templateObject4$7 = _taggedTemplateLiteralLoose(["\n  display: inline-flex;\n  align-items: center;\n\n  > ", " {\n    ", "\n  }\n\n  > ", " {\n    ", "\n  }\n"])), RequiredText, theme$1(function (o) {
-  return o.margin.left(4);
-}), SubLabelClickable, theme$1(function (o) {
-  return o.margin.left('auto');
-}));
-
-var _templateObject$7, _templateObject2$7, _templateObject3$7, _templateObject4$6, _templateObject5$6, _templateObject6$3, _templateObject7$2, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14;
-
-var _excluded$7 = ["onChange"],
-    _excluded2$1 = ["onChange"];
-var theme = createTheme(styled);
-
-function mergeRefs() {
-  var _arguments = arguments;
-  return function (value) {
-    for (var _iterator = _createForOfIteratorHelperLoose([].slice.call(_arguments)), _step; !(_step = _iterator()).done;) {
-      var ref = _step.value;
-
-      if (typeof ref === 'function') {
-        ref(value);
-      } else if (ref !== null) {
-        ref.current = value;
-      }
-    }
-  };
-}
-
-function countCodePointsInString(string) {
-  // [...string] とするとproduction buildで動かなくなる
-  // cf. https://twitter.com/f_subal/status/1497214727511891972
-  return Array.from(string).length;
-}
-
-var TextField = React.forwardRef(function TextField(props, ref) {
-  return props.multiline !== undefined && props.multiline ? /*#__PURE__*/React.createElement(MultiLineTextField, _extends({
-    ref: ref
-  }, props)) : /*#__PURE__*/React.createElement(SingleLineTextField, _extends({
-    ref: ref
-  }, props));
-});
-var SingleLineTextField = React.forwardRef(function SingleLineTextFieldInner(_ref, forwardRef) {
-  var _props$value;
-
-  var onChange = _ref.onChange,
-      props = _objectWithoutPropertiesLoose(_ref, _excluded$7);
-
-  var className = props.className,
-      _props$showLabel = props.showLabel,
-      showLabel = _props$showLabel === void 0 ? false : _props$showLabel,
-      _props$showCount = props.showCount,
-      showCount = _props$showCount === void 0 ? false : _props$showCount,
-      label = props.label,
-      requiredText = props.requiredText,
-      subLabel = props.subLabel,
-      _props$disabled = props.disabled,
-      disabled = _props$disabled === void 0 ? false : _props$disabled,
-      required = props.required,
-      _props$invalid = props.invalid,
-      invalid = _props$invalid === void 0 ? false : _props$invalid,
-      assistiveText = props.assistiveText,
-      maxLength = props.maxLength,
-      _props$prefix = props.prefix,
-      prefix = _props$prefix === void 0 ? null : _props$prefix,
-      _props$suffix = props.suffix,
-      suffix = _props$suffix === void 0 ? null : _props$suffix;
-
-  var _useVisuallyHidden = useVisuallyHidden(),
-      visuallyHiddenProps = _useVisuallyHidden.visuallyHiddenProps;
-
-  var ariaRef = useRef(null);
-  var prefixRef = useRef(null);
-  var suffixRef = useRef(null);
-
-  var _useState = useState(countCodePointsInString((_props$value = props.value) != null ? _props$value : '')),
-      count = _useState[0],
-      setCount = _useState[1];
-
-  var _useState2 = useState(0),
-      prefixWidth = _useState2[0],
-      setPrefixWidth = _useState2[1];
-
-  var _useState3 = useState(0),
-      suffixWidth = _useState3[0],
-      setSuffixWidth = _useState3[1];
-
-  var nonControlled = props.value === undefined;
-  var handleChange = useCallback(function (value) {
-    var count = countCodePointsInString(value);
-
-    if (maxLength !== undefined && count > maxLength) {
-      return;
-    }
-
-    if (nonControlled) {
-      setCount(count);
-    }
-
-    onChange == null ? void 0 : onChange(value);
-  }, [maxLength, nonControlled, onChange]);
-  useEffect(function () {
-    var _props$value2;
-
-    setCount(countCodePointsInString((_props$value2 = props.value) != null ? _props$value2 : ''));
-  }, [props.value]);
-
-  var _useTextField = useTextField(_extends({
-    inputElementType: 'input',
-    isDisabled: disabled,
-    isRequired: required,
-    validationState: invalid ? 'invalid' : 'valid',
-    description: !invalid && assistiveText,
-    errorMessage: invalid && assistiveText,
-    onChange: handleChange
-  }, props), ariaRef),
-      inputProps = _useTextField.inputProps,
-      labelProps = _useTextField.labelProps,
-      descriptionProps = _useTextField.descriptionProps,
-      errorMessageProps = _useTextField.errorMessageProps;
-
-  useEffect(function () {
-    var prefixObserver = new ResizeObserver(function (entries) {
-      setPrefixWidth(entries[0].contentRect.width);
-    });
-    var suffixObserver = new ResizeObserver(function (entries) {
-      setSuffixWidth(entries[0].contentRect.width);
-    });
-
-    if (prefixRef.current !== null) {
-      prefixObserver.observe(prefixRef.current);
-    }
-
-    if (suffixRef.current !== null) {
-      suffixObserver.observe(suffixRef.current);
-    }
-
-    return function () {
-      suffixObserver.disconnect();
-      prefixObserver.disconnect();
-    };
-  }, []);
-  return /*#__PURE__*/React.createElement(TextFieldRoot, {
-    className: className,
-    isDisabled: disabled
-  }, /*#__PURE__*/React.createElement(TextFieldLabel, _extends({
-    label: label,
-    requiredText: requiredText,
-    required: required,
-    subLabel: subLabel
-  }, labelProps, !showLabel ? visuallyHiddenProps : {})), /*#__PURE__*/React.createElement(StyledInputContainer, null, /*#__PURE__*/React.createElement(PrefixContainer, {
-    ref: prefixRef
-  }, /*#__PURE__*/React.createElement(Affix, null, prefix)), /*#__PURE__*/React.createElement(StyledInput, _extends({
-    ref: mergeRefs(forwardRef, ariaRef),
-    invalid: invalid,
-    extraLeftPadding: prefixWidth,
-    extraRightPadding: suffixWidth
-  }, inputProps)), /*#__PURE__*/React.createElement(SuffixContainer, {
-    ref: suffixRef
-  }, /*#__PURE__*/React.createElement(Affix, null, suffix), showCount && /*#__PURE__*/React.createElement(SingleLineCounter, null, maxLength !== undefined ? count + "/" + maxLength : count))), assistiveText != null && assistiveText.length !== 0 && /*#__PURE__*/React.createElement(AssistiveText, _extends({
-    invalid: invalid
-  }, invalid ? errorMessageProps : descriptionProps), assistiveText));
-});
-var MultiLineTextField = React.forwardRef(function MultiLineTextFieldInner(_ref2, forwardRef) {
-  var _props$value3;
-
-  var onChange = _ref2.onChange,
-      props = _objectWithoutPropertiesLoose(_ref2, _excluded2$1);
-
-  var className = props.className,
-      _props$showCount2 = props.showCount,
-      showCount = _props$showCount2 === void 0 ? false : _props$showCount2,
-      _props$showLabel2 = props.showLabel,
-      showLabel = _props$showLabel2 === void 0 ? false : _props$showLabel2,
-      label = props.label,
-      requiredText = props.requiredText,
-      subLabel = props.subLabel,
-      _props$disabled2 = props.disabled,
-      disabled = _props$disabled2 === void 0 ? false : _props$disabled2,
-      required = props.required,
-      _props$invalid2 = props.invalid,
-      invalid = _props$invalid2 === void 0 ? false : _props$invalid2,
-      assistiveText = props.assistiveText,
-      maxLength = props.maxLength,
-      _props$autoHeight = props.autoHeight,
-      autoHeight = _props$autoHeight === void 0 ? false : _props$autoHeight,
-      _props$rows = props.rows,
-      initialRows = _props$rows === void 0 ? 4 : _props$rows;
-
-  var _useVisuallyHidden2 = useVisuallyHidden(),
-      visuallyHiddenProps = _useVisuallyHidden2.visuallyHiddenProps;
-
-  var textareaRef = useRef(null);
-  var ariaRef = useRef(null);
-
-  var _useState4 = useState(countCodePointsInString((_props$value3 = props.value) != null ? _props$value3 : '')),
-      count = _useState4[0],
-      setCount = _useState4[1];
-
-  var _useState5 = useState(initialRows),
-      rows = _useState5[0],
-      setRows = _useState5[1];
-
-  var syncHeight = useCallback(function (textarea) {
-    var _$match$length, _$match;
-
-    var rows = ((_$match$length = (_$match = (textarea.value + "\n").match(/\n/g)) == null ? void 0 : _$match.length) != null ? _$match$length : 0) || 1;
-    setRows(initialRows <= rows ? rows : initialRows);
-  }, [initialRows]);
-  var nonControlled = props.value === undefined;
-  var handleChange = useCallback(function (value) {
-    var count = countCodePointsInString(value);
-
-    if (maxLength !== undefined && count > maxLength) {
-      return;
-    }
-
-    if (nonControlled) {
-      setCount(count);
-    }
-
-    if (autoHeight && textareaRef.current !== null) {
-      syncHeight(textareaRef.current);
-    }
-
-    onChange == null ? void 0 : onChange(value);
-  }, [autoHeight, maxLength, nonControlled, onChange, syncHeight]);
-  useEffect(function () {
-    var _props$value4;
-
-    setCount(countCodePointsInString((_props$value4 = props.value) != null ? _props$value4 : ''));
-  }, [props.value]);
-
-  var _useTextField2 = useTextField(_extends({
-    inputElementType: 'textarea',
-    isDisabled: disabled,
-    isRequired: required,
-    validationState: invalid ? 'invalid' : 'valid',
-    description: !invalid && assistiveText,
-    errorMessage: invalid && assistiveText,
-    onChange: handleChange
-  }, props), ariaRef),
-      inputProps = _useTextField2.inputProps,
-      labelProps = _useTextField2.labelProps,
-      descriptionProps = _useTextField2.descriptionProps,
-      errorMessageProps = _useTextField2.errorMessageProps;
-
-  useEffect(function () {
-    if (autoHeight && textareaRef.current !== null) {
-      syncHeight(textareaRef.current);
-    }
-  }, [autoHeight, syncHeight]);
-  return /*#__PURE__*/React.createElement(TextFieldRoot, {
-    className: className,
-    isDisabled: disabled
-  }, /*#__PURE__*/React.createElement(TextFieldLabel, _extends({
-    label: label,
-    requiredText: requiredText,
-    required: required,
-    subLabel: subLabel
-  }, labelProps, !showLabel ? visuallyHiddenProps : {})), /*#__PURE__*/React.createElement(StyledTextareaContainer, {
-    invalid: invalid,
-    rows: showCount ? rows + 1 : rows
-  }, /*#__PURE__*/React.createElement(StyledTextarea, _extends({
-    ref: mergeRefs(textareaRef, forwardRef, ariaRef),
-    rows: rows,
-    noBottomPadding: showCount
-  }, inputProps)), showCount && /*#__PURE__*/React.createElement(MultiLineCounter, null, maxLength !== undefined ? count + "/" + maxLength : count)), assistiveText != null && assistiveText.length !== 0 && /*#__PURE__*/React.createElement(AssistiveText, _extends({
-    invalid: invalid
-  }, invalid ? errorMessageProps : descriptionProps), assistiveText));
-});
-var TextFieldRoot = styled.div(_templateObject$7 || (_templateObject$7 = _taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n\n  ", "\n"])), function (p) {
-  return p.isDisabled && {
-    opacity: p.theme.elementEffect.disabled.opacity
-  };
-});
-var TextFieldLabel = styled(FieldLabel)(_templateObject2$7 || (_templateObject2$7 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), theme(function (o) {
-  return o.margin.bottom(8);
-}));
-var StyledInputContainer = styled.div(_templateObject3$7 || (_templateObject3$7 = _taggedTemplateLiteralLoose(["\n  height: 40px;\n  display: grid;\n  position: relative;\n"])));
-var PrefixContainer = styled.span(_templateObject4$6 || (_templateObject4$6 = _taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 50%;\n  left: 8px;\n  transform: translateY(-50%);\n"])));
-var SuffixContainer = styled.span(_templateObject5$6 || (_templateObject5$6 = _taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 50%;\n  right: 8px;\n  transform: translateY(-50%);\n\n  display: flex;\n  gap: 8px;\n"])));
-var Affix = styled.span(_templateObject6$3 || (_templateObject6$3 = _taggedTemplateLiteralLoose(["\n  user-select: none;\n\n  ", "\n"])), theme(function (o) {
-  return [o.typography(14).preserveHalfLeading, o.font.text2];
-}));
-var StyledInput = styled.input(_templateObject7$2 || (_templateObject7$2 = _taggedTemplateLiteralLoose(["\n  border: none;\n  box-sizing: border-box;\n  outline: none;\n  font-family: inherit;\n\n  /* Prevent zooming for iOS Safari */\n  transform-origin: top left;\n  transform: scale(0.875);\n  width: calc(100% / 0.875);\n  height: calc(100% / 0.875);\n  font-size: calc(14px / 0.875);\n  line-height: calc(22px / 0.875);\n  padding-left: calc((8px + ", "px) / 0.875);\n  padding-right: calc((8px + ", "px) / 0.875);\n  border-radius: calc(4px / 0.875);\n\n  /* Display box-shadow for iOS Safari */\n  appearance: none;\n\n  ", "\n\n  &::placeholder {\n    ", "\n  }\n"])), function (p) {
-  return p.extraLeftPadding;
-}, function (p) {
-  return p.extraRightPadding;
-}, function (p) {
-  return theme(function (o) {
-    return [o.bg.surface3.hover, o.outline["default"].focus, p.invalid && o.outline.assertive, o.font.text2];
-  });
-}, theme(function (o) {
-  return o.font.text3;
-}));
-var StyledTextareaContainer = styled.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n  position: relative;\n  overflow: hidden;\n  padding: 0 8px;\n\n  ", "\n\n  &:focus-within {\n    ", "\n  }\n\n  ", ";\n"])), function (p) {
-  return theme(function (o) {
-    return [o.bg.surface3.hover, p.invalid && o.outline.assertive, o.font.text2, o.borderRadius(4)];
-  });
-}, function (p) {
-  return theme(function (o) {
-    return p.invalid ? o.outline.assertive : o.outline["default"];
-  });
-}, function (_ref3) {
-  var rows = _ref3.rows;
-  return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n    height: calc(22px * ", " + 18px);\n  "])), rows);
-});
-var StyledTextarea = styled.textarea(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n  border: none;\n  outline: none;\n  resize: none;\n  font-family: inherit;\n  color: inherit;\n\n  /* Prevent zooming for iOS Safari */\n  transform-origin: top left;\n  transform: scale(0.875);\n  width: calc(100% / 0.875);\n  font-size: calc(14px / 0.875);\n  line-height: calc(22px / 0.875);\n  padding: calc(9px / 0.875) 0 ", ";\n\n  ", ";\n\n  /* Display box-shadow for iOS Safari */\n  appearance: none;\n\n  background: none;\n\n  &::placeholder {\n    ", "\n  }\n\n  /* Hide scrollbar for Chrome, Safari and Opera */\n  &::-webkit-scrollbar {\n    display: none;\n  }\n  /* Hide scrollbar for IE, Edge and Firefox */\n  -ms-overflow-style: none; /* IE and Edge */\n  scrollbar-width: none; /* Firefox */\n"])), function (p) {
-  return p.noBottomPadding ? 0 : '';
-}, function (_ref4) {
-  var _ref4$rows = _ref4.rows,
-      rows = _ref4$rows === void 0 ? 1 : _ref4$rows;
-  return css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n    height: calc(22px / 0.875 * ", ");\n  "])), rows);
-}, theme(function (o) {
-  return o.font.text3;
-}));
-var SingleLineCounter = styled.span(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), theme(function (o) {
-  return [o.typography(14).preserveHalfLeading, o.font.text3];
-}));
-var MultiLineCounter = styled.span(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n  position: absolute;\n  bottom: 9px;\n  right: 8px;\n\n  ", "\n"])), theme(function (o) {
-  return [o.typography(14).preserveHalfLeading, o.font.text3];
-}));
-var AssistiveText = styled.p(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (p) {
-  return theme(function (o) {
-    return [o.typography(14), o.margin.top(8), o.margin.bottom(0), o.font[p.invalid ? 'assertive' : 'text1']];
-  });
-});
-
-var _excluded$6 = ["name", "scale", "unsafeNonGuidelineScale", "className"];
-var Icon$1 = React.forwardRef(function IconInner(_ref, ref) {
-  var name = _ref.name,
-      scale = _ref.scale,
-      unsafeNonGuidelineScale = _ref.unsafeNonGuidelineScale,
-      className = _ref.className,
-      rest = _objectWithoutPropertiesLoose(_ref, _excluded$6);
-
-  return /*#__PURE__*/React.createElement("pixiv-icon", _extends({
-    ref: ref,
-    name: name,
-    scale: scale,
-    "unsafe-non-guideline-scale": unsafeNonGuidelineScale,
-    "class": className
-  }, rest));
-});
-
-var _BREAKPOINT;
-/**
- * Unit for grid column (px)
- */
-
-var COLUMN_UNIT = 80;
-/**
- * Unit for grid gutter width (px)
- */
-
-var GUTTER_UNIT = 24; // TODO: Grid definition with breakpoint
-
-/**
- * Calculate px occupied by the span of the columns with gutter gap
- *
- * @param span column span count
- */
-
-function columnSystem(span, column, gutter) {
-  return span * column + (span - 1) * gutter;
-}
-var HORIZONTAL_MIN_MARGIN = 72;
-(_BREAKPOINT = {}, _BREAKPOINT[6] = columnSystem(6, COLUMN_UNIT, GUTTER_UNIT) + HORIZONTAL_MIN_MARGIN * 2, _BREAKPOINT[8] = columnSystem(8, COLUMN_UNIT, GUTTER_UNIT) + HORIZONTAL_MIN_MARGIN * 2, _BREAKPOINT[10] = columnSystem(10, COLUMN_UNIT, GUTTER_UNIT) + HORIZONTAL_MIN_MARGIN * 2, _BREAKPOINT[12] = columnSystem(12, COLUMN_UNIT, GUTTER_UNIT) + HORIZONTAL_MIN_MARGIN * 2, _BREAKPOINT);
-
-var _templateObject$6, _templateObject2$6, _templateObject3$6, _templateObject4$5, _templateObject5$5, _templateObject6$2, _templateObject7$1;
-
-var _excluded$5 = ["children", "zIndex", "portalContainer"];
-var DEFAULT_Z_INDEX = 10;
-function Modal(_ref) {
-  var _useMedia;
-
-  var children = _ref.children,
-      _ref$zIndex = _ref.zIndex,
-      zIndex = _ref$zIndex === void 0 ? DEFAULT_Z_INDEX : _ref$zIndex,
-      props = _objectWithoutPropertiesLoose(_ref, _excluded$5);
-
-  var title = props.title,
-      _props$size = props.size,
-      size = _props$size === void 0 ? 'M' : _props$size,
-      _props$bottomSheet = props.bottomSheet,
-      bottomSheet = _props$bottomSheet === void 0 ? false : _props$bottomSheet,
-      isDismissable = props.isDismissable,
-      onClose = props.onClose,
-      _props$isOpen = props.isOpen,
-      isOpen = _props$isOpen === void 0 ? false : _props$isOpen;
-  var ref = useRef(null);
-
-  var _useOverlay = useOverlay(props, ref),
-      overlayProps = _useOverlay.overlayProps,
-      underlayProps = _useOverlay.underlayProps;
-
-  usePreventScroll();
-
-  var _useModalOverlay = useModalOverlay(props, {
-    close: onClose,
-    isOpen: isOpen,
-    // these props are not used actually.
-    // https://github.com/adobe/react-spectrum/blob/df14e3fb129b94b310f0397a701b83f006b51dfe/packages/%40react-aria/overlays/src/useModalOverlay.ts
-    open: function open() {// nope
-    },
-    setOpen: function setOpen() {// nope
-    },
-    toggle: function toggle() {// nope
-    }
-  }, ref),
-      modalProps = _useModalOverlay.modalProps;
-
-  var _useDialog = useDialog(props, ref),
-      dialogProps = _useDialog.dialogProps,
-      titleProps = _useDialog.titleProps;
-
-  var theme = useTheme();
-  var isMobile = (_useMedia = useMedia(maxWidth(theme.breakpoint.screen1))) != null ? _useMedia : false;
-  var transitionEnabled = isMobile && bottomSheet !== false;
-  var transition = useTransition(isOpen, {
-    from: {
-      transform: 'translateY(100%)',
-      backgroundColor: 'rgba(0, 0, 0, 0)'
-    },
-    enter: {
-      transform: 'translateY(0%)',
-      backgroundColor: 'rgba(0, 0, 0, 0.4)'
-    },
-    leave: {
-      transform: 'translateY(100%)',
-      backgroundColor: 'rgba(0, 0, 0, 0)'
-    },
-    config: transitionEnabled ? {
-      duration: 400,
-      easing: easings.easeOutQuart
-    } : {
-      duration: 0
-    }
-  });
-  var showDismiss = !isMobile || bottomSheet !== true;
-  return transition(function (_ref2, item) {
-    var backgroundColor = _ref2.backgroundColor,
-        transform = _ref2.transform;
-    return item && /*#__PURE__*/React.createElement(Overlay, null, /*#__PURE__*/React.createElement(ModalBackground, _extends({
-      zIndex: zIndex
-    }, underlayProps, {
-      style: transitionEnabled ? {
-        backgroundColor: backgroundColor
-      } : {}
-    }), /*#__PURE__*/React.createElement(FocusScope, {
-      contain: true,
-      restoreFocus: true,
-      autoFocus: true
-    }, /*#__PURE__*/React.createElement(ModalDialog, _extends({
-      ref: ref
-    }, overlayProps, modalProps, dialogProps, {
-      style: transitionEnabled ? {
-        transform: transform
-      } : {},
-      size: size,
-      bottomSheet: bottomSheet
-    }), /*#__PURE__*/React.createElement(ModalContext.Provider, {
-      value: {
-        titleProps: titleProps,
-        title: title,
-        close: onClose,
-        showDismiss: showDismiss
-      }
-    }, children, isDismissable === true && /*#__PURE__*/React.createElement(ModalCrossButton, {
-      size: "S",
-      icon: "24/Close",
-      onClick: onClose
-    }))))));
-  });
-}
-var ModalContext = React.createContext({
-  titleProps: {},
-  title: '',
-  close: undefined,
-  showDismiss: true
-});
-var ModalBackground = animated(styled.div(_templateObject$6 || (_templateObject$6 = _taggedTemplateLiteralLoose(["\n  z-index: ", ";\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n\n  ", "\n"])), function (_ref3) {
-  var zIndex = _ref3.zIndex;
-  return zIndex;
-}, theme$2(function (o) {
-  return [o.bg.surface4];
-})));
-var ModalDialog = animated(styled.div(_templateObject2$6 || (_templateObject2$6 = _taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: ", "px;\n\n  ", "\n\n  @media ", " {\n    ", "\n  }\n"])), function (p) {
-  return p.size === 'S' ? columnSystem(3, COLUMN_UNIT, GUTTER_UNIT) + GUTTER_UNIT * 2 : p.size === 'M' ? columnSystem(4, COLUMN_UNIT, GUTTER_UNIT) + GUTTER_UNIT * 2 : // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-  p.size === 'L' ? columnSystem(6, COLUMN_UNIT, GUTTER_UNIT) + GUTTER_UNIT * 2 : unreachable(p.size);
-}, theme$2(function (o) {
-  return [o.bg.background1, o.borderRadius(24)];
-}), function (_ref4) {
-  var theme = _ref4.theme;
-  return maxWidth(theme.breakpoint.screen1);
-}, function (p) {
-  return p.bottomSheet === 'full' ? css(_templateObject3$6 || (_templateObject3$6 = _taggedTemplateLiteralLoose(["\n            top: auto;\n            bottom: 0;\n            left: 0;\n            transform: none;\n            border-radius: 0;\n            width: 100%;\n            height: 100%;\n          "]))) : p.bottomSheet ? css(_templateObject4$5 || (_templateObject4$5 = _taggedTemplateLiteralLoose(["\n            top: auto;\n            bottom: 0;\n            left: 0;\n            transform: none;\n            border-radius: 0;\n            width: 100%;\n          "]))) : css(_templateObject5$5 || (_templateObject5$5 = _taggedTemplateLiteralLoose(["\n            width: calc(100% - 48px);\n          "])));
-}));
-var ModalCrossButton = styled(IconButton)(_templateObject6$2 || (_templateObject6$2 = _taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 8px;\n  right: 8px;\n\n  ", "\n"])), theme$2(function (o) {
-  return [o.font.text3.hover.press];
-}));
-function ModalTitle(props) {
-  var _useContext = useContext(ModalContext),
-      titleProps = _useContext.titleProps,
-      title = _useContext.title;
-
-  return /*#__PURE__*/React.createElement(ModalHeading, _extends({}, titleProps, props), title);
-}
-var ModalHeading = styled.h3(_templateObject7$1 || (_templateObject7$1 = _taggedTemplateLiteralLoose(["\n  margin: 0;\n  font-weight: inherit;\n  font-size: inherit;\n"])));
-
-var _templateObject$5, _templateObject2$5, _templateObject3$5, _templateObject4$4, _templateObject5$4;
-function ModalHeader() {
-  return /*#__PURE__*/React.createElement(ModalHeaderRoot, null, /*#__PURE__*/React.createElement(StyledModalTitle, null));
-}
-var ModalHeaderRoot = styled.div(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteralLoose(["\n  height: 64px;\n  display: grid;\n  align-content: center;\n  justify-content: center;\n"])));
-var StyledModalTitle = styled(ModalTitle)(_templateObject2$5 || (_templateObject2$5 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), theme$2(function (o) {
-  return [o.font.text1, o.typography(16).bold];
-}));
-var ModalAlign = styled.div(_templateObject3$5 || (_templateObject3$5 = _taggedTemplateLiteralLoose(["\n  ", "\n\n  @media ", " {\n    ", "\n  }\n"])), theme$2(function (o) {
-  return [o.padding.horizontal(24)];
-}), function (_ref) {
-  var theme = _ref.theme;
-  return maxWidth(theme.breakpoint.screen1);
-}, theme$2(function (o) {
-  return [o.padding.horizontal(16)];
-}));
-var ModalBody = styled.div(_templateObject4$4 || (_templateObject4$4 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), theme$2(function (o) {
-  return [o.padding.bottom(40)];
-}));
-var ModalButtons = styled.div(_templateObject5$4 || (_templateObject5$4 = _taggedTemplateLiteralLoose(["\n  display: grid;\n  grid-auto-flow: row;\n  grid-row-gap: 8px;\n  ", "\n\n  @media ", " {\n    ", "\n  }\n"])), theme$2(function (o) {
-  return [o.padding.horizontal(24).top(16)];
-}), function (_ref2) {
-  var theme = _ref2.theme;
-  return maxWidth(theme.breakpoint.screen1);
-}, theme$2(function (o) {
-  return [o.padding.horizontal(16)];
-}));
-
-var _templateObject$4, _templateObject2$4, _templateObject3$4;
-function LoadingSpinner(_ref) {
-  var _ref$size = _ref.size,
-      size = _ref$size === void 0 ? 48 : _ref$size,
-      _ref$padding = _ref.padding,
-      padding = _ref$padding === void 0 ? 16 : _ref$padding,
-      _ref$transparent = _ref.transparent,
-      transparent = _ref$transparent === void 0 ? false : _ref$transparent;
-  return /*#__PURE__*/React.createElement(LoadingSpinnerRoot, {
-    size: size,
-    padding: padding,
-    transparent: transparent
-  }, /*#__PURE__*/React.createElement(LoadingSpinnerIcon, null));
-}
-var LoadingSpinnerRoot = styled.div.attrs({
-  role: 'progressbar'
-})(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteralLoose(["\n  margin: auto;\n  padding: ", "px;\n  border-radius: 8px;\n  font-size: ", "px;\n  width: ", "px;\n  height: ", "px;\n  background-color: ", ";\n  color: ", ";\n"])), function (props) {
-  return props.padding;
-}, function (props) {
-  return props.size;
-}, function (props) {
-  return props.size;
-}, function (props) {
-  return props.size;
-}, function (_ref2) {
-  var theme = _ref2.theme,
-      transparent = _ref2.transparent;
-  return transparent ? 'transparent' : transparentize(0.32, theme.color.background1);
-}, function (_ref3) {
-  var theme = _ref3.theme;
-  return theme.color.text4;
-});
-var scaleout = keyframes(_templateObject2$4 || (_templateObject2$4 = _taggedTemplateLiteralLoose(["\n  from {\n    transform: scale(0);\n    opacity: 1;\n  }\n\n  to {\n    transform: scale(1);\n    opacity: 0;\n  }\n"])));
-var Icon = styled.div.attrs({
-  role: 'presentation'
-})(_templateObject3$4 || (_templateObject3$4 = _taggedTemplateLiteralLoose(["\n  width: 1em;\n  height: 1em;\n  border-radius: 1em;\n  background-color: currentColor;\n  animation: ", " 1s both ease-out;\n  animation-iteration-count: ", ";\n\n  &[data-reset-animation] {\n    animation: none;\n  }\n"])), scaleout, function (p) {
-  return p.once ? 1 : 'infinite';
-});
-var LoadingSpinnerIcon = React.forwardRef(function LoadingSpinnerIcon(_ref4, ref) {
-  var _ref4$once = _ref4.once,
-      once = _ref4$once === void 0 ? false : _ref4$once;
-  var iconRef = useRef(null);
-  useImperativeHandle(ref, function () {
-    return {
-      restart: function restart() {
-        if (!iconRef.current) {
-          return;
-        }
-
-        iconRef.current.dataset.resetAnimation = 'true'; // Force reflow hack!
-        delete iconRef.current.dataset.resetAnimation;
-      }
-    };
-  });
-  return /*#__PURE__*/React.createElement(Icon, {
-    ref: iconRef,
-    once: once
-  });
-});
-
-function toVal(mix) {
-  var k,
-      y,
-      str = '';
-
-  if (typeof mix === 'string' || typeof mix === 'number') {
-    str += mix;
-  } else if (typeof mix === 'object') {
-    if (Array.isArray(mix)) {
-      for (k = 0; k < mix.length; k++) {
-        if (mix[k]) {
-          if (y = toVal(mix[k])) {
-            str && (str += ' ');
-            str += y;
-          }
-        }
-      }
-    } else {
-      for (k in mix) {
-        if (mix[k]) {
-          str && (str += ' ');
-          str += k;
-        }
-      }
-    }
-  }
-
-  return str;
-}
-
-function $12uGp$clsx () {
-  var i = 0,
-      tmp,
-      x,
-      str = '';
-
-  while (i < arguments.length) {
-    if (tmp = arguments[i++]) {
-      if (x = toVal(tmp)) {
-        str && (str += ' ');
-        str += x;
-      }
-    }
-  }
-
-  return str;
-}
-
-var $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c = typeof window !== 'undefined' ? React.useLayoutEffect : function () {};
-var $bdb11010cef70236$var$idsUpdaterMap = new Map();
-
-function $bdb11010cef70236$export$f680877a34711e37(defaultId) {
-  var _$12uGp$useState = useState(defaultId),
-      value = _$12uGp$useState[0],
-      setValue = _$12uGp$useState[1];
-
-  var nextId = useRef(null);
-  var res = useSSRSafeId(value);
-  var updateValue = useCallback(function (val) {
-    nextId.current = val;
-  }, []);
-  $bdb11010cef70236$var$idsUpdaterMap.set(res, updateValue);
-  $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c(function () {
-    var r = res;
-    return function () {
-      $bdb11010cef70236$var$idsUpdaterMap["delete"](r);
-    };
-  }, [res]); // This cannot cause an infinite loop because the ref is updated first.
-  // eslint-disable-next-line
-
-  useEffect(function () {
-    var newId = nextId.current;
-
-    if (newId) {
-      nextId.current = null;
-      setValue(newId);
-    }
-  });
-  return res;
-}
-
-function $bdb11010cef70236$export$cd8c9cb68f842629(idA, idB) {
-  if (idA === idB) return idA;
-  var setIdA = $bdb11010cef70236$var$idsUpdaterMap.get(idA);
-
-  if (setIdA) {
-    setIdA(idB);
-    return idB;
-  }
-
-  var setIdB = $bdb11010cef70236$var$idsUpdaterMap.get(idB);
-
-  if (setIdB) {
-    setIdB(idA);
-    return idA;
-  }
-
-  return idB;
-}
-
-function $bdb11010cef70236$export$b4cc09c592e8fdb8(depArray) {
-  if (depArray === void 0) {
-    depArray = [];
-  }
-
-  var id = $bdb11010cef70236$export$f680877a34711e37();
-
-  var _$1dbecbe27a04f9af$ex = $1dbecbe27a04f9af$export$14d238f342723f25(id),
-      resolvedId = _$1dbecbe27a04f9af$ex[0],
-      setResolvedId = _$1dbecbe27a04f9af$ex[1];
-
-  var updateId = useCallback(function () {
-    setResolvedId( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
-      return regeneratorRuntime.wrap(function _callee$(_context) {
-        while (1) {
-          switch (_context.prev = _context.next) {
-            case 0:
-              _context.next = 2;
-              return id;
-
-            case 2:
-              _context.next = 4;
-              return document.getElementById(id) ? id : undefined;
-
-            case 4:
-            case "end":
-              return _context.stop();
-          }
-        }
-      }, _callee);
-    }));
-  }, [id, setResolvedId]);
-  $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c(updateId, [id, updateId].concat(depArray));
-  return resolvedId;
-}
-
-function $ff5963eb1fccf552$export$e08e3b67e392101e() {
-  var _arguments = arguments;
-  return function () {
-    for (var _iterator = _createForOfIteratorHelperLoose([].slice.call(_arguments)), _step; !(_step = _iterator()).done;) {
-      var callback = _step.value;
-      if (typeof callback === 'function') callback.apply(void 0, [].slice.call(arguments));
-    }
-  };
-}
-
-function $3ef42575df84b30b$export$9d1611c77c2fe928() {
-  var args = [].slice.call(arguments);
-
-  // Start with a base clone of the first argument. This is a lot faster than starting
-  // with an empty object and adding properties as we go.
-  var result = _extends({}, args[0]);
-
-  for (var i = 1; i < args.length; i++) {
-    var props = args[i];
-
-    for (var key in props) {
-      var a = result[key];
-      var b = props[key]; // Chain events
-
-      if (typeof a === 'function' && typeof b === 'function' && // This is a lot faster than a regex.
-      key[0] === 'o' && key[1] === 'n' && key.charCodeAt(2) >=
-      /* 'A' */
-      65 && key.charCodeAt(2) <=
-      /* 'Z' */
-      90) result[key] = $ff5963eb1fccf552$export$e08e3b67e392101e(a, b);else if ((key === 'className' || key === 'UNSAFE_className') && typeof a === 'string' && typeof b === 'string') result[key] = $12uGp$clsx(a, b);else if (key === 'id' && a && b) result.id = $bdb11010cef70236$export$cd8c9cb68f842629(a, b);else result[key] = b !== undefined ? b : a;
-    }
-  }
-
-  return result;
-}
-
-var $65484d02dcb7eb3e$var$DOMPropNames = new Set(['id']);
-var $65484d02dcb7eb3e$var$labelablePropNames = new Set(['aria-label', 'aria-labelledby', 'aria-describedby', 'aria-details']);
-var $65484d02dcb7eb3e$var$propRe = /^(data-.*)$/;
-
-function $65484d02dcb7eb3e$export$457c3d6518dd4c6f(props, opts) {
-  if (opts === void 0) {
-    opts = {};
-  }
-
-  var _opts = opts,
-      labelable = _opts.labelable,
-      propNames = _opts.propNames;
-  var filteredProps = {};
-
-  for (var prop in props) {
-    if (Object.prototype.hasOwnProperty.call(props, prop) && ($65484d02dcb7eb3e$var$DOMPropNames.has(prop) || labelable && $65484d02dcb7eb3e$var$labelablePropNames.has(prop) || (propNames === null || propNames === void 0 ? void 0 : propNames.has(prop)) || $65484d02dcb7eb3e$var$propRe.test(prop))) filteredProps[prop] = props[prop];
-  }
-
-  return filteredProps;
-}
-
-function $7215afc6de606d6b$export$de79e2c695e052f3(element) {
-  if ($7215afc6de606d6b$var$supportsPreventScroll()) element.focus({
-    preventScroll: true
-  });else {
-    var scrollableElements = $7215afc6de606d6b$var$getScrollableElements(element);
-    element.focus();
-    $7215afc6de606d6b$var$restoreScrollPosition(scrollableElements);
-  }
-}
-
-var $7215afc6de606d6b$var$supportsPreventScrollCached = null;
-
-function $7215afc6de606d6b$var$supportsPreventScroll() {
-  if ($7215afc6de606d6b$var$supportsPreventScrollCached == null) {
-    $7215afc6de606d6b$var$supportsPreventScrollCached = false;
-
-    try {
-      var focusElem = document.createElement('div');
-      focusElem.focus({
-        get preventScroll() {
-          $7215afc6de606d6b$var$supportsPreventScrollCached = true;
-          return true;
-        }
-
-      });
-    } catch (e) {// Ignore
-    }
-  }
-
-  return $7215afc6de606d6b$var$supportsPreventScrollCached;
-}
-
-function $7215afc6de606d6b$var$getScrollableElements(element) {
-  var parent = element.parentNode;
-  var scrollableElements = [];
-  var rootScrollingElement = document.scrollingElement || document.documentElement;
-
-  while (parent instanceof HTMLElement && parent !== rootScrollingElement) {
-    if (parent.offsetHeight < parent.scrollHeight || parent.offsetWidth < parent.scrollWidth) scrollableElements.push({
-      element: parent,
-      scrollTop: parent.scrollTop,
-      scrollLeft: parent.scrollLeft
-    });
-    parent = parent.parentNode;
-  }
-
-  if (rootScrollingElement instanceof HTMLElement) scrollableElements.push({
-    element: rootScrollingElement,
-    scrollTop: rootScrollingElement.scrollTop,
-    scrollLeft: rootScrollingElement.scrollLeft
-  });
-  return scrollableElements;
-}
-
-function $7215afc6de606d6b$var$restoreScrollPosition(scrollableElements) {
-  for (var _iterator3 = _createForOfIteratorHelperLoose(scrollableElements), _step3; !(_step3 = _iterator3()).done;) {
-    var _step3$value = _step3.value,
-        element = _step3$value.element,
-        scrollTop = _step3$value.scrollTop,
-        scrollLeft = _step3$value.scrollLeft;
-    element.scrollTop = scrollTop;
-    element.scrollLeft = scrollLeft;
-  }
-}
-/*
- * Copyright 2020 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */
-// We store a global list of elements that are currently transitioning,
-// mapped to a set of CSS properties that are transitioning for that element.
-// This is necessary rather than a simple count of transitions because of browser
-// bugs, e.g. Chrome sometimes fires both transitionend and transitioncancel rather
-// than one or the other. So we need to track what's actually transitioning so that
-// we can ignore these duplicate events.
-
-
-var $bbed8b41f857bcc0$var$transitionsByElement = new Map(); // A list of callbacks to call once there are no transitioning elements.
-
-var $bbed8b41f857bcc0$var$transitionCallbacks = new Set();
-
-function $bbed8b41f857bcc0$var$setupGlobalEvents() {
-  if (typeof window === 'undefined') return;
-
-  var onTransitionStart = function onTransitionStart(e) {
-    // Add the transitioning property to the list for this element.
-    var transitions = $bbed8b41f857bcc0$var$transitionsByElement.get(e.target);
-
-    if (!transitions) {
-      transitions = new Set();
-      $bbed8b41f857bcc0$var$transitionsByElement.set(e.target, transitions); // The transitioncancel event must be registered on the element itself, rather than as a global
-      // event. This enables us to handle when the node is deleted from the document while it is transitioning.
-      // In that case, the cancel event would have nowhere to bubble to so we need to handle it directly.
-
-      e.target.addEventListener('transitioncancel', onTransitionEnd);
-    }
-
-    transitions.add(e.propertyName);
-  };
-
-  var onTransitionEnd = function onTransitionEnd(e) {
-    // Remove property from list of transitioning properties.
-    var properties = $bbed8b41f857bcc0$var$transitionsByElement.get(e.target);
-    if (!properties) return;
-    properties["delete"](e.propertyName); // If empty, remove transitioncancel event, and remove the element from the list of transitioning elements.
-
-    if (properties.size === 0) {
-      e.target.removeEventListener('transitioncancel', onTransitionEnd);
-      $bbed8b41f857bcc0$var$transitionsByElement["delete"](e.target);
-    } // If no transitioning elements, call all of the queued callbacks.
-
-
-    if ($bbed8b41f857bcc0$var$transitionsByElement.size === 0) {
-      for (var _iterator4 = _createForOfIteratorHelperLoose($bbed8b41f857bcc0$var$transitionCallbacks), _step4; !(_step4 = _iterator4()).done;) {
-        var cb = _step4.value;
-        cb();
-      }
-
-      $bbed8b41f857bcc0$var$transitionCallbacks.clear();
-    }
-  };
-
-  document.body.addEventListener('transitionrun', onTransitionStart);
-  document.body.addEventListener('transitionend', onTransitionEnd);
-}
-
-if (typeof document !== 'undefined') {
-  if (document.readyState !== 'loading') $bbed8b41f857bcc0$var$setupGlobalEvents();else document.addEventListener('DOMContentLoaded', $bbed8b41f857bcc0$var$setupGlobalEvents);
-}
-
-function $bbed8b41f857bcc0$export$24490316f764c430(fn) {
-  // Wait one frame to see if an animation starts, e.g. a transition on mount.
-  requestAnimationFrame(function () {
-    // If no transitions are running, call the function immediately.
-    // Otherwise, add it to a list of callbacks to run at the end of the animation.
-    if ($bbed8b41f857bcc0$var$transitionsByElement.size === 0) fn();else $bbed8b41f857bcc0$var$transitionCallbacks.add(fn);
-  });
-} // Keep track of elements that we are currently handling dragging for via useDrag1D.
-
-function $03deb23ff14920c4$export$4eaf04e54aa8eed6() {
-  var globalListeners = useRef(new Map());
-  var addGlobalListener = useCallback(function (eventTarget, type, listener, options) {
-    // Make sure we remove the listener after it is called with the `once` option.
-    var fn = (options === null || options === void 0 ? void 0 : options.once) ? function () {
-      globalListeners.current["delete"](listener);
-      listener.apply(void 0, [].slice.call(arguments));
-    } : listener;
-    globalListeners.current.set(listener, {
-      type: type,
-      eventTarget: eventTarget,
-      fn: fn,
-      options: options
-    });
-    eventTarget.addEventListener(type, listener, options);
-  }, []);
-  var removeGlobalListener = useCallback(function (eventTarget, type, listener, options) {
-    var ref;
-    var fn = ((ref = globalListeners.current.get(listener)) === null || ref === void 0 ? void 0 : ref.fn) || listener;
-    eventTarget.removeEventListener(type, fn, options);
-    globalListeners.current["delete"](listener);
-  }, []);
-  var removeAllGlobalListeners = useCallback(function () {
-    globalListeners.current.forEach(function (value, key) {
-      removeGlobalListener(value.eventTarget, value.type, key, value.options);
-    });
-  }, [removeGlobalListener]); // eslint-disable-next-line arrow-body-style
-
-  useEffect(function () {
-    return removeAllGlobalListeners;
-  }, [removeAllGlobalListeners]);
-  return {
-    addGlobalListener: addGlobalListener,
-    removeGlobalListener: removeGlobalListener,
-    removeAllGlobalListeners: removeAllGlobalListeners
-  };
-}
-
-function $313b98861ee5dd6c$export$d6875122194c7b44(props, defaultLabel) {
-  var id = props.id,
-      label = props['aria-label'],
-      labelledBy = props['aria-labelledby']; // If there is both an aria-label and aria-labelledby,
-  // combine them by pointing to the element itself.
-
-  id = $bdb11010cef70236$export$f680877a34711e37(id);
-
-  if (labelledBy && label) {
-    var ids = new Set([].concat(labelledBy.trim().split(/\s+/), [id]));
-    labelledBy = [].concat(ids).join(' ');
-  } else if (labelledBy) labelledBy = labelledBy.trim().split(/\s+/).join(' '); // If no labels are provided, use the default
-
-
-  if (!label && !labelledBy && defaultLabel) label = defaultLabel;
-  return {
-    id: id,
-    'aria-label': label,
-    'aria-labelledby': labelledBy
-  };
-}
-
-function $df56164dff5785e2$export$4338b53315abf666(forwardedRef) {
-  var objRef = useRef();
-  /**
-  * We're using `useLayoutEffect` here instead of `useEffect` because we want
-  * to make sure that the `ref` value is up to date before other places in the
-  * the execution cycle try to read it.
-  */
-
-  $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c(function () {
-    if (!forwardedRef) return;
-    if (typeof forwardedRef === 'function') forwardedRef(objRef.current);else forwardedRef.current = objRef.current;
-  }, [forwardedRef]);
-  return objRef;
-}
-
-function $e7801be82b4b2a53$export$4debdb1a3f0fa79e(context, ref) {
-  $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c(function () {
-    if (context && context.ref && ref) {
-      context.ref.current = ref.current;
-      return function () {
-        context.ref.current = null;
-      };
-    }
-  }, [context, ref]);
-}
-
-var $ef06256079686ba0$var$descriptionId = 0;
-var $ef06256079686ba0$var$descriptionNodes = new Map();
-
-function $ef06256079686ba0$export$f8aeda7b10753fa1(description) {
-  var _$12uGp$useState3 = useState(undefined),
-      id1 = _$12uGp$useState3[0],
-      setId = _$12uGp$useState3[1];
-
-  $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c(function () {
-    if (!description) return;
-    var desc = $ef06256079686ba0$var$descriptionNodes.get(description);
-
-    if (!desc) {
-      var id = "react-aria-description-" + $ef06256079686ba0$var$descriptionId++;
-      setId(id);
-      var node = document.createElement('div');
-      node.id = id;
-      node.style.display = 'none';
-      node.textContent = description;
-      document.body.appendChild(node);
-      desc = {
-        refCount: 0,
-        element: node
-      };
-      $ef06256079686ba0$var$descriptionNodes.set(description, desc);
-    } else setId(desc.element.id);
-
-    desc.refCount++;
-    return function () {
-      if (--desc.refCount === 0) {
-        desc.element.remove();
-        $ef06256079686ba0$var$descriptionNodes["delete"](description);
-      }
-    };
-  }, [description]);
-  return {
-    'aria-describedby': description ? id1 : undefined
-  };
-}
-/*
- * Copyright 2020 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */
-
-
-function $c87311424ea30a05$var$testUserAgent(re) {
-  var ref;
-  if (typeof window === 'undefined' || window.navigator == null) return false;
-  return ((ref = window.navigator['userAgentData']) === null || ref === void 0 ? void 0 : ref.brands.some(function (brand) {
-    return re.test(brand.brand);
-  })) || re.test(window.navigator.userAgent);
-}
-
-function $c87311424ea30a05$var$testPlatform(re) {
-  var ref;
-  return typeof window !== 'undefined' && window.navigator != null ? re.test(((ref = window.navigator['userAgentData']) === null || ref === void 0 ? void 0 : ref.platform) || window.navigator.platform) : false;
-}
-
-function $c87311424ea30a05$export$9ac100e40613ea10() {
-  return $c87311424ea30a05$var$testPlatform(/^Mac/i);
-}
-
-function $c87311424ea30a05$export$186c6964ca17d99() {
-  return $c87311424ea30a05$var$testPlatform(/^iPhone/i);
-}
-
-function $c87311424ea30a05$export$7bef049ce92e4224() {
-  return $c87311424ea30a05$var$testPlatform(/^iPad/i) || $c87311424ea30a05$export$9ac100e40613ea10() && navigator.maxTouchPoints > 1;
-}
-
-function $c87311424ea30a05$export$fedb369cb70207f1() {
-  return $c87311424ea30a05$export$186c6964ca17d99() || $c87311424ea30a05$export$7bef049ce92e4224();
-}
-
-function $c87311424ea30a05$export$e1865c3bedcd822b() {
-  return $c87311424ea30a05$export$9ac100e40613ea10() || $c87311424ea30a05$export$fedb369cb70207f1();
-}
-
-function $c87311424ea30a05$export$78551043582a6a98() {
-  return $c87311424ea30a05$var$testUserAgent(/AppleWebKit/i) && !$c87311424ea30a05$export$6446a186d09e379e();
-}
-
-function $c87311424ea30a05$export$6446a186d09e379e() {
-  return $c87311424ea30a05$var$testUserAgent(/Chrome/i);
-}
-
-function $c87311424ea30a05$export$a11b0059900ceec8() {
-  return $c87311424ea30a05$var$testUserAgent(/Android/i);
-}
-
-function $e9faafb641e167db$export$90fc3a17d93f704c(ref, event, handler1, options) {
-  var _this = this;
-
-  var handlerRef = useRef(handler1);
-  handlerRef.current = handler1;
-  var isDisabled = handler1 == null;
-  useEffect(function () {
-    if (isDisabled) return;
-    var element = ref.current;
-
-    var handler = function handler(e) {
-      return handlerRef.current.call(_this, e);
-    };
-
-    element.addEventListener(event, handler, options);
-    return function () {
-      element.removeEventListener(event, handler, options);
-    };
-  }, [ref, event, options, isDisabled]);
-}
-
-function $1dbecbe27a04f9af$export$14d238f342723f25(defaultValue) {
-  var _$12uGp$useState4 = useState(defaultValue),
-      value = _$12uGp$useState4[0],
-      setValue = _$12uGp$useState4[1];
-
-  var valueRef = useRef(value);
-  var effect = useRef(null);
-  valueRef.current = value; // Store the function in a ref so we can always access the current version
-  // which has the proper `value` in scope.
-
-  var nextRef = useRef(null);
-
-  nextRef.current = function () {
-    // Run the generator to the next yield.
-    var newValue = effect.current.next(); // If the generator is done, reset the effect.
-
-    if (newValue.done) {
-      effect.current = null;
-      return;
-    } // If the value is the same as the current value,
-    // then continue to the next yield. Otherwise,
-    // set the value in state and wait for the next layout effect.
-
-
-    if (value === newValue.value) nextRef.current();else setValue(newValue.value);
-  };
-
-  $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c(function () {
-    // If there is an effect currently running, continue to the next yield.
-    if (effect.current) nextRef.current();
-  });
-  var queue = useCallback(function (fn) {
-    effect.current = fn(valueRef.current);
-    nextRef.current();
-  }, [effect, nextRef]);
-  return [value, queue];
-}
-
-function $2f04cbc44ee30ce0$export$53a0910f038337bd(scrollView, element) {
-  var offsetX = $2f04cbc44ee30ce0$var$relativeOffset(scrollView, element, 'left');
-  var offsetY = $2f04cbc44ee30ce0$var$relativeOffset(scrollView, element, 'top');
-  var width = element.offsetWidth;
-  var height = element.offsetHeight;
-  var x = scrollView.scrollLeft;
-  var y = scrollView.scrollTop;
-  var maxX = x + scrollView.offsetWidth;
-  var maxY = y + scrollView.offsetHeight;
-  if (offsetX <= x) x = offsetX;else if (offsetX + width > maxX) x += offsetX + width - maxX;
-  if (offsetY <= y) y = offsetY;else if (offsetY + height > maxY) y += offsetY + height - maxY;
-  scrollView.scrollLeft = x;
-  scrollView.scrollTop = y;
-}
-/**
- * Computes the offset left or top from child to ancestor by accumulating
- * offsetLeft or offsetTop through intervening offsetParents.
- */
-
-
-function $2f04cbc44ee30ce0$var$relativeOffset(ancestor, child, axis) {
-  var prop = axis === 'left' ? 'offsetLeft' : 'offsetTop';
-  var sum = 0;
-
-  while (child.offsetParent) {
-    sum += child[prop];
-    if (child.offsetParent === ancestor) break;else if (child.offsetParent.contains(ancestor)) {
-      // If the ancestor is not `position:relative`, then we stop at
-      // _its_ offset parent, and we subtract off _its_ offset, so that
-      // we end up with the proper offset from child to ancestor.
-      sum -= ancestor[prop];
-      break;
-    }
-    child = child.offsetParent;
-  }
-
-  return sum;
-}
-
-function $6a7db85432448f7f$export$60278871457622de(event) {
-  // JAWS/NVDA with Firefox.
-  if (event.mozInputSource === 0 && event.isTrusted) return true; // Android TalkBack's detail value varies depending on the event listener providing the event so we have specific logic here instead
-  // If pointerType is defined, event is from a click listener. For events from mousedown listener, detail === 0 is a sufficient check
-  // to detect TalkBack virtual clicks.
-
-  if ($c87311424ea30a05$export$a11b0059900ceec8() && event.pointerType) return event.type === 'click' && event.buttons === 1;
-  return event.detail === 0 && !event.pointerType;
-}
-
-function $6a7db85432448f7f$export$29bf1b5f2c56cf63(event) {
-  // If the pointer size is zero, then we assume it's from a screen reader.
-  // Android TalkBack double tap will sometimes return a event with width and height of 1
-  // and pointerType === 'mouse' so we need to check for a specific combination of event attributes.
-  // Cannot use "event.pressure === 0" as the sole check due to Safari pointer events always returning pressure === 0
-  // instead of .5, see https://bugs.webkit.org/show_bug.cgi?id=206216. event.pointerType === 'mouse' is to distingush
-  // Talkback double tap from Windows Firefox touch screen press
-  return event.width === 0 && event.height === 0 || event.width === 1 && event.height === 1 && event.pressure === 0 && event.detail === 0 && event.pointerType === 'mouse';
-}
-
-var _excluded$4 = ["register"],
-    _excluded2 = ["onPress", "onPressChange", "onPressStart", "onPressEnd", "onPressUp", "isDisabled", "isPressed", "preventFocusOnPress", "shouldCancelOnPointerExit", "allowTextSelectionOnPress", "ref"];
-// rather than at the document level so we just need to apply/remove user-select: none for each pressed element individually
-
-var $14c0b72509d70225$var$state = 'default';
-var $14c0b72509d70225$var$savedUserSelect = '';
-var $14c0b72509d70225$var$modifiedElementMap = new WeakMap();
-
-function $14c0b72509d70225$export$16a4697467175487(target) {
-  if ($c87311424ea30a05$export$fedb369cb70207f1()) {
-    if ($14c0b72509d70225$var$state === 'default') {
-      $14c0b72509d70225$var$savedUserSelect = document.documentElement.style.webkitUserSelect;
-      document.documentElement.style.webkitUserSelect = 'none';
-    }
-
-    $14c0b72509d70225$var$state = 'disabled';
-  } else if (target instanceof HTMLElement || target instanceof SVGElement) {
-    // If not iOS, store the target's original user-select and change to user-select: none
-    // Ignore state since it doesn't apply for non iOS
-    $14c0b72509d70225$var$modifiedElementMap.set(target, target.style.userSelect);
-    target.style.userSelect = 'none';
-  }
-}
-
-function $14c0b72509d70225$export$b0d6fa1ab32e3295(target) {
-  if ($c87311424ea30a05$export$fedb369cb70207f1()) {
-    // If the state is already default, there's nothing to do.
-    // If it is restoring, then there's no need to queue a second restore.
-    if ($14c0b72509d70225$var$state !== 'disabled') return;
-    $14c0b72509d70225$var$state = 'restoring'; // There appears to be a delay on iOS where selection still might occur
-    // after pointer up, so wait a bit before removing user-select.
-
-    setTimeout(function () {
-      // Wait for any CSS transitions to complete so we don't recompute style
-      // for the whole page in the middle of the animation and cause jank.
-      $bbed8b41f857bcc0$export$24490316f764c430(function () {
-        // Avoid race conditions
-        if ($14c0b72509d70225$var$state === 'restoring') {
-          if (document.documentElement.style.webkitUserSelect === 'none') document.documentElement.style.webkitUserSelect = $14c0b72509d70225$var$savedUserSelect || '';
-          $14c0b72509d70225$var$savedUserSelect = '';
-          $14c0b72509d70225$var$state = 'default';
-        }
-      });
-    }, 300);
-  } else if (target instanceof HTMLElement || target instanceof SVGElement) // If not iOS, restore the target's original user-select if any
-    // Ignore state since it doesn't apply for non iOS
-    {
-      if (target && $14c0b72509d70225$var$modifiedElementMap.has(target)) {
-        var targetOldUserSelect = $14c0b72509d70225$var$modifiedElementMap.get(target);
-        if (target.style.userSelect === 'none') target.style.userSelect = targetOldUserSelect;
-        if (target.getAttribute('style') === '') target.removeAttribute('style');
-        $14c0b72509d70225$var$modifiedElementMap["delete"](target);
-      }
-    }
-}
-
-var $ae1eeba8b9eafd08$export$5165eccb35aaadb5 = React.createContext(null);
-$ae1eeba8b9eafd08$export$5165eccb35aaadb5.displayName = 'PressResponderContext';
-
-function $f6c31cce2adf654f$var$usePressResponderContext(props) {
-  // Consume context from <PressResponder> and merge with props.
-  var context = useContext($ae1eeba8b9eafd08$export$5165eccb35aaadb5);
-
-  if (context) {
-    var register = context.register,
-        contextProps = _objectWithoutPropertiesLoose(context, _excluded$4);
-
-    props = $3ef42575df84b30b$export$9d1611c77c2fe928(contextProps, props);
-    register();
-  }
-
-  $e7801be82b4b2a53$export$4debdb1a3f0fa79e(context, props.ref);
-  return props;
-}
-
-function $f6c31cce2adf654f$export$45712eceda6fad21(props) {
-  var _$f6c31cce2adf654f$va = $f6c31cce2adf654f$var$usePressResponderContext(props),
-      onPress1 = _$f6c31cce2adf654f$va.onPress,
-      onPressChange1 = _$f6c31cce2adf654f$va.onPressChange,
-      onPressStart1 = _$f6c31cce2adf654f$va.onPressStart,
-      onPressEnd1 = _$f6c31cce2adf654f$va.onPressEnd,
-      onPressUp1 = _$f6c31cce2adf654f$va.onPressUp,
-      isDisabled1 = _$f6c31cce2adf654f$va.isDisabled,
-      isPressedProp = _$f6c31cce2adf654f$va.isPressed,
-      preventFocusOnPress = _$f6c31cce2adf654f$va.preventFocusOnPress,
-      shouldCancelOnPointerExit = _$f6c31cce2adf654f$va.shouldCancelOnPointerExit,
-      allowTextSelectionOnPress = _$f6c31cce2adf654f$va.allowTextSelectionOnPress,
-      domProps = _objectWithoutPropertiesLoose(_$f6c31cce2adf654f$va, _excluded2);
-
-  var propsRef = useRef(null);
-  propsRef.current = {
-    onPress: onPress1,
-    onPressChange: onPressChange1,
-    onPressStart: onPressStart1,
-    onPressEnd: onPressEnd1,
-    onPressUp: onPressUp1,
-    isDisabled: isDisabled1,
-    shouldCancelOnPointerExit: shouldCancelOnPointerExit
-  };
-
-  var _$bx7SL$useState = useState(false),
-      isPressed = _$bx7SL$useState[0],
-      setPressed = _$bx7SL$useState[1];
-
-  var ref = useRef({
-    isPressed: false,
-    ignoreEmulatedMouseEvents: false,
-    ignoreClickAfterPress: false,
-    didFirePressStart: false,
-    activePointerId: null,
-    target: null,
-    isOverTarget: false,
-    pointerType: null
-  });
-
-  var _$bx7SL$useGlobalList = $03deb23ff14920c4$export$4eaf04e54aa8eed6(),
-      addGlobalListener = _$bx7SL$useGlobalList.addGlobalListener,
-      removeAllGlobalListeners = _$bx7SL$useGlobalList.removeAllGlobalListeners;
-
-  var pressProps1 = useMemo(function () {
-    var state = ref.current;
-
-    var triggerPressStart = function triggerPressStart(originalEvent, pointerType) {
-      var _propsRef$current = propsRef.current,
-          onPressStart = _propsRef$current.onPressStart,
-          onPressChange = _propsRef$current.onPressChange,
-          isDisabled = _propsRef$current.isDisabled;
-      if (isDisabled || state.didFirePressStart) return;
-      if (onPressStart) onPressStart({
-        type: 'pressstart',
-        pointerType: pointerType,
-        target: originalEvent.currentTarget,
-        shiftKey: originalEvent.shiftKey,
-        metaKey: originalEvent.metaKey,
-        ctrlKey: originalEvent.ctrlKey,
-        altKey: originalEvent.altKey
-      });
-      if (onPressChange) onPressChange(true);
-      state.didFirePressStart = true;
-      setPressed(true);
-    };
-
-    var triggerPressEnd = function triggerPressEnd(originalEvent, pointerType, wasPressed) {
-      if (wasPressed === void 0) {
-        wasPressed = true;
-      }
-
-      var _propsRef$current2 = propsRef.current,
-          onPressEnd = _propsRef$current2.onPressEnd,
-          onPressChange = _propsRef$current2.onPressChange,
-          onPress = _propsRef$current2.onPress,
-          isDisabled = _propsRef$current2.isDisabled;
-      if (!state.didFirePressStart) return;
-      state.ignoreClickAfterPress = true;
-      state.didFirePressStart = false;
-      if (onPressEnd) onPressEnd({
-        type: 'pressend',
-        pointerType: pointerType,
-        target: originalEvent.currentTarget,
-        shiftKey: originalEvent.shiftKey,
-        metaKey: originalEvent.metaKey,
-        ctrlKey: originalEvent.ctrlKey,
-        altKey: originalEvent.altKey
-      });
-      if (onPressChange) onPressChange(false);
-      setPressed(false);
-      if (onPress && wasPressed && !isDisabled) onPress({
-        type: 'press',
-        pointerType: pointerType,
-        target: originalEvent.currentTarget,
-        shiftKey: originalEvent.shiftKey,
-        metaKey: originalEvent.metaKey,
-        ctrlKey: originalEvent.ctrlKey,
-        altKey: originalEvent.altKey
-      });
-    };
-
-    var triggerPressUp = function triggerPressUp(originalEvent, pointerType) {
-      var _propsRef$current3 = propsRef.current,
-          onPressUp = _propsRef$current3.onPressUp,
-          isDisabled = _propsRef$current3.isDisabled;
-      if (isDisabled) return;
-      if (onPressUp) onPressUp({
-        type: 'pressup',
-        pointerType: pointerType,
-        target: originalEvent.currentTarget,
-        shiftKey: originalEvent.shiftKey,
-        metaKey: originalEvent.metaKey,
-        ctrlKey: originalEvent.ctrlKey,
-        altKey: originalEvent.altKey
-      });
-    };
-
-    var cancel = function cancel(e) {
-      if (state.isPressed) {
-        if (state.isOverTarget) triggerPressEnd($f6c31cce2adf654f$var$createEvent(state.target, e), state.pointerType, false);
-        state.isPressed = false;
-        state.isOverTarget = false;
-        state.activePointerId = null;
-        state.pointerType = null;
-        removeAllGlobalListeners();
-        if (!allowTextSelectionOnPress) $14c0b72509d70225$export$b0d6fa1ab32e3295(state.target);
-      }
-    };
-
-    var pressProps = {
-      onKeyDown: function onKeyDown(e) {
-        if ($f6c31cce2adf654f$var$isValidKeyboardEvent(e.nativeEvent, e.currentTarget) && e.currentTarget.contains(e.target)) {
-          if ($f6c31cce2adf654f$var$shouldPreventDefaultKeyboard(e.target, e.key)) e.preventDefault();
-          e.stopPropagation(); // If the event is repeating, it may have started on a different element
-          // after which focus moved to the current element. Ignore these events and
-          // only handle the first key down event.
-
-          if (!state.isPressed && !e.repeat) {
-            state.target = e.currentTarget;
-            state.isPressed = true;
-            triggerPressStart(e, 'keyboard'); // Focus may move before the key up event, so register the event on the document
-            // instead of the same element where the key down event occurred.
-
-            addGlobalListener(document, 'keyup', onKeyUp, false);
-          }
-        } else if (e.key === 'Enter' && $f6c31cce2adf654f$var$isHTMLAnchorLink(e.currentTarget)) // If the target is a link, we won't have handled this above because we want the default
-          // browser behavior to open the link when pressing Enter. But we still need to prevent
-          // default so that elements above do not also handle it (e.g. table row).
-          e.stopPropagation();
-      },
-      onKeyUp: function onKeyUp(e) {
-        if ($f6c31cce2adf654f$var$isValidKeyboardEvent(e.nativeEvent, e.currentTarget) && !e.repeat && e.currentTarget.contains(e.target)) triggerPressUp($f6c31cce2adf654f$var$createEvent(state.target, e), 'keyboard');
-      },
-      onClick: function onClick(e) {
-        if (e && !e.currentTarget.contains(e.target)) return;
-
-        if (e && e.button === 0) {
-          e.stopPropagation();
-          if (isDisabled1) e.preventDefault(); // If triggered from a screen reader or by using element.click(),
-          // trigger as if it were a keyboard click.
-
-          if (!state.ignoreClickAfterPress && !state.ignoreEmulatedMouseEvents && (state.pointerType === 'virtual' || $6a7db85432448f7f$export$60278871457622de(e.nativeEvent))) {
-            // Ensure the element receives focus (VoiceOver on iOS does not do this)
-            if (!isDisabled1 && !preventFocusOnPress) $7215afc6de606d6b$export$de79e2c695e052f3(e.currentTarget);
-            triggerPressStart(e, 'virtual');
-            triggerPressUp(e, 'virtual');
-            triggerPressEnd(e, 'virtual');
-          }
-
-          state.ignoreEmulatedMouseEvents = false;
-          state.ignoreClickAfterPress = false;
-        }
-      }
-    };
-
-    var onKeyUp = function onKeyUp(e) {
-      if (state.isPressed && $f6c31cce2adf654f$var$isValidKeyboardEvent(e, state.target)) {
-        if ($f6c31cce2adf654f$var$shouldPreventDefaultKeyboard(e.target, e.key)) e.preventDefault();
-        e.stopPropagation();
-        state.isPressed = false;
-        var target = e.target;
-        triggerPressEnd($f6c31cce2adf654f$var$createEvent(state.target, e), 'keyboard', state.target.contains(target));
-        removeAllGlobalListeners(); // If the target is a link, trigger the click method to open the URL,
-        // but defer triggering pressEnd until onClick event handler.
-
-        if (state.target instanceof HTMLElement && state.target.contains(target) && ($f6c31cce2adf654f$var$isHTMLAnchorLink(state.target) || state.target.getAttribute('role') === 'link')) state.target.click();
-      }
-    };
-
-    if (typeof PointerEvent !== 'undefined') {
-      pressProps.onPointerDown = function (e) {
-        // Only handle left clicks, and ignore events that bubbled through portals.
-        if (e.button !== 0 || !e.currentTarget.contains(e.target)) return; // iOS safari fires pointer events from VoiceOver with incorrect coordinates/target.
-        // Ignore and let the onClick handler take care of it instead.
-        // https://bugs.webkit.org/show_bug.cgi?id=222627
-        // https://bugs.webkit.org/show_bug.cgi?id=223202
-
-        if ($6a7db85432448f7f$export$29bf1b5f2c56cf63(e.nativeEvent)) {
-          state.pointerType = 'virtual';
-          return;
-        } // Due to browser inconsistencies, especially on mobile browsers, we prevent
-        // default on pointer down and handle focusing the pressable element ourselves.
-
-
-        if ($f6c31cce2adf654f$var$shouldPreventDefault(e.currentTarget)) e.preventDefault();
-        state.pointerType = e.pointerType;
-        e.stopPropagation();
-
-        if (!state.isPressed) {
-          state.isPressed = true;
-          state.isOverTarget = true;
-          state.activePointerId = e.pointerId;
-          state.target = e.currentTarget;
-          if (!isDisabled1 && !preventFocusOnPress) $7215afc6de606d6b$export$de79e2c695e052f3(e.currentTarget);
-          if (!allowTextSelectionOnPress) $14c0b72509d70225$export$16a4697467175487(state.target);
-          triggerPressStart(e, state.pointerType);
-          addGlobalListener(document, 'pointermove', onPointerMove, false);
-          addGlobalListener(document, 'pointerup', onPointerUp, false);
-          addGlobalListener(document, 'pointercancel', onPointerCancel, false);
-        }
-      };
-
-      pressProps.onMouseDown = function (e) {
-        if (!e.currentTarget.contains(e.target)) return;
-
-        if (e.button === 0) {
-          // Chrome and Firefox on touch Windows devices require mouse down events
-          // to be canceled in addition to pointer events, or an extra asynchronous
-          // focus event will be fired.
-          if ($f6c31cce2adf654f$var$shouldPreventDefault(e.currentTarget)) e.preventDefault();
-          e.stopPropagation();
-        }
-      };
-
-      pressProps.onPointerUp = function (e) {
-        // iOS fires pointerup with zero width and height, so check the pointerType recorded during pointerdown.
-        if (!e.currentTarget.contains(e.target) || state.pointerType === 'virtual') return; // Only handle left clicks
-        // Safari on iOS sometimes fires pointerup events, even
-        // when the touch isn't over the target, so double check.
-
-        if (e.button === 0 && $f6c31cce2adf654f$var$isOverTarget(e, e.currentTarget)) triggerPressUp(e, state.pointerType || e.pointerType);
-      }; // Safari on iOS < 13.2 does not implement pointerenter/pointerleave events correctly.
-      // Use pointer move events instead to implement our own hit testing.
-      // See https://bugs.webkit.org/show_bug.cgi?id=199803
-
-
-      var onPointerMove = function onPointerMove(e) {
-        if (e.pointerId !== state.activePointerId) return;
-
-        if ($f6c31cce2adf654f$var$isOverTarget(e, state.target)) {
-          if (!state.isOverTarget) {
-            state.isOverTarget = true;
-            triggerPressStart($f6c31cce2adf654f$var$createEvent(state.target, e), state.pointerType);
-          }
-        } else if (state.isOverTarget) {
-          state.isOverTarget = false;
-          triggerPressEnd($f6c31cce2adf654f$var$createEvent(state.target, e), state.pointerType, false);
-          if (propsRef.current.shouldCancelOnPointerExit) cancel(e);
-        }
-      };
-
-      var onPointerUp = function onPointerUp(e) {
-        if (e.pointerId === state.activePointerId && state.isPressed && e.button === 0) {
-          if ($f6c31cce2adf654f$var$isOverTarget(e, state.target)) triggerPressEnd($f6c31cce2adf654f$var$createEvent(state.target, e), state.pointerType);else if (state.isOverTarget) triggerPressEnd($f6c31cce2adf654f$var$createEvent(state.target, e), state.pointerType, false);
-          state.isPressed = false;
-          state.isOverTarget = false;
-          state.activePointerId = null;
-          state.pointerType = null;
-          removeAllGlobalListeners();
-          if (!allowTextSelectionOnPress) $14c0b72509d70225$export$b0d6fa1ab32e3295(state.target);
-        }
-      };
-
-      var onPointerCancel = function onPointerCancel(e) {
-        cancel(e);
-      };
-
-      pressProps.onDragStart = function (e) {
-        if (!e.currentTarget.contains(e.target)) return; // Safari does not call onPointerCancel when a drag starts, whereas Chrome and Firefox do.
-
-        cancel(e);
-      };
-    } else {
-      pressProps.onMouseDown = function (e) {
-        // Only handle left clicks
-        if (e.button !== 0 || !e.currentTarget.contains(e.target)) return; // Due to browser inconsistencies, especially on mobile browsers, we prevent
-        // default on mouse down and handle focusing the pressable element ourselves.
-
-        if ($f6c31cce2adf654f$var$shouldPreventDefault(e.currentTarget)) e.preventDefault();
-        e.stopPropagation();
-        if (state.ignoreEmulatedMouseEvents) return;
-        state.isPressed = true;
-        state.isOverTarget = true;
-        state.target = e.currentTarget;
-        state.pointerType = $6a7db85432448f7f$export$60278871457622de(e.nativeEvent) ? 'virtual' : 'mouse';
-        if (!isDisabled1 && !preventFocusOnPress) $7215afc6de606d6b$export$de79e2c695e052f3(e.currentTarget);
-        triggerPressStart(e, state.pointerType);
-        addGlobalListener(document, 'mouseup', onMouseUp, false);
-      };
-
-      pressProps.onMouseEnter = function (e) {
-        if (!e.currentTarget.contains(e.target)) return;
-        e.stopPropagation();
-
-        if (state.isPressed && !state.ignoreEmulatedMouseEvents) {
-          state.isOverTarget = true;
-          triggerPressStart(e, state.pointerType);
-        }
-      };
-
-      pressProps.onMouseLeave = function (e) {
-        if (!e.currentTarget.contains(e.target)) return;
-        e.stopPropagation();
-
-        if (state.isPressed && !state.ignoreEmulatedMouseEvents) {
-          state.isOverTarget = false;
-          triggerPressEnd(e, state.pointerType, false);
-          if (propsRef.current.shouldCancelOnPointerExit) cancel(e);
-        }
-      };
-
-      pressProps.onMouseUp = function (e) {
-        if (!e.currentTarget.contains(e.target)) return;
-        if (!state.ignoreEmulatedMouseEvents && e.button === 0) triggerPressUp(e, state.pointerType);
-      };
-
-      var onMouseUp = function onMouseUp(e) {
-        // Only handle left clicks
-        if (e.button !== 0) return;
-        state.isPressed = false;
-        removeAllGlobalListeners();
-
-        if (state.ignoreEmulatedMouseEvents) {
-          state.ignoreEmulatedMouseEvents = false;
-          return;
-        }
-
-        if ($f6c31cce2adf654f$var$isOverTarget(e, state.target)) triggerPressEnd($f6c31cce2adf654f$var$createEvent(state.target, e), state.pointerType);else if (state.isOverTarget) triggerPressEnd($f6c31cce2adf654f$var$createEvent(state.target, e), state.pointerType, false);
-        state.isOverTarget = false;
-      };
-
-      pressProps.onTouchStart = function (e) {
-        if (!e.currentTarget.contains(e.target)) return;
-        e.stopPropagation();
-        var touch = $f6c31cce2adf654f$var$getTouchFromEvent(e.nativeEvent);
-        if (!touch) return;
-        state.activePointerId = touch.identifier;
-        state.ignoreEmulatedMouseEvents = true;
-        state.isOverTarget = true;
-        state.isPressed = true;
-        state.target = e.currentTarget;
-        state.pointerType = 'touch'; // Due to browser inconsistencies, especially on mobile browsers, we prevent default
-        // on the emulated mouse event and handle focusing the pressable element ourselves.
-
-        if (!isDisabled1 && !preventFocusOnPress) $7215afc6de606d6b$export$de79e2c695e052f3(e.currentTarget);
-        if (!allowTextSelectionOnPress) $14c0b72509d70225$export$16a4697467175487(state.target);
-        triggerPressStart(e, state.pointerType);
-        addGlobalListener(window, 'scroll', onScroll, true);
-      };
-
-      pressProps.onTouchMove = function (e) {
-        if (!e.currentTarget.contains(e.target)) return;
-        e.stopPropagation();
-        if (!state.isPressed) return;
-        var touch = $f6c31cce2adf654f$var$getTouchById(e.nativeEvent, state.activePointerId);
-
-        if (touch && $f6c31cce2adf654f$var$isOverTarget(touch, e.currentTarget)) {
-          if (!state.isOverTarget) {
-            state.isOverTarget = true;
-            triggerPressStart(e, state.pointerType);
-          }
-        } else if (state.isOverTarget) {
-          state.isOverTarget = false;
-          triggerPressEnd(e, state.pointerType, false);
-          if (propsRef.current.shouldCancelOnPointerExit) cancel(e);
-        }
-      };
-
-      pressProps.onTouchEnd = function (e) {
-        if (!e.currentTarget.contains(e.target)) return;
-        e.stopPropagation();
-        if (!state.isPressed) return;
-        var touch = $f6c31cce2adf654f$var$getTouchById(e.nativeEvent, state.activePointerId);
-
-        if (touch && $f6c31cce2adf654f$var$isOverTarget(touch, e.currentTarget)) {
-          triggerPressUp(e, state.pointerType);
-          triggerPressEnd(e, state.pointerType);
-        } else if (state.isOverTarget) triggerPressEnd(e, state.pointerType, false);
-
-        state.isPressed = false;
-        state.activePointerId = null;
-        state.isOverTarget = false;
-        state.ignoreEmulatedMouseEvents = true;
-        if (!allowTextSelectionOnPress) $14c0b72509d70225$export$b0d6fa1ab32e3295(state.target);
-        removeAllGlobalListeners();
-      };
-
-      pressProps.onTouchCancel = function (e) {
-        if (!e.currentTarget.contains(e.target)) return;
-        e.stopPropagation();
-        if (state.isPressed) cancel(e);
-      };
-
-      var onScroll = function onScroll(e) {
-        if (state.isPressed && e.target.contains(state.target)) cancel({
-          currentTarget: state.target,
-          shiftKey: false,
-          ctrlKey: false,
-          metaKey: false,
-          altKey: false
-        });
-      };
-
-      pressProps.onDragStart = function (e) {
-        if (!e.currentTarget.contains(e.target)) return;
-        cancel(e);
-      };
-    }
-
-    return pressProps;
-  }, [addGlobalListener, isDisabled1, preventFocusOnPress, removeAllGlobalListeners, allowTextSelectionOnPress]); // Remove user-select: none in case component unmounts immediately after pressStart
-  // eslint-disable-next-line arrow-body-style
-
-  useEffect(function () {
-    return function () {
-      if (!allowTextSelectionOnPress) // eslint-disable-next-line react-hooks/exhaustive-deps
-        $14c0b72509d70225$export$b0d6fa1ab32e3295(ref.current.target);
-    };
-  }, [allowTextSelectionOnPress]);
-  return {
-    isPressed: isPressedProp || isPressed,
-    pressProps: $3ef42575df84b30b$export$9d1611c77c2fe928(domProps, pressProps1)
-  };
-}
-
-function $f6c31cce2adf654f$var$isHTMLAnchorLink(target) {
-  return target.tagName === 'A' && target.hasAttribute('href');
-}
-
-function $f6c31cce2adf654f$var$isValidKeyboardEvent(event, currentTarget) {
-  var key = event.key,
-      code = event.code;
-  var element = currentTarget;
-  var role = element.getAttribute('role'); // Accessibility for keyboards. Space and Enter only.
-  // "Spacebar" is for IE 11
-
-  return (key === 'Enter' || key === ' ' || key === 'Spacebar' || code === 'Space') && !(element instanceof HTMLInputElement && !$f6c31cce2adf654f$var$isValidInputKey(element, key) || element instanceof HTMLTextAreaElement || element.isContentEditable) && (!$f6c31cce2adf654f$var$isHTMLAnchorLink(element) || role === 'button' && key !== 'Enter') && // An element with role='link' should only trigger with Enter key
-  !(role === 'link' && key !== 'Enter');
-}
-
-function $f6c31cce2adf654f$var$getTouchFromEvent(event) {
-  var targetTouches = event.targetTouches;
-  if (targetTouches.length > 0) return targetTouches[0];
-  return null;
-}
-
-function $f6c31cce2adf654f$var$getTouchById(event, pointerId) {
-  var changedTouches = event.changedTouches;
-
-  for (var i = 0; i < changedTouches.length; i++) {
-    var touch = changedTouches[i];
-    if (touch.identifier === pointerId) return touch;
-  }
-
-  return null;
-}
-
-function $f6c31cce2adf654f$var$createEvent(target, e) {
-  return {
-    currentTarget: target,
-    shiftKey: e.shiftKey,
-    ctrlKey: e.ctrlKey,
-    metaKey: e.metaKey,
-    altKey: e.altKey
-  };
-}
-
-function $f6c31cce2adf654f$var$getPointClientRect(point) {
-  var offsetX = point.width / 2 || point.radiusX || 0;
-  var offsetY = point.height / 2 || point.radiusY || 0;
-  return {
-    top: point.clientY - offsetY,
-    right: point.clientX + offsetX,
-    bottom: point.clientY + offsetY,
-    left: point.clientX - offsetX
-  };
-}
-
-function $f6c31cce2adf654f$var$areRectanglesOverlapping(a, b) {
-  // check if they cannot overlap on x axis
-  if (a.left > b.right || b.left > a.right) return false; // check if they cannot overlap on y axis
-
-  if (a.top > b.bottom || b.top > a.bottom) return false;
-  return true;
-}
-
-function $f6c31cce2adf654f$var$isOverTarget(point, target) {
-  var rect = target.getBoundingClientRect();
-  var pointRect = $f6c31cce2adf654f$var$getPointClientRect(point);
-  return $f6c31cce2adf654f$var$areRectanglesOverlapping(rect, pointRect);
-}
-
-function $f6c31cce2adf654f$var$shouldPreventDefault(target) {
-  // We cannot prevent default if the target is a draggable element.
-  return !(target instanceof HTMLElement) || !target.draggable;
-}
-
-function $f6c31cce2adf654f$var$shouldPreventDefaultKeyboard(target, key) {
-  if (target instanceof HTMLInputElement) return !$f6c31cce2adf654f$var$isValidInputKey(target, key);
-  if (target instanceof HTMLButtonElement) return target.type !== 'submit';
-  return true;
-}
-
-var $f6c31cce2adf654f$var$nonTextInputTypes = new Set(['checkbox', 'radio', 'range', 'color', 'file', 'image', 'button', 'submit', 'reset']);
-
-function $f6c31cce2adf654f$var$isValidInputKey(target, key) {
-  // Only space should toggle checkboxes and radios, not enter.
-  return target.type === 'checkbox' || target.type === 'radio' ? key === ' ' : $f6c31cce2adf654f$var$nonTextInputTypes.has(target.type);
-}
-
-var $8a9cb279dc87e130$export$905e7fc544a71f36 = /*#__PURE__*/function () {
-  var _proto = $8a9cb279dc87e130$export$905e7fc544a71f36.prototype;
-
-  _proto.isDefaultPrevented = function isDefaultPrevented() {
-    return this.nativeEvent.defaultPrevented;
-  };
-
-  _proto.preventDefault = function preventDefault() {
-    this.defaultPrevented = true;
-    this.nativeEvent.preventDefault();
-  };
-
-  _proto.stopPropagation = function stopPropagation() {
-    this.nativeEvent.stopPropagation();
-
-    this.isPropagationStopped = function () {
-      return true;
-    };
-  };
-
-  _proto.isPropagationStopped = function isPropagationStopped() {
-    return false;
-  };
-
-  _proto.persist = function persist() {};
-
-  function $8a9cb279dc87e130$export$905e7fc544a71f36(type, nativeEvent) {
-    this.nativeEvent = nativeEvent;
-    this.target = nativeEvent.target;
-    this.currentTarget = nativeEvent.currentTarget;
-    this.relatedTarget = nativeEvent.relatedTarget;
-    this.bubbles = nativeEvent.bubbles;
-    this.cancelable = nativeEvent.cancelable;
-    this.defaultPrevented = nativeEvent.defaultPrevented;
-    this.eventPhase = nativeEvent.eventPhase;
-    this.isTrusted = nativeEvent.isTrusted;
-    this.timeStamp = nativeEvent.timeStamp;
-    this.type = type;
-  }
-
-  return $8a9cb279dc87e130$export$905e7fc544a71f36;
-}();
-
-function $8a9cb279dc87e130$export$715c682d09d639cc(onBlur) {
-  var stateRef = useRef({
-    isFocused: false,
-    onBlur: onBlur,
-    observer: null
-  });
-  stateRef.current.onBlur = onBlur; // Clean up MutationObserver on unmount. See below.
-  // eslint-disable-next-line arrow-body-style
-
-  $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c(function () {
-    var state = stateRef.current;
-    return function () {
-      if (state.observer) {
-        state.observer.disconnect();
-        state.observer = null;
-      }
-    };
-  }, []); // This function is called during a React onFocus event.
-
-  return useCallback(function (e1) {
-    // React does not fire onBlur when an element is disabled. https://github.com/facebook/react/issues/9142
-    // Most browsers fire a native focusout event in this case, except for Firefox. In that case, we use a
-    // MutationObserver to watch for the disabled attribute, and dispatch these events ourselves.
-    // For browsers that do, focusout fires before the MutationObserver, so onBlur should not fire twice.
-    if (e1.target instanceof HTMLButtonElement || e1.target instanceof HTMLInputElement || e1.target instanceof HTMLTextAreaElement || e1.target instanceof HTMLSelectElement) {
-      stateRef.current.isFocused = true;
-      var target = e1.target;
-
-      var onBlurHandler = function onBlurHandler(e) {
-        var // For backward compatibility, dispatch a (fake) React synthetic event.
-        _current, ref;
-
-        stateRef.current.isFocused = false;
-        if (target.disabled) (ref = (_current = stateRef.current).onBlur) === null || ref === void 0 ? void 0 : ref.call(_current, new $8a9cb279dc87e130$export$905e7fc544a71f36('blur', e)); // We no longer need the MutationObserver once the target is blurred.
-
-        if (stateRef.current.observer) {
-          stateRef.current.observer.disconnect();
-          stateRef.current.observer = null;
-        }
-      };
-
-      target.addEventListener('focusout', onBlurHandler, {
-        once: true
-      });
-      stateRef.current.observer = new MutationObserver(function () {
-        if (stateRef.current.isFocused && target.disabled) {
-          stateRef.current.observer.disconnect();
-          target.dispatchEvent(new FocusEvent('blur'));
-          target.dispatchEvent(new FocusEvent('focusout', {
-            bubbles: true
-          }));
-        }
-      });
-      stateRef.current.observer.observe(target, {
-        attributes: true,
-        attributeFilter: ['disabled']
-      });
-    }
-  }, []);
-}
-
-var $507fabe10e71c6fb$var$currentModality = null;
-var $507fabe10e71c6fb$var$changeHandlers = new Set();
-var $507fabe10e71c6fb$var$hasSetupGlobalListeners = false;
-var $507fabe10e71c6fb$var$hasEventBeforeFocus = false;
-var $507fabe10e71c6fb$var$hasBlurredWindowRecently = false; // Only Tab or Esc keys will make focus visible on text input elements
-
-function $507fabe10e71c6fb$var$triggerChangeHandlers(modality, e) {
-  for (var _iterator = _createForOfIteratorHelperLoose($507fabe10e71c6fb$var$changeHandlers), _step; !(_step = _iterator()).done;) {
-    var handler = _step.value;
-    handler(modality, e);
-  }
-}
-/**
- * Helper function to determine if a KeyboardEvent is unmodified and could make keyboard focus styles visible.
- */
-
-
-function $507fabe10e71c6fb$var$isValidKey(e) {
-  // Control and Shift keys trigger when navigating back to the tab with keyboard.
-  return !(e.metaKey || !$c87311424ea30a05$export$9ac100e40613ea10() && e.altKey || e.ctrlKey || e.key === 'Control' || e.key === 'Shift' || e.key === 'Meta');
-}
-
-function $507fabe10e71c6fb$var$handleKeyboardEvent(e) {
-  $507fabe10e71c6fb$var$hasEventBeforeFocus = true;
-
-  if ($507fabe10e71c6fb$var$isValidKey(e)) {
-    $507fabe10e71c6fb$var$currentModality = 'keyboard';
-    $507fabe10e71c6fb$var$triggerChangeHandlers('keyboard', e);
-  }
-}
-
-function $507fabe10e71c6fb$var$handlePointerEvent(e) {
-  $507fabe10e71c6fb$var$currentModality = 'pointer';
-
-  if (e.type === 'mousedown' || e.type === 'pointerdown') {
-    $507fabe10e71c6fb$var$hasEventBeforeFocus = true;
-    $507fabe10e71c6fb$var$triggerChangeHandlers('pointer', e);
-  }
-}
-
-function $507fabe10e71c6fb$var$handleClickEvent(e) {
-  if ($6a7db85432448f7f$export$60278871457622de(e)) {
-    $507fabe10e71c6fb$var$hasEventBeforeFocus = true;
-    $507fabe10e71c6fb$var$currentModality = 'virtual';
-  }
-}
-
-function $507fabe10e71c6fb$var$handleFocusEvent(e) {
-  // Firefox fires two extra focus events when the user first clicks into an iframe:
-  // first on the window, then on the document. We ignore these events so they don't
-  // cause keyboard focus rings to appear.
-  if (e.target === window || e.target === document) return; // If a focus event occurs without a preceding keyboard or pointer event, switch to virtual modality.
-  // This occurs, for example, when navigating a form with the next/previous buttons on iOS.
-
-  if (!$507fabe10e71c6fb$var$hasEventBeforeFocus && !$507fabe10e71c6fb$var$hasBlurredWindowRecently) {
-    $507fabe10e71c6fb$var$currentModality = 'virtual';
-    $507fabe10e71c6fb$var$triggerChangeHandlers('virtual', e);
-  }
-
-  $507fabe10e71c6fb$var$hasEventBeforeFocus = false;
-  $507fabe10e71c6fb$var$hasBlurredWindowRecently = false;
-}
-
-function $507fabe10e71c6fb$var$handleWindowBlur() {
-  // When the window is blurred, reset state. This is necessary when tabbing out of the window,
-  // for example, since a subsequent focus event won't be fired.
-  $507fabe10e71c6fb$var$hasEventBeforeFocus = false;
-  $507fabe10e71c6fb$var$hasBlurredWindowRecently = true;
-}
-/**
- * Setup global event listeners to control when keyboard focus style should be visible.
- */
-
-
-function $507fabe10e71c6fb$var$setupGlobalFocusEvents() {
-  if (typeof window === 'undefined' || $507fabe10e71c6fb$var$hasSetupGlobalListeners) return; // Programmatic focus() calls shouldn't affect the current input modality.
-  // However, we need to detect other cases when a focus event occurs without
-  // a preceding user event (e.g. screen reader focus). Overriding the focus
-  // method on HTMLElement.prototype is a bit hacky, but works.
-
-  var focus = HTMLElement.prototype.focus;
-
-  HTMLElement.prototype.focus = function () {
-    $507fabe10e71c6fb$var$hasEventBeforeFocus = true;
-    focus.apply(this, arguments);
-  };
-
-  document.addEventListener('keydown', $507fabe10e71c6fb$var$handleKeyboardEvent, true);
-  document.addEventListener('keyup', $507fabe10e71c6fb$var$handleKeyboardEvent, true);
-  document.addEventListener('click', $507fabe10e71c6fb$var$handleClickEvent, true); // Register focus events on the window so they are sure to happen
-  // before React's event listeners (registered on the document).
-
-  window.addEventListener('focus', $507fabe10e71c6fb$var$handleFocusEvent, true);
-  window.addEventListener('blur', $507fabe10e71c6fb$var$handleWindowBlur, false);
-
-  if (typeof PointerEvent !== 'undefined') {
-    document.addEventListener('pointerdown', $507fabe10e71c6fb$var$handlePointerEvent, true);
-    document.addEventListener('pointermove', $507fabe10e71c6fb$var$handlePointerEvent, true);
-    document.addEventListener('pointerup', $507fabe10e71c6fb$var$handlePointerEvent, true);
-  } else {
-    document.addEventListener('mousedown', $507fabe10e71c6fb$var$handlePointerEvent, true);
-    document.addEventListener('mousemove', $507fabe10e71c6fb$var$handlePointerEvent, true);
-    document.addEventListener('mouseup', $507fabe10e71c6fb$var$handlePointerEvent, true);
-  }
-
-  $507fabe10e71c6fb$var$hasSetupGlobalListeners = true;
-}
-
-if (typeof document !== 'undefined') {
-  if (document.readyState !== 'loading') $507fabe10e71c6fb$var$setupGlobalFocusEvents();else document.addEventListener('DOMContentLoaded', $507fabe10e71c6fb$var$setupGlobalFocusEvents);
-}
-
-function $507fabe10e71c6fb$export$b9b3dfddab17db27() {
-  return $507fabe10e71c6fb$var$currentModality !== 'pointer';
-}
-
-function $9ab94262bd0047c7$export$420e68273165f4ec(props) {
-  var isDisabled = props.isDisabled,
-      onBlurWithin = props.onBlurWithin,
-      onFocusWithin = props.onFocusWithin,
-      onFocusWithinChange = props.onFocusWithinChange;
-  var state = useRef({
-    isFocusWithin: false
-  });
-  var onBlur = useCallback(function (e) {
-    // We don't want to trigger onBlurWithin and then immediately onFocusWithin again
-    // when moving focus inside the element. Only trigger if the currentTarget doesn't
-    // include the relatedTarget (where focus is moving).
-    if (state.current.isFocusWithin && !e.currentTarget.contains(e.relatedTarget)) {
-      state.current.isFocusWithin = false;
-      if (onBlurWithin) onBlurWithin(e);
-      if (onFocusWithinChange) onFocusWithinChange(false);
-    }
-  }, [onBlurWithin, onFocusWithinChange, state]);
-  var onSyntheticFocus = $8a9cb279dc87e130$export$715c682d09d639cc(onBlur);
-  var onFocus = useCallback(function (e) {
-    if (!state.current.isFocusWithin) {
-      if (onFocusWithin) onFocusWithin(e);
-      if (onFocusWithinChange) onFocusWithinChange(true);
-      state.current.isFocusWithin = true;
-      onSyntheticFocus(e);
-    }
-  }, [onFocusWithin, onFocusWithinChange, onSyntheticFocus]);
-  if (isDisabled) return {
-    focusWithinProps: {
-      onFocus: null,
-      onBlur: null
-    }
-  };
-  return {
-    focusWithinProps: {
-      onFocus: onFocus,
-      onBlur: onBlur
-    }
-  };
-} // iOS fires onPointerEnter twice: once with pointerType="touch" and again with pointerType="mouse".
-// We want to ignore these emulated events so they do not trigger hover behavior.
-// See https://bugs.webkit.org/show_bug.cgi?id=214609.
-
-
-var $6179b936705e76d3$var$globalIgnoreEmulatedMouseEvents = false;
-var $6179b936705e76d3$var$hoverCount = 0;
-
-function $6179b936705e76d3$var$setGlobalIgnoreEmulatedMouseEvents() {
-  $6179b936705e76d3$var$globalIgnoreEmulatedMouseEvents = true; // Clear globalIgnoreEmulatedMouseEvents after a short timeout. iOS fires onPointerEnter
-  // with pointerType="mouse" immediately after onPointerUp and before onFocus. On other
-  // devices that don't have this quirk, we don't want to ignore a mouse hover sometime in
-  // the distant future because a user previously touched the element.
-
-  setTimeout(function () {
-    $6179b936705e76d3$var$globalIgnoreEmulatedMouseEvents = false;
-  }, 50);
-}
-
-function $6179b936705e76d3$var$handleGlobalPointerEvent(e) {
-  if (e.pointerType === 'touch') $6179b936705e76d3$var$setGlobalIgnoreEmulatedMouseEvents();
-}
-
-function $6179b936705e76d3$var$setupGlobalTouchEvents() {
-  if (typeof document === 'undefined') return;
-  if (typeof PointerEvent !== 'undefined') document.addEventListener('pointerup', $6179b936705e76d3$var$handleGlobalPointerEvent);else document.addEventListener('touchend', $6179b936705e76d3$var$setGlobalIgnoreEmulatedMouseEvents);
-  $6179b936705e76d3$var$hoverCount++;
-  return function () {
-    $6179b936705e76d3$var$hoverCount--;
-    if ($6179b936705e76d3$var$hoverCount > 0) return;
-    if (typeof PointerEvent !== 'undefined') document.removeEventListener('pointerup', $6179b936705e76d3$var$handleGlobalPointerEvent);else document.removeEventListener('touchend', $6179b936705e76d3$var$setGlobalIgnoreEmulatedMouseEvents);
-  };
-}
-
-function $6179b936705e76d3$export$ae780daf29e6d456(props) {
-  var onHoverStart = props.onHoverStart,
-      onHoverChange = props.onHoverChange,
-      onHoverEnd = props.onHoverEnd,
-      isDisabled = props.isDisabled;
-
-  var _$bx7SL$useState4 = useState(false),
-      isHovered = _$bx7SL$useState4[0],
-      setHovered = _$bx7SL$useState4[1];
-
-  var state = useRef({
-    isHovered: false,
-    ignoreEmulatedMouseEvents: false,
-    pointerType: '',
-    target: null
-  }).current;
-  useEffect($6179b936705e76d3$var$setupGlobalTouchEvents, []);
-
-  var _$bx7SL$useMemo = useMemo(function () {
-    var triggerHoverStart = function triggerHoverStart(event, pointerType) {
-      state.pointerType = pointerType;
-      if (isDisabled || pointerType === 'touch' || state.isHovered || !event.currentTarget.contains(event.target)) return;
-      state.isHovered = true;
-      var target = event.currentTarget;
-      state.target = target;
-      if (onHoverStart) onHoverStart({
-        type: 'hoverstart',
-        target: target,
-        pointerType: pointerType
-      });
-      if (onHoverChange) onHoverChange(true);
-      setHovered(true);
-    };
-
-    var triggerHoverEnd = function triggerHoverEnd(event, pointerType) {
-      state.pointerType = '';
-      state.target = null;
-      if (pointerType === 'touch' || !state.isHovered) return;
-      state.isHovered = false;
-      var target = event.currentTarget;
-      if (onHoverEnd) onHoverEnd({
-        type: 'hoverend',
-        target: target,
-        pointerType: pointerType
-      });
-      if (onHoverChange) onHoverChange(false);
-      setHovered(false);
-    };
-
-    var hoverProps = {};
-
-    if (typeof PointerEvent !== 'undefined') {
-      hoverProps.onPointerEnter = function (e) {
-        if ($6179b936705e76d3$var$globalIgnoreEmulatedMouseEvents && e.pointerType === 'mouse') return;
-        triggerHoverStart(e, e.pointerType);
-      };
-
-      hoverProps.onPointerLeave = function (e) {
-        if (!isDisabled && e.currentTarget.contains(e.target)) triggerHoverEnd(e, e.pointerType);
-      };
-    } else {
-      hoverProps.onTouchStart = function () {
-        state.ignoreEmulatedMouseEvents = true;
-      };
-
-      hoverProps.onMouseEnter = function (e) {
-        if (!state.ignoreEmulatedMouseEvents && !$6179b936705e76d3$var$globalIgnoreEmulatedMouseEvents) triggerHoverStart(e, 'mouse');
-        state.ignoreEmulatedMouseEvents = false;
-      };
-
-      hoverProps.onMouseLeave = function (e) {
-        if (!isDisabled && e.currentTarget.contains(e.target)) triggerHoverEnd(e, 'mouse');
-      };
-    }
-
-    return {
-      hoverProps: hoverProps,
-      triggerHoverEnd: triggerHoverEnd
-    };
-  }, [onHoverStart, onHoverChange, onHoverEnd, isDisabled, state]),
-      hoverProps1 = _$bx7SL$useMemo.hoverProps,
-      triggerHoverEnd1 = _$bx7SL$useMemo.triggerHoverEnd;
-
-  useEffect(function () {
-    // Call the triggerHoverEnd as soon as isDisabled changes to true
-    // Safe to call triggerHoverEnd, it will early return if we aren't currently hovering
-    if (isDisabled) triggerHoverEnd1({
-      currentTarget: state.target
-    }, state.pointerType); // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [isDisabled]);
-  return {
-    hoverProps: hoverProps1,
-    isHovered: isHovered
-  };
-}
-
-var $8a26561d2877236e$var$DEFAULT_THRESHOLD = 500;
-
-function $8a26561d2877236e$export$c24ed0104d07eab9(props) {
-  var isDisabled = props.isDisabled,
-      onLongPressStart = props.onLongPressStart,
-      onLongPressEnd = props.onLongPressEnd,
-      onLongPress = props.onLongPress,
-      _props$threshold = props.threshold,
-      threshold = _props$threshold === void 0 ? $8a26561d2877236e$var$DEFAULT_THRESHOLD : _props$threshold,
-      accessibilityDescription = props.accessibilityDescription;
-  var timeRef = useRef(null);
-
-  var _$bx7SL$useGlobalList3 = $03deb23ff14920c4$export$4eaf04e54aa8eed6(),
-      addGlobalListener = _$bx7SL$useGlobalList3.addGlobalListener,
-      removeGlobalListener = _$bx7SL$useGlobalList3.removeGlobalListener;
-
-  var _$f6c31cce2adf654f$ex2 = $f6c31cce2adf654f$export$45712eceda6fad21({
-    isDisabled: isDisabled,
-    onPressStart: function onPressStart(e1) {
-      if (e1.pointerType === 'mouse' || e1.pointerType === 'touch') {
-        if (onLongPressStart) onLongPressStart(_extends({}, e1, {
-          type: 'longpressstart'
-        }));
-        timeRef.current = setTimeout(function () {
-          // Prevent other usePress handlers from also handling this event.
-          e1.target.dispatchEvent(new PointerEvent('pointercancel', {
-            bubbles: true
-          }));
-          if (onLongPress) onLongPress(_extends({}, e1, {
-            type: 'longpress'
-          }));
-          timeRef.current = null;
-        }, threshold); // Prevent context menu, which may be opened on long press on touch devices
-
-        // Prevent context menu, which may be opened on long press on touch devices
-        if (e1.pointerType === 'touch') {
-          var onContextMenu = function onContextMenu(e) {
-            e.preventDefault();
-          };
-
-          addGlobalListener(e1.target, 'contextmenu', onContextMenu, {
-            once: true
-          });
-          addGlobalListener(window, 'pointerup', function () {
-            // If no contextmenu event is fired quickly after pointerup, remove the handler
-            // so future context menu events outside a long press are not prevented.
-            setTimeout(function () {
-              removeGlobalListener(e1.target, 'contextmenu', onContextMenu);
-            }, 30);
-          }, {
-            once: true
-          });
-        }
-      }
-    },
-    onPressEnd: function onPressEnd(e) {
-      if (timeRef.current) clearTimeout(timeRef.current);
-      if (onLongPressEnd && (e.pointerType === 'mouse' || e.pointerType === 'touch')) onLongPressEnd(_extends({}, e, {
-        type: 'longpressend'
-      }));
-    }
-  }),
-      pressProps = _$f6c31cce2adf654f$ex2.pressProps;
-
-  var descriptionProps = $ef06256079686ba0$export$f8aeda7b10753fa1(onLongPress && !isDisabled ? accessibilityDescription : null);
-  return {
-    longPressProps: $3ef42575df84b30b$export$9d1611c77c2fe928(pressProps, descriptionProps)
-  };
-}
-
-function $d191a55c9702f145$export$8467354a121f1b9f(props) {
-  var id = props.id,
-      label = props.label,
-      ariaLabelledby = props['aria-labelledby'],
-      ariaLabel = props['aria-label'],
-      _props$labelElementTy = props.labelElementType,
-      labelElementType = _props$labelElementTy === void 0 ? 'label' : _props$labelElementTy;
-  id = $bdb11010cef70236$export$f680877a34711e37(id);
-  var labelId = $bdb11010cef70236$export$f680877a34711e37();
-  var labelProps = {};
-
-  if (label) {
-    ariaLabelledby = ariaLabelledby ? ariaLabelledby + " " + labelId : labelId;
-    labelProps = {
-      id: labelId,
-      htmlFor: labelElementType === 'label' ? id : undefined
-    };
-  } else if (!ariaLabelledby && !ariaLabel) console.warn('If you do not provide a visible label, you must specify an aria-label or aria-labelledby attribute for accessibility');
-
-  var fieldProps = $313b98861ee5dd6c$export$d6875122194c7b44({
-    id: id,
-    'aria-label': ariaLabel,
-    'aria-labelledby': ariaLabelledby
-  });
-  return {
-    labelProps: labelProps,
-    fieldProps: fieldProps
-  };
-}
-
-/*
- * Copyright 2020 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */
-// https://en.wikipedia.org/wiki/Right-to-left
-
-var $148a7a147e38ea7f$var$RTL_SCRIPTS = new Set(['Arab', 'Syrc', 'Samr', 'Mand', 'Thaa', 'Mend', 'Nkoo', 'Adlm', 'Rohg', 'Hebr']);
-var $148a7a147e38ea7f$var$RTL_LANGS = new Set(['ae', 'ar', 'arc', 'bcc', 'bqi', 'ckb', 'dv', 'fa', 'glk', 'he', 'ku', 'mzn', 'nqo', 'pnb', 'ps', 'sd', 'ug', 'ur', 'yi']);
-
-function $148a7a147e38ea7f$export$702d680b21cbd764(locale) {
-  // If the Intl.Locale API is available, use it to get the script for the locale.
-  // This is more accurate than guessing by language, since languages can be written in multiple scripts.
-  // @ts-ignore
-  if (Intl.Locale) {
-    // @ts-ignore
-    var script = new Intl.Locale(locale).maximize().script;
-    return $148a7a147e38ea7f$var$RTL_SCRIPTS.has(script);
-  } // If not, just guess by the language (first part of the locale)
-
-
-  var lang = locale.split('-')[0];
-  return $148a7a147e38ea7f$var$RTL_LANGS.has(lang);
-}
-
-function $1e5a04cdaf7d1af8$export$f09106e7c6677ec5() {
-  // @ts-ignore
-  var locale = typeof navigator !== 'undefined' && (navigator.language || navigator.userLanguage) || 'en-US';
-
-  try {
-    // @ts-ignore
-    Intl.DateTimeFormat.supportedLocalesOf([locale]);
-  } catch (_err) {
-    locale = 'en-US';
-  }
-
-  return {
-    locale: locale,
-    direction: $148a7a147e38ea7f$export$702d680b21cbd764(locale) ? 'rtl' : 'ltr'
-  };
-}
-
-var $1e5a04cdaf7d1af8$var$currentLocale = $1e5a04cdaf7d1af8$export$f09106e7c6677ec5();
-var $1e5a04cdaf7d1af8$var$listeners = new Set();
-
-function $1e5a04cdaf7d1af8$var$updateLocale() {
-  $1e5a04cdaf7d1af8$var$currentLocale = $1e5a04cdaf7d1af8$export$f09106e7c6677ec5();
-
-  for (var _iterator = _createForOfIteratorHelperLoose($1e5a04cdaf7d1af8$var$listeners), _step; !(_step = _iterator()).done;) {
-    var listener = _step.value;
-    listener($1e5a04cdaf7d1af8$var$currentLocale);
-  }
-}
-
-function $1e5a04cdaf7d1af8$export$188ec29ebc2bdc3a() {
-  var isSSR = useIsSSR();
-
-  var _$iFADg$useState = useState($1e5a04cdaf7d1af8$var$currentLocale),
-      defaultLocale = _$iFADg$useState[0],
-      setDefaultLocale = _$iFADg$useState[1];
-
-  useEffect(function () {
-    if ($1e5a04cdaf7d1af8$var$listeners.size === 0) window.addEventListener('languagechange', $1e5a04cdaf7d1af8$var$updateLocale);
-    $1e5a04cdaf7d1af8$var$listeners.add(setDefaultLocale);
-    return function () {
-      $1e5a04cdaf7d1af8$var$listeners["delete"](setDefaultLocale);
-      if ($1e5a04cdaf7d1af8$var$listeners.size === 0) window.removeEventListener('languagechange', $1e5a04cdaf7d1af8$var$updateLocale);
-    };
-  }, []); // We cannot determine the browser's language on the server, so default to
-  // en-US. This will be updated after hydration on the client to the correct value.
-
-  if (isSSR) return {
-    locale: 'en-US',
-    direction: 'ltr'
-  };
-  return defaultLocale;
-}
-
-var $18f2051aff69b9bf$var$I18nContext = /*#__PURE__*/React.createContext(null);
-
-function $18f2051aff69b9bf$export$43bb16f9c6d9e3f7() {
-  var defaultLocale = $1e5a04cdaf7d1af8$export$188ec29ebc2bdc3a();
-  var context = useContext($18f2051aff69b9bf$var$I18nContext);
-  return context || defaultLocale;
-}
-
-var $325a3faab7a68acd$var$cache = new Map();
-
-function $325a3faab7a68acd$export$a16aca283550c30d(options) {
-  var _$18f2051aff69b9bf$ex5 = $18f2051aff69b9bf$export$43bb16f9c6d9e3f7(),
-      locale = _$18f2051aff69b9bf$ex5.locale;
-
-  var cacheKey = locale + (options ? Object.entries(options).sort(function (a, b) {
-    return a[0] < b[0] ? -1 : 1;
-  }).join() : '');
-  if ($325a3faab7a68acd$var$cache.has(cacheKey)) return $325a3faab7a68acd$var$cache.get(cacheKey);
-  var formatter = new Intl.Collator(locale, options);
-  $325a3faab7a68acd$var$cache.set(cacheKey, formatter);
-  return formatter;
-}
-
-function $feb5ffebff200149$export$d3e3bd3e26688c04(e) {
-  // Ctrl + Arrow Up/Arrow Down has a system wide meaning on macOS, so use Alt instead.
-  // On Windows and Ubuntu, Alt + Space has a system wide meaning.
-  return $c87311424ea30a05$export$e1865c3bedcd822b() ? e.altKey : e.ctrlKey;
-}
-
-function $feb5ffebff200149$export$16792effe837dba3(e) {
-  if ($c87311424ea30a05$export$9ac100e40613ea10()) return e.metaKey;
-  return e.ctrlKey;
-}
-/**
- * Controls how long to wait before clearing the typeahead buffer.
- */
-
-
-var $fb3050f43d946246$var$TYPEAHEAD_DEBOUNCE_WAIT_MS = 1000; // 1 second
-
-function $fb3050f43d946246$export$e32c88dfddc6e1d8(options) {
-  var keyboardDelegate = options.keyboardDelegate,
-      selectionManager = options.selectionManager,
-      onTypeSelect = options.onTypeSelect;
-  var state = useRef({
-    search: '',
-    timeout: null
-  }).current;
-
-  var onKeyDown = function onKeyDown(e) {
-    var character = $fb3050f43d946246$var$getStringForKey(e.key);
-    if (!character || e.ctrlKey || e.metaKey) return; // Do not propagate the Spacebar event if it's meant to be part of the search.
-    // When we time out, the search term becomes empty, hence the check on length.
-    // Trimming is to account for the case of pressing the Spacebar more than once,
-    // which should cycle through the selection/deselection of the focused item.
-
-    if (character === ' ' && state.search.trim().length > 0) {
-      e.preventDefault();
-      if (!('continuePropagation' in e)) e.stopPropagation();
-    }
-
-    state.search += character; // Use the delegate to find a key to focus.
-    // Prioritize items after the currently focused item, falling back to searching the whole list.
-
-    var key = keyboardDelegate.getKeyForSearch(state.search, selectionManager.focusedKey); // If no key found, search from the top.
-
-    if (key == null) key = keyboardDelegate.getKeyForSearch(state.search);
-
-    if (key != null) {
-      selectionManager.setFocusedKey(key);
-      if (onTypeSelect) onTypeSelect(key);
-    }
-
-    clearTimeout(state.timeout);
-    state.timeout = setTimeout(function () {
-      state.search = '';
-    }, $fb3050f43d946246$var$TYPEAHEAD_DEBOUNCE_WAIT_MS);
-  };
-
-  return {
-    typeSelectProps: {
-      // Using a capturing listener to catch the keydown event before
-      // other hooks in order to handle the Spacebar event.
-      onKeyDownCapture: keyboardDelegate.getKeyForSearch ? onKeyDown : null
-    }
-  };
-}
-
-function $fb3050f43d946246$var$getStringForKey(key) {
-  // If the key is of length 1, it is an ASCII value.
-  // Otherwise, if there are no ASCII characters in the key name,
-  // it is a Unicode character.
-  // See https://www.w3.org/TR/uievents-key/
-  if (key.length === 1 || !/^[A-Z]/i.test(key)) return key;
-  return '';
-}
-
-function $ae20dd8cbca75726$export$d6daf82dcd84e87c(options) {
-  var manager = options.selectionManager,
-      delegate = options.keyboardDelegate,
-      ref = options.ref,
-      _options$autoFocus = options.autoFocus,
-      autoFocus = _options$autoFocus === void 0 ? false : _options$autoFocus,
-      _options$shouldFocusW = options.shouldFocusWrap,
-      shouldFocusWrap = _options$shouldFocusW === void 0 ? false : _options$shouldFocusW,
-      _options$disallowEmpt = options.disallowEmptySelection,
-      disallowEmptySelection = _options$disallowEmpt === void 0 ? false : _options$disallowEmpt,
-      _options$disallowSele = options.disallowSelectAll,
-      disallowSelectAll = _options$disallowSele === void 0 ? false : _options$disallowSele,
-      _options$selectOnFocu = options.selectOnFocus,
-      selectOnFocus = _options$selectOnFocu === void 0 ? manager.selectionBehavior === 'replace' : _options$selectOnFocu,
-      _options$disallowType = options.disallowTypeAhead,
-      disallowTypeAhead = _options$disallowType === void 0 ? false : _options$disallowType,
-      shouldUseVirtualFocus = options.shouldUseVirtualFocus,
-      _options$allowsTabNav = options.allowsTabNavigation,
-      allowsTabNavigation = _options$allowsTabNav === void 0 ? false : _options$allowsTabNav,
-      isVirtualized = options.isVirtualized,
-      _options$scrollRef = options.scrollRef,
-      scrollRef = _options$scrollRef === void 0 ? ref : _options$scrollRef;
-
-  var _$eCAIO$useLocale = $18f2051aff69b9bf$export$43bb16f9c6d9e3f7(),
-      direction = _$eCAIO$useLocale.direction;
-
-  var onKeyDown = function onKeyDown(e) {
-    // Prevent option + tab from doing anything since it doesn't move focus to the cells, only buttons/checkboxes
-    if (e.altKey && e.key === 'Tab') e.preventDefault(); // Keyboard events bubble through portals. Don't handle keyboard events
-    // for elements outside the collection (e.g. menus).
-
-    if (!ref.current.contains(e.target)) return;
-
-    var navigateToKey = function navigateToKey(key, childFocus) {
-      if (key != null) {
-        manager.setFocusedKey(key, childFocus);
-        if (e.shiftKey && manager.selectionMode === 'multiple') manager.extendSelection(key);else if (selectOnFocus && !$feb5ffebff200149$export$d3e3bd3e26688c04(e)) manager.replaceSelection(key);
-      }
-    };
-
-    switch (e.key) {
-      case 'ArrowDown':
-        if (delegate.getKeyBelow) {
-          var ref4, ref1;
-          e.preventDefault();
-          var nextKey = manager.focusedKey != null ? delegate.getKeyBelow(manager.focusedKey) : (ref4 = delegate.getFirstKey) === null || ref4 === void 0 ? void 0 : ref4.call(delegate);
-          if (nextKey == null && shouldFocusWrap) nextKey = (ref1 = delegate.getFirstKey) === null || ref1 === void 0 ? void 0 : ref1.call(delegate, manager.focusedKey);
-          navigateToKey(nextKey);
-        }
-
-        break;
-
-      case 'ArrowUp':
-        if (delegate.getKeyAbove) {
-          var ref2, ref3;
-          e.preventDefault();
-
-          var _nextKey = manager.focusedKey != null ? delegate.getKeyAbove(manager.focusedKey) : (ref2 = delegate.getLastKey) === null || ref2 === void 0 ? void 0 : ref2.call(delegate);
-
-          if (_nextKey == null && shouldFocusWrap) _nextKey = (ref3 = delegate.getLastKey) === null || ref3 === void 0 ? void 0 : ref3.call(delegate, manager.focusedKey);
-          navigateToKey(_nextKey);
-        }
-
-        break;
-
-      case 'ArrowLeft':
-        if (delegate.getKeyLeftOf) {
-          e.preventDefault();
-
-          var _nextKey2 = delegate.getKeyLeftOf(manager.focusedKey);
-
-          navigateToKey(_nextKey2, direction === 'rtl' ? 'first' : 'last');
-        }
-
-        break;
-
-      case 'ArrowRight':
-        if (delegate.getKeyRightOf) {
-          e.preventDefault();
-
-          var _nextKey3 = delegate.getKeyRightOf(manager.focusedKey);
-
-          navigateToKey(_nextKey3, direction === 'rtl' ? 'last' : 'first');
-        }
-
-        break;
-
-      case 'Home':
-        if (delegate.getFirstKey) {
-          e.preventDefault();
-          var firstKey = delegate.getFirstKey(manager.focusedKey, $feb5ffebff200149$export$16792effe837dba3(e));
-          manager.setFocusedKey(firstKey);
-          if ($feb5ffebff200149$export$16792effe837dba3(e) && e.shiftKey && manager.selectionMode === 'multiple') manager.extendSelection(firstKey);else if (selectOnFocus) manager.replaceSelection(firstKey);
-        }
-
-        break;
-
-      case 'End':
-        if (delegate.getLastKey) {
-          e.preventDefault();
-          var lastKey = delegate.getLastKey(manager.focusedKey, $feb5ffebff200149$export$16792effe837dba3(e));
-          manager.setFocusedKey(lastKey);
-          if ($feb5ffebff200149$export$16792effe837dba3(e) && e.shiftKey && manager.selectionMode === 'multiple') manager.extendSelection(lastKey);else if (selectOnFocus) manager.replaceSelection(lastKey);
-        }
-
-        break;
-
-      case 'PageDown':
-        if (delegate.getKeyPageBelow) {
-          e.preventDefault();
-
-          var _nextKey4 = delegate.getKeyPageBelow(manager.focusedKey);
-
-          navigateToKey(_nextKey4);
-        }
-
-        break;
-
-      case 'PageUp':
-        if (delegate.getKeyPageAbove) {
-          e.preventDefault();
-
-          var _nextKey5 = delegate.getKeyPageAbove(manager.focusedKey);
-
-          navigateToKey(_nextKey5);
-        }
-
-        break;
-
-      case 'a':
-        if ($feb5ffebff200149$export$16792effe837dba3(e) && manager.selectionMode === 'multiple' && disallowSelectAll !== true) {
-          e.preventDefault();
-          manager.selectAll();
-        }
-
-        break;
-
-      case 'Escape':
-        e.preventDefault();
-        if (!disallowEmptySelection) manager.clearSelection();
-        break;
-
-      case 'Tab':
-        if (!allowsTabNavigation) {
-          // There may be elements that are "tabbable" inside a collection (e.g. in a grid cell).
-          // However, collections should be treated as a single tab stop, with arrow key navigation internally.
-          // We don't control the rendering of these, so we can't override the tabIndex to prevent tabbing.
-          // Instead, we handle the Tab key, and move focus manually to the first/last tabbable element
-          // in the collection, so that the browser default behavior will apply starting from that element
-          // rather than the currently focused one.
-          if (e.shiftKey) ref.current.focus();else {
-            var walker = getFocusableTreeWalker(ref.current, {
-              tabbable: true
-            });
-            var next;
-            var last;
-
-            do {
-              last = walker.lastChild();
-              if (last) next = last;
-            } while (last);
-
-            if (next && !next.contains(document.activeElement)) $7215afc6de606d6b$export$de79e2c695e052f3(next);
-          }
-          break;
-        }
-
-    }
-  }; // Store the scroll position so we can restore it later.
-
-
-  var scrollPos = useRef({
-    top: 0,
-    left: 0
-  });
-  $e9faafb641e167db$export$90fc3a17d93f704c(scrollRef, 'scroll', isVirtualized ? null : function () {
-    scrollPos.current = {
-      top: scrollRef.current.scrollTop,
-      left: scrollRef.current.scrollLeft
-    };
-  });
-
-  var onFocus = function onFocus(e) {
-    if (manager.isFocused) {
-      // If a focus event bubbled through a portal, reset focus state.
-      if (!e.currentTarget.contains(e.target)) manager.setFocused(false);
-      return;
-    } // Focus events can bubble through portals. Ignore these events.
-
-
-    if (!e.currentTarget.contains(e.target)) return;
-    manager.setFocused(true);
-
-    if (manager.focusedKey == null) {
-      var navigateToFirstKey = function navigateToFirstKey(key) {
-        if (key != null) {
-          manager.setFocusedKey(key);
-          if (selectOnFocus) manager.replaceSelection(key);
-        }
-      }; // If the user hasn't yet interacted with the collection, there will be no focusedKey set.
-      // Attempt to detect whether the user is tabbing forward or backward into the collection
-      // and either focus the first or last item accordingly.
-
-
-      var relatedTarget = e.relatedTarget;
-
-      var _lastSelectedKey, _firstSelectedKey;
-
-      if (relatedTarget && e.currentTarget.compareDocumentPosition(relatedTarget) & Node.DOCUMENT_POSITION_FOLLOWING) navigateToFirstKey((_lastSelectedKey = manager.lastSelectedKey) !== null && _lastSelectedKey !== void 0 ? _lastSelectedKey : delegate.getLastKey());else navigateToFirstKey((_firstSelectedKey = manager.firstSelectedKey) !== null && _firstSelectedKey !== void 0 ? _firstSelectedKey : delegate.getFirstKey());
-    } else if (!isVirtualized) {
-      // Restore the scroll position to what it was before.
-      scrollRef.current.scrollTop = scrollPos.current.top;
-      scrollRef.current.scrollLeft = scrollPos.current.left; // Refocus and scroll the focused item into view if it exists within the scrollable region.
-
-      var element = scrollRef.current.querySelector("[data-key=\"" + manager.focusedKey + "\"]");
-
-      if (element) {
-        // This prevents a flash of focus on the first/last element in the collection
-        $7215afc6de606d6b$export$de79e2c695e052f3(element);
-        $2f04cbc44ee30ce0$export$53a0910f038337bd(scrollRef.current, element);
-      }
-    }
-  };
-
-  var onBlur = function onBlur(e) {
-    // Don't set blurred and then focused again if moving focus within the collection.
-    if (!e.currentTarget.contains(e.relatedTarget)) manager.setFocused(false);
-  };
-
-  var autoFocusRef = useRef(autoFocus);
-  useEffect(function () {
-    if (autoFocusRef.current) {
-      var focusedKey = null; // Check focus strategy to determine which item to focus
-
-      if (autoFocus === 'first') focusedKey = delegate.getFirstKey();
-      if (autoFocus === 'last') focusedKey = delegate.getLastKey(); // If there are any selected keys, make the first one the new focus target
-
-      var selectedKeys = manager.selectedKeys;
-      if (selectedKeys.size) focusedKey = selectedKeys.values().next().value;
-      manager.setFocused(true);
-      manager.setFocusedKey(focusedKey); // If no default focus key is selected, focus the collection itself.
-
-      if (focusedKey == null && !shouldUseVirtualFocus) focusSafely(ref.current);
-    }
-
-    autoFocusRef.current = false; // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []); // If not virtualized, scroll the focused element into view when the focusedKey changes.
-  // When virtualized, Virtualizer handles this internally.
-
-  useEffect(function () {
-    if (!isVirtualized && manager.focusedKey && (scrollRef === null || scrollRef === void 0 ? void 0 : scrollRef.current)) {
-      var element = scrollRef.current.querySelector("[data-key=\"" + manager.focusedKey + "\"]");
-      if (element) $2f04cbc44ee30ce0$export$53a0910f038337bd(scrollRef.current, element);
-    }
-  }, [isVirtualized, scrollRef, manager.focusedKey]);
-  var handlers = {
-    onKeyDown: onKeyDown,
-    onFocus: onFocus,
-    onBlur: onBlur,
-    onMouseDown: function onMouseDown(e) {
-      // Ignore events that bubbled through portals.
-      if (scrollRef.current === e.target) // Prevent focus going to the collection when clicking on the scrollbar.
-        e.preventDefault();
-    }
-  };
-
-  var _$fb3050f43d946246$ex = $fb3050f43d946246$export$e32c88dfddc6e1d8({
-    keyboardDelegate: delegate,
-    selectionManager: manager
-  }),
-      typeSelectProps = _$fb3050f43d946246$ex.typeSelectProps;
-
-  if (!disallowTypeAhead) handlers = $3ef42575df84b30b$export$9d1611c77c2fe928(typeSelectProps, handlers); // If nothing is focused within the collection, make the collection itself tabbable.
-  // This will be marshalled to either the first or last item depending on where focus came from.
-  // If using virtual focus, don't set a tabIndex at all so that VoiceOver on iOS 14 doesn't try
-  // to move real DOM focus to the element anyway.
-
-  var tabIndex;
-  if (!shouldUseVirtualFocus) tabIndex = manager.focusedKey == null ? 0 : -1;
-  return {
-    collectionProps: _extends({}, handlers, {
-      tabIndex: tabIndex
-    })
-  };
-}
-
-function $880e95eb8b93ba9a$export$ecf600387e221c37(options) {
-  var manager = options.selectionManager,
-      key = options.key,
-      ref = options.ref,
-      shouldSelectOnPressUp = options.shouldSelectOnPressUp,
-      isVirtualized = options.isVirtualized,
-      shouldUseVirtualFocus = options.shouldUseVirtualFocus,
-      focus = options.focus,
-      isDisabled = options.isDisabled,
-      onAction = options.onAction,
-      allowsDifferentPressOrigin = options.allowsDifferentPressOrigin;
-
-  var onSelect = function onSelect(e) {
-    if (e.pointerType === 'keyboard' && $feb5ffebff200149$export$d3e3bd3e26688c04(e)) manager.toggleSelection(key);else {
-      if (manager.selectionMode === 'none') return;
-
-      if (manager.selectionMode === 'single') {
-        if (manager.isSelected(key) && !manager.disallowEmptySelection) manager.toggleSelection(key);else manager.replaceSelection(key);
-      } else if (e && e.shiftKey) manager.extendSelection(key);else if (manager.selectionBehavior === 'toggle' || e && ($feb5ffebff200149$export$16792effe837dba3(e) || e.pointerType === 'touch' || e.pointerType === 'virtual')) // if touch or virtual (VO) then we just want to toggle, otherwise it's impossible to multi select because they don't have modifier keys
-        manager.toggleSelection(key);else manager.replaceSelection(key);
-    }
-  }; // Focus the associated DOM node when this item becomes the focusedKey
-
-
-  useEffect(function () {
-    var isFocused = key === manager.focusedKey;
-
-    if (isFocused && manager.isFocused && !shouldUseVirtualFocus && document.activeElement !== ref.current) {
-      if (focus) focus();else focusSafely(ref.current);
-    } // eslint-disable-next-line react-hooks/exhaustive-deps
-
-  }, [ref, key, manager.focusedKey, manager.childFocusStrategy, manager.isFocused, shouldUseVirtualFocus]);
-  isDisabled = isDisabled || manager.isDisabled(key); // Set tabIndex to 0 if the element is focused, or -1 otherwise so that only the last focused
-  // item is tabbable.  If using virtual focus, don't set a tabIndex at all so that VoiceOver
-  // on iOS 14 doesn't try to move real DOM focus to the item anyway.
-
-  var itemProps = {};
-  if (!shouldUseVirtualFocus && !isDisabled) itemProps = {
-    tabIndex: key === manager.focusedKey ? 0 : -1,
-    onFocus: function onFocus(e) {
-      if (e.target === ref.current) manager.setFocusedKey(key);
-    }
-  };else if (isDisabled) itemProps.onMouseDown = function (e) {
-    // Prevent focus going to the body when clicking on a disabled item.
-    e.preventDefault();
-  }; // With checkbox selection, onAction (i.e. navigation) becomes primary, and occurs on a single click of the row.
-  // Clicking the checkbox enters selection mode, after which clicking anywhere on any row toggles selection for that row.
-  // With highlight selection, onAction is secondary, and occurs on double click. Single click selects the row.
-  // With touch, onAction occurs on single tap, and long press enters selection mode.
-
-  var allowsSelection = !isDisabled && manager.canSelectItem(key);
-  var allowsActions = onAction && !isDisabled;
-  var hasPrimaryAction = allowsActions && (manager.selectionBehavior === 'replace' ? !allowsSelection : manager.isEmpty);
-  var hasSecondaryAction = allowsActions && allowsSelection && manager.selectionBehavior === 'replace';
-  var hasAction = hasPrimaryAction || hasSecondaryAction;
-  var modality = useRef(null);
-  var longPressEnabled = hasAction && allowsSelection;
-  var longPressEnabledOnPressStart = useRef(false);
-  var hadPrimaryActionOnPressStart = useRef(false); // By default, selection occurs on pointer down. This can be strange if selecting an
-  // item causes the UI to disappear immediately (e.g. menus).
-  // If shouldSelectOnPressUp is true, we use onPressUp instead of onPressStart.
-  // onPress requires a pointer down event on the same element as pointer up. For menus,
-  // we want to be able to have the pointer down on the trigger that opens the menu and
-  // the pointer up on the menu item rather than requiring a separate press.
-  // For keyboard events, selection still occurs on key down.
-
-  var itemPressProps = {};
-
-  if (shouldSelectOnPressUp) {
-    itemPressProps.onPressStart = function (e) {
-      modality.current = e.pointerType;
-      longPressEnabledOnPressStart.current = longPressEnabled;
-      if (e.pointerType === 'keyboard' && (!hasAction || $880e95eb8b93ba9a$var$isSelectionKey())) onSelect(e);
-    }; // If allowsDifferentPressOrigin, make selection happen on pressUp (e.g. open menu on press down, selection on menu item happens on press up.)
-    // Otherwise, have selection happen onPress (prevents listview row selection when clicking on interactable elements in the row)
-
-
-    if (!allowsDifferentPressOrigin) itemPressProps.onPress = function (e) {
-      if (hasPrimaryAction || hasSecondaryAction && e.pointerType !== 'mouse') {
-        if (e.pointerType === 'keyboard' && !$880e95eb8b93ba9a$var$isActionKey()) return;
-        onAction();
-      } else if (e.pointerType !== 'keyboard') onSelect(e);
-    };else {
-      itemPressProps.onPressUp = function (e) {
-        if (e.pointerType !== 'keyboard') onSelect(e);
-      };
-
-      itemPressProps.onPress = hasPrimaryAction ? function () {
-        return onAction();
-      } : null;
-    }
-  } else {
-    itemPressProps.onPressStart = function (e) {
-      modality.current = e.pointerType;
-      longPressEnabledOnPressStart.current = longPressEnabled;
-      hadPrimaryActionOnPressStart.current = hasPrimaryAction; // Select on mouse down unless there is a primary action which will occur on mouse up.
-      // For keyboard, select on key down. If there is an action, the Space key selects on key down,
-      // and the Enter key performs onAction on key up.
-
-      if (e.pointerType === 'mouse' && !hasPrimaryAction || e.pointerType === 'keyboard' && (!onAction || $880e95eb8b93ba9a$var$isSelectionKey())) onSelect(e);
-    };
-
-    itemPressProps.onPress = function (e) {
-      // Selection occurs on touch up. Primary actions always occur on pointer up.
-      // Both primary and secondary actions occur on Enter key up. The only exception
-      // is secondary actions, which occur on double click with a mouse.
-      if (e.pointerType === 'touch' || e.pointerType === 'pen' || e.pointerType === 'virtual' || e.pointerType === 'keyboard' && hasAction && $880e95eb8b93ba9a$var$isActionKey() || e.pointerType === 'mouse' && hadPrimaryActionOnPressStart.current) {
-        if (hasAction) onAction();else onSelect(e);
-      }
-    };
-  }
-
-  if (!isVirtualized) itemProps['data-key'] = key;
-  itemPressProps.preventFocusOnPress = shouldUseVirtualFocus;
-
-  var _$eCAIO$usePress = $f6c31cce2adf654f$export$45712eceda6fad21(itemPressProps),
-      pressProps = _$eCAIO$usePress.pressProps,
-      isPressed = _$eCAIO$usePress.isPressed; // Double clicking with a mouse with selectionBehavior = 'replace' performs an action.
-
-
-  var onDoubleClick = hasSecondaryAction ? function (e) {
-    if (modality.current === 'mouse') {
-      e.stopPropagation();
-      e.preventDefault();
-      onAction();
-    }
-  } : undefined; // Long pressing an item with touch when selectionBehavior = 'replace' switches the selection behavior
-  // to 'toggle'. This changes the single tap behavior from performing an action (i.e. navigating) to
-  // selecting, and may toggle the appearance of a UI affordance like checkboxes on each item.
-
-  var _$eCAIO$useLongPress = $8a26561d2877236e$export$c24ed0104d07eab9({
-    isDisabled: !longPressEnabled,
-    onLongPress: function onLongPress(e) {
-      if (e.pointerType === 'touch') {
-        onSelect(e);
-        manager.setSelectionBehavior('toggle');
-      }
-    }
-  }),
-      longPressProps = _$eCAIO$useLongPress.longPressProps; // Prevent native drag and drop on long press if we also select on long press.
-  // Once the user is in selection mode, they can long press again to drag.
-  // Use a capturing listener to ensure this runs before useDrag, regardless of
-  // the order the props get merged.
-
-
-  var onDragStartCapture = function onDragStartCapture(e) {
-    if (modality.current === 'touch' && longPressEnabledOnPressStart.current) e.preventDefault();
-  };
-
-  return {
-    itemProps: $3ef42575df84b30b$export$9d1611c77c2fe928(itemProps, allowsSelection || hasPrimaryAction ? pressProps : {}, longPressEnabled ? longPressProps : {}, {
-      onDoubleClick: onDoubleClick,
-      onDragStartCapture: onDragStartCapture
-    }),
-    isPressed: isPressed,
-    isSelected: manager.isSelected(key),
-    isDisabled: isDisabled,
-    allowsSelection: allowsSelection,
-    hasAction: hasAction
-  };
-}
-
-function $880e95eb8b93ba9a$var$isActionKey() {
-  var event = window.event;
-  return (event === null || event === void 0 ? void 0 : event.key) === 'Enter';
-}
-
-function $880e95eb8b93ba9a$var$isSelectionKey() {
-  var event = window.event;
-  return (event === null || event === void 0 ? void 0 : event.key) === ' ' || (event === null || event === void 0 ? void 0 : event.code) === 'Space';
-}
-
-var $2a25aae57d74318e$export$a05409b8bb224a5a = /*#__PURE__*/function () {
-  var _proto = $2a25aae57d74318e$export$a05409b8bb224a5a.prototype;
-
-  _proto.getKeyBelow = function getKeyBelow(key) {
-    key = this.collection.getKeyAfter(key);
-
-    while (key != null) {
-      var item = this.collection.getItem(key);
-      if (item.type === 'item' && !this.disabledKeys.has(key)) return key;
-      key = this.collection.getKeyAfter(key);
-    }
-  };
-
-  _proto.getKeyAbove = function getKeyAbove(key) {
-    key = this.collection.getKeyBefore(key);
-
-    while (key != null) {
-      var item = this.collection.getItem(key);
-      if (item.type === 'item' && !this.disabledKeys.has(key)) return key;
-      key = this.collection.getKeyBefore(key);
-    }
-  };
-
-  _proto.getFirstKey = function getFirstKey() {
-    var key = this.collection.getFirstKey();
-
-    while (key != null) {
-      var item = this.collection.getItem(key);
-      if (item.type === 'item' && !this.disabledKeys.has(key)) return key;
-      key = this.collection.getKeyAfter(key);
-    }
-  };
-
-  _proto.getLastKey = function getLastKey() {
-    var key = this.collection.getLastKey();
-
-    while (key != null) {
-      var item = this.collection.getItem(key);
-      if (item.type === 'item' && !this.disabledKeys.has(key)) return key;
-      key = this.collection.getKeyBefore(key);
-    }
-  };
-
-  _proto.getItem = function getItem(key) {
-    return this.ref.current.querySelector("[data-key=\"" + key + "\"]");
-  };
-
-  _proto.getKeyPageAbove = function getKeyPageAbove(key) {
-    var menu = this.ref.current;
-    var item = this.getItem(key);
-    if (!item) return null;
-    var pageY = Math.max(0, item.offsetTop + item.offsetHeight - menu.offsetHeight);
-
-    while (item && item.offsetTop > pageY) {
-      key = this.getKeyAbove(key);
-      item = this.getItem(key);
-    }
-
-    return key;
-  };
-
-  _proto.getKeyPageBelow = function getKeyPageBelow(key) {
-    var menu = this.ref.current;
-    var item = this.getItem(key);
-    if (!item) return null;
-    var pageY = Math.min(menu.scrollHeight, item.offsetTop - item.offsetHeight + menu.offsetHeight);
-
-    while (item && item.offsetTop < pageY) {
-      key = this.getKeyBelow(key);
-      item = this.getItem(key);
-    }
-
-    return key;
-  };
-
-  _proto.getKeyForSearch = function getKeyForSearch(search, fromKey) {
-    if (!this.collator) return null;
-    var collection = this.collection;
-    var key = fromKey || this.getFirstKey();
-
-    while (key != null) {
-      var item = collection.getItem(key);
-      var substring = item.textValue.slice(0, search.length);
-      if (item.textValue && this.collator.compare(substring, search) === 0) return key;
-      key = this.getKeyBelow(key);
-    }
-
-    return null;
-  };
-
-  function $2a25aae57d74318e$export$a05409b8bb224a5a(collection, disabledKeys, ref, collator) {
-    this.collection = collection;
-    this.disabledKeys = disabledKeys;
-    this.ref = ref;
-    this.collator = collator;
-  }
-
-  return $2a25aae57d74318e$export$a05409b8bb224a5a;
-}();
-
-function $982254629710d113$export$b95089534ab7c1fd(props) {
-  var selectionManager = props.selectionManager,
-      collection = props.collection,
-      disabledKeys = props.disabledKeys,
-      ref = props.ref,
-      keyboardDelegate = props.keyboardDelegate,
-      autoFocus = props.autoFocus,
-      shouldFocusWrap = props.shouldFocusWrap,
-      isVirtualized = props.isVirtualized,
-      disallowEmptySelection = props.disallowEmptySelection,
-      _props$selectOnFocus = props.selectOnFocus,
-      selectOnFocus = _props$selectOnFocus === void 0 ? selectionManager.selectionBehavior === 'replace' : _props$selectOnFocus,
-      disallowTypeAhead = props.disallowTypeAhead,
-      shouldUseVirtualFocus = props.shouldUseVirtualFocus,
-      allowsTabNavigation = props.allowsTabNavigation; // By default, a KeyboardDelegate is provided which uses the DOM to query layout information (e.g. for page up/page down).
-  // When virtualized, the layout object will be passed in as a prop and override this.
-
-  var collator = $325a3faab7a68acd$export$a16aca283550c30d({
-    usage: 'search',
-    sensitivity: 'base'
-  });
-  var disabledBehavior = selectionManager.disabledBehavior;
-  var delegate = useMemo(function () {
-    return keyboardDelegate || new $2a25aae57d74318e$export$a05409b8bb224a5a(collection, disabledBehavior === 'selection' ? new Set() : disabledKeys, ref, collator);
-  }, [keyboardDelegate, collection, disabledKeys, ref, collator, disabledBehavior]);
-
-  var _$ae20dd8cbca75726$ex = $ae20dd8cbca75726$export$d6daf82dcd84e87c({
-    ref: ref,
-    selectionManager: selectionManager,
-    keyboardDelegate: delegate,
-    autoFocus: autoFocus,
-    shouldFocusWrap: shouldFocusWrap,
-    disallowEmptySelection: disallowEmptySelection,
-    selectOnFocus: selectOnFocus,
-    disallowTypeAhead: disallowTypeAhead,
-    shouldUseVirtualFocus: shouldUseVirtualFocus,
-    allowsTabNavigation: allowsTabNavigation,
-    isVirtualized: isVirtualized,
-    scrollRef: ref
-  }),
-      collectionProps = _$ae20dd8cbca75726$ex.collectionProps;
-
-  return {
-    listProps: collectionProps
-  };
-}
-
-var $453cc9f0df89c0a5$var$cache = new WeakMap();
-
-function $453cc9f0df89c0a5$export$77d5aafae4e095b2(collection) {
-  var count = $453cc9f0df89c0a5$var$cache.get(collection);
-  if (count != null) return count;
-  count = 0;
-
-  for (var _iterator10 = _createForOfIteratorHelperLoose(collection), _step10; !(_step10 = _iterator10()).done;) {
-    var item = _step10.value;
-    if (item.type === 'section') count += $453cc9f0df89c0a5$export$77d5aafae4e095b2(item.childNodes);else count++;
-  }
-
-  $453cc9f0df89c0a5$var$cache.set(collection, count);
-  return count;
-}
-
-var $b1f0cad8af73213b$export$3585ede4d035bf14 = new WeakMap();
-
-function $b1f0cad8af73213b$var$normalizeKey(key) {
-  if (typeof key === 'string') return key.replace(/\s*/g, '');
-  return '' + key;
-}
-
-function $b1f0cad8af73213b$export$9145995848b05025(state, itemKey) {
-  var 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) {
-  var domProps = $65484d02dcb7eb3e$export$457c3d6518dd4c6f(props, {
-    labelable: true
-  });
-
-  var _$frWMC$useSelectable = $982254629710d113$export$b95089534ab7c1fd(_extends({}, props, {
-    ref: ref,
-    selectionManager: state.selectionManager,
-    collection: state.collection,
-    disabledKeys: state.disabledKeys
-  })),
-      listProps = _$frWMC$useSelectable.listProps;
-
-  var _$frWMC$useFocusWithi = $9ab94262bd0047c7$export$420e68273165f4ec({
-    onFocusWithin: props.onFocus,
-    onBlurWithin: props.onBlur,
-    onFocusWithinChange: props.onFocusChange
-  }),
-      focusWithinProps = _$frWMC$useFocusWithi.focusWithinProps; // Share list id and some props with child options.
-
-
-  var id = $bdb11010cef70236$export$f680877a34711e37(props.id);
-  $b1f0cad8af73213b$export$3585ede4d035bf14.set(state, {
-    id: id,
-    shouldUseVirtualFocus: props.shouldUseVirtualFocus,
-    shouldSelectOnPressUp: props.shouldSelectOnPressUp,
-    shouldFocusOnHover: props.shouldFocusOnHover,
-    isVirtualized: props.isVirtualized,
-    onAction: props.onAction
-  });
-
-  var _$frWMC$useLabel = $d191a55c9702f145$export$8467354a121f1b9f(_extends({}, props, {
-    id: id,
-    // listbox is not an HTML input element so it
-    // shouldn't be labeled by a <label> element.
-    labelElementType: 'span'
-  })),
-      labelProps = _$frWMC$useLabel.labelProps,
-      fieldProps = _$frWMC$useLabel.fieldProps;
-
-  return {
-    labelProps: labelProps,
-    listBoxProps: $3ef42575df84b30b$export$9d1611c77c2fe928(domProps, focusWithinProps, state.selectionManager.selectionMode === 'multiple' ? {
-      'aria-multiselectable': 'true'
-    } : {}, _extends({
-      role: 'listbox'
-    }, $3ef42575df84b30b$export$9d1611c77c2fe928(fieldProps, listProps)))
-  };
-}
-
-function $293f70390ea03370$export$497855f14858aa34(props, state, ref) {
-  var key = props.key;
-  var data = $b1f0cad8af73213b$export$3585ede4d035bf14.get(state);
-
-  var _isDisabled;
-
-  var isDisabled = (_isDisabled = props.isDisabled) !== null && _isDisabled !== void 0 ? _isDisabled : state.disabledKeys.has(key);
-
-  var _isSelected;
-
-  var isSelected = (_isSelected = props.isSelected) !== null && _isSelected !== void 0 ? _isSelected : state.selectionManager.isSelected(key);
-  var isFocused = state.selectionManager.focusedKey === key;
-
-  var _shouldSelectOnPressUp;
-
-  var shouldSelectOnPressUp = (_shouldSelectOnPressUp = props.shouldSelectOnPressUp) !== null && _shouldSelectOnPressUp !== void 0 ? _shouldSelectOnPressUp : data.shouldSelectOnPressUp;
-
-  var _shouldFocusOnHover;
-
-  var shouldFocusOnHover = (_shouldFocusOnHover = props.shouldFocusOnHover) !== null && _shouldFocusOnHover !== void 0 ? _shouldFocusOnHover : data.shouldFocusOnHover;
-
-  var _shouldUseVirtualFocus;
-
-  var shouldUseVirtualFocus = (_shouldUseVirtualFocus = props.shouldUseVirtualFocus) !== null && _shouldUseVirtualFocus !== void 0 ? _shouldUseVirtualFocus : data.shouldUseVirtualFocus;
-
-  var _isVirtualized;
-
-  var isVirtualized = (_isVirtualized = props.isVirtualized) !== null && _isVirtualized !== void 0 ? _isVirtualized : data.isVirtualized;
-  var labelId = $bdb11010cef70236$export$b4cc09c592e8fdb8();
-  var descriptionId = $bdb11010cef70236$export$b4cc09c592e8fdb8();
-  var optionProps = {
-    role: 'option',
-    'aria-disabled': isDisabled,
-    'aria-selected': state.selectionManager.selectionMode !== 'none' ? isSelected : undefined
-  }; // Safari with VoiceOver on macOS misreads options with aria-labelledby or aria-label as simply "text".
-  // We should not map slots to the label and description on Safari and instead just have VoiceOver read the textContent.
-  // https://bugs.webkit.org/show_bug.cgi?id=209279
-
-  if (!($c87311424ea30a05$export$9ac100e40613ea10() && $c87311424ea30a05$export$78551043582a6a98())) {
-    optionProps['aria-label'] = props['aria-label'];
-    optionProps['aria-labelledby'] = labelId;
-    optionProps['aria-describedby'] = descriptionId;
-  }
-
-  if (isVirtualized) {
-    optionProps['aria-posinset'] = state.collection.getItem(key).index + 1;
-    optionProps['aria-setsize'] = $453cc9f0df89c0a5$export$77d5aafae4e095b2(state.collection);
-  }
-
-  var _$frWMC$useSelectable2 = $880e95eb8b93ba9a$export$ecf600387e221c37({
-    selectionManager: state.selectionManager,
-    key: key,
-    ref: ref,
-    shouldSelectOnPressUp: shouldSelectOnPressUp,
-    allowsDifferentPressOrigin: shouldSelectOnPressUp && shouldFocusOnHover,
-    isVirtualized: isVirtualized,
-    shouldUseVirtualFocus: shouldUseVirtualFocus,
-    isDisabled: isDisabled,
-    onAction: data.onAction ? function () {
-      return data.onAction(key);
-    } : undefined
-  }),
-      itemProps = _$frWMC$useSelectable2.itemProps,
-      isPressed = _$frWMC$useSelectable2.isPressed,
-      hasAction = _$frWMC$useSelectable2.hasAction,
-      allowsSelection = _$frWMC$useSelectable2.allowsSelection;
-
-  var _$frWMC$useHover = $6179b936705e76d3$export$ae780daf29e6d456({
-    isDisabled: isDisabled || !shouldFocusOnHover,
-    onHoverStart: function onHoverStart() {
-      if (!$507fabe10e71c6fb$export$b9b3dfddab17db27()) {
-        state.selectionManager.setFocused(true);
-        state.selectionManager.setFocusedKey(key);
-      }
-    }
-  }),
-      hoverProps = _$frWMC$useHover.hoverProps;
-
-  return {
-    optionProps: _extends({}, optionProps, $3ef42575df84b30b$export$9d1611c77c2fe928(itemProps, hoverProps), {
-      id: $b1f0cad8af73213b$export$9145995848b05025(state, key)
-    }),
-    labelProps: {
-      id: labelId
-    },
-    descriptionProps: {
-      id: descriptionId
-    },
-    isFocused: isFocused,
-    isSelected: isSelected,
-    isDisabled: isDisabled,
-    isPressed: isPressed,
-    allowsSelection: allowsSelection,
-    hasAction: hasAction
-  };
-}
-
-var _templateObject$3, _templateObject2$3, _templateObject3$3, _templateObject4$3, _templateObject5$3, _templateObject6$1;
-
-var _excluded$3 = ["state", "mode"];
-
-var Listbox = function Listbox(_ref) {
-  var state = _ref.state,
-      _ref$mode = _ref.mode,
-      mode = _ref$mode === void 0 ? 'default' : _ref$mode,
-      props = _objectWithoutPropertiesLoose(_ref, _excluded$3);
-
-  var ref = useRef(null);
-
-  var _useListBox = $c132121280ec012d$export$50eacbbf140a3141(props, state, ref),
-      listBoxProps = _useListBox.listBoxProps;
-
-  var collection = useMemo(function () {
-    return [].concat(state.collection).map(function (node, index, self) {
-      return {
-        node: node,
-        first: index === 0,
-        last: index === self.length - 1
-      };
-    });
-  }, [state.collection]);
-  return /*#__PURE__*/React.createElement(ListboxRoot, _extends({
-    ref: ref
-  }, listBoxProps), collection.map(function (_ref2) {
-    var node = _ref2.node,
-        last = _ref2.last;
-    return /*#__PURE__*/React.createElement(Fragment, {
-      key: node.key
-    }, /*#__PURE__*/React.createElement(Option, {
-      item: node,
-      state: state,
-      mode: mode
-    }), !last && mode === 'separator' && /*#__PURE__*/React.createElement(Divider, null));
-  }));
-};
-
-var Listbox$1 = memo(Listbox);
-var ListboxRoot = styled.ul(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteralLoose(["\n  padding-left: 0;\n  margin: 0;\n  box-sizing: border-box;\n  list-style: none;\n\n  ", "\n"])), theme$2(function (o) {
-  return [o.bg.background1, o.border["default"], o.borderRadius(8), o.outline["default"].focus];
-}));
-var Divider = styled.div.attrs({
-  role: 'separator'
-})(_templateObject2$3 || (_templateObject2$3 = _taggedTemplateLiteralLoose(["\n  display: flex;\n  ", "\n\n  &:before {\n    content: '';\n    display: block;\n    width: 100%;\n    height: 1px;\n    background: #00000014;\n  }\n"])), theme$2(function (o) {
-  return [o.padding.horizontal(8)];
-}));
-
-var Option = function Option(_ref3) {
-  var item = _ref3.item,
-      state = _ref3.state,
-      mode = _ref3.mode;
-  var ref = useRef(null);
-
-  var _useOption = $293f70390ea03370$export$497855f14858aa34(item, state, ref),
-      optionProps = _useOption.optionProps,
-      isSelected = _useOption.isSelected;
-
-  var _useFocusRing = useFocusRing(),
-      focusProps = _useFocusRing.focusProps;
-
-  return /*#__PURE__*/React.createElement(OptionRoot, _extends({}, $3ef42575df84b30b$export$9d1611c77c2fe928(optionProps, focusProps), {
-    ref: ref,
-    mode: mode
-  }), /*#__PURE__*/React.createElement(OptionCheckIcon, {
-    name: "16/Check",
-    isSelected: isSelected
-  }), /*#__PURE__*/React.createElement(OptionText, null, item.rendered));
-};
-
-var OptionRoot = styled.li(_templateObject3$3 || (_templateObject3$3 = _taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  gap: ", ";\n  height: 40px;\n  cursor: pointer;\n  outline: none;\n\n  ", "\n\n  &:focus {\n    ", "\n  }\n"])), function (_ref4) {
-  var theme = _ref4.theme;
-  return px(theme.spacing[4]);
-}, function (_ref5) {
-  var mode = _ref5.mode;
-  return theme$2(function (o) {
-    return [o.padding.horizontal(8), mode === 'separator' && o.padding.vertical(4)];
-  });
-}, theme$2(function (o) {
-  return [o.bg.surface3];
-}));
-var OptionCheckIcon = styled(Icon$1)(_templateObject4$3 || (_templateObject4$3 = _taggedTemplateLiteralLoose(["\n  visibility: hidden;\n\n  ", "\n"])), function (_ref6) {
-  var isSelected = _ref6.isSelected;
-  return isSelected && css(_templateObject5$3 || (_templateObject5$3 = _taggedTemplateLiteralLoose(["\n      visibility: visible;\n    "])));
-});
-var OptionText = styled.span(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteralLoose(["\n  display: block;\n  ", "\n"])), theme$2(function (o) {
-  return [o.typography(14)];
-}));
-
-var _excluded$2 = ["open", "onClose", "children"];
-
-var Popover = function Popover(_ref) {
-  var open = _ref.open,
-      onClose = _ref.onClose,
-      children = _ref.children,
-      props = _objectWithoutPropertiesLoose(_ref, _excluded$2);
-
-  var ref = useRef(null);
-
-  var _useOverlay = useOverlay(useMemo(function () {
-    return {
-      isOpen: open,
-      onClose: onClose,
-      shouldCloseOnBlur: true,
-      isDismissable: true
-    };
-  }, [onClose, open]), ref),
-      overlayProps = _useOverlay.overlayProps;
-
-  return /*#__PURE__*/React.createElement(FocusScope, {
-    restoreFocus: true
-  }, /*#__PURE__*/React.createElement("div", _extends({}, $3ef42575df84b30b$export$9d1611c77c2fe928(overlayProps, props), {
-    ref: ref
-  }), children, /*#__PURE__*/React.createElement(DismissButton, {
-    onDismiss: onClose
-  })));
-};
-
-var Popover$1 = memo(Popover);
-
-var _templateObject$2, _templateObject2$2, _templateObject3$2, _templateObject4$2, _templateObject5$2, _templateObject6, _templateObject7;
-
-var _excluded$1 = ["open", "className", "label", "requiredText", "subLabel", "assertiveText", "autoComplete", "invalid", "disabled", "required", "showLabel", "mode"];
-
-var DropdownSelector = function DropdownSelector(_ref) {
-  var open = _ref.open,
-      className = _ref.className,
-      _ref$label = _ref.label,
-      label = _ref$label === void 0 ? '' : _ref$label,
-      _ref$requiredText = _ref.requiredText,
-      requiredText = _ref$requiredText === void 0 ? '' : _ref$requiredText,
-      subLabel = _ref.subLabel,
-      assertiveText = _ref.assertiveText,
-      autoComplete = _ref.autoComplete,
-      _ref$invalid = _ref.invalid,
-      invalid = _ref$invalid === void 0 ? false : _ref$invalid,
-      _ref$disabled = _ref.disabled,
-      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-      _ref$required = _ref.required,
-      required = _ref$required === void 0 ? false : _ref$required,
-      _ref$showLabel = _ref.showLabel,
-      showLabel = _ref$showLabel === void 0 ? false : _ref$showLabel,
-      _ref$mode = _ref.mode,
-      mode = _ref$mode === void 0 ? 'default' : _ref$mode,
-      props = _objectWithoutPropertiesLoose(_ref, _excluded$1);
-
-  var _useVisuallyHidden = useVisuallyHidden(),
-      visuallyHiddenProps = _useVisuallyHidden.visuallyHiddenProps;
-
-  var triggerRef = useRef(null);
-  var selectProps = useMemo(function () {
-    return _extends({}, props, {
-      label: label,
-      isOpen: open,
-      isDisabled: disabled,
-      isRequired: required,
-      errorMessage: invalid && assertiveText,
-      validationState: invalid ? 'invalid' : 'valid',
-      onSelectionChange: props.onChange,
-      selectedKey: props.value,
-      defaultSelectedKey: props.defaultValue
-    });
-  }, [assertiveText, disabled, invalid, label, open, props, required]);
-  var state = useSelectState(selectProps);
-
-  var _useSelect = useSelect(selectProps, state, triggerRef),
-      labelProps = _useSelect.labelProps,
-      triggerProps = _useSelect.triggerProps,
-      valueProps = _useSelect.valueProps,
-      menuProps = _useSelect.menuProps,
-      errorMessageProps = _useSelect.errorMessageProps,
-      descriptionProps = _useSelect.descriptionProps;
-
-  var _useButton = useButton(triggerProps, triggerRef),
-      buttonProps = _useButton.buttonProps;
-
-  var hasAssertiveText = assertiveText !== undefined && assertiveText.length > 0;
-  return /*#__PURE__*/React.createElement(DropdownSelectorRoot, {
-    "aria-disabled": disabled,
-    className: className
-  }, /*#__PURE__*/React.createElement(DropdownFieldLabel, _extends({
-    label: label,
-    required: required,
-    requiredText: requiredText,
-    subLabel: subLabel
-  }, labelProps, !showLabel ? visuallyHiddenProps : {})), /*#__PURE__*/React.createElement(HiddenSelect, {
-    state: state,
-    triggerRef: triggerRef,
-    label: label,
-    name: props.name,
-    isDisabled: disabled,
-    autoComplete: autoComplete
-  }), /*#__PURE__*/React.createElement(DropdownButtonWrapper, null, /*#__PURE__*/React.createElement(DropdownButton, _extends({}, buttonProps, {
-    ref: triggerRef,
-    invalid: invalid
-  }), /*#__PURE__*/React.createElement(DropdownButtonText, valueProps, state.selectedItem ? state.selectedItem.rendered : props.placeholder), /*#__PURE__*/React.createElement(Icon$1, {
-    name: "16/Menu"
-  })), state.isOpen && /*#__PURE__*/React.createElement(DropdownPopover, {
-    open: state.isOpen,
-    onClose: function onClose() {
-      return state.close();
-    }
-  }, /*#__PURE__*/React.createElement(Listbox$1, _extends({}, menuProps, {
-    state: state,
-    mode: mode
-  })))), hasAssertiveText && /*#__PURE__*/React.createElement(AssertiveText, _extends({
-    invalid: invalid
-  }, invalid ? errorMessageProps : descriptionProps), assertiveText));
-};
-var DropdownSelectorItem = Item;
-var DropdownSelectorRoot = styled.div(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteralLoose(["\n  position: relative;\n  display: inline-block;\n\n  ", " {\n    cursor: default;\n    ", "\n  }\n"])), disabledSelector, theme$2(function (o) {
-  return o.disabled;
-}));
-var DropdownFieldLabel = styled(FieldLabel)(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteralLoose(["\n  width: 100%;\n\n  ", "\n"])), theme$2(function (o) {
-  return o.margin.bottom(8);
-}));
-var DropdownButtonWrapper = styled.div(_templateObject3$2 || (_templateObject3$2 = _taggedTemplateLiteralLoose(["\n  position: relative;\n"])));
-var DropdownButton = styled.button(_templateObject4$2 || (_templateObject4$2 = _taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n\n  height: 40px;\n  width: 288px;\n  box-sizing: border-box;\n  cursor: pointer;\n\n  ", " {\n    cursor: default;\n  }\n\n  ", "\n"])), disabledSelector, function (_ref2) {
-  var invalid = _ref2.invalid;
-  return theme$2(function (o) {
-    return [o.border["default"], o.padding.horizontal(8), o.outline["default"].focus, o.bg.surface3, o.borderRadius(4), invalid && o.outline.assertive];
-  });
-});
-var DropdownButtonText = styled.span(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteralLoose(["\n  text-align: left;\n\n  ", "\n"])), theme$2(function (o) {
-  return [o.typography(14), o.font.text2];
-}));
-var AssertiveText = styled.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref3) {
-  var invalid = _ref3.invalid;
-  return theme$2(function (o) {
-    return [o.typography(14), o.margin.top(8), invalid && o.font.assertive];
-  });
-});
-var DropdownPopover = styled(Popover$1)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n  position: absolute;\n  width: 100%;\n\n  top: 100%;\n  margin-top: 2px;\n"])));
-
-var RadioContext = createContext(null);
-var RadioProvider = function RadioProvider(_ref) {
-  var value = _ref.value,
-      children = _ref.children;
-  return /*#__PURE__*/React.createElement(RadioContext.Provider, {
-    value: value
-  }, children);
-};
-var useRadioContext = function useRadioContext() {
-  var state = useContext(RadioContext);
-  if (state === null) throw new Error('`<RadioProvider>` is not likely mounted.');
-  return state;
-};
-
-var _templateObject$1, _templateObject2$1, _templateObject3$1, _templateObject4$1, _templateObject5$1;
-
-var _excluded = ["children"];
-var SegmentedControl = forwardRef(function SegmentedControlInner(props, ref) {
-  var ariaRadioGroupProps = useMemo(function () {
-    return _extends({}, props, {
-      isDisabled: props.disabled,
-      isReadOnly: props.readonly,
-      isRequired: props.required
-    });
-  }, [props]);
-  var state = useRadioGroupState(ariaRadioGroupProps);
-
-  var _useRadioGroup = useRadioGroup(ariaRadioGroupProps, state),
-      radioGroupProps = _useRadioGroup.radioGroupProps;
-
-  var segmentedControlItems = useMemo(function () {
-    return props.data.map(function (d) {
-      return typeof d === 'string' ? {
-        value: d,
-        label: d
-      } : d;
-    });
-  }, [props.data]);
-  return /*#__PURE__*/React.createElement(SegmentedControlRoot, _extends({
-    ref: ref
-  }, radioGroupProps), /*#__PURE__*/React.createElement(RadioProvider, {
-    value: state
-  }, segmentedControlItems.map(function (item) {
-    return /*#__PURE__*/React.createElement(Segmented, {
-      key: item.value,
-      value: item.value,
-      disabled: item.disabled
-    }, item.label);
-  })));
-});
-var index$1 = memo(SegmentedControl);
-
-var Segmented = function Segmented(_ref) {
-  var children = _ref.children,
-      props = _objectWithoutPropertiesLoose(_ref, _excluded);
-
-  var state = useRadioContext();
-  var ref = useRef(null);
-  var ariaRadioProps = useMemo(function () {
-    return _extends({}, props, {
-      isDisabled: props.disabled
-    });
-  }, [props]);
-
-  var _useRadio = useRadio(ariaRadioProps, state, ref),
-      inputProps = _useRadio.inputProps,
-      isDisabled = _useRadio.isDisabled,
-      isSelected = _useRadio.isSelected;
-
-  return /*#__PURE__*/React.createElement(SegmentedRoot, {
-    "aria-disabled": isDisabled || state.isReadOnly,
-    checked: isSelected
-  }, /*#__PURE__*/React.createElement(SegmentedInput, _extends({}, inputProps, {
-    ref: ref
-  })), /*#__PURE__*/React.createElement(RadioLabel, null, /*#__PURE__*/React.createElement(SegmentedLabelInner, null, children)));
-};
-
-var SegmentedControlRoot = styled.div(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteralLoose(["\n  display: inline-flex;\n  align-items: center;\n\n  ", "\n"])), theme$2(function (o) {
-  return [o.bg.surface3, o.borderRadius(16)];
-}));
-var SegmentedRoot = styled.label(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteralLoose(["\n  position: relative;\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n  height: 32px;\n\n  ", " {\n    cursor: default;\n  }\n\n  ", "\n"])), disabledSelector, function (_ref2) {
-  var checked = _ref2.checked;
-  return theme$2(function (o) {
-    return [o.padding.horizontal(16), o.borderRadius(16), o.disabled, checked === true && o.bg.brand, checked === true ? o.font.text5 : o.font.text2];
-  });
-});
-var SegmentedInput = styled.input(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteralLoose(["\n  position: absolute;\n\n  height: 0px;\n  width: 0px;\n  padding: 0;\n  margin: 0;\n\n  appearance: none;\n  box-sizing: border-box;\n  overflow: hidden;\n  white-space: nowrap;\n  opacity: 0;\n"])));
-var RadioLabel = styled.div(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteralLoose(["\n  background: transparent;\n  display: flex;\n  align-items: center;\n  height: 22px;\n"])));
-var SegmentedLabelInner = styled.div(_templateObject5$1 || (_templateObject5$1 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), theme$2(function (o) {
-  return [o.typography(14)];
-}));
-
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
-var Checkbox = forwardRef(function CheckboxInner(props, ref) {
-  var _props$disabled, _props$readonly;
-
-  var ariaCheckboxProps = useMemo(function () {
-    return _extends({}, props, {
-      isSelected: props.checked,
-      defaultSelected: props.defaultChecked,
-      // children がいない場合は aria-label をつけないといけない
-      'aria-label': 'children' in props ? undefined : props.label,
-      isDisabled: props.disabled
-    });
-  }, [props]);
-  var state = useToggleState(ariaCheckboxProps);
-  var objectRef = $df56164dff5785e2$export$4338b53315abf666(ref);
-
-  var _useCheckbox = useCheckbox(ariaCheckboxProps, state, objectRef),
-      inputProps = _useCheckbox.inputProps;
-
-  var isDisabled = ((_props$disabled = props.disabled) != null ? _props$disabled : false) || ((_props$readonly = props.readonly) != null ? _props$readonly : false);
-  return /*#__PURE__*/React.createElement(InputRoot, {
-    "aria-disabled": isDisabled
-  }, /*#__PURE__*/React.createElement(CheckboxInput, _extends({
-    type: "checkbox"
-  }, inputProps)), /*#__PURE__*/React.createElement(CheckboxInputOverlay, {
-    "aria-hidden": true,
-    checked: inputProps.checked
-  }, /*#__PURE__*/React.createElement(Icon$1, {
-    name: "24/Check",
-    unsafeNonGuidelineScale: 2 / 3
-  })), 'children' in props && /*#__PURE__*/React.createElement(InputLabel, null, props.children));
-});
-var index = memo(Checkbox);
-var hiddenCss = css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  visibility: hidden;\n"])));
-var InputRoot = styled.label(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n  position: relative;\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n  ", " {\n    cursor: default;\n  }\n\n  gap: ", ";\n  ", "\n"])), disabledSelector, function (_ref) {
-  var theme = _ref.theme;
-  return px(theme.spacing[4]);
-}, theme$2(function (o) {
-  return [o.disabled];
-}));
-var CheckboxInput = styled.input(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n  &[type='checkbox'] {\n    appearance: none;\n    display: block;\n    cursor: pointer;\n    margin: 0;\n    width: 20px;\n    height: 20px;\n\n    &:checked {\n      ", "\n    }\n    &:not(:checked) {\n      border-width: 2px;\n      border-style: solid;\n      border-color: ", ";\n    }\n    ", "\n  }\n"])), theme$2(function (o) {
-  return o.bg.brand.hover.press;
-}), function (_ref2) {
-  var theme = _ref2.theme;
-  return theme.color.text4;
-}, theme$2(function (o) {
-  return [o.outline["default"].focus, o.borderRadius(4)];
-}));
-var CheckboxInputOverlay = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: -2px;\n  left: -2px;\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  ", "\n\n  ", ";\n"])), theme$2(function (o) {
-  return [o.width.px(24), o.height.px(24), o.font.text5];
-}), function (_ref3) {
-  var checked = _ref3.checked;
-  return checked !== true && hiddenCss;
-});
-var InputLabel = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n  ", "\n"])), theme$2(function (o) {
-  return [o.typography(14)];
-}));
-
-export { Button, index as Checkbox, Clickable, ComponentAbstraction, DropdownSelector, DropdownSelectorItem, Icon$1 as Icon, IconButton, LoadingSpinner, LoadingSpinnerIcon, Modal, ModalAlign, ModalBody, ModalButtons, ModalHeader, MultiSelect, MultiSelectGroup, Radio, RadioGroup, index$1 as SegmentedControl, SwitchCheckbox as Switch, TextField, useComponentAbstraction };
-//# sourceMappingURL=index.module.js.map