@dnanpm/ui-components 0.6.0 → 0.8.0

package/dist/components/AccordionItem/AccordionItem.css

@@ -7,7 +7,7 @@
 
 /* === Box variant === */
 
-._accordion-item--box_131y1_10 {
+._accordion-item--box_koqlc_10 {
     background: var(--color-semantic-surface-base);
     color: var(--color-semantic-foreground-default);
 }
@@ -15,13 +15,13 @@
 /* === Panel variant === */
 /* Inherits text color from parent context intentionally */
 
-._accordion-item--panel_131y1_18 {
+._accordion-item--panel_koqlc_18 {
     border-bottom: var(--borderwidth-semantic-xs) solid var(--color-semantic-border-neutral-mid);
 }
 
 /* === Summary (clickable header) === */
 
-._accordion-item__summary_131y1_24 {
+._accordion-item__summary_koqlc_24 {
     display: flex;
     align-items: center;
     gap: var(--spacing-space-20);
@@ -33,14 +33,14 @@
 }
 
 /* Remove default marker in all browsers */
-._accordion-item__summary_131y1_24::-webkit-details-marker,
-._accordion-item__summary_131y1_24::marker {
+._accordion-item__summary_koqlc_24::-webkit-details-marker,
+._accordion-item__summary_koqlc_24::marker {
     display: none;
 }
 
 /* === Image === */
 
-._accordion-item__image_131y1_43 {
+._accordion-item__image_koqlc_43 {
     display: flex;
     align-items: center;
     justify-content: center;
@@ -57,45 +57,45 @@
 
 /* === Image size variants === */
 
-._accordion-item__image--sm_131y1_60 {
+._accordion-item__image--sm_koqlc_60 {
     width: 1.5rem;
     height: 1.5rem;
 }
 
-._accordion-item__image--md_131y1_65 {
+._accordion-item__image--md_koqlc_65 {
     width: 2.5rem;
     height: 2.5rem;
 }
 
-._accordion-item__image--lg_131y1_70 {
+._accordion-item__image--lg_koqlc_70 {
     width: 5rem;
     height: 5rem;
 }
 
 /* === Label === */
 
-._accordion-item__label_131y1_77 {
+._accordion-item__label_koqlc_77 {
     flex: 1 1 auto;
     min-width: 0;
-    font-weight: var(--typography-font-weight-bold);
+    font: var(--typography-body-md-bold);
 }
 
 /* === Chevron icon === */
 
-._accordion-item__chevron_131y1_85 {
+._accordion-item__chevron_koqlc_85 {
     flex: 0 0 auto;
     width: 1.5rem;
     height: 1.5rem;
     transition: transform 0.2s ease-in-out;
 }
 
-._accordion-item_131y1_10[open] > ._accordion-item__summary_131y1_24 ._accordion-item__chevron_131y1_85 {
+._accordion-item_koqlc_10[open] > ._accordion-item__summary_koqlc_24 ._accordion-item__chevron_koqlc_85 {
     transform: rotate(180deg);
 }
 
 /* === Content area === */
 
-._accordion-item__content_131y1_98 {
+._accordion-item__content_koqlc_98 {
     padding: 0 var(--spacing-space-20) var(--spacing-space-20);
 
     & > *:last-child {
@@ -104,7 +104,7 @@
 }
 
 /* === Animation === */
-._accordion-item_131y1_10::details-content {
+._accordion-item_koqlc_10::details-content {
     display: block;
     block-size: 0;
     opacity: 0;
@@ -116,7 +116,7 @@
         transition-behavior: allow-discrete;
     }
 }
-._accordion-item_131y1_10[open]::details-content {
+._accordion-item_koqlc_10[open]::details-content {
     /* Fallback for browsers that don't support calc-size() function */
     block-size: auto;
     opacity: 1;

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

@@ -1,17 +1,17 @@
 require('./AccordionItem.css');
 "use strict";
 const styles = {
-  "accordion-item--box": "_accordion-item--box_131y1_10",
-  "accordion-item--panel": "_accordion-item--panel_131y1_18",
-  "accordion-item__summary": "_accordion-item__summary_131y1_24",
-  "accordion-item__image": "_accordion-item__image_131y1_43",
-  "accordion-item__image--sm": "_accordion-item__image--sm_131y1_60",
-  "accordion-item__image--md": "_accordion-item__image--md_131y1_65",
-  "accordion-item__image--lg": "_accordion-item__image--lg_131y1_70",
-  "accordion-item__label": "_accordion-item__label_131y1_77",
-  "accordion-item__chevron": "_accordion-item__chevron_131y1_85",
-  "accordion-item": "_accordion-item_131y1_10",
-  "accordion-item__content": "_accordion-item__content_131y1_98"
+  "accordion-item--box": "_accordion-item--box_koqlc_10",
+  "accordion-item--panel": "_accordion-item--panel_koqlc_18",
+  "accordion-item__summary": "_accordion-item__summary_koqlc_24",
+  "accordion-item__image": "_accordion-item__image_koqlc_43",
+  "accordion-item__image--sm": "_accordion-item__image--sm_koqlc_60",
+  "accordion-item__image--md": "_accordion-item__image--md_koqlc_65",
+  "accordion-item__image--lg": "_accordion-item__image--lg_koqlc_70",
+  "accordion-item__label": "_accordion-item__label_koqlc_77",
+  "accordion-item__chevron": "_accordion-item__chevron_koqlc_85",
+  "accordion-item": "_accordion-item_koqlc_10",
+  "accordion-item__content": "_accordion-item__content_koqlc_98"
 };
 module.exports = styles;
 //# sourceMappingURL=AccordionItem.module.css.cjs.map

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

@@ -1,16 +1,16 @@
 import './AccordionItem.css';
 const styles = {
-  "accordion-item--box": "_accordion-item--box_131y1_10",
-  "accordion-item--panel": "_accordion-item--panel_131y1_18",
-  "accordion-item__summary": "_accordion-item__summary_131y1_24",
-  "accordion-item__image": "_accordion-item__image_131y1_43",
-  "accordion-item__image--sm": "_accordion-item__image--sm_131y1_60",
-  "accordion-item__image--md": "_accordion-item__image--md_131y1_65",
-  "accordion-item__image--lg": "_accordion-item__image--lg_131y1_70",
-  "accordion-item__label": "_accordion-item__label_131y1_77",
-  "accordion-item__chevron": "_accordion-item__chevron_131y1_85",
-  "accordion-item": "_accordion-item_131y1_10",
-  "accordion-item__content": "_accordion-item__content_131y1_98"
+  "accordion-item--box": "_accordion-item--box_koqlc_10",
+  "accordion-item--panel": "_accordion-item--panel_koqlc_18",
+  "accordion-item__summary": "_accordion-item__summary_koqlc_24",
+  "accordion-item__image": "_accordion-item__image_koqlc_43",
+  "accordion-item__image--sm": "_accordion-item__image--sm_koqlc_60",
+  "accordion-item__image--md": "_accordion-item__image--md_koqlc_65",
+  "accordion-item__image--lg": "_accordion-item__image--lg_koqlc_70",
+  "accordion-item__label": "_accordion-item__label_koqlc_77",
+  "accordion-item__chevron": "_accordion-item__chevron_koqlc_85",
+  "accordion-item": "_accordion-item_koqlc_10",
+  "accordion-item__content": "_accordion-item__content_koqlc_98"
 };
 export {
   styles as default

package/dist/components/Breadcrumb/Breadcrumb.css

@@ -7,14 +7,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 +23,7 @@
     list-style: none;
 }
 
-._breadcrumb__item_1q2qc_26 {
+._breadcrumb__item_1c8nk_26 {
     flex: 0 0 auto;
     margin: 0;
     padding: 0;
@@ -42,21 +42,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,7 +65,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-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,7 @@
     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