@stratakit/bricks/dist/Kbd.js

Small, modular components for StrataKit

import { Fragment, jsx, jsxs } from "react/jsx-runtime";
import { Role } from "@ariakit/react/role";
import { forwardRef } from "@stratakit/foundations/secret-internals";
import cx from "classnames";
import { useInit } from "./~utils.useInit.js";
import { predefinedSymbols } from "./Kbd.internal.js";
import VisuallyHidden from "./VisuallyHidden.js";
const Kbd = forwardRef((props, forwardedRef) => {
  useInit();
  const {
    variant = "solid",
    symbol,
    children,
    ...rest
  } = props;
  let content = children;
  if (symbol) {
    content = /* @__PURE__ */ jsxs(Fragment, {
      children: [/* @__PURE__ */ jsx("span", {
        "aria-hidden": "true",
        children: predefinedSymbols[symbol]
      }), children || /* @__PURE__ */ jsx(VisuallyHidden, {
        children: symbol
      })]
    });
  }
  return /* @__PURE__ */ jsx(Role, {
    ...rest,
    "data-_sk-variant": variant,
    className: cx("\u{1F95D}Kbd", props.className),
    render: props.render || /* @__PURE__ */ jsx("kbd", {}),
    ref: forwardedRef,
    children: content
  });
});
var Kbd_default = Kbd;
export {
  Kbd_default as default
};