npm - @dnanpm/ui-components - Versions diffs - 0.9.0 → 0.10.0 - Mend

@dnanpm/ui-components 0.9.0 → 0.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (240) hide show

package/dist/components/Hero/Hero.css CHANGED Viewed

@@ -1,4 +1,4 @@
-@layer dds-base, dds-components;@layer dds-components { @layer fallback, components; }@layer dds-components.components{._hero_1itry_1 {
+@layer dds-base, dds-components;@layer dds-components { @layer fallback, components; }@layer dds-components.components{._hero_fgniv_1 {
     position: relative;
     display: flex;
     flex-direction: column;
@@ -13,7 +13,7 @@
     --_hero-card-fraction: 1;
 }
-._hero__background_1itry_16 {
+._hero__background_fgniv_16 {
     position: absolute;
     inset-inline: 0;
     top: 0;
@@ -22,21 +22,21 @@
     overflow: clip;
 }
-._hero__backgroundImageComponent_1itry_25 {
+._hero__backgroundImageComponent_fgniv_25 {
     width: 100%;
     height: 100%;
 }
-._hero__backgroundImageComponent_1itry_25 > * {
+._hero__backgroundImageComponent_fgniv_25 > * {
     width: 100%;
     height: 100%;
 }
-._hero__backgroundImageComponent_1itry_25 img,
-._hero__backgroundImageComponent_1itry_25 picture,
-._hero__backgroundImageComponent_1itry_25 video,
-._hero__backgroundImageComponent_1itry_25 canvas,
-._hero__backgroundImageComponent_1itry_25 svg {
+._hero__backgroundImageComponent_fgniv_25 img,
+._hero__backgroundImageComponent_fgniv_25 picture,
+._hero__backgroundImageComponent_fgniv_25 video,
+._hero__backgroundImageComponent_fgniv_25 canvas,
+._hero__backgroundImageComponent_fgniv_25 svg {
     display: block;
     width: 100%;
     height: 100%;
@@ -44,14 +44,14 @@
     object-position: right center;
 }
-._hero__logoImageWrap_1itry_47 {
+._hero__logoImageWrap_fgniv_47 {
     position: absolute;
     inset: 0;
-    max-width: 1280px;
+    max-width: var(--layout-semantic-container-wide);
     margin-inline: auto;
 }
-._hero__logoImage_1itry_47 {
+._hero__logoImage_fgniv_47 {
     position: absolute;
     /* Insets bound the available area; padding provides the safety margins to those edges. */
     top: 0;
@@ -66,13 +66,13 @@
     padding: var(--spacing-space-32) var(--spacing-space-40) var(--spacing-space-20);
 }
-._hero__logoImage_1itry_47 > * {
+._hero__logoImage_fgniv_47 > * {
     max-width: 100%;
     max-height: 100%;
     object-fit: contain;
 }
-._hero__overlay_1itry_75 {
+._hero__overlay_fgniv_75 {
     position: absolute;
     inset-inline: 0;
     bottom: 0;
@@ -84,14 +84,14 @@
     );
 }
-._hero__content_1itry_87 {
+._hero__content_fgniv_87 {
     position: relative;
     z-index: 1;
     display: flex;
     flex-direction: column;
     align-items: stretch;
     justify-content: flex-start;
-    max-width: 1280px;
+    max-width: var(--layout-semantic-container-wide);
     gap: 0;
     width: 100%;
     margin-inline: auto;
@@ -99,71 +99,72 @@
     padding-inline: var(--_hero-content-pad-start) var(--_hero-content-pad-end);
 }
-._hero__card_1itry_102 {
+._hero__card_fgniv_102 {
     min-width: 0;
     width: calc(var(--_hero-card-fraction) * 100%);
+    color: var(--color-semantic-foreground-default);
     background-color: var(--color-semantic-surface-base);
     border: var(--borderwidth-semantic-xs) solid var(--color-semantic-border-neutral-base);
     border-radius: var(--radius-semantic-md);
     padding: var(--spacing-space-20);
 }
-._hero__main_1itry_111 {
+._hero__main_fgniv_112 {
     display: flex;
     flex-direction: column;
     gap: var(--spacing-space-40);
 }
-._hero__text_1itry_117 {
+._hero__text_fgniv_118 {
     display: flex;
     flex-direction: column;
     gap: var(--spacing-space-20);
 }
-._hero__header_1itry_123 {
+._hero__header_fgniv_124 {
     display: flex;
     flex-direction: column;
     gap: var(--spacing-space-8);
 }
-._hero__label_1itry_129 {
+._hero__label_fgniv_130 {
     align-self: flex-start;
 }
-._hero__heading_1itry_133 {
+._hero__heading_fgniv_134 {
     margin: 0;
     color: var(--color-semantic-foreground-default);
     text-wrap: balance;
 }
-._hero__heading--default_1itry_139 {
+._hero__heading--default_fgniv_140 {
     font: var(--typography-heading-lg);
 }
-._hero__heading--large_1itry_143 {
+._hero__heading--large_fgniv_144 {
     font: var(--typography-heading-xl);
 }
-._hero__heading--small_1itry_147 {
+._hero__heading--small_fgniv_148 {
     font: var(--typography-heading-md);
 }
-._hero__description_1itry_151 {
+._hero__description_fgniv_152 {
     margin: 0;
     color: var(--color-semantic-foreground-default);
     font: var(--typography-body-md);
     text-wrap: pretty;
 }
-._hero__description_1itry_151 p {
+._hero__description_fgniv_152 p {
     margin: 0;
 }
-._hero__description_1itry_151 p + p {
+._hero__description_fgniv_152 p + p {
     margin-top: var(--spacing-space-12);
 }
-._hero__actions_1itry_166 {
+._hero__actions_fgniv_167 {
     display: flex;
     flex-direction: row;
     align-items: flex-start;
@@ -172,19 +173,19 @@
 }
 @container hero (min-width: 768px) {
-    ._hero__content_1itry_87,
-    ._hero__background_1itry_16 {
+    ._hero__content_fgniv_87,
+    ._hero__background_fgniv_16 {
         --_hero-content-pad-start: var(--spacing-space-40);
         --_hero-content-pad-end: var(--spacing-space-40);
         --_hero-card-fraction: 0.5;
     }
-    ._hero__background_1itry_16 {
+    ._hero__background_fgniv_16 {
         height: auto;
         bottom: var(--spacing-space-40);
     }
-    ._hero__content_1itry_87 {
+    ._hero__content_fgniv_87 {
         flex-direction: row;
         align-items: flex-end;
         min-height: 460px;
@@ -192,11 +193,11 @@
         padding-top: 0;
     }
-    ._hero__card_1itry_102 {
+    ._hero__card_fgniv_102 {
         max-width: 650px;
     }
-    ._hero__logoImage_1itry_47 {
+    ._hero__logoImage_fgniv_47 {
         bottom: 0;
         padding: var(--spacing-space-40);
         /* Inner edge sits at the card's right edge: pad-start + card-fraction of the content box. */
@@ -208,38 +209,42 @@
 }
 @container hero (min-width: 1024px) {
-    ._hero__content_1itry_87,
-    ._hero__background_1itry_16 {
+    ._hero__content_fgniv_87,
+    ._hero__background_fgniv_16 {
         --_hero-content-pad-start: var(--spacing-space-80);
         --_hero-content-pad-end: var(--spacing-space-40);
         --_hero-card-fraction: 0.6;
     }
-    ._hero__content_1itry_87 {
+    ._hero__content_fgniv_87 {
         min-height: 440px;
     }
-    ._hero__card_1itry_102 {
+    ._hero__card_fgniv_102 {
         max-width: initial;
         padding: var(--spacing-space-40);
     }
 }
 @media (forced-colors: active) {
-    ._hero__overlay_1itry_75 {
+    ._hero__overlay_fgniv_75 {
         display: none;
     }
-    ._hero__background_1itry_16 {
+    ._hero__background_fgniv_16 {
         background-color: Canvas;
     }
-    ._hero__card_1itry_102 {
+    ._hero__card_fgniv_102 {
         border: var(--borderwidth-semantic-xs) solid CanvasText;
         box-shadow: none;
     }
-    ._hero__logoImageWrap_1itry_47 {
+    ._hero__logoImageWrap_fgniv_47 {
         display: none;
     }
-} }
+}
+/**
+ * Do not edit directly, this file was auto-generated.
+ */ }

package/dist/components/Hero/Hero.d.ts CHANGED Viewed

@@ -1,3 +1,3 @@
 import { HeroProps } from './Hero.types';
-export declare const Hero: ({ label, heading, description, headingLevel, headingStyle, Image, imageProps, LogoImage, logoImageProps, backgroundColor, primaryCta, secondaryCta, className, ref, ...props }: HeroProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Hero: ({ label, heading, description, headingLevel, headingStyle, Image, imageProps, LogoImage, logoImageProps, backgroundColor, actions, className, ref, ...props }: HeroProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Hero.d.ts.map

package/dist/components/Hero/Hero.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Hero.d.ts","sourceRoot":"","sources":["../../../src/components/Hero/Hero.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAG9C,eAAO,MAAM,IAAI,GAAI,~~gLAgBlB,~~SAAS,~~4CAuEX~~,CAAC"}
1	+ {"version":3,"file":"Hero.d.ts","sourceRoot":"","sources":["../../../src/components/Hero/Hero.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAG9C,eAAO,MAAM,IAAI,GAAI,+JAelB,SAAS,4CAqEX,CAAC"}

package/dist/components/Hero/Hero.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useId } from "react";
-import elevationStyles from "../../styles/utils/elevation.module.css.js";
+import { elevationStyles } from "../../styles/utils/index.js";
 import styles from "./Hero.module.css.js";
 import { headingClassByStyle } from "./Hero.utils.js";
 import { cn } from "../../utils/cn/cn.js";
@@ -15,8 +15,7 @@ const Hero = ({
   LogoImage,
   logoImageProps,
   backgroundColor,
-  primaryCta,
-  secondaryCta,
+  actions,
   className,
   ref,
   ...props
@@ -27,7 +26,7 @@ const Hero = ({
   const image = ResolvedImage != null ? /* @__PURE__ */ jsx(ResolvedImage, { ...imageProps }) : void 0;
   const logoImage = ResolvedLogoImage != null ? /* @__PURE__ */ jsx(ResolvedLogoImage, { ...logoImageProps }) : void 0;
   const HeadingLevel = headingLevel;
-  const hasActions = primaryCta != null || secondaryCta != null;
+  const hasActions = actions != null && typeof actions !== "boolean";
   const backgroundStyle = image == null && backgroundColor != null ? { backgroundColor } : void 0;
   const ariaLabelledBy = props["aria-label"] ? void 0 : props["aria-labelledby"] || headingId;
   return /* @__PURE__ */ jsxs(
@@ -44,29 +43,33 @@ const Hero = ({
           /* @__PURE__ */ jsx("div", { className: styles.hero__overlay, "aria-hidden": "true" }),
           logoImage != null && /* @__PURE__ */ jsx("div", { className: styles.hero__logoImageWrap, "aria-hidden": "true", children: /* @__PURE__ */ jsx("div", { className: styles.hero__logoImage, children: logoImage }) })
         ] }),
-        /* @__PURE__ */ jsx("div", { className: styles.hero__content, children: /* @__PURE__ */ jsx("div", { className: cn(styles.hero__card, elevationStyles.elevationHigh), children: /* @__PURE__ */ jsxs("div", { className: styles.hero__main, children: [
-          /* @__PURE__ */ jsxs("div", { className: styles.hero__text, children: [
-            /* @__PURE__ */ jsxs("div", { className: styles.hero__header, children: [
-              label != null && /* @__PURE__ */ jsx("div", { className: styles.hero__label, children: label }),
-              /* @__PURE__ */ jsx(
-                HeadingLevel,
-                {
-                  id: headingId,
-                  className: cn(
-                    styles.hero__heading,
-                    headingClassByStyle[headingStyle]
-                  ),
-                  children: heading
-                }
-              )
-            ] }),
-            description != null && /* @__PURE__ */ jsx("div", { className: cn(styles.hero__description, "dds-prose"), children: description })
-          ] }),
-          hasActions && /* @__PURE__ */ jsxs("div", { className: styles.hero__actions, children: [
-            primaryCta != null && primaryCta,
-            secondaryCta != null && secondaryCta
-          ] })
-        ] }) }) })
+        /* @__PURE__ */ jsx("div", { className: styles.hero__content, children: /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(styles.hero__card, elevationStyles.elevationHigh),
+            "data-color-scheme": "light",
+            children: /* @__PURE__ */ jsxs("div", { className: styles.hero__main, children: [
+              /* @__PURE__ */ jsxs("div", { className: styles.hero__text, children: [
+                /* @__PURE__ */ jsxs("div", { className: styles.hero__header, children: [
+                  label != null && /* @__PURE__ */ jsx("div", { className: styles.hero__label, children: label }),
+                  /* @__PURE__ */ jsx(
+                    HeadingLevel,
+                    {
+                      id: headingId,
+                      className: cn(
+                        styles.hero__heading,
+                        headingClassByStyle[headingStyle]
+                      ),
+                      children: heading
+                    }
+                  )
+                ] }),
+                description != null && /* @__PURE__ */ jsx("div", { className: cn(styles.hero__description, "dds-prose"), children: description })
+              ] }),
+              hasActions && /* @__PURE__ */ jsx("div", { className: styles.hero__actions, children: actions })
+            ] })
+          }
+        ) })
       ]
     }
   );

package/dist/components/Hero/Hero.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Hero.js","sources":["../../../src/components/Hero/Hero.tsx"],"sourcesContent":["import { useId } from 'react';\nimport { cn } from '../../utils/cn';\nimport elevationStyles from '../../styles/utils~~/elevation.module.css~~';\nimport styles from './Hero.module.css';\nimport type { HeroProps } from './Hero.types';\nimport { headingClassByStyle } from './Hero.utils';\n\nexport const Hero = ({\n label,\n heading,\n description,\n headingLevel = 'h1',\n headingStyle = 'default',\n Image,\n imageProps,\n LogoImage,\n logoImageProps,\n backgroundColor,\n ~~primaryCta~~,\n ~~secondaryCta,\n~~ className,\n ref,\n ...props\n}: HeroProps) => {\n const headingId = useId();\n\n const ResolvedImage = Image ?? (imageProps != null ? 'img' : undefined);\n const ResolvedLogoImage = LogoImage ?? (logoImageProps != null ? 'img' : undefined);\n const image = ResolvedImage != null ? <ResolvedImage {...imageProps} /> : undefined;\n const logoImage =\n ResolvedLogoImage != null ? <ResolvedLogoImage {...logoImageProps} /> : undefined;\n const HeadingLevel = headingLevel;\n\n const hasActions = ~~primaryCta~~ != null \|\| ~~secondaryCta~~ != ~~null~~;\n const backgroundStyle =\n image == null && backgroundColor != null ? { backgroundColor } : undefined;\n const ariaLabelledBy = props['aria-label'] ? undefined : props['aria-labelledby'] \|\| headingId;\n\n return (\n <section\n ref={ref}\n {...props}\n className={cn(styles.hero, className)}\n aria-label={props['aria-label']}\n aria-labelledby={ariaLabelledBy}\n >\n <div className={styles.hero__background} style={backgroundStyle}>\n {image != null && (\n <div className={styles.hero__backgroundImageComponent} aria-hidden=\"true\">\n {image}\n </div>\n )}\n <div className={styles.hero__overlay} aria-hidden=\"true\" />\n {logoImage != null && (\n <div className={styles.hero__logoImageWrap} aria-hidden=\"true\">\n <div className={styles.hero__logoImage}>{logoImage}</div>\n </div>\n )}\n </div>\n\n <div className={styles.hero__content}>\n <div className={cn(styles.hero__card, elevationStyles.elevationHigh)}>\n <div className={styles.hero__main}>\n <div className={styles.hero__text}>\n <div className={styles.hero__header}>\n {label != null && <div className={styles.hero__label}>{label}</div>}\n <HeadingLevel\n id={headingId}\n className={cn(\n styles.hero__heading,\n headingClassByStyle[headingStyle],\n )}\n >\n {heading}\n </HeadingLevel>\n </div>\n {description != null && (\n <div className={cn(styles.hero__description, 'dds-prose')}>\n {description}\n </div>\n )}\n </div>\n\n {hasActions && ~~(\n~~ <div className={styles.hero__actions}~~>\n~~ {~~primaryCta != null && primaryCta~~}~~\n {secondaryCta != null && secondaryCta}\n~~ </div~~>\n )~~}\n </div>\n </div>\n </div>\n </section>\n );\n};\n"],"names":[],"mappings":";;;;;;AAOO,MAAM,OAAO,CAAC;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf,eAAe;AAAA,EACf;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA~~;AAAA~~,~~EACA,~~GAAG;AACP,MAAiB;AACb,QAAM,YAAY,MAAA;AAElB,QAAM,gBAAgB,UAAU,cAAc,OAAO,QAAQ;AAC7D,QAAM,oBAAoB,cAAc,kBAAkB,OAAO,QAAQ;AACzE,QAAM,QAAQ,iBAAiB,2BAAQ,eAAA,EAAe,GAAG,YAAY,IAAK;AAC1E,QAAM,YACF,qBAAqB,2BAAQ,mBAAA,EAAmB,GAAG,gBAAgB,IAAK;AAC5E,QAAM,eAAe;AAErB,QAAM,aAAa,~~cAAc~~,QAAQ,~~gBAAgB~~;AACzD,QAAM,kBACF,SAAS,QAAQ,mBAAmB,OAAO,EAAE,oBAAoB;AACrE,QAAM,iBAAiB,MAAM,YAAY,IAAI,SAAY,MAAM,iBAAiB,KAAK;AAErF,SACI;AAAA,IAAC;AAAA,IAAA;AAAA,MACG;AAAA,MACC,GAAG;AAAA,MACJ,WAAW,GAAG,OAAO,MAAM,SAAS;AAAA,MACpC,cAAY,MAAM,YAAY;AAAA,MAC9B,mBAAiB;AAAA,MAEjB,UAAA;AAAA,QAAA,qBAAC,OAAA,EAAI,WAAW,OAAO,kBAAkB,OAAO,iBAC3C,UAAA;AAAA,UAAA,SAAS,4BACL,OAAA,EAAI,WAAW,OAAO,gCAAgC,eAAY,QAC9D,UAAA,MAAA,CACL;AAAA,8BAEH,OAAA,EAAI,WAAW,OAAO,eAAe,eAAY,QAAO;AAAA,UACxD,aAAa,QACV,oBAAC,OAAA,EAAI,WAAW,OAAO,qBAAqB,eAAY,QACpD,8BAAC,OAAA,EAAI,WAAW,OAAO,iBAAkB,qBAAU,EAAA,CACvD;AAAA,QAAA,GAER;AAAA,~~4BAEC~~,OAAA,EAAI,WAAW,OAAO,eACnB,UAAA,~~oBAAC~~,~~SAAI~~,WAAW,GAAG,OAAO,YAAY,gBAAgB,aAAa,~~GAC/D,+BAAC~~,OAAA,EAAI,WAAW,OAAO,YACnB,UAAA;AAAA,~~UAAA~~,qBAAC,OAAA,EAAI,WAAW,OAAO,YACnB,UAAA;AAAA,~~YAAA~~,qBAAC,OAAA,EAAI,WAAW,OAAO,cAClB,UAAA;AAAA,~~cAAA~~,SAAS,QAAQ,oBAAC,OAAA,EAAI,WAAW,OAAO,aAAc,UAAA,OAAM;AAAA,~~cAC7D~~;AAAA,~~gBAAC~~;AAAA,~~gBAAA~~;AAAA,~~kBACG~~,IAAI;AAAA,~~kBACJ~~,WAAW;AAAA,~~oBACP~~,OAAO;AAAA,~~oBACP~~,oBAAoB,YAAY;AAAA,~~kBAAA~~;AAAA,~~kBAGnC~~,UAAA;AAAA,~~gBAAA~~;AAAA,~~cAAA~~;AAAA,~~YACL~~,GACJ;AAAA,~~YACC~~,eAAe,QACZ,oBAAC,OAAA,EAAI,WAAW,GAAG,OAAO,mBAAmB,WAAW,GACnD,UAAA,YAAA,CACL;AAAA,~~UAAA~~,GAER;AAAA,~~UAEC~~,~~cACG~~,~~qBAAC~~,OAAA,EAAI,WAAW,OAAO,~~eAClB~~,UAAA~~;AAAA~~,~~YAAA~~,~~cAAc,QAAQ~~;AAAA,~~YACtB~~,~~gBAAgB~~,~~QAAQ~~;AAAA,UAAA~~,EAAA,CAC7B~~;AAAA,QAAA,~~EAAA~~,~~CAER,GACJ,EAAA,~~CACJ;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGZ;"}
1	+ {"version":3,"file":"Hero.js","sources":["../../../src/components/Hero/Hero.tsx"],"sourcesContent":["import { useId } from 'react';\nimport { cn } from '../../utils/cn';\nimport { elevationStyles } from '../../styles/utils';\nimport styles from './Hero.module.css';\nimport type { HeroProps } from './Hero.types';\nimport { headingClassByStyle } from './Hero.utils';\n\nexport const Hero = ({\n label,\n heading,\n description,\n headingLevel = 'h1',\n headingStyle = 'default',\n Image,\n imageProps,\n LogoImage,\n logoImageProps,\n backgroundColor,\n actions,\n className,\n ref,\n ...props\n}: HeroProps) => {\n const headingId = useId();\n\n const ResolvedImage = Image ?? (imageProps != null ? 'img' : undefined);\n const ResolvedLogoImage = LogoImage ?? (logoImageProps != null ? 'img' : undefined);\n const image = ResolvedImage != null ? <ResolvedImage {...imageProps} /> : undefined;\n const logoImage =\n ResolvedLogoImage != null ? <ResolvedLogoImage {...logoImageProps} /> : undefined;\n const HeadingLevel = headingLevel;\n\n const hasActions = actions != null && typeof actions !== 'boolean';\n const backgroundStyle =\n image == null && backgroundColor != null ? { backgroundColor } : undefined;\n const ariaLabelledBy = props['aria-label'] ? undefined : props['aria-labelledby'] \|\| headingId;\n\n return (\n <section\n ref={ref}\n {...props}\n className={cn(styles.hero, className)}\n aria-label={props['aria-label']}\n aria-labelledby={ariaLabelledBy}\n >\n <div className={styles.hero__background} style={backgroundStyle}>\n {image != null && (\n <div className={styles.hero__backgroundImageComponent} aria-hidden=\"true\">\n {image}\n </div>\n )}\n <div className={styles.hero__overlay} aria-hidden=\"true\" />\n {logoImage != null && (\n <div className={styles.hero__logoImageWrap} aria-hidden=\"true\">\n <div className={styles.hero__logoImage}>{logoImage}</div>\n </div>\n )}\n </div>\n\n <div className={styles.hero__content}>\n <div\n className={cn(styles.hero__card, elevationStyles.elevationHigh)}\n data-color-scheme=\"light\"\n >\n <div className={styles.hero__main}>\n <div className={styles.hero__text}>\n <div className={styles.hero__header}>\n {label != null && <div className={styles.hero__label}>{label}</div>}\n <HeadingLevel\n id={headingId}\n className={cn(\n styles.hero__heading,\n headingClassByStyle[headingStyle],\n )}\n >\n {heading}\n </HeadingLevel>\n </div>\n {description != null && (\n <div className={cn(styles.hero__description, 'dds-prose')}>\n {description}\n </div>\n )}\n </div>\n\n {hasActions && <div className={styles.hero__actions}>{actions}</div>}\n </div>\n </div>\n </div>\n </section>\n );\n};\n"],"names":[],"mappings":";;;;;;AAOO,MAAM,OAAO,CAAC;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf,eAAe;AAAA,EACf;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACP,MAAiB;AACb,QAAM,YAAY,MAAA;AAElB,QAAM,gBAAgB,UAAU,cAAc,OAAO,QAAQ;AAC7D,QAAM,oBAAoB,cAAc,kBAAkB,OAAO,QAAQ;AACzE,QAAM,QAAQ,iBAAiB,2BAAQ,eAAA,EAAe,GAAG,YAAY,IAAK;AAC1E,QAAM,YACF,qBAAqB,2BAAQ,mBAAA,EAAmB,GAAG,gBAAgB,IAAK;AAC5E,QAAM,eAAe;AAErB,QAAM,aAAa,WAAW,QAAQ,OAAO,YAAY;AACzD,QAAM,kBACF,SAAS,QAAQ,mBAAmB,OAAO,EAAE,oBAAoB;AACrE,QAAM,iBAAiB,MAAM,YAAY,IAAI,SAAY,MAAM,iBAAiB,KAAK;AAErF,SACI;AAAA,IAAC;AAAA,IAAA;AAAA,MACG;AAAA,MACC,GAAG;AAAA,MACJ,WAAW,GAAG,OAAO,MAAM,SAAS;AAAA,MACpC,cAAY,MAAM,YAAY;AAAA,MAC9B,mBAAiB;AAAA,MAEjB,UAAA;AAAA,QAAA,qBAAC,OAAA,EAAI,WAAW,OAAO,kBAAkB,OAAO,iBAC3C,UAAA;AAAA,UAAA,SAAS,4BACL,OAAA,EAAI,WAAW,OAAO,gCAAgC,eAAY,QAC9D,UAAA,MAAA,CACL;AAAA,8BAEH,OAAA,EAAI,WAAW,OAAO,eAAe,eAAY,QAAO;AAAA,UACxD,aAAa,QACV,oBAAC,OAAA,EAAI,WAAW,OAAO,qBAAqB,eAAY,QACpD,8BAAC,OAAA,EAAI,WAAW,OAAO,iBAAkB,qBAAU,EAAA,CACvD;AAAA,QAAA,GAER;AAAA,QAEA,oBAAC,OAAA,EAAI,WAAW,OAAO,eACnB,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,WAAW,GAAG,OAAO,YAAY,gBAAgB,aAAa;AAAA,YAC9D,qBAAkB;AAAA,YAElB,UAAA,qBAAC,OAAA,EAAI,WAAW,OAAO,YACnB,UAAA;AAAA,cAAA,qBAAC,OAAA,EAAI,WAAW,OAAO,YACnB,UAAA;AAAA,gBAAA,qBAAC,OAAA,EAAI,WAAW,OAAO,cAClB,UAAA;AAAA,kBAAA,SAAS,QAAQ,oBAAC,OAAA,EAAI,WAAW,OAAO,aAAc,UAAA,OAAM;AAAA,kBAC7D;AAAA,oBAAC;AAAA,oBAAA;AAAA,sBACG,IAAI;AAAA,sBACJ,WAAW;AAAA,wBACP,OAAO;AAAA,wBACP,oBAAoB,YAAY;AAAA,sBAAA;AAAA,sBAGnC,UAAA;AAAA,oBAAA;AAAA,kBAAA;AAAA,gBACL,GACJ;AAAA,gBACC,eAAe,QACZ,oBAAC,OAAA,EAAI,WAAW,GAAG,OAAO,mBAAmB,WAAW,GACnD,UAAA,YAAA,CACL;AAAA,cAAA,GAER;AAAA,cAEC,cAAc,oBAAC,OAAA,EAAI,WAAW,OAAO,eAAgB,UAAA,QAAA,CAAQ;AAAA,YAAA,EAAA,CAClE;AAAA,UAAA;AAAA,QAAA,EACJ,CACJ;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGZ;"}

package/dist/components/Hero/Hero.module.css.cjs CHANGED Viewed

@@ -1,21 +1,21 @@
 require('./Hero.css');
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const hero = "_hero_1itry_1";
-const hero__background = "_hero__background_1itry_16";
-const hero__backgroundImageComponent = "_hero__backgroundImageComponent_1itry_25";
-const hero__logoImageWrap = "_hero__logoImageWrap_1itry_47";
-const hero__logoImage = "_hero__logoImage_1itry_47";
-const hero__overlay = "_hero__overlay_1itry_75";
-const hero__content = "_hero__content_1itry_87";
-const hero__card = "_hero__card_1itry_102";
-const hero__main = "_hero__main_1itry_111";
-const hero__text = "_hero__text_1itry_117";
-const hero__header = "_hero__header_1itry_123";
-const hero__label = "_hero__label_1itry_129";
-const hero__heading = "_hero__heading_1itry_133";
-const hero__description = "_hero__description_1itry_151";
-const hero__actions = "_hero__actions_1itry_166";
+const hero = "_hero_fgniv_1";
+const hero__background = "_hero__background_fgniv_16";
+const hero__backgroundImageComponent = "_hero__backgroundImageComponent_fgniv_25";
+const hero__logoImageWrap = "_hero__logoImageWrap_fgniv_47";
+const hero__logoImage = "_hero__logoImage_fgniv_47";
+const hero__overlay = "_hero__overlay_fgniv_75";
+const hero__content = "_hero__content_fgniv_87";
+const hero__card = "_hero__card_fgniv_102";
+const hero__main = "_hero__main_fgniv_112";
+const hero__text = "_hero__text_fgniv_118";
+const hero__header = "_hero__header_fgniv_124";
+const hero__label = "_hero__label_fgniv_130";
+const hero__heading = "_hero__heading_fgniv_134";
+const hero__description = "_hero__description_fgniv_152";
+const hero__actions = "_hero__actions_fgniv_167";
 const styles = {
   hero,
   hero__background,
@@ -30,9 +30,9 @@ const styles = {
   hero__header,
   hero__label,
   hero__heading,
-  "hero__heading--default": "_hero__heading--default_1itry_139",
-  "hero__heading--large": "_hero__heading--large_1itry_143",
-  "hero__heading--small": "_hero__heading--small_1itry_147",
+  "hero__heading--default": "_hero__heading--default_fgniv_140",
+  "hero__heading--large": "_hero__heading--large_fgniv_144",
+  "hero__heading--small": "_hero__heading--small_fgniv_148",
   hero__description,
   hero__actions
 };

package/dist/components/Hero/Hero.module.css.js CHANGED Viewed

@@ -1,19 +1,19 @@
 import './Hero.css';
-const hero = "_hero_1itry_1";
-const hero__background = "_hero__background_1itry_16";
-const hero__backgroundImageComponent = "_hero__backgroundImageComponent_1itry_25";
-const hero__logoImageWrap = "_hero__logoImageWrap_1itry_47";
-const hero__logoImage = "_hero__logoImage_1itry_47";
-const hero__overlay = "_hero__overlay_1itry_75";
-const hero__content = "_hero__content_1itry_87";
-const hero__card = "_hero__card_1itry_102";
-const hero__main = "_hero__main_1itry_111";
-const hero__text = "_hero__text_1itry_117";
-const hero__header = "_hero__header_1itry_123";
-const hero__label = "_hero__label_1itry_129";
-const hero__heading = "_hero__heading_1itry_133";
-const hero__description = "_hero__description_1itry_151";
-const hero__actions = "_hero__actions_1itry_166";
+const hero = "_hero_fgniv_1";
+const hero__background = "_hero__background_fgniv_16";
+const hero__backgroundImageComponent = "_hero__backgroundImageComponent_fgniv_25";
+const hero__logoImageWrap = "_hero__logoImageWrap_fgniv_47";
+const hero__logoImage = "_hero__logoImage_fgniv_47";
+const hero__overlay = "_hero__overlay_fgniv_75";
+const hero__content = "_hero__content_fgniv_87";
+const hero__card = "_hero__card_fgniv_102";
+const hero__main = "_hero__main_fgniv_112";
+const hero__text = "_hero__text_fgniv_118";
+const hero__header = "_hero__header_fgniv_124";
+const hero__label = "_hero__label_fgniv_130";
+const hero__heading = "_hero__heading_fgniv_134";
+const hero__description = "_hero__description_fgniv_152";
+const hero__actions = "_hero__actions_fgniv_167";
 const styles = {
   hero,
   hero__background,
@@ -28,9 +28,9 @@ const styles = {
   hero__header,
   hero__label,
   hero__heading,
-  "hero__heading--default": "_hero__heading--default_1itry_139",
-  "hero__heading--large": "_hero__heading--large_1itry_143",
-  "hero__heading--small": "_hero__heading--small_1itry_147",
+  "hero__heading--default": "_hero__heading--default_fgniv_140",
+  "hero__heading--large": "_hero__heading--large_fgniv_144",
+  "hero__heading--small": "_hero__heading--small_fgniv_148",
   hero__description,
   hero__actions
 };

package/dist/components/Hero/Hero.types.d.ts CHANGED Viewed

@@ -45,12 +45,8 @@ export interface HeroProps extends Omit<ComponentPropsWithRef<'section'>, 'child
      */
     readonly backgroundColor?: CSSProperties['backgroundColor'];
     /**
-     * Primary call-to-action element.
+     * Optional actions. Pass one or more Button, IconButton, or other accessible controls.
      */
-    readonly primaryCta?: ReactElement;
-    /**
-     * Secondary call-to-action element.
-     */
-    readonly secondaryCta?: ReactElement;
+    readonly actions?: ReactNode;
 }
 //# sourceMappingURL=Hero.types.d.ts.map

package/dist/components/Hero/Hero.types.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Hero.types.d.ts","sourceRoot":"","sources":["../../../src/components/Hero/Hero.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACR,qBAAqB,EACrB,aAAa,EACb,WAAW,EACX,YAAY,EACZ,SAAS,EACZ,MAAM,OAAO,CAAC;AAEf,MAAM,MAAM,gBAAgB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AACvE,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,CAAC;AAC7D,MAAM,MAAM,oBAAoB,GAAG,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,CAAC;AAC7E,MAAM,MAAM,kBAAkB,GAAG,WAAW,CAAC,oBAAoB,CAAC,CAAC;AAEnE,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,qBAAqB,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC;IACjF;;OAEG;IACH,QAAQ,CAAC,KAAK,CAAC,EAAE,YAAY,CAAC;IAC9B;;OAEG;IACH,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAC;IAC5B;;OAEG;IACH,QAAQ,CAAC,WAAW,CAAC,EAAE,SAAS,CAAC;IACjC;;OAEG;IACH,QAAQ,CAAC,YAAY,CAAC,EAAE,gBAAgB,CAAC;IACzC;;OAEG;IACH,QAAQ,CAAC,YAAY,CAAC,EAAE,gBAAgB,CAAC;IACzC;;OAEG;IACH,QAAQ,CAAC,KAAK,CAAC,EAAE,kBAAkB,CAAC;IACpC;;OAEG;IACH,QAAQ,CAAC,UAAU,CAAC,EAAE,oBAAoB,CAAC;IAC3C;;OAEG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,kBAAkB,CAAC;IACxC;;OAEG;IACH,QAAQ,CAAC,cAAc,CAAC,EAAE,oBAAoB,CAAC;IAC/C;;OAEG;IACH,QAAQ,CAAC,eAAe,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAC5D;;OAEG;IACH,QAAQ,CAAC,~~UAAU~~,CAAC,EAAE,~~YAAY~~,CAAC;~~IACnC;;OAEG;IACH,QAAQ,CAAC,YAAY,CAAC,EAAE,YAAY,CAAC;CACxC~~"}
1	+ {"version":3,"file":"Hero.types.d.ts","sourceRoot":"","sources":["../../../src/components/Hero/Hero.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACR,qBAAqB,EACrB,aAAa,EACb,WAAW,EACX,YAAY,EACZ,SAAS,EACZ,MAAM,OAAO,CAAC;AAEf,MAAM,MAAM,gBAAgB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AACvE,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,CAAC;AAC7D,MAAM,MAAM,oBAAoB,GAAG,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,CAAC;AAC7E,MAAM,MAAM,kBAAkB,GAAG,WAAW,CAAC,oBAAoB,CAAC,CAAC;AAEnE,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,qBAAqB,CAAC,SAAS,CAAC,EAAE,UAAU,CAAC;IACjF;;OAEG;IACH,QAAQ,CAAC,KAAK,CAAC,EAAE,YAAY,CAAC;IAC9B;;OAEG;IACH,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAC;IAC5B;;OAEG;IACH,QAAQ,CAAC,WAAW,CAAC,EAAE,SAAS,CAAC;IACjC;;OAEG;IACH,QAAQ,CAAC,YAAY,CAAC,EAAE,gBAAgB,CAAC;IACzC;;OAEG;IACH,QAAQ,CAAC,YAAY,CAAC,EAAE,gBAAgB,CAAC;IACzC;;OAEG;IACH,QAAQ,CAAC,KAAK,CAAC,EAAE,kBAAkB,CAAC;IACpC;;OAEG;IACH,QAAQ,CAAC,UAAU,CAAC,EAAE,oBAAoB,CAAC;IAC3C;;OAEG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,kBAAkB,CAAC;IACxC;;OAEG;IACH,QAAQ,CAAC,cAAc,CAAC,EAAE,oBAAoB,CAAC;IAC/C;;OAEG;IACH,QAAQ,CAAC,eAAe,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;IAC5D;;OAEG;IACH,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC;CAChC"}

package/dist/components/IconButton/IconButton.cjs CHANGED Viewed

@@ -1,8 +1,7 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
-const focus_module = require("../../styles/utils/focus.module.css.cjs");
-const textDecoration_module = require("../../styles/utils/text-decoration.module.css.cjs");
+const index = require("../../styles/utils/index.cjs");
 const IconButton_module = require("./IconButton.module.css.cjs");
 const cn = require("../../utils/cn/cn.cjs");
 const Spinner = require("../Spinner/Spinner.cjs");
@@ -23,7 +22,7 @@ const IconButton = ({
   const classes = cn.cn(
     IconButton_module["icon-button"],
     IconButton_module[`icon-button--${size}`],
-    focus_module.default.focusable,
+    index.focusStyles.focusable,
     { [IconButton_module["icon-button--disabled"]]: isDisabled },
     { [IconButton_module["icon-button--loading"]]: loading },
     { [IconButton_module["icon-button--link-coloring"]]: linkColoring },
@@ -44,7 +43,7 @@ const IconButton = ({
     /* @__PURE__ */ jsxRuntime.jsx(
       "span",
       {
-        className: cn.cn(IconButton_module["icon-button__label"], textDecoration_module.default.underlineLink, {
+        className: cn.cn(IconButton_module["icon-button__label"], index.textDecorationStyles.underlineLink, {
           [IconButton_module["icon-button__label--wrap"]]: labelBehavior === "wrap"
         }),
         children

package/dist/components/IconButton/IconButton.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"IconButton.cjs","sources":["../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import type { AnchorHTMLAttributes, MouseEvent, ReactNode, Ref } from 'react';\nimport { cn } from '../../utils/cn';\nimport focusStyles ~~from~~ ~~'../../styles/utils/focus.module.css';\nimport~~ ~~textDecorationStyles~~ from '../../styles/utils~~/text-decoration.module.css~~';\nimport { Spinner } from '../Spinner';\nimport styles from './IconButton.module.css';\nimport type { IconButtonProps } from './IconButton.types';\n\nexport const IconButton = ({\n icon,\n iconPosition = 'start',\n labelBehavior = 'truncate',\n size = 'normal',\n loading = false,\n linkColoring = false,\n className,\n children,\n ref,\n ...props\n}: IconButtonProps) => {\n const isDisabled = 'disabled' in props && props.disabled;\n const isAnchor = 'href' in props && props.href != null;\n\n const classes = cn(\n styles['icon-button'],\n styles[`icon-button--${size}`],\n focusStyles.focusable,\n { [styles['icon-button--disabled']]: isDisabled },\n { [styles['icon-button--loading']]: loading },\n { [styles['icon-button--link-coloring']]: linkColoring },\n className,\n );\n\n const Icon = icon;\n\n const iconSlot = loading ? (\n <span className={styles['icon-button__icon']} aria-hidden=\"true\">\n <Spinner\n size={size === 'small' ? 'xs' : 's'}\n color=\"inherit\"\n aria-hidden=\"true\"\n role=\"presentation\"\n />\n </span>\n ) : (\n <span className={styles['icon-button__icon']} aria-hidden=\"true\">\n <Icon aria-hidden=\"true\" />\n </span>\n );\n\n const content = (\n <>\n {iconPosition === 'start' && iconSlot}\n <span\n className={cn(styles['icon-button__label'], textDecorationStyles.underlineLink, {\n [styles['icon-button__label--wrap']]: labelBehavior === 'wrap',\n })}\n >\n {children}\n </span>\n {iconPosition === 'end' && iconSlot}\n </>\n );\n\n if (isAnchor) {\n const { href, renderLink, ...anchorProps } = props as Omit<\n typeof props,\n 'icon' \| 'iconPosition' \| 'size' \| 'loading' \| 'linkColoring'\n > & {\n href: string;\n renderLink?: (\n props: AnchorHTMLAttributes<HTMLAnchorElement> & {\n href: string;\n children: ReactNode;\n },\n ) => ReactNode;\n };\n\n const {\n disabled: _disabled,\n type: _type,\n name: _name,\n ...safeAnchorProps\n } = anchorProps as typeof anchorProps & {\n disabled?: boolean;\n type?: 'button' \| 'submit' \| 'reset';\n name?: string;\n };\n\n const target = safeAnchorProps.target;\n const rel = safeAnchorProps.rel;\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 rel: hardenedRel,\n className: classes,\n 'aria-busy': loading \|\| undefined,\n 'aria-disabled': loading \|\| undefined,\n tabIndex: loading ? -1 : safeAnchorProps.tabIndex,\n onClick: loading\n ? (e: MouseEvent<HTMLAnchorElement>) => {\n e.preventDefault();\n e.stopPropagation();\n }\n : safeAnchorProps.onClick,\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 disabled,\n onClick,\n href: _href,\n target: _target,\n rel: _rel,\n renderLink: _renderLink,\n ...buttonProps\n } = props as Omit<\n typeof props,\n 'icon' \| 'iconPosition' \| 'size' \| 'loading' \| 'href' \| 'linkColoring'\n > & {\n type?: 'button' \| 'submit' \| 'reset';\n disabled?: boolean;\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 disabled={disabled \|\| loading}\n className={classes}\n aria-disabled={loading \|\| undefined}\n aria-busy={loading \|\| undefined}\n onClick={\n loading\n ? (e) => {\n e.preventDefault();\n e.stopPropagation();\n }\n : onClick\n }\n {...buttonProps}\n >\n {content}\n </button>\n );\n};\n"],"names":["cn","styles","focusStyles","jsx","Spinner","jsxs","Fragment","textDecorationStyles"],"mappings":"~~;;;;;;;;AAQO~~,MAAM,aAAa,CAAC;AAAA,EACvB;AAAA,EACA,eAAe;AAAA,EACf,gBAAgB;AAAA,EAChB,OAAO;AAAA,EACP,UAAU;AAAA,EACV,eAAe;AAAA,EACf;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACP,MAAuB;AACnB,QAAM,aAAa,cAAc,SAAS,MAAM;AAChD,QAAM,WAAW,UAAU,SAAS,MAAM,QAAQ;AAElD,QAAM,UAAUA,GAAAA;AAAAA,IACZC,kBAAO,aAAa;AAAA,IACpBA,kBAAO,gBAAgB,IAAI,EAAE;AAAA,IAC7BC,~~aAAAA~~,~~QAAY~~;AAAA,IACZ,EAAE,CAACD,kBAAO,uBAAuB,CAAC,GAAG,WAAA;AAAA,IACrC,EAAE,CAACA,kBAAO,sBAAsB,CAAC,GAAG,QAAA;AAAA,IACpC,EAAE,CAACA,kBAAO,4BAA4B,CAAC,GAAG,aAAA;AAAA,IAC1C;AAAA,EAAA;AAGJ,QAAM,OAAO;AAEb,QAAM,WAAW,UACbE,2BAAAA,IAAC,QAAA,EAAK,WAAWF,kBAAO,mBAAmB,GAAG,eAAY,QACtD,UAAAE,2BAAAA;AAAAA,IAACC,QAAAA;AAAAA,IAAA;AAAA,MACG,MAAM,SAAS,UAAU,OAAO;AAAA,MAChC,OAAM;AAAA,MACN,eAAY;AAAA,MACZ,MAAK;AAAA,IAAA;AAAA,EAAA,EACT,CACJ,IAEAD,2BAAAA,IAAC,QAAA,EAAK,WAAWF,kBAAO,mBAAmB,GAAG,eAAY,QACtD,UAAAE,2BAAAA,IAAC,MAAA,EAAK,eAAY,QAAO,GAC7B;AAGJ,QAAM,UACFE,2BAAAA,KAAAC,WAAAA,UAAA,EACK,UAAA;AAAA,IAAA,iBAAiB,WAAW;AAAA,IAC7BH,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAWH,GAAAA,GAAGC,kBAAO,oBAAoB,GAAGM,~~sBAAAA~~,~~QAAqB~~,eAAe;AAAA,UAC5E,CAACN,kBAAO,0BAA0B,CAAC,GAAG,kBAAkB;AAAA,QAAA,CAC3D;AAAA,QAEA;AAAA,MAAA;AAAA,IAAA;AAAA,IAEJ,iBAAiB,SAAS;AAAA,EAAA,GAC/B;AAGJ,MAAI,UAAU;AACV,UAAM,EAAE,MAAM,YAAY,GAAG,gBAAgB;AAa7C,UAAM;AAAA,MACF,UAAU;AAAA,MACV,MAAM;AAAA,MACN,MAAM;AAAA,MACN,GAAG;AAAA,IAAA,IACH;AAMJ,UAAM,SAAS,gBAAgB;AAC/B,UAAM,MAAM,gBAAgB;AAC5B,UAAM,kBAAkB,QAAQ,YAAA,MAAkB;AAClD,UAAM,YAAY,IAAI;AAAA,OACjB,OAAO,IACH,MAAM,KAAK,EACX,OAAO,OAAO,EACd,IAAI,CAAC,UAAU,MAAM,aAAa;AAAA,IAAA;AAG3C,QAAI,iBAAiB;AACjB,gBAAU,IAAI,UAAU;AACxB,gBAAU,IAAI,YAAY;AAAA,IAC9B;AAEA,UAAM,cAAc,UAAU,OAAO,IAAI,MAAM,KAAK,SAAS,EAAE,KAAK,GAAG,IAAI;AAE3E,UAAM,YAAY;AAAA,MACd,GAAG;AAAA,MACH;AAAA,MACA;AAAA,MACA,KAAK;AAAA,MACL,WAAW;AAAA,MACX,aAAa,WAAW;AAAA,MACxB,iBAAiB,WAAW;AAAA,MAC5B,UAAU,UAAU,KAAK,gBAAgB;AAAA,MACzC,SAAS,UACH,CAAC,MAAqC;AAClC,UAAE,eAAA;AACF,UAAE,gBAAA;AAAA,MACN,IACA,gBAAgB;AAAA,MACtB,UAAU;AAAA,IAAA;AAGd,QAAI,YAAY;AACZ,aAAOE,2BAAAA,IAAAG,WAAAA,UAAA,EAAG,UAAA,WAAW,SAAS,GAAE;AAAA,IACpC;AAEA,WAAOH,+BAAC,KAAA,EAAG,GAAG,UAAA,CAAW;AAAA,EAC7B;AAEA,QAAM;AAAA,IACF,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,KAAK;AAAA,IACL,YAAY;AAAA,IACZ,GAAG;AAAA,EAAA,IACH;AAYJ,SACIA,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACG;AAAA,MACA;AAAA,MACA,UAAU,YAAY;AAAA,MACtB,WAAW;AAAA,MACX,iBAAe,WAAW;AAAA,MAC1B,aAAW,WAAW;AAAA,MACtB,SACI,UACM,CAAC,MAAM;AACH,UAAE,eAAA;AACF,UAAE,gBAAA;AAAA,MACN,IACA;AAAA,MAET,GAAG;AAAA,MAEH,UAAA;AAAA,IAAA;AAAA,EAAA;AAGb;;"}
1	+ {"version":3,"file":"IconButton.cjs","sources":["../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import type { AnchorHTMLAttributes, MouseEvent, ReactNode, Ref } from 'react';\nimport { cn } from '../../utils/cn';\nimport { focusStyles, textDecorationStyles } from '../../styles/utils';\nimport { Spinner } from '../Spinner';\nimport styles from './IconButton.module.css';\nimport type { IconButtonProps } from './IconButton.types';\n\nexport const IconButton = ({\n icon,\n iconPosition = 'start',\n labelBehavior = 'truncate',\n size = 'normal',\n loading = false,\n linkColoring = false,\n className,\n children,\n ref,\n ...props\n}: IconButtonProps) => {\n const isDisabled = 'disabled' in props && props.disabled;\n const isAnchor = 'href' in props && props.href != null;\n\n const classes = cn(\n styles['icon-button'],\n styles[`icon-button--${size}`],\n focusStyles.focusable,\n { [styles['icon-button--disabled']]: isDisabled },\n { [styles['icon-button--loading']]: loading },\n { [styles['icon-button--link-coloring']]: linkColoring },\n className,\n );\n\n const Icon = icon;\n\n const iconSlot = loading ? (\n <span className={styles['icon-button__icon']} aria-hidden=\"true\">\n <Spinner\n size={size === 'small' ? 'xs' : 's'}\n color=\"inherit\"\n aria-hidden=\"true\"\n role=\"presentation\"\n />\n </span>\n ) : (\n <span className={styles['icon-button__icon']} aria-hidden=\"true\">\n <Icon aria-hidden=\"true\" />\n </span>\n );\n\n const content = (\n <>\n {iconPosition === 'start' && iconSlot}\n <span\n className={cn(styles['icon-button__label'], textDecorationStyles.underlineLink, {\n [styles['icon-button__label--wrap']]: labelBehavior === 'wrap',\n })}\n >\n {children}\n </span>\n {iconPosition === 'end' && iconSlot}\n </>\n );\n\n if (isAnchor) {\n const { href, renderLink, ...anchorProps } = props as Omit<\n typeof props,\n 'icon' \| 'iconPosition' \| 'size' \| 'loading' \| 'linkColoring'\n > & {\n href: string;\n renderLink?: (\n props: AnchorHTMLAttributes<HTMLAnchorElement> & {\n href: string;\n children: ReactNode;\n },\n ) => ReactNode;\n };\n\n const {\n disabled: _disabled,\n type: _type,\n name: _name,\n ...safeAnchorProps\n } = anchorProps as typeof anchorProps & {\n disabled?: boolean;\n type?: 'button' \| 'submit' \| 'reset';\n name?: string;\n };\n\n const target = safeAnchorProps.target;\n const rel = safeAnchorProps.rel;\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 rel: hardenedRel,\n className: classes,\n 'aria-busy': loading \|\| undefined,\n 'aria-disabled': loading \|\| undefined,\n tabIndex: loading ? -1 : safeAnchorProps.tabIndex,\n onClick: loading\n ? (e: MouseEvent<HTMLAnchorElement>) => {\n e.preventDefault();\n e.stopPropagation();\n }\n : safeAnchorProps.onClick,\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 disabled,\n onClick,\n href: _href,\n target: _target,\n rel: _rel,\n renderLink: _renderLink,\n ...buttonProps\n } = props as Omit<\n typeof props,\n 'icon' \| 'iconPosition' \| 'size' \| 'loading' \| 'href' \| 'linkColoring'\n > & {\n type?: 'button' \| 'submit' \| 'reset';\n disabled?: boolean;\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 disabled={disabled \|\| loading}\n className={classes}\n aria-disabled={loading \|\| undefined}\n aria-busy={loading \|\| undefined}\n onClick={\n loading\n ? (e) => {\n e.preventDefault();\n e.stopPropagation();\n }\n : onClick\n }\n {...buttonProps}\n >\n {content}\n </button>\n );\n};\n"],"names":["cn","styles","focusStyles","jsx","Spinner","jsxs","Fragment","textDecorationStyles"],"mappings":"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"}

package/dist/components/IconButton/IconButton.css CHANGED Viewed

@@ -176,4 +176,8 @@
         outline-color: Highlight;
         box-shadow: none;
     }
-} }
+}
+/**
+ * Do not edit directly, this file was auto-generated.
+ */ }

package/dist/components/IconButton/IconButton.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../src/components/IconButton/IconButton.tsx"],"names":[],"mappings":"~~AAMA~~,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAE1D,eAAO,MAAM,UAAU,GAAI,wGAWxB,eAAe,4CA0JjB,CAAC"}
1	+ {"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../src/components/IconButton/IconButton.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAE1D,eAAO,MAAM,UAAU,GAAI,wGAWxB,eAAe,4CA0JjB,CAAC"}

package/dist/components/IconButton/IconButton.js CHANGED Viewed

@@ -1,6 +1,5 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
-import focusStyles from "../../styles/utils/focus.module.css.js";
-import textDecorationStyles from "../../styles/utils/text-decoration.module.css.js";
+import { textDecorationStyles, focusStyles } from "../../styles/utils/index.js";
 import styles from "./IconButton.module.css.js";
 import { cn } from "../../utils/cn/cn.js";
 import { Spinner } from "../Spinner/Spinner.js";