@servicetitan/anvil2 1.46.1 → 1.46.3

package/dist/Button.css

@@ -1,7 +1,7 @@
 @layer starter, reset, base, state, application;
 /* REVERT LAYER BUGFIX START */
-a._button_1371l_2:hover,
-a._button_1371l_2:active {
+a._button_4h7ix_2:hover,
+a._button_4h7ix_2:active {
   color: revert-layer;
 }
 
@@ -14,7 +14,7 @@ a[data-anv=button-link]:focus {
 
 /* REVERT LAYER BUGFIX END */
 @layer reset {
-  ._button_1371l_2, ._button_1371l_2._type-icon_1371l_16 {
+  ._button_4h7ix_2, ._button_4h7ix_2._type-icon_4h7ix_16 {
     all: unset;
     font-family: var(--font-family-base, "Nunito Sans", sans-serif);
     font-size: 100%;
@@ -29,10 +29,10 @@ a[data-anv=button-link]:focus {
   }
 }
 @layer base {
-  ._button_1371l_2, ._button_1371l_2._type-icon_1371l_16 {
+  ._button_4h7ix_2, ._button_4h7ix_2._type-icon_4h7ix_16 {
     width: -moz-fit-content;
     width: fit-content;
-    min-width: 5rem;
+    min-width: 2.5rem;
     height: -moz-fit-content;
     height: fit-content;
     cursor: pointer;
@@ -62,21 +62,21 @@ a[data-anv=button-link]:focus {
     background-color: var(--button-background-color);
     outline-color: var(--button-focus-ring-color);
   }
-  ._button_1371l_2 ._icon_1371l_62 {
+  ._button_4h7ix_2 ._icon_4h7ix_62 {
     display: inline-flex;
   }
 }
 @layer state {
-  ._button_1371l_2:not(:disabled, ._disabled_1371l_67, [aria-disabled=true])[data-interactive=focus-visible], ._button_1371l_2:not(:disabled, ._disabled_1371l_67, [aria-disabled=true]):focus-visible {
+  ._button_4h7ix_2:not(:disabled, ._disabled_4h7ix_67, [aria-disabled=true])[data-interactive=focus-visible], ._button_4h7ix_2:not(:disabled, ._disabled_4h7ix_67, [aria-disabled=true]):focus-visible {
     outline-width: 0.125rem;
   }
-  ._button_1371l_2._loading_1371l_70 {
+  ._button_4h7ix_2._loading_4h7ix_70 {
     cursor: progress;
   }
-  ._button_1371l_2 ._loading-spinner_1371l_73 {
+  ._button_4h7ix_2 ._loading-spinner_4h7ix_73 {
     height: 1rem;
   }
-  ._button_1371l_2._size-small_1371l_76 {
+  ._button_4h7ix_2._size-small_4h7ix_76 {
     --button-font-size: 0.875rem;
     --button-border-radius: 0.375rem;
     --button-padding-block-start: 0.4375rem;
@@ -85,7 +85,7 @@ a[data-anv=button-link]:focus {
     --button-padding-inline-start: 0.75rem;
     --button-line-height: 1rem;
   }
-  ._button_1371l_2._size-medium_1371l_85 {
+  ._button_4h7ix_2._size-medium_4h7ix_85 {
     --button-font-size: 1rem;
     --button-border-radius: 0.375rem;
     --button-padding-block-start: 0.6875rem;
@@ -93,7 +93,7 @@ a[data-anv=button-link]:focus {
     --button-padding-inline-end: 1rem;
     --button-padding-inline-start: 1rem;
   }
-  ._button_1371l_2._size-large_1371l_93 {
+  ._button_4h7ix_2._size-large_4h7ix_93 {
     --button-font-size: 1rem;
     --button-border-radius: 0.375rem;
     --button-padding-block-start: 0.9375rem;
@@ -101,82 +101,82 @@ a[data-anv=button-link]:focus {
     --button-padding-inline-end: 1.5rem;
     --button-padding-inline-start: 1.5rem;
   }
-  ._button_1371l_2._appearance-primary_1371l_101 {
+  ._button_4h7ix_2._appearance-primary_4h7ix_101 {
     --button-foreground-color: var(--button-primary-foreground-color, #ffffff);
     --button-border-color: var(--button-primary-border-color, transparent);
     --button-border-radius: 0.375rem;
     --button-background-color: var(--button-primary-background-color, #0265DC);
     --button-focus-ring-color: var(--button-primary-focus-ring-color, #0265DC);
   }
-  ._button_1371l_2._appearance-primary_1371l_101[data-interactive=hover], ._button_1371l_2._appearance-primary_1371l_101:hover {
+  ._button_4h7ix_2._appearance-primary_4h7ix_101[data-interactive=hover], ._button_4h7ix_2._appearance-primary_4h7ix_101:hover {
     --button-foreground-color: var(--button-primary-foreground-color-hover, #ffffff);
     --button-background-color: var(--button-primary-background-color-hover, #0655b4);
   }
-  ._button_1371l_2._appearance-primary_1371l_101[data-interactive=active], ._button_1371l_2._appearance-primary_1371l_101:active {
+  ._button_4h7ix_2._appearance-primary_4h7ix_101[data-interactive=active], ._button_4h7ix_2._appearance-primary_4h7ix_101:active {
     --button-foreground-color: var(--button-primary-foreground-color-active, #ffffff);
     --button-background-color: var(--button-primary-background-color-active, #09458c);
   }
-  ._button_1371l_2._appearance-secondary_1371l_116 {
+  ._button_4h7ix_2._appearance-secondary_4h7ix_116 {
     --button-foreground-color: var(--button-secondary-foreground-color, #141414);
     --button-border-color: var(--button-secondary-border-color, transparent);
     --button-border-radius: 0.375rem;
     --button-background-color: var(--button-secondary-background-color, rgba(4, 4, 4, 0.0588235294));
     --button-focus-ring-color: var(--button-secondary-focus-ring-color, #0265DC);
   }
-  ._button_1371l_2._appearance-secondary_1371l_116[data-interactive=hover], ._button_1371l_2._appearance-secondary_1371l_116:hover {
+  ._button_4h7ix_2._appearance-secondary_4h7ix_116[data-interactive=hover], ._button_4h7ix_2._appearance-secondary_4h7ix_116:hover {
     --button-foreground-color: var(--button-secondary-foreground-color-hover, #141414);
     --button-background-color: var(--button-secondary-background-color-hover, rgba(5, 5, 5, 0.1333333333));
   }
-  ._button_1371l_2._appearance-secondary_1371l_116[data-interactive=active], ._button_1371l_2._appearance-secondary_1371l_116:active {
+  ._button_4h7ix_2._appearance-secondary_4h7ix_116[data-interactive=active], ._button_4h7ix_2._appearance-secondary_4h7ix_116:active {
     --button-foreground-color: var(--button-secondary-foreground-color-active, #141414);
     --button-background-color: var(--button-secondary-background-color-active, rgba(7, 7, 7, 0.2078431373));
   }
-  ._button_1371l_2._appearance-ghost_1371l_131 {
+  ._button_4h7ix_2._appearance-ghost_4h7ix_131 {
     --button-foreground-color: var(--button-ghost-foreground-color, #141414);
     --button-border-color: var(--button-ghost-border-color, transparent);
     --button-border-radius: 0.375rem;
     --button-background-color: var(--button-ghost-background-color, transparent);
     --button-focus-ring-color: var(--button-ghost-focus-ring-color, #0265DC);
   }
-  ._button_1371l_2._appearance-ghost_1371l_131[data-interactive=hover], ._button_1371l_2._appearance-ghost_1371l_131:hover {
+  ._button_4h7ix_2._appearance-ghost_4h7ix_131[data-interactive=hover], ._button_4h7ix_2._appearance-ghost_4h7ix_131:hover {
     --button-foreground-color: var(--button-ghost-foreground-color-hover, #141414);
     --button-background-color: var(--button-ghost-background-color-hover, rgba(20, 20, 20, 0.0784313725));
   }
-  ._button_1371l_2._appearance-ghost_1371l_131[data-interactive=active], ._button_1371l_2._appearance-ghost_1371l_131:active {
+  ._button_4h7ix_2._appearance-ghost_4h7ix_131[data-interactive=active], ._button_4h7ix_2._appearance-ghost_4h7ix_131:active {
     --button-foreground-color: var(--button-ghost-foreground-color-active, #141414);
     --button-background-color: var(--button-ghost-background-color-active, rgba(20, 20, 20, 0.1607843137));
   }
-  ._button_1371l_2._danger-primary_1371l_146 {
+  ._button_4h7ix_2._danger-primary_4h7ix_146 {
     --button-foreground-color: var(--button-danger-primary-foreground-color, #ffffff);
     --button-border-color: var(--button-danger-primary-border-color, transparent);
     --button-border-radius: 0.375rem;
     --button-background-color: var(--button-danger-primary-background-color, #e13212);
     --button-focus-ring-color: var(--button-danger-primary-focus-ring-color, #e13212);
   }
-  ._button_1371l_2._danger-primary_1371l_146[data-interactive=hover], ._button_1371l_2._danger-primary_1371l_146:hover {
+  ._button_4h7ix_2._danger-primary_4h7ix_146[data-interactive=hover], ._button_4h7ix_2._danger-primary_4h7ix_146:hover {
     --button-foreground-color: var(--button-danger-primary-foreground-color-hover, #ffffff);
     --button-background-color: var(--button-danger-primary-background-color-hover, #b82c12);
   }
-  ._button_1371l_2._danger-primary_1371l_146[data-interactive=active], ._button_1371l_2._danger-primary_1371l_146:active {
+  ._button_4h7ix_2._danger-primary_4h7ix_146[data-interactive=active], ._button_4h7ix_2._danger-primary_4h7ix_146:active {
     --button-foreground-color: var(--button-danger-primary-foreground-color-active, #ffffff);
     --button-background-color: var(--button-danger-primary-background-color-active, #8f2613);
   }
-  ._button_1371l_2._danger-secondary_1371l_161 {
+  ._button_4h7ix_2._danger-secondary_4h7ix_161 {
     --button-foreground-color: var(--button-danger-secondary-foreground-color, #bf2a00);
     --button-border-color: var(--button-danger-secondary-border-color, transparent);
     --button-border-radius: 0.375rem;
     --button-background-color: var(--button-danger-secondary-background-color, #ffece9);
     --button-focus-ring-color: var(--button-danger-secondary-focus-ring-color, #e13212);
   }
-  ._button_1371l_2._danger-secondary_1371l_161[data-interactive=hover], ._button_1371l_2._danger-secondary_1371l_161:hover {
+  ._button_4h7ix_2._danger-secondary_4h7ix_161[data-interactive=hover], ._button_4h7ix_2._danger-secondary_4h7ix_161:hover {
     --button-foreground-color: var(--button-danger-secondary-foreground-color-hover, #bf2a00);
     --button-background-color: var(--button-danger-secondary-background-color-hover, #fcd9d4);
   }
-  ._button_1371l_2._danger-secondary_1371l_161[data-interactive=active], ._button_1371l_2._danger-secondary_1371l_161:active {
+  ._button_4h7ix_2._danger-secondary_4h7ix_161[data-interactive=active], ._button_4h7ix_2._danger-secondary_4h7ix_161:active {
     --button-foreground-color: var(--button-danger-secondary-foreground-color-active, #bf2a00);
     --button-background-color: var(--button-danger-secondary-background-color-active, #f6b4a9);
   }
-  ._button_1371l_2._type-icon_1371l_16 {
+  ._button_4h7ix_2._type-icon_4h7ix_16 {
     display: inline-flex;
     min-width: auto;
     --button-padding-block-start: 0.4375rem;
@@ -184,26 +184,26 @@ a[data-anv=button-link]:focus {
     --button-padding-inline-end: 0.4375rem;
     --button-padding-inline-start: 0.4375rem;
   }
-  ._button_1371l_2._type-icon_1371l_16._size-small_1371l_76 {
+  ._button_4h7ix_2._type-icon_4h7ix_16._size-small_4h7ix_76 {
     --button-padding-block-start: 0.4375rem;
     --button-padding-block-end: 0.4375rem;
     --button-padding-inline-end: 0.4375rem;
     --button-padding-inline-start: 0.4375rem;
   }
-  ._button_1371l_2._type-icon_1371l_16._size-medium_1371l_85 {
+  ._button_4h7ix_2._type-icon_4h7ix_16._size-medium_4h7ix_85 {
     --button-padding-block-start: 0.4375rem;
     --button-padding-block-end: 0.4375rem;
     --button-padding-inline-end: 0.4375rem;
     --button-padding-inline-start: 0.4375rem;
   }
-  ._button_1371l_2._type-icon_1371l_16._size-large_1371l_93 {
+  ._button_4h7ix_2._type-icon_4h7ix_16._size-large_4h7ix_93 {
     --button-padding-block-start: 0.6875rem;
     --button-padding-block-end: 0.6875rem;
     --button-padding-inline-end: 0.6875rem;
     --button-padding-inline-start: 0.6875rem;
   }
 }
-@keyframes _indeterminate-before_1371l_1 {
+@keyframes _indeterminate-before_4h7ix_1 {
   0% {
     inset-inline-start: -35%;
     inset-inline-end: 100%;
@@ -226,7 +226,7 @@ a[data-anv=button-link]:focus {
   }
 }
 @layer base {
-  ._button-compound_1371l_226 {
+  ._button-compound_4h7ix_226 {
     background-color: transparent;
     padding-block: 0;
     padding-inline: 0;
@@ -239,60 +239,60 @@ a[data-anv=button-link]:focus {
   }
 }
 @layer state {
-  ._button-compound_1371l_226[data-interactive=hover], ._button-compound_1371l_226:hover {
+  ._button-compound_4h7ix_226[data-interactive=hover], ._button-compound_4h7ix_226:hover {
     --button-background-color: var(--button-secondary-background-color-hover, rgba(5, 5, 5, 0.1333333333));
     z-index: 1;
   }
-  ._button-compound_1371l_226[data-interactive=active], ._button-compound_1371l_226:active {
+  ._button-compound_4h7ix_226[data-interactive=active], ._button-compound_4h7ix_226:active {
     --button-background-color: var(--button-secondary-background-color-active, rgba(7, 7, 7, 0.2078431373));
     z-index: 1;
   }
-  ._button-compound_1371l_226._shape-rounded_1371l_247 {
+  ._button-compound_4h7ix_226._shape-rounded_4h7ix_247 {
     --button-border-radius: 0.75rem;
   }
-  ._button-compound_1371l_226._shape-pill_1371l_250 {
+  ._button-compound_4h7ix_226._shape-pill_4h7ix_250 {
     --button-border-radius: 1.5rem;
   }
-  ._button-compound_1371l_226._shape-circular_1371l_253 {
+  ._button-compound_4h7ix_226._shape-circular_4h7ix_253 {
     --button-border-radius: 100%;
   }
 }
 @layer state {
-  ._button-toggle_1371l_258 {
+  ._button-toggle_4h7ix_258 {
     border-color: var(--border-color, #949596);
   }
-  ._button-toggle_1371l_258[aria-pressed=false]:not([data-interactive=hover],
+  ._button-toggle_4h7ix_258[aria-pressed=false]:not([data-interactive=hover],
   :hover,
   [data-interactive=active],
   :active) {
     background-color: var(--button-primary-foreground-color, #ffffff);
   }
-  ._button-toggle_1371l_258[aria-pressed=true]:not(:disabled, ._disabled_1371l_67, [aria-disabled=true]) {
+  ._button-toggle_4h7ix_258[aria-pressed=true]:not(:disabled, ._disabled_4h7ix_67, [aria-disabled=true]) {
     color: var(--foreground-color-primary, #0265DC);
     border-color: currentColor;
   }
-  ._button-toggle_1371l_258[aria-pressed=true]:not(:disabled, ._disabled_1371l_67, [aria-disabled=true])[data-interactive=hover], ._button-toggle_1371l_258[aria-pressed=true]:not(:disabled, ._disabled_1371l_67, [aria-disabled=true]):hover {
+  ._button-toggle_4h7ix_258[aria-pressed=true]:not(:disabled, ._disabled_4h7ix_67, [aria-disabled=true])[data-interactive=hover], ._button-toggle_4h7ix_258[aria-pressed=true]:not(:disabled, ._disabled_4h7ix_67, [aria-disabled=true]):hover {
     color: var(--foreground-color-hover-primary, #004491);
   }
-  ._button-toggle_1371l_258[aria-pressed=true]:not(:disabled, ._disabled_1371l_67, [aria-disabled=true])[data-interactive=hover]::before, ._button-toggle_1371l_258[aria-pressed=true]:not(:disabled, ._disabled_1371l_67, [aria-disabled=true]):hover::before {
+  ._button-toggle_4h7ix_258[aria-pressed=true]:not(:disabled, ._disabled_4h7ix_67, [aria-disabled=true])[data-interactive=hover]::before, ._button-toggle_4h7ix_258[aria-pressed=true]:not(:disabled, ._disabled_4h7ix_67, [aria-disabled=true]):hover::before {
     content: "";
     background-color: var(--overlay-color-hover-primary, rgba(2, 101, 220, 0.1019607843));
     position: absolute;
     inset: 0;
     z-index: 1;
   }
-  ._button-toggle_1371l_258[aria-pressed=true]:not(:disabled, ._disabled_1371l_67, [aria-disabled=true])[data-interactive=active], ._button-toggle_1371l_258[aria-pressed=true]:not(:disabled, ._disabled_1371l_67, [aria-disabled=true]):active {
+  ._button-toggle_4h7ix_258[aria-pressed=true]:not(:disabled, ._disabled_4h7ix_67, [aria-disabled=true])[data-interactive=active], ._button-toggle_4h7ix_258[aria-pressed=true]:not(:disabled, ._disabled_4h7ix_67, [aria-disabled=true]):active {
     color: var(--foreground-color-active-primary, #004491);
     border-color: currentColor;
   }
-  ._button-toggle_1371l_258[aria-pressed=true]:not(:disabled, ._disabled_1371l_67, [aria-disabled=true])[data-interactive=active]::before, ._button-toggle_1371l_258[aria-pressed=true]:not(:disabled, ._disabled_1371l_67, [aria-disabled=true]):active::before {
+  ._button-toggle_4h7ix_258[aria-pressed=true]:not(:disabled, ._disabled_4h7ix_67, [aria-disabled=true])[data-interactive=active]::before, ._button-toggle_4h7ix_258[aria-pressed=true]:not(:disabled, ._disabled_4h7ix_67, [aria-disabled=true]):active::before {
     content: "";
     background-color: var(--overlay-color-active-primary, rgba(2, 101, 220, 0.3019607843));
     position: absolute;
     inset: 0;
     z-index: 1;
   }
-  ._button-toggle_1371l_258[aria-pressed=true]:not(:disabled, ._disabled_1371l_67, [aria-disabled=true])::after {
+  ._button-toggle_4h7ix_258[aria-pressed=true]:not(:disabled, ._disabled_4h7ix_67, [aria-disabled=true])::after {
     content: "";
     position: absolute;
     width: 100%;
@@ -308,11 +308,11 @@ a[data-anv=button-link]:focus {
   }
 }
 @layer application {
-  ._button-toggle_1371l_258:disabled, ._button-toggle_1371l_258._disabled_1371l_67, ._button-toggle_1371l_258[aria-disabled=true] {
+  ._button-toggle_4h7ix_258:disabled, ._button-toggle_4h7ix_258._disabled_4h7ix_67, ._button-toggle_4h7ix_258[aria-disabled=true] {
     color: var(--foreground-color-subdued, #737475);
     border-color: transparent;
   }
-  ._button_1371l_2:disabled, ._button_1371l_2._disabled_1371l_67, ._button_1371l_2[aria-disabled=true] {
+  ._button_4h7ix_2:disabled, ._button_4h7ix_2._disabled_4h7ix_67, ._button_4h7ix_2[aria-disabled=true] {
     cursor: not-allowed;
     opacity: 0.6;
     --button-foreground-color: var(--foreground-color-subdued, #737475);

package/dist/Button.js

@@ -1,2 +1,2 @@
-export { B as Button, B as default } from './Button-BxFXQ0-n.js';
+export { B as Button, B as default } from './Button-VNQQgZ45.js';
 //# sourceMappingURL=Button.js.map

package/dist/Button.module-C1g9rrJs.js

@@ -0,0 +1,25 @@
+import './Button.css';const button = "_button_4h7ix_2";
+const icon = "_icon_4h7ix_62";
+const loading = "_loading_4h7ix_70";
+const styles = {
+	button: button,
+	"type-icon": "_type-icon_4h7ix_16",
+	icon: icon,
+	loading: loading,
+	"loading-spinner": "_loading-spinner_4h7ix_73",
+	"size-small": "_size-small_4h7ix_76",
+	"size-medium": "_size-medium_4h7ix_85",
+	"size-large": "_size-large_4h7ix_93",
+	"appearance-primary": "_appearance-primary_4h7ix_101",
+	"appearance-secondary": "_appearance-secondary_4h7ix_116",
+	"appearance-ghost": "_appearance-ghost_4h7ix_131",
+	"danger-primary": "_danger-primary_4h7ix_146",
+	"danger-secondary": "_danger-secondary_4h7ix_161",
+	"button-compound": "_button-compound_4h7ix_226",
+	"shape-rounded": "_shape-rounded_4h7ix_247",
+	"shape-pill": "_shape-pill_4h7ix_250",
+	"shape-circular": "_shape-circular_4h7ix_253",
+	"button-toggle": "_button-toggle_4h7ix_258"};
+
+export { styles as s };
+//# sourceMappingURL=Button.module-C1g9rrJs.js.map

package/dist/Button.module-C1g9rrJs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.module-C1g9rrJs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/{ButtonCompound-BF2Q6gGX.js → ButtonCompound-BbPK-Xjj.js}

@@ -1,7 +1,7 @@
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { c as cx } from './index-tZvMCc77.js';
-import { s as styles } from './Button.module-pUNSKoVC.js';
+import { s as styles } from './Button.module-C1g9rrJs.js';
 import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-DjD5IMh0.js';
 import { c as childrenToString } from './childrenToString-Bz9MqbHb.js';
 import { useTrackingId } from './useTrackingId.js';
@@ -61,4 +61,4 @@ const ButtonCompound = forwardRef(
 ButtonCompound.displayName = "ButtonCompound";
 
 export { ButtonCompound as B };
-//# sourceMappingURL=ButtonCompound-BF2Q6gGX.js.map
+//# sourceMappingURL=ButtonCompound-BbPK-Xjj.js.map

package/dist/{ButtonCompound-BF2Q6gGX.js.map → ButtonCompound-BbPK-Xjj.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ButtonCompound-BF2Q6gGX.js","sources":["../src/components/ButtonCompound/ButtonCompound.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, Ref, forwardRef } from \"react\";\nimport { useTrackingId } from \"../../hooks\";\nimport { DataTrackingId, LayoutUtilProps } from \"../../types\";\nimport { childrenToString } from \"../../internal/functions\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\n\nimport cx from \"classnames\";\nimport styles from \"../Button/Button.module.scss\";\n\n/**\n * Props for the ButtonCompound component\n * @extends LayoutUtilProps\n * @extends ComponentPropsWithoutRef<\"button\">\n */\nexport type ButtonCompoundProps = LayoutUtilProps &\n  ComponentPropsWithoutRef<\"button\"> & {\n    /**\n     * The shape of the compound button.\n     * @default rounded\n     */\n    shape?: \"pill\" | \"circular\" | \"rounded\";\n  } &\n  /**\n   * Data tracking id\n   */\n  DataTrackingId;\n\n/**\n * ButtonCompound component for creating compound button layouts.\n *\n * Features:\n * - Three shape options (pill, circular, rounded)\n * - Transparent background for compound layouts\n * - Supports layout utilities for positioning and spacing\n * - Full accessibility support with proper ARIA attributes\n * - Flexible content support\n * - Consistent styling with other button components\n * - Hover and active state management\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <ButtonCompound shape=\"circular\">\n *   <Avatar name=\"John Doe\" />\n * </ButtonCompound>\n */\nexport const ButtonCompound = forwardRef(\n  (props: ButtonCompoundProps, ref: Ref<HTMLButtonElement>) => {\n    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n    const {\n      className,\n      shape = \"rounded\",\n      type,\n      disabled,\n      children,\n      style,\n      ...rest\n    } = componentProps;\n\n    const data = {\n      children: childrenToString(props.children),\n      shape,\n      type,\n    };\n\n    const trackingId = useTrackingId({\n      name: \"ButtonCompound\",\n      data,\n      hasOverride: !!props[\"data-tracking-id\"],\n    });\n\n    const buttonClassNames = cx(\n      className,\n      styles[\"button\"],\n      styles[\"button-compound\"],\n      {\n        [styles[\"shape-pill\"]]: shape === \"pill\",\n        [styles[\"shape-circular\"]]: shape === \"circular\",\n        [styles[\"shape-rounded\"]]: shape === \"rounded\",\n      },\n    );\n\n    const styleCombined = {\n      ...style,\n      ...layoutStyles,\n    };\n\n    return (\n      <button\n        data-tracking-id={trackingId}\n        className={buttonClassNames}\n        type={type}\n        disabled={disabled}\n        data-anv=\"button-compound\"\n        ref={ref}\n        style={styleCombined}\n        {...rest}\n      >\n        {children}\n      </button>\n    );\n  },\n);\n\nButtonCompound.displayName = \"ButtonCompound\";\n"],"names":[],"mappings":";;;;;;;;AA6CO,MAAM,cAAiB,GAAA,UAAA;AAAA,EAC5B,CAAC,OAA4B,GAAgC,KAAA;AAC3D,IAAA,MAAM,EAAE,YAAA,EAAc,cAAe,EAAA,GAAI,mBAAmB,KAAK,CAAA;AACjE,IAAM,MAAA;AAAA,MACJ,SAAA;AAAA,MACA,KAAQ,GAAA,SAAA;AAAA,MACR,IAAA;AAAA,MACA,QAAA;AAAA,MACA,QAAA;AAAA,MACA,KAAA;AAAA,MACA,GAAG;AAAA,KACD,GAAA,cAAA;AAEJ,IAAA,MAAM,IAAO,GAAA;AAAA,MACX,QAAA,EAAU,gBAAiB,CAAA,KAAA,CAAM,QAAQ,CAAA;AAAA,MACzC,KAAA;AAAA,MACA;AAAA,KACF;AAEA,IAAA,MAAM,aAAa,aAAc,CAAA;AAAA,MAC/B,IAAM,EAAA,gBAAA;AAAA,MACN,IAAA;AAAA,MACA,WAAa,EAAA,CAAC,CAAC,KAAA,CAAM,kBAAkB;AAAA,KACxC,CAAA;AAED,IAAA,MAAM,gBAAmB,GAAA,EAAA;AAAA,MACvB,SAAA;AAAA,MACA,OAAO,QAAQ,CAAA;AAAA,MACf,OAAO,iBAAiB,CAAA;AAAA,MACxB;AAAA,QACE,CAAC,MAAA,CAAO,YAAY,CAAC,GAAG,KAAU,KAAA,MAAA;AAAA,QAClC,CAAC,MAAA,CAAO,gBAAgB,CAAC,GAAG,KAAU,KAAA,UAAA;AAAA,QACtC,CAAC,MAAA,CAAO,eAAe,CAAC,GAAG,KAAU,KAAA;AAAA;AACvC,KACF;AAEA,IAAA,MAAM,aAAgB,GAAA;AAAA,MACpB,GAAG,KAAA;AAAA,MACH,GAAG;AAAA,KACL;AAEA,IACE,uBAAA,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,kBAAkB,EAAA,UAAA;AAAA,QAClB,SAAW,EAAA,gBAAA;AAAA,QACX,IAAA;AAAA,QACA,QAAA;AAAA,QACA,UAAS,EAAA,iBAAA;AAAA,QACT,GAAA;AAAA,QACA,KAAO,EAAA,aAAA;AAAA,QACN,GAAG,IAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA;AAGN;AAEA,cAAA,CAAe,WAAc,GAAA,gBAAA;;;;"}
+{"version":3,"file":"ButtonCompound-BbPK-Xjj.js","sources":["../src/components/ButtonCompound/ButtonCompound.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, Ref, forwardRef } from \"react\";\nimport { useTrackingId } from \"../../hooks\";\nimport { DataTrackingId, LayoutUtilProps } from \"../../types\";\nimport { childrenToString } from \"../../internal/functions\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\n\nimport cx from \"classnames\";\nimport styles from \"../Button/Button.module.scss\";\n\n/**\n * Props for the ButtonCompound component\n * @extends LayoutUtilProps\n * @extends ComponentPropsWithoutRef<\"button\">\n */\nexport type ButtonCompoundProps = LayoutUtilProps &\n  ComponentPropsWithoutRef<\"button\"> & {\n    /**\n     * The shape of the compound button.\n     * @default rounded\n     */\n    shape?: \"pill\" | \"circular\" | \"rounded\";\n  } &\n  /**\n   * Data tracking id\n   */\n  DataTrackingId;\n\n/**\n * ButtonCompound component for creating compound button layouts.\n *\n * Features:\n * - Three shape options (pill, circular, rounded)\n * - Transparent background for compound layouts\n * - Supports layout utilities for positioning and spacing\n * - Full accessibility support with proper ARIA attributes\n * - Flexible content support\n * - Consistent styling with other button components\n * - Hover and active state management\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <ButtonCompound shape=\"circular\">\n *   <Avatar name=\"John Doe\" />\n * </ButtonCompound>\n */\nexport const ButtonCompound = forwardRef(\n  (props: ButtonCompoundProps, ref: Ref<HTMLButtonElement>) => {\n    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n    const {\n      className,\n      shape = \"rounded\",\n      type,\n      disabled,\n      children,\n      style,\n      ...rest\n    } = componentProps;\n\n    const data = {\n      children: childrenToString(props.children),\n      shape,\n      type,\n    };\n\n    const trackingId = useTrackingId({\n      name: \"ButtonCompound\",\n      data,\n      hasOverride: !!props[\"data-tracking-id\"],\n    });\n\n    const buttonClassNames = cx(\n      className,\n      styles[\"button\"],\n      styles[\"button-compound\"],\n      {\n        [styles[\"shape-pill\"]]: shape === \"pill\",\n        [styles[\"shape-circular\"]]: shape === \"circular\",\n        [styles[\"shape-rounded\"]]: shape === \"rounded\",\n      },\n    );\n\n    const styleCombined = {\n      ...style,\n      ...layoutStyles,\n    };\n\n    return (\n      <button\n        data-tracking-id={trackingId}\n        className={buttonClassNames}\n        type={type}\n        disabled={disabled}\n        data-anv=\"button-compound\"\n        ref={ref}\n        style={styleCombined}\n        {...rest}\n      >\n        {children}\n      </button>\n    );\n  },\n);\n\nButtonCompound.displayName = \"ButtonCompound\";\n"],"names":[],"mappings":";;;;;;;;AA6CO,MAAM,cAAA,GAAiB,UAAA;AAAA,EAC5B,CAAC,OAA4B,GAAA,KAAgC;AAC3D,IAAA,MAAM,EAAE,YAAA,EAAc,cAAA,EAAe,GAAI,mBAAmB,KAAK,CAAA;AACjE,IAAA,MAAM;AAAA,MACJ,SAAA;AAAA,MACA,KAAA,GAAQ,SAAA;AAAA,MACR,IAAA;AAAA,MACA,QAAA;AAAA,MACA,QAAA;AAAA,MACA,KAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,cAAA;AAEJ,IAAA,MAAM,IAAA,GAAO;AAAA,MACX,QAAA,EAAU,gBAAA,CAAiB,KAAA,CAAM,QAAQ,CAAA;AAAA,MACzC,KAAA;AAAA,MACA;AAAA,KACF;AAEA,IAAA,MAAM,aAAa,aAAA,CAAc;AAAA,MAC/B,IAAA,EAAM,gBAAA;AAAA,MACN,IAAA;AAAA,MACA,WAAA,EAAa,CAAC,CAAC,KAAA,CAAM,kBAAkB;AAAA,KACxC,CAAA;AAED,IAAA,MAAM,gBAAA,GAAmB,EAAA;AAAA,MACvB,SAAA;AAAA,MACA,OAAO,QAAQ,CAAA;AAAA,MACf,OAAO,iBAAiB,CAAA;AAAA,MACxB;AAAA,QACE,CAAC,MAAA,CAAO,YAAY,CAAC,GAAG,KAAA,KAAU,MAAA;AAAA,QAClC,CAAC,MAAA,CAAO,gBAAgB,CAAC,GAAG,KAAA,KAAU,UAAA;AAAA,QACtC,CAAC,MAAA,CAAO,eAAe,CAAC,GAAG,KAAA,KAAU;AAAA;AACvC,KACF;AAEA,IAAA,MAAM,aAAA,GAAgB;AAAA,MACpB,GAAG,KAAA;AAAA,MACH,GAAG;AAAA,KACL;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,kBAAA,EAAkB,UAAA;AAAA,QAClB,SAAA,EAAW,gBAAA;AAAA,QACX,IAAA;AAAA,QACA,QAAA;AAAA,QACA,UAAA,EAAS,iBAAA;AAAA,QACT,GAAA;AAAA,QACA,KAAA,EAAO,aAAA;AAAA,QACN,GAAG,IAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;AAEA,cAAA,CAAe,WAAA,GAAc,gBAAA;;;;"}

package/dist/ButtonCompound.js

@@ -1,2 +1,2 @@
-export { B as ButtonCompound, B as default } from './ButtonCompound-BF2Q6gGX.js';
+export { B as ButtonCompound, B as default } from './ButtonCompound-BbPK-Xjj.js';
 //# sourceMappingURL=ButtonCompound.js.map

package/dist/{ButtonLink-CXv65WVV.js → ButtonLink-CqR1F5Wn.js}

@@ -3,7 +3,7 @@ import { forwardRef } from 'react';
 import { I as Icon } from './Icon-D8SPKeO4.js';
 import { S as Spinner } from './Spinner-wmO8Epw0.js';
 import { c as cx } from './index-tZvMCc77.js';
-import { s as styles } from './Button.module-pUNSKoVC.js';
+import { s as styles } from './Button.module-C1g9rrJs.js';
 import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-DjD5IMh0.js';
 import { c as childrenToString } from './childrenToString-Bz9MqbHb.js';
 import { useTrackingId } from './useTrackingId.js';
@@ -100,7 +100,6 @@ const ButtonLink = forwardRef(
     return /* @__PURE__ */ jsxs(
       "a",
       {
-        role: "link",
         "data-tracking-id": trackingId,
         className: buttonClassNames,
         "aria-disabled": disabled || loading,
@@ -112,6 +111,7 @@ const ButtonLink = forwardRef(
         onKeyUp: onKeyUpHandler,
         style: styleCombined,
         ref,
+        href,
         ...rest,
         children: [
           loading ? /* @__PURE__ */ jsx(Spinner, { inherit: true, className: styles["loading-spinner"] }) : icon ? iconBefore(icon) : null,
@@ -133,4 +133,4 @@ const ButtonLink = forwardRef(
 ButtonLink.displayName = "ButtonLink";
 
 export { ButtonLink as B };
-//# sourceMappingURL=ButtonLink-CXv65WVV.js.map
+//# sourceMappingURL=ButtonLink-CqR1F5Wn.js.map

package/dist/{ButtonLink-CXv65WVV.js.map → ButtonLink-CqR1F5Wn.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ButtonLink-CXv65WVV.js","sources":["../src/components/ButtonLink/ButtonLink.tsx"],"sourcesContent":["import {\n  ComponentPropsWithoutRef,\n  KeyboardEvent,\n  MouseEvent,\n  Ref,\n  forwardRef,\n} from \"react\";\nimport { useTrackingId } from \"../../hooks\";\nimport {\n  DataTrackingId,\n  ButtonAppearance,\n  LayoutUtilProps,\n  Size,\n} from \"../../types\";\nimport Icon, { IconProps } from \"../Icon\";\nimport { childrenToString } from \"../../internal/functions\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\nimport Spinner from \"../Spinner\";\n\nimport cx from \"classnames\";\nimport styles from \"../Button/Button.module.scss\";\n\n/**\n * Props for the ButtonLink component\n * @extends LayoutUtilProps\n * @extends ComponentPropsWithoutRef<\"a\">\n */\nexport type ButtonLinkProps = LayoutUtilProps &\n  ComponentPropsWithoutRef<\"a\"> & {\n    /**\n     * The disabled state of the button link.\n     * @default false\n     */\n    disabled?: boolean;\n\n    /**\n     * The visual variant of the button link.\n     * @default secondary\n     */\n    appearance?: ButtonAppearance;\n\n    /**\n     * The size of the button link.\n     * @default medium\n     */\n    size?: Extract<Size, \"small\" | \"medium\" | \"large\">;\n\n    /**\n     * The icons of the button link.\n     */\n    icon?:\n      | IconProps[\"svg\"]\n      | {\n          after: IconProps[\"svg\"];\n        }\n      | {\n          before: IconProps[\"svg\"];\n        };\n\n    /**\n     * The loading state of the button link.\n     * If true, it will show infinite state of the loading.\n     * @default false\n     */\n    loading?: boolean;\n  } &\n  /**\n   * Data tracking id\n   */\n  DataTrackingId;\n\n/**\n * ButtonLink component for creating clickable links that look like buttons.\n *\n * Features:\n * - Multiple visual appearances (primary, secondary, ghost, danger variants)\n * - Three size options (small, medium, large)\n * - Loading state with spinner animation\n * - Icon support (before, after, or icon-only)\n * - Full accessibility support with proper ARIA attributes\n * - Supports layout utilities for positioning and spacing\n * - Keyboard navigation support (Space and Enter keys)\n * - Automatic disabled state when loading\n * - Prevents navigation when disabled or loading\n * - Flexible content with text and/or icons\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <ButtonLink href=\"/dashboard\" appearance=\"primary\" size=\"medium\">\n *   Go to Dashboard\n * </ButtonLink>\n */\nexport const ButtonLink = forwardRef(\n  (props: ButtonLinkProps, ref: Ref<HTMLAnchorElement>) => {\n    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n\n    const {\n      children,\n      className,\n      appearance = \"secondary\",\n      size = \"medium\",\n      icon,\n      loading = false,\n      disabled,\n      onClick,\n      onKeyUp,\n      onKeyDown,\n      style,\n      href,\n      type,\n      ...rest\n    } = componentProps;\n\n    const data = {\n      children: childrenToString(props.children),\n      appearance,\n      href,\n      icon,\n      size,\n      type,\n    };\n\n    const iconBefore = (icon: ButtonLinkProps[\"icon\"]) => {\n      if (icon && typeof icon === \"object\" && \"before\" in icon) {\n        return (\n          <Icon\n            aria-hidden\n            className={styles[\"icon\"]}\n            inherit\n            svg={icon.before}\n          />\n        );\n      }\n      if (icon && typeof icon !== \"object\") {\n        return (\n          <Icon aria-hidden className={styles[\"icon\"]} inherit svg={icon} />\n        );\n      }\n      return;\n    };\n\n    const handleOnClick = (e: MouseEvent<HTMLAnchorElement>) => {\n      if (disabled || loading) {\n        e.preventDefault();\n        return;\n      }\n      onClick?.(e);\n    };\n\n    const onKeyDownHandler = (e: KeyboardEvent<HTMLAnchorElement>) => {\n      if (e.code === \"Space\") {\n        e.preventDefault();\n        onKeyDown?.(e);\n        return;\n      }\n\n      onKeyDown?.(e);\n    };\n\n    const onKeyUpHandler = (e: KeyboardEvent<HTMLAnchorElement>) => {\n      if (e.code === \"Space\" || e.code === \"Enter\") {\n        e.preventDefault();\n        if (onClick) {\n          e.currentTarget.click();\n        }\n      }\n\n      onKeyUp?.(e);\n    };\n\n    const trackingId = useTrackingId({\n      name: \"ButtonLink\",\n      data,\n      hasOverride: !!props[\"data-tracking-id\"],\n    });\n\n    const buttonClassNames = cx(className, styles[\"button\"], {\n      [styles[\"appearance-primary\"]]: appearance === \"primary\",\n      [styles[\"appearance-secondary\"]]: appearance === \"secondary\",\n      [styles[\"appearance-ghost\"]]: appearance === \"ghost\",\n      [styles[\"danger-secondary\"]]: appearance === \"danger-secondary\",\n      [styles[\"danger-primary\"]]: appearance === \"danger\",\n      [styles[\"size-small\"]]: size === \"small\",\n      [styles[\"size-medium\"]]: size === \"medium\",\n      [styles[\"size-large\"]]: size === \"large\",\n      [styles[\"type-icon\"]]: !children,\n      [styles[\"loading\"]]: loading,\n    });\n\n    const styleCombined = {\n      ...style,\n      ...layoutStyles,\n    };\n\n    return (\n      <a\n        role=\"link\"\n        data-tracking-id={trackingId}\n        className={buttonClassNames}\n        aria-disabled={disabled || loading}\n        aria-busy={loading}\n        data-anv=\"button-link\"\n        tabIndex={disabled || loading ? -1 : 0}\n        onClick={handleOnClick}\n        onKeyDown={onKeyDownHandler}\n        onKeyUp={onKeyUpHandler}\n        style={styleCombined}\n        ref={ref}\n        {...rest}\n      >\n        {loading ? (\n          <Spinner inherit className={styles[\"loading-spinner\"]} />\n        ) : icon ? (\n          iconBefore(icon)\n        ) : null}\n        {children}\n        {typeof icon === \"object\" && \"after\" in icon ? (\n          <Icon\n            className={styles[\"icon\"]}\n            inherit\n            aria-hidden\n            svg={icon.after}\n          />\n        ) : null}\n      </a>\n    );\n  },\n);\n\nButtonLink.displayName = \"ButtonLink\";\n"],"names":["icon"],"mappings":"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"}
+{"version":3,"file":"ButtonLink-CqR1F5Wn.js","sources":["../src/components/ButtonLink/ButtonLink.tsx"],"sourcesContent":["import {\n  ComponentPropsWithoutRef,\n  KeyboardEvent,\n  MouseEvent,\n  Ref,\n  forwardRef,\n} from \"react\";\nimport { useTrackingId } from \"../../hooks\";\nimport {\n  DataTrackingId,\n  ButtonAppearance,\n  LayoutUtilProps,\n  Size,\n} from \"../../types\";\nimport Icon, { IconProps } from \"../Icon\";\nimport { childrenToString } from \"../../internal/functions\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\nimport Spinner from \"../Spinner\";\n\nimport cx from \"classnames\";\nimport styles from \"../Button/Button.module.scss\";\n\n/**\n * Props for the ButtonLink component\n * @extends LayoutUtilProps\n * @extends ComponentPropsWithoutRef<\"a\">\n */\nexport type ButtonLinkProps = LayoutUtilProps &\n  ComponentPropsWithoutRef<\"a\"> & {\n    /**\n     * The disabled state of the button link.\n     * @default false\n     */\n    disabled?: boolean;\n\n    /**\n     * The visual variant of the button link.\n     * @default secondary\n     */\n    appearance?: ButtonAppearance;\n\n    /**\n     * The size of the button link.\n     * @default medium\n     */\n    size?: Extract<Size, \"small\" | \"medium\" | \"large\">;\n\n    /**\n     * The icons of the button link.\n     */\n    icon?:\n      | IconProps[\"svg\"]\n      | {\n          after: IconProps[\"svg\"];\n        }\n      | {\n          before: IconProps[\"svg\"];\n        };\n\n    /**\n     * The loading state of the button link.\n     * If true, it will show infinite state of the loading.\n     * @default false\n     */\n    loading?: boolean;\n  } &\n  /**\n   * Data tracking id\n   */\n  DataTrackingId;\n\n/**\n * ButtonLink component for creating clickable links that look like buttons.\n *\n * Features:\n * - Multiple visual appearances (primary, secondary, ghost, danger variants)\n * - Three size options (small, medium, large)\n * - Loading state with spinner animation\n * - Icon support (before, after, or icon-only)\n * - Full accessibility support with proper ARIA attributes\n * - Supports layout utilities for positioning and spacing\n * - Keyboard navigation support (Space and Enter keys)\n * - Automatic disabled state when loading\n * - Prevents navigation when disabled or loading\n * - Flexible content with text and/or icons\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <ButtonLink href=\"/dashboard\" appearance=\"primary\" size=\"medium\">\n *   Go to Dashboard\n * </ButtonLink>\n */\nexport const ButtonLink = forwardRef(\n  (props: ButtonLinkProps, ref: Ref<HTMLAnchorElement>) => {\n    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n\n    const {\n      children,\n      className,\n      appearance = \"secondary\",\n      size = \"medium\",\n      icon,\n      loading = false,\n      disabled,\n      onClick,\n      onKeyUp,\n      onKeyDown,\n      style,\n      href,\n      type,\n      ...rest\n    } = componentProps;\n\n    const data = {\n      children: childrenToString(props.children),\n      appearance,\n      href,\n      icon,\n      size,\n      type,\n    };\n\n    const iconBefore = (icon: ButtonLinkProps[\"icon\"]) => {\n      if (icon && typeof icon === \"object\" && \"before\" in icon) {\n        return (\n          <Icon\n            aria-hidden\n            className={styles[\"icon\"]}\n            inherit\n            svg={icon.before}\n          />\n        );\n      }\n      if (icon && typeof icon !== \"object\") {\n        return (\n          <Icon aria-hidden className={styles[\"icon\"]} inherit svg={icon} />\n        );\n      }\n      return;\n    };\n\n    const handleOnClick = (e: MouseEvent<HTMLAnchorElement>) => {\n      if (disabled || loading) {\n        e.preventDefault();\n        return;\n      }\n      onClick?.(e);\n    };\n\n    const onKeyDownHandler = (e: KeyboardEvent<HTMLAnchorElement>) => {\n      if (e.code === \"Space\") {\n        e.preventDefault();\n        onKeyDown?.(e);\n        return;\n      }\n\n      onKeyDown?.(e);\n    };\n\n    const onKeyUpHandler = (e: KeyboardEvent<HTMLAnchorElement>) => {\n      if (e.code === \"Space\" || e.code === \"Enter\") {\n        e.preventDefault();\n        if (onClick) {\n          e.currentTarget.click();\n        }\n      }\n\n      onKeyUp?.(e);\n    };\n\n    const trackingId = useTrackingId({\n      name: \"ButtonLink\",\n      data,\n      hasOverride: !!props[\"data-tracking-id\"],\n    });\n\n    const buttonClassNames = cx(className, styles[\"button\"], {\n      [styles[\"appearance-primary\"]]: appearance === \"primary\",\n      [styles[\"appearance-secondary\"]]: appearance === \"secondary\",\n      [styles[\"appearance-ghost\"]]: appearance === \"ghost\",\n      [styles[\"danger-secondary\"]]: appearance === \"danger-secondary\",\n      [styles[\"danger-primary\"]]: appearance === \"danger\",\n      [styles[\"size-small\"]]: size === \"small\",\n      [styles[\"size-medium\"]]: size === \"medium\",\n      [styles[\"size-large\"]]: size === \"large\",\n      [styles[\"type-icon\"]]: !children,\n      [styles[\"loading\"]]: loading,\n    });\n\n    const styleCombined = {\n      ...style,\n      ...layoutStyles,\n    };\n\n    return (\n      <a\n        data-tracking-id={trackingId}\n        className={buttonClassNames}\n        aria-disabled={disabled || loading}\n        aria-busy={loading}\n        data-anv=\"button-link\"\n        tabIndex={disabled || loading ? -1 : 0}\n        onClick={handleOnClick}\n        onKeyDown={onKeyDownHandler}\n        onKeyUp={onKeyUpHandler}\n        style={styleCombined}\n        ref={ref}\n        href={href}\n        {...rest}\n      >\n        {loading ? (\n          <Spinner inherit className={styles[\"loading-spinner\"]} />\n        ) : icon ? (\n          iconBefore(icon)\n        ) : null}\n        {children}\n        {typeof icon === \"object\" && \"after\" in icon ? (\n          <Icon\n            className={styles[\"icon\"]}\n            inherit\n            aria-hidden\n            svg={icon.after}\n          />\n        ) : null}\n      </a>\n    );\n  },\n);\n\nButtonLink.displayName = \"ButtonLink\";\n"],"names":["icon"],"mappings":"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"}

package/dist/ButtonLink.js

@@ -1,2 +1,2 @@
-export { B as ButtonLink, B as default } from './ButtonLink-CXv65WVV.js';
+export { B as ButtonLink, B as default } from './ButtonLink-CqR1F5Wn.js';
 //# sourceMappingURL=ButtonLink.js.map

package/dist/{ButtonToggle-pSwg7NvT.js → ButtonToggle-PCeSG-5D.js}

@@ -1,8 +1,8 @@
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef, useState, useEffect } from 'react';
-import { B as Button } from './Button-BxFXQ0-n.js';
+import { B as Button } from './Button-VNQQgZ45.js';
 import { c as cx } from './index-tZvMCc77.js';
-import { s as styles } from './Button.module-pUNSKoVC.js';
+import { s as styles } from './Button.module-C1g9rrJs.js';
 import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-DjD5IMh0.js';
 import { c as childrenToString } from './childrenToString-Bz9MqbHb.js';
 import { useTrackingId } from './useTrackingId.js';
@@ -75,4 +75,4 @@ const ButtonToggle = forwardRef(
 ButtonToggle.displayName = "ButtonToggle";
 
 export { ButtonToggle as B };
-//# sourceMappingURL=ButtonToggle-pSwg7NvT.js.map
+//# sourceMappingURL=ButtonToggle-PCeSG-5D.js.map

package/dist/{ButtonToggle-pSwg7NvT.js.map → ButtonToggle-PCeSG-5D.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ButtonToggle-pSwg7NvT.js","sources":["../src/components/ButtonToggle/ButtonToggle.tsx"],"sourcesContent":["import {\n  forwardRef,\n  KeyboardEvent,\n  MouseEvent,\n  Ref,\n  useEffect,\n  useState,\n} from \"react\";\nimport { useTrackingId } from \"../../hooks\";\nimport { DataTrackingId } from \"../../types\";\nimport { Button, ButtonProps } from \"../Button/Button\";\nimport { childrenToString } from \"../../internal/functions\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\n\nimport cx from \"classnames\";\nimport styles from \"../Button/Button.module.scss\";\n\nexport type ButtonToggleState = {\n  pressed: boolean;\n  value?: string;\n};\n\n/**\n * Props for the ButtonToggle component\n * @extends Omit<ButtonProps, \"appearance\" | \"loading\">\n */\nexport type ButtonToggleProps = Omit<ButtonProps, \"appearance\" | \"loading\"> & {\n  /**\n   * The default pressed(selected) state of the toggle button.\n   * @default false\n   */\n  defaultChecked?: boolean;\n\n  /**\n   * The controlled pressed(selected) state of the toggle button.\n   */\n  checked?: boolean;\n\n  /**\n   * The value of the toggle button.\n   */\n  value?: string;\n\n  /**\n   * Callback for when pressed(selected) changes.\n   */\n  onChange?: (\n    e: MouseEvent<HTMLButtonElement> | KeyboardEvent<HTMLButtonElement>,\n    state: ButtonToggleState,\n  ) => void;\n} &\n  /**\n   * Data tracking id\n   */\n  DataTrackingId;\n\n/**\n * ButtonToggle component for creating toggleable button states.\n *\n * Features:\n * - Supports both controlled and uncontrolled state management\n * - Toggle state with pressed/selected visual feedback\n * - Full accessibility support with aria-pressed attribute\n * - Callback support for state changes\n * - Supports layout utilities for positioning and spacing\n * - Inherits all button features except appearance and loading\n * - Flexible content with text and/or icons\n * - Keyboard interaction support\n * - Value association for form-like behavior\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <ButtonToggle\n *   defaultChecked={false}\n *   onChange={(e, state) => console.log('Toggle state:', state.pressed)}\n * >\n *   Toggle Me\n * </ButtonToggle>\n */\nexport const ButtonToggle = forwardRef(\n  (props: ButtonToggleProps, ref: Ref<HTMLButtonElement>) => {\n    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n    const {\n      value,\n      defaultChecked = false,\n      checked,\n      className,\n      onClick,\n      onChange,\n      onKeyDown,\n      style,\n      icon,\n      size,\n      type,\n      ...rest\n    } = componentProps;\n\n    const [isPressed, setIsPressed] = useState(checked ?? defaultChecked);\n\n    const onClickHandler = (e: MouseEvent<HTMLButtonElement>) => {\n      if (typeof checked === \"undefined\") {\n        setIsPressed(!isPressed);\n        onChange?.(e, { pressed: !isPressed, value });\n      }\n      onClick?.(e);\n    };\n\n    useEffect(() => {\n      if (typeof checked === \"undefined\") return;\n      setIsPressed(checked);\n    }, [checked]);\n\n    const data = {\n      children: childrenToString(props.children),\n      icon,\n      size,\n      value,\n      type,\n    };\n\n    const trackingId = useTrackingId({\n      name: \"ButtonToggle\",\n      data,\n      hasOverride: !!props[\"data-tracking-id\"],\n    });\n\n    const ButtonToggleClassNames = cx(className, styles[\"button-toggle\"]);\n\n    const styleCombined = {\n      ...style,\n      ...layoutStyles,\n    };\n    return (\n      <Button\n        data-tracking-id={trackingId}\n        data-anv=\"button-toggle\"\n        aria-pressed={isPressed}\n        onClick={onClickHandler}\n        className={ButtonToggleClassNames}\n        value={value}\n        style={styleCombined}\n        icon={icon}\n        size={size}\n        type={type}\n        ref={ref}\n        {...rest}\n      />\n    );\n  },\n);\n\nButtonToggle.displayName = \"ButtonToggle\";\n"],"names":[],"mappings":";;;;;;;;;AA+EO,MAAM,YAAe,GAAA,UAAA;AAAA,EAC1B,CAAC,OAA0B,GAAgC,KAAA;AACzD,IAAA,MAAM,EAAE,YAAA,EAAc,cAAe,EAAA,GAAI,mBAAmB,KAAK,CAAA;AACjE,IAAM,MAAA;AAAA,MACJ,KAAA;AAAA,MACA,cAAiB,GAAA,KAAA;AAAA,MACjB,OAAA;AAAA,MACA,SAAA;AAAA,MACA,OAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,KAAA;AAAA,MACA,IAAA;AAAA,MACA,IAAA;AAAA,MACA,IAAA;AAAA,MACA,GAAG;AAAA,KACD,GAAA,cAAA;AAEJ,IAAA,MAAM,CAAC,SAAW,EAAA,YAAY,CAAI,GAAA,QAAA,CAAS,WAAW,cAAc,CAAA;AAEpE,IAAM,MAAA,cAAA,GAAiB,CAAC,CAAqC,KAAA;AAC3D,MAAI,IAAA,OAAO,YAAY,WAAa,EAAA;AAClC,QAAA,YAAA,CAAa,CAAC,SAAS,CAAA;AACvB,QAAA,QAAA,GAAW,GAAG,EAAE,OAAA,EAAS,CAAC,SAAA,EAAW,OAAO,CAAA;AAAA;AAE9C,MAAA,OAAA,GAAU,CAAC,CAAA;AAAA,KACb;AAEA,IAAA,SAAA,CAAU,MAAM;AACd,MAAI,IAAA,OAAO,YAAY,WAAa,EAAA;AACpC,MAAA,YAAA,CAAa,OAAO,CAAA;AAAA,KACtB,EAAG,CAAC,OAAO,CAAC,CAAA;AAEZ,IAAA,MAAM,IAAO,GAAA;AAAA,MACX,QAAA,EAAU,gBAAiB,CAAA,KAAA,CAAM,QAAQ,CAAA;AAAA,MACzC,IAAA;AAAA,MACA,IAAA;AAAA,MACA,KAAA;AAAA,MACA;AAAA,KACF;AAEA,IAAA,MAAM,aAAa,aAAc,CAAA;AAAA,MAC/B,IAAM,EAAA,cAAA;AAAA,MACN,IAAA;AAAA,MACA,WAAa,EAAA,CAAC,CAAC,KAAA,CAAM,kBAAkB;AAAA,KACxC,CAAA;AAED,IAAA,MAAM,sBAAyB,GAAA,EAAA,CAAG,SAAW,EAAA,MAAA,CAAO,eAAe,CAAC,CAAA;AAEpE,IAAA,MAAM,aAAgB,GAAA;AAAA,MACpB,GAAG,KAAA;AAAA,MACH,GAAG;AAAA,KACL;AACA,IACE,uBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,kBAAkB,EAAA,UAAA;AAAA,QAClB,UAAS,EAAA,eAAA;AAAA,QACT,cAAc,EAAA,SAAA;AAAA,QACd,OAAS,EAAA,cAAA;AAAA,QACT,SAAW,EAAA,sBAAA;AAAA,QACX,KAAA;AAAA,QACA,KAAO,EAAA,aAAA;AAAA,QACP,IAAA;AAAA,QACA,IAAA;AAAA,QACA,IAAA;AAAA,QACA,GAAA;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA;AAGN;AAEA,YAAA,CAAa,WAAc,GAAA,cAAA;;;;"}
+{"version":3,"file":"ButtonToggle-PCeSG-5D.js","sources":["../src/components/ButtonToggle/ButtonToggle.tsx"],"sourcesContent":["import {\n  forwardRef,\n  KeyboardEvent,\n  MouseEvent,\n  Ref,\n  useEffect,\n  useState,\n} from \"react\";\nimport { useTrackingId } from \"../../hooks\";\nimport { DataTrackingId } from \"../../types\";\nimport { Button, ButtonProps } from \"../Button/Button\";\nimport { childrenToString } from \"../../internal/functions\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\n\nimport cx from \"classnames\";\nimport styles from \"../Button/Button.module.scss\";\n\nexport type ButtonToggleState = {\n  pressed: boolean;\n  value?: string;\n};\n\n/**\n * Props for the ButtonToggle component\n * @extends Omit<ButtonProps, \"appearance\" | \"loading\">\n */\nexport type ButtonToggleProps = Omit<ButtonProps, \"appearance\" | \"loading\"> & {\n  /**\n   * The default pressed(selected) state of the toggle button.\n   * @default false\n   */\n  defaultChecked?: boolean;\n\n  /**\n   * The controlled pressed(selected) state of the toggle button.\n   */\n  checked?: boolean;\n\n  /**\n   * The value of the toggle button.\n   */\n  value?: string;\n\n  /**\n   * Callback for when pressed(selected) changes.\n   */\n  onChange?: (\n    e: MouseEvent<HTMLButtonElement> | KeyboardEvent<HTMLButtonElement>,\n    state: ButtonToggleState,\n  ) => void;\n} &\n  /**\n   * Data tracking id\n   */\n  DataTrackingId;\n\n/**\n * ButtonToggle component for creating toggleable button states.\n *\n * Features:\n * - Supports both controlled and uncontrolled state management\n * - Toggle state with pressed/selected visual feedback\n * - Full accessibility support with aria-pressed attribute\n * - Callback support for state changes\n * - Supports layout utilities for positioning and spacing\n * - Inherits all button features except appearance and loading\n * - Flexible content with text and/or icons\n * - Keyboard interaction support\n * - Value association for form-like behavior\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <ButtonToggle\n *   defaultChecked={false}\n *   onChange={(e, state) => console.log('Toggle state:', state.pressed)}\n * >\n *   Toggle Me\n * </ButtonToggle>\n */\nexport const ButtonToggle = forwardRef(\n  (props: ButtonToggleProps, ref: Ref<HTMLButtonElement>) => {\n    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n    const {\n      value,\n      defaultChecked = false,\n      checked,\n      className,\n      onClick,\n      onChange,\n      onKeyDown,\n      style,\n      icon,\n      size,\n      type,\n      ...rest\n    } = componentProps;\n\n    const [isPressed, setIsPressed] = useState(checked ?? defaultChecked);\n\n    const onClickHandler = (e: MouseEvent<HTMLButtonElement>) => {\n      if (typeof checked === \"undefined\") {\n        setIsPressed(!isPressed);\n        onChange?.(e, { pressed: !isPressed, value });\n      }\n      onClick?.(e);\n    };\n\n    useEffect(() => {\n      if (typeof checked === \"undefined\") return;\n      setIsPressed(checked);\n    }, [checked]);\n\n    const data = {\n      children: childrenToString(props.children),\n      icon,\n      size,\n      value,\n      type,\n    };\n\n    const trackingId = useTrackingId({\n      name: \"ButtonToggle\",\n      data,\n      hasOverride: !!props[\"data-tracking-id\"],\n    });\n\n    const ButtonToggleClassNames = cx(className, styles[\"button-toggle\"]);\n\n    const styleCombined = {\n      ...style,\n      ...layoutStyles,\n    };\n    return (\n      <Button\n        data-tracking-id={trackingId}\n        data-anv=\"button-toggle\"\n        aria-pressed={isPressed}\n        onClick={onClickHandler}\n        className={ButtonToggleClassNames}\n        value={value}\n        style={styleCombined}\n        icon={icon}\n        size={size}\n        type={type}\n        ref={ref}\n        {...rest}\n      />\n    );\n  },\n);\n\nButtonToggle.displayName = \"ButtonToggle\";\n"],"names":[],"mappings":";;;;;;;;;AA+EO,MAAM,YAAA,GAAe,UAAA;AAAA,EAC1B,CAAC,OAA0B,GAAA,KAAgC;AACzD,IAAA,MAAM,EAAE,YAAA,EAAc,cAAA,EAAe,GAAI,mBAAmB,KAAK,CAAA;AACjE,IAAA,MAAM;AAAA,MACJ,KAAA;AAAA,MACA,cAAA,GAAiB,KAAA;AAAA,MACjB,OAAA;AAAA,MACA,SAAA;AAAA,MACA,OAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,KAAA;AAAA,MACA,IAAA;AAAA,MACA,IAAA;AAAA,MACA,IAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,cAAA;AAEJ,IAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAI,QAAA,CAAS,WAAW,cAAc,CAAA;AAEpE,IAAA,MAAM,cAAA,GAAiB,CAAC,CAAA,KAAqC;AAC3D,MAAA,IAAI,OAAO,YAAY,WAAA,EAAa;AAClC,QAAA,YAAA,CAAa,CAAC,SAAS,CAAA;AACvB,QAAA,QAAA,GAAW,GAAG,EAAE,OAAA,EAAS,CAAC,SAAA,EAAW,OAAO,CAAA;AAAA,MAC9C;AACA,MAAA,OAAA,GAAU,CAAC,CAAA;AAAA,IACb,CAAA;AAEA,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,OAAO,YAAY,WAAA,EAAa;AACpC,MAAA,YAAA,CAAa,OAAO,CAAA;AAAA,IACtB,CAAA,EAAG,CAAC,OAAO,CAAC,CAAA;AAEZ,IAAA,MAAM,IAAA,GAAO;AAAA,MACX,QAAA,EAAU,gBAAA,CAAiB,KAAA,CAAM,QAAQ,CAAA;AAAA,MACzC,IAAA;AAAA,MACA,IAAA;AAAA,MACA,KAAA;AAAA,MACA;AAAA,KACF;AAEA,IAAA,MAAM,aAAa,aAAA,CAAc;AAAA,MAC/B,IAAA,EAAM,cAAA;AAAA,MACN,IAAA;AAAA,MACA,WAAA,EAAa,CAAC,CAAC,KAAA,CAAM,kBAAkB;AAAA,KACxC,CAAA;AAED,IAAA,MAAM,sBAAA,GAAyB,EAAA,CAAG,SAAA,EAAW,MAAA,CAAO,eAAe,CAAC,CAAA;AAEpE,IAAA,MAAM,aAAA,GAAgB;AAAA,MACpB,GAAG,KAAA;AAAA,MACH,GAAG;AAAA,KACL;AACA,IAAA,uBACE,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,kBAAA,EAAkB,UAAA;AAAA,QAClB,UAAA,EAAS,eAAA;AAAA,QACT,cAAA,EAAc,SAAA;AAAA,QACd,OAAA,EAAS,cAAA;AAAA,QACT,SAAA,EAAW,sBAAA;AAAA,QACX,KAAA;AAAA,QACA,KAAA,EAAO,aAAA;AAAA,QACP,IAAA;AAAA,QACA,IAAA;AAAA,QACA,IAAA;AAAA,QACA,GAAA;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;AAEA,YAAA,CAAa,WAAA,GAAc,cAAA;;;;"}

package/dist/ButtonToggle.js

@@ -1,2 +1,2 @@
-export { B as ButtonToggle, B as default } from './ButtonToggle-pSwg7NvT.js';
+export { B as ButtonToggle, B as default } from './ButtonToggle-PCeSG-5D.js';
 //# sourceMappingURL=ButtonToggle.js.map