@charcoal-ui/react 2.2.1 → 2.4.0

package/dist/index.js

@@ -1,4409 +0,0 @@
-// src/core/ComponentAbstraction.tsx
-import React, { useContext } from "react";
-var DefaultLink = React.forwardRef(
-  function DefaultLink2({ to, children, ...rest }, ref) {
-    return /* @__PURE__ */ React.createElement("a", { href: to, ref, ...rest }, children);
-  }
-);
-var DefaultValue = {
-  Link: DefaultLink
-};
-var ComponentAbstractionContext = React.createContext(DefaultValue);
-function ComponentAbstraction({ children, components }) {
-  return /* @__PURE__ */ React.createElement(
-    ComponentAbstractionContext.Provider,
-    {
-      value: { ...DefaultValue, ...components }
-    },
-    children
-  );
-}
-function useComponentAbstraction() {
-  return useContext(ComponentAbstractionContext);
-}
-
-// src/core/SSRProvider.tsx
-import { SSRProvider } from "@react-aria/ssr";
-
-// src/core/OverlayProvider.tsx
-import { OverlayProvider } from "@react-aria/overlays";
-
-// src/components/Button/index.tsx
-import React3 from "react";
-import styled3 from "styled-components";
-
-// src/_lib/index.ts
-function unreachable(value) {
-  throw new Error(
-    arguments.length === 0 ? "unreachable" : `unreachable (${JSON.stringify(value)})`
-  );
-}
-
-// src/styled.ts
-import styled from "styled-components";
-import { createTheme } from "@charcoal-ui/styled";
-var theme = createTheme(styled);
-
-// src/components/Clickable/index.tsx
-import React2 from "react";
-import styled2, { css } from "styled-components";
-import { disabledSelector } from "@charcoal-ui/utils";
-var Clickable = React2.forwardRef(
-  function Clickable2(props, ref) {
-    const { Link } = useComponentAbstraction();
-    if ("to" in props) {
-      const { onClick, disabled = false, ...rest } = props;
-      return /* @__PURE__ */ React2.createElement(
-        A,
-        {
-          ...rest,
-          as: disabled ? void 0 : Link,
-          onClick: disabled ? void 0 : onClick,
-          "aria-disabled": disabled,
-          ref
-        }
-      );
-    } else {
-      return /* @__PURE__ */ React2.createElement(Button, { ...props, ref });
-    }
-  }
-);
-var Clickable_default = Clickable;
-var clickableCss = css`
-  /* Clickable style */
-  cursor: pointer;
-
-  ${disabledSelector} {
-    cursor: default;
-  }
-`;
-var Button = styled2.button`
-  /* Reset button appearance */
-  appearance: none;
-  background: transparent;
-  padding: 0;
-  border-style: none;
-  outline: none;
-  color: inherit;
-  text-rendering: inherit;
-  letter-spacing: inherit;
-  word-spacing: inherit;
-
-  &:focus {
-    outline: none;
-  }
-
-  /* Change the font styles in all browsers. */
-  font: inherit;
-
-  /* Remove the margin in Firefox and Safari. */
-  margin: 0;
-
-  /* Show the overflow in Edge. */
-  overflow: visible;
-
-  /* Remove the inheritance of text transform in Firefox. */
-  text-transform: none;
-
-  /* Remove the inner border and padding in Firefox. */
-  &::-moz-focus-inner {
-    border-style: none;
-    padding: 0;
-  }
-
-  ${clickableCss}
-`;
-var A = styled2.span`
-  /* Reset a-tag appearance */
-  color: inherit;
-
-  &:focus {
-    outline: none;
-  }
-
-  .text {
-    top: calc(1em + 2em);
-  }
-
-  ${clickableCss}
-`;
-
-// src/components/Button/index.tsx
-var Button2 = React3.forwardRef(function Button3({
-  children,
-  variant = "Default",
-  size = "M",
-  fixed = false,
-  disabled = false,
-  ...rest
-}, ref) {
-  return /* @__PURE__ */ React3.createElement(
-    StyledButton,
-    {
-      ...rest,
-      disabled,
-      variant,
-      size,
-      fixed,
-      ref
-    },
-    children
-  );
-});
-var Button_default = Button2;
-var StyledButton = styled3(Clickable_default).withConfig({
-  shouldForwardProp(prop) {
-    return prop !== "fixed";
-  }
-}).attrs(styledProps)`
-  width: ${(p) => p.fixed ? "stretch" : "min-content"};
-  display: inline-grid;
-  align-items: center;
-  justify-content: center;
-  cursor: pointer;
-  user-select: none;
-  white-space: nowrap;
-
-  ${(p) => theme((o) => [
-  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
-])}
-
-  /* よく考えたらheight=32って定義が存在しないな... */
-  height: ${(p) => p.height}px;
-`;
-function styledProps(props) {
-  return {
-    ...props,
-    ...variantToProps(props.variant),
-    ...sizeToProps(props.size)
-  };
-}
-function variantToProps(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(size) {
-  switch (size) {
-    case "S":
-      return {
-        height: 32,
-        padding: 16
-      };
-    case "M":
-      return {
-        height: 40,
-        padding: 24
-      };
-  }
-}
-
-// src/components/IconButton/index.tsx
-import React4 from "react";
-import styled4 from "styled-components";
-var IconButton = React4.forwardRef(
-  function IconButtonInner({ variant = "Default", size = "M", icon, ...rest }, ref) {
-    validateIconSize(size, icon);
-    return /* @__PURE__ */ React4.createElement(StyledIconButton, { ...rest, ref, variant, size }, /* @__PURE__ */ React4.createElement("pixiv-icon", { name: icon }));
-  }
-);
-var IconButton_default = IconButton;
-var StyledIconButton = styled4(Clickable_default).attrs(styledProps2)`
-  user-select: none;
-
-  width: ${(p) => p.width}px;
-  height: ${(p) => p.height}px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-
-  ${({ font, background }) => theme((o) => [
-  o.font[font],
-  o.bg[background].hover.press,
-  o.disabled,
-  o.borderRadius("oval"),
-  o.outline.default.focus
-])}
-`;
-function styledProps2(props) {
-  return {
-    ...props,
-    ...variantToProps2(props.variant),
-    ...sizeToProps2(props.size)
-  };
-}
-function variantToProps2(variant) {
-  switch (variant) {
-    case "Default":
-      return { font: "text3", background: "transparent" };
-    case "Overlay":
-      return { font: "text5", background: "surface4" };
-  }
-}
-function sizeToProps2(size) {
-  switch (size) {
-    case "XS":
-      return {
-        width: 20,
-        height: 20
-      };
-    case "S":
-      return {
-        width: 32,
-        height: 32
-      };
-    case "M":
-      return {
-        width: 40,
-        height: 40
-      };
-  }
-}
-function validateIconSize(size, icon) {
-  let requiredIconSize;
-  switch (size) {
-    case "XS":
-      requiredIconSize = "16";
-      break;
-    case "S":
-    case "M":
-      requiredIconSize = "24";
-      break;
-  }
-  const result = /^\d*/u.exec(icon);
-  if (result == null) {
-    throw new Error("Invalid icon name");
-  }
-  const [iconSize] = result;
-  if (iconSize !== requiredIconSize) {
-    console.warn(
-      `IconButton with size "${size}" expect icon size "${requiredIconSize}, but got "${iconSize}"`
-    );
-  }
-}
-
-// src/components/Radio/index.tsx
-import React5, { useCallback, useContext as useContext2 } from "react";
-import styled5 from "styled-components";
-import warning from "warning";
-import { px } from "@charcoal-ui/utils";
-function Radio({
-  value,
-  forceChecked = false,
-  disabled = false,
-  children
-}) {
-  const {
-    name,
-    selected,
-    disabled: isParentDisabled,
-    readonly,
-    hasError,
-    onChange
-  } = useContext2(RadioGroupContext);
-  warning(
-    name !== void 0,
-    `"name" is not Provided for <Radio>. Perhaps you forgot to wrap with <RadioGroup> ?`
-  );
-  const isSelected = value === selected;
-  const isDisabled = disabled || isParentDisabled;
-  const isReadonly = readonly && !isSelected;
-  const handleChange = useCallback(
-    (e) => {
-      onChange(e.currentTarget.value);
-    },
-    [onChange]
-  );
-  return /* @__PURE__ */ React5.createElement(RadioRoot, { "aria-disabled": isDisabled || isReadonly }, /* @__PURE__ */ React5.createElement(
-    RadioInput,
-    {
-      name,
-      value,
-      checked: forceChecked || isSelected,
-      hasError,
-      onChange: handleChange,
-      disabled: isDisabled || isReadonly
-    }
-  ), children != null && /* @__PURE__ */ React5.createElement(RadioLabel, null, children));
-}
-var RadioRoot = styled5.label`
-  display: grid;
-  grid-template-columns: auto 1fr;
-  grid-gap: ${({ theme: theme4 }) => px(theme4.spacing[4])};
-  align-items: center;
-  cursor: pointer;
-
-  ${theme((o) => [o.disabled])}
-`;
-var RadioInput = styled5.input.attrs({ type: "radio" })`
-  /** Make prior to browser default style */
-  &[type='radio'] {
-    appearance: none;
-    display: block;
-    box-sizing: border-box;
-
-    margin: 0;
-    padding: 6px;
-
-    width: 20px;
-    height: 20px;
-
-    ${({ hasError = false }) => theme((o) => [
-  o.borderRadius("oval"),
-  o.bg.surface1.hover.press,
-  hasError && o.outline.assertive
-])};
-
-    &:not(:checked) {
-      border-width: 2px;
-      border-style: solid;
-      border-color: ${({ theme: theme4 }) => theme4.color.text3};
-    }
-
-    &:checked {
-      ${theme((o) => o.bg.brand.hover.press)}
-
-      &::after {
-        content: '';
-        display: block;
-        width: 8px;
-        height: 8px;
-        pointer-events: none;
-
-        ${theme((o) => [o.bg.text5.hover.press, o.borderRadius("oval")])}
-      }
-    }
-
-    ${theme((o) => o.outline.default.focus)}
-  }
-`;
-var RadioLabel = styled5.div`
-  ${theme((o) => [o.typography(14), o.font.text2])}
-`;
-var StyledRadioGroup = styled5.div`
-  display: grid;
-  grid-template-columns: 1fr;
-  grid-gap: ${({ theme: theme4 }) => px(theme4.spacing[8])};
-`;
-var RadioGroupContext = React5.createContext({
-  name: void 0,
-  selected: void 0,
-  disabled: false,
-  readonly: false,
-  hasError: false,
-  onChange() {
-    throw new Error(
-      "Cannot find onChange() handler. Perhaps you forgot to wrap with <RadioGroup> ?"
-    );
-  }
-});
-function RadioGroup({
-  className,
-  value,
-  label,
-  name,
-  onChange,
-  disabled,
-  readonly,
-  hasError,
-  children
-}) {
-  const handleChange = useCallback(
-    (next) => {
-      onChange(next);
-    },
-    [onChange]
-  );
-  return /* @__PURE__ */ React5.createElement(
-    RadioGroupContext.Provider,
-    {
-      value: {
-        name,
-        selected: value,
-        disabled: disabled ?? false,
-        readonly: readonly ?? false,
-        hasError: hasError ?? false,
-        onChange: handleChange
-      }
-    },
-    /* @__PURE__ */ React5.createElement(
-      StyledRadioGroup,
-      {
-        role: "radiogroup",
-        "aria-orientation": "vertical",
-        "aria-label": label,
-        "aria-invalid": hasError,
-        className
-      },
-      children
-    )
-  );
-}
-
-// src/components/MultiSelect/index.tsx
-import React6, { useCallback as useCallback2, useContext as useContext3 } from "react";
-import styled6, { css as css2 } from "styled-components";
-import warning2 from "warning";
-import { disabledSelector as disabledSelector2, px as px2 } from "@charcoal-ui/utils";
-
-// src/components/MultiSelect/context.ts
-import { createContext } from "react";
-var MultiSelectGroupContext = createContext({
-  name: void 0,
-  selected: [],
-  disabled: false,
-  readonly: false,
-  hasError: false,
-  onChange() {
-    throw new Error(
-      "Cannot find `onChange()` handler. Perhaps you forgot to wrap it with `<MultiSelectGroup />` ?"
-    );
-  }
-});
-
-// src/components/MultiSelect/index.tsx
-function MultiSelect({
-  value,
-  forceChecked = false,
-  disabled = false,
-  onChange,
-  variant = "default",
-  children
-}) {
-  const {
-    name,
-    selected,
-    disabled: parentDisabled,
-    readonly,
-    hasError,
-    onChange: parentOnChange
-  } = useContext3(MultiSelectGroupContext);
-  warning2(
-    name !== void 0,
-    `"name" is not Provided for <MultiSelect>. Perhaps you forgot to wrap with <MultiSelectGroup> ?`
-  );
-  const isSelected = selected.includes(value) || forceChecked;
-  const isDisabled = disabled || parentDisabled || readonly;
-  const handleChange = useCallback2(
-    (event) => {
-      if (!(event.currentTarget instanceof HTMLInputElement)) {
-        return;
-      }
-      if (onChange)
-        onChange({ value, selected: event.currentTarget.checked });
-      parentOnChange({ value, selected: event.currentTarget.checked });
-    },
-    [onChange, parentOnChange, value]
-  );
-  return /* @__PURE__ */ React6.createElement(MultiSelectRoot, { "aria-disabled": isDisabled }, /* @__PURE__ */ React6.createElement(
-    MultiSelectInput,
-    {
-      ...{
-        name,
-        value,
-        hasError
-      },
-      checked: isSelected,
-      disabled: isDisabled,
-      onChange: handleChange,
-      overlay: variant === "overlay",
-      "aria-invalid": hasError
-    }
-  ), /* @__PURE__ */ React6.createElement(
-    MultiSelectInputOverlay,
-    {
-      overlay: variant === "overlay",
-      hasError,
-      "aria-hidden": true
-    },
-    /* @__PURE__ */ React6.createElement("pixiv-icon", { name: "24/Check", "unsafe-non-guideline-scale": 16 / 24 })
-  ), Boolean(children) && /* @__PURE__ */ React6.createElement(MultiSelectLabel, null, children));
-}
-var MultiSelectRoot = styled6.label`
-  display: grid;
-  grid-template-columns: auto 1fr;
-  align-items: center;
-  position: relative;
-  cursor: pointer;
-  ${disabledSelector2} {
-    cursor: default;
-  }
-  gap: ${({ theme: theme4 }) => px2(theme4.spacing[4])};
-  ${theme((o) => o.disabled)}
-`;
-var MultiSelectLabel = styled6.div`
-  display: flex;
-  align-items: center;
-  ${theme((o) => [o.typography(14), o.font.text2])}
-`;
-var MultiSelectInput = styled6.input.attrs({ type: "checkbox" })`
-  &[type='checkbox'] {
-    appearance: none;
-    display: block;
-    width: 20px;
-    height: 20px;
-    margin: 0;
-
-    &:checked {
-      ${theme((o) => o.bg.brand.hover.press)}
-    }
-
-    ${({ hasError, overlay }) => theme((o) => [
-  o.bg.text3.hover.press,
-  o.borderRadius("oval"),
-  hasError && !overlay && o.outline.assertive,
-  overlay && o.bg.surface4
-])};
-  }
-`;
-var MultiSelectInputOverlay = styled6.div`
-  position: absolute;
-  top: -2px;
-  left: -2px;
-  box-sizing: border-box;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-
-  ${({ hasError, overlay }) => theme((o) => [
-  o.width.px(24),
-  o.height.px(24),
-  o.borderRadius("oval"),
-  o.font.text5,
-  hasError && overlay && o.outline.assertive
-])}
-
-  ${({ overlay }) => overlay && css2`
-      border-color: ${({ theme: theme4 }) => theme4.color.text5};
-      border-width: 2px;
-      border-style: solid;
-    `}
-`;
-function MultiSelectGroup({
-  className,
-  name,
-  ariaLabel,
-  selected,
-  onChange,
-  disabled = false,
-  readonly = false,
-  hasError = false,
-  children
-}) {
-  const handleChange = useCallback2(
-    (payload) => {
-      const index = selected.indexOf(payload.value);
-      if (payload.selected) {
-        if (index < 0) {
-          onChange([...selected, payload.value]);
-        }
-      } else {
-        if (index >= 0) {
-          onChange([...selected.slice(0, index), ...selected.slice(index + 1)]);
-        }
-      }
-    },
-    [onChange, selected]
-  );
-  return /* @__PURE__ */ React6.createElement(
-    MultiSelectGroupContext.Provider,
-    {
-      value: {
-        name,
-        selected: Array.from(new Set(selected)),
-        disabled,
-        readonly,
-        hasError,
-        onChange: handleChange
-      }
-    },
-    /* @__PURE__ */ React6.createElement(
-      "div",
-      {
-        className,
-        "aria-label": ariaLabel,
-        "data-testid": "SelectGroup"
-      },
-      children
-    )
-  );
-}
-
-// src/components/Switch/index.tsx
-import { useSwitch } from "@react-aria/switch";
-import React7, { useRef, useMemo } from "react";
-import { useToggleState } from "react-stately";
-import styled7 from "styled-components";
-import { disabledSelector as disabledSelector3, px as px3 } from "@charcoal-ui/utils";
-function SwitchCheckbox(props) {
-  const { disabled, className } = props;
-  const ariaSwitchProps = useMemo(
-    () => ({
-      ...props,
-      "aria-label": "children" in props ? void 0 : props.label,
-      isDisabled: props.disabled,
-      isSelected: props.checked
-    }),
-    [props]
-  );
-  const state = useToggleState(ariaSwitchProps);
-  const ref = useRef(null);
-  const {
-    inputProps: { className: _className, type: _type, ...rest }
-  } = useSwitch(ariaSwitchProps, state, ref);
-  return /* @__PURE__ */ React7.createElement(Label, { className, "aria-disabled": disabled }, /* @__PURE__ */ React7.createElement(SwitchInput, { ...rest, ref }), "children" in props ? /* @__PURE__ */ React7.createElement(LabelInner, null, props.children) : void 0);
-}
-var Label = styled7.label`
-  display: inline-grid;
-  grid-template-columns: auto 1fr;
-  align-items: center;
-  gap: ${({ theme: theme4 }) => px3(theme4.spacing[4])};
-  cursor: pointer;
-  outline: 0;
-
-  ${theme((o) => o.disabled)}
-
-  ${disabledSelector3} {
-    cursor: default;
-  }
-`;
-var LabelInner = styled7.div`
-  ${theme((o) => [o.typography(14), o.font.text2])}
-`;
-var SwitchInput = styled7.input.attrs({
-  type: "checkbox"
-})`
-  &[type='checkbox'] {
-    appearance: none;
-    display: inline-flex;
-    position: relative;
-    box-sizing: border-box;
-    width: 28px;
-    border: 2px solid transparent;
-    transition: box-shadow 0.2s, background-color 0.2s;
-    cursor: inherit;
-    ${theme((o) => [
-  o.borderRadius(16),
-  o.height.px(16),
-  o.bg.text4.hover.press,
-  o.outline.default.focus
-])}
-
-    &::after {
-      content: '';
-      position: absolute;
-      display: block;
-      top: 0;
-      left: 0;
-      width: 12px;
-      height: 12px;
-      transform: translateX(0);
-      transition: transform 0.2s;
-      ${theme((o) => [o.bg.text5.hover.press, o.borderRadius("oval")])}
-    }
-
-    &:checked {
-      ${theme((o) => o.bg.brand.hover.press)}
-
-      &::after {
-        transform: translateX(12px);
-      }
-    }
-  }
-`;
-
-// src/components/TextField/index.tsx
-import { useTextField } from "@react-aria/textfield";
-import { useVisuallyHidden } from "@react-aria/visually-hidden";
-import React9, {
-  useCallback as useCallback3,
-  useEffect,
-  useRef as useRef2,
-  useState
-} from "react";
-import styled9, { css as css3 } from "styled-components";
-
-// src/components/FieldLabel/index.tsx
-import React8 from "react";
-import styled8 from "styled-components";
-import { createTheme as createTheme2 } from "@charcoal-ui/styled";
-var FieldLabel = React8.forwardRef(
-  function FieldLabel2({
-    style,
-    className,
-    label,
-    required = false,
-    requiredText,
-    subLabel,
-    ...labelProps
-  }, ref) {
-    return /* @__PURE__ */ React8.createElement(FieldLabelWrapper, { style, className }, /* @__PURE__ */ React8.createElement(Label2, { ref, ...labelProps }, label), required && /* @__PURE__ */ React8.createElement(RequiredText, null, requiredText), /* @__PURE__ */ React8.createElement(SubLabelClickable, null, /* @__PURE__ */ React8.createElement("span", null, subLabel)));
-  }
-);
-var FieldLabel_default = FieldLabel;
-var theme2 = createTheme2(styled8);
-var Label2 = styled8.label`
-  ${theme2((o) => [o.typography(14).bold, o.font.text1])}
-`;
-var RequiredText = styled8.span`
-  ${theme2((o) => [o.typography(14), o.font.text3])}
-`;
-var SubLabelClickable = styled8.div`
-  ${theme2((o) => [
-  o.typography(14),
-  o.font.text3.hover.press,
-  o.outline.default.focus
-])}
-`;
-var FieldLabelWrapper = styled8.div`
-  display: inline-flex;
-  align-items: center;
-
-  > ${RequiredText} {
-    ${theme2((o) => o.margin.left(4))}
-  }
-
-  > ${SubLabelClickable} {
-    ${theme2((o) => o.margin.left("auto"))}
-  }
-`;
-
-// src/components/TextField/index.tsx
-import { createTheme as createTheme3 } from "@charcoal-ui/styled";
-var theme3 = createTheme3(styled9);
-function mergeRefs(...refs) {
-  return (value) => {
-    for (const ref of refs) {
-      if (typeof ref === "function") {
-        ref(value);
-      } else if (ref !== null) {
-        ;
-        ref.current = value;
-      }
-    }
-  };
-}
-function countCodePointsInString(string) {
-  return Array.from(string).length;
-}
-var TextField = React9.forwardRef(
-  function TextField2(props, ref) {
-    return props.multiline !== void 0 && props.multiline ? /* @__PURE__ */ React9.createElement(MultiLineTextField, { ref, ...props }) : /* @__PURE__ */ React9.createElement(SingleLineTextField, { ref, ...props });
-  }
-);
-var TextField_default = TextField;
-var SingleLineTextField = React9.forwardRef(function SingleLineTextFieldInner({ onChange, ...props }, forwardRef4) {
-  const {
-    className,
-    showLabel = false,
-    showCount = false,
-    label,
-    requiredText,
-    subLabel,
-    disabled = false,
-    required,
-    invalid = false,
-    assistiveText,
-    maxLength,
-    prefix = null,
-    suffix = null
-  } = props;
-  const { visuallyHiddenProps } = useVisuallyHidden();
-  const ariaRef = useRef2(null);
-  const prefixRef = useRef2(null);
-  const suffixRef = useRef2(null);
-  const [count, setCount] = useState(countCodePointsInString(props.value ?? ""));
-  const [prefixWidth, setPrefixWidth] = useState(0);
-  const [suffixWidth, setSuffixWidth] = useState(0);
-  const nonControlled = props.value === void 0;
-  const handleChange = useCallback3(
-    (value) => {
-      const count2 = countCodePointsInString(value);
-      if (maxLength !== void 0 && count2 > maxLength) {
-        return;
-      }
-      if (nonControlled) {
-        setCount(count2);
-      }
-      onChange?.(value);
-    },
-    [maxLength, nonControlled, onChange]
-  );
-  useEffect(() => {
-    setCount(countCodePointsInString(props.value ?? ""));
-  }, [props.value]);
-  const { inputProps, labelProps, descriptionProps, errorMessageProps } = useTextField(
-    {
-      inputElementType: "input",
-      isDisabled: disabled,
-      isRequired: required,
-      validationState: invalid ? "invalid" : "valid",
-      description: !invalid && assistiveText,
-      errorMessage: invalid && assistiveText,
-      onChange: handleChange,
-      ...props
-    },
-    ariaRef
-  );
-  useEffect(() => {
-    const prefixObserver = new ResizeObserver((entries) => {
-      setPrefixWidth(entries[0].contentRect.width);
-    });
-    const suffixObserver = new ResizeObserver((entries) => {
-      setSuffixWidth(entries[0].contentRect.width);
-    });
-    if (prefixRef.current !== null) {
-      prefixObserver.observe(prefixRef.current);
-    }
-    if (suffixRef.current !== null) {
-      suffixObserver.observe(suffixRef.current);
-    }
-    return () => {
-      suffixObserver.disconnect();
-      prefixObserver.disconnect();
-    };
-  }, []);
-  return /* @__PURE__ */ React9.createElement(TextFieldRoot, { className, isDisabled: disabled }, /* @__PURE__ */ React9.createElement(
-    TextFieldLabel,
-    {
-      label,
-      requiredText,
-      required,
-      subLabel,
-      ...labelProps,
-      ...!showLabel ? visuallyHiddenProps : {}
-    }
-  ), /* @__PURE__ */ React9.createElement(StyledInputContainer, null, /* @__PURE__ */ React9.createElement(PrefixContainer, { ref: prefixRef }, /* @__PURE__ */ React9.createElement(Affix, null, prefix)), /* @__PURE__ */ React9.createElement(
-    StyledInput,
-    {
-      ref: mergeRefs(forwardRef4, ariaRef),
-      invalid,
-      extraLeftPadding: prefixWidth,
-      extraRightPadding: suffixWidth,
-      ...inputProps
-    }
-  ), /* @__PURE__ */ React9.createElement(SuffixContainer, { ref: suffixRef }, /* @__PURE__ */ React9.createElement(Affix, null, suffix), showCount && /* @__PURE__ */ React9.createElement(SingleLineCounter, null, maxLength !== void 0 ? `${count}/${maxLength}` : count))), assistiveText != null && assistiveText.length !== 0 && /* @__PURE__ */ React9.createElement(
-    AssistiveText,
-    {
-      invalid,
-      ...invalid ? errorMessageProps : descriptionProps
-    },
-    assistiveText
-  ));
-});
-var MultiLineTextField = React9.forwardRef(function MultiLineTextFieldInner({ onChange, ...props }, forwardRef4) {
-  const {
-    className,
-    showCount = false,
-    showLabel = false,
-    label,
-    requiredText,
-    subLabel,
-    disabled = false,
-    required,
-    invalid = false,
-    assistiveText,
-    maxLength,
-    autoHeight = false,
-    rows: initialRows = 4
-  } = props;
-  const { visuallyHiddenProps } = useVisuallyHidden();
-  const textareaRef = useRef2(null);
-  const ariaRef = useRef2(null);
-  const [count, setCount] = useState(countCodePointsInString(props.value ?? ""));
-  const [rows, setRows] = useState(initialRows);
-  const syncHeight = useCallback3(
-    (textarea) => {
-      const rows2 = (`${textarea.value}
-`.match(/\n/gu)?.length ?? 0) || 1;
-      setRows(initialRows <= rows2 ? rows2 : initialRows);
-    },
-    [initialRows]
-  );
-  const nonControlled = props.value === void 0;
-  const handleChange = useCallback3(
-    (value) => {
-      const count2 = countCodePointsInString(value);
-      if (maxLength !== void 0 && count2 > maxLength) {
-        return;
-      }
-      if (nonControlled) {
-        setCount(count2);
-      }
-      if (autoHeight && textareaRef.current !== null) {
-        syncHeight(textareaRef.current);
-      }
-      onChange?.(value);
-    },
-    [autoHeight, maxLength, nonControlled, onChange, syncHeight]
-  );
-  useEffect(() => {
-    setCount(countCodePointsInString(props.value ?? ""));
-  }, [props.value]);
-  const { inputProps, labelProps, descriptionProps, errorMessageProps } = useTextField(
-    {
-      inputElementType: "textarea",
-      isDisabled: disabled,
-      isRequired: required,
-      validationState: invalid ? "invalid" : "valid",
-      description: !invalid && assistiveText,
-      errorMessage: invalid && assistiveText,
-      onChange: handleChange,
-      ...props
-    },
-    ariaRef
-  );
-  useEffect(() => {
-    if (autoHeight && textareaRef.current !== null) {
-      syncHeight(textareaRef.current);
-    }
-  }, [autoHeight, syncHeight]);
-  return /* @__PURE__ */ React9.createElement(TextFieldRoot, { className, isDisabled: disabled }, /* @__PURE__ */ React9.createElement(
-    TextFieldLabel,
-    {
-      label,
-      requiredText,
-      required,
-      subLabel,
-      ...labelProps,
-      ...!showLabel ? visuallyHiddenProps : {}
-    }
-  ), /* @__PURE__ */ React9.createElement(
-    StyledTextareaContainer,
-    {
-      invalid,
-      rows: showCount ? rows + 1 : rows
-    },
-    /* @__PURE__ */ React9.createElement(
-      StyledTextarea,
-      {
-        ref: mergeRefs(textareaRef, forwardRef4, ariaRef),
-        rows,
-        noBottomPadding: showCount,
-        ...inputProps
-      }
-    ),
-    showCount && /* @__PURE__ */ React9.createElement(MultiLineCounter, null, maxLength !== void 0 ? `${count}/${maxLength}` : count)
-  ), assistiveText != null && assistiveText.length !== 0 && /* @__PURE__ */ React9.createElement(
-    AssistiveText,
-    {
-      invalid,
-      ...invalid ? errorMessageProps : descriptionProps
-    },
-    assistiveText
-  ));
-});
-var TextFieldRoot = styled9.div`
-  display: flex;
-  flex-direction: column;
-
-  ${(p) => p.isDisabled && { opacity: p.theme.elementEffect.disabled.opacity }}
-`;
-var TextFieldLabel = styled9(FieldLabel_default)`
-  ${theme3((o) => o.margin.bottom(8))}
-`;
-var StyledInputContainer = styled9.div`
-  height: 40px;
-  display: grid;
-  position: relative;
-`;
-var PrefixContainer = styled9.span`
-  position: absolute;
-  top: 50%;
-  left: 8px;
-  transform: translateY(-50%);
-`;
-var SuffixContainer = styled9.span`
-  position: absolute;
-  top: 50%;
-  right: 8px;
-  transform: translateY(-50%);
-
-  display: flex;
-  gap: 8px;
-`;
-var Affix = styled9.span`
-  user-select: none;
-
-  ${theme3((o) => [o.typography(14).preserveHalfLeading, o.font.text2])}
-`;
-var StyledInput = styled9.input`
-  border: none;
-  box-sizing: border-box;
-  outline: none;
-  font-family: inherit;
-
-  /* Prevent zooming for iOS Safari */
-  transform-origin: top left;
-  transform: scale(0.875);
-  width: calc(100% / 0.875);
-  height: calc(100% / 0.875);
-  font-size: calc(14px / 0.875);
-  line-height: calc(22px / 0.875);
-  padding-left: calc((8px + ${(p) => p.extraLeftPadding}px) / 0.875);
-  padding-right: calc((8px + ${(p) => p.extraRightPadding}px) / 0.875);
-  border-radius: calc(4px / 0.875);
-
-  /* Display box-shadow for iOS Safari */
-  appearance: none;
-
-  ${(p) => theme3((o) => [
-  o.bg.surface3.hover,
-  o.outline.default.focus,
-  p.invalid && o.outline.assertive,
-  o.font.text2
-])}
-
-  &::placeholder {
-    ${theme3((o) => o.font.text3)}
-  }
-`;
-var StyledTextareaContainer = styled9.div`
-  position: relative;
-  overflow: hidden;
-  padding: 0 8px;
-
-  ${(p) => theme3((o) => [
-  o.bg.surface3.hover,
-  p.invalid && o.outline.assertive,
-  o.font.text2,
-  o.borderRadius(4)
-])}
-
-  &:focus-within {
-    ${(p) => theme3((o) => p.invalid ? o.outline.assertive : o.outline.default)}
-  }
-
-  ${({ rows }) => css3`
-    height: calc(22px * ${rows} + 18px);
-  `};
-`;
-var StyledTextarea = styled9.textarea`
-  border: none;
-  outline: none;
-  resize: none;
-  font-family: inherit;
-  color: inherit;
-
-  /* Prevent zooming for iOS Safari */
-  transform-origin: top left;
-  transform: scale(0.875);
-  width: calc(100% / 0.875);
-  font-size: calc(14px / 0.875);
-  line-height: calc(22px / 0.875);
-  padding: calc(9px / 0.875) 0 ${(p) => p.noBottomPadding ? 0 : ""};
-
-  ${({ rows = 1 }) => css3`
-    height: calc(22px / 0.875 * ${rows});
-  `};
-
-  /* Display box-shadow for iOS Safari */
-  appearance: none;
-
-  background: none;
-
-  &::placeholder {
-    ${theme3((o) => o.font.text3)}
-  }
-
-  /* Hide scrollbar for Chrome, Safari and Opera */
-  &::-webkit-scrollbar {
-    display: none;
-  }
-  /* Hide scrollbar for IE, Edge and Firefox */
-  -ms-overflow-style: none; /* IE and Edge */
-  scrollbar-width: none; /* Firefox */
-`;
-var SingleLineCounter = styled9.span`
-  ${theme3((o) => [o.typography(14).preserveHalfLeading, o.font.text3])}
-`;
-var MultiLineCounter = styled9.span`
-  position: absolute;
-  bottom: 9px;
-  right: 8px;
-
-  ${theme3((o) => [o.typography(14).preserveHalfLeading, o.font.text3])}
-`;
-var AssistiveText = styled9.p`
-  ${(p) => theme3((o) => [
-  o.typography(14),
-  o.margin.top(8),
-  o.margin.bottom(0),
-  o.font[p.invalid ? "assertive" : "text1"]
-])}
-`;
-
-// src/components/Icon/index.tsx
-import React10 from "react";
-import "@charcoal-ui/icons";
-var Icon = React10.forwardRef(function IconInner({ name, scale, unsafeNonGuidelineScale, className, ...rest }, ref) {
-  return /* @__PURE__ */ React10.createElement(
-    "pixiv-icon",
-    {
-      ref,
-      name,
-      scale,
-      "unsafe-non-guideline-scale": unsafeNonGuidelineScale,
-      class: className,
-      ...rest
-    }
-  );
-});
-var Icon_default = Icon;
-
-// src/components/Modal/index.tsx
-import React11, { useContext as useContext4, useRef as useRef3 } from "react";
-import {
-  Overlay,
-  useModalOverlay,
-  useOverlay,
-  usePreventScroll
-} from "@react-aria/overlays";
-import styled10, { css as css4, useTheme } from "styled-components";
-import { FocusScope } from "@react-aria/focus";
-import { useDialog } from "@react-aria/dialog";
-
-// ../foundation/src/grid.ts
-var COLUMN_UNIT = 80;
-var GUTTER_UNIT = 24;
-function columnSystem(span, column, gutter) {
-  return span * column + (span - 1) * gutter;
-}
-
-// src/components/Modal/index.tsx
-import { maxWidth } from "@charcoal-ui/utils";
-import { useMedia } from "@charcoal-ui/styled";
-import { animated, useTransition, easings } from "react-spring";
-var DEFAULT_Z_INDEX = 10;
-function Modal({
-  children,
-  zIndex = DEFAULT_Z_INDEX,
-  portalContainer,
-  ...props
-}) {
-  const {
-    title,
-    size = "M",
-    bottomSheet = false,
-    isDismissable,
-    onClose,
-    isOpen = false
-  } = props;
-  const ref = useRef3(null);
-  const { overlayProps, underlayProps } = useOverlay(props, ref);
-  usePreventScroll();
-  const { modalProps } = useModalOverlay(
-    props,
-    {
-      close: onClose,
-      isOpen,
-      open: () => {
-      },
-      setOpen: () => {
-      },
-      toggle: () => {
-      }
-    },
-    ref
-  );
-  const { dialogProps, titleProps } = useDialog(props, ref);
-  const theme4 = useTheme();
-  const isMobile = useMedia(maxWidth(theme4.breakpoint.screen1)) ?? false;
-  const transitionEnabled = isMobile && bottomSheet !== false;
-  const 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 }
-  });
-  const showDismiss = !isMobile || bottomSheet !== true;
-  return transition(
-    ({ backgroundColor, transform }, item) => item && /* @__PURE__ */ React11.createElement(Overlay, null, /* @__PURE__ */ React11.createElement(
-      ModalBackground,
-      {
-        zIndex,
-        ...underlayProps,
-        style: transitionEnabled ? { backgroundColor } : {}
-      },
-      /* @__PURE__ */ React11.createElement(FocusScope, { contain: true, restoreFocus: true, autoFocus: true }, /* @__PURE__ */ React11.createElement(
-        ModalDialog,
-        {
-          ref,
-          ...overlayProps,
-          ...modalProps,
-          ...dialogProps,
-          style: transitionEnabled ? { transform } : {},
-          size,
-          bottomSheet
-        },
-        /* @__PURE__ */ React11.createElement(
-          ModalContext.Provider,
-          {
-            value: { titleProps, title, close: onClose, showDismiss }
-          },
-          children,
-          isDismissable === true && /* @__PURE__ */ React11.createElement(
-            ModalCrossButton,
-            {
-              size: "S",
-              icon: "24/Close",
-              onClick: onClose
-            }
-          )
-        )
-      ))
-    ))
-  );
-}
-var ModalContext = React11.createContext({
-  titleProps: {},
-  title: "",
-  close: void 0,
-  showDismiss: true
-});
-var ModalBackground = animated(styled10.div`
-  z-index: ${({ zIndex }) => zIndex};
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-
-  ${theme((o) => [o.bg.surface4])}
-`);
-var ModalDialog = animated(styled10.div`
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  width: ${(p) => p.size === "S" ? columnSystem(3, COLUMN_UNIT, GUTTER_UNIT) + GUTTER_UNIT * 2 : p.size === "M" ? columnSystem(4, COLUMN_UNIT, GUTTER_UNIT) + GUTTER_UNIT * 2 : p.size === "L" ? columnSystem(6, COLUMN_UNIT, GUTTER_UNIT) + GUTTER_UNIT * 2 : unreachable(p.size)}px;
-
-  ${theme((o) => [o.bg.background1, o.borderRadius(24)])}
-
-  @media ${({ theme: theme4 }) => maxWidth(theme4.breakpoint.screen1)} {
-    ${(p) => p.bottomSheet === "full" ? css4`
-            top: auto;
-            bottom: 0;
-            left: 0;
-            transform: none;
-            border-radius: 0;
-            width: 100%;
-            height: 100%;
-          ` : p.bottomSheet ? css4`
-            top: auto;
-            bottom: 0;
-            left: 0;
-            transform: none;
-            border-radius: 0;
-            width: 100%;
-          ` : css4`
-            width: calc(100% - 48px);
-          `}
-  }
-`);
-var ModalCrossButton = styled10(IconButton_default)`
-  position: absolute;
-  top: 8px;
-  right: 8px;
-
-  ${theme((o) => [o.font.text3.hover.press])}
-`;
-function ModalTitle(props) {
-  const { titleProps, title } = useContext4(ModalContext);
-  return /* @__PURE__ */ React11.createElement(ModalHeading, { ...titleProps, ...props }, title);
-}
-var ModalHeading = styled10.h3`
-  margin: 0;
-  font-weight: inherit;
-  font-size: inherit;
-`;
-
-// src/components/Modal/ModalPlumbing.tsx
-import React12 from "react";
-import styled11 from "styled-components";
-import { maxWidth as maxWidth2 } from "@charcoal-ui/utils";
-function ModalHeader() {
-  return /* @__PURE__ */ React12.createElement(ModalHeaderRoot, null, /* @__PURE__ */ React12.createElement(StyledModalTitle, null));
-}
-var ModalHeaderRoot = styled11.div`
-  height: 64px;
-  display: grid;
-  align-content: center;
-  justify-content: center;
-`;
-var StyledModalTitle = styled11(ModalTitle)`
-  ${theme((o) => [o.font.text1, o.typography(16).bold])}
-`;
-var ModalAlign = styled11.div`
-  ${theme((o) => [o.padding.horizontal(24)])}
-
-  @media ${({ theme: theme4 }) => maxWidth2(theme4.breakpoint.screen1)} {
-    ${theme((o) => [o.padding.horizontal(16)])}
-  }
-`;
-var ModalBody = styled11.div`
-  ${theme((o) => [o.padding.bottom(40)])}
-`;
-var ModalButtons = styled11.div`
-  display: grid;
-  grid-auto-flow: row;
-  grid-row-gap: 8px;
-  ${theme((o) => [o.padding.horizontal(24).top(16)])}
-
-  @media ${({ theme: theme4 }) => maxWidth2(theme4.breakpoint.screen1)} {
-    ${theme((o) => [o.padding.horizontal(16)])}
-  }
-`;
-
-// src/components/LoadingSpinner/index.tsx
-import React13, { useImperativeHandle, useRef as useRef4 } from "react";
-import styled12, { keyframes } from "styled-components";
-function LoadingSpinner({
-  size = 48,
-  padding = 16,
-  transparent = false
-}) {
-  return /* @__PURE__ */ React13.createElement(LoadingSpinnerRoot, { size, padding, transparent }, /* @__PURE__ */ React13.createElement(LoadingSpinnerIcon, null));
-}
-var LoadingSpinnerRoot = styled12.div.attrs({ role: "progressbar" })`
-  margin: auto;
-  padding: ${(props) => props.padding}px;
-  border-radius: 8px;
-  font-size: ${(props) => props.size}px;
-  width: ${(props) => props.size}px;
-  height: ${(props) => props.size}px;
-  opacity: 0.84;
-  ${({ transparent }) => theme((o) => [
-  o.font.text4,
-  transparent ? o.bg.transparent : o.bg.background1
-])}
-`;
-var scaleout = keyframes`
-  from {
-    transform: scale(0);
-    opacity: 1;
-  }
-
-  to {
-    transform: scale(1);
-    opacity: 0;
-  }
-`;
-var Icon2 = styled12.div.attrs({ role: "presentation" })`
-  width: 1em;
-  height: 1em;
-  border-radius: 1em;
-  background-color: currentColor;
-  animation: ${scaleout} 1s both ease-out;
-  animation-iteration-count: ${(p) => p.once ? 1 : "infinite"};
-
-  &[data-reset-animation] {
-    animation: none;
-  }
-`;
-var LoadingSpinnerIcon = React13.forwardRef(function LoadingSpinnerIcon2({ once = false }, ref) {
-  const iconRef = useRef4(null);
-  useImperativeHandle(ref, () => ({
-    restart: () => {
-      if (!iconRef.current) {
-        return;
-      }
-      iconRef.current.dataset.resetAnimation = "true";
-      void iconRef.current.offsetWidth;
-      delete iconRef.current.dataset.resetAnimation;
-    }
-  }));
-  return /* @__PURE__ */ React13.createElement(Icon2, { ref: iconRef, once });
-});
-
-// src/components/DropdownSelector/index.tsx
-import React16, { useMemo as useMemo4, useRef as useRef7 } from "react";
-import styled14 from "styled-components";
-import { Item, useSelectState } from "react-stately";
-import { disabledSelector as disabledSelector4 } from "@charcoal-ui/utils";
-import { useVisuallyHidden as useVisuallyHidden2 } from "@react-aria/visually-hidden";
-import { useSelect, HiddenSelect } from "@react-aria/select";
-import { useButton } from "@react-aria/button";
-
-// src/components/DropdownSelector/Listbox.tsx
-import React14, { memo, useRef as useRef5, Fragment, useMemo as useMemo2 } from "react";
-import styled13, { css as css5 } from "styled-components";
-
-// ../../node_modules/@react-aria/utils/dist/module.js
-import $12uGp$react, { useState as $12uGp$useState, useRef as $12uGp$useRef, useCallback as $12uGp$useCallback, useEffect as $12uGp$useEffect } from "react";
-import { useSSRSafeId as $12uGp$useSSRSafeId } from "@react-aria/ssr";
-
-// ../../node_modules/clsx/dist/clsx.m.js
-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 clsx_m_default() {
-  var i = 0, tmp, x, str = "";
-  while (i < arguments.length) {
-    if (tmp = arguments[i++]) {
-      if (x = toVal(tmp)) {
-        str && (str += " ");
-        str += x;
-      }
-    }
-  }
-  return str;
-}
-
-// ../../node_modules/@react-aria/utils/dist/module.js
-var $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c = typeof window !== "undefined" ? $12uGp$react.useLayoutEffect : () => {
-};
-var $bdb11010cef70236$var$idsUpdaterMap = /* @__PURE__ */ new Map();
-function $bdb11010cef70236$export$f680877a34711e37(defaultId) {
-  let [value, setValue] = $12uGp$useState(defaultId);
-  let nextId = $12uGp$useRef(null);
-  let res = $12uGp$useSSRSafeId(value);
-  let updateValue = $12uGp$useCallback((val) => {
-    nextId.current = val;
-  }, []);
-  $bdb11010cef70236$var$idsUpdaterMap.set(res, updateValue);
-  $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c(() => {
-    let r = res;
-    return () => {
-      $bdb11010cef70236$var$idsUpdaterMap.delete(r);
-    };
-  }, [
-    res
-  ]);
-  $12uGp$useEffect(() => {
-    let newId = nextId.current;
-    if (newId) {
-      nextId.current = null;
-      setValue(newId);
-    }
-  });
-  return res;
-}
-function $bdb11010cef70236$export$cd8c9cb68f842629(idA, idB) {
-  if (idA === idB)
-    return idA;
-  let setIdA = $bdb11010cef70236$var$idsUpdaterMap.get(idA);
-  if (setIdA) {
-    setIdA(idB);
-    return idB;
-  }
-  let setIdB = $bdb11010cef70236$var$idsUpdaterMap.get(idB);
-  if (setIdB) {
-    setIdB(idA);
-    return idA;
-  }
-  return idB;
-}
-function $bdb11010cef70236$export$b4cc09c592e8fdb8(depArray = []) {
-  let id = $bdb11010cef70236$export$f680877a34711e37();
-  let [resolvedId, setResolvedId] = $1dbecbe27a04f9af$export$14d238f342723f25(id);
-  let updateId = $12uGp$useCallback(() => {
-    setResolvedId(function* () {
-      yield id;
-      yield document.getElementById(id) ? id : void 0;
-    });
-  }, [
-    id,
-    setResolvedId
-  ]);
-  $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c(updateId, [
-    id,
-    updateId,
-    ...depArray
-  ]);
-  return resolvedId;
-}
-function $ff5963eb1fccf552$export$e08e3b67e392101e(...callbacks) {
-  return (...args) => {
-    for (let callback of callbacks)
-      if (typeof callback === "function")
-        callback(...args);
-  };
-}
-function $3ef42575df84b30b$export$9d1611c77c2fe928(...args) {
-  let result = {
-    ...args[0]
-  };
-  for (let i = 1; i < args.length; i++) {
-    let props = args[i];
-    for (let key in props) {
-      let a = result[key];
-      let b = props[key];
-      if (typeof a === "function" && typeof b === "function" && key[0] === "o" && key[1] === "n" && key.charCodeAt(2) >= 65 && key.charCodeAt(2) <= 90)
-        result[key] = $ff5963eb1fccf552$export$e08e3b67e392101e(a, b);
-      else if ((key === "className" || key === "UNSAFE_className") && typeof a === "string" && typeof b === "string")
-        result[key] = clsx_m_default(a, b);
-      else if (key === "id" && a && b)
-        result.id = $bdb11010cef70236$export$cd8c9cb68f842629(a, b);
-      else
-        result[key] = b !== void 0 ? b : a;
-    }
-  }
-  return result;
-}
-var $65484d02dcb7eb3e$var$DOMPropNames = /* @__PURE__ */ new Set([
-  "id"
-]);
-var $65484d02dcb7eb3e$var$labelablePropNames = /* @__PURE__ */ new Set([
-  "aria-label",
-  "aria-labelledby",
-  "aria-describedby",
-  "aria-details"
-]);
-var $65484d02dcb7eb3e$var$propRe = /^(data-.*)$/;
-function $65484d02dcb7eb3e$export$457c3d6518dd4c6f(props, opts = {}) {
-  let { labelable, propNames } = opts;
-  let filteredProps = {};
-  for (const 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 {
-    let 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) {
-    }
-  }
-  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 (let { element, scrollTop, scrollLeft } of scrollableElements) {
-    element.scrollTop = scrollTop;
-    element.scrollLeft = scrollLeft;
-  }
-}
-var $bbed8b41f857bcc0$var$transitionsByElement = /* @__PURE__ */ new Map();
-var $bbed8b41f857bcc0$var$transitionCallbacks = /* @__PURE__ */ new Set();
-function $bbed8b41f857bcc0$var$setupGlobalEvents() {
-  if (typeof window === "undefined")
-    return;
-  let onTransitionStart = (e) => {
-    let transitions = $bbed8b41f857bcc0$var$transitionsByElement.get(e.target);
-    if (!transitions) {
-      transitions = /* @__PURE__ */ new Set();
-      $bbed8b41f857bcc0$var$transitionsByElement.set(e.target, transitions);
-      e.target.addEventListener("transitioncancel", onTransitionEnd);
-    }
-    transitions.add(e.propertyName);
-  };
-  let onTransitionEnd = (e) => {
-    let properties = $bbed8b41f857bcc0$var$transitionsByElement.get(e.target);
-    if (!properties)
-      return;
-    properties.delete(e.propertyName);
-    if (properties.size === 0) {
-      e.target.removeEventListener("transitioncancel", onTransitionEnd);
-      $bbed8b41f857bcc0$var$transitionsByElement.delete(e.target);
-    }
-    if ($bbed8b41f857bcc0$var$transitionsByElement.size === 0) {
-      for (let cb of $bbed8b41f857bcc0$var$transitionCallbacks)
-        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) {
-  requestAnimationFrame(() => {
-    if ($bbed8b41f857bcc0$var$transitionsByElement.size === 0)
-      fn();
-    else
-      $bbed8b41f857bcc0$var$transitionCallbacks.add(fn);
-  });
-}
-function $03deb23ff14920c4$export$4eaf04e54aa8eed6() {
-  let globalListeners = $12uGp$useRef(/* @__PURE__ */ new Map());
-  let addGlobalListener = $12uGp$useCallback((eventTarget, type, listener, options) => {
-    let fn = (options === null || options === void 0 ? void 0 : options.once) ? (...args) => {
-      globalListeners.current.delete(listener);
-      listener(...args);
-    } : listener;
-    globalListeners.current.set(listener, {
-      type,
-      eventTarget,
-      fn,
-      options
-    });
-    eventTarget.addEventListener(type, listener, options);
-  }, []);
-  let removeGlobalListener = $12uGp$useCallback((eventTarget, type, listener, options) => {
-    var ref;
-    let fn = ((ref = globalListeners.current.get(listener)) === null || ref === void 0 ? void 0 : ref.fn) || listener;
-    eventTarget.removeEventListener(type, fn, options);
-    globalListeners.current.delete(listener);
-  }, []);
-  let removeAllGlobalListeners = $12uGp$useCallback(() => {
-    globalListeners.current.forEach((value, key) => {
-      removeGlobalListener(value.eventTarget, value.type, key, value.options);
-    });
-  }, [
-    removeGlobalListener
-  ]);
-  $12uGp$useEffect(() => {
-    return removeAllGlobalListeners;
-  }, [
-    removeAllGlobalListeners
-  ]);
-  return {
-    addGlobalListener,
-    removeGlobalListener,
-    removeAllGlobalListeners
-  };
-}
-function $313b98861ee5dd6c$export$d6875122194c7b44(props, defaultLabel) {
-  let { id, "aria-label": label, "aria-labelledby": labelledBy } = props;
-  id = $bdb11010cef70236$export$f680877a34711e37(id);
-  if (labelledBy && label) {
-    let ids = /* @__PURE__ */ new Set([
-      ...labelledBy.trim().split(/\s+/),
-      id
-    ]);
-    labelledBy = [
-      ...ids
-    ].join(" ");
-  } else if (labelledBy)
-    labelledBy = labelledBy.trim().split(/\s+/).join(" ");
-  if (!label && !labelledBy && defaultLabel)
-    label = defaultLabel;
-  return {
-    id,
-    "aria-label": label,
-    "aria-labelledby": labelledBy
-  };
-}
-function $df56164dff5785e2$export$4338b53315abf666(forwardedRef) {
-  const objRef = $12uGp$useRef();
-  $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c(() => {
-    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(() => {
-    if (context && context.ref && ref) {
-      context.ref.current = ref.current;
-      return () => {
-        context.ref.current = null;
-      };
-    }
-  }, [
-    context,
-    ref
-  ]);
-}
-var $5df64b3807dc15ee$var$visualViewport = typeof window !== "undefined" && window.visualViewport;
-var $ef06256079686ba0$var$descriptionId = 0;
-var $ef06256079686ba0$var$descriptionNodes = /* @__PURE__ */ new Map();
-function $ef06256079686ba0$export$f8aeda7b10753fa1(description) {
-  let [id1, setId] = $12uGp$useState(void 0);
-  $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c(() => {
-    if (!description)
-      return;
-    let desc = $ef06256079686ba0$var$descriptionNodes.get(description);
-    if (!desc) {
-      let id = `react-aria-description-${$ef06256079686ba0$var$descriptionId++}`;
-      setId(id);
-      let 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 () => {
-      if (--desc.refCount === 0) {
-        desc.element.remove();
-        $ef06256079686ba0$var$descriptionNodes.delete(description);
-      }
-    };
-  }, [
-    description
-  ]);
-  return {
-    "aria-describedby": description ? id1 : void 0
-  };
-}
-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(
-    (brand) => 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) {
-  let handlerRef = $12uGp$useRef(handler1);
-  handlerRef.current = handler1;
-  let isDisabled = handler1 == null;
-  $12uGp$useEffect(() => {
-    if (isDisabled)
-      return;
-    let element = ref.current;
-    let handler = (e) => handlerRef.current.call(this, e);
-    element.addEventListener(event, handler, options);
-    return () => {
-      element.removeEventListener(event, handler, options);
-    };
-  }, [
-    ref,
-    event,
-    options,
-    isDisabled
-  ]);
-}
-function $1dbecbe27a04f9af$export$14d238f342723f25(defaultValue) {
-  let [value, setValue] = $12uGp$useState(defaultValue);
-  let valueRef = $12uGp$useRef(value);
-  let effect = $12uGp$useRef(null);
-  valueRef.current = value;
-  let nextRef = $12uGp$useRef(null);
-  nextRef.current = () => {
-    let newValue = effect.current.next();
-    if (newValue.done) {
-      effect.current = null;
-      return;
-    }
-    if (value === newValue.value)
-      nextRef.current();
-    else
-      setValue(newValue.value);
-  };
-  $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c(() => {
-    if (effect.current)
-      nextRef.current();
-  });
-  let queue = $12uGp$useCallback((fn) => {
-    effect.current = fn(valueRef.current);
-    nextRef.current();
-  }, [
-    effect,
-    nextRef
-  ]);
-  return [
-    value,
-    queue
-  ];
-}
-function $2f04cbc44ee30ce0$export$53a0910f038337bd(scrollView, element) {
-  let offsetX = $2f04cbc44ee30ce0$var$relativeOffset(scrollView, element, "left");
-  let offsetY = $2f04cbc44ee30ce0$var$relativeOffset(scrollView, element, "top");
-  let width = element.offsetWidth;
-  let height = element.offsetHeight;
-  let x = scrollView.scrollLeft;
-  let y = scrollView.scrollTop;
-  let maxX = x + scrollView.offsetWidth;
-  let 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;
-}
-function $2f04cbc44ee30ce0$var$relativeOffset(ancestor, child, axis) {
-  const prop = axis === "left" ? "offsetLeft" : "offsetTop";
-  let sum = 0;
-  while (child.offsetParent) {
-    sum += child[prop];
-    if (child.offsetParent === ancestor)
-      break;
-    else if (child.offsetParent.contains(ancestor)) {
-      sum -= ancestor[prop];
-      break;
-    }
-    child = child.offsetParent;
-  }
-  return sum;
-}
-function $6a7db85432448f7f$export$60278871457622de(event) {
-  if (event.mozInputSource === 0 && event.isTrusted)
-    return true;
-  if ($c87311424ea30a05$export$a11b0059900ceec8() && event.pointerType)
-    return event.type === "click" && event.buttons === 1;
-  return event.detail === 0 && !event.pointerType;
-}
-function $6a7db85432448f7f$export$29bf1b5f2c56cf63(event) {
-  return event.width === 0 && event.height === 0 || event.width === 1 && event.height === 1 && event.pressure === 0 && event.detail === 0 && event.pointerType === "mouse";
-}
-
-// ../../node_modules/@react-aria/interactions/dist/module.js
-import $bx7SL$react, { useRef as $bx7SL$useRef, useContext as $bx7SL$useContext, useState as $bx7SL$useState, useMemo as $bx7SL$useMemo, useEffect as $bx7SL$useEffect, useCallback as $bx7SL$useCallback } from "react";
-var $14c0b72509d70225$var$state = "default";
-var $14c0b72509d70225$var$savedUserSelect = "";
-var $14c0b72509d70225$var$modifiedElementMap = /* @__PURE__ */ 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) {
-    $14c0b72509d70225$var$modifiedElementMap.set(target, target.style.userSelect);
-    target.style.userSelect = "none";
-  }
-}
-function $14c0b72509d70225$export$b0d6fa1ab32e3295(target) {
-  if ($c87311424ea30a05$export$fedb369cb70207f1()) {
-    if ($14c0b72509d70225$var$state !== "disabled")
-      return;
-    $14c0b72509d70225$var$state = "restoring";
-    setTimeout(() => {
-      $bbed8b41f857bcc0$export$24490316f764c430(() => {
-        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 (target && $14c0b72509d70225$var$modifiedElementMap.has(target)) {
-      let 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 = $bx7SL$react.createContext(null);
-$ae1eeba8b9eafd08$export$5165eccb35aaadb5.displayName = "PressResponderContext";
-function $f6c31cce2adf654f$var$usePressResponderContext(props) {
-  let context = $bx7SL$useContext($ae1eeba8b9eafd08$export$5165eccb35aaadb5);
-  if (context) {
-    let { register, ...contextProps } = context;
-    props = $3ef42575df84b30b$export$9d1611c77c2fe928(contextProps, props);
-    register();
-  }
-  $e7801be82b4b2a53$export$4debdb1a3f0fa79e(context, props.ref);
-  return props;
-}
-function $f6c31cce2adf654f$export$45712eceda6fad21(props) {
-  let {
-    onPress: onPress1,
-    onPressChange: onPressChange1,
-    onPressStart: onPressStart1,
-    onPressEnd: onPressEnd1,
-    onPressUp: onPressUp1,
-    isDisabled: isDisabled1,
-    isPressed: isPressedProp,
-    preventFocusOnPress,
-    shouldCancelOnPointerExit,
-    allowTextSelectionOnPress,
-    ref: _,
-    ...domProps
-  } = $f6c31cce2adf654f$var$usePressResponderContext(props);
-  let propsRef = $bx7SL$useRef(null);
-  propsRef.current = {
-    onPress: onPress1,
-    onPressChange: onPressChange1,
-    onPressStart: onPressStart1,
-    onPressEnd: onPressEnd1,
-    onPressUp: onPressUp1,
-    isDisabled: isDisabled1,
-    shouldCancelOnPointerExit
-  };
-  let [isPressed, setPressed] = $bx7SL$useState(false);
-  let ref = $bx7SL$useRef({
-    isPressed: false,
-    ignoreEmulatedMouseEvents: false,
-    ignoreClickAfterPress: false,
-    didFirePressStart: false,
-    activePointerId: null,
-    target: null,
-    isOverTarget: false,
-    pointerType: null
-  });
-  let { addGlobalListener, removeAllGlobalListeners } = $03deb23ff14920c4$export$4eaf04e54aa8eed6();
-  let pressProps1 = $bx7SL$useMemo(() => {
-    let state = ref.current;
-    let triggerPressStart = (originalEvent, pointerType) => {
-      let { onPressStart, onPressChange, isDisabled } = propsRef.current;
-      if (isDisabled || state.didFirePressStart)
-        return;
-      if (onPressStart)
-        onPressStart({
-          type: "pressstart",
-          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);
-    };
-    let triggerPressEnd = (originalEvent, pointerType, wasPressed = true) => {
-      let { onPressEnd, onPressChange, onPress, isDisabled } = propsRef.current;
-      if (!state.didFirePressStart)
-        return;
-      state.ignoreClickAfterPress = true;
-      state.didFirePressStart = false;
-      if (onPressEnd)
-        onPressEnd({
-          type: "pressend",
-          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,
-          target: originalEvent.currentTarget,
-          shiftKey: originalEvent.shiftKey,
-          metaKey: originalEvent.metaKey,
-          ctrlKey: originalEvent.ctrlKey,
-          altKey: originalEvent.altKey
-        });
-    };
-    let triggerPressUp = (originalEvent, pointerType) => {
-      let { onPressUp, isDisabled } = propsRef.current;
-      if (isDisabled)
-        return;
-      if (onPressUp)
-        onPressUp({
-          type: "pressup",
-          pointerType,
-          target: originalEvent.currentTarget,
-          shiftKey: originalEvent.shiftKey,
-          metaKey: originalEvent.metaKey,
-          ctrlKey: originalEvent.ctrlKey,
-          altKey: originalEvent.altKey
-        });
-    };
-    let 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);
-      }
-    };
-    let pressProps = {
-      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 (!state.isPressed && !e.repeat) {
-            state.target = e.currentTarget;
-            state.isPressed = true;
-            triggerPressStart(e, "keyboard");
-            addGlobalListener(document, "keyup", onKeyUp, false);
-          }
-        } else if (e.key === "Enter" && $f6c31cce2adf654f$var$isHTMLAnchorLink(e.currentTarget))
-          e.stopPropagation();
-      },
-      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(e) {
-        if (e && !e.currentTarget.contains(e.target))
-          return;
-        if (e && e.button === 0) {
-          e.stopPropagation();
-          if (isDisabled1)
-            e.preventDefault();
-          if (!state.ignoreClickAfterPress && !state.ignoreEmulatedMouseEvents && (state.pointerType === "virtual" || $6a7db85432448f7f$export$60278871457622de(e.nativeEvent))) {
-            if (!isDisabled1 && !preventFocusOnPress)
-              $7215afc6de606d6b$export$de79e2c695e052f3(e.currentTarget);
-            triggerPressStart(e, "virtual");
-            triggerPressUp(e, "virtual");
-            triggerPressEnd(e, "virtual");
-          }
-          state.ignoreEmulatedMouseEvents = false;
-          state.ignoreClickAfterPress = false;
-        }
-      }
-    };
-    let 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;
-        let target = e.target;
-        triggerPressEnd($f6c31cce2adf654f$var$createEvent(state.target, e), "keyboard", state.target.contains(target));
-        removeAllGlobalListeners();
-        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 = (e) => {
-        if (e.button !== 0 || !e.currentTarget.contains(e.target))
-          return;
-        if ($6a7db85432448f7f$export$29bf1b5f2c56cf63(e.nativeEvent)) {
-          state.pointerType = "virtual";
-          return;
-        }
-        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 = (e) => {
-        if (!e.currentTarget.contains(e.target))
-          return;
-        if (e.button === 0) {
-          if ($f6c31cce2adf654f$var$shouldPreventDefault(e.currentTarget))
-            e.preventDefault();
-          e.stopPropagation();
-        }
-      };
-      pressProps.onPointerUp = (e) => {
-        if (!e.currentTarget.contains(e.target) || state.pointerType === "virtual")
-          return;
-        if (e.button === 0 && $f6c31cce2adf654f$var$isOverTarget(e, e.currentTarget))
-          triggerPressUp(e, state.pointerType || e.pointerType);
-      };
-      let 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);
-        }
-      };
-      let 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);
-        }
-      };
-      let onPointerCancel = (e) => {
-        cancel(e);
-      };
-      pressProps.onDragStart = (e) => {
-        if (!e.currentTarget.contains(e.target))
-          return;
-        cancel(e);
-      };
-    } else {
-      pressProps.onMouseDown = (e) => {
-        if (e.button !== 0 || !e.currentTarget.contains(e.target))
-          return;
-        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 = (e) => {
-        if (!e.currentTarget.contains(e.target))
-          return;
-        e.stopPropagation();
-        if (state.isPressed && !state.ignoreEmulatedMouseEvents) {
-          state.isOverTarget = true;
-          triggerPressStart(e, state.pointerType);
-        }
-      };
-      pressProps.onMouseLeave = (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 = (e) => {
-        if (!e.currentTarget.contains(e.target))
-          return;
-        if (!state.ignoreEmulatedMouseEvents && e.button === 0)
-          triggerPressUp(e, state.pointerType);
-      };
-      let onMouseUp = (e) => {
-        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 = (e) => {
-        if (!e.currentTarget.contains(e.target))
-          return;
-        e.stopPropagation();
-        let 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";
-        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 = (e) => {
-        if (!e.currentTarget.contains(e.target))
-          return;
-        e.stopPropagation();
-        if (!state.isPressed)
-          return;
-        let 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 = (e) => {
-        if (!e.currentTarget.contains(e.target))
-          return;
-        e.stopPropagation();
-        if (!state.isPressed)
-          return;
-        let 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 = (e) => {
-        if (!e.currentTarget.contains(e.target))
-          return;
-        e.stopPropagation();
-        if (state.isPressed)
-          cancel(e);
-      };
-      let onScroll = (e) => {
-        if (state.isPressed && e.target.contains(state.target))
-          cancel({
-            currentTarget: state.target,
-            shiftKey: false,
-            ctrlKey: false,
-            metaKey: false,
-            altKey: false
-          });
-      };
-      pressProps.onDragStart = (e) => {
-        if (!e.currentTarget.contains(e.target))
-          return;
-        cancel(e);
-      };
-    }
-    return pressProps;
-  }, [
-    addGlobalListener,
-    isDisabled1,
-    preventFocusOnPress,
-    removeAllGlobalListeners,
-    allowTextSelectionOnPress
-  ]);
-  $bx7SL$useEffect(() => {
-    return () => {
-      if (!allowTextSelectionOnPress)
-        $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) {
-  const { key, code } = event;
-  const element = currentTarget;
-  const role = element.getAttribute("role");
-  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") && !(role === "link" && key !== "Enter");
-}
-function $f6c31cce2adf654f$var$getTouchFromEvent(event) {
-  const { targetTouches } = event;
-  if (targetTouches.length > 0)
-    return targetTouches[0];
-  return null;
-}
-function $f6c31cce2adf654f$var$getTouchById(event, pointerId) {
-  const changedTouches = event.changedTouches;
-  for (let i = 0; i < changedTouches.length; i++) {
-    const 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) {
-  let offsetX = point.width / 2 || point.radiusX || 0;
-  let 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) {
-  if (a.left > b.right || b.left > a.right)
-    return false;
-  if (a.top > b.bottom || b.top > a.bottom)
-    return false;
-  return true;
-}
-function $f6c31cce2adf654f$var$isOverTarget(point, target) {
-  let rect = target.getBoundingClientRect();
-  let pointRect = $f6c31cce2adf654f$var$getPointClientRect(point);
-  return $f6c31cce2adf654f$var$areRectanglesOverlapping(rect, pointRect);
-}
-function $f6c31cce2adf654f$var$shouldPreventDefault(target) {
-  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 = /* @__PURE__ */ new Set([
-  "checkbox",
-  "radio",
-  "range",
-  "color",
-  "file",
-  "image",
-  "button",
-  "submit",
-  "reset"
-]);
-function $f6c31cce2adf654f$var$isValidInputKey(target, key) {
-  return target.type === "checkbox" || target.type === "radio" ? key === " " : $f6c31cce2adf654f$var$nonTextInputTypes.has(target.type);
-}
-var $8a9cb279dc87e130$export$905e7fc544a71f36 = class {
-  isDefaultPrevented() {
-    return this.nativeEvent.defaultPrevented;
-  }
-  preventDefault() {
-    this.defaultPrevented = true;
-    this.nativeEvent.preventDefault();
-  }
-  stopPropagation() {
-    this.nativeEvent.stopPropagation();
-    this.isPropagationStopped = () => true;
-  }
-  isPropagationStopped() {
-    return false;
-  }
-  persist() {
-  }
-  constructor(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;
-  }
-};
-function $8a9cb279dc87e130$export$715c682d09d639cc(onBlur) {
-  let stateRef = $bx7SL$useRef({
-    isFocused: false,
-    onBlur,
-    observer: null
-  });
-  stateRef.current.onBlur = onBlur;
-  $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c(() => {
-    const state = stateRef.current;
-    return () => {
-      if (state.observer) {
-        state.observer.disconnect();
-        state.observer = null;
-      }
-    };
-  }, []);
-  return $bx7SL$useCallback((e1) => {
-    if (e1.target instanceof HTMLButtonElement || e1.target instanceof HTMLInputElement || e1.target instanceof HTMLTextAreaElement || e1.target instanceof HTMLSelectElement) {
-      stateRef.current.isFocused = true;
-      let target = e1.target;
-      let onBlurHandler = (e) => {
-        var _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));
-        if (stateRef.current.observer) {
-          stateRef.current.observer.disconnect();
-          stateRef.current.observer = null;
-        }
-      };
-      target.addEventListener("focusout", onBlurHandler, {
-        once: true
-      });
-      stateRef.current.observer = new MutationObserver(() => {
-        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 = /* @__PURE__ */ new Set();
-var $507fabe10e71c6fb$var$hasSetupGlobalListeners = false;
-var $507fabe10e71c6fb$var$hasEventBeforeFocus = false;
-var $507fabe10e71c6fb$var$hasBlurredWindowRecently = false;
-function $507fabe10e71c6fb$var$triggerChangeHandlers(modality, e) {
-  for (let handler of $507fabe10e71c6fb$var$changeHandlers)
-    handler(modality, e);
-}
-function $507fabe10e71c6fb$var$isValidKey(e) {
-  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) {
-  if (e.target === window || e.target === document)
-    return;
-  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() {
-  $507fabe10e71c6fb$var$hasEventBeforeFocus = false;
-  $507fabe10e71c6fb$var$hasBlurredWindowRecently = true;
-}
-function $507fabe10e71c6fb$var$setupGlobalFocusEvents() {
-  if (typeof window === "undefined" || $507fabe10e71c6fb$var$hasSetupGlobalListeners)
-    return;
-  let 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);
-  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) {
-  let { isDisabled, onBlurWithin, onFocusWithin, onFocusWithinChange } = props;
-  let state = $bx7SL$useRef({
-    isFocusWithin: false
-  });
-  let onBlur = $bx7SL$useCallback((e) => {
-    if (state.current.isFocusWithin && !e.currentTarget.contains(e.relatedTarget)) {
-      state.current.isFocusWithin = false;
-      if (onBlurWithin)
-        onBlurWithin(e);
-      if (onFocusWithinChange)
-        onFocusWithinChange(false);
-    }
-  }, [
-    onBlurWithin,
-    onFocusWithinChange,
-    state
-  ]);
-  let onSyntheticFocus = $8a9cb279dc87e130$export$715c682d09d639cc(onBlur);
-  let onFocus = $bx7SL$useCallback((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,
-      onBlur
-    }
-  };
-}
-var $6179b936705e76d3$var$globalIgnoreEmulatedMouseEvents = false;
-var $6179b936705e76d3$var$hoverCount = 0;
-function $6179b936705e76d3$var$setGlobalIgnoreEmulatedMouseEvents() {
-  $6179b936705e76d3$var$globalIgnoreEmulatedMouseEvents = true;
-  setTimeout(() => {
-    $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 () => {
-    $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) {
-  let { onHoverStart, onHoverChange, onHoverEnd, isDisabled } = props;
-  let [isHovered, setHovered] = $bx7SL$useState(false);
-  let state = $bx7SL$useRef({
-    isHovered: false,
-    ignoreEmulatedMouseEvents: false,
-    pointerType: "",
-    target: null
-  }).current;
-  $bx7SL$useEffect($6179b936705e76d3$var$setupGlobalTouchEvents, []);
-  let { hoverProps: hoverProps1, triggerHoverEnd: triggerHoverEnd1 } = $bx7SL$useMemo(() => {
-    let triggerHoverStart = (event, pointerType) => {
-      state.pointerType = pointerType;
-      if (isDisabled || pointerType === "touch" || state.isHovered || !event.currentTarget.contains(event.target))
-        return;
-      state.isHovered = true;
-      let target = event.currentTarget;
-      state.target = target;
-      if (onHoverStart)
-        onHoverStart({
-          type: "hoverstart",
-          target,
-          pointerType
-        });
-      if (onHoverChange)
-        onHoverChange(true);
-      setHovered(true);
-    };
-    let triggerHoverEnd = (event, pointerType) => {
-      state.pointerType = "";
-      state.target = null;
-      if (pointerType === "touch" || !state.isHovered)
-        return;
-      state.isHovered = false;
-      let target = event.currentTarget;
-      if (onHoverEnd)
-        onHoverEnd({
-          type: "hoverend",
-          target,
-          pointerType
-        });
-      if (onHoverChange)
-        onHoverChange(false);
-      setHovered(false);
-    };
-    let hoverProps = {};
-    if (typeof PointerEvent !== "undefined") {
-      hoverProps.onPointerEnter = (e) => {
-        if ($6179b936705e76d3$var$globalIgnoreEmulatedMouseEvents && e.pointerType === "mouse")
-          return;
-        triggerHoverStart(e, e.pointerType);
-      };
-      hoverProps.onPointerLeave = (e) => {
-        if (!isDisabled && e.currentTarget.contains(e.target))
-          triggerHoverEnd(e, e.pointerType);
-      };
-    } else {
-      hoverProps.onTouchStart = () => {
-        state.ignoreEmulatedMouseEvents = true;
-      };
-      hoverProps.onMouseEnter = (e) => {
-        if (!state.ignoreEmulatedMouseEvents && !$6179b936705e76d3$var$globalIgnoreEmulatedMouseEvents)
-          triggerHoverStart(e, "mouse");
-        state.ignoreEmulatedMouseEvents = false;
-      };
-      hoverProps.onMouseLeave = (e) => {
-        if (!isDisabled && e.currentTarget.contains(e.target))
-          triggerHoverEnd(e, "mouse");
-      };
-    }
-    return {
-      hoverProps,
-      triggerHoverEnd
-    };
-  }, [
-    onHoverStart,
-    onHoverChange,
-    onHoverEnd,
-    isDisabled,
-    state
-  ]);
-  $bx7SL$useEffect(() => {
-    if (isDisabled)
-      triggerHoverEnd1({
-        currentTarget: state.target
-      }, state.pointerType);
-  }, [
-    isDisabled
-  ]);
-  return {
-    hoverProps: hoverProps1,
-    isHovered
-  };
-}
-var $8a26561d2877236e$var$DEFAULT_THRESHOLD = 500;
-function $8a26561d2877236e$export$c24ed0104d07eab9(props) {
-  let { isDisabled, onLongPressStart, onLongPressEnd, onLongPress, threshold = $8a26561d2877236e$var$DEFAULT_THRESHOLD, accessibilityDescription } = props;
-  const timeRef = $bx7SL$useRef(null);
-  let { addGlobalListener, removeGlobalListener } = $03deb23ff14920c4$export$4eaf04e54aa8eed6();
-  let { pressProps } = $f6c31cce2adf654f$export$45712eceda6fad21({
-    isDisabled,
-    onPressStart(e1) {
-      if (e1.pointerType === "mouse" || e1.pointerType === "touch") {
-        if (onLongPressStart)
-          onLongPressStart({
-            ...e1,
-            type: "longpressstart"
-          });
-        timeRef.current = setTimeout(() => {
-          e1.target.dispatchEvent(new PointerEvent("pointercancel", {
-            bubbles: true
-          }));
-          if (onLongPress)
-            onLongPress({
-              ...e1,
-              type: "longpress"
-            });
-          timeRef.current = null;
-        }, threshold);
-        if (e1.pointerType === "touch") {
-          let onContextMenu = (e) => {
-            e.preventDefault();
-          };
-          addGlobalListener(e1.target, "contextmenu", onContextMenu, {
-            once: true
-          });
-          addGlobalListener(window, "pointerup", () => {
-            setTimeout(() => {
-              removeGlobalListener(e1.target, "contextmenu", onContextMenu);
-            }, 30);
-          }, {
-            once: true
-          });
-        }
-      }
-    },
-    onPressEnd(e) {
-      if (timeRef.current)
-        clearTimeout(timeRef.current);
-      if (onLongPressEnd && (e.pointerType === "mouse" || e.pointerType === "touch"))
-        onLongPressEnd({
-          ...e,
-          type: "longpressend"
-        });
-    }
-  });
-  let descriptionProps = $ef06256079686ba0$export$f8aeda7b10753fa1(onLongPress && !isDisabled ? accessibilityDescription : null);
-  return {
-    longPressProps: $3ef42575df84b30b$export$9d1611c77c2fe928(pressProps, descriptionProps)
-  };
-}
-
-// ../../node_modules/@react-aria/label/dist/module.js
-function $d191a55c9702f145$export$8467354a121f1b9f(props) {
-  let { id, label, "aria-labelledby": ariaLabelledby, "aria-label": ariaLabel, labelElementType = "label" } = props;
-  id = $bdb11010cef70236$export$f680877a34711e37(id);
-  let labelId = $bdb11010cef70236$export$f680877a34711e37();
-  let labelProps = {};
-  if (label) {
-    ariaLabelledby = ariaLabelledby ? `${ariaLabelledby} ${labelId}` : labelId;
-    labelProps = {
-      id: labelId,
-      htmlFor: labelElementType === "label" ? id : void 0
-    };
-  } 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");
-  let fieldProps = $313b98861ee5dd6c$export$d6875122194c7b44({
-    id,
-    "aria-label": ariaLabel,
-    "aria-labelledby": ariaLabelledby
-  });
-  return {
-    labelProps,
-    fieldProps
-  };
-}
-
-// ../../node_modules/@react-aria/selection/dist/module.js
-import { useRef as $eCAIO$useRef, useEffect as $eCAIO$useEffect, useMemo as $eCAIO$useMemo } from "react";
-import { getFocusableTreeWalker as $eCAIO$getFocusableTreeWalker, focusSafely as $eCAIO$focusSafely } from "@react-aria/focus";
-
-// ../../node_modules/@react-aria/i18n/dist/real-module.js
-import $iFADg$react, { useContext as $iFADg$useContext, useState as $iFADg$useState, useEffect as $iFADg$useEffect, useMemo as $iFADg$useMemo, useRef as $iFADg$useRef } from "react";
-import { useIsSSR as $iFADg$useIsSSR } from "@react-aria/ssr";
-var $148a7a147e38ea7f$var$RTL_SCRIPTS = /* @__PURE__ */ new Set([
-  "Arab",
-  "Syrc",
-  "Samr",
-  "Mand",
-  "Thaa",
-  "Mend",
-  "Nkoo",
-  "Adlm",
-  "Rohg",
-  "Hebr"
-]);
-var $148a7a147e38ea7f$var$RTL_LANGS = /* @__PURE__ */ 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 (Intl.Locale) {
-    let script = new Intl.Locale(locale).maximize().script;
-    return $148a7a147e38ea7f$var$RTL_SCRIPTS.has(script);
-  }
-  let lang = locale.split("-")[0];
-  return $148a7a147e38ea7f$var$RTL_LANGS.has(lang);
-}
-function $1e5a04cdaf7d1af8$export$f09106e7c6677ec5() {
-  let locale = typeof navigator !== "undefined" && (navigator.language || navigator.userLanguage) || "en-US";
-  try {
-    Intl.DateTimeFormat.supportedLocalesOf([
-      locale
-    ]);
-  } catch (_err) {
-    locale = "en-US";
-  }
-  return {
-    locale,
-    direction: $148a7a147e38ea7f$export$702d680b21cbd764(locale) ? "rtl" : "ltr"
-  };
-}
-var $1e5a04cdaf7d1af8$var$currentLocale = $1e5a04cdaf7d1af8$export$f09106e7c6677ec5();
-var $1e5a04cdaf7d1af8$var$listeners = /* @__PURE__ */ new Set();
-function $1e5a04cdaf7d1af8$var$updateLocale() {
-  $1e5a04cdaf7d1af8$var$currentLocale = $1e5a04cdaf7d1af8$export$f09106e7c6677ec5();
-  for (let listener of $1e5a04cdaf7d1af8$var$listeners)
-    listener($1e5a04cdaf7d1af8$var$currentLocale);
-}
-function $1e5a04cdaf7d1af8$export$188ec29ebc2bdc3a() {
-  let isSSR = $iFADg$useIsSSR();
-  let [defaultLocale, setDefaultLocale] = $iFADg$useState($1e5a04cdaf7d1af8$var$currentLocale);
-  $iFADg$useEffect(() => {
-    if ($1e5a04cdaf7d1af8$var$listeners.size === 0)
-      window.addEventListener("languagechange", $1e5a04cdaf7d1af8$var$updateLocale);
-    $1e5a04cdaf7d1af8$var$listeners.add(setDefaultLocale);
-    return () => {
-      $1e5a04cdaf7d1af8$var$listeners.delete(setDefaultLocale);
-      if ($1e5a04cdaf7d1af8$var$listeners.size === 0)
-        window.removeEventListener("languagechange", $1e5a04cdaf7d1af8$var$updateLocale);
-    };
-  }, []);
-  if (isSSR)
-    return {
-      locale: "en-US",
-      direction: "ltr"
-    };
-  return defaultLocale;
-}
-var $18f2051aff69b9bf$var$I18nContext = /* @__PURE__ */ $iFADg$react.createContext(null);
-function $18f2051aff69b9bf$export$43bb16f9c6d9e3f7() {
-  let defaultLocale = $1e5a04cdaf7d1af8$export$188ec29ebc2bdc3a();
-  let context = $iFADg$useContext($18f2051aff69b9bf$var$I18nContext);
-  return context || defaultLocale;
-}
-var $325a3faab7a68acd$var$cache = /* @__PURE__ */ new Map();
-function $325a3faab7a68acd$export$a16aca283550c30d(options) {
-  let { locale } = $18f2051aff69b9bf$export$43bb16f9c6d9e3f7();
-  let cacheKey = locale + (options ? Object.entries(options).sort(
-    (a, b) => a[0] < b[0] ? -1 : 1
-  ).join() : "");
-  if ($325a3faab7a68acd$var$cache.has(cacheKey))
-    return $325a3faab7a68acd$var$cache.get(cacheKey);
-  let formatter = new Intl.Collator(locale, options);
-  $325a3faab7a68acd$var$cache.set(cacheKey, formatter);
-  return formatter;
-}
-
-// ../../node_modules/@react-aria/selection/dist/module.js
-function $feb5ffebff200149$export$d3e3bd3e26688c04(e) {
-  return $c87311424ea30a05$export$e1865c3bedcd822b() ? e.altKey : e.ctrlKey;
-}
-function $feb5ffebff200149$export$16792effe837dba3(e) {
-  if ($c87311424ea30a05$export$9ac100e40613ea10())
-    return e.metaKey;
-  return e.ctrlKey;
-}
-var $fb3050f43d946246$var$TYPEAHEAD_DEBOUNCE_WAIT_MS = 1e3;
-function $fb3050f43d946246$export$e32c88dfddc6e1d8(options) {
-  let { keyboardDelegate, selectionManager, onTypeSelect } = options;
-  let state = $eCAIO$useRef({
-    search: "",
-    timeout: null
-  }).current;
-  let onKeyDown = (e) => {
-    let character = $fb3050f43d946246$var$getStringForKey(e.key);
-    if (!character || e.ctrlKey || e.metaKey)
-      return;
-    if (character === " " && state.search.trim().length > 0) {
-      e.preventDefault();
-      if (!("continuePropagation" in e))
-        e.stopPropagation();
-    }
-    state.search += character;
-    let key = keyboardDelegate.getKeyForSearch(state.search, selectionManager.focusedKey);
-    if (key == null)
-      key = keyboardDelegate.getKeyForSearch(state.search);
-    if (key != null) {
-      selectionManager.setFocusedKey(key);
-      if (onTypeSelect)
-        onTypeSelect(key);
-    }
-    clearTimeout(state.timeout);
-    state.timeout = setTimeout(() => {
-      state.search = "";
-    }, $fb3050f43d946246$var$TYPEAHEAD_DEBOUNCE_WAIT_MS);
-  };
-  return {
-    typeSelectProps: {
-      onKeyDownCapture: keyboardDelegate.getKeyForSearch ? onKeyDown : null
-    }
-  };
-}
-function $fb3050f43d946246$var$getStringForKey(key) {
-  if (key.length === 1 || !/^[A-Z]/i.test(key))
-    return key;
-  return "";
-}
-function $ae20dd8cbca75726$export$d6daf82dcd84e87c(options) {
-  let { selectionManager: manager, keyboardDelegate: delegate, ref, autoFocus = false, shouldFocusWrap = false, disallowEmptySelection = false, disallowSelectAll = false, selectOnFocus = manager.selectionBehavior === "replace", disallowTypeAhead = false, shouldUseVirtualFocus, allowsTabNavigation = false, isVirtualized, scrollRef = ref } = options;
-  let { direction } = $18f2051aff69b9bf$export$43bb16f9c6d9e3f7();
-  let onKeyDown = (e) => {
-    if (e.altKey && e.key === "Tab")
-      e.preventDefault();
-    if (!ref.current.contains(e.target))
-      return;
-    const 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();
-          let 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();
-          let 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();
-          let nextKey = delegate.getKeyLeftOf(manager.focusedKey);
-          navigateToKey(nextKey, direction === "rtl" ? "first" : "last");
-        }
-        break;
-      case "ArrowRight":
-        if (delegate.getKeyRightOf) {
-          e.preventDefault();
-          let nextKey = delegate.getKeyRightOf(manager.focusedKey);
-          navigateToKey(nextKey, direction === "rtl" ? "last" : "first");
-        }
-        break;
-      case "Home":
-        if (delegate.getFirstKey) {
-          e.preventDefault();
-          let 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();
-          let 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();
-          let nextKey = delegate.getKeyPageBelow(manager.focusedKey);
-          navigateToKey(nextKey);
-        }
-        break;
-      case "PageUp":
-        if (delegate.getKeyPageAbove) {
-          e.preventDefault();
-          let nextKey = delegate.getKeyPageAbove(manager.focusedKey);
-          navigateToKey(nextKey);
-        }
-        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) {
-          if (e.shiftKey)
-            ref.current.focus();
-          else {
-            let walker = $eCAIO$getFocusableTreeWalker(ref.current, {
-              tabbable: true
-            });
-            let next;
-            let last;
-            do {
-              last = walker.lastChild();
-              if (last)
-                next = last;
-            } while (last);
-            if (next && !next.contains(document.activeElement))
-              $7215afc6de606d6b$export$de79e2c695e052f3(next);
-          }
-          break;
-        }
-    }
-  };
-  let scrollPos = $eCAIO$useRef({
-    top: 0,
-    left: 0
-  });
-  $e9faafb641e167db$export$90fc3a17d93f704c(scrollRef, "scroll", isVirtualized ? null : () => {
-    scrollPos.current = {
-      top: scrollRef.current.scrollTop,
-      left: scrollRef.current.scrollLeft
-    };
-  });
-  let onFocus = (e) => {
-    if (manager.isFocused) {
-      if (!e.currentTarget.contains(e.target))
-        manager.setFocused(false);
-      return;
-    }
-    if (!e.currentTarget.contains(e.target))
-      return;
-    manager.setFocused(true);
-    if (manager.focusedKey == null) {
-      let navigateToFirstKey = (key) => {
-        if (key != null) {
-          manager.setFocusedKey(key);
-          if (selectOnFocus)
-            manager.replaceSelection(key);
-        }
-      };
-      let 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) {
-      scrollRef.current.scrollTop = scrollPos.current.top;
-      scrollRef.current.scrollLeft = scrollPos.current.left;
-      let element = scrollRef.current.querySelector(`[data-key="${manager.focusedKey}"]`);
-      if (element) {
-        $7215afc6de606d6b$export$de79e2c695e052f3(element);
-        $2f04cbc44ee30ce0$export$53a0910f038337bd(scrollRef.current, element);
-      }
-    }
-  };
-  let onBlur = (e) => {
-    if (!e.currentTarget.contains(e.relatedTarget))
-      manager.setFocused(false);
-  };
-  const autoFocusRef = $eCAIO$useRef(autoFocus);
-  $eCAIO$useEffect(() => {
-    if (autoFocusRef.current) {
-      let focusedKey = null;
-      if (autoFocus === "first")
-        focusedKey = delegate.getFirstKey();
-      if (autoFocus === "last")
-        focusedKey = delegate.getLastKey();
-      let selectedKeys = manager.selectedKeys;
-      if (selectedKeys.size)
-        focusedKey = selectedKeys.values().next().value;
-      manager.setFocused(true);
-      manager.setFocusedKey(focusedKey);
-      if (focusedKey == null && !shouldUseVirtualFocus)
-        $eCAIO$focusSafely(ref.current);
-    }
-    autoFocusRef.current = false;
-  }, []);
-  $eCAIO$useEffect(() => {
-    if (!isVirtualized && manager.focusedKey && (scrollRef === null || scrollRef === void 0 ? void 0 : scrollRef.current)) {
-      let element = scrollRef.current.querySelector(`[data-key="${manager.focusedKey}"]`);
-      if (element)
-        $2f04cbc44ee30ce0$export$53a0910f038337bd(scrollRef.current, element);
-    }
-  }, [
-    isVirtualized,
-    scrollRef,
-    manager.focusedKey
-  ]);
-  let handlers = {
-    onKeyDown,
-    onFocus,
-    onBlur,
-    onMouseDown(e) {
-      if (scrollRef.current === e.target)
-        e.preventDefault();
-    }
-  };
-  let { typeSelectProps } = $fb3050f43d946246$export$e32c88dfddc6e1d8({
-    keyboardDelegate: delegate,
-    selectionManager: manager
-  });
-  if (!disallowTypeAhead)
-    handlers = $3ef42575df84b30b$export$9d1611c77c2fe928(typeSelectProps, handlers);
-  let tabIndex;
-  if (!shouldUseVirtualFocus)
-    tabIndex = manager.focusedKey == null ? 0 : -1;
-  return {
-    collectionProps: {
-      ...handlers,
-      tabIndex
-    }
-  };
-}
-function $880e95eb8b93ba9a$export$ecf600387e221c37(options) {
-  let { selectionManager: manager, key, ref, shouldSelectOnPressUp, isVirtualized, shouldUseVirtualFocus, focus, isDisabled, onAction, allowsDifferentPressOrigin } = options;
-  let 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"))
-        manager.toggleSelection(key);
-      else
-        manager.replaceSelection(key);
-    }
-  };
-  $eCAIO$useEffect(() => {
-    let isFocused = key === manager.focusedKey;
-    if (isFocused && manager.isFocused && !shouldUseVirtualFocus && document.activeElement !== ref.current) {
-      if (focus)
-        focus();
-      else
-        $eCAIO$focusSafely(ref.current);
-    }
-  }, [
-    ref,
-    key,
-    manager.focusedKey,
-    manager.childFocusStrategy,
-    manager.isFocused,
-    shouldUseVirtualFocus
-  ]);
-  isDisabled = isDisabled || manager.isDisabled(key);
-  let itemProps = {};
-  if (!shouldUseVirtualFocus && !isDisabled)
-    itemProps = {
-      tabIndex: key === manager.focusedKey ? 0 : -1,
-      onFocus(e) {
-        if (e.target === ref.current)
-          manager.setFocusedKey(key);
-      }
-    };
-  else if (isDisabled)
-    itemProps.onMouseDown = (e) => {
-      e.preventDefault();
-    };
-  let allowsSelection = !isDisabled && manager.canSelectItem(key);
-  let allowsActions = onAction && !isDisabled;
-  let hasPrimaryAction = allowsActions && (manager.selectionBehavior === "replace" ? !allowsSelection : manager.isEmpty);
-  let hasSecondaryAction = allowsActions && allowsSelection && manager.selectionBehavior === "replace";
-  let hasAction = hasPrimaryAction || hasSecondaryAction;
-  let modality = $eCAIO$useRef(null);
-  let longPressEnabled = hasAction && allowsSelection;
-  let longPressEnabledOnPressStart = $eCAIO$useRef(false);
-  let hadPrimaryActionOnPressStart = $eCAIO$useRef(false);
-  let itemPressProps = {};
-  if (shouldSelectOnPressUp) {
-    itemPressProps.onPressStart = (e) => {
-      modality.current = e.pointerType;
-      longPressEnabledOnPressStart.current = longPressEnabled;
-      if (e.pointerType === "keyboard" && (!hasAction || $880e95eb8b93ba9a$var$isSelectionKey()))
-        onSelect(e);
-    };
-    if (!allowsDifferentPressOrigin)
-      itemPressProps.onPress = (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 = (e) => {
-        if (e.pointerType !== "keyboard")
-          onSelect(e);
-      };
-      itemPressProps.onPress = hasPrimaryAction ? () => onAction() : null;
-    }
-  } else {
-    itemPressProps.onPressStart = (e) => {
-      modality.current = e.pointerType;
-      longPressEnabledOnPressStart.current = longPressEnabled;
-      hadPrimaryActionOnPressStart.current = hasPrimaryAction;
-      if (e.pointerType === "mouse" && !hasPrimaryAction || e.pointerType === "keyboard" && (!onAction || $880e95eb8b93ba9a$var$isSelectionKey()))
-        onSelect(e);
-    };
-    itemPressProps.onPress = (e) => {
-      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;
-  let { pressProps, isPressed } = $f6c31cce2adf654f$export$45712eceda6fad21(itemPressProps);
-  let onDoubleClick = hasSecondaryAction ? (e) => {
-    if (modality.current === "mouse") {
-      e.stopPropagation();
-      e.preventDefault();
-      onAction();
-    }
-  } : void 0;
-  let { longPressProps } = $8a26561d2877236e$export$c24ed0104d07eab9({
-    isDisabled: !longPressEnabled,
-    onLongPress(e) {
-      if (e.pointerType === "touch") {
-        onSelect(e);
-        manager.setSelectionBehavior("toggle");
-      }
-    }
-  });
-  let onDragStartCapture = (e) => {
-    if (modality.current === "touch" && longPressEnabledOnPressStart.current)
-      e.preventDefault();
-  };
-  return {
-    itemProps: $3ef42575df84b30b$export$9d1611c77c2fe928(itemProps, allowsSelection || hasPrimaryAction ? pressProps : {}, longPressEnabled ? longPressProps : {}, {
-      onDoubleClick,
-      onDragStartCapture
-    }),
-    isPressed,
-    isSelected: manager.isSelected(key),
-    isDisabled,
-    allowsSelection,
-    hasAction
-  };
-}
-function $880e95eb8b93ba9a$var$isActionKey() {
-  let event = window.event;
-  return (event === null || event === void 0 ? void 0 : event.key) === "Enter";
-}
-function $880e95eb8b93ba9a$var$isSelectionKey() {
-  let 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 = class {
-  getKeyBelow(key) {
-    key = this.collection.getKeyAfter(key);
-    while (key != null) {
-      let item = this.collection.getItem(key);
-      if (item.type === "item" && !this.disabledKeys.has(key))
-        return key;
-      key = this.collection.getKeyAfter(key);
-    }
-  }
-  getKeyAbove(key) {
-    key = this.collection.getKeyBefore(key);
-    while (key != null) {
-      let item = this.collection.getItem(key);
-      if (item.type === "item" && !this.disabledKeys.has(key))
-        return key;
-      key = this.collection.getKeyBefore(key);
-    }
-  }
-  getFirstKey() {
-    let key = this.collection.getFirstKey();
-    while (key != null) {
-      let item = this.collection.getItem(key);
-      if (item.type === "item" && !this.disabledKeys.has(key))
-        return key;
-      key = this.collection.getKeyAfter(key);
-    }
-  }
-  getLastKey() {
-    let key = this.collection.getLastKey();
-    while (key != null) {
-      let item = this.collection.getItem(key);
-      if (item.type === "item" && !this.disabledKeys.has(key))
-        return key;
-      key = this.collection.getKeyBefore(key);
-    }
-  }
-  getItem(key) {
-    return this.ref.current.querySelector(`[data-key="${key}"]`);
-  }
-  getKeyPageAbove(key) {
-    let menu = this.ref.current;
-    let item = this.getItem(key);
-    if (!item)
-      return null;
-    let 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;
-  }
-  getKeyPageBelow(key) {
-    let menu = this.ref.current;
-    let item = this.getItem(key);
-    if (!item)
-      return null;
-    let 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;
-  }
-  getKeyForSearch(search, fromKey) {
-    if (!this.collator)
-      return null;
-    let collection = this.collection;
-    let key = fromKey || this.getFirstKey();
-    while (key != null) {
-      let item = collection.getItem(key);
-      let substring = item.textValue.slice(0, search.length);
-      if (item.textValue && this.collator.compare(substring, search) === 0)
-        return key;
-      key = this.getKeyBelow(key);
-    }
-    return null;
-  }
-  constructor(collection, disabledKeys, ref, collator) {
-    this.collection = collection;
-    this.disabledKeys = disabledKeys;
-    this.ref = ref;
-    this.collator = collator;
-  }
-};
-function $982254629710d113$export$b95089534ab7c1fd(props) {
-  let { selectionManager, collection, disabledKeys, ref, keyboardDelegate, autoFocus, shouldFocusWrap, isVirtualized, disallowEmptySelection, selectOnFocus = selectionManager.selectionBehavior === "replace", disallowTypeAhead, shouldUseVirtualFocus, allowsTabNavigation } = props;
-  let collator = $325a3faab7a68acd$export$a16aca283550c30d({
-    usage: "search",
-    sensitivity: "base"
-  });
-  let disabledBehavior = selectionManager.disabledBehavior;
-  let delegate = $eCAIO$useMemo(
-    () => keyboardDelegate || new $2a25aae57d74318e$export$a05409b8bb224a5a(collection, disabledBehavior === "selection" ? /* @__PURE__ */ new Set() : disabledKeys, ref, collator),
-    [
-      keyboardDelegate,
-      collection,
-      disabledKeys,
-      ref,
-      collator,
-      disabledBehavior
-    ]
-  );
-  let { collectionProps } = $ae20dd8cbca75726$export$d6daf82dcd84e87c({
-    ref,
-    selectionManager,
-    keyboardDelegate: delegate,
-    autoFocus,
-    shouldFocusWrap,
-    disallowEmptySelection,
-    selectOnFocus,
-    disallowTypeAhead,
-    shouldUseVirtualFocus,
-    allowsTabNavigation,
-    isVirtualized,
-    scrollRef: ref
-  });
-  return {
-    listProps: collectionProps
-  };
-}
-
-// ../../node_modules/@react-stately/collections/dist/module.js
-import $tyW6A$react, { useMemo as $tyW6A$useMemo, useRef as $tyW6A$useRef } from "react";
-function $c1d7fb2ec91bae71$var$Item(props) {
-  return null;
-}
-$c1d7fb2ec91bae71$var$Item.getCollectionNode = function* getCollectionNode(props, context) {
-  let { childItems, title, children } = props;
-  let rendered = props.title || props.children;
-  let textValue = props.textValue || (typeof rendered === "string" ? rendered : "") || props["aria-label"] || "";
-  if (!textValue && !(context === null || context === void 0 ? void 0 : context.suppressTextValueWarning))
-    console.warn("<Item> with non-plain text contents is unsupported by type to select for accessibility. Please add a `textValue` prop.");
-  yield {
-    type: "item",
-    props,
-    rendered,
-    textValue,
-    "aria-label": props["aria-label"],
-    hasChildNodes: $c1d7fb2ec91bae71$var$hasChildItems(props),
-    *childNodes() {
-      if (childItems)
-        for (let child1 of childItems)
-          yield {
-            type: "item",
-            value: child1
-          };
-      else if (title) {
-        let items = [];
-        $tyW6A$react.Children.forEach(children, (child) => {
-          items.push({
-            type: "item",
-            element: child
-          });
-        });
-        yield* items;
-      }
-    }
-  };
-};
-function $c1d7fb2ec91bae71$var$hasChildItems(props) {
-  if (props.hasChildItems != null)
-    return props.hasChildItems;
-  if (props.childItems)
-    return true;
-  if (props.title && $tyW6A$react.Children.count(props.children) > 0)
-    return true;
-  return false;
-}
-function $9fc4852771d079eb$var$Section(props) {
-  return null;
-}
-$9fc4852771d079eb$var$Section.getCollectionNode = function* getCollectionNode2(props) {
-  let { children, title, items: items1 } = props;
-  yield {
-    type: "section",
-    props,
-    hasChildNodes: true,
-    rendered: title,
-    "aria-label": props["aria-label"],
-    *childNodes() {
-      if (typeof children === "function") {
-        if (!items1)
-          throw new Error("props.children was a function but props.items is missing");
-        for (let item of items1)
-          yield {
-            type: "item",
-            value: item,
-            renderer: children
-          };
-      } else {
-        let items = [];
-        $tyW6A$react.Children.forEach(children, (child) => {
-          items.push({
-            type: "item",
-            element: child
-          });
-        });
-        yield* items;
-      }
-    }
-  };
-};
-var $453cc9f0df89c0a5$var$cache = /* @__PURE__ */ new WeakMap();
-function $453cc9f0df89c0a5$export$77d5aafae4e095b2(collection) {
-  let count = $453cc9f0df89c0a5$var$cache.get(collection);
-  if (count != null)
-    return count;
-  count = 0;
-  for (let item of collection)
-    if (item.type === "section")
-      count += $453cc9f0df89c0a5$export$77d5aafae4e095b2(item.childNodes);
-    else
-      count++;
-  $453cc9f0df89c0a5$var$cache.set(collection, count);
-  return count;
-}
-
-// ../../node_modules/@react-aria/listbox/dist/module.js
-var $b1f0cad8af73213b$export$3585ede4d035bf14 = /* @__PURE__ */ new WeakMap();
-function $b1f0cad8af73213b$var$normalizeKey(key) {
-  if (typeof key === "string")
-    return key.replace(/\s*/g, "");
-  return "" + key;
-}
-function $b1f0cad8af73213b$export$9145995848b05025(state, itemKey) {
-  let data = $b1f0cad8af73213b$export$3585ede4d035bf14.get(state);
-  if (!data)
-    throw new Error("Unknown list");
-  return `${data.id}-option-${$b1f0cad8af73213b$var$normalizeKey(itemKey)}`;
-}
-function $c132121280ec012d$export$50eacbbf140a3141(props, state, ref) {
-  let domProps = $65484d02dcb7eb3e$export$457c3d6518dd4c6f(props, {
-    labelable: true
-  });
-  let { listProps } = $982254629710d113$export$b95089534ab7c1fd({
-    ...props,
-    ref,
-    selectionManager: state.selectionManager,
-    collection: state.collection,
-    disabledKeys: state.disabledKeys
-  });
-  let { focusWithinProps } = $9ab94262bd0047c7$export$420e68273165f4ec({
-    onFocusWithin: props.onFocus,
-    onBlurWithin: props.onBlur,
-    onFocusWithinChange: props.onFocusChange
-  });
-  let id = $bdb11010cef70236$export$f680877a34711e37(props.id);
-  $b1f0cad8af73213b$export$3585ede4d035bf14.set(state, {
-    id,
-    shouldUseVirtualFocus: props.shouldUseVirtualFocus,
-    shouldSelectOnPressUp: props.shouldSelectOnPressUp,
-    shouldFocusOnHover: props.shouldFocusOnHover,
-    isVirtualized: props.isVirtualized,
-    onAction: props.onAction
-  });
-  let { labelProps, fieldProps } = $d191a55c9702f145$export$8467354a121f1b9f({
-    ...props,
-    id,
-    labelElementType: "span"
-  });
-  return {
-    labelProps,
-    listBoxProps: $3ef42575df84b30b$export$9d1611c77c2fe928(domProps, focusWithinProps, state.selectionManager.selectionMode === "multiple" ? {
-      "aria-multiselectable": "true"
-    } : {}, {
-      role: "listbox",
-      ...$3ef42575df84b30b$export$9d1611c77c2fe928(fieldProps, listProps)
-    })
-  };
-}
-function $293f70390ea03370$export$497855f14858aa34(props, state, ref) {
-  let { key } = props;
-  let data = $b1f0cad8af73213b$export$3585ede4d035bf14.get(state);
-  var _isDisabled;
-  let isDisabled = (_isDisabled = props.isDisabled) !== null && _isDisabled !== void 0 ? _isDisabled : state.disabledKeys.has(key);
-  var _isSelected;
-  let isSelected = (_isSelected = props.isSelected) !== null && _isSelected !== void 0 ? _isSelected : state.selectionManager.isSelected(key);
-  let isFocused = state.selectionManager.focusedKey === key;
-  var _shouldSelectOnPressUp;
-  let shouldSelectOnPressUp = (_shouldSelectOnPressUp = props.shouldSelectOnPressUp) !== null && _shouldSelectOnPressUp !== void 0 ? _shouldSelectOnPressUp : data.shouldSelectOnPressUp;
-  var _shouldFocusOnHover;
-  let shouldFocusOnHover = (_shouldFocusOnHover = props.shouldFocusOnHover) !== null && _shouldFocusOnHover !== void 0 ? _shouldFocusOnHover : data.shouldFocusOnHover;
-  var _shouldUseVirtualFocus;
-  let shouldUseVirtualFocus = (_shouldUseVirtualFocus = props.shouldUseVirtualFocus) !== null && _shouldUseVirtualFocus !== void 0 ? _shouldUseVirtualFocus : data.shouldUseVirtualFocus;
-  var _isVirtualized;
-  let isVirtualized = (_isVirtualized = props.isVirtualized) !== null && _isVirtualized !== void 0 ? _isVirtualized : data.isVirtualized;
-  let labelId = $bdb11010cef70236$export$b4cc09c592e8fdb8();
-  let descriptionId = $bdb11010cef70236$export$b4cc09c592e8fdb8();
-  let optionProps = {
-    role: "option",
-    "aria-disabled": isDisabled,
-    "aria-selected": state.selectionManager.selectionMode !== "none" ? isSelected : void 0
-  };
-  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);
-  }
-  let { itemProps, isPressed, hasAction, allowsSelection } = $880e95eb8b93ba9a$export$ecf600387e221c37({
-    selectionManager: state.selectionManager,
-    key,
-    ref,
-    shouldSelectOnPressUp,
-    allowsDifferentPressOrigin: shouldSelectOnPressUp && shouldFocusOnHover,
-    isVirtualized,
-    shouldUseVirtualFocus,
-    isDisabled,
-    onAction: data.onAction ? () => data.onAction(key) : void 0
-  });
-  let { hoverProps } = $6179b936705e76d3$export$ae780daf29e6d456({
-    isDisabled: isDisabled || !shouldFocusOnHover,
-    onHoverStart() {
-      if (!$507fabe10e71c6fb$export$b9b3dfddab17db27()) {
-        state.selectionManager.setFocused(true);
-        state.selectionManager.setFocusedKey(key);
-      }
-    }
-  });
-  return {
-    optionProps: {
-      ...optionProps,
-      ...$3ef42575df84b30b$export$9d1611c77c2fe928(itemProps, hoverProps),
-      id: $b1f0cad8af73213b$export$9145995848b05025(state, key)
-    },
-    labelProps: {
-      id: labelId
-    },
-    descriptionProps: {
-      id: descriptionId
-    },
-    isFocused,
-    isSelected,
-    isDisabled,
-    isPressed,
-    allowsSelection,
-    hasAction
-  };
-}
-
-// src/components/DropdownSelector/Listbox.tsx
-import { useFocusRing } from "@react-aria/focus";
-import { px as px4 } from "@charcoal-ui/utils";
-var Listbox = ({
-  state,
-  mode = "default",
-  ...props
-}) => {
-  const ref = useRef5(null);
-  const { listBoxProps } = $c132121280ec012d$export$50eacbbf140a3141(props, state, ref);
-  const collection = useMemo2(
-    () => [...state.collection].map((node, index, self) => ({
-      node,
-      first: index === 0,
-      last: index === self.length - 1
-    })),
-    [state.collection]
-  );
-  return /* @__PURE__ */ React14.createElement(ListboxRoot, { ref, ...listBoxProps }, collection.map(({ node, last }) => /* @__PURE__ */ React14.createElement(Fragment, { key: node.key }, /* @__PURE__ */ React14.createElement(Option, { item: node, state, mode }), !last && mode === "separator" && /* @__PURE__ */ React14.createElement(Divider, null))));
-};
-var Listbox_default = memo(Listbox);
-var ListboxRoot = styled13.ul`
-  padding-left: 0;
-  margin: 0;
-  box-sizing: border-box;
-  list-style: none;
-
-  ${theme((o) => [
-  o.bg.background1,
-  o.border.default,
-  o.borderRadius(8),
-  o.outline.default.focus
-])}
-`;
-var Divider = styled13.div.attrs({ role: "separator" })`
-  display: flex;
-  ${theme((o) => [o.padding.horizontal(8)])}
-
-  &:before {
-    content: '';
-    display: block;
-    width: 100%;
-    height: 1px;
-    background: #00000014;
-  }
-`;
-var Option = ({ item, state, mode }) => {
-  const ref = useRef5(null);
-  const { optionProps, isSelected } = $293f70390ea03370$export$497855f14858aa34(item, state, ref);
-  const { focusProps } = useFocusRing();
-  return /* @__PURE__ */ React14.createElement(OptionRoot, { ...$3ef42575df84b30b$export$9d1611c77c2fe928(optionProps, focusProps), ref, mode }, /* @__PURE__ */ React14.createElement(OptionCheckIcon, { name: "16/Check", isSelected }), /* @__PURE__ */ React14.createElement(OptionText, null, item.rendered));
-};
-var OptionRoot = styled13.li`
-  display: flex;
-  align-items: center;
-  gap: ${({ theme: theme4 }) => px4(theme4.spacing[4])};
-  height: 40px;
-  cursor: pointer;
-  outline: none;
-
-  ${({ mode }) => theme((o) => [
-  o.padding.horizontal(8),
-  mode === "separator" && o.padding.vertical(4)
-])}
-
-  &:focus {
-    ${theme((o) => [o.bg.surface3])}
-  }
-`;
-var OptionCheckIcon = styled13(Icon_default)`
-  visibility: hidden;
-  ${theme((o) => [o.font.text2])}
-
-  ${({ isSelected }) => isSelected && css5`
-      visibility: visible;
-    `}
-`;
-var OptionText = styled13.span`
-  display: block;
-  ${theme((o) => [o.typography(14), o.font.text2])}
-`;
-
-// src/components/DropdownSelector/Popover.tsx
-import { FocusScope as FocusScope2 } from "@react-aria/focus";
-import { DismissButton, useOverlay as useOverlay2 } from "@react-aria/overlays";
-import React15, {
-  useRef as useRef6,
-  useMemo as useMemo3,
-  memo as memo2
-} from "react";
-var Popover = ({ open, onClose, children, ...props }) => {
-  const ref = useRef6(null);
-  const { overlayProps } = useOverlay2(
-    useMemo3(
-      () => ({
-        isOpen: open,
-        onClose,
-        shouldCloseOnBlur: true,
-        isDismissable: true
-      }),
-      [onClose, open]
-    ),
-    ref
-  );
-  return /* @__PURE__ */ React15.createElement(FocusScope2, { restoreFocus: true }, /* @__PURE__ */ React15.createElement("div", { ...$3ef42575df84b30b$export$9d1611c77c2fe928(overlayProps, props), ref }, children, /* @__PURE__ */ React15.createElement(DismissButton, { onDismiss: onClose })));
-};
-var Popover_default = memo2(Popover);
-
-// src/components/DropdownSelector/index.tsx
-var DropdownSelector = ({
-  open,
-  className,
-  label = "",
-  requiredText = "",
-  subLabel,
-  assertiveText,
-  autoComplete,
-  invalid = false,
-  disabled = false,
-  required = false,
-  showLabel = false,
-  mode = "default",
-  ...props
-}) => {
-  const { visuallyHiddenProps } = useVisuallyHidden2();
-  const triggerRef = useRef7(null);
-  const selectProps = useMemo4(
-    () => ({
-      ...props,
-      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]
-  );
-  const state = useSelectState(selectProps);
-  const {
-    labelProps,
-    triggerProps,
-    valueProps,
-    menuProps,
-    errorMessageProps,
-    descriptionProps
-  } = useSelect(selectProps, state, triggerRef);
-  const { buttonProps } = useButton(triggerProps, triggerRef);
-  const hasAssertiveText = assertiveText !== void 0 && assertiveText.length > 0;
-  return /* @__PURE__ */ React16.createElement(DropdownSelectorRoot, { "aria-disabled": disabled, className }, /* @__PURE__ */ React16.createElement(
-    DropdownFieldLabel,
-    {
-      label,
-      required,
-      requiredText,
-      subLabel,
-      ...labelProps,
-      ...!showLabel ? visuallyHiddenProps : {}
-    }
-  ), /* @__PURE__ */ React16.createElement(
-    HiddenSelect,
-    {
-      state,
-      triggerRef,
-      label,
-      name: props.name,
-      isDisabled: disabled,
-      autoComplete
-    }
-  ), /* @__PURE__ */ React16.createElement(DropdownButtonWrapper, null, /* @__PURE__ */ React16.createElement(DropdownButton, { ...buttonProps, ref: triggerRef, invalid }, /* @__PURE__ */ React16.createElement(DropdownButtonText, { ...valueProps }, state.selectedItem ? state.selectedItem.rendered : props.placeholder), /* @__PURE__ */ React16.createElement(DropdownButtonIcon, { name: "16/Menu" })), state.isOpen && /* @__PURE__ */ React16.createElement(DropdownPopover, { open: state.isOpen, onClose: () => state.close() }, /* @__PURE__ */ React16.createElement(Listbox_default, { ...menuProps, state, mode }))), hasAssertiveText && /* @__PURE__ */ React16.createElement(
-    AssertiveText,
-    {
-      invalid,
-      ...invalid ? errorMessageProps : descriptionProps
-    },
-    assertiveText
-  ));
-};
-var DropdownSelector_default = DropdownSelector;
-var DropdownSelectorItem = Item;
-var DropdownSelectorRoot = styled14.div`
-  position: relative;
-  display: inline-block;
-
-  ${disabledSelector4} {
-    cursor: default;
-    ${theme((o) => o.disabled)}
-  }
-`;
-var DropdownFieldLabel = styled14(FieldLabel_default)`
-  width: 100%;
-
-  ${theme((o) => o.margin.bottom(8))}
-`;
-var DropdownButtonWrapper = styled14.div`
-  position: relative;
-`;
-var DropdownButton = styled14.button`
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-
-  height: 40px;
-  width: 288px;
-  box-sizing: border-box;
-  cursor: pointer;
-
-  ${disabledSelector4} {
-    cursor: default;
-  }
-
-  ${({ invalid }) => theme((o) => [
-  o.border.default,
-  o.padding.horizontal(8),
-  o.outline.default.focus,
-  o.bg.surface3,
-  o.borderRadius(4),
-  invalid && o.outline.assertive
-])}
-`;
-var DropdownButtonText = styled14.span`
-  text-align: left;
-
-  ${theme((o) => [o.typography(14), o.font.text2])}
-`;
-var DropdownButtonIcon = styled14(Icon_default)`
-  ${theme((o) => [o.font.text2])}
-`;
-var AssertiveText = styled14.div`
-  ${({ invalid }) => theme((o) => [
-  o.typography(14),
-  o.margin.top(8),
-  invalid ? o.font.assertive : o.font.text2
-])}
-`;
-var DropdownPopover = styled14(Popover_default)`
-  position: absolute;
-  width: 100%;
-
-  top: 100%;
-  margin-top: 2px;
-`;
-
-// src/components/SegmentedControl/index.tsx
-import React18, { forwardRef, memo as memo3, useMemo as useMemo5, useRef as useRef8 } from "react";
-import { useRadioGroupState } from "react-stately";
-import {
-  useRadio,
-  useRadioGroup
-} from "@react-aria/radio";
-import styled15 from "styled-components";
-import { disabledSelector as disabledSelector5 } from "@charcoal-ui/utils";
-
-// src/components/SegmentedControl/RadioGroupContext.tsx
-import React17, { createContext as createContext2, useContext as useContext5 } from "react";
-var RadioContext = createContext2(null);
-var RadioProvider = ({
-  value,
-  children
-}) => {
-  return /* @__PURE__ */ React17.createElement(RadioContext.Provider, { value }, children);
-};
-var useRadioContext = () => {
-  const state = useContext5(RadioContext);
-  if (state === null)
-    throw new Error("`<RadioProvider>` is not likely mounted.");
-  return state;
-};
-
-// src/components/SegmentedControl/index.tsx
-var SegmentedControl = forwardRef(
-  function SegmentedControlInner(props, ref) {
-    const ariaRadioGroupProps = useMemo5(
-      () => ({
-        ...props,
-        isDisabled: props.disabled,
-        isReadOnly: props.readonly,
-        isRequired: props.required
-      }),
-      [props]
-    );
-    const state = useRadioGroupState(ariaRadioGroupProps);
-    const { radioGroupProps } = useRadioGroup(ariaRadioGroupProps, state);
-    const segmentedControlItems = useMemo5(() => {
-      return props.data.map(
-        (d) => typeof d === "string" ? { value: d, label: d } : d
-      );
-    }, [props.data]);
-    return /* @__PURE__ */ React18.createElement(SegmentedControlRoot, { ref, ...radioGroupProps }, /* @__PURE__ */ React18.createElement(RadioProvider, { value: state }, segmentedControlItems.map((item) => /* @__PURE__ */ React18.createElement(
-      Segmented,
-      {
-        key: item.value,
-        value: item.value,
-        disabled: item.disabled
-      },
-      item.label
-    ))));
-  }
-);
-var SegmentedControl_default = memo3(SegmentedControl);
-var Segmented = ({ children, ...props }) => {
-  const state = useRadioContext();
-  const ref = useRef8(null);
-  const ariaRadioProps = useMemo5(
-    () => ({ ...props, isDisabled: props.disabled }),
-    [props]
-  );
-  const { inputProps, isDisabled, isSelected } = useRadio(
-    ariaRadioProps,
-    state,
-    ref
-  );
-  return /* @__PURE__ */ React18.createElement(
-    SegmentedRoot,
-    {
-      "aria-disabled": isDisabled || state.isReadOnly,
-      checked: isSelected
-    },
-    /* @__PURE__ */ React18.createElement(SegmentedInput, { ...inputProps, ref }),
-    /* @__PURE__ */ React18.createElement(RadioLabel2, null, /* @__PURE__ */ React18.createElement(SegmentedLabelInner, null, children))
-  );
-};
-var SegmentedControlRoot = styled15.div`
-  display: inline-flex;
-  align-items: center;
-
-  ${theme((o) => [o.bg.surface3, o.borderRadius(16)])}
-`;
-var SegmentedRoot = styled15.label`
-  position: relative;
-  display: flex;
-  align-items: center;
-  cursor: pointer;
-  height: 32px;
-
-  ${disabledSelector5} {
-    cursor: default;
-  }
-
-  ${({ checked }) => theme((o) => [
-  o.padding.horizontal(16),
-  o.borderRadius(16),
-  o.disabled,
-  checked === true && o.bg.brand,
-  checked === true ? o.font.text5 : o.font.text2
-])}
-`;
-var SegmentedInput = styled15.input`
-  position: absolute;
-
-  height: 0px;
-  width: 0px;
-  padding: 0;
-  margin: 0;
-
-  appearance: none;
-  box-sizing: border-box;
-  overflow: hidden;
-  white-space: nowrap;
-  opacity: 0;
-`;
-var RadioLabel2 = styled15.div`
-  background: transparent;
-  display: flex;
-  align-items: center;
-  height: 22px;
-`;
-var SegmentedLabelInner = styled15.div`
-  ${theme((o) => [o.typography(14)])}
-`;
-
-// src/components/Checkbox/index.tsx
-import React19, { forwardRef as forwardRef2, memo as memo4, useMemo as useMemo6 } from "react";
-import styled16, { css as css6 } from "styled-components";
-import { useCheckbox } from "@react-aria/checkbox";
-import { useToggleState as useToggleState2 } from "react-stately";
-import { disabledSelector as disabledSelector6, px as px5 } from "@charcoal-ui/utils";
-var Checkbox = forwardRef2(
-  function CheckboxInner(props, ref) {
-    const ariaCheckboxProps = useMemo6(
-      () => ({
-        ...props,
-        isSelected: props.checked,
-        defaultSelected: props.defaultChecked,
-        "aria-label": "children" in props ? void 0 : props.label,
-        isDisabled: props.disabled
-      }),
-      [props]
-    );
-    const state = useToggleState2(ariaCheckboxProps);
-    const objectRef = $df56164dff5785e2$export$4338b53315abf666(ref);
-    const { inputProps } = useCheckbox(ariaCheckboxProps, state, objectRef);
-    const isDisabled = (props.disabled ?? false) || (props.readonly ?? false);
-    return /* @__PURE__ */ React19.createElement(InputRoot, { "aria-disabled": isDisabled }, /* @__PURE__ */ React19.createElement(CheckboxInput, { type: "checkbox", ...inputProps }), /* @__PURE__ */ React19.createElement(CheckboxInputOverlay, { "aria-hidden": true, checked: inputProps.checked }, /* @__PURE__ */ React19.createElement(Icon_default, { name: "24/Check", unsafeNonGuidelineScale: 2 / 3 })), "children" in props && /* @__PURE__ */ React19.createElement(InputLabel, null, props.children));
-  }
-);
-var Checkbox_default = memo4(Checkbox);
-var hiddenCss = css6`
-  visibility: hidden;
-`;
-var InputRoot = styled16.label`
-  position: relative;
-  display: flex;
-  align-items: center;
-  cursor: pointer;
-  ${disabledSelector6} {
-    cursor: default;
-  }
-
-  gap: ${({ theme: theme4 }) => px5(theme4.spacing[4])};
-  ${theme((o) => [o.disabled])}
-`;
-var CheckboxInput = styled16.input`
-  &[type='checkbox'] {
-    appearance: none;
-    display: block;
-    cursor: pointer;
-    margin: 0;
-    width: 20px;
-    height: 20px;
-
-    &:checked {
-      ${theme((o) => o.bg.brand.hover.press)}
-    }
-    &:not(:checked) {
-      border-width: 2px;
-      border-style: solid;
-      border-color: ${({ theme: theme4 }) => theme4.color.text4};
-    }
-    ${theme((o) => [o.outline.default.focus, o.borderRadius(4)])}
-  }
-`;
-var CheckboxInputOverlay = styled16.div`
-  position: absolute;
-  top: -2px;
-  left: -2px;
-  box-sizing: border-box;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-
-  ${theme((o) => [o.width.px(24), o.height.px(24), o.font.text5])}
-
-  ${({ checked }) => checked !== true && hiddenCss};
-`;
-var InputLabel = styled16.div`
-  ${theme((o) => [o.typography(14), o.font.text2])}
-`;
-
-// src/components/TagItem/index.tsx
-import React20, {
-  forwardRef as forwardRef3,
-  memo as memo5,
-  useMemo as useMemo7
-} from "react";
-import styled17, { css as css7 } from "styled-components";
-import { disabledSelector as disabledSelector7, px as px6 } from "@charcoal-ui/utils";
-import { useButton as useButton2 } from "@react-aria/button";
-var sizeMap = {
-  S: 32,
-  M: 40
-};
-var TagItem = forwardRef3(
-  function TagItemInner({
-    label,
-    translatedLabel,
-    bgColor = "#7ACCB1",
-    bgImage,
-    size = "M",
-    disabled,
-    status = "default",
-    ...props
-  }, _ref) {
-    const ref = $df56164dff5785e2$export$4338b53315abf666(_ref);
-    const ariaButtonProps = useMemo7(
-      () => ({
-        elementType: "a",
-        isDisabled: disabled,
-        ...props
-      }),
-      [disabled, props]
-    );
-    const { buttonProps } = useButton2(ariaButtonProps, ref);
-    const hasTranslatedLabel = translatedLabel !== void 0 && translatedLabel.length > 0;
-    return /* @__PURE__ */ React20.createElement(
-      TagItemRoot,
-      {
-        ref,
-        size: hasTranslatedLabel ? "M" : size,
-        status,
-        ...buttonProps
-      },
-      /* @__PURE__ */ React20.createElement(Background, { bgColor, bgImage }),
-      /* @__PURE__ */ React20.createElement(Inner, null, /* @__PURE__ */ React20.createElement(LabelWrapper, { isTranslate: hasTranslatedLabel }, hasTranslatedLabel && /* @__PURE__ */ React20.createElement(TranslatedLabel, null, /* @__PURE__ */ React20.createElement(Label3, null, translatedLabel)), /* @__PURE__ */ React20.createElement(Label3, null, label)), status === "active" && /* @__PURE__ */ React20.createElement(Icon_default, { name: "16/Remove" }))
-    );
-  }
-);
-var TagItem_default = memo5(TagItem);
-var TagItemRoot = styled17.a`
-  isolation: isolate;
-  position: relative;
-  height: ${({ size }) => sizeMap[size]}px;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  text-decoration: none;
-  cursor: pointer;
-  overflow: hidden;
-
-  ${({ size, status }) => theme((o) => [
-  o.outline.default.focus,
-  o.borderRadius(4),
-  status !== "active" && size === "M" && o.padding.horizontal(24),
-  status !== "active" && size === "S" && o.padding.horizontal(16),
-  status === "inactive" && o.bg.surface3,
-  status === "inactive" ? o.font.text2 : o.font.text5,
-  ...status === "active" ? [o.padding.left(16), o.padding.right(8)] : []
-])}
-
-  ${disabledSelector7} {
-    ${theme((o) => [o.disabled])}
-    cursor: default;
-  }
-`;
-var Background = styled17.div`
-  position: absolute;
-  z-index: 1;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-
-  background-color: ${({ bgColor }) => bgColor};
-
-  ${({ bgImage }) => bgImage !== void 0 && css7`
-      ${theme((o) => [o.bg.surface4])}
-      &::before {
-        content: '';
-        position: absolute;
-        top: 0;
-        left: 0;
-        width: 100%;
-        height: 100%;
-        background-position: center;
-        background-size: cover;
-        background-image: url(${bgImage});
-        mix-blend-mode: overlay;
-      }
-    `}
-`;
-var Inner = styled17.div`
-  display: inline-flex;
-  gap: ${({ theme: theme4 }) => px6(theme4.spacing[8])};
-  align-items: center;
-  z-index: 2;
-`;
-var labelCSS = css7`
-  ${theme((o) => [o.typography(14).bold])}
-`;
-var translateLabelCSS = css7`
-  display: flex;
-  align-items: center;
-  flex-direction: column;
-  font-size: 10px;
-`;
-var LabelWrapper = styled17.div`
-  ${({ isTranslate }) => isTranslate ?? false ? translateLabelCSS : labelCSS}
-`;
-var Label3 = styled17.span`
-  max-width: 152px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  font-size: inherit;
-  color: inherit;
-  line-height: inherit;
-`;
-var TranslatedLabel = styled17.div`
-  ${theme((o) => [o.typography(12).bold])}
-`;
-export {
-  Button_default as Button,
-  Checkbox_default as Checkbox,
-  Clickable_default as Clickable,
-  ComponentAbstraction,
-  DropdownSelector_default as DropdownSelector,
-  DropdownSelectorItem,
-  Icon_default as Icon,
-  IconButton_default as IconButton,
-  LoadingSpinner,
-  LoadingSpinnerIcon,
-  Modal,
-  ModalAlign,
-  ModalBody,
-  ModalButtons,
-  ModalHeader,
-  MultiSelect,
-  MultiSelectGroup,
-  OverlayProvider,
-  Radio,
-  RadioGroup,
-  SSRProvider,
-  SegmentedControl_default as SegmentedControl,
-  SwitchCheckbox as Switch,
-  TagItem_default as TagItem,
-  TextField_default as TextField,
-  useComponentAbstraction
-};
-//# sourceMappingURL=index.js.map