"use client";
import {
  useTouchDevice
} from "../__chunks/FPWVE2AH.js";
import {
  TagRemoveIdContext,
  TagValueContext,
  useTagContext
} from "../__chunks/XSIEPKGA.js";
import {
  useCompositeItem
} from "../__chunks/WZWDIE3S.js";
import "../__chunks/5VQZOHHZ.js";
import "../__chunks/Z2O3VLAQ.js";
import "../__chunks/AVVXDJMZ.js";
import "../__chunks/PZ3OL7I2.js";
import "../__chunks/U6HHPQDW.js";
import "../__chunks/SWN3JYXT.js";
import "../__chunks/Q5W46E73.js";
import "../__chunks/SMPCIMZM.js";
import {
  createElement,
  createHook,
  forwardRef,
  memo
} from "../__chunks/GWSL6KNJ.js";
import {
  useBooleanEvent,
  useEvent,
  useId,
  useWrapElement
} from "../__chunks/KPHZR4MB.js";
import "../__chunks/YXGXYGQX.js";

// src/tag/tag.tsx
import { invariant } from "@ariakit/core/utils/misc";
import { isApple } from "@ariakit/core/utils/platform";
import { useCallback, useState } from "react";
import { jsx } from "react/jsx-runtime";
var TagName = "div";
var useTag = createHook(function useTag2({
  store,
  value,
  getItem: getItemProp,
  removeOnKeyPress = true,
  ...props
}) {
  const context = useTagContext();
  store = store || context;
  invariant(
    store,
    process.env.NODE_ENV !== "production" && "Tag must be wrapped in a TagList component."
  );
  const id = useId(props.id);
  const touchDevice = useTouchDevice();
  const getItem = useCallback(
    (item) => {
      const nextItem = { ...item, value };
      if (getItemProp) {
        return getItemProp(nextItem);
      }
      return nextItem;
    },
    [value, getItemProp]
  );
  const onKeyDownProp = props.onKeyDown;
  const removeOnKeyPressProp = useBooleanEvent(removeOnKeyPress);
  const onKeyDown = useEvent((event) => {
    onKeyDownProp == null ? void 0 : onKeyDownProp(event);
    if (event.defaultPrevented) return;
    const { inputElement } = store.getState();
    const isBackspace = event.key === "Backspace";
    const isRemoveKey = isBackspace || event.key === "Delete";
    if (isRemoveKey && removeOnKeyPressProp(event)) {
      event.preventDefault();
      store.removeValue(value);
      const nextId = isBackspace ? store.previous() || store.next() : store.next();
      store.move(nextId);
    }
    const isPrintableKey = !event.ctrlKey && !event.metaKey && event.key.length === 1;
    const pc = !isApple();
    const v = event.key === "v" || event.key === "V";
    const mod = pc ? event.ctrlKey : event.metaKey;
    const isPaste = mod && v;
    if (isPrintableKey || isPaste) {
      inputElement == null ? void 0 : inputElement.focus();
    }
  });
  const [removeId, setRemoveId] = useState();
  props = useWrapElement(
    props,
    (element) => /* @__PURE__ */ jsx(TagValueContext.Provider, { value, children: /* @__PURE__ */ jsx(TagRemoveIdContext.Provider, { value: setRemoveId, children: element }) }),
    [value]
  );
  props = {
    id,
    role: !touchDevice ? "option" : "listitem",
    children: value,
    "aria-describedby": removeId,
    ...props,
    onKeyDown
  };
  props = useCompositeItem({
    store,
    ...props,
    getItem
  });
  return props;
});
var Tag = memo(
  forwardRef(function Tag2(props) {
    const htmlProps = useTag(props);
    return createElement(TagName, htmlProps);
  })
);
export {
  Tag,
  useTag
};
