@ariakit/core 0.4.5 → 0.4.7

package/esm/tab/tab-store.js

@@ -1,10 +1,10 @@
 "use client";
 import {
   createCompositeStore
-} from "../__chunks/YVUNPQHS.js";
+} from "../__chunks/VH2P7HEP.js";
 import {
   createCollectionStore
-} from "../__chunks/ABMC67JW.js";
+} from "../__chunks/I2WJ7JBQ.js";
 import "../__chunks/7PRQYBBV.js";
 import {
   batch,
@@ -13,11 +13,12 @@ import {
   omit,
   setup,
   sync
-} from "../__chunks/R676XYVY.js";
+} from "../__chunks/KLPDXTDE.js";
 import {
+  chain,
   defaultValue
 } from "../__chunks/22HHDS5F.js";
-import "../__chunks/IUORCTET.js";
+import "../__chunks/I2NJJ3XW.js";
 import {
   __objRest,
   __spreadProps,
@@ -38,6 +39,8 @@ function createTabStore(_a = {}) {
     "renderedItems",
     "moves",
     "orientation",
+    "virtualFocus",
+    "includesBaseElement",
     "baseElement",
     "focusLoop",
     "focusShift",
@@ -50,6 +53,16 @@ function createTabStore(_a = {}) {
   );
   const syncState = store == null ? void 0 : store.getState();
   const composite = createCompositeStore(__spreadProps(__spreadValues({}, props), {
+    store,
+    // We need to explicitly set the default value of `includesBaseElement` to
+    // `false` since we don't want the composite store to default it to `true`
+    // when the activeId state is null, which could be the case when rendering
+    // combobox with tab.
+    includesBaseElement: defaultValue(
+      props.includesBaseElement,
+      syncState == null ? void 0 : syncState.includesBaseElement,
+      false
+    ),
     orientation: defaultValue(
       props.orientation,
       syncState == null ? void 0 : syncState.orientation,
@@ -62,8 +75,7 @@ function createTabStore(_a = {}) {
     selectedId: defaultValue(
       props.selectedId,
       syncState == null ? void 0 : syncState.selectedId,
-      props.defaultSelectedId,
-      void 0
+      props.defaultSelectedId
     ),
     selectOnMove: defaultValue(
       props.selectOnMove,
@@ -92,11 +104,11 @@ function createTabStore(_a = {}) {
   );
   setup(
     tab,
-    () => batch(
-      tab,
-      ["selectedId"],
-      (state) => tab.setState("activeId", state.selectedId)
-    )
+    () => batch(tab, ["selectedId"], (state, prev) => {
+      if (parentComposite && state.selectedId === prev.selectedId)
+        return;
+      tab.setState("activeId", state.selectedId);
+    })
   );
   setup(
     tab,
@@ -137,6 +149,27 @@ function createTabStore(_a = {}) {
       });
     })
   );
+  let selectedIdFromSelectedValue = null;
+  setup(tab, () => {
+    const backupSelectedId = () => {
+      selectedIdFromSelectedValue = tab.getState().selectedId;
+    };
+    const restoreSelectedId = () => {
+      tab.setState("selectedId", selectedIdFromSelectedValue);
+    };
+    if (parentComposite && "setSelectElement" in parentComposite) {
+      return chain(
+        sync(parentComposite, ["value"], backupSelectedId),
+        sync(parentComposite, ["open"], restoreSelectedId)
+      );
+    }
+    if (!combobox)
+      return;
+    return chain(
+      sync(combobox, ["selectedValue"], backupSelectedId),
+      sync(combobox, ["open"], restoreSelectedId)
+    );
+  });
   return __spreadProps(__spreadValues(__spreadValues({}, composite), tab), {
     panels,
     setSelectedId: (id) => tab.setState("selectedId", id),

package/esm/tag/tag-store.d.ts

@@ -1,6 +1,6 @@
-import type { CompositeStoreFunctions, CompositeStoreItem, CompositeStoreOptions, CompositeStoreState } from "../composite/composite-store.js";
-import type { Store, StoreOptions, StoreProps } from "../utils/store.js";
-import type { SetState } from "../utils/types.js";
+import type { CompositeStoreFunctions, CompositeStoreItem, CompositeStoreOptions, CompositeStoreState } from "../composite/composite-store.ts";
+import type { Store, StoreOptions, StoreProps } from "../utils/store.ts";
+import type { SetState } from "../utils/types.ts";
 /**
  * Creates a tag store.
  */

package/esm/tag/tag-store.js

@@ -1,8 +1,8 @@
 "use client";
 import {
   createCompositeStore
-} from "../__chunks/YVUNPQHS.js";
-import "../__chunks/ABMC67JW.js";
+} from "../__chunks/VH2P7HEP.js";
+import "../__chunks/I2WJ7JBQ.js";
 import "../__chunks/7PRQYBBV.js";
 import {
   UndoManager
@@ -11,12 +11,12 @@ import {
   createStore,
   setup,
   sync
-} from "../__chunks/R676XYVY.js";
+} from "../__chunks/KLPDXTDE.js";
 import {
   applyState,
   defaultValue
 } from "../__chunks/22HHDS5F.js";
-import "../__chunks/IUORCTET.js";
+import "../__chunks/I2NJJ3XW.js";
 import {
   __spreadProps,
   __spreadValues

package/esm/toolbar/toolbar-store.d.ts

@@ -1,5 +1,5 @@
-import type { CompositeStoreFunctions, CompositeStoreOptions, CompositeStoreState } from "../composite/composite-store.js";
-import type { Store, StoreOptions, StoreProps } from "../utils/store.js";
+import type { CompositeStoreFunctions, CompositeStoreOptions, CompositeStoreState } from "../composite/composite-store.ts";
+import type { Store, StoreOptions, StoreProps } from "../utils/store.ts";
 /**
  * Creates a toolbar store.
  */

package/esm/toolbar/toolbar-store.js

@@ -1,14 +1,14 @@
 "use client";
 import {
   createCompositeStore
-} from "../__chunks/YVUNPQHS.js";
-import "../__chunks/ABMC67JW.js";
+} from "../__chunks/VH2P7HEP.js";
+import "../__chunks/I2WJ7JBQ.js";
 import "../__chunks/7PRQYBBV.js";
-import "../__chunks/R676XYVY.js";
+import "../__chunks/KLPDXTDE.js";
 import {
   defaultValue
 } from "../__chunks/22HHDS5F.js";
-import "../__chunks/IUORCTET.js";
+import "../__chunks/I2NJJ3XW.js";
 import {
   __spreadProps,
   __spreadValues

package/esm/tooltip/tooltip-store.d.ts

@@ -1,5 +1,5 @@
-import type { HovercardStoreFunctions, HovercardStoreOptions, HovercardStoreState } from "../hovercard/hovercard-store.js";
-import type { Store, StoreOptions, StoreProps } from "../utils/store.js";
+import type { HovercardStoreFunctions, HovercardStoreOptions, HovercardStoreState } from "../hovercard/hovercard-store.ts";
+import type { Store, StoreOptions, StoreProps } from "../utils/store.ts";
 /**
  * Creates a tooltip store.
  */

package/esm/tooltip/tooltip-store.js

@@ -1,13 +1,13 @@
 "use client";
 import {
   createHovercardStore
-} from "../__chunks/BRS7GKWU.js";
-import "../__chunks/MFZZDIHG.js";
-import "../__chunks/5RJNXXU2.js";
-import "../__chunks/WCKXDMU7.js";
+} from "../__chunks/E4HA32QI.js";
+import "../__chunks/SAZZJI72.js";
+import "../__chunks/NWACXGIN.js";
+import "../__chunks/KDSZSVV5.js";
 import {
   createStore
-} from "../__chunks/R676XYVY.js";
+} from "../__chunks/KLPDXTDE.js";
 import {
   defaultValue
 } from "../__chunks/22HHDS5F.js";

package/esm/utils/dom.d.ts

@@ -1,4 +1,4 @@
-import type { AriaHasPopup, AriaRole } from "./types.js";
+import type { AriaHasPopup, AriaRole } from "./types.ts";
 /**
  * It's `true` if it is running in a browser environment or `false` if it is not
  * (SSR).
@@ -45,26 +45,10 @@ export declare function isButton(element: {
     tagName: string;
     type?: string;
 }): boolean;
-/**
- * Ponyfill for `Element.prototype.matches`
- *
- * @see https://developer.mozilla.org/en-US/docs/Web/API/Element/matches
- */
-export declare function matches(element: Element, selectors: string): boolean;
 /**
  * Checks if the element is visible or not.
  */
 export declare function isVisible(element: Element): boolean;
-/**
- * Ponyfill for `Element.prototype.closest`
- * @example
- * closest(document.getElementById("id"), "div");
- * // same as
- * document.getElementById("id").closest("div");
- */
-export declare function closest<K extends keyof HTMLElementTagNameMap>(element: Element, selectors: K): HTMLElementTagNameMap[K];
-export declare function closest<K extends keyof SVGElementTagNameMap>(element: Element, selectors: K): SVGElementTagNameMap[K];
-export declare function closest<T extends Element = Element>(element: Element, selectors: string): T | null;
 /**
  * Check whether the given element is a text field, where text field is defined
  * by the ability to select within the input.

package/esm/utils/dom.js

@@ -1,7 +1,6 @@
 "use client";
 import {
   canUseDOM,
-  closest,
   contains,
   getActiveElement,
   getDocument,
@@ -17,14 +16,12 @@ import {
   isTextField,
   isTextbox,
   isVisible,
-  matches,
   scrollIntoViewIfNeeded,
   setSelectionRange
-} from "../__chunks/IUORCTET.js";
+} from "../__chunks/I2NJJ3XW.js";
 import "../__chunks/4R3V3JGP.js";
 export {
   canUseDOM,
-  closest,
   contains,
   getActiveElement,
   getDocument,
@@ -40,7 +37,6 @@ export {
   isTextField,
   isTextbox,
   isVisible,
-  matches,
   scrollIntoViewIfNeeded,
   setSelectionRange
 };

package/esm/utils/events.d.ts

@@ -71,6 +71,6 @@ export declare function getInputType(event: Event | {
 /**
  * Runs a callback on the next animation frame, but before a certain event.
  */
-export declare function queueBeforeEvent(element: Element, type: string, callback: () => void): number;
+export declare function queueBeforeEvent(element: Element, type: string, callback: () => void, timeout?: number): () => void;
 export declare function addGlobalEventListener<K extends keyof DocumentEventMap>(type: K, listener: (event: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions, scope?: Window): () => void;
 export declare function addGlobalEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions, scope?: Window): () => void;

package/esm/utils/events.js

@@ -1,10 +1,10 @@
 "use client";
 import {
   isApple
-} from "../__chunks/QAI5BPCY.js";
+} from "../__chunks/CLSHHUGK.js";
 import {
   contains
-} from "../__chunks/IUORCTET.js";
+} from "../__chunks/I2NJJ3XW.js";
 import {
   __spreadProps,
   __spreadValues
@@ -93,20 +93,25 @@ function getInputType(event) {
     return;
   return nativeEvent.inputType;
 }
-function queueBeforeEvent(element, type, callback) {
-  const raf = requestAnimationFrame(() => {
-    element.removeEventListener(type, callImmediately, true);
+function queueBeforeEvent(element, type, callback, timeout) {
+  const createTimer = (callback2) => {
+    if (timeout) {
+      const timerId2 = setTimeout(callback2, timeout);
+      return () => clearTimeout(timerId2);
+    }
+    const timerId = requestAnimationFrame(callback2);
+    return () => cancelAnimationFrame(timerId);
+  };
+  const cancelTimer = createTimer(() => {
+    element.removeEventListener(type, callSync, true);
     callback();
   });
-  const callImmediately = () => {
-    cancelAnimationFrame(raf);
+  const callSync = () => {
+    cancelTimer();
     callback();
   };
-  element.addEventListener(type, callImmediately, {
-    once: true,
-    capture: true
-  });
-  return raf;
+  element.addEventListener(type, callSync, { once: true, capture: true });
+  return cancelTimer;
 }
 function addGlobalEventListener(type, listener, options, scope = window) {
   const children = [];
@@ -122,7 +127,9 @@ function addGlobalEventListener(type, listener, options, scope = window) {
       scope.document.removeEventListener(type, listener, options);
     } catch (e) {
     }
-    children.forEach((remove) => remove());
+    for (const remove of children) {
+      remove();
+    }
   };
   return removeEventListener;
 }

package/esm/utils/focus.d.ts

@@ -6,7 +6,7 @@
  * isFocusable(document.querySelector("input[hidden]")); // false
  * isFocusable(document.querySelector("input:disabled")); // false
  */
-export declare function isFocusable(element: Element): element is HTMLElement;
+export declare function isFocusable(element: Element): boolean;
 /**
  * Checks whether `element` is tabbable or not.
  * @example

package/esm/utils/focus.js

@@ -1,12 +1,10 @@
 "use client";
 import {
-  closest,
   contains,
   getActiveElement,
   isFrame,
-  isVisible,
-  matches
-} from "../__chunks/IUORCTET.js";
+  isVisible
+} from "../__chunks/I2NJJ3XW.js";
 import {
   __spreadValues
 } from "../__chunks/4R3V3JGP.js";
@@ -14,15 +12,15 @@ import {
 // src/utils/focus.ts
 var selector = "input:not([type='hidden']):not([disabled]), select:not([disabled]), textarea:not([disabled]), a[href], button:not([disabled]), [tabindex], summary, iframe, object, embed, area[href], audio[controls], video[controls], [contenteditable]:not([contenteditable='false'])";
 function hasNegativeTabIndex(element) {
-  const tabIndex = parseInt(element.getAttribute("tabindex") || "0", 10);
+  const tabIndex = Number.parseInt(element.getAttribute("tabindex") || "0", 10);
   return tabIndex < 0;
 }
 function isFocusable(element) {
-  if (!matches(element, selector))
+  if (!element.matches(selector))
     return false;
   if (!isVisible(element))
     return false;
-  if (closest(element, "[inert]"))
+  if (element.closest("[inert]"))
     return false;
   return true;
 }
@@ -164,7 +162,7 @@ function getPreviousTabbable(fallbackToFirst, fallbackToFocusable) {
 }
 function getClosestFocusable(element) {
   while (element && !isFocusable(element)) {
-    element = closest(element, selector);
+    element = element.closest(selector);
   }
   return element || null;
 }
@@ -207,7 +205,9 @@ function disableFocus(element) {
 }
 function disableFocusIn(container, includeContainer) {
   const tabbableElements = getAllTabbableIn(container, includeContainer);
-  tabbableElements.forEach(disableFocus);
+  for (const element of tabbableElements) {
+    disableFocus(element);
+  }
 }
 function restoreFocusIn(container) {
   const elements = container.querySelectorAll("[data-tabindex]");
@@ -223,7 +223,9 @@ function restoreFocusIn(container) {
   if (container.hasAttribute("data-tabindex")) {
     restoreTabIndex(container);
   }
-  elements.forEach(restoreTabIndex);
+  for (const element of elements) {
+    restoreTabIndex(element);
+  }
 }
 function focusIntoView(element, options) {
   if (!("scrollIntoView" in element)) {

package/esm/utils/misc.d.ts

@@ -1,4 +1,4 @@
-import type { AnyFunction, AnyObject, SetStateAction } from "./types.js";
+import type { AnyFunction, AnyObject, SetStateAction } from "./types.ts";
 /**
  * Empty function.
  */

package/esm/utils/platform.js

@@ -5,8 +5,8 @@ import {
   isMac,
   isSafari,
   isTouchDevice
-} from "../__chunks/QAI5BPCY.js";
-import "../__chunks/IUORCTET.js";
+} from "../__chunks/CLSHHUGK.js";
+import "../__chunks/I2NJJ3XW.js";
 import "../__chunks/4R3V3JGP.js";
 export {
   isApple,

package/esm/utils/store.d.ts

@@ -1,4 +1,4 @@
-import type { AnyObject, SetStateAction } from "./types.js";
+import type { AnyObject, SetStateAction } from "./types.ts";
 type Listener<S> = (state: S, prevState: S) => void | (() => void);
 type Sync<S, K extends keyof S> = (keys: K[] | null, listener: Listener<Pick<S, K>>) => () => void;
 type StoreSetup = (callback: () => void | (() => void)) => () => void;
@@ -43,7 +43,7 @@ export type StoreOptions<S extends State, K extends keyof S> = Partial<Pick<S, K
  * Props that can be passed to a store creator function.
  * @template S State type.
  */
-export type StoreProps<S extends State = State> = {
+export interface StoreProps<S extends State = State> {
     /**
      * Another store object that will be kept in sync with the original store.
      *
@@ -51,7 +51,7 @@ export type StoreProps<S extends State = State> = {
      * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      */
     store?: Store<Partial<S>>;
-};
+}
 /**
  * Extracts the state type from a store type.
  * @template T Store type.

package/esm/utils/store.js

@@ -10,7 +10,7 @@ import {
   subscribe,
   sync,
   throwOnConflictingProps
-} from "../__chunks/R676XYVY.js";
+} from "../__chunks/KLPDXTDE.js";
 import "../__chunks/22HHDS5F.js";
 import "../__chunks/4R3V3JGP.js";
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ariakit/core",
-  "version": "0.4.5",
+  "version": "0.4.7",
   "description": "Ariakit core",
   "sideEffects": false,
   "license": "MIT",
@@ -20,7 +20,7 @@
     "url": "https://github.com/diegohaz"
   },
   "scripts": {
-    "lint": "eslint . --ext js,ts,tsx",
+    "lint": "biome check .",
     "build": "node ../../scripts/build/build.js",
     "clean": "node ../../scripts/build/clean.js"
   },

package/.eslintignore

@@ -1,6 +0,0 @@
-cjs
-esm
-ts
-umd
-coverage
-node_modules