@ariakit/react-core 0.3.14 → 0.4.0

package/esm/__chunks/CWDOOAGR.js

@@ -0,0 +1,45 @@
+"use client";
+import {
+  GroupLabelContext
+} from "./3X3MDQGM.js";
+import {
+  createElement,
+  createHook,
+  forwardRef
+} from "./5M6RSQEC.js";
+import {
+  useWrapElement
+} from "./6O5OEQGF.js";
+import {
+  __spreadValues
+} from "./4R3V3JGP.js";
+
+// src/group/group.tsx
+import { useState } from "react";
+import { removeUndefinedValues } from "@ariakit/core/utils/misc";
+import { jsx } from "react/jsx-runtime";
+var TagName = "div";
+var useGroup = createHook(
+  function useGroup2(props) {
+    const [labelId, setLabelId] = useState();
+    props = useWrapElement(
+      props,
+      (element) => /* @__PURE__ */ jsx(GroupLabelContext.Provider, { value: setLabelId, children: element }),
+      []
+    );
+    props = __spreadValues({
+      role: "group",
+      "aria-labelledby": labelId
+    }, props);
+    return removeUndefinedValues(props);
+  }
+);
+var Group = forwardRef(function Group2(props) {
+  const htmlProps = useGroup(props);
+  return createElement(TagName, htmlProps);
+});
+
+export {
+  useGroup,
+  Group
+};

package/esm/__chunks/DMSZFK7W.js

@@ -0,0 +1,131 @@
+"use client";
+import {
+  flipItems
+} from "./3IEDWLST.js";
+import {
+  useCompositeContext
+} from "./3D6OCOHF.js";
+import {
+  createElement,
+  createHook,
+  forwardRef
+} from "./5M6RSQEC.js";
+import {
+  useEvent
+} from "./6O5OEQGF.js";
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./4R3V3JGP.js";
+
+// src/composite/composite-typeahead.ts
+import { useRef } from "react";
+import { isTextField } from "@ariakit/core/utils/dom";
+import { isSelfTarget } from "@ariakit/core/utils/events";
+import {
+  invariant,
+  normalizeString,
+  removeUndefinedValues
+} from "@ariakit/core/utils/misc";
+var TagName = "div";
+var chars = "";
+function clearChars() {
+  chars = "";
+}
+function isValidTypeaheadEvent(event) {
+  const target = event.target;
+  if (target && isTextField(target))
+    return false;
+  if (event.key === " " && chars.length)
+    return true;
+  return event.key.length === 1 && !event.ctrlKey && !event.altKey && !event.metaKey && /^[\p{Letter}\p{Number}]$/u.test(event.key);
+}
+function isSelfTargetOrItem(event, items) {
+  if (isSelfTarget(event))
+    return true;
+  const target = event.target;
+  if (!target)
+    return false;
+  const isItem = items.some((item) => item.element === target);
+  return isItem;
+}
+function getEnabledItems(items) {
+  return items.filter((item) => !item.disabled);
+}
+function itemTextStartsWith(item, text) {
+  var _a;
+  const itemText = ((_a = item.element) == null ? void 0 : _a.textContent) || item.children;
+  if (!itemText)
+    return false;
+  return normalizeString(itemText).trim().toLowerCase().startsWith(text.toLowerCase());
+}
+function getSameInitialItems(items, char, activeId) {
+  if (!activeId)
+    return items;
+  const activeItem = items.find((item) => item.id === activeId);
+  if (!activeItem)
+    return items;
+  if (!itemTextStartsWith(activeItem, char))
+    return items;
+  if (chars !== char && itemTextStartsWith(activeItem, chars))
+    return items;
+  chars = char;
+  return flipItems(
+    items.filter((item) => itemTextStartsWith(item, chars)),
+    activeId
+  ).filter((item) => item.id !== activeId);
+}
+var useCompositeTypeahead = createHook(function useCompositeTypeahead2(_a) {
+  var _b = _a, { store, typeahead = true } = _b, props = __objRest(_b, ["store", "typeahead"]);
+  const context = useCompositeContext();
+  store = store || context;
+  invariant(
+    store,
+    process.env.NODE_ENV !== "production" && "CompositeTypeahead must be a Composite component"
+  );
+  const onKeyDownCaptureProp = props.onKeyDownCapture;
+  const cleanupTimeoutRef = useRef(0);
+  const onKeyDownCapture = useEvent((event) => {
+    onKeyDownCaptureProp == null ? void 0 : onKeyDownCaptureProp(event);
+    if (event.defaultPrevented)
+      return;
+    if (!typeahead)
+      return;
+    if (!store)
+      return;
+    const { items, activeId } = store.getState();
+    if (!isValidTypeaheadEvent(event))
+      return clearChars();
+    let enabledItems = getEnabledItems(items);
+    if (!isSelfTargetOrItem(event, enabledItems))
+      return clearChars();
+    event.preventDefault();
+    window.clearTimeout(cleanupTimeoutRef.current);
+    cleanupTimeoutRef.current = window.setTimeout(() => {
+      chars = "";
+    }, 500);
+    const char = event.key.toLowerCase();
+    chars += char;
+    enabledItems = getSameInitialItems(enabledItems, char, activeId);
+    const item = enabledItems.find((item2) => itemTextStartsWith(item2, chars));
+    if (item) {
+      store.move(item.id);
+    } else {
+      clearChars();
+    }
+  });
+  props = __spreadProps(__spreadValues({}, props), {
+    onKeyDownCapture
+  });
+  return removeUndefinedValues(props);
+});
+var CompositeTypeahead = forwardRef(function CompositeTypeahead2(props) {
+  const htmlProps = useCompositeTypeahead(props);
+  return createElement(TagName, htmlProps);
+});
+
+export {
+  useCompositeTypeahead,
+  CompositeTypeahead
+};

package/esm/__chunks/{XHRZYRZ5.js → E47ASM2Y.js}

@@ -1,15 +1,15 @@
 "use client";
 import {
   useHeading
-} from "./P4FX6ZFL.js";
+} from "./7HFLDZTS.js";
 import {
   DialogHeadingContext
-} from "./G6BJYYBK.js";
+} from "./XXVAHUAO.js";
 import {
-  createComponent,
   createElement,
-  createHook
-} from "./3ORBWXWF.js";
+  createHook,
+  forwardRef
+} from "./5M6RSQEC.js";
 import {
   useId,
   useSafeLayoutEffect
@@ -21,8 +21,9 @@ import {
 
 // src/dialog/dialog-heading.ts
 import { useContext } from "react";
+var TagName = "h1";
 var useDialogHeading = createHook(
-  (_a) => {
+  function useDialogHeading2(_a) {
     var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
     const setHeadingId = useContext(DialogHeadingContext);
     const id = useId(props.id);
@@ -37,13 +38,10 @@ var useDialogHeading = createHook(
     return props;
   }
 );
-var DialogHeading = createComponent((props) => {
+var DialogHeading = forwardRef(function DialogHeading2(props) {
   const htmlProps = useDialogHeading(props);
-  return createElement("h1", htmlProps);
+  return createElement(TagName, htmlProps);
 });
-if (process.env.NODE_ENV !== "production") {
-  DialogHeading.displayName = "DialogHeading";
-}
 
 export {
   useDialogHeading,

package/esm/__chunks/{ZU7LQC5V.js → E5E7G32I.js}

@@ -1,7 +1,7 @@
 "use client";
 import {
   usePopoverStoreProps
-} from "./MG4P3223.js";
+} from "./XWCFCD3Q.js";
 import {
   useStore,
   useStoreProps
@@ -10,11 +10,10 @@ import {
 // src/hovercard/hovercard-store.ts
 import * as Core from "@ariakit/core/hovercard/hovercard-store";
 function useHovercardStoreProps(store, update, props) {
-  store = usePopoverStoreProps(store, update, props);
   useStoreProps(store, props, "timeout");
   useStoreProps(store, props, "showTimeout");
   useStoreProps(store, props, "hideTimeout");
-  return store;
+  return usePopoverStoreProps(store, update, props);
 }
 function useHovercardStore(props = {}) {
   const [store, update] = useStore(Core.createHovercardStore, props);

package/esm/__chunks/ED7XMMMU.js

@@ -0,0 +1,29 @@
+"use client";
+import {
+  useGroupLabel
+} from "./TH2YTBRW.js";
+import {
+  createElement,
+  createHook,
+  forwardRef
+} from "./5M6RSQEC.js";
+import {
+  __objRest
+} from "./4R3V3JGP.js";
+
+// src/composite/composite-group-label.ts
+var TagName = "div";
+var useCompositeGroupLabel = createHook(function useCompositeGroupLabel2(_a) {
+  var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
+  props = useGroupLabel(props);
+  return props;
+});
+var CompositeGroupLabel = forwardRef(function CompositeGroupLabel2(props) {
+  const htmlProps = useCompositeGroupLabel(props);
+  return createElement(TagName, htmlProps);
+});
+
+export {
+  useCompositeGroupLabel,
+  CompositeGroupLabel
+};

package/esm/__chunks/{VPR2WHQV.js → EUN6HFWO.js}

@@ -1,7 +1,7 @@
 "use client";
 import {
   createStoreContext
-} from "./3ORBWXWF.js";
+} from "./5M6RSQEC.js";
 
 // src/checkbox/checkbox-context.tsx
 var ctx = createStoreContext();

package/esm/__chunks/{F6PRXTDU.js → FY6FFKYI.js}

@@ -1,23 +1,24 @@
 "use client";
 import {
   useDialogDismiss
-} from "./NKXUN25E.js";
+} from "./G77JJQ4O.js";
 import {
   usePopoverScopedContext
-} from "./7H5KSHHF.js";
+} from "./TE637IA7.js";
 import {
-  createComponent,
   createElement,
-  createHook
-} from "./3ORBWXWF.js";
+  createHook,
+  forwardRef
+} from "./5M6RSQEC.js";
 import {
   __objRest,
   __spreadValues
 } from "./4R3V3JGP.js";
 
 // src/popover/popover-dismiss.ts
+var TagName = "button";
 var usePopoverDismiss = createHook(
-  (_a) => {
+  function usePopoverDismiss2(_a) {
     var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
     const context = usePopoverScopedContext();
     store = store || context;
@@ -25,15 +26,10 @@ var usePopoverDismiss = createHook(
     return props;
   }
 );
-var PopoverDismiss = createComponent(
-  (props) => {
-    const htmlProps = usePopoverDismiss(props);
-    return createElement("button", htmlProps);
-  }
-);
-if (process.env.NODE_ENV !== "production") {
-  PopoverDismiss.displayName = "PopoverDismiss";
-}
+var PopoverDismiss = forwardRef(function PopoverDismiss2(props) {
+  const htmlProps = usePopoverDismiss(props);
+  return createElement(TagName, htmlProps);
+});
 
 export {
   usePopoverDismiss,

package/esm/__chunks/{NKXUN25E.js → G77JJQ4O.js}

@@ -1,15 +1,15 @@
 "use client";
 import {
   useButton
-} from "./VDNZBO4W.js";
+} from "./ID4VKXL5.js";
 import {
   useDialogScopedContext
-} from "./G6BJYYBK.js";
+} from "./XXVAHUAO.js";
 import {
-  createComponent,
   createElement,
-  createHook
-} from "./3ORBWXWF.js";
+  createHook,
+  forwardRef
+} from "./5M6RSQEC.js";
 import {
   useEvent
 } from "./6O5OEQGF.js";
@@ -22,8 +22,9 @@ import {
 // src/dialog/dialog-dismiss.tsx
 import { useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
+var TagName = "button";
 var useDialogDismiss = createHook(
-  (_a) => {
+  function useDialogDismiss2(_a) {
     var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
     const context = useDialogScopedContext();
     store = store || context;
@@ -66,13 +67,10 @@ var useDialogDismiss = createHook(
     return props;
   }
 );
-var DialogDismiss = createComponent((props) => {
+var DialogDismiss = forwardRef(function DialogDismiss2(props) {
   const htmlProps = useDialogDismiss(props);
-  return createElement("button", htmlProps);
+  return createElement(TagName, htmlProps);
 });
-if (process.env.NODE_ENV !== "production") {
-  DialogDismiss.displayName = "DialogDismiss";
-}
 
 export {
   useDialogDismiss,

package/esm/__chunks/G7KEAOBE.js

@@ -0,0 +1,25 @@
+"use client";
+import {
+  useDialogDescription
+} from "./IKU53XMZ.js";
+import {
+  createElement,
+  createHook,
+  forwardRef
+} from "./5M6RSQEC.js";
+
+// src/popover/popover-description.ts
+var TagName = "p";
+var usePopoverDescription = createHook(function usePopoverDescription2(props) {
+  props = useDialogDescription(props);
+  return props;
+});
+var PopoverDescription = forwardRef(function PopoverDescription2(props) {
+  const htmlProps = usePopoverDescription(props);
+  return createElement(TagName, htmlProps);
+});
+
+export {
+  usePopoverDescription,
+  PopoverDescription
+};

package/esm/__chunks/{V4ZFXDFK.js → GEIG6TES.js}

@@ -2,10 +2,10 @@
 import {
   CollectionContextProvider,
   CollectionScopedContextProvider
-} from "./4UUKJZ4V.js";
+} from "./MADQZZRL.js";
 import {
   createStoreContext
-} from "./3ORBWXWF.js";
+} from "./5M6RSQEC.js";
 
 // src/form/form-context.tsx
 var ctx = createStoreContext(

package/esm/__chunks/{SU2GU5JB.js → GYVFAVAN.js}

@@ -1,22 +1,22 @@
 "use client";
 import {
   useCompositeTypeahead
-} from "./346FK57L.js";
+} from "./DMSZFK7W.js";
 import {
   SelectScopedContextProvider,
   useSelectProviderContext
-} from "./5HVNGX6D.js";
+} from "./TKSBJDO3.js";
 import {
   useComposite
-} from "./7QTPYGNZ.js";
+} from "./6WQW7ZIA.js";
 import {
   isHidden
-} from "./CLE7NTOY.js";
+} from "./SOGTNTQC.js";
 import {
-  createComponent,
   createElement,
-  createHook
-} from "./3ORBWXWF.js";
+  createHook,
+  forwardRef
+} from "./5M6RSQEC.js";
 import {
   useAttribute,
   useBooleanEvent,
@@ -36,8 +36,9 @@ import { useEffect, useRef, useState } from "react";
 import { isSelfTarget } from "@ariakit/core/utils/events";
 import { invariant } from "@ariakit/core/utils/misc";
 import { jsx } from "react/jsx-runtime";
+var TagName = "div";
 var useSelectList = createHook(
-  (_a) => {
+  function useSelectList2(_a) {
     var _b = _a, {
       store,
       resetOnEscape = true,
@@ -122,13 +123,10 @@ var useSelectList = createHook(
     return props;
   }
 );
-var SelectList = createComponent((props) => {
+var SelectList = forwardRef(function SelectList2(props) {
   const htmlProps = useSelectList(props);
-  return createElement("div", htmlProps);
+  return createElement(TagName, htmlProps);
 });
-if (process.env.NODE_ENV !== "production") {
-  SelectList.displayName = "SelectList";
-}
 
 export {
   useSelectList,

package/esm/__chunks/HA4U57LH.js

@@ -0,0 +1,78 @@
+"use client";
+import {
+  usePopoverContext
+} from "./TE637IA7.js";
+import {
+  createElement,
+  createHook,
+  forwardRef
+} from "./5M6RSQEC.js";
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./4R3V3JGP.js";
+
+// src/popover/popover-disclosure-arrow.tsx
+import { useMemo } from "react";
+import { invariant, removeUndefinedValues } from "@ariakit/core/utils/misc";
+import { jsx } from "react/jsx-runtime";
+var TagName = "span";
+var pointsMap = {
+  top: "4,10 8,6 12,10",
+  right: "6,4 10,8 6,12",
+  bottom: "4,6 8,10 12,6",
+  left: "10,4 6,8 10,12"
+};
+var usePopoverDisclosureArrow = createHook(function usePopoverDisclosureArrow2(_a) {
+  var _b = _a, { store, placement } = _b, props = __objRest(_b, ["store", "placement"]);
+  const context = usePopoverContext();
+  store = store || context;
+  invariant(
+    store,
+    process.env.NODE_ENV !== "production" && "PopoverDisclosureArrow must be wrapped in a PopoverDisclosure component."
+  );
+  const position = store.useState((state) => placement || state.placement);
+  const dir = position.split("-")[0];
+  const points = pointsMap[dir];
+  const children = useMemo(
+    () => /* @__PURE__ */ jsx(
+      "svg",
+      {
+        display: "block",
+        fill: "none",
+        stroke: "currentColor",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: "1.5pt",
+        viewBox: "0 0 16 16",
+        height: "1em",
+        width: "1em",
+        children: /* @__PURE__ */ jsx("polyline", { points })
+      }
+    ),
+    [points]
+  );
+  props = __spreadProps(__spreadValues({
+    children,
+    "aria-hidden": true
+  }, props), {
+    style: __spreadValues({
+      width: "1em",
+      height: "1em",
+      pointerEvents: "none"
+    }, props.style)
+  });
+  return removeUndefinedValues(props);
+});
+var PopoverDisclosureArrow = forwardRef(
+  function PopoverDisclosureArrow2(props) {
+    const htmlProps = usePopoverDisclosureArrow(props);
+    return createElement(TagName, htmlProps);
+  }
+);
+
+export {
+  usePopoverDisclosureArrow,
+  PopoverDisclosureArrow
+};

package/esm/__chunks/{SFCBA2JZ.js → HZJ2XALY.js}

@@ -14,7 +14,7 @@ function useDisclosureStoreProps(store, update, props) {
   useStoreProps(store, props, "open", "setOpen");
   useStoreProps(store, props, "mounted", "setMounted");
   useStoreProps(store, props, "animated");
-  return store;
+  return Object.assign(store, { disclosure: props.disclosure });
 }
 function useDisclosureStore(props = {}) {
   const [store, update] = useStore(Core.createDisclosureStore, props);

package/esm/__chunks/{ZSELSBRM.js → I62TROYO.js}

@@ -1,7 +1,7 @@
 "use client";
 import {
   useDisclosureStoreProps
-} from "./SFCBA2JZ.js";
+} from "./HZJ2XALY.js";
 import {
   useStore
 } from "./EKQEJRUF.js";

package/esm/__chunks/IBZ5GRML.js

@@ -0,0 +1,27 @@
+"use client";
+import {
+  usePopoverHeading
+} from "./ZXBIDNZ3.js";
+import {
+  createElement,
+  createHook,
+  forwardRef
+} from "./5M6RSQEC.js";
+
+// src/hovercard/hovercard-heading.ts
+var TagName = "h1";
+var useHovercardHeading = createHook(
+  function useHovercardHeading2(props) {
+    props = usePopoverHeading(props);
+    return props;
+  }
+);
+var HovercardHeading = forwardRef(function HovercardHeading2(props) {
+  const htmlProps = useHovercardHeading(props);
+  return createElement(TagName, htmlProps);
+});
+
+export {
+  useHovercardHeading,
+  HovercardHeading
+};

package/esm/__chunks/ID4VKXL5.js

@@ -0,0 +1,52 @@
+"use client";
+import {
+  useCommand
+} from "./ZF6ZK5BT.js";
+import {
+  createElement,
+  createHook,
+  forwardRef
+} from "./5M6RSQEC.js";
+import {
+  useMergeRefs,
+  useTagName
+} from "./6O5OEQGF.js";
+import {
+  __spreadProps,
+  __spreadValues
+} from "./4R3V3JGP.js";
+
+// src/button/button.ts
+import { useEffect, useRef, useState } from "react";
+import { isButton } from "@ariakit/core/utils/dom";
+var TagName = "button";
+var useButton = createHook(
+  function useButton2(props) {
+    const ref = useRef(null);
+    const tagName = useTagName(ref, TagName);
+    const [isNativeButton, setIsNativeButton] = useState(
+      () => !!tagName && isButton({ tagName, type: props.type })
+    );
+    useEffect(() => {
+      if (!ref.current)
+        return;
+      setIsNativeButton(isButton(ref.current));
+    }, []);
+    props = __spreadProps(__spreadValues({
+      role: !isNativeButton && tagName !== "a" ? "button" : void 0
+    }, props), {
+      ref: useMergeRefs(ref, props.ref)
+    });
+    props = useCommand(props);
+    return props;
+  }
+);
+var Button = forwardRef(function Button2(props) {
+  const htmlProps = useButton(props);
+  return createElement(TagName, htmlProps);
+});
+
+export {
+  useButton,
+  Button
+};