@servicetitan/anvil2 2.9.1 → 3.0.0

package/dist/Stepper.css

@@ -1,247 +1,188 @@
-@layer starter, reset, base, state, application;
-@layer reset {
-  ._stepper-list_qeq4d_2 {
-    all: unset;
-    font-family: var(--font-family-base, "Nunito Sans", sans-serif);
-    font-size: 100%;
-    color: var(--foreground-color, #141414);
-    margin: 0;
-    padding: 0;
-    border-style: none;
-    border-width: 0;
-    border-color: transparent;
-    box-sizing: border-box;
-    display: flex;
-  }
-}
-@layer base {
-  ._stepper-list_qeq4d_2 {
-    justify-content: flex-start;
-    position: relative;
-    gap: 0.5rem;
-    flex-direction: column;
-    font-size: 1rem;
-  }
-  ._stepper-steps_qeq4d_24 {
-    justify-content: flex-start;
-    position: relative;
-    gap: 0.5rem;
-    flex-direction: column;
-    flex-direction: row;
-    display: flex;
-    font-size: 1rem;
-  }
-  ._label_qeq4d_33 {
-    font-weight: bold;
-  }
-}
-@layer state {
-  @container stepper (width > 768px) {
-    ._label_qeq4d_33 {
-      display: none;
-    }
-  }
-}@layer starter, reset, base, state, application;
-@layer reset {
-  ._stepper-step_txl4u_2 {
-    all: unset;
-    font-family: var(--font-family-base, "Nunito Sans", sans-serif);
-    font-size: 100%;
-    color: var(--foreground-color, #141414);
-    margin: 0;
-    padding: 0;
-    border-style: none;
-    border-width: 0;
-    border-color: transparent;
-    box-sizing: border-box;
-    display: flex;
-  }
-}
-@layer base {
-  ._stepper-step_txl4u_2 {
-    flex-direction: column;
-    flex-basis: 100%;
-    gap: 0.5rem;
-    font-weight: normal;
-    font-size: 1rem;
-    border-radius: 0.375rem;
-    transition: background-color 100ms cubic-bezier(0, 0, 0.4, 1), outline 100ms cubic-bezier(0, 0, 0.4, 1);
-  }
-  ._stepper-step_txl4u_2 ._bar_txl4u_26 {
-    margin-block-start: 0.125rem;
-    border-radius: 1.5rem;
-    height: 0.5rem;
-    background-color: var(--background-color-stronger, #eeeeee);
-    overflow: hidden;
-    flex-shrink: 0;
-  }
-  ._stepper-step_txl4u_2 ._bar_txl4u_26::before {
-    content: "";
-    display: block;
-    height: 100%;
-    width: 0;
-    background-color: var(--status-color-info, #0265DC);
-    transition: width 100ms cubic-bezier(0, 0, 0.4, 1);
-  }
-  ._stepper-step_txl4u_2 ._label_txl4u_42 {
-    display: flex;
-    gap: 0.5rem;
-    inset-block-end: 0;
-    inset-inline-start: 0;
+.anvil2{@layer starter, reset, base, state, application;._stepper-list_1k984_1 {
+  all: unset;
+  font-family: var(--a2-font-family-base, "Nunito Sans", sans-serif);
+  font-size: 100%;
+  color: inherit;
+  margin: 0;
+  padding: 0;
+  border-style: none;
+  border-width: 0;
+  border-color: transparent;
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  font-size: var(--a2-typography-label-size-large, var(--a2-font-size-400, 1rem));
+  gap: var(--a2-size-2, 0.5rem);
+  justify-content: flex-start;
+  position: relative;
+}._stepper-steps_1k984_20 {
+  display: flex;
+  flex-direction: row;
+  font-size: var(--a2-typography-label-size-large, var(--a2-font-size-400, 1rem));
+  gap: var(--a2-size-2, 0.5rem);
+  justify-content: flex-start;
+  position: relative;
+}._label_1k984_29 {
+  font-weight: bold;
+}@container stepper (width > 768px) {
+  ._label_1k984_29 {
     display: none;
   }
-  ._stepper-step_txl4u_2 ._label_txl4u_42 ._circle_txl4u_49 {
-    flex-shrink: 0;
-    margin-top: 0.125rem;
-    box-sizing: border-box;
-    width: 1rem;
-    height: 1rem;
-    border-radius: 100%;
-    border: 0.0625rem dashed var(--background-color-strongest, #bcbcbd);
-    background: var(--background-color, #ffffff);
-    color: var(--foreground-color-on-primary, #ffffff);
-    justify-content: center;
-    align-items: center;
-  }
-  ._stepper-step_txl4u_2 ._label_txl4u_42 ._circle_txl4u_49 svg {
-    width: 0.75rem;
-    height: 0.75rem;
-  }
 }
-@layer state {
-  ._stepper-step_txl4u_2[aria-selected=true] ._bar_txl4u_26::before {
-    width: 1.5rem;
-    transition: width 100ms cubic-bezier(0, 0, 0.4, 1) 100ms;
-  }
-  ._stepper-step_txl4u_2[aria-selected=true] ._label_txl4u_42 ._circle_txl4u_49 {
-    background-color: var(--background-color, #ffffff);
-    border-color: var(--status-color-info, #0265DC);
-    border-style: solid;
-  }
-  ._stepper-step_txl4u_2[aria-selected=true] ._label_txl4u_42 ._circle_txl4u_49 svg {
-    display: none;
-  }
-  ._stepper-step_txl4u_2[aria-selected=true]:not(._all-completed_txl4u_80) {
-    font-weight: bold;
-  }
-  ._stepper-step_txl4u_2[data-completed=true]:not(._all-completed_txl4u_80)._can-navigate_txl4u_83:not([aria-selected=true]) {
-    cursor: pointer;
-  }
-  ._stepper-step_txl4u_2[data-completed=true]:not(._all-completed_txl4u_80)._can-navigate_txl4u_83:not([aria-selected=true]) ._label_txl4u_42 {
-    text-decoration: underline;
-    color: var(--foreground-color-primary, #0265DC);
-  }
-  ._stepper-step_txl4u_2[data-completed=true] ._label_txl4u_42 ._circle_txl4u_49, ._stepper-step_txl4u_2._all-completed_txl4u_80 ._label_txl4u_42 ._circle_txl4u_49 {
-    background-color: var(--status-color-info, #0265DC);
-    border-color: var(--status-color-info, #0265DC);
-    border-style: solid;
-  }
-  ._stepper-step_txl4u_2[data-completed=true] ._label_txl4u_42 ._circle_txl4u_49 svg, ._stepper-step_txl4u_2._all-completed_txl4u_80 ._label_txl4u_42 ._circle_txl4u_49 svg {
-    display: block;
-  }
-  ._stepper-step_txl4u_2[data-completed=true] ._bar_txl4u_26::before, ._stepper-step_txl4u_2._all-completed_txl4u_80 ._bar_txl4u_26::before {
-    width: 100%;
-    transition: width 100ms cubic-bezier(0, 0, 0.4, 1);
-  }
-  ._stepper-step_txl4u_2:not([aria-selected=true]) ._label_txl4u_42 {
-    display: none;
-  }
-  ._stepper-step_txl4u_2:focus-visible ._bar_txl4u_26, ._stepper-step_txl4u_2[data-interactive=focus-visible] ._bar_txl4u_26 {
-    outline-offset: 0.125rem;
-    outline-width: 0.125rem;
-    outline-style: solid;
-    outline-color: var(--focus-ring-color, #0265DC);
-    border-radius: 0.375rem;
-  }
-  @container stepper (width > 768px) {
-    ._stepper-step_txl4u_2 ._bar_txl4u_26 {
-      height: 0.25rem;
-    }
-    ._stepper-step_txl4u_2 ._label_txl4u_42 {
-      display: flex;
-      position: static;
-    }
-    ._stepper-step_txl4u_2 ._label_txl4u_42 ._circle_txl4u_49 {
-      display: inline-flex;
-    }
-    ._stepper-step_txl4u_2[aria-selected=true] ._bar_txl4u_26 {
-      outline: none;
-    }
-    ._stepper-step_txl4u_2:not([aria-selected=true]) ._label_txl4u_42 {
-      display: flex;
-    }
-    ._stepper-step_txl4u_2:focus-visible ._bar_txl4u_26, ._stepper-step_txl4u_2[data-interactive=focus-visible] ._bar_txl4u_26 {
-      outline: none;
-    }
-    ._stepper-step_txl4u_2:focus-visible ._label_txl4u_42, ._stepper-step_txl4u_2[data-interactive=focus-visible] ._label_txl4u_42 {
-      outline-offset: 0.125rem;
-      outline-width: 0.125rem;
-      outline-style: solid;
-      outline-color: var(--focus-ring-color, #0265DC);
-      border-radius: 0.375rem;
-    }
-  }
-}@layer starter, reset, base, state, application;
-@layer reset {
-  ._stepper-panel_4h550_2 {
-    all: unset;
-    font-family: var(--font-family-base, "Nunito Sans", sans-serif);
-    font-size: 100%;
-    color: var(--foreground-color, #141414);
-    margin: 0;
-    padding: 0;
-    border-style: none;
-    border-width: 0;
-    border-color: transparent;
-    box-sizing: border-box;
-    display: flex;
+}.anvil2{@layer starter, reset, base, state, application;._stepper-step_e10de_1 {
+  --a2-mod-stepper-step-circle-foreground-color: var(--a2-stepper-step-default-circle-icon-color, var(--a2-foreground-color-on-primary, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
+  --a2-mod-stepper-step-fill-color: var(--a2-stepper-step-default-background-color, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+  --a2-mod-stepper-step-focus-ring-color: var(--a2-stepper-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+  --a2-mod-stepper-step-track-color: var(--a2-stepper-step-default-track-color, var(--a2-background-color-stronger, light-dark(var(--a2-color-neutral-50, #eeeeee), var(--a2-color-neutral-700, #404040))));
+  --a2-mod-icon-height: var(--a2-size-3, 0.75rem);
+  --a2-mod-icon-width: var(--a2-size-3, 0.75rem);
+  all: unset;
+  font-family: var(--a2-font-family-base, "Nunito Sans", sans-serif);
+  font-size: 100%;
+  color: inherit;
+  margin: 0;
+  padding: 0;
+  border-style: none;
+  border-width: 0;
+  border-color: transparent;
+  box-sizing: border-box;
+  display: flex;
+  border-radius: var(--a2-border-radius-medium, var(--a2-radius-2, 0.375rem));
+  flex-basis: 100%;
+  flex-direction: column;
+  font-size: var(--a2-typography-label-size-large, var(--a2-font-size-400, 1rem));
+  font-weight: normal;
+  gap: var(--a2-size-2, 0.5rem);
+  transition: background-color var(--a2-duration-fast, 100ms) var(--a2-transition-ease-out, cubic-bezier(0, 0, 0.4, 1)), outline var(--a2-duration-fast, 100ms) var(--a2-transition-ease-out, cubic-bezier(0, 0, 0.4, 1));
+}._bar_e10de_28 {
+  background-color: var(--a2-mod-stepper-step-track-color);
+  border-radius: var(--a2-mod-stepper-step-bar-border-radius, var(--a2-border-radius-xlarge, var(--a2-radius-8, 1.5rem)));
+  flex-shrink: 0;
+  height: var(--a2-mod-stepper-step-bar-height, var(--a2-size-2, 0.5rem));
+  margin-block-start: var(--a2-size-half, 0.125rem);
+  outline: var(--a2-mod-stepper-step-bar-outline, none);
+  outline-offset: var(--a2-mod-stepper-step-bar-outline-offset, 0);
+  overflow: hidden;
+}._bar_e10de_28::before {
+  background-color: var(--a2-mod-stepper-step-fill-color);
+  content: "";
+  display: block;
+  height: 100%;
+  transition: width var(--a2-duration-fast, 100ms) var(--a2-transition-ease-out, cubic-bezier(0, 0, 0.4, 1)) var(--a2-mod-stepper-step-bar-transition-delay, 0s);
+  width: var(--a2-mod-stepper-step-bar-width, 0);
+}._label_e10de_47 {
+  border-radius: var(--a2-mod-stepper-step-label-border-radius, 0);
+  color: var(--a2-mod-stepper-step-label-color, inherit);
+  display: var(--a2-mod-stepper-step-label-display, none);
+  gap: var(--a2-size-2, 0.5rem);
+  inset-block-end: 0;
+  inset-inline-start: 0;
+  outline: var(--a2-mod-stepper-step-label-outline, none);
+  outline-offset: var(--a2-mod-stepper-step-label-outline-offset, 0);
+  position: static;
+  -webkit-text-decoration: var(--a2-mod-stepper-step-label-text-decoration, none);
+          text-decoration: var(--a2-mod-stepper-step-label-text-decoration, none);
+}._circle_e10de_60 {
+  align-items: center;
+  background-color: var(--a2-mod-stepper-step-circle-background-color, var(--a2-stepper-step-default-circle-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a)))));
+  border: var(--a2-size-quarter, 0.0625rem) var(--a2-mod-stepper-step-circle-border-style, dashed) var(--a2-mod-stepper-step-circle-border-color, var(--a2-stepper-step-default-circle-border-color, var(--a2-border-color-default, light-dark(var(--a2-color-neutral-400, #8b8b8b), var(--a2-color-neutral-600, #545454)))));
+  border-radius: var(--a2-border-radius-circular, 100%);
+  box-sizing: border-box;
+  color: var(--a2-mod-stepper-step-circle-foreground-color);
+  display: var(--a2-mod-stepper-step-circle-display, none);
+  flex-shrink: 0;
+  height: var(--a2-size-4, 1rem);
+  justify-content: center;
+  margin-block-start: var(--a2-size-half, 0.125rem);
+  width: var(--a2-size-4, 1rem);
+}._circle_e10de_60 svg {
+  display: var(--a2-mod-stepper-step-check-icon-display, none);
+}._stepper-step_e10de_1[aria-selected=true] {
+  --a2-mod-stepper-step-bar-transition-delay: var(--a2-duration-fast, 100ms);
+  --a2-mod-stepper-step-bar-width: var(--a2-size-6, 1.5rem);
+  --a2-mod-stepper-step-circle-border-color: var(--a2-stepper-step-current-circle-border-color, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+  --a2-mod-stepper-step-circle-border-style: solid;
+}._stepper-step_e10de_1[aria-selected=true]:not(._all-completed_e10de_85) {
+  font-weight: bold;
+}._can-navigate_e10de_89[data-completed=true]:not(._all-completed_e10de_85):not([aria-selected=true]) {
+  --a2-mod-stepper-step-label-color: var(--a2-foreground-color-primary, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)));
+  --a2-mod-stepper-step-label-text-decoration: underline;
+  cursor: pointer;
+}._stepper-step_e10de_1[data-completed=true],
+._stepper-step_e10de_1._all-completed_e10de_85 {
+  --a2-mod-stepper-step-bar-transition-delay: 0s;
+  --a2-mod-stepper-step-bar-width: 100%;
+  --a2-mod-stepper-step-check-icon-display: block;
+  --a2-mod-stepper-step-circle-background-color: var(--a2-stepper-step-complete-circle-background-color, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+  --a2-mod-stepper-step-circle-border-color: var(--a2-stepper-step-complete-circle-border-color, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff))));
+  --a2-mod-stepper-step-circle-border-style: solid;
+}._stepper-step_e10de_1:focus-visible,
+._stepper-step_e10de_1[data-interactive=focus-visible] {
+  --a2-mod-stepper-step-bar-border-radius: var(--a2-border-radius-medium, var(--a2-radius-2, 0.375rem));
+  --a2-mod-stepper-step-bar-outline: var(--a2-size-half, 0.125rem) solid
+    var(--a2-mod-stepper-step-focus-ring-color);
+  --a2-mod-stepper-step-bar-outline-offset: var(--a2-size-half, 0.125rem);
+}@container stepper (width > 768px) {
+  ._stepper-step_e10de_1 {
+    --a2-mod-stepper-step-bar-height: var(--a2-size-1, 0.25rem);
+    --a2-mod-stepper-step-circle-display: inline-flex;
+    --a2-mod-stepper-step-label-display: flex;
+  }
+  ._stepper-step_e10de_1:focus-visible,
+  ._stepper-step_e10de_1[data-interactive=focus-visible] {
+    --a2-mod-stepper-step-bar-border-radius: var(--a2-border-radius-xlarge, var(--a2-radius-8, 1.5rem));
+    --a2-mod-stepper-step-bar-outline: none;
+    --a2-mod-stepper-step-bar-outline-offset: 0;
+    --a2-mod-stepper-step-label-border-radius: var(--a2-border-radius-medium, var(--a2-radius-2, 0.375rem));
+    --a2-mod-stepper-step-label-outline: var(--a2-size-half, 0.125rem) solid
+      var(--a2-mod-stepper-step-focus-ring-color);
+    --a2-mod-stepper-step-label-outline-offset: var(--a2-size-half, 0.125rem);
   }
 }
-@layer base {
-  ._stepper-panel_4h550_2 {
-    min-height: 0;
-    flex-grow: 1;
-    font-size: 1rem;
-    font-size: 1rem;
-  }
+}.anvil2{@layer starter, reset, base, state, application;._stepper-panel_5y7j0_1 {
+  --a2-mod-stepper-focus-ring-color: var(--a2-stepper-focus-ring-color, var(--a2-focus-ring-color-default, var(--a2-status-color-info, light-dark(var(--a2-color-blue-600, #0265dc), var(--a2-color-blue-300, #70b1ff)))));
+  all: unset;
+  font-family: var(--a2-font-family-base, "Nunito Sans", sans-serif);
+  font-size: 100%;
+  color: inherit;
+  margin: 0;
+  padding: 0;
+  border-style: none;
+  border-width: 0;
+  border-color: transparent;
+  box-sizing: border-box;
+  display: flex;
+  flex-grow: 1;
+  font-size: var(--a2-typography-paragraph-size-default, var(--a2-font-size-400, 1rem));
+  min-height: 0;
+  opacity: 1;
+}._stepper-panel_5y7j0_1:focus-visible {
+  border-radius: var(--a2-border-radius-medium, var(--a2-radius-2, 0.375rem));
+  outline-color: var(--a2-mod-stepper-focus-ring-color);
+  outline-offset: var(--a2-size-half, 0.125rem);
+  outline-style: solid;
+  outline-width: var(--a2-size-half, 0.125rem);
 }
-@layer state {
-  ._stepper-panel_4h550_2 {
-    opacity: 1;
-  }
-  ._stepper-panel_4h550_2:focus-visible {
-    outline-offset: 0.125rem;
-    outline-width: 0.125rem;
-    outline-style: solid;
-    outline-color: var(--focus-ring-color, #0265DC);
-    border-radius: 0.375rem;
-  }
-}@layer starter, reset, base, state, application;
-@layer reset {
-  ._stepper_1czb4_2 {
-    all: unset;
-    font-family: var(--font-family-base, "Nunito Sans", sans-serif);
-    font-size: 100%;
-    color: var(--foreground-color, #141414);
-    margin: 0;
-    padding: 0;
-    border-style: none;
-    border-width: 0;
-    border-color: transparent;
-    box-sizing: border-box;
-    display: flex;
-  }
+}.anvil2{@layer starter, reset, base, state, application;._stepper_1b3pn_1 {
+  all: unset;
+  font-family: var(--a2-font-family-base, "Nunito Sans", sans-serif);
+  font-size: 100%;
+  color: inherit;
+  margin: 0;
+  padding: 0;
+  border-style: none;
+  border-width: 0;
+  border-color: transparent;
+  box-sizing: border-box;
+  display: flex;
+  background-color: inherit;
+  container-name: stepper;
+  container-type: inline-size;
+  flex-direction: column;
+  font-size: var(--a2-typography-label-size-large, var(--a2-font-size-400, 1rem));
+  gap: var(--a2-size-4, 1rem);
+  max-width: 100%;
+  padding-block-start: var(--a2-size-1, 0.25rem);
+  transition: height var(--a2-duration-default, 200ms) var(--a2-transition-ease-out, cubic-bezier(0, 0, 0.4, 1));
 }
-@layer base {
-  ._stepper_1czb4_2 {
-    flex-direction: column;
-    gap: 1rem;
-    padding-block-start: 0.25rem;
-    max-width: 100%;
-    background-color: inherit;
-    container-type: inline-size;
-    container-name: stepper;
-    font-size: 1rem;
-    transition: height 200ms cubic-bezier(0, 0, 0.4, 1);
-  }
 }

package/dist/Stepper.js

@@ -1,2 +1,2 @@
-export { S as Stepper, S as default } from './Stepper-Dt2xAXth.js';
+export { S as Stepper, S as default } from './Stepper-CYY64NU1.js';
 //# sourceMappingURL=Stepper.js.map

package/dist/{Switch-C84MBChG.js → Switch-DeBu4Ucg.js}

@@ -1,23 +1,26 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { forwardRef, useId } from 'react';
 import { S as SvgCheck } from './check-Cf67OWrZ.js';
-import { I as Icon } from './Icon-DuIlne4x.js';
-import { F as Flex } from './Flex-WyyZm1bf.js';
-import { A as AiMark } from './AiMark-DR-w6Nbm.js';
+import { I as Icon } from './Icon-BMMbp40n.js';
+import { F as Flex } from './Flex-DOUtHiPi.js';
+import { A as AiMark } from './AiMark-B1-M3ZgP.js';
 import { c as cx } from './index-De1g9FRV.js';
-import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-DMDdfIah.js';
+import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-CB_zHDbW.js';
 import { c as childrenToString } from './childrenToString-Bz9MqbHb.js';
 import { useTrackingId } from './useTrackingId.js';
-import { H as Helper } from './Helper-B_FIOlhy.js';
+import { H as Helper } from './Helper-DtDeaYTn.js';
 
-import './Switch.css';const toggle = "_toggle_142h4_23";
-const indicator = "_indicator_142h4_37";
-const check = "_check_142h4_51";
+import './Switch.css';const input = "_input_bpqzm_33";
+const toggle = "_toggle_bpqzm_42";
+const thumb = "_thumb_bpqzm_57";
+const check = "_check_bpqzm_77";
 const styles = {
-	"switch": "_switch_142h4_2",
+	"switch": "_switch_bpqzm_1",
+	input: input,
 	toggle: toggle,
-	indicator: indicator,
-	check: check
+	thumb: thumb,
+	check: check,
+	"ai-mark-icon": "_ai-mark-icon_bpqzm_136"
 };
 
 const Switch = forwardRef(
@@ -61,6 +64,7 @@ const Switch = forwardRef(
       /* @__PURE__ */ jsx(
         "input",
         {
+          className: styles["input"],
           "data-tracking-id": trackingId,
           "data-anv": "switch",
           ref,
@@ -75,7 +79,7 @@ const Switch = forwardRef(
           ...rest
         }
       ),
-      /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: styles["toggle"], children: /* @__PURE__ */ jsx("span", { className: styles["indicator"], children: /* @__PURE__ */ jsx(Icon, { svg: SvgCheck, className: styles["check"] }) }) }),
+      /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: styles["toggle"], children: /* @__PURE__ */ jsx("span", { className: styles["thumb"], children: /* @__PURE__ */ jsx(Icon, { svg: SvgCheck, className: styles["check"] }) }) }),
       label || description ? /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 1, children: [
         /* @__PURE__ */ jsxs(Flex, { alignItems: "center", gap: 2, children: [
           label && label,
@@ -96,4 +100,4 @@ const Switch = forwardRef(
 Switch.displayName = "Switch";
 
 export { Switch as S };
-//# sourceMappingURL=Switch-C84MBChG.js.map
+//# sourceMappingURL=Switch-DeBu4Ucg.js.map

package/dist/{Switch-C84MBChG.js.map → Switch-DeBu4Ucg.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Switch-C84MBChG.js","sources":["../src/components/Switch/Switch.tsx"],"sourcesContent":["import {\n  ChangeEvent,\n  ComponentPropsWithoutRef,\n  ReactElement,\n  Ref,\n  forwardRef,\n  useId,\n} from \"react\";\nimport { useTrackingId } from \"../../hooks\";\nimport {\n  AiMarkWithTooltipOrPopoverProps,\n  DataTrackingId,\n  LayoutUtilProps,\n} from \"../../types\";\nimport { childrenToString } from \"../../internal/functions\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\nimport Check from \"@servicetitan/hammer-icon/mdi/round/check.svg\";\nimport Icon from \"../Icon\";\nimport Flex from \"../Flex\";\nimport { Helper } from \"../../internal/components\";\nimport { AiMark } from \"../../components/AiMark\";\n\nimport cx from \"classnames\";\nimport styles from \"./Switch.module.scss\";\n\n/**\n * State object returned by the Switch onChange callback\n */\nexport type SwitchState = {\n  /**\n   * Whether the switch is currently checked\n   */\n  checked: boolean;\n  /**\n   * The value of the switch input\n   */\n  value?: string | number | readonly string[];\n};\n\n/**\n * Props for the Switch component\n * @extends ComponentPropsWithoutRef<\"input\">\n * @extends LayoutUtilProps\n */\nexport type SwitchProps = Omit<ComponentPropsWithoutRef<\"input\">, \"onChange\"> &\n  LayoutUtilProps & {\n    /**\n     * Callback when switch is changed.\n     * @param e Change event object\n     * @param state Current switch state with checked status and value\n     */\n    onChange?: (e: ChangeEvent<HTMLInputElement>, state: SwitchState) => void;\n\n    /**\n     * Label for the switch.\n     * @remarks This should either be a string or have text content inside for accessibility\n     */\n    label?: ReactElement | string;\n\n    /**\n     * AI mark configuration to display next to the label.\n     * Can be a boolean to show a simple AI mark, or an object with tooltip/popover configuration.\n     */\n    labelAiMark?: AiMarkWithTooltipOrPopoverProps[\"aiMark\"];\n\n    /**\n     * Description text to display below the label\n     */\n    description?: string;\n  } & DataTrackingId;\n\n/**\n * Switch component for toggling between on/off states.\n *\n * Features:\n * - Toggle switch with smooth animations\n * - Check icon indicator when active\n * - Accessible with proper ARIA roles and attributes\n * - Keyboard navigation support (Space/Enter)\n * - Controlled and uncontrolled state management\n * - Customizable label and styling\n * - Layout utilities for positioning and spacing\n * - Focus management with visible focus indicators\n * - Hover states and visual feedback\n * - Disabled state support\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Switch\n *   label=\"Enable notifications\"\n *   onChange={(e, state) => console.log('Switch toggled:', state.checked)}\n * />\n */\nexport const Switch = forwardRef(\n  (props: SwitchProps, ref: Ref<HTMLInputElement>) => {\n    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n    const {\n      label,\n      labelAiMark,\n      description,\n      className,\n      onChange,\n      checked,\n      defaultChecked,\n      value,\n      style,\n      \"aria-label\": ariaLabel,\n      ...rest\n    } = componentProps;\n\n    const helperUid = useId();\n\n    const onChangeHandler = (e: ChangeEvent<HTMLInputElement>) => {\n      onChange?.(e, { value, checked: e.target.checked });\n    };\n\n    const data = {\n      label: childrenToString(label),\n      ariaLabel: ariaLabel || \"Toggle option\",\n      ariaLabelledBy: rest[\"aria-labelledby\"],\n      value,\n    };\n\n    const trackingId = useTrackingId({\n      name: \"Switch\",\n      data,\n      hasOverride: !!rest[\"data-tracking-id\"],\n    });\n\n    const switchClassNames = cx(styles[\"switch\"], className);\n\n    const styleCombined = {\n      ...style,\n      ...layoutStyles,\n      alignItems: description ? \"flex-start\" : \"center\",\n    };\n\n    return (\n      <label className={switchClassNames} style={styleCombined}>\n        <input\n          data-tracking-id={trackingId}\n          data-anv=\"switch\"\n          ref={ref}\n          type=\"checkbox\"\n          role=\"switch\"\n          value={value}\n          aria-checked={checked ?? defaultChecked}\n          aria-label={label ? undefined : ariaLabel || \"Toggle option\"}\n          checked={checked}\n          defaultChecked={defaultChecked}\n          onChange={onChangeHandler}\n          {...rest}\n        />\n        <span aria-hidden className={styles[\"toggle\"]}>\n          <span className={styles[\"indicator\"]}>\n            <Icon svg={Check} className={styles[\"check\"]} />\n          </span>\n        </span>\n        {label || description ? (\n          <Flex direction=\"column\" gap={1}>\n            <Flex alignItems=\"center\" gap={2}>\n              {label && label}\n              {labelAiMark && (\n                <AiMark\n                  className={styles[\"ai-mark-icon\"]}\n                  type=\"gradient\"\n                  popoverOrTooltipConfig={\n                    typeof labelAiMark === \"object\" ? labelAiMark : undefined\n                  }\n                />\n              )}\n            </Flex>\n            {description && <Helper id={helperUid} description={description} />}\n          </Flex>\n        ) : null}\n      </label>\n    );\n  },\n);\n\nSwitch.displayName = \"Switch\";\n"],"names":["Check"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AA6FO,MAAM,MAAA,GAAS,UAAA;AAAA,EACpB,CAAC,OAAoB,GAAA,KAA+B;AAClD,IAAA,MAAM,EAAE,YAAA,EAAc,cAAA,EAAe,GAAI,mBAAmB,KAAK,CAAA;AACjE,IAAA,MAAM;AAAA,MACJ,KAAA;AAAA,MACA,WAAA;AAAA,MACA,WAAA;AAAA,MACA,SAAA;AAAA,MACA,QAAA;AAAA,MACA,OAAA;AAAA,MACA,cAAA;AAAA,MACA,KAAA;AAAA,MACA,KAAA;AAAA,MACA,YAAA,EAAc,SAAA;AAAA,MACd,GAAG;AAAA,KACL,GAAI,cAAA;AAEJ,IAAA,MAAM,YAAY,KAAA,EAAM;AAExB,IAAA,MAAM,eAAA,GAAkB,CAAC,CAAA,KAAqC;AAC5D,MAAA,QAAA,GAAW,GAAG,EAAE,KAAA,EAAO,SAAS,CAAA,CAAE,MAAA,CAAO,SAAS,CAAA;AAAA,IACpD,CAAA;AAEA,IAAA,MAAM,IAAA,GAAO;AAAA,MACX,KAAA,EAAO,iBAAiB,KAAK,CAAA;AAAA,MAC7B,WAAW,SAAA,IAAa,eAAA;AAAA,MACxB,cAAA,EAAgB,KAAK,iBAAiB,CAAA;AAAA,MACtC;AAAA,KACF;AAEA,IAAA,MAAM,aAAa,aAAA,CAAc;AAAA,MAC/B,IAAA,EAAM,QAAA;AAAA,MACN,IAAA;AAAA,MACA,WAAA,EAAa,CAAC,CAAC,IAAA,CAAK,kBAAkB;AAAA,KACvC,CAAA;AAED,IAAA,MAAM,gBAAA,GAAmB,EAAA,CAAG,MAAA,CAAO,QAAQ,GAAG,SAAS,CAAA;AAEvD,IAAA,MAAM,aAAA,GAAgB;AAAA,MACpB,GAAG,KAAA;AAAA,MACH,GAAG,YAAA;AAAA,MACH,UAAA,EAAY,cAAc,YAAA,GAAe;AAAA,KAC3C;AAEA,IAAA,uBACE,IAAA,CAAC,OAAA,EAAA,EAAM,SAAA,EAAW,gBAAA,EAAkB,OAAO,aAAA,EACzC,QAAA,EAAA;AAAA,sBAAA,GAAA;AAAA,QAAC,OAAA;AAAA,QAAA;AAAA,UACC,kBAAA,EAAkB,UAAA;AAAA,UAClB,UAAA,EAAS,QAAA;AAAA,UACT,GAAA;AAAA,UACA,IAAA,EAAK,UAAA;AAAA,UACL,IAAA,EAAK,QAAA;AAAA,UACL,KAAA;AAAA,UACA,gBAAc,OAAA,IAAW,cAAA;AAAA,UACzB,YAAA,EAAY,KAAA,GAAQ,MAAA,GAAY,SAAA,IAAa,eAAA;AAAA,UAC7C,OAAA;AAAA,UACA,cAAA;AAAA,UACA,QAAA,EAAU,eAAA;AAAA,UACT,GAAG;AAAA;AAAA,OACN;AAAA,sBACA,GAAA,CAAC,UAAK,aAAA,EAAW,IAAA,EAAC,WAAW,MAAA,CAAO,QAAQ,CAAA,EAC1C,QAAA,kBAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAW,OAAO,WAAW,CAAA,EACjC,QAAA,kBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,GAAA,EAAKA,QAAA,EAAO,WAAW,MAAA,CAAO,OAAO,CAAA,EAAG,CAAA,EAChD,CAAA,EACF,CAAA;AAAA,MACC,SAAS,WAAA,mBACR,IAAA,CAAC,QAAK,SAAA,EAAU,QAAA,EAAS,KAAK,CAAA,EAC5B,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,IAAA,EAAA,EAAK,UAAA,EAAW,QAAA,EAAS,GAAA,EAAK,CAAA,EAC5B,QAAA,EAAA;AAAA,UAAA,KAAA,IAAS,KAAA;AAAA,UACT,WAAA,oBACC,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,OAAO,cAAc,CAAA;AAAA,cAChC,IAAA,EAAK,UAAA;AAAA,cACL,sBAAA,EACE,OAAO,WAAA,KAAgB,QAAA,GAAW,WAAA,GAAc;AAAA;AAAA;AAEpD,SAAA,EAEJ,CAAA;AAAA,QACC,WAAA,oBAAe,GAAA,CAAC,MAAA,EAAA,EAAO,EAAA,EAAI,WAAW,WAAA,EAA0B;AAAA,OAAA,EACnE,CAAA,GACE;AAAA,KAAA,EACN,CAAA;AAAA,EAEJ;AACF;AAEA,MAAA,CAAO,WAAA,GAAc,QAAA;;;;"}
+{"version":3,"file":"Switch-DeBu4Ucg.js","sources":["../src/components/Switch/Switch.tsx"],"sourcesContent":["import {\n  ChangeEvent,\n  ComponentPropsWithoutRef,\n  ReactElement,\n  Ref,\n  forwardRef,\n  useId,\n} from \"react\";\nimport { useTrackingId } from \"../../hooks\";\nimport {\n  AiMarkWithTooltipOrPopoverProps,\n  DataTrackingId,\n  LayoutUtilProps,\n} from \"../../types\";\nimport { childrenToString } from \"../../internal/functions\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\nimport Check from \"@servicetitan/hammer-icon/mdi/round/check.svg\";\nimport Icon from \"../Icon\";\nimport Flex from \"../Flex\";\nimport { Helper } from \"../../internal/components\";\nimport { AiMark } from \"../../components/AiMark\";\n\nimport cx from \"classnames\";\nimport styles from \"./Switch.module.scss\";\n\n/**\n * State object returned by the Switch onChange callback\n */\nexport type SwitchState = {\n  /**\n   * Whether the switch is currently checked\n   */\n  checked: boolean;\n  /**\n   * The value of the switch input\n   */\n  value?: string | number | readonly string[];\n};\n\n/**\n * Props for the Switch component\n * @extends ComponentPropsWithoutRef<\"input\">\n * @extends LayoutUtilProps\n */\nexport type SwitchProps = Omit<ComponentPropsWithoutRef<\"input\">, \"onChange\"> &\n  LayoutUtilProps & {\n    /**\n     * Callback when switch is changed.\n     * @param e Change event object\n     * @param state Current switch state with checked status and value\n     */\n    onChange?: (e: ChangeEvent<HTMLInputElement>, state: SwitchState) => void;\n\n    /**\n     * Label for the switch.\n     * @remarks This should either be a string or have text content inside for accessibility\n     */\n    label?: ReactElement | string;\n\n    /**\n     * AI mark configuration to display next to the label.\n     * Can be a boolean to show a simple AI mark, or an object with tooltip/popover configuration.\n     */\n    labelAiMark?: AiMarkWithTooltipOrPopoverProps[\"aiMark\"];\n\n    /**\n     * Description text to display below the label\n     */\n    description?: string;\n  } & DataTrackingId;\n\n/**\n * Switch component for toggling between on/off states.\n *\n * Features:\n * - Toggle switch with smooth animations\n * - Check icon indicator when active\n * - Accessible with proper ARIA roles and attributes\n * - Keyboard navigation support (Space/Enter)\n * - Controlled and uncontrolled state management\n * - Customizable label and styling\n * - Layout utilities for positioning and spacing\n * - Focus management with visible focus indicators\n * - Hover states and visual feedback\n * - Disabled state support\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Switch\n *   label=\"Enable notifications\"\n *   onChange={(e, state) => console.log('Switch toggled:', state.checked)}\n * />\n */\nexport const Switch = forwardRef(\n  (props: SwitchProps, ref: Ref<HTMLInputElement>) => {\n    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n    const {\n      label,\n      labelAiMark,\n      description,\n      className,\n      onChange,\n      checked,\n      defaultChecked,\n      value,\n      style,\n      \"aria-label\": ariaLabel,\n      ...rest\n    } = componentProps;\n\n    const helperUid = useId();\n\n    const onChangeHandler = (e: ChangeEvent<HTMLInputElement>) => {\n      onChange?.(e, { value, checked: e.target.checked });\n    };\n\n    const data = {\n      label: childrenToString(label),\n      ariaLabel: ariaLabel || \"Toggle option\",\n      ariaLabelledBy: rest[\"aria-labelledby\"],\n      value,\n    };\n\n    const trackingId = useTrackingId({\n      name: \"Switch\",\n      data,\n      hasOverride: !!rest[\"data-tracking-id\"],\n    });\n\n    const switchClassNames = cx(styles[\"switch\"], className);\n\n    const styleCombined = {\n      ...style,\n      ...layoutStyles,\n      alignItems: description ? \"flex-start\" : \"center\",\n    };\n\n    return (\n      <label className={switchClassNames} style={styleCombined}>\n        <input\n          className={styles[\"input\"]}\n          data-tracking-id={trackingId}\n          data-anv=\"switch\"\n          ref={ref}\n          type=\"checkbox\"\n          role=\"switch\"\n          value={value}\n          aria-checked={checked ?? defaultChecked}\n          aria-label={label ? undefined : ariaLabel || \"Toggle option\"}\n          checked={checked}\n          defaultChecked={defaultChecked}\n          onChange={onChangeHandler}\n          {...rest}\n        />\n        <span aria-hidden className={styles[\"toggle\"]}>\n          <span className={styles[\"thumb\"]}>\n            <Icon svg={Check} className={styles[\"check\"]} />\n          </span>\n        </span>\n        {label || description ? (\n          <Flex direction=\"column\" gap={1}>\n            <Flex alignItems=\"center\" gap={2}>\n              {label && label}\n              {labelAiMark && (\n                <AiMark\n                  className={styles[\"ai-mark-icon\"]}\n                  type=\"gradient\"\n                  popoverOrTooltipConfig={\n                    typeof labelAiMark === \"object\" ? labelAiMark : undefined\n                  }\n                />\n              )}\n            </Flex>\n            {description && <Helper id={helperUid} description={description} />}\n          </Flex>\n        ) : null}\n      </label>\n    );\n  },\n);\n\nSwitch.displayName = \"Switch\";\n"],"names":["Check"],"mappings":"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"}