@ariakit/react-core/cjs/form/form-label.cjs

Ariakit React core

"use strict";Object.defineProperty(exports, "__esModule", {value: true});

var _52OIQPAOcjs = require('../__chunks/52OIQPAO.cjs');


var _IH6KF7WRcjs = require('../__chunks/IH6KF7WR.cjs');
require('../__chunks/6HKL3JR2.cjs');





var _WULEED4Qcjs = require('../__chunks/WULEED4Q.cjs');





var _OZM4QA2Vcjs = require('../__chunks/OZM4QA2V.cjs');
require('../__chunks/FDRJDQ5Y.cjs');




var _7EQBAZ46cjs = require('../__chunks/7EQBAZ46.cjs');

// src/form/form-label.tsx
var _focus = require('@ariakit/core/utils/focus');
var _misc = require('@ariakit/core/utils/misc');
var _react = require('react');
var _jsxruntime = require('react/jsx-runtime');
var TagName = "label";
function supportsNativeLabel(tagName) {
  return tagName === "input" || tagName === "textarea" || tagName === "select" || tagName === "meter" || tagName === "progress";
}
var useFormLabel = _WULEED4Qcjs.createHook.call(void 0, 
  function useFormLabel2(_a) {
    var _b = _a, {
      store,
      name: nameProp,
      getItem: getItemProp
    } = _b, props = _7EQBAZ46cjs.__objRest.call(void 0, _b, [
      "store",
      "name",
      "getItem"
    ]);
    const context = _52OIQPAOcjs.useFormContext.call(void 0, );
    store = store || context;
    _misc.invariant.call(void 0, 
      store,
      process.env.NODE_ENV !== "production" && "FormLabel must be wrapped in a Form component."
    );
    const id = _OZM4QA2Vcjs.useId.call(void 0, props.id);
    const ref = _react.useRef.call(void 0, null);
    const name = `${nameProp}`;
    const getItem = _react.useCallback.call(void 0, 
      (item) => {
        const nextItem = _7EQBAZ46cjs.__spreadProps.call(void 0, _7EQBAZ46cjs.__spreadValues.call(void 0, {}, item), { id: id || item.id, name, type: "label" });
        if (getItemProp) {
          return getItemProp(nextItem);
        }
        return nextItem;
      },
      [id, name, getItemProp]
    );
    const field = store.useState(
      (state) => state.items.find((item) => item.type === "field" && item.name === name)
    );
    const fieldTagName = _OZM4QA2Vcjs.useTagName.call(void 0, field == null ? void 0 : field.element, "input");
    const isNativeLabel = supportsNativeLabel(fieldTagName);
    const onClickProp = props.onClick;
    const onClick = _OZM4QA2Vcjs.useEvent.call(void 0, (event) => {
      onClickProp == null ? void 0 : onClickProp(event);
      if (event.defaultPrevented) return;
      if (isNativeLabel) return;
      const fieldElement = field == null ? void 0 : field.element;
      if (!fieldElement) return;
      queueMicrotask(() => {
        const focusableElement = _focus.getFirstTabbableIn.call(void 0, fieldElement, true, true);
        focusableElement == null ? void 0 : focusableElement.focus();
        const role = focusableElement == null ? void 0 : focusableElement.getAttribute("role");
        if (role === "combobox") return;
        focusableElement == null ? void 0 : focusableElement.click();
      });
    });
    props = _7EQBAZ46cjs.__spreadProps.call(void 0, _7EQBAZ46cjs.__spreadValues.call(void 0, {
      id,
      render: isNativeLabel ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "label", {}) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", {}),
      htmlFor: isNativeLabel ? field == null ? void 0 : field.id : void 0
    }, props), {
      ref: _OZM4QA2Vcjs.useMergeRefs.call(void 0, ref, props.ref),
      onClick
    });
    if (!isNativeLabel) {
      props = _7EQBAZ46cjs.__spreadProps.call(void 0, _7EQBAZ46cjs.__spreadValues.call(void 0, {}, props), {
        style: _7EQBAZ46cjs.__spreadValues.call(void 0, {
          cursor: "default"
        }, props.style)
      });
    }
    props = _IH6KF7WRcjs.useCollectionItem.call(void 0, _7EQBAZ46cjs.__spreadProps.call(void 0, _7EQBAZ46cjs.__spreadValues.call(void 0, { store }, props), { getItem }));
    return props;
  }
);
var FormLabel = _WULEED4Qcjs.memo.call(void 0, 
  _WULEED4Qcjs.forwardRef.call(void 0, function FormLabel2(props) {
    const htmlProps = useFormLabel(props);
    return _WULEED4Qcjs.createElement.call(void 0, TagName, htmlProps);
  })
);



exports.FormLabel = FormLabel; exports.useFormLabel = useFormLabel;