@basic-ui/core 0.0.53 → 0.0.56

package/build/esm/CheckBox/CheckBox.js

@@ -1,34 +1,24 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["as", "checked", "defaultChecked", "onChange"];
 import { forwardRef } from 'react';
 import { useControlledState } from '../hooks';
 import { jsx as _jsx } from "react/jsx-runtime";
-export var CheckBox = /*#__PURE__*/forwardRef(function CheckBox(props, forwardedRef) {
-  var _props$as = props.as,
-      Comp = _props$as === void 0 ? 'input' : _props$as,
-      checkedProp = props.checked,
-      _props$defaultChecked = props.defaultChecked,
-      defaultChecked = _props$defaultChecked === void 0 ? false : _props$defaultChecked,
-      onChangeProp = props.onChange,
-      otherProps = _objectWithoutProperties(props, _excluded);
-
-  var _useControlledState = useControlledState(checkedProp, onChangeProp, defaultChecked, function (setValue) {
-    return function (e) {
-      setValue(e.target.checked);
-    };
-  }),
-      _useControlledState2 = _slicedToArray(_useControlledState, 2),
-      checked = _useControlledState2[0],
-      onChange = _useControlledState2[1];
-
-  return /*#__PURE__*/_jsx(Comp, _extends({
+export const CheckBox = /*#__PURE__*/forwardRef(function CheckBox(props, forwardedRef) {
+  const {
+    as: Comp = 'input',
+    checked: checkedProp,
+    defaultChecked = false,
+    onChange: onChangeProp,
+    ...otherProps
+  } = props;
+  const [checked, onChange] = useControlledState(checkedProp, onChangeProp, defaultChecked, setValue => e => {
+    setValue(e.target.checked);
+  });
+  return /*#__PURE__*/_jsx(Comp, {
     ref: forwardedRef,
     type: "checkbox",
     checked: checked,
     "aria-checked": checked,
-    onChange: onChange
-  }, otherProps));
+    onChange: onChange,
+    ...otherProps
+  });
 });
 //# sourceMappingURL=CheckBox.js.map

package/build/esm/CheckBox/CheckBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckBox.js","names":["forwardRef","useControlledState","CheckBox","props","forwardedRef","as","Comp","checkedProp","checked","defaultChecked","onChangeProp","onChange","otherProps","setValue","e","target"],"sources":["../../../src/CheckBox/CheckBox.tsx"],"sourcesContent":["import type { ElementType, InputHTMLAttributes, ReactNode } from 'react';\nimport { forwardRef } from 'react';\n\nimport { useControlledState } from '../hooks';\n\nexport interface CheckBoxProps extends InputHTMLAttributes<HTMLInputElement> {\n  as?: ElementType<any>;\n  innerAs?: ElementType<any>;\n  children?: ReactNode;\n}\n\nexport const CheckBox = forwardRef<HTMLInputElement, CheckBoxProps>(\n  function CheckBox(props, forwardedRef) {\n    const {\n      as: Comp = 'input',\n      checked: checkedProp,\n      defaultChecked = false,\n      onChange: onChangeProp,\n      ...otherProps\n    } = props;\n    const [checked, onChange] = useControlledState(\n      checkedProp,\n      onChangeProp,\n      defaultChecked,\n      (setValue) => (e) => {\n        setValue(e.target.checked);\n      }\n    );\n\n    return (\n      <Comp\n        ref={forwardedRef}\n        type=\"checkbox\"\n        checked={checked}\n        aria-checked={checked}\n        onChange={onChange}\n        {...otherProps}\n      />\n    );\n  }\n);\n"],"mappings":";;;;AACA,SAASA,UAAT,QAA2B,OAA3B;AAEA,SAASC,kBAAT,QAAmC,UAAnC;;AAQA,OAAO,IAAMC,QAAQ,gBAAGF,UAAU,CAChC,SAASE,QAAT,CAAkBC,KAAlB,EAAyBC,YAAzB,EAAuC;EACrC,gBAMID,KANJ,CACEE,EADF;EAAA,IACMC,IADN,0BACa,OADb;EAAA,IAEWC,WAFX,GAMIJ,KANJ,CAEEK,OAFF;EAAA,4BAMIL,KANJ,CAGEM,cAHF;EAAA,IAGEA,cAHF,sCAGmB,KAHnB;EAAA,IAIYC,YAJZ,GAMIP,KANJ,CAIEQ,QAJF;EAAA,IAKKC,UALL,4BAMIT,KANJ;;EAOA,0BAA4BF,kBAAkB,CAC5CM,WAD4C,EAE5CG,YAF4C,EAG5CD,cAH4C,EAI5C,UAACI,QAAD;IAAA,OAAc,UAACC,CAAD,EAAO;MACnBD,QAAQ,CAACC,CAAC,CAACC,MAAF,CAASP,OAAV,CAAR;IACD,CAFD;EAAA,CAJ4C,CAA9C;EAAA;EAAA,IAAOA,OAAP;EAAA,IAAgBG,QAAhB;;EASA,oBACE,KAAC,IAAD;IACE,GAAG,EAAEP,YADP;IAEE,IAAI,EAAC,UAFP;IAGE,OAAO,EAAEI,OAHX;IAIE,gBAAcA,OAJhB;IAKE,QAAQ,EAAEG;EALZ,GAMMC,UANN,EADF;AAUD,CA5B+B,CAA3B"}
+{"version":3,"file":"CheckBox.js","names":["forwardRef","useControlledState","jsx","_jsx","CheckBox","props","forwardedRef","as","Comp","checked","checkedProp","defaultChecked","onChange","onChangeProp","otherProps","setValue","e","target","ref","type"],"sources":["../../../src/CheckBox/CheckBox.tsx"],"sourcesContent":["import type { ElementType, InputHTMLAttributes, ReactNode } from 'react';\nimport { forwardRef } from 'react';\n\nimport { useControlledState } from '../hooks';\n\nexport interface CheckBoxProps extends InputHTMLAttributes<HTMLInputElement> {\n  as?: ElementType<any>;\n  innerAs?: ElementType<any>;\n  children?: ReactNode;\n}\n\nexport const CheckBox = forwardRef<HTMLInputElement, CheckBoxProps>(\n  function CheckBox(props, forwardedRef) {\n    const {\n      as: Comp = 'input',\n      checked: checkedProp,\n      defaultChecked = false,\n      onChange: onChangeProp,\n      ...otherProps\n    } = props;\n    const [checked, onChange] = useControlledState(\n      checkedProp,\n      onChangeProp,\n      defaultChecked,\n      (setValue) => (e) => {\n        setValue(e.target.checked);\n      }\n    );\n\n    return (\n      <Comp\n        ref={forwardedRef}\n        type=\"checkbox\"\n        checked={checked}\n        aria-checked={checked}\n        onChange={onChange}\n        {...otherProps}\n      />\n    );\n  }\n);\n"],"mappings":"AACA,SAASA,UAAU,QAAQ,OAAO;AAElC,SAASC,kBAAkB,QAAQ,UAAU;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAQ9C,OAAO,MAAMC,QAAQ,gBAAGJ,UAAU,CAChC,SAASI,QAAQA,CAACC,KAAK,EAAEC,YAAY,EAAE;EACrC,MAAM;IACJC,EAAE,EAAEC,IAAI,GAAG,OAAO;IAClBC,OAAO,EAAEC,WAAW;IACpBC,cAAc,GAAG,KAAK;IACtBC,QAAQ,EAAEC,YAAY;IACtB,GAAGC;EACL,CAAC,GAAGT,KAAK;EACT,MAAM,CAACI,OAAO,EAAEG,QAAQ,CAAC,GAAGX,kBAAkB,CAC5CS,WAAW,EACXG,YAAY,EACZF,cAAc,EACbI,QAAQ,IAAMC,CAAC,IAAK;IACnBD,QAAQ,CAACC,CAAC,CAACC,MAAM,CAACR,OAAO,CAAC;EAC5B,CACF,CAAC;EAED,oBACEN,IAAA,CAACK,IAAI;IACHU,GAAG,EAAEZ,YAAa;IAClBa,IAAI,EAAC,UAAU;IACfV,OAAO,EAAEA,OAAQ;IACjB,gBAAcA,OAAQ;IACtBG,QAAQ,EAAEA,QAAS;IAAA,GACfE;EAAU,CACf,CAAC;AAEN,CACF,CAAC","ignoreList":[]}

package/build/esm/CheckBox/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/CheckBox/index.ts"],"sourcesContent":["export * from './CheckBox';\n"],"mappings":"AAAA,cAAc,YAAd"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/CheckBox/index.ts"],"sourcesContent":["export * from './CheckBox';\n"],"mappings":"AAAA,cAAc,YAAY","ignoreList":[]}

package/build/esm/ComboBox/Combobox.d.ts

@@ -1,6 +1,6 @@
 import type { HTMLAttributes, ReactNode, ElementType } from 'react';
-export declare type SelectEventHandler = (text: string, itemId: string, obj: any) => void;
-export declare type ComboboxProps = Omit<HTMLAttributes<HTMLDivElement>, 'onSelect'> & {
+export type SelectEventHandler = (text: string, itemId: string, obj: any) => void;
+export type ComboboxProps = Omit<HTMLAttributes<HTMLDivElement>, 'onSelect'> & {
     onSelect?: SelectEventHandler;
     openOnFocus?: boolean;
     selectOnBlur?: boolean;
@@ -9,10 +9,10 @@ export declare type ComboboxProps = Omit<HTMLAttributes<HTMLDivElement>, 'onSele
     innerAs?: ElementType<any>;
 };
 export declare const Combobox: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLDivElement>, "onSelect"> & {
-    onSelect?: SelectEventHandler | undefined;
-    openOnFocus?: boolean | undefined;
-    selectOnBlur?: boolean | undefined;
+    onSelect?: SelectEventHandler;
+    openOnFocus?: boolean;
+    selectOnBlur?: boolean;
     children?: ReactNode;
-    as?: ElementType<any> | undefined;
-    innerAs?: ElementType<any> | undefined;
+    as?: ElementType<any>;
+    innerAs?: ElementType<any>;
 } & import("react").RefAttributes<HTMLDivElement>>;

package/build/esm/ComboBox/Combobox.js

@@ -1,49 +1,49 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["onSelect", "openOnFocus", "selectOnBlur", "children", "as", "innerAs"];
 import { forwardRef, useRef, useMemo, useId } from 'react';
 import { stateChart, comboboxReducer, isVisible, INIT } from './hooks';
 import { ComboBoxProvider } from './context';
 import { useReducerMachine } from '../hooks/useReducerMachine';
 import { getScope } from '../hooks';
 import { jsx as _jsx } from "react/jsx-runtime";
-export var Combobox = /*#__PURE__*/forwardRef(function Combobox(_ref, ref) {
-  var onSelect = _ref.onSelect,
-      _ref$openOnFocus = _ref.openOnFocus,
-      openOnFocus = _ref$openOnFocus === void 0 ? false : _ref$openOnFocus,
-      _ref$selectOnBlur = _ref.selectOnBlur,
-      selectOnBlur = _ref$selectOnBlur === void 0 ? false : _ref$selectOnBlur,
-      children = _ref.children,
-      _ref$as = _ref.as,
-      Comp = _ref$as === void 0 ? 'div' : _ref$as,
-      innerAs = _ref.innerAs,
-      rest = _objectWithoutProperties(_ref, _excluded);
-
+export const Combobox = /*#__PURE__*/forwardRef(function Combobox(_ref, ref) {
+  let {
+    // Called whenever the user selects an item from the list
+    onSelect,
+    // opens the list when the input receives focused (but only if there are
+    // items in the list)
+    openOnFocus = false,
+    // if set to true, it will select an item after blurring
+    selectOnBlur = false,
+    children,
+    as: Comp = 'div',
+    innerAs,
+    ...rest
+  } = _ref;
   // We store the values of all the ComboboxOptions on this ref. This makes it
   // possible to perform the keyboard navigation from the input on the list. We
   // manipulate this array through context so that we don't have to enforce a
   // parent/child relationship between ComboboxList and ComboboxOption.
-  var optionsRef = useRef({});
-  var listScope = useRef(getScope({
+  const optionsRef = useRef({});
+  const listScope = useRef(getScope({
     current: null
-  })); // Need this to focus it
+  }));
+
+  // Need this to focus it
+  const inputRef = useRef(null);
+  const popoverRef = useRef(null);
+  const buttonRef = useRef(null);
 
-  var inputRef = useRef(null);
-  var popoverRef = useRef(null);
-  var buttonRef = useRef(null); // When <ComboboxInput autocomplete={false} /> we don't want cycle back to
+  // When <ComboboxInput autocomplete={false} /> we don't want cycle back to
   // the user's value while navigating (because it's always the user's value),
   // but we need to know this in useKeyDown which is far away from the prop
   // here, so we do something sneaky and write it to this ref on context so we
   // can use it anywhere else 😛. Another new trick for me and I'm excited
   // about this one too!
-
-  var autocompletePropRef = useRef(false);
-  var persistSelectionRef = useRef(false);
-  var clearOnEscapeRef = useRef(false);
-  var listboxIdRef = useRef();
-  var labelIdRef = useRef();
-  var defaultData = {
+  const autocompletePropRef = useRef(false);
+  const persistSelectionRef = useRef(false);
+  const clearOnEscapeRef = useRef(false);
+  const listboxIdRef = useRef(undefined);
+  const labelIdRef = useRef(undefined);
+  const defaultData = {
     // initial state
     state: stateChart.initial,
     // the value the user has typed, we derived this also when the developer is
@@ -57,39 +57,32 @@ export var Combobox = /*#__PURE__*/forwardRef(function Combobox(_ref, ref) {
     // the last submitted action
     lastActionType: INIT
   };
-
-  var _useReducerMachine = useReducerMachine(stateChart, comboboxReducer, defaultData),
-      _useReducerMachine2 = _slicedToArray(_useReducerMachine, 3),
-      state = _useReducerMachine2[0],
-      data = _useReducerMachine2[1],
-      transition = _useReducerMachine2[2];
-
+  const [state, data, transition] = useReducerMachine(stateChart, comboboxReducer, defaultData);
   listboxIdRef.current = useId();
   labelIdRef.current = useId();
-  var context = useMemo(function () {
-    return {
-      data: data,
-      inputRef: inputRef,
-      popoverRef: popoverRef,
-      buttonRef: buttonRef,
-      onSelect: onSelect,
-      optionsRef: optionsRef,
-      listScope: listScope,
-      state: state,
-      transition: transition,
-      listboxIdRef: listboxIdRef,
-      labelIdRef: labelIdRef,
-      autocompletePropRef: autocompletePropRef,
-      persistSelectionRef: persistSelectionRef,
-      clearOnEscapeRef: clearOnEscapeRef,
-      isVisible: isVisible(state),
-      openOnFocus: openOnFocus,
-      selectOnBlur: selectOnBlur
-    };
-  }, [data, onSelect, listScope, state, transition, openOnFocus, selectOnBlur]);
+  const context = useMemo(() => ({
+    data,
+    inputRef,
+    popoverRef,
+    buttonRef,
+    onSelect,
+    optionsRef,
+    listScope,
+    state,
+    transition,
+    listboxIdRef,
+    labelIdRef,
+    autocompletePropRef,
+    persistSelectionRef,
+    clearOnEscapeRef,
+    isVisible: isVisible(state),
+    openOnFocus,
+    selectOnBlur
+  }), [data, onSelect, listScope, state, transition, openOnFocus, selectOnBlur]);
   return /*#__PURE__*/_jsx(ComboBoxProvider, {
     value: context,
-    children: /*#__PURE__*/_jsx(Comp, _extends(_extends({}, rest), {}, {
+    children: /*#__PURE__*/_jsx(Comp, {
+      ...rest,
       as: innerAs,
       "data-reach-combobox": "",
       ref: ref,
@@ -98,7 +91,7 @@ export var Combobox = /*#__PURE__*/forwardRef(function Combobox(_ref, ref) {
       "aria-owns": listboxIdRef.current,
       "aria-expanded": context.isVisible,
       children: children
-    }))
+    })
   });
 });
 //# sourceMappingURL=Combobox.js.map

package/build/esm/ComboBox/Combobox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.js","names":["forwardRef","useRef","useMemo","useId","stateChart","comboboxReducer","isVisible","INIT","ComboBoxProvider","useReducerMachine","getScope","Combobox","ref","onSelect","openOnFocus","selectOnBlur","children","as","Comp","innerAs","rest","optionsRef","listScope","current","inputRef","popoverRef","buttonRef","autocompletePropRef","persistSelectionRef","clearOnEscapeRef","listboxIdRef","labelIdRef","defaultData","state","initial","text","item","navigationItem","lastActionType","data","transition","context"],"sources":["../../../src/ComboBox/Combobox.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode, ElementType } from 'react';\nimport { forwardRef, useRef, useMemo, useId } from 'react';\n\nimport type { ActionTypes } from './hooks';\nimport { stateChart, comboboxReducer, isVisible, INIT } from './hooks';\nimport type { ComboBoxContextProps } from './context';\nimport { ComboBoxProvider } from './context';\nimport { useReducerMachine } from '../hooks/useReducerMachine';\nimport type { Scope } from '../hooks';\nimport { getScope } from '../hooks';\n\nexport type SelectEventHandler = (\n  text: string,\n  itemId: string,\n  obj: any\n) => void;\n\nexport type ComboboxProps = Omit<HTMLAttributes<HTMLDivElement>, 'onSelect'> & {\n  onSelect?: SelectEventHandler;\n  openOnFocus?: boolean;\n  selectOnBlur?: boolean;\n  children?: ReactNode;\n  as?: ElementType<any>;\n  innerAs?: ElementType<any>;\n};\n\nexport const Combobox = forwardRef<HTMLDivElement, ComboboxProps>(\n  function Combobox(\n    {\n      // Called whenever the user selects an item from the list\n      onSelect,\n\n      // opens the list when the input receives focused (but only if there are\n      // items in the list)\n      openOnFocus = false,\n\n      // if set to true, it will select an item after blurring\n      selectOnBlur = false,\n\n      children,\n      as: Comp = 'div',\n      innerAs,\n      ...rest\n    }: ComboboxProps,\n    ref\n  ) {\n    // We store the values of all the ComboboxOptions on this ref. This makes it\n    // possible to perform the keyboard navigation from the input on the list. We\n    // manipulate this array through context so that we don't have to enforce a\n    // parent/child relationship between ComboboxList and ComboboxOption.\n    const optionsRef = useRef<{\n      [itemId: string]: {\n        value: string | unknown;\n        text: string;\n      };\n    }>({});\n\n    const listScope: Scope<HTMLElement> = useRef(getScope({ current: null }));\n\n    // Need this to focus it\n    const inputRef = useRef<HTMLInputElement>(null);\n\n    const popoverRef = useRef<HTMLDivElement>(null);\n\n    const buttonRef = useRef<HTMLButtonElement>(null);\n\n    // When <ComboboxInput autocomplete={false} /> we don't want cycle back to\n    // the user's value while navigating (because it's always the user's value),\n    // but we need to know this in useKeyDown which is far away from the prop\n    // here, so we do something sneaky and write it to this ref on context so we\n    // can use it anywhere else 😛. Another new trick for me and I'm excited\n    // about this one too!\n    const autocompletePropRef = useRef<boolean>(false);\n\n    const persistSelectionRef = useRef<boolean>(false);\n\n    const clearOnEscapeRef = useRef<boolean>(false);\n\n    const listboxIdRef = useRef<string | undefined>();\n\n    const labelIdRef = useRef<string | undefined>();\n\n    const defaultData = {\n      // initial state\n      state: stateChart.initial,\n      // the value the user has typed, we derived this also when the developer is\n      // controlling the value of ComboboxInput\n      text: '',\n      // the index the user has typed, we derived this also when the developer is\n      // controlling the value of ComboboxInput\n      item: '',\n      // the hash of the currently navigated item\n      navigationItem: '',\n      // the last submitted action\n      lastActionType: INIT as ActionTypes,\n    };\n\n    const [state, data, transition] = useReducerMachine(\n      stateChart,\n      comboboxReducer,\n      defaultData\n    );\n\n    listboxIdRef.current = useId();\n\n    labelIdRef.current = useId();\n\n    const context = useMemo(\n      (): ComboBoxContextProps => ({\n        data,\n        inputRef,\n        popoverRef,\n        buttonRef,\n        onSelect,\n        optionsRef,\n        listScope,\n        state,\n        transition,\n        listboxIdRef,\n        labelIdRef,\n        autocompletePropRef,\n        persistSelectionRef,\n        clearOnEscapeRef,\n        isVisible: isVisible(state),\n        openOnFocus,\n        selectOnBlur,\n      }),\n      [data, onSelect, listScope, state, transition, openOnFocus, selectOnBlur]\n    );\n\n    return (\n      <ComboBoxProvider value={context}>\n        <Comp\n          {...rest}\n          as={innerAs}\n          data-reach-combobox=\"\"\n          ref={ref}\n          role=\"combobox\"\n          aria-haspopup=\"listbox\"\n          aria-owns={listboxIdRef.current}\n          aria-expanded={context.isVisible}\n        >\n          {children}\n        </Comp>\n      </ComboBoxProvider>\n    );\n  }\n);\n"],"mappings":"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"}
+{"version":3,"file":"Combobox.js","names":["forwardRef","useRef","useMemo","useId","stateChart","comboboxReducer","isVisible","INIT","ComboBoxProvider","useReducerMachine","getScope","jsx","_jsx","Combobox","_ref","ref","onSelect","openOnFocus","selectOnBlur","children","as","Comp","innerAs","rest","optionsRef","listScope","current","inputRef","popoverRef","buttonRef","autocompletePropRef","persistSelectionRef","clearOnEscapeRef","listboxIdRef","undefined","labelIdRef","defaultData","state","initial","text","item","navigationItem","lastActionType","data","transition","context","value","role"],"sources":["../../../src/ComboBox/Combobox.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode, ElementType } from 'react';\nimport { forwardRef, useRef, useMemo, useId } from 'react';\n\nimport type { ActionTypes } from './hooks';\nimport { stateChart, comboboxReducer, isVisible, INIT } from './hooks';\nimport type { ComboBoxContextProps } from './context';\nimport { ComboBoxProvider } from './context';\nimport { useReducerMachine } from '../hooks/useReducerMachine';\nimport type { Scope } from '../hooks';\nimport { getScope } from '../hooks';\n\nexport type SelectEventHandler = (\n  text: string,\n  itemId: string,\n  obj: any\n) => void;\n\nexport type ComboboxProps = Omit<HTMLAttributes<HTMLDivElement>, 'onSelect'> & {\n  onSelect?: SelectEventHandler;\n  openOnFocus?: boolean;\n  selectOnBlur?: boolean;\n  children?: ReactNode;\n  as?: ElementType<any>;\n  innerAs?: ElementType<any>;\n};\n\nexport const Combobox = forwardRef<HTMLDivElement, ComboboxProps>(\n  function Combobox(\n    {\n      // Called whenever the user selects an item from the list\n      onSelect,\n\n      // opens the list when the input receives focused (but only if there are\n      // items in the list)\n      openOnFocus = false,\n\n      // if set to true, it will select an item after blurring\n      selectOnBlur = false,\n\n      children,\n      as: Comp = 'div',\n      innerAs,\n      ...rest\n    }: ComboboxProps,\n    ref\n  ) {\n    // We store the values of all the ComboboxOptions on this ref. This makes it\n    // possible to perform the keyboard navigation from the input on the list. We\n    // manipulate this array through context so that we don't have to enforce a\n    // parent/child relationship between ComboboxList and ComboboxOption.\n    const optionsRef = useRef<{\n      [itemId: string]: {\n        value: string | unknown;\n        text: string;\n      };\n    }>({});\n\n    const listScope: Scope<HTMLElement> = useRef(getScope({ current: null }));\n\n    // Need this to focus it\n    const inputRef = useRef<HTMLInputElement>(null);\n\n    const popoverRef = useRef<HTMLDivElement>(null);\n\n    const buttonRef = useRef<HTMLButtonElement>(null);\n\n    // When <ComboboxInput autocomplete={false} /> we don't want cycle back to\n    // the user's value while navigating (because it's always the user's value),\n    // but we need to know this in useKeyDown which is far away from the prop\n    // here, so we do something sneaky and write it to this ref on context so we\n    // can use it anywhere else 😛. Another new trick for me and I'm excited\n    // about this one too!\n    const autocompletePropRef = useRef<boolean>(false);\n\n    const persistSelectionRef = useRef<boolean>(false);\n\n    const clearOnEscapeRef = useRef<boolean>(false);\n\n    const listboxIdRef = useRef<string | undefined>(undefined);\n\n    const labelIdRef = useRef<string | undefined>(undefined);\n\n    const defaultData = {\n      // initial state\n      state: stateChart.initial,\n      // the value the user has typed, we derived this also when the developer is\n      // controlling the value of ComboboxInput\n      text: '',\n      // the index the user has typed, we derived this also when the developer is\n      // controlling the value of ComboboxInput\n      item: '',\n      // the hash of the currently navigated item\n      navigationItem: '',\n      // the last submitted action\n      lastActionType: INIT as ActionTypes,\n    };\n\n    const [state, data, transition] = useReducerMachine(\n      stateChart,\n      comboboxReducer,\n      defaultData\n    );\n\n    listboxIdRef.current = useId();\n\n    labelIdRef.current = useId();\n\n    const context = useMemo(\n      (): ComboBoxContextProps => ({\n        data,\n        inputRef,\n        popoverRef,\n        buttonRef,\n        onSelect,\n        optionsRef,\n        listScope,\n        state,\n        transition,\n        listboxIdRef,\n        labelIdRef,\n        autocompletePropRef,\n        persistSelectionRef,\n        clearOnEscapeRef,\n        isVisible: isVisible(state),\n        openOnFocus,\n        selectOnBlur,\n      }),\n      [data, onSelect, listScope, state, transition, openOnFocus, selectOnBlur]\n    );\n\n    return (\n      <ComboBoxProvider value={context}>\n        <Comp\n          {...rest}\n          as={innerAs}\n          data-reach-combobox=\"\"\n          ref={ref}\n          role=\"combobox\"\n          aria-haspopup=\"listbox\"\n          aria-owns={listboxIdRef.current}\n          aria-expanded={context.isVisible}\n        >\n          {children}\n        </Comp>\n      </ComboBoxProvider>\n    );\n  }\n);\n"],"mappings":"AACA,SAASA,UAAU,EAAEC,MAAM,EAAEC,OAAO,EAAEC,KAAK,QAAQ,OAAO;AAG1D,SAASC,UAAU,EAAEC,eAAe,EAAEC,SAAS,EAAEC,IAAI,QAAQ,SAAS;AAEtE,SAASC,gBAAgB,QAAQ,WAAW;AAC5C,SAASC,iBAAiB,QAAQ,4BAA4B;AAE9D,SAASC,QAAQ,QAAQ,UAAU;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAiBpC,OAAO,MAAMC,QAAQ,gBAAGb,UAAU,CAChC,SAASa,QAAQA,CAAAC,IAAA,EAiBfC,GAAG,EACH;EAAA,IAjBA;IACE;IACAC,QAAQ;IAER;IACA;IACAC,WAAW,GAAG,KAAK;IAEnB;IACAC,YAAY,GAAG,KAAK;IAEpBC,QAAQ;IACRC,EAAE,EAAEC,IAAI,GAAG,KAAK;IAChBC,OAAO;IACP,GAAGC;EACU,CAAC,GAAAT,IAAA;EAGhB;EACA;EACA;EACA;EACA,MAAMU,UAAU,GAAGvB,MAAM,CAKtB,CAAC,CAAC,CAAC;EAEN,MAAMwB,SAA6B,GAAGxB,MAAM,CAACS,QAAQ,CAAC;IAAEgB,OAAO,EAAE;EAAK,CAAC,CAAC,CAAC;;EAEzE;EACA,MAAMC,QAAQ,GAAG1B,MAAM,CAAmB,IAAI,CAAC;EAE/C,MAAM2B,UAAU,GAAG3B,MAAM,CAAiB,IAAI,CAAC;EAE/C,MAAM4B,SAAS,GAAG5B,MAAM,CAAoB,IAAI,CAAC;;EAEjD;EACA;EACA;EACA;EACA;EACA;EACA,MAAM6B,mBAAmB,GAAG7B,MAAM,CAAU,KAAK,CAAC;EAElD,MAAM8B,mBAAmB,GAAG9B,MAAM,CAAU,KAAK,CAAC;EAElD,MAAM+B,gBAAgB,GAAG/B,MAAM,CAAU,KAAK,CAAC;EAE/C,MAAMgC,YAAY,GAAGhC,MAAM,CAAqBiC,SAAS,CAAC;EAE1D,MAAMC,UAAU,GAAGlC,MAAM,CAAqBiC,SAAS,CAAC;EAExD,MAAME,WAAW,GAAG;IAClB;IACAC,KAAK,EAAEjC,UAAU,CAACkC,OAAO;IACzB;IACA;IACAC,IAAI,EAAE,EAAE;IACR;IACA;IACAC,IAAI,EAAE,EAAE;IACR;IACAC,cAAc,EAAE,EAAE;IAClB;IACAC,cAAc,EAAEnC;EAClB,CAAC;EAED,MAAM,CAAC8B,KAAK,EAAEM,IAAI,EAAEC,UAAU,CAAC,GAAGnC,iBAAiB,CACjDL,UAAU,EACVC,eAAe,EACf+B,WACF,CAAC;EAEDH,YAAY,CAACP,OAAO,GAAGvB,KAAK,CAAC,CAAC;EAE9BgC,UAAU,CAACT,OAAO,GAAGvB,KAAK,CAAC,CAAC;EAE5B,MAAM0C,OAAO,GAAG3C,OAAO,CACrB,OAA6B;IAC3ByC,IAAI;IACJhB,QAAQ;IACRC,UAAU;IACVC,SAAS;IACTb,QAAQ;IACRQ,UAAU;IACVC,SAAS;IACTY,KAAK;IACLO,UAAU;IACVX,YAAY;IACZE,UAAU;IACVL,mBAAmB;IACnBC,mBAAmB;IACnBC,gBAAgB;IAChB1B,SAAS,EAAEA,SAAS,CAAC+B,KAAK,CAAC;IAC3BpB,WAAW;IACXC;EACF,CAAC,CAAC,EACF,CAACyB,IAAI,EAAE3B,QAAQ,EAAES,SAAS,EAAEY,KAAK,EAAEO,UAAU,EAAE3B,WAAW,EAAEC,YAAY,CAC1E,CAAC;EAED,oBACEN,IAAA,CAACJ,gBAAgB;IAACsC,KAAK,EAAED,OAAQ;IAAA1B,QAAA,eAC/BP,IAAA,CAACS,IAAI;MAAA,GACCE,IAAI;MACRH,EAAE,EAAEE,OAAQ;MACZ,uBAAoB,EAAE;MACtBP,GAAG,EAAEA,GAAI;MACTgC,IAAI,EAAC,UAAU;MACf,iBAAc,SAAS;MACvB,aAAWd,YAAY,CAACP,OAAQ;MAChC,iBAAemB,OAAO,CAACvC,SAAU;MAAAa,QAAA,EAEhCA;IAAQ,CACL;EAAC,CACS,CAAC;AAEvB,CACF,CAAC","ignoreList":[]}

package/build/esm/ComboBox/ComboboxButton.js

@@ -1,43 +1,37 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["as", "innerAs", "onClick", "onKeyDown"];
 import { forwardRef } from 'react';
 import { useComboBoxContext } from './context';
 import { useKeyDown, IDLE, OPEN_WITH_BUTTON, CLOSE_WITH_BUTTON } from './hooks';
 import { wrapEvent } from '../utils/wrap-event';
 import { assignMultipleRefs } from '../utils/assign-ref';
 import { jsx as _jsx } from "react/jsx-runtime";
-export var ComboboxButton = /*#__PURE__*/forwardRef(function ComboboxButton(_ref, ref) {
-  var _ref$as = _ref.as,
-      Comp = _ref$as === void 0 ? 'button' : _ref$as,
-      innerAs = _ref.innerAs,
-      onClick = _ref.onClick,
-      onKeyDown = _ref.onKeyDown,
-      props = _objectWithoutProperties(_ref, _excluded);
-
-  var _useComboBoxContext = useComboBoxContext(),
-      transition = _useComboBoxContext.transition,
-      data = _useComboBoxContext.data,
-      state = _useComboBoxContext.state,
-      buttonRef = _useComboBoxContext.buttonRef,
-      listboxIdRef = _useComboBoxContext.listboxIdRef,
-      isVisible = _useComboBoxContext.isVisible;
-
-  var handleKeyDown = useKeyDown();
-
-  var handleClick = function handleClick() {
-    var payload = {
+export const ComboboxButton = /*#__PURE__*/forwardRef(function ComboboxButton(_ref, ref) {
+  let {
+    as: Comp = 'button',
+    innerAs,
+    onClick,
+    onKeyDown,
+    ...props
+  } = _ref;
+  const {
+    transition,
+    data,
+    state,
+    buttonRef,
+    listboxIdRef,
+    isVisible
+  } = useComboBoxContext();
+  const handleKeyDown = useKeyDown();
+  const handleClick = () => {
+    const payload = {
       item: data.navigationItem
     };
-
     if (state === IDLE) {
       transition(OPEN_WITH_BUTTON, payload);
     } else {
       transition(CLOSE_WITH_BUTTON, payload);
     }
   };
-
-  return /*#__PURE__*/_jsx(Comp, _extends({
+  return /*#__PURE__*/_jsx(Comp, {
     as: innerAs,
     "data-reach-combobox-button": "",
     "aria-controls": listboxIdRef.current,
@@ -45,7 +39,8 @@ export var ComboboxButton = /*#__PURE__*/forwardRef(function ComboboxButton(_ref
     "aria-expanded": isVisible,
     ref: assignMultipleRefs(ref, buttonRef),
     onClick: wrapEvent(onClick, handleClick),
-    onKeyDown: wrapEvent(onKeyDown, handleKeyDown)
-  }, props));
+    onKeyDown: wrapEvent(onKeyDown, handleKeyDown),
+    ...props
+  });
 });
 //# sourceMappingURL=ComboboxButton.js.map

package/build/esm/ComboBox/ComboboxButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxButton.js","names":["forwardRef","useComboBoxContext","useKeyDown","IDLE","OPEN_WITH_BUTTON","CLOSE_WITH_BUTTON","wrapEvent","assignMultipleRefs","ComboboxButton","ref","as","Comp","innerAs","onClick","onKeyDown","props","transition","data","state","buttonRef","listboxIdRef","isVisible","handleKeyDown","handleClick","payload","item","navigationItem","current"],"sources":["../../../src/ComboBox/ComboboxButton.tsx"],"sourcesContent":["import type {\n  ButtonHTMLAttributes,\n  ElementType,\n  KeyboardEventHandler,\n  MouseEventHandler,\n  ReactNode,\n} from 'react';\nimport { forwardRef } from 'react';\n\nimport { useComboBoxContext } from './context';\nimport { useKeyDown, IDLE, OPEN_WITH_BUTTON, CLOSE_WITH_BUTTON } from './hooks';\nimport { wrapEvent } from '../utils/wrap-event';\nimport { assignMultipleRefs } from '../utils/assign-ref';\n\nexport interface ComboboxButtonProps\n  extends ButtonHTMLAttributes<HTMLButtonElement> {\n  as?: ElementType<any>;\n  innerAs?: ElementType<any>;\n  onClick?: MouseEventHandler<HTMLButtonElement>;\n  onKeyDown?: KeyboardEventHandler<HTMLButtonElement>;\n  children?: ReactNode;\n}\n\nexport const ComboboxButton = forwardRef<\n  HTMLButtonElement,\n  ComboboxButtonProps\n>(function ComboboxButton(\n  { as: Comp = 'button', innerAs, onClick, onKeyDown, ...props },\n  ref\n) {\n  const { transition, data, state, buttonRef, listboxIdRef, isVisible } =\n    useComboBoxContext();\n\n  const handleKeyDown = useKeyDown();\n\n  const handleClick = () => {\n    const payload = {\n      item: data.navigationItem,\n    };\n\n    if (state === IDLE) {\n      transition(OPEN_WITH_BUTTON, payload);\n    } else {\n      transition(CLOSE_WITH_BUTTON, payload);\n    }\n  };\n\n  return (\n    <Comp\n      as={innerAs}\n      data-reach-combobox-button=\"\"\n      aria-controls={listboxIdRef.current}\n      aria-haspopup=\"listbox\"\n      aria-expanded={isVisible}\n      ref={assignMultipleRefs(ref, buttonRef)}\n      onClick={wrapEvent(onClick, handleClick)}\n      onKeyDown={wrapEvent(onKeyDown, handleKeyDown)}\n      {...props}\n    />\n  );\n});\n"],"mappings":";;;AAOA,SAASA,UAAT,QAA2B,OAA3B;AAEA,SAASC,kBAAT,QAAmC,WAAnC;AACA,SAASC,UAAT,EAAqBC,IAArB,EAA2BC,gBAA3B,EAA6CC,iBAA7C,QAAsE,SAAtE;AACA,SAASC,SAAT,QAA0B,qBAA1B;AACA,SAASC,kBAAT,QAAmC,qBAAnC;;AAWA,OAAO,IAAMC,cAAc,gBAAGR,UAAU,CAGtC,SAASQ,cAAT,OAEAC,GAFA,EAGA;EAAA,mBAFEC,EAEF;EAAA,IAFMC,IAEN,wBAFa,QAEb;EAAA,IAFuBC,OAEvB,QAFuBA,OAEvB;EAAA,IAFgCC,OAEhC,QAFgCA,OAEhC;EAAA,IAFyCC,SAEzC,QAFyCA,SAEzC;EAAA,IAFuDC,KAEvD;;EACA,0BACEd,kBAAkB,EADpB;EAAA,IAAQe,UAAR,uBAAQA,UAAR;EAAA,IAAoBC,IAApB,uBAAoBA,IAApB;EAAA,IAA0BC,KAA1B,uBAA0BA,KAA1B;EAAA,IAAiCC,SAAjC,uBAAiCA,SAAjC;EAAA,IAA4CC,YAA5C,uBAA4CA,YAA5C;EAAA,IAA0DC,SAA1D,uBAA0DA,SAA1D;;EAGA,IAAMC,aAAa,GAAGpB,UAAU,EAAhC;;EAEA,IAAMqB,WAAW,GAAG,SAAdA,WAAc,GAAM;IACxB,IAAMC,OAAO,GAAG;MACdC,IAAI,EAAER,IAAI,CAACS;IADG,CAAhB;;IAIA,IAAIR,KAAK,KAAKf,IAAd,EAAoB;MAClBa,UAAU,CAACZ,gBAAD,EAAmBoB,OAAnB,CAAV;IACD,CAFD,MAEO;MACLR,UAAU,CAACX,iBAAD,EAAoBmB,OAApB,CAAV;IACD;EACF,CAVD;;EAYA,oBACE,KAAC,IAAD;IACE,EAAE,EAAEZ,OADN;IAEE,8BAA2B,EAF7B;IAGE,iBAAeQ,YAAY,CAACO,OAH9B;IAIE,iBAAc,SAJhB;IAKE,iBAAeN,SALjB;IAME,GAAG,EAAEd,kBAAkB,CAACE,GAAD,EAAMU,SAAN,CANzB;IAOE,OAAO,EAAEb,SAAS,CAACO,OAAD,EAAUU,WAAV,CAPpB;IAQE,SAAS,EAAEjB,SAAS,CAACQ,SAAD,EAAYQ,aAAZ;EARtB,GASMP,KATN,EADF;AAaD,CArCuC,CAAjC"}
+{"version":3,"file":"ComboboxButton.js","names":["forwardRef","useComboBoxContext","useKeyDown","IDLE","OPEN_WITH_BUTTON","CLOSE_WITH_BUTTON","wrapEvent","assignMultipleRefs","jsx","_jsx","ComboboxButton","_ref","ref","as","Comp","innerAs","onClick","onKeyDown","props","transition","data","state","buttonRef","listboxIdRef","isVisible","handleKeyDown","handleClick","payload","item","navigationItem","current"],"sources":["../../../src/ComboBox/ComboboxButton.tsx"],"sourcesContent":["import type {\n  ButtonHTMLAttributes,\n  ElementType,\n  KeyboardEventHandler,\n  MouseEventHandler,\n  ReactNode,\n} from 'react';\nimport { forwardRef } from 'react';\n\nimport { useComboBoxContext } from './context';\nimport { useKeyDown, IDLE, OPEN_WITH_BUTTON, CLOSE_WITH_BUTTON } from './hooks';\nimport { wrapEvent } from '../utils/wrap-event';\nimport { assignMultipleRefs } from '../utils/assign-ref';\n\nexport interface ComboboxButtonProps\n  extends ButtonHTMLAttributes<HTMLButtonElement> {\n  as?: ElementType<any>;\n  innerAs?: ElementType<any>;\n  onClick?: MouseEventHandler<HTMLButtonElement>;\n  onKeyDown?: KeyboardEventHandler<HTMLButtonElement>;\n  children?: ReactNode;\n}\n\nexport const ComboboxButton = forwardRef<\n  HTMLButtonElement,\n  ComboboxButtonProps\n>(function ComboboxButton(\n  { as: Comp = 'button', innerAs, onClick, onKeyDown, ...props },\n  ref\n) {\n  const { transition, data, state, buttonRef, listboxIdRef, isVisible } =\n    useComboBoxContext();\n\n  const handleKeyDown = useKeyDown();\n\n  const handleClick = () => {\n    const payload = {\n      item: data.navigationItem,\n    };\n\n    if (state === IDLE) {\n      transition(OPEN_WITH_BUTTON, payload);\n    } else {\n      transition(CLOSE_WITH_BUTTON, payload);\n    }\n  };\n\n  return (\n    <Comp\n      as={innerAs}\n      data-reach-combobox-button=\"\"\n      aria-controls={listboxIdRef.current}\n      aria-haspopup=\"listbox\"\n      aria-expanded={isVisible}\n      ref={assignMultipleRefs(ref, buttonRef)}\n      onClick={wrapEvent(onClick, handleClick)}\n      onKeyDown={wrapEvent(onKeyDown, handleKeyDown)}\n      {...props}\n    />\n  );\n});\n"],"mappings":"AAOA,SAASA,UAAU,QAAQ,OAAO;AAElC,SAASC,kBAAkB,QAAQ,WAAW;AAC9C,SAASC,UAAU,EAAEC,IAAI,EAAEC,gBAAgB,EAAEC,iBAAiB,QAAQ,SAAS;AAC/E,SAASC,SAAS,QAAQ,qBAAqB;AAC/C,SAASC,kBAAkB,QAAQ,qBAAqB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAWzD,OAAO,MAAMC,cAAc,gBAAGV,UAAU,CAGtC,SAASU,cAAcA,CAAAC,IAAA,EAEvBC,GAAG,EACH;EAAA,IAFA;IAAEC,EAAE,EAAEC,IAAI,GAAG,QAAQ;IAAEC,OAAO;IAAEC,OAAO;IAAEC,SAAS;IAAE,GAAGC;EAAM,CAAC,GAAAP,IAAA;EAG9D,MAAM;IAAEQ,UAAU;IAAEC,IAAI;IAAEC,KAAK;IAAEC,SAAS;IAAEC,YAAY;IAAEC;EAAU,CAAC,GACnEvB,kBAAkB,CAAC,CAAC;EAEtB,MAAMwB,aAAa,GAAGvB,UAAU,CAAC,CAAC;EAElC,MAAMwB,WAAW,GAAGA,CAAA,KAAM;IACxB,MAAMC,OAAO,GAAG;MACdC,IAAI,EAAER,IAAI,CAACS;IACb,CAAC;IAED,IAAIR,KAAK,KAAKlB,IAAI,EAAE;MAClBgB,UAAU,CAACf,gBAAgB,EAAEuB,OAAO,CAAC;IACvC,CAAC,MAAM;MACLR,UAAU,CAACd,iBAAiB,EAAEsB,OAAO,CAAC;IACxC;EACF,CAAC;EAED,oBACElB,IAAA,CAACK,IAAI;IACHD,EAAE,EAAEE,OAAQ;IACZ,8BAA2B,EAAE;IAC7B,iBAAeQ,YAAY,CAACO,OAAQ;IACpC,iBAAc,SAAS;IACvB,iBAAeN,SAAU;IACzBZ,GAAG,EAAEL,kBAAkB,CAACK,GAAG,EAAEU,SAAS,CAAE;IACxCN,OAAO,EAAEV,SAAS,CAACU,OAAO,EAAEU,WAAW,CAAE;IACzCT,SAAS,EAAEX,SAAS,CAACW,SAAS,EAAEQ,aAAa,CAAE;IAAA,GAC3CP;EAAK,CACV,CAAC;AAEN,CAAC,CAAC","ignoreList":[]}

package/build/esm/ComboBox/ComboboxInput.js

@@ -1,117 +1,114 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["as", "innerAs", "selectOnClick", "autocomplete", "clearOnEscape", "onClick", "onChange", "onKeyDown", "onBlur", "onFocus", "id", "defaultValue", "value"];
 import { forwardRef, useEffect, useRef } from 'react';
 import { useBlur, CLEAR, CHANGE, useKeyDown, SELECT_WITH_CLICK, FOCUS, NAVIGATING, INIT, useFocusManagement } from './hooks';
 import { assignMultipleRefs, wrapEvent } from '../utils';
 import { useComboBoxContext } from './context';
 import { jsx as _jsx } from "react/jsx-runtime";
-export var ComboboxInput = /*#__PURE__*/forwardRef(function ComboboxInput(_ref, forwardedRef) {
-  var _ref$as = _ref.as,
-      Comp = _ref$as === void 0 ? 'input' : _ref$as,
-      innerAs = _ref.innerAs,
-      _ref$selectOnClick = _ref.selectOnClick,
-      selectOnClick = _ref$selectOnClick === void 0 ? false : _ref$selectOnClick,
-      _ref$autocomplete = _ref.autocomplete,
-      autocomplete = _ref$autocomplete === void 0 ? true : _ref$autocomplete,
-      _ref$clearOnEscape = _ref.clearOnEscape,
-      clearOnEscape = _ref$clearOnEscape === void 0 ? false : _ref$clearOnEscape,
-      onClick = _ref.onClick,
-      onChange = _ref.onChange,
-      onKeyDown = _ref.onKeyDown,
-      onBlur = _ref.onBlur,
-      onFocus = _ref.onFocus,
-      preferredId = _ref.id,
-      _ref$defaultValue = _ref.defaultValue,
-      defaultValue = _ref$defaultValue === void 0 ? '' : _ref$defaultValue,
-      controlledValue = _ref.value,
-      props = _objectWithoutProperties(_ref, _excluded);
+export const ComboboxInput = /*#__PURE__*/forwardRef(function ComboboxInput(_ref, forwardedRef) {
+  let {
+    as: Comp = 'input',
+    innerAs,
+    selectOnClick = false,
+    autocomplete = true,
+    clearOnEscape = false,
+    // wrapped events
+    onClick,
+    onChange,
+    onKeyDown,
+    onBlur,
+    onFocus,
+    id: preferredId,
+    defaultValue = '',
+    // might be controlled
+    value: controlledValue,
+    ...props
+  } = _ref;
+  const {
+    data: {
+      navigationItem,
+      text,
+      lastActionType
+    },
+    inputRef,
+    state,
+    transition,
+    listboxIdRef,
+    autocompletePropRef,
+    clearOnEscapeRef,
+    openOnFocus,
+    optionsRef,
+    labelIdRef
+  } = useComboBoxContext();
 
-  var _useComboBoxContext = useComboBoxContext(),
-      _useComboBoxContext$d = _useComboBoxContext.data,
-      navigationItem = _useComboBoxContext$d.navigationItem,
-      text = _useComboBoxContext$d.text,
-      lastActionType = _useComboBoxContext$d.lastActionType,
-      inputRef = _useComboBoxContext.inputRef,
-      state = _useComboBoxContext.state,
-      transition = _useComboBoxContext.transition,
-      listboxIdRef = _useComboBoxContext.listboxIdRef,
-      autocompletePropRef = _useComboBoxContext.autocompletePropRef,
-      clearOnEscapeRef = _useComboBoxContext.clearOnEscapeRef,
-      openOnFocus = _useComboBoxContext.openOnFocus,
-      optionsRef = _useComboBoxContext.optionsRef,
-      labelIdRef = _useComboBoxContext.labelIdRef; // Keep focus on the input component
+  // Keep focus on the input component
+  useFocusManagement(lastActionType, inputRef);
 
+  // Keep using the defaultValue until the user started interacting
+  const hasStartedInteracting = useRef(false);
 
-  useFocusManagement(lastActionType, inputRef); // Keep using the defaultValue until the user started interacting
-
-  var hasStartedInteracting = useRef(false); // Because we close the List on blur, we need to track if the blur is
+  // Because we close the List on blur, we need to track if the blur is
   // caused by clicking inside the list, and if so, don't close the List.
+  const selectOnClickRef = useRef(false);
+  const handleBlur = useBlur();
 
-  var selectOnClickRef = useRef(false);
-  var handleBlur = useBlur(); // Update ref props
-
+  // Update ref props
   autocompletePropRef.current = autocomplete;
   clearOnEscapeRef.current = clearOnEscape;
-  listboxIdRef.current = preferredId || listboxIdRef.current; // [*]... and when controlled, we don't trigger handleValueChange as the user
+  listboxIdRef.current = preferredId || listboxIdRef.current;
+
+  // [*]... and when controlled, we don't trigger handleValueChange as the user
   // types, instead the developer controls it with the normal input onChange
   // prop
-
-  var handleChange = function handleChange(e) {
+  const handleChange = e => {
     // After the user started typing, lets forget the defaultValue
     hasStartedInteracting.current = true;
-    var text = e.target.value;
-
+    const text = e.target.value;
     if (text.trim() === '') {
       transition(CLEAR);
     } else {
       transition(CHANGE, {
-        text: text
+        text
       });
     }
   };
-
-  var handleKeyDown = useKeyDown();
-
-  var handleFocus = function handleFocus() {
+  const handleKeyDown = useKeyDown();
+  const handleFocus = () => {
     if (selectOnClick) {
       selectOnClickRef.current = true;
-    } // If we select an option with click, useFocusManagement will focus the
+    }
+    // If we select an option with click, useFocusManagement will focus the
     // input, in those cases we don't want to cause the menu to open back up,
     // so we guard behind these states
-
-
     if (openOnFocus && lastActionType !== SELECT_WITH_CLICK) {
       transition(FOCUS, {
         item: navigationItem
       });
     }
   };
-
-  var handleClick = function handleClick() {
+  const handleClick = () => {
     if (selectOnClickRef.current) {
       selectOnClickRef.current = false;
       inputRef.current && inputRef.current.select();
     }
   };
-
-  var navigationText = navigationItem !== '' ? optionsRef.current[navigationItem].text : undefined;
-  var fallbackValue = hasStartedInteracting.current ? '' : defaultValue;
-  var inputStrings = // When idle, we don't have a navigationText on ArrowUp/Down
+  const navigationText = navigationItem !== '' ? optionsRef.current[navigationItem].text : undefined;
+  const fallbackValue = hasStartedInteracting.current ? '' : defaultValue;
+  const inputStrings =
+  // When idle, we don't have a navigationText on ArrowUp/Down
   autocomplete && state === NAVIGATING ? [navigationText, controlledValue, text, fallbackValue] : [controlledValue, text, fallbackValue];
-  var inputValue = inputStrings.find(function (str) {
-    return str !== undefined;
-  }); // If they are controlling the value we still need to do our transitions, so
+  const inputValue = inputStrings.find(str => str !== undefined);
+
+  // If they are controlling the value we still need to do our transitions, so
   // we have this derived state to emulate onChange of the input as we receive
   // new `value`s ...[*]
-
-  useEffect(function () {
+  useEffect(() => {
     transition(INIT, {
       text: inputValue,
       item: ''
-    }); // eslint-disable-next-line react-hooks/exhaustive-deps
+    });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
-  return /*#__PURE__*/_jsx(Comp, _extends(_extends({}, props), {}, {
+  return /*#__PURE__*/_jsx(Comp, {
+    ...props,
     as: innerAs,
     "data-reach-combobox-input": "",
     ref: assignMultipleRefs(inputRef, forwardedRef),
@@ -126,6 +123,6 @@ export var ComboboxInput = /*#__PURE__*/forwardRef(function ComboboxInput(_ref,
     "aria-autocomplete": "both",
     "aria-activedescendant": navigationItem !== '' ? navigationItem : undefined,
     autoComplete: "off"
-  }));
+  });
 });
 //# sourceMappingURL=ComboboxInput.js.map