@dnanpm/ui-components 0.7.0 → 0.9.0

package/dist/components/Accordion/Accordion.css

@@ -1,4 +1,8 @@
-@layer dds-components {/**
+@layer dds-base, dds-components;
+
+@layer dds-components { @layer fallback, components; }
+
+@layer dds-components.components{/**
  * Accordion Component Styles
  *
  * Layout wrapper that spaces AccordionItem children evenly.
@@ -15,5 +19,4 @@
 
 ._accordion--panel_18qm2_16 {
     gap: 0;
-}
-}
+} }

package/dist/components/AccordionItem/AccordionItem.css

@@ -1,4 +1,8 @@
-@layer dds-components {/**
+@layer dds-base, dds-components;
+
+@layer dds-components { @layer fallback, components; }
+
+@layer dds-components.components{/**
  * AccordionItem Component Styles
  *
  * Uses native <details> element for expand/collapse behavior.
@@ -124,5 +128,4 @@
         /* calc-size() function allows transition to height: auto; */
         block-size: calc-size(auto, size);
     }
-}
-}
+} }

package/dist/components/Breadcrumb/Breadcrumb.css

@@ -1,4 +1,8 @@
-@layer dds-components {/**
+@layer dds-base, dds-components;
+
+@layer dds-components { @layer fallback, components; }
+
+@layer dds-components.components{/**
  * Breadcrumb Component Styles
  *
  * Design tokens are consumed via CSS custom properties (variables).
@@ -7,14 +11,14 @@
  * Uses a container query (ch units) to switch between default and collapsed mode.
  */
 
-._breadcrumb_1q2qc_10 {
+._breadcrumb_1c8nk_10 {
     container-name: breadcrumb;
     container-type: inline-size;
     width: 100%;
     overflow: hidden;
 }
 
-._breadcrumb__list_1q2qc_17 {
+._breadcrumb__list_1c8nk_17 {
     display: flex;
     align-items: center;
     gap: var(--spacing-space-4);
@@ -23,7 +27,7 @@
     list-style: none;
 }
 
-._breadcrumb__item_1q2qc_26 {
+._breadcrumb__item_1c8nk_26 {
     flex: 0 0 auto;
     margin: 0;
     padding: 0;
@@ -42,21 +46,21 @@
     }
 }
 
-._breadcrumb__link_1q2qc_45 {
+._breadcrumb__link_1c8nk_45 {
     color: var(--color-semantic-interactive-primary-default);
-    border-radius: var(--radius-semantic-sm);
 }
 
-._breadcrumb__link_1q2qc_45:hover {
+._breadcrumb__link_1c8nk_45:hover,
+._breadcrumb__link_1c8nk_45:focus-visible {
     color: var(--color-semantic-interactive-primary-hover);
 }
 
-._breadcrumb__current_1q2qc_54 {
+._breadcrumb__current_1c8nk_54 {
     overflow: hidden;
     text-overflow: ellipsis;
 }
 
-._breadcrumb__separator_1q2qc_59 {
+._breadcrumb__separator_1c8nk_59 {
     flex: 0 0 auto;
     width: 0.875rem;
     height: 0.875rem;
@@ -65,8 +69,7 @@
 
 /* Collapsed mode: hide all items except the last two */
 @container breadcrumb (max-width: 75ch) {
-    ._breadcrumb__item_1q2qc_26:not(:nth-last-child(-n + 2)) {
+    ._breadcrumb__item_1c8nk_26:not(:nth-last-child(-n + 2)) {
         display: none;
     }
-}
-}
+} }

package/dist/components/Breadcrumb/Breadcrumb.module.css.cjs

@@ -1,12 +1,12 @@
 require('./Breadcrumb.css');
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const breadcrumb = "_breadcrumb_1q2qc_10";
-const breadcrumb__list = "_breadcrumb__list_1q2qc_17";
-const breadcrumb__item = "_breadcrumb__item_1q2qc_26";
-const breadcrumb__link = "_breadcrumb__link_1q2qc_45";
-const breadcrumb__current = "_breadcrumb__current_1q2qc_54";
-const breadcrumb__separator = "_breadcrumb__separator_1q2qc_59";
+const breadcrumb = "_breadcrumb_1c8nk_10";
+const breadcrumb__list = "_breadcrumb__list_1c8nk_17";
+const breadcrumb__item = "_breadcrumb__item_1c8nk_26";
+const breadcrumb__link = "_breadcrumb__link_1c8nk_45";
+const breadcrumb__current = "_breadcrumb__current_1c8nk_54";
+const breadcrumb__separator = "_breadcrumb__separator_1c8nk_59";
 const styles = {
   breadcrumb,
   breadcrumb__list,

package/dist/components/Breadcrumb/Breadcrumb.module.css.js

@@ -1,10 +1,10 @@
 import './Breadcrumb.css';
-const breadcrumb = "_breadcrumb_1q2qc_10";
-const breadcrumb__list = "_breadcrumb__list_1q2qc_17";
-const breadcrumb__item = "_breadcrumb__item_1q2qc_26";
-const breadcrumb__link = "_breadcrumb__link_1q2qc_45";
-const breadcrumb__current = "_breadcrumb__current_1q2qc_54";
-const breadcrumb__separator = "_breadcrumb__separator_1q2qc_59";
+const breadcrumb = "_breadcrumb_1c8nk_10";
+const breadcrumb__list = "_breadcrumb__list_1c8nk_17";
+const breadcrumb__item = "_breadcrumb__item_1c8nk_26";
+const breadcrumb__link = "_breadcrumb__link_1c8nk_45";
+const breadcrumb__current = "_breadcrumb__current_1c8nk_54";
+const breadcrumb__separator = "_breadcrumb__separator_1c8nk_59";
 const styles = {
   breadcrumb,
   breadcrumb__list,

package/dist/components/Button/Button.css

@@ -1,4 +1,4 @@
-@layer dds-components {._button_tpbgh_1 {
+@layer dds-base, dds-components;@layer dds-components { @layer fallback, components; }@layer dds-components.components{._button_1utks_1 {
     display: inline-flex;
     align-items: center;
     justify-content: center;
@@ -15,21 +15,21 @@
         border-color 0.2s ease-in-out;
 }
 
-._button--full-width_tpbgh_18 {
+._button--full-width_1utks_18 {
     width: 100%;
     min-width: 0;
 }
 
 /* ─── Sizes ─── */
 
-._button--normal_tpbgh_25 {
+._button--normal_1utks_25 {
     font: var(--typography-label-lg-bold);
     height: 40px;
     min-width: 128px;
     padding: var(--spacing-space-8) var(--spacing-space-20);
 }
 
-._button--small_tpbgh_32 {
+._button--small_1utks_32 {
     font: var(--typography-label-md-bold);
     height: 32px;
     min-width: 100px;
@@ -38,91 +38,92 @@
 
 /* ─── Primary variant ─── */
 
-._button--primary_tpbgh_41 {
+._button--primary_1utks_41 {
     background-color: var(--color-semantic-interactive-primary-default);
     color: var(--color-semantic-foreground-inverse);
 }
 
-._button--primary_tpbgh_41:hover {
+._button--primary_1utks_41:hover {
     background-color: var(--color-semantic-interactive-primary-hover);
     color: var(--color-semantic-foreground-inverse);
 }
 
-._button--primary_tpbgh_41:active {
+._button--primary_1utks_41:active {
     background-color: var(--color-semantic-interactive-primary-active);
     color: var(--color-semantic-foreground-inverse);
 }
 
-._button--primary_tpbgh_41:focus-visible {
+._button--primary_1utks_41:focus-visible {
     background-color: var(--color-semantic-interactive-primary-focus);
     color: var(--color-semantic-foreground-inverse);
 }
 
 /* ─── Secondary variant ─── */
 
-._button--secondary_tpbgh_63 {
+._button--secondary_1utks_63 {
     background-color: transparent;
     border: var(--borderwidth-semantic-sm) solid var(--color-semantic-interactive-secondary-default);
     color: var(--color-semantic-foreground-secondary-strong);
 }
 
-._button--secondary_tpbgh_63:hover {
+._button--secondary_1utks_63:hover {
     background-color: var(--color-semantic-interactive-secondary-hover);
     border-color: var(--color-semantic-interactive-secondary-hover);
     color: var(--color-semantic-foreground-inverse);
 }
 
-._button--secondary_tpbgh_63:active {
+._button--secondary_1utks_63:active {
     background-color: var(--color-semantic-interactive-secondary-active);
     border-color: var(--color-semantic-interactive-secondary-active);
     color: var(--color-semantic-foreground-inverse);
 }
 
-._button--secondary_tpbgh_63:focus-visible {
+._button--secondary_1utks_63:focus-visible {
     background-color: var(--color-semantic-interactive-secondary-focus);
+    border-color: var(--color-semantic-interactive-secondary-focus);
     color: var(--color-semantic-foreground-inverse);
 }
 
 /* ─── Tertiary variant ─── */
 
-._button--tertiary_tpbgh_88 {
+._button--tertiary_1utks_89 {
     background-color: var(--color-semantic-interactive-neutral-default);
     border: var(--borderwidth-semantic-sm) solid var(--color-semantic-border-neutral-mid);
     color: var(--color-semantic-foreground-secondary-strong);
 }
 
-._button--tertiary_tpbgh_88:hover {
+._button--tertiary_1utks_89:hover {
     background-color: var(--color-semantic-interactive-neutral-hover);
     color: var(--color-semantic-foreground-secondary-strong);
 }
 
-._button--tertiary_tpbgh_88:active {
+._button--tertiary_1utks_89:active {
     background-color: var(--color-semantic-interactive-neutral-active);
     color: var(--color-semantic-foreground-secondary-strong);
 }
 
-._button--tertiary_tpbgh_88:focus-visible {
+._button--tertiary_1utks_89:focus-visible {
     background-color: var(--color-semantic-interactive-neutral-focus);
     color: var(--color-semantic-foreground-secondary-strong);
 }
 
 /* ─── Disabled state ─── */
 
-._button--disabled_tpbgh_111 {
+._button--disabled_1utks_112 {
     pointer-events: none;
 }
 
-._button--primary_tpbgh_41._button--disabled_tpbgh_111 {
+._button--primary_1utks_41._button--disabled_1utks_112 {
     background-color: var(--color-semantic-interactive-primary-disabled);
     color: var(--color-semantic-foreground-muted);
 }
 
-._button--secondary_tpbgh_63._button--disabled_tpbgh_111 {
+._button--secondary_1utks_63._button--disabled_1utks_112 {
     border-color: var(--color-semantic-interactive-secondary-disabled);
     color: var(--color-semantic-foreground-muted);
 }
 
-._button--tertiary_tpbgh_88._button--disabled_tpbgh_111 {
+._button--tertiary_1utks_89._button--disabled_1utks_112 {
     background-color: var(--color-semantic-interactive-neutral-disabled);
     color: var(--color-semantic-foreground-muted);
 }
@@ -131,38 +132,39 @@
 /* Styles apply from [data-color-scheme="dark"] down to (but not into) [data-color-scheme="light"]. */
 
 @scope ([data-color-scheme='dark']) to ([data-color-scheme='light']) {
-    ._button--primary_tpbgh_41._button--disabled_tpbgh_111 {
+    ._button--primary_1utks_41._button--disabled_1utks_112 {
         color: var(--color-semantic-foreground-inverse-muted);
     }
 
-    ._button--secondary_tpbgh_63 {
+    ._button--secondary_1utks_63 {
         border-color: var(--color-semantic-interactive-inverse-default);
         color: var(--color-semantic-foreground-inverse);
     }
 
-    ._button--secondary_tpbgh_63:hover {
+    ._button--secondary_1utks_63:hover {
         background-color: var(--color-semantic-interactive-inverse-hover);
         border-color: var(--color-semantic-interactive-inverse-hover);
         color: var(--color-semantic-foreground-secondary-strong);
     }
 
-    ._button--secondary_tpbgh_63:active {
+    ._button--secondary_1utks_63:active {
         background-color: var(--color-semantic-interactive-inverse-active);
         border-color: var(--color-semantic-interactive-inverse-active);
         color: var(--color-semantic-foreground-secondary-strong);
     }
 
-    ._button--secondary_tpbgh_63:focus-visible {
+    ._button--secondary_1utks_63:focus-visible {
         background-color: var(--color-semantic-interactive-inverse-focus);
+        border-color: var(--color-semantic-interactive-inverse-focus);
         color: var(--color-semantic-foreground-secondary-strong);
     }
 
-    ._button--secondary_tpbgh_63._button--disabled_tpbgh_111 {
+    ._button--secondary_1utks_63._button--disabled_1utks_112 {
         border-color: var(--color-semantic-interactive-inverse-disabled);
         color: var(--color-semantic-foreground-inverse-muted);
     }
 
-    ._button--tertiary_tpbgh_88._button--disabled_tpbgh_111 {
+    ._button--tertiary_1utks_89._button--disabled_1utks_112 {
         border-color: var(--color-semantic-interactive-neutral-disabled);
         color: var(--color-semantic-foreground-inverse-muted);
     }
@@ -170,11 +172,11 @@
 
 /* ─── Loading state ─── */
 
-._button--loading_tpbgh_173 {
+._button--loading_1utks_175 {
     pointer-events: none;
 }
 
-._button__content_tpbgh_177 {
+._button__content_1utks_179 {
     flex: 0 1 auto;
     min-width: 0;
     overflow: hidden;
@@ -182,7 +184,6 @@
     white-space: nowrap;
 }
 
-._button__spinner_tpbgh_185 {
+._button__spinner_1utks_187 {
     flex: 0 0 auto;
-}
-}
+} }

package/dist/components/Button/Button.module.css.cjs

@@ -1,19 +1,19 @@
 require('./Button.css');
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const button = "_button_tpbgh_1";
-const button__content = "_button__content_tpbgh_177";
-const button__spinner = "_button__spinner_tpbgh_185";
+const button = "_button_1utks_1";
+const button__content = "_button__content_1utks_179";
+const button__spinner = "_button__spinner_1utks_187";
 const styles = {
   button,
-  "button--full-width": "_button--full-width_tpbgh_18",
-  "button--normal": "_button--normal_tpbgh_25",
-  "button--small": "_button--small_tpbgh_32",
-  "button--primary": "_button--primary_tpbgh_41",
-  "button--secondary": "_button--secondary_tpbgh_63",
-  "button--tertiary": "_button--tertiary_tpbgh_88",
-  "button--disabled": "_button--disabled_tpbgh_111",
-  "button--loading": "_button--loading_tpbgh_173",
+  "button--full-width": "_button--full-width_1utks_18",
+  "button--normal": "_button--normal_1utks_25",
+  "button--small": "_button--small_1utks_32",
+  "button--primary": "_button--primary_1utks_41",
+  "button--secondary": "_button--secondary_1utks_63",
+  "button--tertiary": "_button--tertiary_1utks_89",
+  "button--disabled": "_button--disabled_1utks_112",
+  "button--loading": "_button--loading_1utks_175",
   button__content,
   button__spinner
 };

package/dist/components/Button/Button.module.css.js

@@ -1,17 +1,17 @@
 import './Button.css';
-const button = "_button_tpbgh_1";
-const button__content = "_button__content_tpbgh_177";
-const button__spinner = "_button__spinner_tpbgh_185";
+const button = "_button_1utks_1";
+const button__content = "_button__content_1utks_179";
+const button__spinner = "_button__spinner_1utks_187";
 const styles = {
   button,
-  "button--full-width": "_button--full-width_tpbgh_18",
-  "button--normal": "_button--normal_tpbgh_25",
-  "button--small": "_button--small_tpbgh_32",
-  "button--primary": "_button--primary_tpbgh_41",
-  "button--secondary": "_button--secondary_tpbgh_63",
-  "button--tertiary": "_button--tertiary_tpbgh_88",
-  "button--disabled": "_button--disabled_tpbgh_111",
-  "button--loading": "_button--loading_tpbgh_173",
+  "button--full-width": "_button--full-width_1utks_18",
+  "button--normal": "_button--normal_1utks_25",
+  "button--small": "_button--small_1utks_32",
+  "button--primary": "_button--primary_1utks_41",
+  "button--secondary": "_button--secondary_1utks_63",
+  "button--tertiary": "_button--tertiary_1utks_89",
+  "button--disabled": "_button--disabled_1utks_112",
+  "button--loading": "_button--loading_1utks_175",
   button__content,
   button__spinner
 };

package/dist/components/ButtonCard/ButtonCard.cjs

@@ -0,0 +1,105 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const icons = require("@dnanpm/icons");
+const focus_module = require("../../styles/utils/focus.module.css.cjs");
+const elevation_module = require("../../styles/utils/elevation.module.css.cjs");
+const ButtonCard_module = require("./ButtonCard.module.css.cjs");
+const cn = require("../../utils/cn/cn.cjs");
+const ButtonCard = ({
+  title,
+  subtitle,
+  size = "medium",
+  icon,
+  image,
+  isExternal = false,
+  externalLinkAriaLabel = "avautuu uuteen välilehteen",
+  className,
+  ref,
+  ...props
+}) => {
+  const isAnchor = "href" in props && props.href != null;
+  const classes = cn.cn(
+    ButtonCard_module["button-card"],
+    ButtonCard_module[`button-card--${size}`],
+    focus_module.default.focusable,
+    elevation_module.default.elevationLow,
+    className
+  );
+  const IconComponent = icon;
+  const media = IconComponent != null ? /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      className: cn.cn(ButtonCard_module["button-card__media"], ButtonCard_module["button-card__media--icon"]),
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsxRuntime.jsx(IconComponent, { "aria-hidden": "true" })
+    }
+  ) : image ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn.cn(ButtonCard_module["button-card__media"], ButtonCard_module["button-card__media--image"]), children: image }) : null;
+  const explicitTarget = isAnchor ? props.target?.toLowerCase() : void 0;
+  const opensInNewTab = isExternal || explicitTarget === "_blank";
+  const Indicator = opensInNewTab ? icons.Open : icons.ChevronRight;
+  const content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    media,
+    /* @__PURE__ */ jsxRuntime.jsxs("span", { className: ButtonCard_module["button-card__content"], children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("span", { className: ButtonCard_module["button-card__text"], children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: ButtonCard_module["button-card__title"], children: title }),
+        subtitle != null && /* @__PURE__ */ jsxRuntime.jsx("span", { className: ButtonCard_module["button-card__subtitle"], children: subtitle })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: ButtonCard_module["button-card__indicator"], "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(Indicator, { "aria-hidden": "true" }) })
+    ] }),
+    opensInNewTab && externalLinkAriaLabel && /* @__PURE__ */ jsxRuntime.jsx("span", { className: ButtonCard_module["button-card__sr-only"], children: ` (${externalLinkAriaLabel})` })
+  ] });
+  if (isAnchor) {
+    const {
+      href,
+      renderLink,
+      target: targetProp,
+      rel,
+      disabled: _disabled,
+      ...safeAnchorProps
+    } = props;
+    const target = isExternal ? "_blank" : targetProp;
+    const shouldHardenRel = target?.toLowerCase() === "_blank";
+    const relTokens = new Set(
+      (rel ?? "").split(/\s+/).filter(Boolean).map((token) => token.toLowerCase())
+    );
+    if (shouldHardenRel) {
+      relTokens.add("noopener");
+      relTokens.add("noreferrer");
+    }
+    const hardenedRel = relTokens.size > 0 ? Array.from(relTokens).join(" ") : void 0;
+    const linkProps = {
+      ...safeAnchorProps,
+      ref,
+      href,
+      target,
+      rel: hardenedRel,
+      className: classes,
+      children: content
+    };
+    if (renderLink) {
+      return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: renderLink(linkProps) });
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx("a", { ...linkProps });
+  }
+  const {
+    type = "button",
+    href: _href,
+    target: _target,
+    rel: _rel,
+    renderLink: _renderLink,
+    ...buttonProps
+  } = props;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "button",
+    {
+      ref,
+      type,
+      className: classes,
+      ...buttonProps,
+      children: content
+    }
+  );
+};
+exports.ButtonCard = ButtonCard;
+//# sourceMappingURL=ButtonCard.cjs.map

package/dist/components/ButtonCard/ButtonCard.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonCard.cjs","sources":["../../../src/components/ButtonCard/ButtonCard.tsx"],"sourcesContent":["import type { ComponentPropsWithRef, ReactNode, Ref } from 'react';\nimport { ChevronRight, Open } from '@dnanpm/icons';\nimport { cn } from '../../utils/cn';\nimport focusStyles from '../../styles/utils/focus.module.css';\nimport elevationStyles from '../../styles/utils/elevation.module.css';\nimport styles from './ButtonCard.module.css';\nimport type { ButtonCardLinkProps, ButtonCardProps } from './ButtonCard.types';\n\nexport const ButtonCard = ({\n    title,\n    subtitle,\n    size = 'medium',\n    icon,\n    image,\n    isExternal = false,\n    externalLinkAriaLabel = 'avautuu uuteen välilehteen',\n    className,\n    ref,\n    ...props\n}: ButtonCardProps) => {\n    const isAnchor = 'href' in props && (props as { href?: string }).href != null;\n\n    const classes = cn(\n        styles['button-card'],\n        styles[`button-card--${size}`],\n        focusStyles.focusable,\n        elevationStyles.elevationLow,\n        className,\n    );\n\n    const IconComponent = icon;\n\n    const media =\n        IconComponent != null ? (\n            <span\n                className={cn(styles['button-card__media'], styles['button-card__media--icon'])}\n                aria-hidden=\"true\"\n            >\n                <IconComponent aria-hidden=\"true\" />\n            </span>\n        ) : image ? (\n            <span className={cn(styles['button-card__media'], styles['button-card__media--image'])}>\n                {image}\n            </span>\n        ) : null;\n\n    const explicitTarget = isAnchor\n        ? (props as { target?: string }).target?.toLowerCase()\n        : undefined;\n    // The link opens a new tab when isExternal is set or the target is _blank.\n    const opensInNewTab = isExternal || explicitTarget === '_blank';\n    const Indicator = opensInNewTab ? Open : ChevronRight;\n\n    const content = (\n        <>\n            {media}\n            <span className={styles['button-card__content']}>\n                <span className={styles['button-card__text']}>\n                    <span className={styles['button-card__title']}>{title}</span>\n                    {subtitle != null && (\n                        <span className={styles['button-card__subtitle']}>{subtitle}</span>\n                    )}\n                </span>\n                <span className={styles['button-card__indicator']} aria-hidden=\"true\">\n                    <Indicator aria-hidden=\"true\" />\n                </span>\n            </span>\n            {opensInNewTab && externalLinkAriaLabel && (\n                <span className={styles['button-card__sr-only']}>\n                    {` (${externalLinkAriaLabel})`}\n                </span>\n            )}\n        </>\n    );\n\n    if (isAnchor) {\n        const {\n            href,\n            renderLink,\n            target: targetProp,\n            rel,\n            disabled: _disabled,\n            ...safeAnchorProps\n        } = props as unknown as ComponentPropsWithRef<'a'> & {\n            href: string;\n            renderLink?: (props: ButtonCardLinkProps) => ReactNode;\n            disabled?: boolean;\n        };\n\n        // isExternal is authoritative and forces a new tab; an explicit _blank is preserved.\n        const target = isExternal ? '_blank' : targetProp;\n        const shouldHardenRel = target?.toLowerCase() === '_blank';\n        const relTokens = new Set(\n            (rel ?? '')\n                .split(/\\s+/)\n                .filter(Boolean)\n                .map((token) => token.toLowerCase()),\n        );\n\n        if (shouldHardenRel) {\n            relTokens.add('noopener');\n            relTokens.add('noreferrer');\n        }\n\n        const hardenedRel = relTokens.size > 0 ? Array.from(relTokens).join(' ') : undefined;\n\n        const linkProps = {\n            ...safeAnchorProps,\n            ref: ref as Ref<HTMLAnchorElement>,\n            href,\n            target,\n            rel: hardenedRel,\n            className: classes,\n            children: content,\n        };\n\n        if (renderLink) {\n            return <>{renderLink(linkProps)}</>;\n        }\n\n        return <a {...linkProps} />;\n    }\n\n    const {\n        type = 'button',\n        href: _href,\n        target: _target,\n        rel: _rel,\n        renderLink: _renderLink,\n        ...buttonProps\n    } = props as unknown as ComponentPropsWithRef<'button'> & {\n        href?: string;\n        target?: string;\n        rel?: string;\n        renderLink?: unknown;\n    };\n\n    return (\n        <button\n            ref={ref as Ref<HTMLButtonElement>}\n            type={type}\n            className={classes}\n            {...buttonProps}\n        >\n            {content}\n        </button>\n    );\n};\n"],"names":["cn","styles","focusStyles","elevationStyles","jsx","Open","ChevronRight","jsxs","Fragment"],"mappings":"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"}