@basic-ui/core 0.0.54 → 0.0.56

package/build/esm/Accordion/context.js

@@ -1,15 +1,18 @@
 import { useContext, createContext } from 'react';
-var accordionContext = /*#__PURE__*/createContext(null);
-var AccordionProvider = accordionContext.Provider;
-export { AccordionProvider };
-export var useAccordionContext = function useAccordionContext() {
-  return useContext(accordionContext);
-}; // Accordion Component
-
-var accordionItemContext = /*#__PURE__*/createContext(null);
-var AccordionItemProvider = accordionItemContext.Provider;
-export { AccordionItemProvider };
-export var useAccordionItemContext = function useAccordionItemContext() {
-  return useContext(accordionItemContext);
-};
+
+// AccordionGroup Component
+
+const accordionContext = /*#__PURE__*/createContext(null);
+export const {
+  Provider: AccordionProvider
+} = accordionContext;
+export const useAccordionContext = () => useContext(accordionContext);
+
+// Accordion Component
+
+const accordionItemContext = /*#__PURE__*/createContext(null);
+export const {
+  Provider: AccordionItemProvider
+} = accordionItemContext;
+export const useAccordionItemContext = () => useContext(accordionItemContext);
 //# sourceMappingURL=context.js.map

package/build/esm/Accordion/context.js.map

@@ -1 +1 @@
-{"version":3,"file":"context.js","names":["useContext","createContext","accordionContext","AccordionProvider","Provider","useAccordionContext","accordionItemContext","AccordionItemProvider","useAccordionItemContext"],"sources":["../../../src/Accordion/context.ts"],"sourcesContent":["import type { KeyboardEvent, MouseEvent } from 'react';\r\nimport { useContext, createContext } from 'react';\r\n\r\nimport type { Scope } from '../hooks/useScope';\r\n\r\n// AccordionGroup Component\r\nexport interface AccordionContextProps {\r\n  childrenHeaderHasFocus: boolean;\r\n  setChildrenHeaderHasFocus: (value: boolean) => void;\r\n  scope: Scope<HTMLElement>;\r\n  expandedIndex: number;\r\n  onChange?: (\r\n    e: KeyboardEvent<HTMLDivElement> | MouseEvent<HTMLDivElement>,\r\n    index: number\r\n  ) => void;\r\n}\r\n\r\nconst accordionContext = createContext<AccordionContextProps | null>(null);\r\nexport const { Provider: AccordionProvider } = accordionContext;\r\nexport const useAccordionContext = () => useContext(accordionContext);\r\n\r\n// Accordion Component\r\nexport interface AccordionItemContextProps {\r\n  headerId: string | undefined;\r\n  bodyId: string | undefined;\r\n  expanded: boolean;\r\n  onChange?: (\r\n    e: KeyboardEvent<HTMLDivElement> | MouseEvent<HTMLDivElement>,\r\n    value: boolean\r\n  ) => void;\r\n}\r\n\r\nconst accordionItemContext = createContext<AccordionItemContextProps | null>(\r\n  null\r\n);\r\nexport const { Provider: AccordionItemProvider } = accordionItemContext;\r\nexport const useAccordionItemContext = () => useContext(accordionItemContext);\r\n"],"mappings":"AACA,SAASA,UAAT,EAAqBC,aAArB,QAA0C,OAA1C;AAgBA,IAAMC,gBAAgB,gBAAGD,aAAa,CAA+B,IAA/B,CAAtC;AACO,IAAkBE,iBAAlB,GAAwCD,gBAAxC,CAAQE,QAAR;;AACP,OAAO,IAAMC,mBAAmB,GAAG,SAAtBA,mBAAsB;EAAA,OAAML,UAAU,CAACE,gBAAD,CAAhB;AAAA,CAA5B,C,CAEP;;AAWA,IAAMI,oBAAoB,gBAAGL,aAAa,CACxC,IADwC,CAA1C;AAGO,IAAkBM,qBAAlB,GAA4CD,oBAA5C,CAAQF,QAAR;;AACP,OAAO,IAAMI,uBAAuB,GAAG,SAA1BA,uBAA0B;EAAA,OAAMR,UAAU,CAACM,oBAAD,CAAhB;AAAA,CAAhC"}
+{"version":3,"file":"context.js","names":["useContext","createContext","accordionContext","Provider","AccordionProvider","useAccordionContext","accordionItemContext","AccordionItemProvider","useAccordionItemContext"],"sources":["../../../src/Accordion/context.ts"],"sourcesContent":["import type { KeyboardEvent, MouseEvent } from 'react';\nimport { useContext, createContext } from 'react';\n\nimport type { Scope } from '../hooks/useScope';\n\n// AccordionGroup Component\nexport interface AccordionContextProps {\n  childrenHeaderHasFocus: boolean;\n  setChildrenHeaderHasFocus: (value: boolean) => void;\n  scope: Scope<HTMLElement>;\n  expandedIndex: number;\n  onChange?: (\n    e: KeyboardEvent<HTMLDivElement> | MouseEvent<HTMLDivElement>,\n    index: number\n  ) => void;\n}\n\nconst accordionContext = createContext<AccordionContextProps | null>(null);\nexport const { Provider: AccordionProvider } = accordionContext;\nexport const useAccordionContext = () => useContext(accordionContext);\n\n// Accordion Component\nexport interface AccordionItemContextProps {\n  headerId: string | undefined;\n  bodyId: string | undefined;\n  expanded: boolean;\n  onChange?: (\n    e: KeyboardEvent<HTMLDivElement> | MouseEvent<HTMLDivElement>,\n    value: boolean\n  ) => void;\n}\n\nconst accordionItemContext = createContext<AccordionItemContextProps | null>(\n  null\n);\nexport const { Provider: AccordionItemProvider } = accordionItemContext;\nexport const useAccordionItemContext = () => useContext(accordionItemContext);\n"],"mappings":"AACA,SAASA,UAAU,EAAEC,aAAa,QAAQ,OAAO;;AAIjD;;AAYA,MAAMC,gBAAgB,gBAAGD,aAAa,CAA+B,IAAI,CAAC;AAC1E,OAAO,MAAM;EAAEE,QAAQ,EAAEC;AAAkB,CAAC,GAAGF,gBAAgB;AAC/D,OAAO,MAAMG,mBAAmB,GAAGA,CAAA,KAAML,UAAU,CAACE,gBAAgB,CAAC;;AAErE;;AAWA,MAAMI,oBAAoB,gBAAGL,aAAa,CACxC,IACF,CAAC;AACD,OAAO,MAAM;EAAEE,QAAQ,EAAEI;AAAsB,CAAC,GAAGD,oBAAoB;AACvE,OAAO,MAAME,uBAAuB,GAAGA,CAAA,KAAMR,UAAU,CAACM,oBAAoB,CAAC","ignoreList":[]}

package/build/esm/Accordion/index.d.ts

@@ -1,4 +1,4 @@
-export * from './Accordion';
-export * from './AccordionItem';
-export * from './AccordionHeader';
-export * from './AccordionBody';
+export * from './Accordion';
+export * from './AccordionItem';
+export * from './AccordionHeader';
+export * from './AccordionBody';

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/Accordion/index.ts"],"sourcesContent":["export * from './Accordion';\r\nexport * from './AccordionItem';\r\nexport * from './AccordionHeader';\r\nexport * from './AccordionBody';\r\n"],"mappings":"AAAA,cAAc,aAAd;AACA,cAAc,iBAAd;AACA,cAAc,mBAAd;AACA,cAAc,iBAAd"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/Accordion/index.ts"],"sourcesContent":["export * from './Accordion';\nexport * from './AccordionItem';\nexport * from './AccordionHeader';\nexport * from './AccordionBody';\n"],"mappings":"AAAA,cAAc,aAAa;AAC3B,cAAc,iBAAiB;AAC/B,cAAc,mBAAmB;AACjC,cAAc,iBAAiB","ignoreList":[]}

package/build/esm/Accordion/scopeQuery.d.ts

@@ -1,2 +1,2 @@
-export declare function headerScopeQuery(type: string, props: Record<string, unknown>): boolean;
-export declare function bodyScopeQuery(type: string, props: Record<string, unknown>): boolean;
+export declare function headerScopeQuery(type: string, props: Record<string, unknown>): boolean;
+export declare function bodyScopeQuery(type: string, props: Record<string, unknown>): boolean;

package/build/esm/Accordion/scopeQuery.js.map

@@ -1 +1 @@
-{"version":3,"file":"scopeQuery.js","names":["headerScopeQuery","type","props","bodyScopeQuery"],"sources":["../../../src/Accordion/scopeQuery.ts"],"sourcesContent":["export function headerScopeQuery(type: string, props: Record<string, unknown>) {\r\n  return props['data-accordion-header'] === '';\r\n}\r\n\r\nexport function bodyScopeQuery(type: string, props: Record<string, unknown>) {\r\n  return props['data-accordion-body'] === '';\r\n}\r\n"],"mappings":"AAAA,OAAO,SAASA,gBAAT,CAA0BC,IAA1B,EAAwCC,KAAxC,EAAwE;EAC7E,OAAOA,KAAK,CAAC,uBAAD,CAAL,KAAmC,EAA1C;AACD;AAED,OAAO,SAASC,cAAT,CAAwBF,IAAxB,EAAsCC,KAAtC,EAAsE;EAC3E,OAAOA,KAAK,CAAC,qBAAD,CAAL,KAAiC,EAAxC;AACD"}
+{"version":3,"file":"scopeQuery.js","names":["headerScopeQuery","type","props","bodyScopeQuery"],"sources":["../../../src/Accordion/scopeQuery.ts"],"sourcesContent":["export function headerScopeQuery(type: string, props: Record<string, unknown>) {\n  return props['data-accordion-header'] === '';\n}\n\nexport function bodyScopeQuery(type: string, props: Record<string, unknown>) {\n  return props['data-accordion-body'] === '';\n}\n"],"mappings":"AAAA,OAAO,SAASA,gBAAgBA,CAACC,IAAY,EAAEC,KAA8B,EAAE;EAC7E,OAAOA,KAAK,CAAC,uBAAuB,CAAC,KAAK,EAAE;AAC9C;AAEA,OAAO,SAASC,cAAcA,CAACF,IAAY,EAAEC,KAA8B,EAAE;EAC3E,OAAOA,KAAK,CAAC,qBAAqB,CAAC,KAAK,EAAE;AAC5C","ignoreList":[]}

package/build/esm/CheckBox/CheckBox.d.ts

@@ -1,7 +1,7 @@
-import type { ElementType, InputHTMLAttributes, ReactNode } from 'react';
-export interface CheckBoxProps extends InputHTMLAttributes<HTMLInputElement> {
-    as?: ElementType<any>;
-    innerAs?: ElementType<any>;
-    children?: ReactNode;
-}
-export declare const CheckBox: import("react").ForwardRefExoticComponent<CheckBoxProps & import("react").RefAttributes<HTMLInputElement>>;
+import type { ElementType, InputHTMLAttributes, ReactNode } from 'react';
+export interface CheckBoxProps extends InputHTMLAttributes<HTMLInputElement> {
+    as?: ElementType<any>;
+    innerAs?: ElementType<any>;
+    children?: ReactNode;
+}
+export declare const CheckBox: import("react").ForwardRefExoticComponent<CheckBoxProps & import("react").RefAttributes<HTMLInputElement>>;

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';\r\nimport { forwardRef } from 'react';\r\n\r\nimport { useControlledState } from '../hooks';\r\n\r\nexport interface CheckBoxProps extends InputHTMLAttributes<HTMLInputElement> {\r\n  as?: ElementType<any>;\r\n  innerAs?: ElementType<any>;\r\n  children?: ReactNode;\r\n}\r\n\r\nexport const CheckBox = forwardRef<HTMLInputElement, CheckBoxProps>(\r\n  function CheckBox(props, forwardedRef) {\r\n    const {\r\n      as: Comp = 'input',\r\n      checked: checkedProp,\r\n      defaultChecked = false,\r\n      onChange: onChangeProp,\r\n      ...otherProps\r\n    } = props;\r\n    const [checked, onChange] = useControlledState(\r\n      checkedProp,\r\n      onChangeProp,\r\n      defaultChecked,\r\n      (setValue) => (e) => {\r\n        setValue(e.target.checked);\r\n      }\r\n    );\r\n\r\n    return (\r\n      <Comp\r\n        ref={forwardedRef}\r\n        type=\"checkbox\"\r\n        checked={checked}\r\n        aria-checked={checked}\r\n        onChange={onChange}\r\n        {...otherProps}\r\n      />\r\n    );\r\n  }\r\n);\r\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.d.ts

@@ -1 +1 @@
-export * from './CheckBox';
+export * from './CheckBox';

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/CheckBox/index.ts"],"sourcesContent":["export * from './CheckBox';\r\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,18 +1,18 @@
-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'> & {
-    onSelect?: SelectEventHandler;
-    openOnFocus?: boolean;
-    selectOnBlur?: boolean;
-    children?: ReactNode;
-    as?: ElementType<any>;
-    innerAs?: ElementType<any>;
-};
-export declare const Combobox: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLDivElement>, "onSelect"> & {
-    onSelect?: SelectEventHandler | undefined;
-    openOnFocus?: boolean | undefined;
-    selectOnBlur?: boolean | undefined;
-    children?: ReactNode;
-    as?: ElementType<any> | undefined;
-    innerAs?: ElementType<any> | undefined;
-} & import("react").RefAttributes<HTMLDivElement>>;
+import type { HTMLAttributes, ReactNode, ElementType } from 'react';
+export type SelectEventHandler = (text: string, itemId: string, obj: any) => void;
+export type ComboboxProps = Omit<HTMLAttributes<HTMLDivElement>, 'onSelect'> & {
+    onSelect?: SelectEventHandler;
+    openOnFocus?: boolean;
+    selectOnBlur?: boolean;
+    children?: ReactNode;
+    as?: ElementType<any>;
+    innerAs?: ElementType<any>;
+};
+export declare const Combobox: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLDivElement>, "onSelect"> & {
+    onSelect?: SelectEventHandler;
+    openOnFocus?: boolean;
+    selectOnBlur?: boolean;
+    children?: ReactNode;
+    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';\r\nimport { forwardRef, useRef, useMemo, useId } from 'react';\r\n\r\nimport type { ActionTypes } from './hooks';\r\nimport { stateChart, comboboxReducer, isVisible, INIT } from './hooks';\r\nimport type { ComboBoxContextProps } from './context';\r\nimport { ComboBoxProvider } from './context';\r\nimport { useReducerMachine } from '../hooks/useReducerMachine';\r\nimport type { Scope } from '../hooks';\r\nimport { getScope } from '../hooks';\r\n\r\nexport type SelectEventHandler = (\r\n  text: string,\r\n  itemId: string,\r\n  obj: any\r\n) => void;\r\n\r\nexport type ComboboxProps = Omit<HTMLAttributes<HTMLDivElement>, 'onSelect'> & {\r\n  onSelect?: SelectEventHandler;\r\n  openOnFocus?: boolean;\r\n  selectOnBlur?: boolean;\r\n  children?: ReactNode;\r\n  as?: ElementType<any>;\r\n  innerAs?: ElementType<any>;\r\n};\r\n\r\nexport const Combobox = forwardRef<HTMLDivElement, ComboboxProps>(\r\n  function Combobox(\r\n    {\r\n      // Called whenever the user selects an item from the list\r\n      onSelect,\r\n\r\n      // opens the list when the input receives focused (but only if there are\r\n      // items in the list)\r\n      openOnFocus = false,\r\n\r\n      // if set to true, it will select an item after blurring\r\n      selectOnBlur = false,\r\n\r\n      children,\r\n      as: Comp = 'div',\r\n      innerAs,\r\n      ...rest\r\n    }: ComboboxProps,\r\n    ref\r\n  ) {\r\n    // We store the values of all the ComboboxOptions on this ref. This makes it\r\n    // possible to perform the keyboard navigation from the input on the list. We\r\n    // manipulate this array through context so that we don't have to enforce a\r\n    // parent/child relationship between ComboboxList and ComboboxOption.\r\n    const optionsRef = useRef<{\r\n      [itemId: string]: {\r\n        value: string | unknown;\r\n        text: string;\r\n      };\r\n    }>({});\r\n\r\n    const listScope: Scope<HTMLElement> = useRef(getScope({ current: null }));\r\n\r\n    // Need this to focus it\r\n    const inputRef = useRef<HTMLInputElement>(null);\r\n\r\n    const popoverRef = useRef<HTMLDivElement>(null);\r\n\r\n    const buttonRef = useRef<HTMLButtonElement>(null);\r\n\r\n    // When <ComboboxInput autocomplete={false} /> we don't want cycle back to\r\n    // the user's value while navigating (because it's always the user's value),\r\n    // but we need to know this in useKeyDown which is far away from the prop\r\n    // here, so we do something sneaky and write it to this ref on context so we\r\n    // can use it anywhere else 😛. Another new trick for me and I'm excited\r\n    // about this one too!\r\n    const autocompletePropRef = useRef<boolean>(false);\r\n\r\n    const persistSelectionRef = useRef<boolean>(false);\r\n\r\n    const clearOnEscapeRef = useRef<boolean>(false);\r\n\r\n    const listboxIdRef = useRef<string | undefined>();\r\n\r\n    const labelIdRef = useRef<string | undefined>();\r\n\r\n    const defaultData = {\r\n      // initial state\r\n      state: stateChart.initial,\r\n      // the value the user has typed, we derived this also when the developer is\r\n      // controlling the value of ComboboxInput\r\n      text: '',\r\n      // the index the user has typed, we derived this also when the developer is\r\n      // controlling the value of ComboboxInput\r\n      item: '',\r\n      // the hash of the currently navigated item\r\n      navigationItem: '',\r\n      // the last submitted action\r\n      lastActionType: INIT as ActionTypes,\r\n    };\r\n\r\n    const [state, data, transition] = useReducerMachine(\r\n      stateChart,\r\n      comboboxReducer,\r\n      defaultData\r\n    );\r\n\r\n    listboxIdRef.current = useId();\r\n\r\n    labelIdRef.current = useId();\r\n\r\n    const context = useMemo(\r\n      (): ComboBoxContextProps => ({\r\n        data,\r\n        inputRef,\r\n        popoverRef,\r\n        buttonRef,\r\n        onSelect,\r\n        optionsRef,\r\n        listScope,\r\n        state,\r\n        transition,\r\n        listboxIdRef,\r\n        labelIdRef,\r\n        autocompletePropRef,\r\n        persistSelectionRef,\r\n        clearOnEscapeRef,\r\n        isVisible: isVisible(state),\r\n        openOnFocus,\r\n        selectOnBlur,\r\n      }),\r\n      [data, onSelect, listScope, state, transition, openOnFocus, selectOnBlur]\r\n    );\r\n\r\n    return (\r\n      <ComboBoxProvider value={context}>\r\n        <Comp\r\n          {...rest}\r\n          as={innerAs}\r\n          data-reach-combobox=\"\"\r\n          ref={ref}\r\n          role=\"combobox\"\r\n          aria-haspopup=\"listbox\"\r\n          aria-owns={listboxIdRef.current}\r\n          aria-expanded={context.isVisible}\r\n        >\r\n          {children}\r\n        </Comp>\r\n      </ComboBoxProvider>\r\n    );\r\n  }\r\n);\r\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":"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","ignoreList":[]}

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

@@ -1,9 +1,9 @@
-import type { ButtonHTMLAttributes, ElementType, KeyboardEventHandler, MouseEventHandler, ReactNode } from 'react';
-export interface ComboboxButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
-    as?: ElementType<any>;
-    innerAs?: ElementType<any>;
-    onClick?: MouseEventHandler<HTMLButtonElement>;
-    onKeyDown?: KeyboardEventHandler<HTMLButtonElement>;
-    children?: ReactNode;
-}
-export declare const ComboboxButton: import("react").ForwardRefExoticComponent<ComboboxButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
+import type { ButtonHTMLAttributes, ElementType, KeyboardEventHandler, MouseEventHandler, ReactNode } from 'react';
+export interface ComboboxButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    as?: ElementType<any>;
+    innerAs?: ElementType<any>;
+    onClick?: MouseEventHandler<HTMLButtonElement>;
+    onKeyDown?: KeyboardEventHandler<HTMLButtonElement>;
+    children?: ReactNode;
+}
+export declare const ComboboxButton: import("react").ForwardRefExoticComponent<ComboboxButtonProps & import("react").RefAttributes<HTMLButtonElement>>;

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 {\r\n  ButtonHTMLAttributes,\r\n  ElementType,\r\n  KeyboardEventHandler,\r\n  MouseEventHandler,\r\n  ReactNode,\r\n} from 'react';\r\nimport { forwardRef } from 'react';\r\n\r\nimport { useComboBoxContext } from './context';\r\nimport { useKeyDown, IDLE, OPEN_WITH_BUTTON, CLOSE_WITH_BUTTON } from './hooks';\r\nimport { wrapEvent } from '../utils/wrap-event';\r\nimport { assignMultipleRefs } from '../utils/assign-ref';\r\n\r\nexport interface ComboboxButtonProps\r\n  extends ButtonHTMLAttributes<HTMLButtonElement> {\r\n  as?: ElementType<any>;\r\n  innerAs?: ElementType<any>;\r\n  onClick?: MouseEventHandler<HTMLButtonElement>;\r\n  onKeyDown?: KeyboardEventHandler<HTMLButtonElement>;\r\n  children?: ReactNode;\r\n}\r\n\r\nexport const ComboboxButton = forwardRef<\r\n  HTMLButtonElement,\r\n  ComboboxButtonProps\r\n>(function ComboboxButton(\r\n  { as: Comp = 'button', innerAs, onClick, onKeyDown, ...props },\r\n  ref\r\n) {\r\n  const { transition, data, state, buttonRef, listboxIdRef, isVisible } =\r\n    useComboBoxContext();\r\n\r\n  const handleKeyDown = useKeyDown();\r\n\r\n  const handleClick = () => {\r\n    const payload = {\r\n      item: data.navigationItem,\r\n    };\r\n\r\n    if (state === IDLE) {\r\n      transition(OPEN_WITH_BUTTON, payload);\r\n    } else {\r\n      transition(CLOSE_WITH_BUTTON, payload);\r\n    }\r\n  };\r\n\r\n  return (\r\n    <Comp\r\n      as={innerAs}\r\n      data-reach-combobox-button=\"\"\r\n      aria-controls={listboxIdRef.current}\r\n      aria-haspopup=\"listbox\"\r\n      aria-expanded={isVisible}\r\n      ref={assignMultipleRefs(ref, buttonRef)}\r\n      onClick={wrapEvent(onClick, handleClick)}\r\n      onKeyDown={wrapEvent(onKeyDown, handleKeyDown)}\r\n      {...props}\r\n    />\r\n  );\r\n});\r\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.d.ts

@@ -1,17 +1,17 @@
-import type { ChangeEventHandler, ElementType, FocusEventHandler, InputHTMLAttributes, KeyboardEventHandler, MouseEventHandler } from 'react';
-export interface ComboboxInputProps extends InputHTMLAttributes<HTMLInputElement> {
-    clearOnEscape?: boolean;
-    selectOnClick?: boolean;
-    autocomplete?: boolean;
-    defaultValue?: string;
-    value?: string;
-    onClick?: MouseEventHandler<HTMLInputElement>;
-    onChange?: ChangeEventHandler<HTMLInputElement>;
-    onKeyDown?: KeyboardEventHandler<HTMLInputElement>;
-    onBlur?: FocusEventHandler<HTMLInputElement>;
-    onFocus?: FocusEventHandler<HTMLInputElement>;
-    as?: ElementType<any>;
-    innerAs?: ElementType<any>;
-    id?: string;
-}
-export declare const ComboboxInput: import("react").ForwardRefExoticComponent<ComboboxInputProps & import("react").RefAttributes<HTMLInputElement>>;
+import type { ChangeEventHandler, ElementType, FocusEventHandler, InputHTMLAttributes, KeyboardEventHandler, MouseEventHandler } from 'react';
+export interface ComboboxInputProps extends InputHTMLAttributes<HTMLInputElement> {
+    clearOnEscape?: boolean;
+    selectOnClick?: boolean;
+    autocomplete?: boolean;
+    defaultValue?: string;
+    value?: string;
+    onClick?: MouseEventHandler<HTMLInputElement>;
+    onChange?: ChangeEventHandler<HTMLInputElement>;
+    onKeyDown?: KeyboardEventHandler<HTMLInputElement>;
+    onBlur?: FocusEventHandler<HTMLInputElement>;
+    onFocus?: FocusEventHandler<HTMLInputElement>;
+    as?: ElementType<any>;
+    innerAs?: ElementType<any>;
+    id?: string;
+}
+export declare const ComboboxInput: import("react").ForwardRefExoticComponent<ComboboxInputProps & import("react").RefAttributes<HTMLInputElement>>;