@stratakit/bricks/dist/Anchor.js

Small, modular components for StrataKit

import { Fragment, jsx, jsxs } from "react/jsx-runtime";
import { Focusable } from "@ariakit/react/focusable";
import { Role } from "@ariakit/react/role";
import { forwardRef } from "@stratakit/foundations/secret-internals";
import cx from "classnames";
import { useInit } from "./~utils.useInit.js";
import VisuallyHidden from "./VisuallyHidden.js";
const AnchorRoot = forwardRef((props, forwardedRef) => {
  useInit();
  const {
    tone = "neutral",
    ...rest
  } = props;
  return /* @__PURE__ */ jsx(Role.a, {
    ...rest,
    "data-_sk-tone": tone,
    className: cx("\u{1F95D}Anchor", props.className),
    render: /* @__PURE__ */ jsx(Focusable, {
      accessibleWhenDisabled: true,
      render: props.render || /* @__PURE__ */ jsx("a", {})
    }),
    ref: forwardedRef
  });
});
const AnchorText = forwardRef((props, forwardedRef) => {
  return /* @__PURE__ */ jsx(Role.span, {
    ...props,
    className: cx("\u{1F95D}AnchorText", props.className),
    ref: forwardedRef
  });
});
const AnchorExternalMarker = forwardRef((props, forwardedRef) => {
  const {
    alt = "external",
    ...rest
  } = props;
  return /* @__PURE__ */ jsxs(Fragment, {
    children: [/* @__PURE__ */ jsx(Role.span, {
      "aria-hidden": "true",
      ...rest,
      className: cx("\u{1F95D}AnchorExternalMarker", props.className),
      ref: forwardedRef,
      children: "\xA0\u2197"
    }), /* @__PURE__ */ jsxs(VisuallyHidden, {
      children: [" (", alt, ")"]
    })]
  });
});
const Anchor = forwardRef((props, forwardedRef) => {
  const {
    tone = "neutral",
    ...rest
  } = props;
  return /* @__PURE__ */ jsx(AnchorRoot, {
    ...rest,
    tone,
    ref: forwardedRef
  });
});
var Anchor_default = Anchor;
export {
  AnchorExternalMarker as ExternalMarker,
  AnchorRoot as Root,
  AnchorText as Text,
  Anchor_default as default
};