@servicetitan/anvil2 3.0.0 → 3.0.1

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 (192) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/dist/AiMark.css +3 -3
  3. package/dist/{Alert-DmbqtMg_.js → Alert-C04WIw7A.js} +2 -2
  4. package/dist/{Alert-DmbqtMg_.js.map → Alert-C04WIw7A.js.map} +1 -1
  5. package/dist/Alert.css +1 -1
  6. package/dist/Alert.js +1 -1
  7. package/dist/Announcement.css +1 -1
  8. package/dist/AnvilProvider.css +1 -2
  9. package/dist/{Avatar-NbFc4Ovc.js → Avatar-BmNcLUg-.js} +2 -2
  10. package/dist/{Avatar-NbFc4Ovc.js.map → Avatar-BmNcLUg-.js.map} +1 -1
  11. package/dist/{Avatar-B4hRHku9.js → Avatar-Cw8B8xZV.js} +2 -2
  12. package/dist/Avatar-Cw8B8xZV.js.map +1 -0
  13. package/dist/Avatar.css +2 -2
  14. package/dist/Avatar.js +2 -2
  15. package/dist/Badge.css +1 -1
  16. package/dist/{Breadcrumbs-CYmciJ1D.js → Breadcrumbs-CAJMeA1D.js} +2 -2
  17. package/dist/{Breadcrumbs-CYmciJ1D.js.map → Breadcrumbs-CAJMeA1D.js.map} +1 -1
  18. package/dist/Breadcrumbs.css +1 -1
  19. package/dist/Breadcrumbs.js +1 -1
  20. package/dist/Button.css +1 -1
  21. package/dist/ButtonCompound.css +1 -1
  22. package/dist/ButtonToggle.css +1 -1
  23. package/dist/Calendar.css +2 -2
  24. package/dist/Card.css +1 -1
  25. package/dist/Checkbox.css +1 -1
  26. package/dist/{Chip-CR5i8mQW.js → Chip-Da8c7tKP.js} +2 -2
  27. package/dist/{Chip-CR5i8mQW.js.map → Chip-Da8c7tKP.js.map} +1 -1
  28. package/dist/Chip.css +1 -1
  29. package/dist/Chip.js +1 -1
  30. package/dist/{Combobox-BffGTugd.js → Combobox-CBLaT1lU.js} +4 -4
  31. package/dist/{Combobox-BffGTugd.js.map → Combobox-CBLaT1lU.js.map} +1 -1
  32. package/dist/Combobox.css +1 -1
  33. package/dist/Combobox.js +1 -1
  34. package/dist/{DataTable-D9Xj1nq5.js → DataTable-BDXdCF7J.js} +6 -6
  35. package/dist/{DataTable-D9Xj1nq5.js.map → DataTable-BDXdCF7J.js.map} +1 -1
  36. package/dist/DataTable.css +16 -16
  37. package/dist/DateFieldYearlessRange.css +1 -1
  38. package/dist/DaysOfTheWeek.css +1 -1
  39. package/dist/Details.css +1 -1
  40. package/dist/{Dialog-DGmF6qx3.js → Dialog-ByTyuybu.js} +4 -4
  41. package/dist/Dialog-ByTyuybu.js.map +1 -0
  42. package/dist/Dialog.css +1 -1
  43. package/dist/Dialog.js +1 -1
  44. package/dist/Divider.css +1 -1
  45. package/dist/DndSort.css +1 -1
  46. package/dist/{Drawer-iewBy1DW.js → Drawer-CwyfBcwt.js} +5 -5
  47. package/dist/{Drawer-iewBy1DW.js.map → Drawer-CwyfBcwt.js.map} +1 -1
  48. package/dist/Drawer.css +1 -1
  49. package/dist/Drawer.js +1 -1
  50. package/dist/DrillDown.css +1 -1
  51. package/dist/DrillDown.js +1 -1
  52. package/dist/{EditCard-D7-Ye7R0.js → EditCard-DqLSnkih.js} +2 -2
  53. package/dist/{EditCard-D7-Ye7R0.js.map → EditCard-DqLSnkih.js.map} +1 -1
  54. package/dist/EditCard.css +1 -1
  55. package/dist/EditCard.js +1 -1
  56. package/dist/FieldLabel.css +2 -2
  57. package/dist/FieldMessage.css +1 -1
  58. package/dist/{Toolbar-C1_etxss.js → FilterBar-BU8StPPd.js} +121 -933
  59. package/dist/FilterBar-BU8StPPd.js.map +1 -0
  60. package/dist/FilterBar.css +59 -0
  61. package/dist/FilterBar.d.ts +6 -0
  62. package/dist/FilterBar.js +2 -0
  63. package/dist/FilterBar.js.map +1 -0
  64. package/dist/Flex.css +1 -1
  65. package/dist/Grid.css +1 -1
  66. package/dist/Helper.css +1 -1
  67. package/dist/Icon.css +1 -1
  68. package/dist/InteractiveCard.css +1 -1
  69. package/dist/Layout.css +1 -1
  70. package/dist/Link.css +1 -1
  71. package/dist/List.css +1 -1
  72. package/dist/ListView.css +1 -1
  73. package/dist/{Listbox-DDlxpVu9.js → Listbox-C0tjQFDF.js} +2 -2
  74. package/dist/{Listbox-DDlxpVu9.js.map → Listbox-C0tjQFDF.js.map} +1 -1
  75. package/dist/Listbox.css +1 -1
  76. package/dist/Listbox.js +1 -1
  77. package/dist/Menu.css +1 -1
  78. package/dist/MultiSelectField.js +1 -1
  79. package/dist/{MultiSelectFieldSync-DZ3tm7zt.js → MultiSelectFieldSync-ueey5UBM.js} +4 -4
  80. package/dist/{MultiSelectFieldSync-DZ3tm7zt.js.map → MultiSelectFieldSync-ueey5UBM.js.map} +1 -1
  81. package/dist/MultiSelectFieldSync.css +1 -1
  82. package/dist/MultiSelectMenu.js +1 -1
  83. package/dist/{MultiSelectMenuSync-dgO9SmHi.js → MultiSelectMenuSync-D7hqugcQ.js} +4 -4
  84. package/dist/{MultiSelectMenuSync-dgO9SmHi.js.map → MultiSelectMenuSync-D7hqugcQ.js.map} +1 -1
  85. package/dist/NumberField.css +1 -1
  86. package/dist/Overflow.css +2 -2
  87. package/dist/{Page-Be1Blwme.js → Page-DbK-JKyB.js} +5 -5
  88. package/dist/{Page-Be1Blwme.js.map → Page-DbK-JKyB.js.map} +1 -1
  89. package/dist/Page.css +1 -1
  90. package/dist/Page.js +1 -1
  91. package/dist/{Pagination-USDJM5vi.js → Pagination-Bg5Nsdik.js} +2 -2
  92. package/dist/{Pagination-USDJM5vi.js.map → Pagination-Bg5Nsdik.js.map} +1 -1
  93. package/dist/Pagination.css +6 -6
  94. package/dist/Pagination.js +1 -1
  95. package/dist/Popover.css +1 -1
  96. package/dist/ProgressBar.css +1 -1
  97. package/dist/Radio.css +1 -1
  98. package/dist/{SearchField-CsRGYZx3.js → SearchField-BKJOW-vI.js} +3 -10
  99. package/dist/SearchField-BKJOW-vI.js.map +1 -0
  100. package/dist/SearchField-BplvDpBG.js +13 -0
  101. package/dist/SearchField-BplvDpBG.js.map +1 -0
  102. package/dist/SearchField.css +1 -1
  103. package/dist/SearchField.js +1 -1
  104. package/dist/SegmentedControl.css +1 -1
  105. package/dist/SelectCard.css +1 -1
  106. package/dist/SelectField.js +1 -1
  107. package/dist/{SelectFieldSync-C44hPeeS.js → SelectFieldSync-W_-jTf7z.js} +3 -3
  108. package/dist/{SelectFieldSync-C44hPeeS.js.map → SelectFieldSync-W_-jTf7z.js.map} +1 -1
  109. package/dist/SelectMenu.js +1 -1
  110. package/dist/{SelectMenuSync-V97oN85V.js → SelectMenuSync-QcjbQtCO.js} +4 -4
  111. package/dist/{SelectMenuSync-V97oN85V.js.map → SelectMenuSync-QcjbQtCO.js.map} +1 -1
  112. package/dist/{SelectOptions-CDoo4AUu.js → SelectOptions-BsX0f22q.js} +2 -2
  113. package/dist/{SelectOptions-CDoo4AUu.js.map → SelectOptions-BsX0f22q.js.map} +1 -1
  114. package/dist/{SelectTrigger-BWN3Tx43.js → SelectTrigger-BaDvF9JD.js} +3 -3
  115. package/dist/{SelectTrigger-BWN3Tx43.js.map → SelectTrigger-BaDvF9JD.js.map} +1 -1
  116. package/dist/SelectTrigger.js +1 -1
  117. package/dist/{SelectTriggerBase-Do7lQ5rw.js → SelectTriggerBase-kMRqbXwu.js} +2 -2
  118. package/dist/{SelectTriggerBase-Do7lQ5rw.js.map → SelectTriggerBase-kMRqbXwu.js.map} +1 -1
  119. package/dist/SelectTriggerBase.css +1 -1
  120. package/dist/SideNav.css +1 -1
  121. package/dist/Skeleton.css +1 -1
  122. package/dist/Spinner.css +1 -1
  123. package/dist/SrOnly.css +1 -1
  124. package/dist/StatusIcon.css +1 -1
  125. package/dist/Stepper.css +4 -4
  126. package/dist/Switch.css +1 -1
  127. package/dist/Tab.css +1 -1
  128. package/dist/Table.js +1 -1
  129. package/dist/{Text-J5YtSSXY.js → Text-BH8gglCL.js} +4 -4
  130. package/dist/Text-BH8gglCL.js.map +1 -0
  131. package/dist/Text.css +1 -1
  132. package/dist/Text.js +1 -1
  133. package/dist/TextField.css +1 -1
  134. package/dist/Textarea.css +1 -1
  135. package/dist/ThemeProvider.css +0 -1
  136. package/dist/{TimeField-DTg0CE5L.js → TimeField-Cz4tMYb3.js} +2 -2
  137. package/dist/{TimeField-DTg0CE5L.js.map → TimeField-Cz4tMYb3.js.map} +1 -1
  138. package/dist/TimeField.css +1 -1
  139. package/dist/TimeField.js +1 -1
  140. package/dist/TimezoneMessage.css +1 -1
  141. package/dist/Toast.js +2 -2
  142. package/dist/{Toaster-Bq42x6Gx.js → Toaster-BV8RjmIN.js} +2 -2
  143. package/dist/{Toaster-Bq42x6Gx.js.map → Toaster-BV8RjmIN.js.map} +1 -1
  144. package/dist/{Toaster-Dly3rfva.js → Toaster-DYGDohJT.js} +2 -2
  145. package/dist/{Toaster-Dly3rfva.js.map → Toaster-DYGDohJT.js.map} +1 -1
  146. package/dist/Toaster.css +1 -1
  147. package/dist/Toolbar-Dzj2KMEy.js +588 -0
  148. package/dist/Toolbar-Dzj2KMEy.js.map +1 -0
  149. package/dist/Toolbar.css +2 -96
  150. package/dist/Toolbar.js +2 -1
  151. package/dist/Toolbar.js.map +1 -1
  152. package/dist/ToolbarButtonToggle--2Ka05N8.js +284 -0
  153. package/dist/ToolbarButtonToggle--2Ka05N8.js.map +1 -0
  154. package/dist/ToolbarButtonToggle.css +41 -0
  155. package/dist/Tooltip.css +1 -1
  156. package/dist/YearlessDateInputWithPicker.css +2 -2
  157. package/dist/assets/icons/st/unsorted.svg +1 -1
  158. package/dist/beta/components/FilterBar/FilterBar.d.ts +87 -0
  159. package/dist/beta/components/{Toolbar/Filters → FilterBar}/FilterToggleButton.d.ts +1 -1
  160. package/dist/beta/components/FilterBar/index.d.ts +3 -0
  161. package/dist/beta/components/{Toolbar/Filters → FilterBar}/internal/FilterGroupContext.d.ts +5 -5
  162. package/dist/beta/components/{Toolbar/Filters → FilterBar}/internal/types.d.ts +2 -2
  163. package/dist/beta/components/{Toolbar/Filters → FilterBar}/internal/utils/test.d.ts +1 -0
  164. package/dist/beta/components/Toolbar/Toolbar.d.ts +0 -54
  165. package/dist/beta/components/Toolbar/index.d.ts +0 -1
  166. package/dist/beta/components/index.d.ts +1 -0
  167. package/dist/beta.js +9 -7
  168. package/dist/beta.js.map +1 -1
  169. package/dist/index.css +2 -2
  170. package/dist/index.js +19 -19
  171. package/dist/index2.css +1 -1
  172. package/dist/{syncFilterUtils-BLcRXQfd.js → syncFilterUtils-nJS_tCsu.js} +4 -4
  173. package/dist/{syncFilterUtils-BLcRXQfd.js.map → syncFilterUtils-nJS_tCsu.js.map} +1 -1
  174. package/dist/syncFilterUtils.css +4 -4
  175. package/dist/{useDrilldown-D5WWJRU2.js → useDrilldown-DwzT0Fse.js} +2 -2
  176. package/dist/{useDrilldown-D5WWJRU2.js.map → useDrilldown-DwzT0Fse.js.map} +1 -1
  177. package/dist/{useToggleSelection-D_2qS0P1.js → useToggleSelection-CAwGOeXk.js} +2 -2
  178. package/dist/{useToggleSelection-D_2qS0P1.js.map → useToggleSelection-CAwGOeXk.js.map} +1 -1
  179. package/package.json +9 -9
  180. package/dist/Avatar-B4hRHku9.js.map +0 -1
  181. package/dist/Dialog-DGmF6qx3.js.map +0 -1
  182. package/dist/SearchField-CsRGYZx3.js.map +0 -1
  183. package/dist/Text-J5YtSSXY.js.map +0 -1
  184. package/dist/Toolbar-C1_etxss.js.map +0 -1
  185. package/dist/beta/components/Toolbar/Filters/FilterGroup.d.ts +0 -25
  186. /package/dist/beta/components/{Toolbar/Filters → FilterBar}/FilterButton.d.ts +0 -0
  187. /package/dist/beta/components/{Toolbar/Filters → FilterBar}/FilterDateRange.d.ts +0 -0
  188. /package/dist/beta/components/{Toolbar/Filters → FilterBar}/FilterDateSingle.d.ts +0 -0
  189. /package/dist/beta/components/{Toolbar/Filters → FilterBar}/FilterDrawer.d.ts +0 -0
  190. /package/dist/beta/components/{Toolbar/Filters → FilterBar}/FilterItemWrapper.d.ts +0 -0
  191. /package/dist/beta/components/{Toolbar/Filters → FilterBar}/FilterSelect.d.ts +0 -0
  192. /package/dist/beta/components/{Toolbar/Filters → FilterBar}/internal/utils/filter-state.d.ts +0 -0
@@ -1,4 +1,4 @@
1
- .anvil2{@layer starter, reset, base, state, application;/* ============================================
1
+ .anvil2 {/* ============================================
2
2
  Table Cells Base
3
3
  ============================================ */._table-header-cell_ofjhm_4,
4
4
  ._table-body-cell_ofjhm_5,
@@ -93,7 +93,7 @@
93
93
  ._table-cell-internal-expand_ofjhm_77 div[data-anv=checkbox] {
94
94
  width: 24px;
95
95
  }
96
- }.anvil2{@layer starter, reset, base, state, application;/* ============================================
96
+ }.anvil2 {/* ============================================
97
97
  Truncate Chips
98
98
  ============================================ */._truncate-chips_19u8s_4 {
99
99
  display: flex;
@@ -103,7 +103,7 @@
103
103
  gap: var(--a2-size-half, 0.125rem);
104
104
  min-width: 0;
105
105
  }
106
- }.anvil2{@layer starter, reset, base, state, application;._highlight_1t8gj_1 {
106
+ }.anvil2 {._highlight_1t8gj_1 {
107
107
  background-color: var(--a2-background-color-warning, var(--a2-status-color-warning, light-dark(var(--a2-color-yellow-500, #ffbe00), var(--a2-color-yellow-300, #ffe278))));
108
108
  border-radius: var(--a2-border-radius-small, var(--a2-radius-1, 0.1875rem));
109
109
  padding-inline: var(--a2-size-half, 0.125rem);
@@ -123,7 +123,7 @@
123
123
  flex-direction: column;
124
124
  gap: var(--a2-size-1, 0.25rem);
125
125
  }
126
- }.anvil2{@layer starter, reset, base, state, application;/* ============================================
126
+ }.anvil2 {/* ============================================
127
127
  Table Base
128
128
  ============================================ */._table-base_qvkwx_4 {
129
129
  all: unset;
@@ -158,7 +158,7 @@
158
158
  }._data-table-base_qvkwx_22:has([data-virtualized-body=true]) {
159
159
  display: block;
160
160
  }
161
- }.anvil2{@layer starter, reset, base, state, application;/* ============================================
161
+ }.anvil2 {/* ============================================
162
162
  Table Body
163
163
  ============================================ */._table-body_1crpq_4 {
164
164
  all: unset;
@@ -179,7 +179,7 @@
179
179
  grid-column: 1/-1;
180
180
  grid-template-columns: subgrid;
181
181
  }
182
- }.anvil2{@layer starter, reset, base, state, application;/* ============================================
182
+ }.anvil2 {/* ============================================
183
183
  DataTable Editable Cell Base
184
184
  ============================================ */input._data-table-body-cell-input_i8xxd_4,
185
185
  ._data-table-body-cell-select-trigger_i8xxd_5 {
@@ -228,7 +228,7 @@
228
228
  background: linear-gradient(90deg, transparent 0%, var(--a2-table-cell-edit-background-color) 70%);
229
229
  pointer-events: none;
230
230
  }
231
- }.anvil2{@layer starter, reset, base, state, application;/* ============================================
231
+ }.anvil2 {/* ============================================
232
232
  DataTable Cell Base
233
233
  ============================================ */._data-table-body-cell_12iyq_4,
234
234
  ._data-table-body-cell-input_12iyq_5 {
@@ -335,7 +335,7 @@
335
335
  color: var(--a2-status-color-warning, light-dark(var(--a2-color-yellow-500, #ffbe00), var(--a2-color-yellow-300, #ffe278)));
336
336
  flex-shrink: 0;
337
337
  }
338
- }.anvil2{@layer starter, reset, base, state, application;/* ============================================
338
+ }.anvil2 {/* ============================================
339
339
  DataTable Body Row
340
340
  ============================================ */._data-table-body-row_8akvx_4 {
341
341
  all: unset;
@@ -388,7 +388,7 @@
388
388
  right: 0;
389
389
  width: 2px;
390
390
  }
391
- }.anvil2{@layer starter, reset, base, state, application;/* ============================================
391
+ }.anvil2 {/* ============================================
392
392
  Table Footer
393
393
  ============================================ */._table-footer_1d2jp_4 {
394
394
  all: unset;
@@ -420,7 +420,7 @@
420
420
  grid-column: 1/-1;
421
421
  grid-template-columns: subgrid;
422
422
  }
423
- }.anvil2{@layer starter, reset, base, state, application;/* ============================================
423
+ }.anvil2 {/* ============================================
424
424
  DataTable Footer
425
425
  ============================================ */._data-table-footer_98moz_4 {
426
426
  padding-block-start: var(--a2-table-footer-spacing);
@@ -441,7 +441,7 @@
441
441
  grid-template-columns: subgrid;
442
442
  position: relative;
443
443
  }
444
- }.anvil2{@layer starter, reset, base, state, application;/* ============================================
444
+ }.anvil2 {/* ============================================
445
445
  Table Header
446
446
  ============================================ */._table-header_1s8lb_4 {
447
447
  all: unset;
@@ -468,7 +468,7 @@
468
468
  }
469
469
  }[data-anv="data-table-base"]:has([data-virtualized-body="true"]) div._table-header_1s8lb_4 {
470
470
  grid-template-columns: var(--a2-grid-template-columns);
471
- }.anvil2{@layer starter, reset, base, state, application;/* ============================================
471
+ }.anvil2 {/* ============================================
472
472
  Resize Handle
473
473
  ============================================ */._resize-handle_sv3kd_4 {
474
474
  all: unset;
@@ -506,7 +506,7 @@
506
506
  --a2-table-resize-handle-bg: var(--a2-overlay-color-hover);
507
507
  --a2-table-resize-handle-opacity: 1;
508
508
  }
509
- }.anvil2{@layer starter, reset, base, state, application;/* ============================================
509
+ }.anvil2 {/* ============================================
510
510
  DataTable Header Row
511
511
  ============================================ */._data-table-header-row_1n8uq_4 {
512
512
  display: grid;
@@ -515,7 +515,7 @@
515
515
  }
516
516
  }[data-anv="data-table-base"]:has([data-virtualized-body="true"]) ._data-table-header-row_1n8uq_4 {
517
517
  grid-template-columns: var(--a2-grid-template-columns);
518
- }.anvil2{@layer starter, reset, base, state, application;/* ============================================
518
+ }.anvil2 {/* ============================================
519
519
  Table Container
520
520
  ============================================ */._table-container_qokgc_4 {
521
521
  all: unset;
@@ -577,7 +577,7 @@
577
577
  }._table-scroll-container_qokgc_56::-webkit-scrollbar-corner {
578
578
  background-color: var(--a2-table-background-color);
579
579
  }
580
- }.anvil2{@layer starter, reset, base, state, application;/* ============================================
580
+ }.anvil2 {/* ============================================
581
581
  DataTable Pagination
582
582
  ============================================ */[data-anv=table-container] ._pagination_13hzr_4 {
583
583
  background-color: var(--a2-table-background-color);
@@ -589,7 +589,7 @@
589
589
  position: sticky;
590
590
  z-index: 2;
591
591
  }
592
- }.anvil2{@layer starter, reset, base, state, application;/* ============================================
592
+ }.anvil2 {/* ============================================
593
593
  DataTable States
594
594
  ============================================ */._container-with-pagination_1pd1e_4 {
595
595
  --a2-table-padding-block-end: 0;
@@ -1,4 +1,4 @@
1
- .anvil2{@layer starter, reset, base, state, application;._range-row_vmodf_1 {
1
+ .anvil2 {._range-row_vmodf_1 {
2
2
  align-items: center;
3
3
  display: grid;
4
4
  gap: var(--a2-size-2, 0.5rem);
@@ -1,4 +1,4 @@
1
- .anvil2{@layer starter, reset, base, state, application;._days-of-the-week-container_1vz5n_1 {
1
+ .anvil2 {._days-of-the-week-container_1vz5n_1 {
2
2
  --a2-mod-days-of-the-week-button-width: var(--a2-size-10, 2.5rem);
3
3
  container-name: days-of-the-week;
4
4
  container-type: inline-size;
package/dist/Details.css CHANGED
@@ -1,4 +1,4 @@
1
- .anvil2{@layer starter, reset, base, state, application;._details_10ce6_1 {
1
+ .anvil2 {._details_10ce6_1 {
2
2
  all: unset;
3
3
  font-family: var(--a2-font-family-base, "Nunito Sans", sans-serif);
4
4
  font-size: 100%;
@@ -2,7 +2,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
2
2
  import { forwardRef, useState, useEffect, useRef, useId, useCallback, useLayoutEffect, useMemo } from 'react';
3
3
  import { S as SvgClose } from './close-DZj38AEh.js';
4
4
  import { c as cx } from './index-De1g9FRV.js';
5
- import { T as Text } from './Text-J5YtSSXY.js';
5
+ import { T as Text } from './Text-BH8gglCL.js';
6
6
  import { u as useDialogContext, D as DialogCancelButton } from './DialogCancelButton-CbtQcf2J.js';
7
7
  import { c as childrenToString } from './childrenToString-Bz9MqbHb.js';
8
8
  import { useTrackingId } from './useTrackingId.js';
@@ -10,7 +10,7 @@ import { u as useMergeRefs } from './useMergeRefs-Dfmtq9cI.js';
10
10
  import { D as DialogContext } from './DialogContext-DBgtApl9.js';
11
11
  import { d as drillDownStyles, D as DrillDownContext } from './DrillDown.module-D1Bf9_yP.js';
12
12
  import { u as useDrillDownContextState, a as useDialogTransitionStates, b as useKeyboardFocusables, c as useInitialFocus } from './useInitialFocus-BUxEDMEG.js';
13
- import { a as ToastProvider, b as ToasterPopover, c as ToasterContent } from './Toaster-Bq42x6Gx.js';
13
+ import { a as ToastProvider, b as ToasterPopover, c as ToasterContent } from './Toaster-BV8RjmIN.js';
14
14
  import { u as useDialogScrollLock } from './useDialogScrollLock-BW-aVboo.js';
15
15
  import { r as registerLayer, u as unregisterLayer, a as useOnClickOutside } from './useOnClickOutside-Zw5vzxSq.js';
16
16
 
@@ -225,7 +225,7 @@ const Dialog = Object.assign(
225
225
  const classNames = cx([styles.dialog, drillDownStyles.dialog], className, {
226
226
  [styles["closing"]]: state === "closing",
227
227
  [styles["fullscreen"]]: fullScreen,
228
- ...size && { [styles[size]]: true }
228
+ ...size && size !== "medium" && { [styles[size]]: true }
229
229
  });
230
230
  const { focusables } = useKeyboardFocusables(contentRef, {
231
231
  observeChange: true
@@ -401,4 +401,4 @@ const Dialog = Object.assign(
401
401
  Dialog.displayName = "Dialog";
402
402
 
403
403
  export { Dialog as D };
404
- //# sourceMappingURL=Dialog-DGmF6qx3.js.map
404
+ //# sourceMappingURL=Dialog-ByTyuybu.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Dialog-ByTyuybu.js","sources":["../src/components/Dialog/DialogHeader.tsx","../src/components/Dialog/DialogFooter.tsx","../src/components/Dialog/DialogContent.tsx","../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport Close from \"@servicetitan/hammer-icon/mdi/round/close.svg\";\nimport cx from \"classnames\";\n\nimport { Text } from \"../Text\";\nimport { DialogCancelButton } from \"./DialogCancelButton\";\n\nimport styles from \"./Dialog.module.scss\";\nimport { childrenToString } from \"../../internal/functions\";\nimport { useTrackingId, useMergeRefs } from \"../../hooks\";\nimport { DataTrackingId } from \"../../types\";\nimport { useDialogContext } from \"./internal/useDialogContext\";\n\n/**\n * Props for the DialogHeader component\n * @extends ComponentPropsWithoutRef<\"header\">\n */\nexport type DialogHeaderProps = ComponentPropsWithoutRef<\"header\"> &\n DataTrackingId;\n\n/**\n * DialogHeader component for the header section of a Dialog.\n *\n * Features:\n * - Displays dialog title with headline typography\n * - Includes close button with proper accessibility\n * - Sticky positioning for long content\n * - Consistent spacing and styling\n * - Automatic focus management\n *\n * @example\n * <Dialog.Header>Confirm Delete</Dialog.Header>\n */\nexport const DialogHeader = forwardRef<HTMLDivElement, DialogHeaderProps>(\n (props: DialogHeaderProps, ref) => {\n const { children, className, ...rest } = props;\n const { headerRef } = useDialogContext();\n const data = {\n children: childrenToString(props.children),\n };\n\n const trackingId = useTrackingId({\n name: \"Dialog\",\n data,\n hasOverride: !!props[\"data-tracking-id\"],\n });\n\n const headerClassNames = cx(className, styles[\"header\"]);\n\n return (\n <header\n className={headerClassNames}\n data-anv=\"dialog-header\"\n data-tracking-id={trackingId}\n ref={useMergeRefs([ref, headerRef])}\n {...rest}\n >\n <Text variant=\"headline\" el=\"h1\" className={styles[\"title\"]}>\n {children}\n </Text>\n <span className={styles[\"close-container\"]}>\n <DialogCancelButton\n className={styles[\"close-button\"]}\n size=\"small\"\n appearance=\"ghost\"\n aria-label=\"Close dialog\"\n icon={Close}\n />\n </span>\n </header>\n );\n },\n);\n\nDialogHeader.displayName = \"DialogHeader\";\n","import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport cx from \"classnames\";\n\nimport styles from \"./Dialog.module.scss\";\n\n/**\n * Props for the DialogFooter component\n * @extends ComponentPropsWithoutRef<\"footer\">\n */\nexport type DialogFooterProps = ComponentPropsWithoutRef<\"footer\"> & {\n /**\n * @default false\n */\n sticky?: boolean;\n};\n\n/**\n * DialogFooter component for the footer section of a Dialog.\n *\n * Features:\n * - Container for dialog action buttons\n * - Optional sticky positioning for long content\n * - Consistent spacing and alignment\n * - Right-aligned button layout by default\n * - Flexible content area for custom layouts\n *\n * @example\n * <Dialog.Footer sticky>\n * <Dialog.CancelButton>Cancel</Dialog.CancelButton>\n * <Button appearance=\"primary\">Save</Button>\n * </Dialog.Footer>\n */\nexport const DialogFooter = forwardRef<HTMLElement, DialogFooterProps>(\n (props, ref) => {\n const { children, className, sticky = false, ...rest } = props;\n\n const footerClassNames = cx(styles[\"footer\"], className, {\n [styles[\"sticky\"]]: sticky,\n });\n\n return (\n <footer\n className={footerClassNames}\n data-anv=\"dialog-footer\"\n ref={ref}\n {...rest}\n >\n {children}\n </footer>\n );\n },\n);\n\nDialogFooter.displayName = \"DialogFooter\";\n","import {\n ComponentPropsWithoutRef,\n forwardRef,\n useEffect,\n useState,\n} from \"react\";\nimport cx from \"classnames\";\n\nimport styles from \"./Dialog.module.scss\";\nimport { useDialogContext } from \"./internal/useDialogContext\";\n\n/**\n * Props for the DialogContent component\n * @extends ComponentPropsWithoutRef<\"div\">\n */\nexport type DialogContentProps = ComponentPropsWithoutRef<\"div\"> & {\n /**\n * When true, the content will stick below the header during scroll.\n * @default false\n */\n sticky?: boolean;\n};\n\n/**\n * DialogContent component for the main content area of a Dialog.\n *\n * Features:\n * - Main content container for dialog body\n * - Flexible height with overflow handling\n * - Optional sticky positioning below header\n * - Consistent padding and spacing\n * - Responsive design\n * - Proper content scrolling for long content\n *\n * @example\n * // Basic content\n * <Dialog.Content>\n * <p>This is the main content of the dialog.</p>\n * </Dialog.Content>\n *\n * @example\n * // Sticky content (e.g., search field that remains visible while scrolling)\n * <Dialog.Content sticky>\n * <TextField placeholder=\"Filter results...\" />\n * </Dialog.Content>\n */\nexport const DialogContent = forwardRef<HTMLDivElement, DialogContentProps>(\n (props, ref) => {\n const { children, className, sticky = false, ...rest } = props;\n const { headerRef } = useDialogContext();\n const [headerHeight, setHeaderHeight] = useState(0);\n\n useEffect(() => {\n const headerElement = headerRef?.current;\n if (!sticky || !headerElement) return;\n\n const updateHeight = () => {\n setHeaderHeight(headerElement.offsetHeight || 0);\n };\n\n updateHeight();\n const resizeObserver = new ResizeObserver(updateHeight);\n resizeObserver.observe(headerElement);\n\n return () => resizeObserver.disconnect();\n }, [sticky, headerRef]);\n\n const contentClassNames = cx(styles[\"content\"], className, {\n [styles[\"sticky\"]]: sticky,\n });\n\n const stickyStyle = sticky ? { top: `${headerHeight}px` } : undefined;\n\n return (\n <div\n className={contentClassNames}\n data-anv=\"dialog-content\"\n ref={ref}\n style={{ ...stickyStyle, ...rest.style }}\n {...rest}\n >\n {children}\n </div>\n );\n },\n);\n\nDialogContent.displayName = \"DialogContent\";\n","import {\n ComponentPropsWithoutRef,\n forwardRef,\n useCallback,\n useEffect,\n useId,\n useRef,\n useState,\n KeyboardEvent,\n useMemo,\n useLayoutEffect,\n} from \"react\";\nimport { DialogHeader } from \"./DialogHeader\";\nimport { DialogFooter } from \"./DialogFooter\";\nimport { DialogContent } from \"./DialogContent\";\nimport { DialogCancelButton } from \"./DialogCancelButton\";\nimport {\n OpenCloseTransitionStateEffects,\n useDialogScrollLock,\n useDialogTransitionStates,\n useKeyboardFocusables,\n useOnClickOutside,\n} from \"../../internal/hooks\";\nimport {\n FocusableElement,\n DisableCloseOnEscapeOrClickProps,\n Size,\n} from \"../../types\";\nimport { registerLayer, unregisterLayer } from \"../../internal/utils\";\nimport { DialogContext, DialogContextProps } from \"./internal/DialogContext\";\nimport {\n DrillDownContext,\n DrillDownContextProps,\n} from \"../DrillDown/internal/DrillDownContext\";\nimport { useDrillDownContextState } from \"../DrillDown/internal/useDrillDownContextState\";\nimport styles from \"./Dialog.module.scss\";\nimport drillDownStyles from \"../DrillDown/DrillDown.module.scss\";\nimport { useMergeRefs } from \"../../hooks\";\nimport cx from \"classnames\";\n\nimport { ToastProvider } from \"../Toast/internal/ToastProvider\";\nimport { ToasterPopover } from \"../Toast/internal/ToasterPopover\";\nimport { ToasterContent } from \"../Toast/internal/Toaster\";\nimport { useInitialFocus } from \"./internal/useInitialFocus\";\n\n/**\n * Props for the Dialog component\n * @extends ComponentPropsWithoutRef<\"dialog\">\n * @extends DialogTransitionStateEffects\n * @extends DisableCloseOnEscapeOrClickProps\n */\nexport type DialogProps = ComponentPropsWithoutRef<\"dialog\"> &\n OpenCloseTransitionStateEffects &\n DisableCloseOnEscapeOrClickProps & {\n /**\n * @default false\n */\n fullScreen?: boolean;\n /**\n * @default \"medium\"\n */\n size?: Extract<Size, \"medium\" | \"large\" | \"xlarge\">;\n\n /**\n * @default false\n */\n open?: boolean;\n onClose?: () => void;\n /**\n * Callback when clicking outside the dialog\n */\n onClickOutside?: (e: globalThis.MouseEvent) => void;\n /**\n * Enables scroll chaining\n * @link https://developer.mozilla.org/en-US/docs/Glossary/Scroll_chaining\n */\n enableScrollChaining?: boolean;\n /**\n * Given an array of focusable elements, return the initial focus target.\n * @param focusables - The focusable elements to pick from\n * @returns The initial focus target\n */\n initialFocusResolver?: (focusables: FocusableElement[]) => FocusableElement;\n /**\n * Sets the default DrillDown index when used in an uncontrolled way\n */\n defaultDrillDownIndex?: DrillDownContextProps[\"index\"];\n /**\n * Callback to pass context to useDrillDown hook\n */\n onDrillDownContextChange?: (context: DrillDownContextProps) => void;\n };\n\n/**\n * Dialog component for creating modal dialogs and overlays.\n *\n * Features:\n * - Modal dialog with backdrop overlay\n * - Controlled and uncontrolled open state\n * - Smooth open/close animations\n * - Keyboard navigation and focus management\n * - Escape key and click outside to close\n * - Multiple size variants (medium, large, fullscreen)\n * - Scroll chaining support\n * - Toast integration for notifications\n * - Compound component pattern with Header, Footer, Content, and CancelButton sub-components\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Dialog open={isOpen} onClose={() => setIsOpen(false)}>\n * <Dialog.Header>Confirm Action</Dialog.Header>\n * <Dialog.Content>Are you sure you want to proceed?</Dialog.Content>\n * <Dialog.Footer>\n * <Dialog.CancelButton>Cancel</Dialog.CancelButton>\n * <Button appearance=\"primary\">Confirm</Button>\n * </Dialog.Footer>\n * </Dialog>\n */\nexport const Dialog = Object.assign(\n forwardRef<HTMLDialogElement, DialogProps>(function DialogInner(props, ref) {\n const {\n className,\n open = false,\n children,\n onClose,\n onKeyDown,\n fullScreen = false,\n disableCloseOnEscape = false,\n onClickOutside,\n disableCloseOnClickOutside = false,\n size,\n enableScrollChaining,\n onOpenAnimationStart,\n onOpenAnimationComplete,\n onCloseAnimationStart,\n onCloseAnimationComplete,\n initialFocusResolver,\n defaultDrillDownIndex,\n onDrillDownContextChange,\n ...rest\n } = props;\n\n const elRef = useRef<HTMLDialogElement>(null);\n const contentRef = useRef<HTMLDivElement>(null);\n const toasterRef = useRef<HTMLDivElement>(null);\n const headerRef = useRef<HTMLElement>(null);\n\n const [hasOpenPopover, setHasOpenPopover] =\n useState<DialogContextProps[\"hasOpenPopover\"]>(false);\n\n const drillDownContextValue = useDrillDownContextState({\n defaultDrillDownIndex,\n });\n\n const id = useId();\n\n const { state, isOpenOrOpening } = useDialogTransitionStates(elRef, open, {\n onOpenAnimationStart: useCallback(() => {\n onOpenAnimationStart?.();\n }, [onOpenAnimationStart]),\n onOpenAnimationComplete: useCallback(() => {\n onOpenAnimationComplete?.();\n }, [onOpenAnimationComplete]),\n onCloseAnimationStart: useCallback(() => {\n onCloseAnimationStart?.();\n }, [onCloseAnimationStart]),\n onCloseAnimationComplete: useCallback(() => {\n onCloseAnimationComplete?.();\n }, [onCloseAnimationComplete]),\n });\n\n const previousOpenRef = useRef(open);\n\n useLayoutEffect(() => {\n if (open && !previousOpenRef.current) {\n drillDownContextValue.setHostTrigger?.(\n document.activeElement instanceof HTMLElement\n ? document.activeElement\n : null,\n );\n }\n }, [open, drillDownContextValue]);\n\n useEffect(() => {\n previousOpenRef.current = open;\n }, [open]);\n\n useEffect(() => {\n if (state === \"closing\") {\n drillDownContextValue.onHostClose?.();\n }\n }, [state, drillDownContextValue]);\n\n useEffect(() => {\n if (state === \"closed\") {\n drillDownContextValue.onHostClosed?.();\n }\n }, [state, drillDownContextValue]);\n\n const drillDownContextProviderValue = useMemo(\n () => ({\n ...drillDownContextValue,\n hostIsInteractive: state !== \"closing\" && state !== \"closed\",\n }),\n [drillDownContextValue, state],\n );\n\n useLayoutEffect(() => {\n onDrillDownContextChange?.(drillDownContextProviderValue);\n }, [drillDownContextProviderValue]); // eslint-disable-line react-hooks/exhaustive-deps\n\n // DEPRECATED\n const initial = useRef(true);\n useEffect(() => {\n if (initial.current) {\n initial.current = false;\n }\n }, [id, isOpenOrOpening]);\n\n const classNames = cx([styles.dialog, drillDownStyles.dialog], className, {\n [styles[\"closing\"]]: state === \"closing\",\n [styles[\"fullscreen\"]]: fullScreen,\n ...(size && size !== \"medium\" && { [styles[size]]: true }),\n });\n\n const { focusables } = useKeyboardFocusables(contentRef, {\n observeChange: true,\n });\n\n useDialogScrollLock({\n open: isOpenOrOpening,\n id,\n enableScrollChaining,\n elementRef: elRef,\n });\n\n // Register/unregister with layer manager for proper stacking\n useEffect(() => {\n if (open) {\n registerLayer(id);\n } else {\n unregisterLayer(id);\n }\n\n // Cleanup when component unmounts\n return () => {\n unregisterLayer(id);\n };\n }, [open, id]);\n\n useOnClickOutside({\n onClickOutsideBegin: (e) => {\n if (!open) return;\n onClickOutside?.(e);\n },\n targets: [\n contentRef.current as HTMLElement,\n toasterRef.current as HTMLElement,\n ],\n onClickOutside: () => {\n if (disableCloseOnClickOutside || !open) return;\n onClose?.();\n },\n layerId: id,\n });\n\n const computeFocus = useCallback((focusables: FocusableElement[]) => {\n return (\n focusables.find(\n (focusable) => focusable.dataset.anv !== \"dialog-cancel-button\",\n ) || focusables[0]\n );\n }, []);\n\n useInitialFocus(elRef, {\n computeFocus: initialFocusResolver || computeFocus,\n });\n\n const onKeyDownHandler = (e: KeyboardEvent<HTMLDialogElement>) => {\n onKeyDown?.(e);\n if (e.code === \"Escape\") {\n e.preventDefault();\n if (disableCloseOnEscape) return;\n if (hasOpenPopover) return;\n onClose?.();\n return;\n }\n\n if (e.code === \"Tab\") {\n if (e.shiftKey && e.target === focusables?.[0]) {\n e.preventDefault();\n (focusables[focusables.length - 1] as HTMLElement)?.focus();\n return;\n }\n if (e.target === focusables?.[focusables.length - 1] && !e.shiftKey) {\n e.preventDefault();\n focusables[0].focus();\n return;\n }\n }\n };\n\n return (\n // dialog element does seem to be interactive on MDN guideline\n <dialog\n className={classNames}\n data-anv=\"dialog\"\n data-anv-scroll-chaining={enableScrollChaining}\n data-anv-transition-state={state}\n ref={useMergeRefs([ref, elRef])}\n onKeyDown={onKeyDownHandler}\n {...rest}\n >\n <ToastProvider isDialogToaster={open}>\n <ToasterPopover>\n <ToasterContent id=\"dialog-toaster\" ref={toasterRef} />\n </ToasterPopover>\n </ToastProvider>\n\n <DrillDownContext.Provider value={drillDownContextProviderValue}>\n <DialogContext.Provider\n value={{\n close: () => onClose?.(),\n ref: elRef,\n hasOpenPopover,\n setHasOpenPopover,\n headerRef,\n state,\n }}\n >\n <section\n ref={contentRef}\n className={styles[\"container\"]}\n data-open={open}\n >\n {children}\n </section>\n </DialogContext.Provider>\n </DrillDownContext.Provider>\n </dialog>\n );\n }),\n {\n /**\n * DialogHeader component for the header section of a Dialog.\n *\n * Features:\n * - Displays dialog title with headline typography\n * - Includes close button with proper accessibility\n * - Sticky positioning for long content\n * - Consistent spacing and styling\n * - Automatic focus management\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Dialog.Header>Confirm Delete</Dialog.Header>\n */\n Header: DialogHeader,\n /**\n * DialogFooter component for the footer section of a Dialog.\n *\n * Features:\n * - Container for dialog action buttons\n * - Optional sticky positioning for long content\n * - Consistent spacing and alignment\n * - Right-aligned button layout by default\n * - Flexible content area for custom layouts\n *\n * @example\n * <Dialog.Footer sticky>\n * <Dialog.CancelButton>Cancel</Dialog.CancelButton>\n * <Button appearance=\"primary\">Save</Button>\n * </Dialog.Footer>\n */\n Footer: DialogFooter,\n /**\n * DialogContent component for the main content area of a Dialog.\n *\n * Features:\n * - Main content container for dialog body\n * - Flexible height with overflow handling\n * - Consistent padding and spacing\n * - Responsive design\n * - Proper content scrolling for long content\n *\n * @example\n * <Dialog.Content>\n * <p>This is the main content of the dialog.</p>\n * </Dialog.Content>\n */\n Content: DialogContent,\n /**\n * DialogCancelButton component for cancel/close actions in a Dialog.\n *\n * Features:\n * - Button that automatically closes the dialog when clicked\n * - Extends all Button component props and functionality\n * - Proper accessibility with close dialog semantics\n * - Automatic focus management\n * - Consistent styling with other dialog elements\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Dialog.CancelButton appearance=\"ghost\">Cancel</Dialog.CancelButton>\n */\n CancelButton: DialogCancelButton,\n },\n);\nDialog.displayName = \"Dialog\";\nexport const DialogElement = Dialog;\n"],"names":["Close","focusables"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiCO,MAAM,YAAA,GAAe,UAAA;AAAA,EAC1B,CAAC,OAA0B,GAAA,KAAQ;AACjC,IAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,GAAG,MAAK,GAAI,KAAA;AACzC,IAAA,MAAM,EAAE,SAAA,EAAU,GAAI,gBAAA,EAAiB;AACvC,IAAA,MAAM,IAAA,GAAO;AAAA,MACX,QAAA,EAAU,gBAAA,CAAiB,KAAA,CAAM,QAAQ;AAAA,KAC3C;AAEA,IAAA,MAAM,aAAa,aAAA,CAAc;AAAA,MAC/B,IAAA,EAAM,QAAA;AAAA,MACN,IAAA;AAAA,MACA,WAAA,EAAa,CAAC,CAAC,KAAA,CAAM,kBAAkB;AAAA,KACxC,CAAA;AAED,IAAA,MAAM,gBAAA,GAAmB,EAAA,CAAG,SAAA,EAAW,MAAA,CAAO,QAAQ,CAAC,CAAA;AAEvD,IAAA,uBACE,IAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,gBAAA;AAAA,QACX,UAAA,EAAS,eAAA;AAAA,QACT,kBAAA,EAAkB,UAAA;AAAA,QAClB,GAAA,EAAK,YAAA,CAAa,CAAC,GAAA,EAAK,SAAS,CAAC,CAAA;AAAA,QACjC,GAAG,IAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,IAAA,EAAA,EAAK,SAAQ,UAAA,EAAW,EAAA,EAAG,MAAK,SAAA,EAAW,MAAA,CAAO,OAAO,CAAA,EACvD,QAAA,EACH,CAAA;AAAA,0BACA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAW,MAAA,CAAO,iBAAiB,CAAA,EACvC,QAAA,kBAAA,GAAA;AAAA,YAAC,kBAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,OAAO,cAAc,CAAA;AAAA,cAChC,IAAA,EAAK,OAAA;AAAA,cACL,UAAA,EAAW,OAAA;AAAA,cACX,YAAA,EAAW,cAAA;AAAA,cACX,IAAA,EAAMA;AAAA;AAAA,WACR,EACF;AAAA;AAAA;AAAA,KACF;AAAA,EAEJ;AACF,CAAA;AAEA,YAAA,CAAa,WAAA,GAAc,cAAA;;AC1CpB,MAAM,YAAA,GAAe,UAAA;AAAA,EAC1B,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,SAAS,KAAA,EAAO,GAAG,MAAK,GAAI,KAAA;AAEzD,IAAA,MAAM,gBAAA,GAAmB,EAAA,CAAG,MAAA,CAAO,QAAQ,GAAG,SAAA,EAAW;AAAA,MACvD,CAAC,MAAA,CAAO,QAAQ,CAAC,GAAG;AAAA,KACrB,CAAA;AAED,IAAA,uBACE,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,gBAAA;AAAA,QACX,UAAA,EAAS,eAAA;AAAA,QACT,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA,EAEJ;AACF,CAAA;AAEA,YAAA,CAAa,WAAA,GAAc,cAAA;;ACPpB,MAAM,aAAA,GAAgB,UAAA;AAAA,EAC3B,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,SAAS,KAAA,EAAO,GAAG,MAAK,GAAI,KAAA;AACzD,IAAA,MAAM,EAAE,SAAA,EAAU,GAAI,gBAAA,EAAiB;AACvC,IAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAI,SAAS,CAAC,CAAA;AAElD,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,MAAM,gBAAgB,SAAA,EAAW,OAAA;AACjC,MAAA,IAAI,CAAC,MAAA,IAAU,CAAC,aAAA,EAAe;AAE/B,MAAA,MAAM,eAAe,MAAM;AACzB,QAAA,eAAA,CAAgB,aAAA,CAAc,gBAAgB,CAAC,CAAA;AAAA,MACjD,CAAA;AAEA,MAAA,YAAA,EAAa;AACb,MAAA,MAAM,cAAA,GAAiB,IAAI,cAAA,CAAe,YAAY,CAAA;AACtD,MAAA,cAAA,CAAe,QAAQ,aAAa,CAAA;AAEpC,MAAA,OAAO,MAAM,eAAe,UAAA,EAAW;AAAA,IACzC,CAAA,EAAG,CAAC,MAAA,EAAQ,SAAS,CAAC,CAAA;AAEtB,IAAA,MAAM,iBAAA,GAAoB,EAAA,CAAG,MAAA,CAAO,SAAS,GAAG,SAAA,EAAW;AAAA,MACzD,CAAC,MAAA,CAAO,QAAQ,CAAC,GAAG;AAAA,KACrB,CAAA;AAED,IAAA,MAAM,cAAc,MAAA,GAAS,EAAE,KAAK,CAAA,EAAG,YAAY,MAAK,GAAI,MAAA;AAE5D,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,iBAAA;AAAA,QACX,UAAA,EAAS,gBAAA;AAAA,QACT,GAAA;AAAA,QACA,OAAO,EAAE,GAAG,WAAA,EAAa,GAAG,KAAK,KAAA,EAAM;AAAA,QACtC,GAAG,IAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA,EAEJ;AACF,CAAA;AAEA,aAAA,CAAc,WAAA,GAAc,eAAA;;AC+BrB,MAAM,SAAS,MAAA,CAAO,MAAA;AAAA,EAC3B,UAAA,CAA2C,SAAS,WAAA,CAAY,KAAA,EAAO,GAAA,EAAK;AAC1E,IAAA,MAAM;AAAA,MACJ,SAAA;AAAA,MACA,IAAA,GAAO,KAAA;AAAA,MACP,QAAA;AAAA,MACA,OAAA;AAAA,MACA,SAAA;AAAA,MACA,UAAA,GAAa,KAAA;AAAA,MACb,oBAAA,GAAuB,KAAA;AAAA,MACvB,cAAA;AAAA,MACA,0BAAA,GAA6B,KAAA;AAAA,MAC7B,IAAA;AAAA,MACA,oBAAA;AAAA,MACA,oBAAA;AAAA,MACA,uBAAA;AAAA,MACA,qBAAA;AAAA,MACA,wBAAA;AAAA,MACA,oBAAA;AAAA,MACA,qBAAA;AAAA,MACA,wBAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,MAAM,KAAA,GAAQ,OAA0B,IAAI,CAAA;AAC5C,IAAA,MAAM,UAAA,GAAa,OAAuB,IAAI,CAAA;AAC9C,IAAA,MAAM,UAAA,GAAa,OAAuB,IAAI,CAAA;AAC9C,IAAA,MAAM,SAAA,GAAY,OAAoB,IAAI,CAAA;AAE1C,IAAA,MAAM,CAAC,cAAA,EAAgB,iBAAiB,CAAA,GACtC,SAA+C,KAAK,CAAA;AAEtD,IAAA,MAAM,wBAAwB,wBAAA,CAAyB;AAAA,MACrD;AAAA,KACD,CAAA;AAED,IAAA,MAAM,KAAK,KAAA,EAAM;AAEjB,IAAA,MAAM,EAAE,KAAA,EAAO,eAAA,EAAgB,GAAI,yBAAA,CAA0B,OAAO,IAAA,EAAM;AAAA,MACxE,oBAAA,EAAsB,YAAY,MAAM;AACtC,QAAA,oBAAA,IAAuB;AAAA,MACzB,CAAA,EAAG,CAAC,oBAAoB,CAAC,CAAA;AAAA,MACzB,uBAAA,EAAyB,YAAY,MAAM;AACzC,QAAA,uBAAA,IAA0B;AAAA,MAC5B,CAAA,EAAG,CAAC,uBAAuB,CAAC,CAAA;AAAA,MAC5B,qBAAA,EAAuB,YAAY,MAAM;AACvC,QAAA,qBAAA,IAAwB;AAAA,MAC1B,CAAA,EAAG,CAAC,qBAAqB,CAAC,CAAA;AAAA,MAC1B,wBAAA,EAA0B,YAAY,MAAM;AAC1C,QAAA,wBAAA,IAA2B;AAAA,MAC7B,CAAA,EAAG,CAAC,wBAAwB,CAAC;AAAA,KAC9B,CAAA;AAED,IAAA,MAAM,eAAA,GAAkB,OAAO,IAAI,CAAA;AAEnC,IAAA,eAAA,CAAgB,MAAM;AACpB,MAAA,IAAI,IAAA,IAAQ,CAAC,eAAA,CAAgB,OAAA,EAAS;AACpC,QAAA,qBAAA,CAAsB,cAAA;AAAA,UACpB,QAAA,CAAS,aAAA,YAAyB,WAAA,GAC9B,QAAA,CAAS,aAAA,GACT;AAAA,SACN;AAAA,MACF;AAAA,IACF,CAAA,EAAG,CAAC,IAAA,EAAM,qBAAqB,CAAC,CAAA;AAEhC,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,eAAA,CAAgB,OAAA,GAAU,IAAA;AAAA,IAC5B,CAAA,EAAG,CAAC,IAAI,CAAC,CAAA;AAET,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,UAAU,SAAA,EAAW;AACvB,QAAA,qBAAA,CAAsB,WAAA,IAAc;AAAA,MACtC;AAAA,IACF,CAAA,EAAG,CAAC,KAAA,EAAO,qBAAqB,CAAC,CAAA;AAEjC,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,UAAU,QAAA,EAAU;AACtB,QAAA,qBAAA,CAAsB,YAAA,IAAe;AAAA,MACvC;AAAA,IACF,CAAA,EAAG,CAAC,KAAA,EAAO,qBAAqB,CAAC,CAAA;AAEjC,IAAA,MAAM,6BAAA,GAAgC,OAAA;AAAA,MACpC,OAAO;AAAA,QACL,GAAG,qBAAA;AAAA,QACH,iBAAA,EAAmB,KAAA,KAAU,SAAA,IAAa,KAAA,KAAU;AAAA,OACtD,CAAA;AAAA,MACA,CAAC,uBAAuB,KAAK;AAAA,KAC/B;AAEA,IAAA,eAAA,CAAgB,MAAM;AACpB,MAAA,wBAAA,GAA2B,6BAA6B,CAAA;AAAA,IAC1D,CAAA,EAAG,CAAC,6BAA6B,CAAC,CAAA;AAGlC,IAAA,MAAM,OAAA,GAAU,OAAO,IAAI,CAAA;AAC3B,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,QAAQ,OAAA,EAAS;AACnB,QAAA,OAAA,CAAQ,OAAA,GAAU,KAAA;AAAA,MACpB;AAAA,IACF,CAAA,EAAG,CAAC,EAAA,EAAI,eAAe,CAAC,CAAA;AAExB,IAAA,MAAM,UAAA,GAAa,GAAG,CAAC,MAAA,CAAO,QAAQ,eAAA,CAAgB,MAAM,GAAG,SAAA,EAAW;AAAA,MACxE,CAAC,MAAA,CAAO,SAAS,CAAC,GAAG,KAAA,KAAU,SAAA;AAAA,MAC/B,CAAC,MAAA,CAAO,YAAY,CAAC,GAAG,UAAA;AAAA,MACxB,GAAI,IAAA,IAAQ,IAAA,KAAS,QAAA,IAAY,EAAE,CAAC,MAAA,CAAO,IAAI,CAAC,GAAG,IAAA;AAAK,KACzD,CAAA;AAED,IAAA,MAAM,EAAE,UAAA,EAAW,GAAI,qBAAA,CAAsB,UAAA,EAAY;AAAA,MACvD,aAAA,EAAe;AAAA,KAChB,CAAA;AAED,IAAA,mBAAA,CAAoB;AAAA,MAClB,IAAA,EAAM,eAAA;AAAA,MACN,EAAA;AAAA,MACA,oBAAA;AAAA,MACA,UAAA,EAAY;AAAA,KACb,CAAA;AAGD,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,IAAA,EAAM;AACR,QAAA,aAAA,CAAc,EAAE,CAAA;AAAA,MAClB,CAAA,MAAO;AACL,QAAA,eAAA,CAAgB,EAAE,CAAA;AAAA,MACpB;AAGA,MAAA,OAAO,MAAM;AACX,QAAA,eAAA,CAAgB,EAAE,CAAA;AAAA,MACpB,CAAA;AAAA,IACF,CAAA,EAAG,CAAC,IAAA,EAAM,EAAE,CAAC,CAAA;AAEb,IAAA,iBAAA,CAAkB;AAAA,MAChB,mBAAA,EAAqB,CAAC,CAAA,KAAM;AAC1B,QAAA,IAAI,CAAC,IAAA,EAAM;AACX,QAAA,cAAA,GAAiB,CAAC,CAAA;AAAA,MACpB,CAAA;AAAA,MACA,OAAA,EAAS;AAAA,QACP,UAAA,CAAW,OAAA;AAAA,QACX,UAAA,CAAW;AAAA,OACb;AAAA,MACA,gBAAgB,MAAM;AACpB,QAAA,IAAI,0BAAA,IAA8B,CAAC,IAAA,EAAM;AACzC,QAAA,OAAA,IAAU;AAAA,MACZ,CAAA;AAAA,MACA,OAAA,EAAS;AAAA,KACV,CAAA;AAED,IAAA,MAAM,YAAA,GAAe,WAAA,CAAY,CAACC,WAAAA,KAAmC;AACnE,MAAA,OACEA,WAAAA,CAAW,IAAA;AAAA,QACT,CAAC,SAAA,KAAc,SAAA,CAAU,OAAA,CAAQ,GAAA,KAAQ;AAAA,OAC3C,IAAKA,YAAW,CAAC,CAAA;AAAA,IAErB,CAAA,EAAG,EAAE,CAAA;AAEL,IAAA,eAAA,CAAgB,KAAA,EAAO;AAAA,MACrB,cAAc,oBAAA,IAAwB;AAAA,KACvC,CAAA;AAED,IAAA,MAAM,gBAAA,GAAmB,CAAC,CAAA,KAAwC;AAChE,MAAA,SAAA,GAAY,CAAC,CAAA;AACb,MAAA,IAAI,CAAA,CAAE,SAAS,QAAA,EAAU;AACvB,QAAA,CAAA,CAAE,cAAA,EAAe;AACjB,QAAA,IAAI,oBAAA,EAAsB;AAC1B,QAAA,IAAI,cAAA,EAAgB;AACpB,QAAA,OAAA,IAAU;AACV,QAAA;AAAA,MACF;AAEA,MAAA,IAAI,CAAA,CAAE,SAAS,KAAA,EAAO;AACpB,QAAA,IAAI,EAAE,QAAA,IAAY,CAAA,CAAE,MAAA,KAAW,UAAA,GAAa,CAAC,CAAA,EAAG;AAC9C,UAAA,CAAA,CAAE,cAAA,EAAe;AACjB,UAAC,UAAA,CAAW,UAAA,CAAW,MAAA,GAAS,CAAC,GAAmB,KAAA,EAAM;AAC1D,UAAA;AAAA,QACF;AACA,QAAA,IAAI,CAAA,CAAE,WAAW,UAAA,GAAa,UAAA,CAAW,SAAS,CAAC,CAAA,IAAK,CAAC,CAAA,CAAE,QAAA,EAAU;AACnE,UAAA,CAAA,CAAE,cAAA,EAAe;AACjB,UAAA,UAAA,CAAW,CAAC,EAAE,KAAA,EAAM;AACpB,UAAA;AAAA,QACF;AAAA,MACF;AAAA,IACF,CAAA;AAEA,IAAA;AAAA;AAAA,sBAEE,IAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACC,SAAA,EAAW,UAAA;AAAA,UACX,UAAA,EAAS,QAAA;AAAA,UACT,0BAAA,EAA0B,oBAAA;AAAA,UAC1B,2BAAA,EAA2B,KAAA;AAAA,UAC3B,GAAA,EAAK,YAAA,CAAa,CAAC,GAAA,EAAK,KAAK,CAAC,CAAA;AAAA,UAC9B,SAAA,EAAW,gBAAA;AAAA,UACV,GAAG,IAAA;AAAA,UAEJ,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,aAAA,EAAA,EAAc,eAAA,EAAiB,IAAA,EAC9B,QAAA,kBAAA,GAAA,CAAC,cAAA,EAAA,EACC,QAAA,kBAAA,GAAA,CAAC,cAAA,EAAA,EAAe,EAAA,EAAG,gBAAA,EAAiB,GAAA,EAAK,UAAA,EAAY,CAAA,EACvD,CAAA,EACF,CAAA;AAAA,4BAEA,GAAA,CAAC,gBAAA,CAAiB,QAAA,EAAjB,EAA0B,OAAO,6BAAA,EAChC,QAAA,kBAAA,GAAA;AAAA,cAAC,aAAA,CAAc,QAAA;AAAA,cAAd;AAAA,gBACC,KAAA,EAAO;AAAA,kBACL,KAAA,EAAO,MAAM,OAAA,IAAU;AAAA,kBACvB,GAAA,EAAK,KAAA;AAAA,kBACL,cAAA;AAAA,kBACA,iBAAA;AAAA,kBACA,SAAA;AAAA,kBACA;AAAA,iBACF;AAAA,gBAEA,QAAA,kBAAA,GAAA;AAAA,kBAAC,SAAA;AAAA,kBAAA;AAAA,oBACC,GAAA,EAAK,UAAA;AAAA,oBACL,SAAA,EAAW,OAAO,WAAW,CAAA;AAAA,oBAC7B,WAAA,EAAW,IAAA;AAAA,oBAEV;AAAA;AAAA;AACH;AAAA,aACF,EACF;AAAA;AAAA;AAAA;AACF;AAAA,EAEJ,CAAC,CAAA;AAAA,EACD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAeE,MAAA,EAAQ,YAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAiBR,MAAA,EAAQ,YAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAgBR,OAAA,EAAS,aAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAeT,YAAA,EAAc;AAAA;AAElB;AACA,MAAA,CAAO,WAAA,GAAc,QAAA;;;;"}
package/dist/Dialog.css CHANGED
@@ -1,4 +1,4 @@
1
- .anvil2{@layer starter, reset, base, state, application;._dialog_1ac4h_1 {
1
+ .anvil2 {._dialog_1ac4h_1 {
2
2
  --a2-mod-dialog-animation-offset: var(--a2-size-6, 1.5rem);
3
3
  --a2-mod-dialog-backdrop-color: var(--a2-dialog-backdrop-color, var(--a2-color-neutral-900, #1a1a1a));
4
4
  --a2-mod-dialog-background-color: var(--a2-dialog-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
package/dist/Dialog.js CHANGED
@@ -1,2 +1,2 @@
1
- export { D as Dialog, D as default } from './Dialog-DGmF6qx3.js';
1
+ export { D as Dialog, D as default } from './Dialog-ByTyuybu.js';
2
2
  //# sourceMappingURL=Dialog.js.map
package/dist/Divider.css CHANGED
@@ -1,4 +1,4 @@
1
- .anvil2{@layer starter, reset, base, state, application;._container_klljw_1 {
1
+ .anvil2 {._container_klljw_1 {
2
2
  --a2-mod-divider-border-color: var(--a2-divider-border-color, var(--a2-border-color-subdued, light-dark(var(--a2-color-neutral-80, #e6e6e6), var(--a2-color-neutral-700, #404040))));
3
3
  --a2-mod-divider-spacing: 0;
4
4
  all: unset;
package/dist/DndSort.css CHANGED
@@ -1,4 +1,4 @@
1
- .anvil2{@layer starter, reset, base, state, application;/* Base */._card_1roww_2[data-anv=draggable-card] {
1
+ .anvil2 {/* Base */._card_1roww_2[data-anv=draggable-card] {
2
2
  --a2-mod-dnd-handle-size: var(--a2-size-8, 2rem);
3
3
  font-weight: normal;
4
4
  line-height: normal;
@@ -1,18 +1,18 @@
1
1
  import { jsx, jsxs } from 'react/jsx-runtime';
2
2
  import { useContext, forwardRef, useState, useEffect, useRef, useId, useCallback, useLayoutEffect, useMemo } from 'react';
3
3
  import { S as SvgClose } from './close-DZj38AEh.js';
4
- import { T as Text } from './Text-J5YtSSXY.js';
4
+ import { T as Text } from './Text-BH8gglCL.js';
5
5
  import { B as Button } from './Button-Bnt8XUI7.js';
6
6
  import { D as DrawerContext } from './DrawerContext-BSpnzXVZ.js';
7
7
  import { c as childrenToString } from './childrenToString-Bz9MqbHb.js';
8
8
  import { useTrackingId } from './useTrackingId.js';
9
9
  import { c as cx } from './index-De1g9FRV.js';
10
10
  import { u as useMergeRefs } from './useMergeRefs-Dfmtq9cI.js';
11
- import { a as ToastProvider, b as ToasterPopover, c as ToasterContent } from './Toaster-Bq42x6Gx.js';
11
+ import { a as ToastProvider, b as ToasterPopover, c as ToasterContent } from './Toaster-BV8RjmIN.js';
12
12
  import { d as drillDownStyles, D as DrillDownContext } from './DrillDown.module-D1Bf9_yP.js';
13
13
  import { u as useDrillDownContextState, a as useDialogTransitionStates, b as useKeyboardFocusables, c as useInitialFocus } from './useInitialFocus-BUxEDMEG.js';
14
- import { r as registerLayer, u as unregisterLayer, a as useOnClickOutside } from './useOnClickOutside-Zw5vzxSq.js';
15
14
  import { u as useDialogScrollLock } from './useDialogScrollLock-BW-aVboo.js';
15
+ import { r as registerLayer, u as unregisterLayer, a as useOnClickOutside } from './useOnClickOutside-Zw5vzxSq.js';
16
16
 
17
17
  import './Drawer.css';const drawer = "_drawer_s6o44_1";
18
18
  const remove = "_remove_s6o44_39";
@@ -259,7 +259,7 @@ const Drawer = Object.assign(
259
259
  }, [drillDownContextProviderValue]);
260
260
  const classNames = cx([styles.drawer, drillDownStyles.drawer], className, {
261
261
  [styles.remove]: state === "closing",
262
- [styles[size]]: true
262
+ [styles[size]]: size !== "medium"
263
263
  });
264
264
  const { focusables } = useKeyboardFocusables(contentRef, {
265
265
  observeChange: false
@@ -438,4 +438,4 @@ const Drawer = Object.assign(
438
438
  Drawer.displayName = "Drawer";
439
439
 
440
440
  export { Drawer as D };
441
- //# sourceMappingURL=Drawer-iewBy1DW.js.map
441
+ //# sourceMappingURL=Drawer-CwyfBcwt.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Drawer-iewBy1DW.js","sources":["../src/components/Drawer/internal/useDrawerContext.ts","../src/components/Drawer/DrawerCancelButton.tsx","../src/components/Drawer/DrawerHeader.tsx","../src/components/Drawer/DrawerFooter.tsx","../src/components/Drawer/DrawerContent.tsx","../src/components/Drawer/Drawer.tsx"],"sourcesContent":["import { useContext } from \"react\";\nimport { DrawerContext } from \"./DrawerContext\";\n\n/**\n * Hook to access the drawer context.\n *\n * @returns The drawer context containing close function and ref\n * @throws Error if used outside of a DrawerContextProvider\n */\nexport function useDrawerContext() {\n const context = useContext(DrawerContext);\n if (!context) {\n throw new Error(\n \"useDrawerContext must be used within a DrawerContextProvider\",\n );\n }\n return context;\n}\n","import { MouseEvent, forwardRef } from \"react\";\nimport { Button, ButtonProps } from \"../Button\";\nimport { DataTrackingId } from \"../../types\";\nimport { childrenToString } from \"../../internal/functions\";\nimport { useTrackingId } from \"../../hooks\";\nimport { useDrawerContext } from \"./internal/useDrawerContext\";\n\n/**\n * Props for the DrawerCancelButton component\n * @extends ButtonProps\n */\nexport type DrawerCancelButtonProps = ButtonProps & DataTrackingId;\n\n/**\n * A button component that automatically closes the drawer when clicked.\n *\n * Features:\n * - Automatically closes the drawer when clicked\n * - Extends Button component functionality\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard button props\n * - Proper focus management\n * - Can be used anywhere within the drawer context\n *\n * @example\n * <DrawerCancelButton appearance=\"ghost\" size=\"small\">\n * Cancel\n * </DrawerCancelButton>\n */\nexport const DrawerCancelButton = forwardRef<\n HTMLButtonElement,\n DrawerCancelButtonProps\n>((props, ref) => {\n const { onClick, ...rest } = props;\n const { close } = useDrawerContext();\n const data = {\n children: childrenToString(props.children),\n appearance: props.appearance,\n size: props.size,\n type: props.type,\n };\n\n const trackingId = useTrackingId({\n name: \"DrawerCancelButton\",\n data,\n hasOverride: !!props[\"data-tracking-id\"],\n });\n\n const onClickHandler = (e: MouseEvent<HTMLButtonElement>) => {\n onClick?.(e);\n close();\n };\n return (\n <Button\n aria-label=\"Close drawer\"\n data-anv=\"drawer-cancel-button\"\n data-tracking-id={trackingId}\n onClick={onClickHandler}\n ref={ref}\n {...rest}\n />\n );\n});\n\nDrawerCancelButton.displayName = \"DrawerCancelButton\";\n","import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport Close from \"@servicetitan/hammer-icon/mdi/round/close.svg\";\nimport styles from \"./Drawer.module.scss\";\nimport { Text } from \"../Text\";\nimport { DrawerCancelButton } from \"./DrawerCancelButton\";\nimport cx from \"classnames\";\nimport { DataTrackingId } from \"../../types\";\nimport { childrenToString } from \"../../internal/functions\";\nimport { useTrackingId, useMergeRefs } from \"../../hooks\";\nimport { useDrawerContext } from \"./internal/useDrawerContext\";\n\n/**\n * Props for the DrawerHeader component\n * @extends ComponentPropsWithoutRef<\"header\">\n */\nexport type DrawerHeaderProps = ComponentPropsWithoutRef<\"header\"> &\n DataTrackingId;\n\n/**\n * Header component for the drawer that displays a title and close button.\n *\n * Features:\n * - Displays the drawer title as a headline\n * - Includes an accessible close button\n * - Sticky positioning at the top of the drawer\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Automatic close functionality\n *\n * @example\n * <Drawer.Header>Settings</Drawer.Header>\n */\nexport const DrawerHeader = forwardRef<HTMLHeadElement, DrawerHeaderProps>(\n (props, ref) => {\n const { className, children } = props;\n const { headerRef } = useDrawerContext();\n const data = {\n children: childrenToString(props.children),\n };\n\n const trackingId = useTrackingId({\n name: \"DrawerHeader\",\n data,\n hasOverride: !!props[\"data-tracking-id\"],\n });\n\n const drawerHeaderClasses = cx(styles.header, className);\n\n return (\n <header\n className={drawerHeaderClasses}\n data-anv=\"drawer-header\"\n data-tracking-id={trackingId}\n ref={useMergeRefs([ref, headerRef])}\n >\n <Text variant=\"headline\" el=\"h1\">\n {children}\n </Text>\n <span className={styles[\"close-container\"]}>\n <DrawerCancelButton\n className={styles[\"close-button\"]}\n size=\"small\"\n appearance=\"ghost\"\n aria-label=\"Close drawer\"\n data-anv=\"drawer-header-close-button\"\n icon={Close}\n />\n </span>\n </header>\n );\n },\n);\n\nDrawerHeader.displayName = \"DrawerHeader\";\n","import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport styles from \"./Drawer.module.scss\";\nimport cx from \"classnames\";\n\n/**\n * Props for the DrawerFooter component\n * @extends ComponentPropsWithoutRef<\"footer\">\n */\nexport type DrawerFooterProps = ComponentPropsWithoutRef<\"footer\"> & {\n /**\n * When true, the footer will stick to the bottom of the drawer.\n * @default false\n */\n sticky?: boolean;\n};\n\n/**\n * Footer component for the drawer that displays action buttons and controls.\n *\n * Features:\n * - Flexible layout for action buttons and controls\n * - Optional sticky positioning at the bottom\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard footer element props\n * - Responsive design that adapts to content\n *\n * @example\n * <Drawer.Footer sticky>\n * <Button onClick={handleSave}>Save</Button>\n * <Button onClick={handleCancel}>Cancel</Button>\n * </Drawer.Footer>\n */\nexport const DrawerFooter = forwardRef<HTMLElement, DrawerFooterProps>(\n (props, ref) => {\n const { className, children, sticky = false, ...rest } = props;\n const drawerFooterClasses = cx(styles.footer, className, {\n [styles[\"sticky\"]]: sticky,\n });\n\n return (\n <footer\n className={drawerFooterClasses}\n data-anv=\"drawer-footer\"\n ref={ref}\n {...rest}\n >\n {children}\n </footer>\n );\n },\n);\n\nDrawerFooter.displayName = \"DrawerFooter\";\n","import {\n ComponentPropsWithoutRef,\n forwardRef,\n useEffect,\n useState,\n} from \"react\";\nimport styles from \"./Drawer.module.scss\";\nimport cx from \"classnames\";\nimport { useDrawerContext } from \"./internal/useDrawerContext\";\n\n/**\n * Props for the DrawerContent component\n * @extends ComponentPropsWithoutRef<\"div\">\n */\nexport type DrawerContentProps = ComponentPropsWithoutRef<\"div\"> & {\n /**\n * When true, the content will stick below the header during scroll.\n * @default false\n */\n sticky?: boolean;\n};\n\n/**\n * Content container for the drawer that holds the main content area.\n *\n * Features:\n * - Flexible content area with proper spacing\n * - Scrollable content when needed\n * - Optional sticky positioning below header\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard div element props\n * - Responsive design that adapts to content\n * - Proper focus management\n *\n * @example\n * // Basic content\n * <Drawer.Content>\n * <p>This is the main content of the drawer.</p>\n * </Drawer.Content>\n *\n * @example\n * // Sticky content (e.g., search field that remains visible while scrolling)\n * <Drawer.Content sticky>\n * <TextField placeholder=\"Filter results...\" />\n * </Drawer.Content>\n */\nexport const DrawerContent = forwardRef<HTMLDivElement, DrawerContentProps>(\n (props, ref) => {\n const { children, className, sticky = false, ...rest } = props;\n const { headerRef } = useDrawerContext();\n const [headerHeight, setHeaderHeight] = useState(0);\n\n useEffect(() => {\n const headerElement = headerRef?.current;\n if (!sticky || !headerElement) return;\n\n const updateHeight = () => {\n setHeaderHeight(headerElement.offsetHeight || 0);\n };\n\n updateHeight();\n const resizeObserver = new ResizeObserver(updateHeight);\n resizeObserver.observe(headerElement);\n\n return () => resizeObserver.disconnect();\n }, [sticky, headerRef]);\n\n const contentClassNames = cx(styles[\"content\"], className, {\n [styles[\"sticky\"]]: sticky,\n });\n\n const stickyStyle = sticky ? { top: `${headerHeight}px` } : undefined;\n\n return (\n <div\n className={contentClassNames}\n data-anv=\"drawer-content\"\n ref={ref}\n style={{ ...stickyStyle, ...rest.style }}\n {...rest}\n >\n {children}\n </div>\n );\n },\n);\n\nDrawerContent.displayName = \"DrawerContent\";\n","import styles from \"./Drawer.module.scss\";\nimport {\n ComponentPropsWithoutRef,\n forwardRef,\n useRef,\n useId,\n useCallback,\n useEffect,\n SyntheticEvent,\n KeyboardEvent,\n useMemo,\n useLayoutEffect,\n} from \"react\";\nimport { DrawerHeader } from \"./DrawerHeader\";\nimport { DrawerFooter } from \"./DrawerFooter\";\nimport { DrawerContent } from \"./DrawerContent\";\nimport { DrawerCancelButton } from \"./DrawerCancelButton\";\nimport {\n OpenCloseTransitionStateEffects,\n useDialogScrollLock,\n useDialogTransitionStates,\n useKeyboardFocusables,\n useOnClickOutside,\n} from \"../../internal/hooks\";\nimport {\n FocusableElement,\n DisableCloseOnEscapeOrClickProps,\n Size,\n} from \"../../types\";\nimport { registerLayer, unregisterLayer } from \"../../internal/utils\";\nimport { useMergeRefs } from \"../../hooks\";\nimport cx from \"classnames\";\nimport { ToastProvider } from \"../Toast/internal/ToastProvider\";\nimport { ToasterPopover } from \"../Toast/internal/ToasterPopover\";\nimport { ToasterContent } from \"../Toast/internal/Toaster\";\nimport { DrawerContext } from \"./internal/DrawerContext\";\nimport {\n DrillDownContext,\n DrillDownContextProps,\n} from \"../DrillDown/internal/DrillDownContext\";\nimport { useDrillDownContextState } from \"../DrillDown/internal/useDrillDownContextState\";\nimport drillDownStyles from \"../DrillDown/DrillDown.module.scss\";\nimport { useInitialFocus } from \"../Dialog/internal/useInitialFocus\";\n\n/**\n * Props for the Drawer component\n * @extends ComponentPropsWithoutRef<\"dialog\">\n * @extends DialogTransitionStateEffects\n * @extends DisableCloseOnEscapeOrClickProps\n */\nexport type DrawerProps = ComponentPropsWithoutRef<\"dialog\"> &\n OpenCloseTransitionStateEffects &\n DisableCloseOnEscapeOrClickProps & {\n /**\n * The size of the drawer.\n * @default \"medium\"\n */\n size?: Extract<Size, \"small\" | \"medium\" | \"large\" | \"xlarge\">;\n /**\n * Controls whether the drawer is open or closed.\n * @default false\n */\n open?: boolean;\n /**\n * Callback function called after the drawer is animated closed.\n */\n onClose?: () => void;\n /**\n * Callback when clicking outside the drawer\n */\n onClickOutside?: (e: globalThis.MouseEvent) => void;\n /**\n * Enables scroll chaining behavior.\n * @link https://developer.mozilla.org/en-US/docs/Glossary/Scroll_chaining\n */\n enableScrollChaining?: boolean;\n /**\n * Given an array of focusable elements, return the initial focus target.\n * @param focusables - The focusable elements to pick from\n * @returns The initial focus target\n */\n initialFocusResolver?: (focusables: FocusableElement[]) => FocusableElement;\n /**\n * Sets the default DrillDown index when used in an uncontrolled way\n */\n defaultDrillDownIndex?: DrillDownContextProps[\"index\"];\n /**\n * Callback to pass context to useDrillDown hook\n */\n onDrillDownContextChange?: (context: DrillDownContextProps) => void;\n };\n\n/**\n * A slide-out drawer component that provides a modal-like experience from the side of the screen.\n *\n * Features:\n * - Slide-in animation from the side of the screen\n * - Keyboard navigation with focus trapping\n * - Escape key and click outside to close\n * - Configurable size variants (medium, large)\n * - Built-in toast support for notifications\n * - Automatic scroll locking when open\n * - Accessible with proper ARIA attributes\n * - Compound component structure with Header, Footer, Content, and CancelButton\n * - Transition state callbacks for animation control\n * - Optional scroll chaining support\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Drawer open={isOpen} onClose={handleClose} size=\"medium\">\n * <Drawer.Header>Settings</Drawer.Header>\n * <Drawer.Content>Drawer content goes here</Drawer.Content>\n * <Drawer.Footer>\n * <Button onClick={handleSave}>Save</Button>\n * <Drawer.CancelButton>Cancel</Drawer.CancelButton>\n * </Drawer.Footer>\n * </Drawer>\n */\nexport const Drawer = Object.assign(\n forwardRef<HTMLDialogElement, DrawerProps>(function DrawerInner(props, ref) {\n const {\n className,\n open = false,\n children,\n onClose,\n // onCancel is destructured so that it is not passed to the dialog in ...rest\n onCancel,\n onKeyDown,\n disableCloseOnEscape = false,\n onClickOutside,\n disableCloseOnClickOutside = false,\n size = \"medium\",\n enableScrollChaining,\n onOpenAnimationStart,\n onOpenAnimationComplete,\n onCloseAnimationStart,\n onCloseAnimationComplete,\n initialFocusResolver,\n defaultDrillDownIndex,\n onDrillDownContextChange,\n ...rest\n } = props;\n\n const elRef = useRef<HTMLDialogElement>(null);\n const contentRef = useRef<HTMLDivElement>(null);\n const toasterRef = useRef<HTMLDivElement>(null);\n const headerRef = useRef<HTMLElement>(null);\n const combinedRef = useMergeRefs([elRef, ref]);\n\n const drillDownContextValue = useDrillDownContextState({\n defaultDrillDownIndex,\n });\n\n const id = useId();\n\n const { state, isOpenOrOpening } = useDialogTransitionStates(elRef, open, {\n onOpenAnimationStart: useCallback(() => {\n onOpenAnimationStart?.();\n }, [onOpenAnimationStart]),\n onOpenAnimationComplete: useCallback(() => {\n onOpenAnimationComplete?.();\n }, [onOpenAnimationComplete]),\n onCloseAnimationStart: useCallback(() => {\n onCloseAnimationStart?.();\n }, [onCloseAnimationStart]),\n onCloseAnimationComplete: useCallback(() => {\n onCloseAnimationComplete?.();\n }, [onCloseAnimationComplete]),\n });\n\n const previousOpenRef = useRef(open);\n\n useLayoutEffect(() => {\n if (open && !previousOpenRef.current) {\n drillDownContextValue.setHostTrigger?.(\n document.activeElement instanceof HTMLElement\n ? document.activeElement\n : null,\n );\n }\n }, [open, drillDownContextValue]);\n\n useEffect(() => {\n previousOpenRef.current = open;\n }, [open]);\n\n useEffect(() => {\n if (state === \"closing\") {\n drillDownContextValue.onHostClose?.();\n }\n }, [state, drillDownContextValue]);\n\n useEffect(() => {\n if (state === \"closed\") {\n drillDownContextValue.onHostClosed?.();\n }\n }, [state, drillDownContextValue]);\n\n const drillDownContextProviderValue = useMemo(\n () => ({\n ...drillDownContextValue,\n hostIsInteractive: state !== \"closing\" && state !== \"closed\",\n }),\n [drillDownContextValue, state],\n );\n\n useLayoutEffect(() => {\n onDrillDownContextChange?.(drillDownContextProviderValue);\n }, [drillDownContextProviderValue]); // eslint-disable-line react-hooks/exhaustive-deps\n\n const classNames = cx([styles.drawer, drillDownStyles.drawer], className, {\n [styles.remove]: state === \"closing\",\n [styles[size]]: true,\n });\n\n const { focusables } = useKeyboardFocusables(contentRef, {\n observeChange: false,\n });\n const firstFocusable = focusables?.[0];\n const lastFocusable = focusables?.[focusables.length - 1];\n\n useDialogScrollLock({\n open: isOpenOrOpening,\n id,\n enableScrollChaining,\n elementRef: elRef,\n });\n\n // Register/unregister with layer manager for proper stacking\n useEffect(() => {\n if (open) {\n registerLayer(id);\n } else {\n unregisterLayer(id);\n }\n\n // Cleanup when component unmounts\n return () => {\n unregisterLayer(id);\n };\n }, [open, id]);\n\n const computeFocus = useCallback((focusables: FocusableElement[]) => {\n return (\n focusables.find(\n (focusable) => focusable.dataset.anv !== \"drawer-header-close-button\",\n ) || focusables[0]\n );\n }, []);\n\n useInitialFocus(elRef, {\n computeFocus: initialFocusResolver || computeFocus,\n });\n\n const onCancelHandler = (e: SyntheticEvent<HTMLDialogElement>) => {\n e.preventDefault();\n\n if (disableCloseOnEscape) return;\n onClose?.();\n };\n\n useOnClickOutside({\n onClickOutsideBegin: (e) => {\n if (!open) return;\n onClickOutside?.(e);\n },\n targets: [\n contentRef.current as HTMLElement,\n toasterRef.current as HTMLElement,\n ],\n onClickOutside: () => {\n if (disableCloseOnClickOutside || !open) return;\n onClose?.();\n },\n layerId: id,\n });\n\n const onKeyDownHandler = (e: KeyboardEvent<HTMLDialogElement>) => {\n onKeyDown?.(e);\n if (e.code === \"Tab\") {\n if (e.shiftKey && e.target === firstFocusable) {\n e.preventDefault();\n (lastFocusable as HTMLElement)?.focus();\n return;\n }\n if (e.target === lastFocusable && !e.shiftKey) {\n e.preventDefault();\n (firstFocusable as HTMLElement)?.focus();\n return;\n }\n }\n };\n\n const contextValue = useMemo(() => {\n return { close: () => onClose?.(), headerRef, state };\n }, [onClose, state]);\n\n return (\n // dialog element does seem to be interactive on MDN guideline\n <dialog\n className={classNames}\n data-anv=\"drawer\"\n data-anv-scroll-chaining={enableScrollChaining}\n data-anv-transition-state={state}\n ref={combinedRef}\n onCancel={onCancelHandler}\n onKeyDown={onKeyDownHandler}\n {...rest}\n >\n <ToastProvider isDialogToaster={isOpenOrOpening}>\n <ToasterPopover>\n <ToasterContent id=\"drawer-toaster\" ref={toasterRef} />\n </ToasterPopover>\n </ToastProvider>\n\n <DrillDownContext.Provider value={drillDownContextProviderValue}>\n <DrawerContext.Provider value={contextValue}>\n <section\n ref={contentRef}\n className={styles.container}\n data-open={isOpenOrOpening}\n >\n {children}\n </section>\n </DrawerContext.Provider>\n </DrillDownContext.Provider>\n </dialog>\n );\n }),\n {\n /**\n * Header component for the drawer that displays a title and close button.\n *\n * Features:\n * - Displays the drawer title as a headline\n * - Includes an accessible close button\n * - Sticky positioning at the top of the drawer\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Automatic close functionality\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Drawer.Header>Settings</Drawer.Header>\n */\n Header: DrawerHeader,\n /**\n * Footer component for the drawer that displays action buttons and controls.\n *\n * Features:\n * - Flexible layout for action buttons and controls\n * - Optional sticky positioning at the bottom\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard footer element props\n * - Responsive design that adapts to content\n *\n * @example\n * <Drawer.Footer sticky>\n * <Button onClick={handleSave}>Save</Button>\n * <Drawer.CancelButton>Cancel</Drawer.CancelButton>\n * </Drawer.Footer>\n */\n Footer: DrawerFooter,\n /**\n * Content container for the drawer that holds the main content area.\n *\n * Features:\n * - Flexible content area with proper spacing\n * - Scrollable content when needed\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard div element props\n * - Responsive design that adapts to content\n * - Proper focus management\n *\n * @example\n * <Drawer.Content>\n * <p>This is the main content of the drawer.</p>\n * <p>It can contain any type of content.</p>\n * </Drawer.Content>\n */\n Content: DrawerContent,\n /**\n * A button component that automatically closes the drawer when clicked.\n *\n * Features:\n * - Automatically closes the drawer when clicked\n * - Extends Button component functionality\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard button props\n * - Proper focus management\n * - Can be used anywhere within the drawer context\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Drawer.CancelButton appearance=\"ghost\" size=\"small\">\n * Cancel\n * </Drawer.CancelButton>\n */\n CancelButton: DrawerCancelButton,\n },\n);\nDrawer.displayName = \"Drawer\";\n"],"names":["Close","focusables"],"mappings":"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"}
1
+ {"version":3,"file":"Drawer-CwyfBcwt.js","sources":["../src/components/Drawer/internal/useDrawerContext.ts","../src/components/Drawer/DrawerCancelButton.tsx","../src/components/Drawer/DrawerHeader.tsx","../src/components/Drawer/DrawerFooter.tsx","../src/components/Drawer/DrawerContent.tsx","../src/components/Drawer/Drawer.tsx"],"sourcesContent":["import { useContext } from \"react\";\nimport { DrawerContext } from \"./DrawerContext\";\n\n/**\n * Hook to access the drawer context.\n *\n * @returns The drawer context containing close function and ref\n * @throws Error if used outside of a DrawerContextProvider\n */\nexport function useDrawerContext() {\n const context = useContext(DrawerContext);\n if (!context) {\n throw new Error(\n \"useDrawerContext must be used within a DrawerContextProvider\",\n );\n }\n return context;\n}\n","import { MouseEvent, forwardRef } from \"react\";\nimport { Button, ButtonProps } from \"../Button\";\nimport { DataTrackingId } from \"../../types\";\nimport { childrenToString } from \"../../internal/functions\";\nimport { useTrackingId } from \"../../hooks\";\nimport { useDrawerContext } from \"./internal/useDrawerContext\";\n\n/**\n * Props for the DrawerCancelButton component\n * @extends ButtonProps\n */\nexport type DrawerCancelButtonProps = ButtonProps & DataTrackingId;\n\n/**\n * A button component that automatically closes the drawer when clicked.\n *\n * Features:\n * - Automatically closes the drawer when clicked\n * - Extends Button component functionality\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard button props\n * - Proper focus management\n * - Can be used anywhere within the drawer context\n *\n * @example\n * <DrawerCancelButton appearance=\"ghost\" size=\"small\">\n * Cancel\n * </DrawerCancelButton>\n */\nexport const DrawerCancelButton = forwardRef<\n HTMLButtonElement,\n DrawerCancelButtonProps\n>((props, ref) => {\n const { onClick, ...rest } = props;\n const { close } = useDrawerContext();\n const data = {\n children: childrenToString(props.children),\n appearance: props.appearance,\n size: props.size,\n type: props.type,\n };\n\n const trackingId = useTrackingId({\n name: \"DrawerCancelButton\",\n data,\n hasOverride: !!props[\"data-tracking-id\"],\n });\n\n const onClickHandler = (e: MouseEvent<HTMLButtonElement>) => {\n onClick?.(e);\n close();\n };\n return (\n <Button\n aria-label=\"Close drawer\"\n data-anv=\"drawer-cancel-button\"\n data-tracking-id={trackingId}\n onClick={onClickHandler}\n ref={ref}\n {...rest}\n />\n );\n});\n\nDrawerCancelButton.displayName = \"DrawerCancelButton\";\n","import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport Close from \"@servicetitan/hammer-icon/mdi/round/close.svg\";\nimport styles from \"./Drawer.module.scss\";\nimport { Text } from \"../Text\";\nimport { DrawerCancelButton } from \"./DrawerCancelButton\";\nimport cx from \"classnames\";\nimport { DataTrackingId } from \"../../types\";\nimport { childrenToString } from \"../../internal/functions\";\nimport { useTrackingId, useMergeRefs } from \"../../hooks\";\nimport { useDrawerContext } from \"./internal/useDrawerContext\";\n\n/**\n * Props for the DrawerHeader component\n * @extends ComponentPropsWithoutRef<\"header\">\n */\nexport type DrawerHeaderProps = ComponentPropsWithoutRef<\"header\"> &\n DataTrackingId;\n\n/**\n * Header component for the drawer that displays a title and close button.\n *\n * Features:\n * - Displays the drawer title as a headline\n * - Includes an accessible close button\n * - Sticky positioning at the top of the drawer\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Automatic close functionality\n *\n * @example\n * <Drawer.Header>Settings</Drawer.Header>\n */\nexport const DrawerHeader = forwardRef<HTMLHeadElement, DrawerHeaderProps>(\n (props, ref) => {\n const { className, children } = props;\n const { headerRef } = useDrawerContext();\n const data = {\n children: childrenToString(props.children),\n };\n\n const trackingId = useTrackingId({\n name: \"DrawerHeader\",\n data,\n hasOverride: !!props[\"data-tracking-id\"],\n });\n\n const drawerHeaderClasses = cx(styles.header, className);\n\n return (\n <header\n className={drawerHeaderClasses}\n data-anv=\"drawer-header\"\n data-tracking-id={trackingId}\n ref={useMergeRefs([ref, headerRef])}\n >\n <Text variant=\"headline\" el=\"h1\">\n {children}\n </Text>\n <span className={styles[\"close-container\"]}>\n <DrawerCancelButton\n className={styles[\"close-button\"]}\n size=\"small\"\n appearance=\"ghost\"\n aria-label=\"Close drawer\"\n data-anv=\"drawer-header-close-button\"\n icon={Close}\n />\n </span>\n </header>\n );\n },\n);\n\nDrawerHeader.displayName = \"DrawerHeader\";\n","import { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport styles from \"./Drawer.module.scss\";\nimport cx from \"classnames\";\n\n/**\n * Props for the DrawerFooter component\n * @extends ComponentPropsWithoutRef<\"footer\">\n */\nexport type DrawerFooterProps = ComponentPropsWithoutRef<\"footer\"> & {\n /**\n * When true, the footer will stick to the bottom of the drawer.\n * @default false\n */\n sticky?: boolean;\n};\n\n/**\n * Footer component for the drawer that displays action buttons and controls.\n *\n * Features:\n * - Flexible layout for action buttons and controls\n * - Optional sticky positioning at the bottom\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard footer element props\n * - Responsive design that adapts to content\n *\n * @example\n * <Drawer.Footer sticky>\n * <Button onClick={handleSave}>Save</Button>\n * <Button onClick={handleCancel}>Cancel</Button>\n * </Drawer.Footer>\n */\nexport const DrawerFooter = forwardRef<HTMLElement, DrawerFooterProps>(\n (props, ref) => {\n const { className, children, sticky = false, ...rest } = props;\n const drawerFooterClasses = cx(styles.footer, className, {\n [styles[\"sticky\"]]: sticky,\n });\n\n return (\n <footer\n className={drawerFooterClasses}\n data-anv=\"drawer-footer\"\n ref={ref}\n {...rest}\n >\n {children}\n </footer>\n );\n },\n);\n\nDrawerFooter.displayName = \"DrawerFooter\";\n","import {\n ComponentPropsWithoutRef,\n forwardRef,\n useEffect,\n useState,\n} from \"react\";\nimport styles from \"./Drawer.module.scss\";\nimport cx from \"classnames\";\nimport { useDrawerContext } from \"./internal/useDrawerContext\";\n\n/**\n * Props for the DrawerContent component\n * @extends ComponentPropsWithoutRef<\"div\">\n */\nexport type DrawerContentProps = ComponentPropsWithoutRef<\"div\"> & {\n /**\n * When true, the content will stick below the header during scroll.\n * @default false\n */\n sticky?: boolean;\n};\n\n/**\n * Content container for the drawer that holds the main content area.\n *\n * Features:\n * - Flexible content area with proper spacing\n * - Scrollable content when needed\n * - Optional sticky positioning below header\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard div element props\n * - Responsive design that adapts to content\n * - Proper focus management\n *\n * @example\n * // Basic content\n * <Drawer.Content>\n * <p>This is the main content of the drawer.</p>\n * </Drawer.Content>\n *\n * @example\n * // Sticky content (e.g., search field that remains visible while scrolling)\n * <Drawer.Content sticky>\n * <TextField placeholder=\"Filter results...\" />\n * </Drawer.Content>\n */\nexport const DrawerContent = forwardRef<HTMLDivElement, DrawerContentProps>(\n (props, ref) => {\n const { children, className, sticky = false, ...rest } = props;\n const { headerRef } = useDrawerContext();\n const [headerHeight, setHeaderHeight] = useState(0);\n\n useEffect(() => {\n const headerElement = headerRef?.current;\n if (!sticky || !headerElement) return;\n\n const updateHeight = () => {\n setHeaderHeight(headerElement.offsetHeight || 0);\n };\n\n updateHeight();\n const resizeObserver = new ResizeObserver(updateHeight);\n resizeObserver.observe(headerElement);\n\n return () => resizeObserver.disconnect();\n }, [sticky, headerRef]);\n\n const contentClassNames = cx(styles[\"content\"], className, {\n [styles[\"sticky\"]]: sticky,\n });\n\n const stickyStyle = sticky ? { top: `${headerHeight}px` } : undefined;\n\n return (\n <div\n className={contentClassNames}\n data-anv=\"drawer-content\"\n ref={ref}\n style={{ ...stickyStyle, ...rest.style }}\n {...rest}\n >\n {children}\n </div>\n );\n },\n);\n\nDrawerContent.displayName = \"DrawerContent\";\n","import styles from \"./Drawer.module.scss\";\nimport {\n ComponentPropsWithoutRef,\n forwardRef,\n useRef,\n useId,\n useCallback,\n useEffect,\n SyntheticEvent,\n KeyboardEvent,\n useMemo,\n useLayoutEffect,\n} from \"react\";\nimport { DrawerHeader } from \"./DrawerHeader\";\nimport { DrawerFooter } from \"./DrawerFooter\";\nimport { DrawerContent } from \"./DrawerContent\";\nimport { DrawerCancelButton } from \"./DrawerCancelButton\";\nimport {\n OpenCloseTransitionStateEffects,\n useDialogScrollLock,\n useDialogTransitionStates,\n useKeyboardFocusables,\n useOnClickOutside,\n} from \"../../internal/hooks\";\nimport {\n FocusableElement,\n DisableCloseOnEscapeOrClickProps,\n Size,\n} from \"../../types\";\nimport { registerLayer, unregisterLayer } from \"../../internal/utils\";\nimport { useMergeRefs } from \"../../hooks\";\nimport cx from \"classnames\";\nimport { ToastProvider } from \"../Toast/internal/ToastProvider\";\nimport { ToasterPopover } from \"../Toast/internal/ToasterPopover\";\nimport { ToasterContent } from \"../Toast/internal/Toaster\";\nimport { DrawerContext } from \"./internal/DrawerContext\";\nimport {\n DrillDownContext,\n DrillDownContextProps,\n} from \"../DrillDown/internal/DrillDownContext\";\nimport { useDrillDownContextState } from \"../DrillDown/internal/useDrillDownContextState\";\nimport drillDownStyles from \"../DrillDown/DrillDown.module.scss\";\nimport { useInitialFocus } from \"../Dialog/internal/useInitialFocus\";\n\n/**\n * Props for the Drawer component\n * @extends ComponentPropsWithoutRef<\"dialog\">\n * @extends DialogTransitionStateEffects\n * @extends DisableCloseOnEscapeOrClickProps\n */\nexport type DrawerProps = ComponentPropsWithoutRef<\"dialog\"> &\n OpenCloseTransitionStateEffects &\n DisableCloseOnEscapeOrClickProps & {\n /**\n * The size of the drawer.\n * @default \"medium\"\n */\n size?: Extract<Size, \"small\" | \"medium\" | \"large\" | \"xlarge\">;\n /**\n * Controls whether the drawer is open or closed.\n * @default false\n */\n open?: boolean;\n /**\n * Callback function called after the drawer is animated closed.\n */\n onClose?: () => void;\n /**\n * Callback when clicking outside the drawer\n */\n onClickOutside?: (e: globalThis.MouseEvent) => void;\n /**\n * Enables scroll chaining behavior.\n * @link https://developer.mozilla.org/en-US/docs/Glossary/Scroll_chaining\n */\n enableScrollChaining?: boolean;\n /**\n * Given an array of focusable elements, return the initial focus target.\n * @param focusables - The focusable elements to pick from\n * @returns The initial focus target\n */\n initialFocusResolver?: (focusables: FocusableElement[]) => FocusableElement;\n /**\n * Sets the default DrillDown index when used in an uncontrolled way\n */\n defaultDrillDownIndex?: DrillDownContextProps[\"index\"];\n /**\n * Callback to pass context to useDrillDown hook\n */\n onDrillDownContextChange?: (context: DrillDownContextProps) => void;\n };\n\n/**\n * A slide-out drawer component that provides a modal-like experience from the side of the screen.\n *\n * Features:\n * - Slide-in animation from the side of the screen\n * - Keyboard navigation with focus trapping\n * - Escape key and click outside to close\n * - Configurable size variants (medium, large)\n * - Built-in toast support for notifications\n * - Automatic scroll locking when open\n * - Accessible with proper ARIA attributes\n * - Compound component structure with Header, Footer, Content, and CancelButton\n * - Transition state callbacks for animation control\n * - Optional scroll chaining support\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Drawer open={isOpen} onClose={handleClose} size=\"medium\">\n * <Drawer.Header>Settings</Drawer.Header>\n * <Drawer.Content>Drawer content goes here</Drawer.Content>\n * <Drawer.Footer>\n * <Button onClick={handleSave}>Save</Button>\n * <Drawer.CancelButton>Cancel</Drawer.CancelButton>\n * </Drawer.Footer>\n * </Drawer>\n */\nexport const Drawer = Object.assign(\n forwardRef<HTMLDialogElement, DrawerProps>(function DrawerInner(props, ref) {\n const {\n className,\n open = false,\n children,\n onClose,\n // onCancel is destructured so that it is not passed to the dialog in ...rest\n onCancel,\n onKeyDown,\n disableCloseOnEscape = false,\n onClickOutside,\n disableCloseOnClickOutside = false,\n size = \"medium\",\n enableScrollChaining,\n onOpenAnimationStart,\n onOpenAnimationComplete,\n onCloseAnimationStart,\n onCloseAnimationComplete,\n initialFocusResolver,\n defaultDrillDownIndex,\n onDrillDownContextChange,\n ...rest\n } = props;\n\n const elRef = useRef<HTMLDialogElement>(null);\n const contentRef = useRef<HTMLDivElement>(null);\n const toasterRef = useRef<HTMLDivElement>(null);\n const headerRef = useRef<HTMLElement>(null);\n const combinedRef = useMergeRefs([elRef, ref]);\n\n const drillDownContextValue = useDrillDownContextState({\n defaultDrillDownIndex,\n });\n\n const id = useId();\n\n const { state, isOpenOrOpening } = useDialogTransitionStates(elRef, open, {\n onOpenAnimationStart: useCallback(() => {\n onOpenAnimationStart?.();\n }, [onOpenAnimationStart]),\n onOpenAnimationComplete: useCallback(() => {\n onOpenAnimationComplete?.();\n }, [onOpenAnimationComplete]),\n onCloseAnimationStart: useCallback(() => {\n onCloseAnimationStart?.();\n }, [onCloseAnimationStart]),\n onCloseAnimationComplete: useCallback(() => {\n onCloseAnimationComplete?.();\n }, [onCloseAnimationComplete]),\n });\n\n const previousOpenRef = useRef(open);\n\n useLayoutEffect(() => {\n if (open && !previousOpenRef.current) {\n drillDownContextValue.setHostTrigger?.(\n document.activeElement instanceof HTMLElement\n ? document.activeElement\n : null,\n );\n }\n }, [open, drillDownContextValue]);\n\n useEffect(() => {\n previousOpenRef.current = open;\n }, [open]);\n\n useEffect(() => {\n if (state === \"closing\") {\n drillDownContextValue.onHostClose?.();\n }\n }, [state, drillDownContextValue]);\n\n useEffect(() => {\n if (state === \"closed\") {\n drillDownContextValue.onHostClosed?.();\n }\n }, [state, drillDownContextValue]);\n\n const drillDownContextProviderValue = useMemo(\n () => ({\n ...drillDownContextValue,\n hostIsInteractive: state !== \"closing\" && state !== \"closed\",\n }),\n [drillDownContextValue, state],\n );\n\n useLayoutEffect(() => {\n onDrillDownContextChange?.(drillDownContextProviderValue);\n }, [drillDownContextProviderValue]); // eslint-disable-line react-hooks/exhaustive-deps\n\n const classNames = cx([styles.drawer, drillDownStyles.drawer], className, {\n [styles.remove]: state === \"closing\",\n [styles[size]]: size !== \"medium\",\n });\n\n const { focusables } = useKeyboardFocusables(contentRef, {\n observeChange: false,\n });\n const firstFocusable = focusables?.[0];\n const lastFocusable = focusables?.[focusables.length - 1];\n\n useDialogScrollLock({\n open: isOpenOrOpening,\n id,\n enableScrollChaining,\n elementRef: elRef,\n });\n\n // Register/unregister with layer manager for proper stacking\n useEffect(() => {\n if (open) {\n registerLayer(id);\n } else {\n unregisterLayer(id);\n }\n\n // Cleanup when component unmounts\n return () => {\n unregisterLayer(id);\n };\n }, [open, id]);\n\n const computeFocus = useCallback((focusables: FocusableElement[]) => {\n return (\n focusables.find(\n (focusable) => focusable.dataset.anv !== \"drawer-header-close-button\",\n ) || focusables[0]\n );\n }, []);\n\n useInitialFocus(elRef, {\n computeFocus: initialFocusResolver || computeFocus,\n });\n\n const onCancelHandler = (e: SyntheticEvent<HTMLDialogElement>) => {\n e.preventDefault();\n\n if (disableCloseOnEscape) return;\n onClose?.();\n };\n\n useOnClickOutside({\n onClickOutsideBegin: (e) => {\n if (!open) return;\n onClickOutside?.(e);\n },\n targets: [\n contentRef.current as HTMLElement,\n toasterRef.current as HTMLElement,\n ],\n onClickOutside: () => {\n if (disableCloseOnClickOutside || !open) return;\n onClose?.();\n },\n layerId: id,\n });\n\n const onKeyDownHandler = (e: KeyboardEvent<HTMLDialogElement>) => {\n onKeyDown?.(e);\n if (e.code === \"Tab\") {\n if (e.shiftKey && e.target === firstFocusable) {\n e.preventDefault();\n (lastFocusable as HTMLElement)?.focus();\n return;\n }\n if (e.target === lastFocusable && !e.shiftKey) {\n e.preventDefault();\n (firstFocusable as HTMLElement)?.focus();\n return;\n }\n }\n };\n\n const contextValue = useMemo(() => {\n return { close: () => onClose?.(), headerRef, state };\n }, [onClose, state]);\n\n return (\n // dialog element does seem to be interactive on MDN guideline\n <dialog\n className={classNames}\n data-anv=\"drawer\"\n data-anv-scroll-chaining={enableScrollChaining}\n data-anv-transition-state={state}\n ref={combinedRef}\n onCancel={onCancelHandler}\n onKeyDown={onKeyDownHandler}\n {...rest}\n >\n <ToastProvider isDialogToaster={isOpenOrOpening}>\n <ToasterPopover>\n <ToasterContent id=\"drawer-toaster\" ref={toasterRef} />\n </ToasterPopover>\n </ToastProvider>\n\n <DrillDownContext.Provider value={drillDownContextProviderValue}>\n <DrawerContext.Provider value={contextValue}>\n <section\n ref={contentRef}\n className={styles.container}\n data-open={isOpenOrOpening}\n >\n {children}\n </section>\n </DrawerContext.Provider>\n </DrillDownContext.Provider>\n </dialog>\n );\n }),\n {\n /**\n * Header component for the drawer that displays a title and close button.\n *\n * Features:\n * - Displays the drawer title as a headline\n * - Includes an accessible close button\n * - Sticky positioning at the top of the drawer\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Automatic close functionality\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Drawer.Header>Settings</Drawer.Header>\n */\n Header: DrawerHeader,\n /**\n * Footer component for the drawer that displays action buttons and controls.\n *\n * Features:\n * - Flexible layout for action buttons and controls\n * - Optional sticky positioning at the bottom\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard footer element props\n * - Responsive design that adapts to content\n *\n * @example\n * <Drawer.Footer sticky>\n * <Button onClick={handleSave}>Save</Button>\n * <Drawer.CancelButton>Cancel</Drawer.CancelButton>\n * </Drawer.Footer>\n */\n Footer: DrawerFooter,\n /**\n * Content container for the drawer that holds the main content area.\n *\n * Features:\n * - Flexible content area with proper spacing\n * - Scrollable content when needed\n * - Proper semantic HTML structure\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard div element props\n * - Responsive design that adapts to content\n * - Proper focus management\n *\n * @example\n * <Drawer.Content>\n * <p>This is the main content of the drawer.</p>\n * <p>It can contain any type of content.</p>\n * </Drawer.Content>\n */\n Content: DrawerContent,\n /**\n * A button component that automatically closes the drawer when clicked.\n *\n * Features:\n * - Automatically closes the drawer when clicked\n * - Extends Button component functionality\n * - Accessible with proper ARIA attributes\n * - Consistent styling with the design system\n * - Supports all standard button props\n * - Proper focus management\n * - Can be used anywhere within the drawer context\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <Drawer.CancelButton appearance=\"ghost\" size=\"small\">\n * Cancel\n * </Drawer.CancelButton>\n */\n CancelButton: DrawerCancelButton,\n },\n);\nDrawer.displayName = \"Drawer\";\n"],"names":["Close","focusables"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASO,SAAS,gBAAA,GAAmB;AACjC,EAAA,MAAM,OAAA,GAAU,WAAW,aAAa,CAAA;AACxC,EAAA,IAAI,CAAC,OAAA,EAAS;AACZ,IAAA,MAAM,IAAI,KAAA;AAAA,MACR;AAAA,KACF;AAAA,EACF;AACA,EAAA,OAAO,OAAA;AACT;;ACaO,MAAM,kBAAA,GAAqB,UAAA,CAGhC,CAAC,KAAA,EAAO,GAAA,KAAQ;AAChB,EAAA,MAAM,EAAE,OAAA,EAAS,GAAG,IAAA,EAAK,GAAI,KAAA;AAC7B,EAAA,MAAM,EAAE,KAAA,EAAM,GAAI,gBAAA,EAAiB;AACnC,EAAA,MAAM,IAAA,GAAO;AAAA,IACX,QAAA,EAAU,gBAAA,CAAiB,KAAA,CAAM,QAAQ,CAAA;AAAA,IACzC,YAAY,KAAA,CAAM,UAAA;AAAA,IAClB,MAAM,KAAA,CAAM,IAAA;AAAA,IACZ,MAAM,KAAA,CAAM;AAAA,GACd;AAEA,EAAA,MAAM,aAAa,aAAA,CAAc;AAAA,IAC/B,IAAA,EAAM,oBAAA;AAAA,IACN,IAAA;AAAA,IACA,WAAA,EAAa,CAAC,CAAC,KAAA,CAAM,kBAAkB;AAAA,GACxC,CAAA;AAED,EAAA,MAAM,cAAA,GAAiB,CAAC,CAAA,KAAqC;AAC3D,IAAA,OAAA,GAAU,CAAC,CAAA;AACX,IAAA,KAAA,EAAM;AAAA,EACR,CAAA;AACA,EAAA,uBACE,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,YAAA,EAAW,cAAA;AAAA,MACX,UAAA,EAAS,sBAAA;AAAA,MACT,kBAAA,EAAkB,UAAA;AAAA,MAClB,OAAA,EAAS,cAAA;AAAA,MACT,GAAA;AAAA,MACC,GAAG;AAAA;AAAA,GACN;AAEJ,CAAC,CAAA;AAED,kBAAA,CAAmB,WAAA,GAAc,oBAAA;;AChC1B,MAAM,YAAA,GAAe,UAAA;AAAA,EAC1B,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,SAAA,EAAW,QAAA,EAAS,GAAI,KAAA;AAChC,IAAA,MAAM,EAAE,SAAA,EAAU,GAAI,gBAAA,EAAiB;AACvC,IAAA,MAAM,IAAA,GAAO;AAAA,MACX,QAAA,EAAU,gBAAA,CAAiB,KAAA,CAAM,QAAQ;AAAA,KAC3C;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,mBAAA,GAAsB,EAAA,CAAG,MAAA,CAAO,MAAA,EAAQ,SAAS,CAAA;AAEvD,IAAA,uBACE,IAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,mBAAA;AAAA,QACX,UAAA,EAAS,eAAA;AAAA,QACT,kBAAA,EAAkB,UAAA;AAAA,QAClB,GAAA,EAAK,YAAA,CAAa,CAAC,GAAA,EAAK,SAAS,CAAC,CAAA;AAAA,QAElC,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,IAAA,EAAA,EAAK,OAAA,EAAQ,UAAA,EAAW,EAAA,EAAG,MACzB,QAAA,EACH,CAAA;AAAA,0BACA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAW,MAAA,CAAO,iBAAiB,CAAA,EACvC,QAAA,kBAAA,GAAA;AAAA,YAAC,kBAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,OAAO,cAAc,CAAA;AAAA,cAChC,IAAA,EAAK,OAAA;AAAA,cACL,UAAA,EAAW,OAAA;AAAA,cACX,YAAA,EAAW,cAAA;AAAA,cACX,UAAA,EAAS,4BAAA;AAAA,cACT,IAAA,EAAMA;AAAA;AAAA,WACR,EACF;AAAA;AAAA;AAAA,KACF;AAAA,EAEJ;AACF,CAAA;AAEA,YAAA,CAAa,WAAA,GAAc,cAAA;;ACxCpB,MAAM,YAAA,GAAe,UAAA;AAAA,EAC1B,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,SAAA,EAAW,QAAA,EAAU,SAAS,KAAA,EAAO,GAAG,MAAK,GAAI,KAAA;AACzD,IAAA,MAAM,mBAAA,GAAsB,EAAA,CAAG,MAAA,CAAO,MAAA,EAAQ,SAAA,EAAW;AAAA,MACvD,CAAC,MAAA,CAAO,QAAQ,CAAC,GAAG;AAAA,KACrB,CAAA;AAED,IAAA,uBACE,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,mBAAA;AAAA,QACX,UAAA,EAAS,eAAA;AAAA,QACT,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA,EAEJ;AACF,CAAA;AAEA,YAAA,CAAa,WAAA,GAAc,cAAA;;ACNpB,MAAM,aAAA,GAAgB,UAAA;AAAA,EAC3B,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,SAAS,KAAA,EAAO,GAAG,MAAK,GAAI,KAAA;AACzD,IAAA,MAAM,EAAE,SAAA,EAAU,GAAI,gBAAA,EAAiB;AACvC,IAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAI,SAAS,CAAC,CAAA;AAElD,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,MAAM,gBAAgB,SAAA,EAAW,OAAA;AACjC,MAAA,IAAI,CAAC,MAAA,IAAU,CAAC,aAAA,EAAe;AAE/B,MAAA,MAAM,eAAe,MAAM;AACzB,QAAA,eAAA,CAAgB,aAAA,CAAc,gBAAgB,CAAC,CAAA;AAAA,MACjD,CAAA;AAEA,MAAA,YAAA,EAAa;AACb,MAAA,MAAM,cAAA,GAAiB,IAAI,cAAA,CAAe,YAAY,CAAA;AACtD,MAAA,cAAA,CAAe,QAAQ,aAAa,CAAA;AAEpC,MAAA,OAAO,MAAM,eAAe,UAAA,EAAW;AAAA,IACzC,CAAA,EAAG,CAAC,MAAA,EAAQ,SAAS,CAAC,CAAA;AAEtB,IAAA,MAAM,iBAAA,GAAoB,EAAA,CAAG,MAAA,CAAO,SAAS,GAAG,SAAA,EAAW;AAAA,MACzD,CAAC,MAAA,CAAO,QAAQ,CAAC,GAAG;AAAA,KACrB,CAAA;AAED,IAAA,MAAM,cAAc,MAAA,GAAS,EAAE,KAAK,CAAA,EAAG,YAAY,MAAK,GAAI,MAAA;AAE5D,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,iBAAA;AAAA,QACX,UAAA,EAAS,gBAAA;AAAA,QACT,GAAA;AAAA,QACA,OAAO,EAAE,GAAG,WAAA,EAAa,GAAG,KAAK,KAAA,EAAM;AAAA,QACtC,GAAG,IAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA,EAEJ;AACF,CAAA;AAEA,aAAA,CAAc,WAAA,GAAc,eAAA;;AC6BrB,MAAM,SAAS,MAAA,CAAO,MAAA;AAAA,EAC3B,UAAA,CAA2C,SAAS,WAAA,CAAY,KAAA,EAAO,GAAA,EAAK;AAC1E,IAAA,MAAM;AAAA,MACJ,SAAA;AAAA,MACA,IAAA,GAAO,KAAA;AAAA,MACP,QAAA;AAAA,MACA,OAAA;AAAA;AAAA,MAEA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,oBAAA,GAAuB,KAAA;AAAA,MACvB,cAAA;AAAA,MACA,0BAAA,GAA6B,KAAA;AAAA,MAC7B,IAAA,GAAO,QAAA;AAAA,MACP,oBAAA;AAAA,MACA,oBAAA;AAAA,MACA,uBAAA;AAAA,MACA,qBAAA;AAAA,MACA,wBAAA;AAAA,MACA,oBAAA;AAAA,MACA,qBAAA;AAAA,MACA,wBAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,MAAM,KAAA,GAAQ,OAA0B,IAAI,CAAA;AAC5C,IAAA,MAAM,UAAA,GAAa,OAAuB,IAAI,CAAA;AAC9C,IAAA,MAAM,UAAA,GAAa,OAAuB,IAAI,CAAA;AAC9C,IAAA,MAAM,SAAA,GAAY,OAAoB,IAAI,CAAA;AAC1C,IAAA,MAAM,WAAA,GAAc,YAAA,CAAa,CAAC,KAAA,EAAO,GAAG,CAAC,CAAA;AAE7C,IAAA,MAAM,wBAAwB,wBAAA,CAAyB;AAAA,MACrD;AAAA,KACD,CAAA;AAED,IAAA,MAAM,KAAK,KAAA,EAAM;AAEjB,IAAA,MAAM,EAAE,KAAA,EAAO,eAAA,EAAgB,GAAI,yBAAA,CAA0B,OAAO,IAAA,EAAM;AAAA,MACxE,oBAAA,EAAsB,YAAY,MAAM;AACtC,QAAA,oBAAA,IAAuB;AAAA,MACzB,CAAA,EAAG,CAAC,oBAAoB,CAAC,CAAA;AAAA,MACzB,uBAAA,EAAyB,YAAY,MAAM;AACzC,QAAA,uBAAA,IAA0B;AAAA,MAC5B,CAAA,EAAG,CAAC,uBAAuB,CAAC,CAAA;AAAA,MAC5B,qBAAA,EAAuB,YAAY,MAAM;AACvC,QAAA,qBAAA,IAAwB;AAAA,MAC1B,CAAA,EAAG,CAAC,qBAAqB,CAAC,CAAA;AAAA,MAC1B,wBAAA,EAA0B,YAAY,MAAM;AAC1C,QAAA,wBAAA,IAA2B;AAAA,MAC7B,CAAA,EAAG,CAAC,wBAAwB,CAAC;AAAA,KAC9B,CAAA;AAED,IAAA,MAAM,eAAA,GAAkB,OAAO,IAAI,CAAA;AAEnC,IAAA,eAAA,CAAgB,MAAM;AACpB,MAAA,IAAI,IAAA,IAAQ,CAAC,eAAA,CAAgB,OAAA,EAAS;AACpC,QAAA,qBAAA,CAAsB,cAAA;AAAA,UACpB,QAAA,CAAS,aAAA,YAAyB,WAAA,GAC9B,QAAA,CAAS,aAAA,GACT;AAAA,SACN;AAAA,MACF;AAAA,IACF,CAAA,EAAG,CAAC,IAAA,EAAM,qBAAqB,CAAC,CAAA;AAEhC,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,eAAA,CAAgB,OAAA,GAAU,IAAA;AAAA,IAC5B,CAAA,EAAG,CAAC,IAAI,CAAC,CAAA;AAET,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,UAAU,SAAA,EAAW;AACvB,QAAA,qBAAA,CAAsB,WAAA,IAAc;AAAA,MACtC;AAAA,IACF,CAAA,EAAG,CAAC,KAAA,EAAO,qBAAqB,CAAC,CAAA;AAEjC,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,UAAU,QAAA,EAAU;AACtB,QAAA,qBAAA,CAAsB,YAAA,IAAe;AAAA,MACvC;AAAA,IACF,CAAA,EAAG,CAAC,KAAA,EAAO,qBAAqB,CAAC,CAAA;AAEjC,IAAA,MAAM,6BAAA,GAAgC,OAAA;AAAA,MACpC,OAAO;AAAA,QACL,GAAG,qBAAA;AAAA,QACH,iBAAA,EAAmB,KAAA,KAAU,SAAA,IAAa,KAAA,KAAU;AAAA,OACtD,CAAA;AAAA,MACA,CAAC,uBAAuB,KAAK;AAAA,KAC/B;AAEA,IAAA,eAAA,CAAgB,MAAM;AACpB,MAAA,wBAAA,GAA2B,6BAA6B,CAAA;AAAA,IAC1D,CAAA,EAAG,CAAC,6BAA6B,CAAC,CAAA;AAElC,IAAA,MAAM,UAAA,GAAa,GAAG,CAAC,MAAA,CAAO,QAAQ,eAAA,CAAgB,MAAM,GAAG,SAAA,EAAW;AAAA,MACxE,CAAC,MAAA,CAAO,MAAM,GAAG,KAAA,KAAU,SAAA;AAAA,MAC3B,CAAC,MAAA,CAAO,IAAI,CAAC,GAAG,IAAA,KAAS;AAAA,KAC1B,CAAA;AAED,IAAA,MAAM,EAAE,UAAA,EAAW,GAAI,qBAAA,CAAsB,UAAA,EAAY;AAAA,MACvD,aAAA,EAAe;AAAA,KAChB,CAAA;AACD,IAAA,MAAM,cAAA,GAAiB,aAAa,CAAC,CAAA;AACrC,IAAA,MAAM,aAAA,GAAgB,UAAA,GAAa,UAAA,CAAW,MAAA,GAAS,CAAC,CAAA;AAExD,IAAA,mBAAA,CAAoB;AAAA,MAClB,IAAA,EAAM,eAAA;AAAA,MACN,EAAA;AAAA,MACA,oBAAA;AAAA,MACA,UAAA,EAAY;AAAA,KACb,CAAA;AAGD,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,IAAA,EAAM;AACR,QAAA,aAAA,CAAc,EAAE,CAAA;AAAA,MAClB,CAAA,MAAO;AACL,QAAA,eAAA,CAAgB,EAAE,CAAA;AAAA,MACpB;AAGA,MAAA,OAAO,MAAM;AACX,QAAA,eAAA,CAAgB,EAAE,CAAA;AAAA,MACpB,CAAA;AAAA,IACF,CAAA,EAAG,CAAC,IAAA,EAAM,EAAE,CAAC,CAAA;AAEb,IAAA,MAAM,YAAA,GAAe,WAAA,CAAY,CAACC,WAAAA,KAAmC;AACnE,MAAA,OACEA,WAAAA,CAAW,IAAA;AAAA,QACT,CAAC,SAAA,KAAc,SAAA,CAAU,OAAA,CAAQ,GAAA,KAAQ;AAAA,OAC3C,IAAKA,YAAW,CAAC,CAAA;AAAA,IAErB,CAAA,EAAG,EAAE,CAAA;AAEL,IAAA,eAAA,CAAgB,KAAA,EAAO;AAAA,MACrB,cAAc,oBAAA,IAAwB;AAAA,KACvC,CAAA;AAED,IAAA,MAAM,eAAA,GAAkB,CAAC,CAAA,KAAyC;AAChE,MAAA,CAAA,CAAE,cAAA,EAAe;AAEjB,MAAA,IAAI,oBAAA,EAAsB;AAC1B,MAAA,OAAA,IAAU;AAAA,IACZ,CAAA;AAEA,IAAA,iBAAA,CAAkB;AAAA,MAChB,mBAAA,EAAqB,CAAC,CAAA,KAAM;AAC1B,QAAA,IAAI,CAAC,IAAA,EAAM;AACX,QAAA,cAAA,GAAiB,CAAC,CAAA;AAAA,MACpB,CAAA;AAAA,MACA,OAAA,EAAS;AAAA,QACP,UAAA,CAAW,OAAA;AAAA,QACX,UAAA,CAAW;AAAA,OACb;AAAA,MACA,gBAAgB,MAAM;AACpB,QAAA,IAAI,0BAAA,IAA8B,CAAC,IAAA,EAAM;AACzC,QAAA,OAAA,IAAU;AAAA,MACZ,CAAA;AAAA,MACA,OAAA,EAAS;AAAA,KACV,CAAA;AAED,IAAA,MAAM,gBAAA,GAAmB,CAAC,CAAA,KAAwC;AAChE,MAAA,SAAA,GAAY,CAAC,CAAA;AACb,MAAA,IAAI,CAAA,CAAE,SAAS,KAAA,EAAO;AACpB,QAAA,IAAI,CAAA,CAAE,QAAA,IAAY,CAAA,CAAE,MAAA,KAAW,cAAA,EAAgB;AAC7C,UAAA,CAAA,CAAE,cAAA,EAAe;AACjB,UAAC,eAA+B,KAAA,EAAM;AACtC,UAAA;AAAA,QACF;AACA,QAAA,IAAI,CAAA,CAAE,MAAA,KAAW,aAAA,IAAiB,CAAC,EAAE,QAAA,EAAU;AAC7C,UAAA,CAAA,CAAE,cAAA,EAAe;AACjB,UAAC,gBAAgC,KAAA,EAAM;AACvC,UAAA;AAAA,QACF;AAAA,MACF;AAAA,IACF,CAAA;AAEA,IAAA,MAAM,YAAA,GAAe,QAAQ,MAAM;AACjC,MAAA,OAAO,EAAE,KAAA,EAAO,MAAM,OAAA,IAAU,EAAG,WAAW,KAAA,EAAM;AAAA,IACtD,CAAA,EAAG,CAAC,OAAA,EAAS,KAAK,CAAC,CAAA;AAEnB,IAAA;AAAA;AAAA,sBAEE,IAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACC,SAAA,EAAW,UAAA;AAAA,UACX,UAAA,EAAS,QAAA;AAAA,UACT,0BAAA,EAA0B,oBAAA;AAAA,UAC1B,2BAAA,EAA2B,KAAA;AAAA,UAC3B,GAAA,EAAK,WAAA;AAAA,UACL,QAAA,EAAU,eAAA;AAAA,UACV,SAAA,EAAW,gBAAA;AAAA,UACV,GAAG,IAAA;AAAA,UAEJ,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,aAAA,EAAA,EAAc,eAAA,EAAiB,eAAA,EAC9B,QAAA,kBAAA,GAAA,CAAC,cAAA,EAAA,EACC,QAAA,kBAAA,GAAA,CAAC,cAAA,EAAA,EAAe,EAAA,EAAG,gBAAA,EAAiB,GAAA,EAAK,UAAA,EAAY,CAAA,EACvD,CAAA,EACF,CAAA;AAAA,4BAEA,GAAA,CAAC,gBAAA,CAAiB,QAAA,EAAjB,EAA0B,KAAA,EAAO,6BAAA,EAChC,QAAA,kBAAA,GAAA,CAAC,aAAA,CAAc,QAAA,EAAd,EAAuB,KAAA,EAAO,YAAA,EAC7B,QAAA,kBAAA,GAAA;AAAA,cAAC,SAAA;AAAA,cAAA;AAAA,gBACC,GAAA,EAAK,UAAA;AAAA,gBACL,WAAW,MAAA,CAAO,SAAA;AAAA,gBAClB,WAAA,EAAW,eAAA;AAAA,gBAEV;AAAA;AAAA,eAEL,CAAA,EACF;AAAA;AAAA;AAAA;AACF;AAAA,EAEJ,CAAC,CAAA;AAAA,EACD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAiBE,MAAA,EAAQ,YAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAmBR,MAAA,EAAQ,YAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAoBR,OAAA,EAAS,aAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAmBT,YAAA,EAAc;AAAA;AAElB;AACA,MAAA,CAAO,WAAA,GAAc,QAAA;;;;"}
package/dist/Drawer.css CHANGED
@@ -1,4 +1,4 @@
1
- .anvil2{@layer starter, reset, base, state, application;._drawer_s6o44_1 {
1
+ .anvil2 {._drawer_s6o44_1 {
2
2
  --a2-mod-drawer-animation-offset: 10rem;
3
3
  --a2-mod-drawer-backdrop-color: var(--a2-drawer-backdrop-color, var(--a2-color-neutral-900, #1a1a1a));
4
4
  --a2-mod-drawer-background-color: var(--a2-drawer-background-color, var(--a2-background-color-default, light-dark(var(--a2-color-neutral-0, #ffffff), var(--a2-color-neutral-900, #1a1a1a))));
package/dist/Drawer.js CHANGED
@@ -1,2 +1,2 @@
1
- export { D as Drawer, D as default } from './Drawer-iewBy1DW.js';
1
+ export { D as Drawer, D as default } from './Drawer-CwyfBcwt.js';
2
2
  //# sourceMappingURL=Drawer.js.map
@@ -1,4 +1,4 @@
1
- .anvil2{@layer starter, reset, base, state, application;/* ============================================
1
+ .anvil2 {/* ============================================
2
2
  Drilldown Base
3
3
  ============================================ */._dialog_1byq3_4 ._drilldown_1byq3_4,
4
4
  ._drawer_1byq3_5 ._drilldown_1byq3_4,
package/dist/DrillDown.js CHANGED
@@ -1,2 +1,2 @@
1
- export { D as DrillDown, b as DrillDownContent, c as DrillDownFooter, a as DrillDownHeader, d as DrillDownNextButton, e as DrillDownPrevButton, D as default, u as useDrillDown } from './useDrilldown-D5WWJRU2.js';
1
+ export { D as DrillDown, b as DrillDownContent, c as DrillDownFooter, a as DrillDownHeader, d as DrillDownNextButton, e as DrillDownPrevButton, D as default, u as useDrillDown } from './useDrilldown-DwzT0Fse.js';
2
2
  //# sourceMappingURL=DrillDown.js.map
@@ -4,7 +4,7 @@ import * as React from 'react';
4
4
  import { forwardRef } from 'react';
5
5
  import { S as SvgCheck } from './check-Cf67OWrZ.js';
6
6
  import { C as Card } from './Card-DSFuXUGk.js';
7
- import { T as Text } from './Text-J5YtSSXY.js';
7
+ import { T as Text } from './Text-BH8gglCL.js';
8
8
  import { I as Icon } from './Icon-BMMbp40n.js';
9
9
  import { B as Button } from './Button-Bnt8XUI7.js';
10
10
  import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-CB_zHDbW.js';
@@ -109,4 +109,4 @@ const EditCard = forwardRef(
109
109
  EditCard.displayName = "EditCard";
110
110
 
111
111
  export { EditCard as E };
112
- //# sourceMappingURL=EditCard-D7-Ye7R0.js.map
112
+ //# sourceMappingURL=EditCard-DqLSnkih.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"EditCard-D7-Ye7R0.js","sources":["../../hammer-icon/mdi/round/priority_high.svg","../src/components/EditCard/EditCard.tsx"],"sourcesContent":["import * as React from \"react\";\nconst SvgPriorityHigh = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", width: \"1em\", height: \"1em\", viewBox: \"0 0 24 24\", ...props }, /* @__PURE__ */ React.createElement(\"circle\", { cx: 12, cy: 19, r: 2 }), /* @__PURE__ */ React.createElement(\"path\", { d: \"M12 3c-1.1 0-2 .9-2 2v8c0 1.1.9 2 2 2s2-.9 2-2V5c0-1.1-.9-2-2-2z\" }));\nexport default SvgPriorityHigh;\n","import cx from \"classnames\";\nimport styles from \"./EditCard.module.scss\";\nimport { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { LayoutUtilProps } from \"../../types\";\nimport Check from \"@servicetitan/hammer-icon/mdi/round/check.svg\";\nimport PriorityHigh from \"@servicetitan/hammer-icon/mdi/round/priority_high.svg\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\nimport { Card } from \"../Card\";\nimport { Text } from \"../Text\";\nimport { Icon } from \"../Icon\";\nimport { Button } from \"../Button\";\n\n/**\n * Props for the EditCard component\n * @extends ComponentPropsWithoutRef<\"div\">\n * @extends LayoutUtilProps\n */\nexport type EditCardProps = ComponentPropsWithoutRef<\"div\"> &\n LayoutUtilProps & {\n /**\n * The header text to display. Can be a string or an object mapping states to different text.\n */\n headerText:\n | string\n | {\n \"not started\": string;\n \"in progress\": string;\n error: string;\n complete: string;\n };\n /**\n * The current state of the edit card.\n */\n state: EditCardState;\n /**\n * Text to display on the save button.\n * @default \"Save\"\n */\n saveButtonText?: string;\n /**\n * Text to display on the edit button.\n * @default \"Edit\"\n */\n editButtonText?: string;\n /**\n * Whether to disable the edit button.\n * @default false\n */\n disableEdit?: boolean;\n /**\n * Whether to disable the save button.\n * @default false\n */\n disableSave?: boolean;\n /**\n * Callback function called when the state changes.\n */\n onStateChange?: (changeType: EditCardChange) => void;\n };\n\n/**\n * The type of state change that can occur.\n * @property {\"edit\"} edit - User clicked the edit button to start editing\n * @property {\"save\"} save - User clicked the save button to save changes\n * @property {\"cancel\"} cancel - User clicked the cancel button to discard changes\n */\nexport type EditCardChange = \"edit\" | \"save\" | \"cancel\";\n\n/**\n * The current state of the edit card.\n * @property {\"not started\"} not started - Initial state, content is not being edited\n * @property {\"in progress\"} in progress - User is currently editing the content\n * @property {\"error\"} error - An error occurred during the edit process\n * @property {\"complete\"} complete - Edit was successfully completed\n */\nexport type EditCardState =\n | \"not started\"\n | \"in progress\"\n | \"error\"\n | \"complete\";\n\n/**\n * EditCard component for managing editable content with different states and actions.\n *\n * Features:\n * - Four distinct states: not started, in progress, error, and complete\n * - Visual indicators for each state with appropriate icons\n * - Dynamic header text that can change based on state\n * - Edit and save buttons with customizable text\n * - Optional button disabling for different states\n * - State change callbacks for handling user interactions\n * - Built on Card component with consistent styling\n * - Supports layout utilities for positioning and spacing\n * - Accessible with proper ARIA attributes\n * - Visual state indicators with color-coded borders\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <EditCard\n * headerText=\"User Profile\"\n * state=\"not started\"\n * onStateChange={(change) => console.log(change)}\n * >\n * <Text>Profile information goes here</Text>\n * </EditCard>\n */\nexport const EditCard = forwardRef<HTMLDivElement, EditCardProps>(\n (props, ref) => {\n const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n const {\n children,\n className,\n style,\n headerText,\n state,\n editButtonText = \"Edit\",\n saveButtonText = \"Save\",\n disableEdit = false,\n disableSave = false,\n onStateChange,\n ...rest\n } = componentProps;\n\n const kebabState = state?.replaceAll(\" \", \"-\");\n\n const editCardClassNames = cx(\n styles[\"edit-card\"],\n styles[`edit-card-${kebabState}`],\n className,\n );\n\n return (\n <Card\n padding=\"large\"\n className={editCardClassNames}\n data-anv=\"edit-card\"\n style={style}\n ref={ref}\n {...rest}\n >\n <div\n className={cx(styles.indicator, styles[`indicator-${kebabState}`])}\n >\n {state === \"complete\" && <Icon svg={Check} />}\n {state === \"error\" && <Icon svg={PriorityHigh} />}\n </div>\n <div className={styles.container}>\n <div className={styles.header}>\n <Text className={styles.heading} variant=\"headline\" el=\"h3\">\n {typeof headerText === \"string\" ? headerText : headerText[state]}\n </Text>\n {state !== \"in progress\" && (\n <Button\n disabled={disableEdit}\n onClick={() => onStateChange?.(\"edit\")}\n >\n {editButtonText}\n </Button>\n )}\n </div>\n {children && (\n <div className={styles.content} style={layoutStyles}>\n {children}\n </div>\n )}\n {state === \"in progress\" && (\n <div className={styles.footer}>\n <Button onClick={() => onStateChange?.(\"cancel\")}>Cancel</Button>\n <Button\n appearance=\"primary\"\n onClick={() => onStateChange?.(\"save\")}\n disabled={disableSave}\n >\n {saveButtonText}\n </Button>\n </div>\n )}\n </div>\n </Card>\n );\n },\n);\n\nEditCard.displayName = \"EditCard\";\n"],"names":["Check","PriorityHigh"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACA,MAAM,eAAe,GAAG,CAAC,KAAK,qBAAqB,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,4BAA4B,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,KAAK,EAAE,kBAAkB,KAAK,CAAC,aAAa,CAAC,QAAQ,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,kBAAkB,KAAK,CAAC,aAAa,CAAC,MAAM,EAAE,EAAE,CAAC,EAAE,kEAAkE,EAAE,CAAC,CAAC;;ACyG7W,MAAM,QAAA,GAAW,UAAA;AAAA,EACtB,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,YAAA,EAAc,cAAA,EAAe,GAAI,mBAAmB,KAAK,CAAA;AACjE,IAAA,MAAM;AAAA,MACJ,QAAA;AAAA,MACA,SAAA;AAAA,MACA,KAAA;AAAA,MACA,UAAA;AAAA,MACA,KAAA;AAAA,MACA,cAAA,GAAiB,MAAA;AAAA,MACjB,cAAA,GAAiB,MAAA;AAAA,MACjB,WAAA,GAAc,KAAA;AAAA,MACd,WAAA,GAAc,KAAA;AAAA,MACd,aAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,cAAA;AAEJ,IAAA,MAAM,UAAA,GAAa,KAAA,EAAO,UAAA,CAAW,GAAA,EAAK,GAAG,CAAA;AAE7C,IAAA,MAAM,kBAAA,GAAqB,EAAA;AAAA,MACzB,OAAO,WAAW,CAAA;AAAA,MAClB,MAAA,CAAO,CAAA,UAAA,EAAa,UAAU,CAAA,CAAE,CAAA;AAAA,MAChC;AAAA,KACF;AAEA,IAAA,uBACE,IAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,OAAA,EAAQ,OAAA;AAAA,QACR,SAAA,EAAW,kBAAA;AAAA,QACX,UAAA,EAAS,WAAA;AAAA,QACT,KAAA;AAAA,QACA,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,0BAAA,IAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,GAAG,MAAA,CAAO,SAAA,EAAW,OAAO,CAAA,UAAA,EAAa,UAAU,EAAE,CAAC,CAAA;AAAA,cAEhE,QAAA,EAAA;AAAA,gBAAA,KAAA,KAAU,UAAA,oBAAc,GAAA,CAAC,IAAA,EAAA,EAAK,GAAA,EAAKA,QAAA,EAAO,CAAA;AAAA,gBAC1C,KAAA,KAAU,OAAA,oBAAW,GAAA,CAAC,IAAA,EAAA,EAAK,KAAKC,eAAA,EAAc;AAAA;AAAA;AAAA,WACjD;AAAA,0BACA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,SAAA,EACrB,QAAA,EAAA;AAAA,4BAAA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,MAAA,EACrB,QAAA,EAAA;AAAA,8BAAA,GAAA,CAAC,IAAA,EAAA,EAAK,SAAA,EAAW,MAAA,CAAO,OAAA,EAAS,SAAQ,UAAA,EAAW,EAAA,EAAG,IAAA,EACpD,QAAA,EAAA,OAAO,UAAA,KAAe,QAAA,GAAW,UAAA,GAAa,UAAA,CAAW,KAAK,CAAA,EACjE,CAAA;AAAA,cACC,UAAU,aAAA,oBACT,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,QAAA,EAAU,WAAA;AAAA,kBACV,OAAA,EAAS,MAAM,aAAA,GAAgB,MAAM,CAAA;AAAA,kBAEpC,QAAA,EAAA;AAAA;AAAA;AACH,aAAA,EAEJ,CAAA;AAAA,YACC,QAAA,wBACE,KAAA,EAAA,EAAI,SAAA,EAAW,OAAO,OAAA,EAAS,KAAA,EAAO,cACpC,QAAA,EACH,CAAA;AAAA,YAED,UAAU,aAAA,oBACT,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,OAAO,MAAA,EACrB,QAAA,EAAA;AAAA,8BAAA,GAAA,CAAC,UAAO,OAAA,EAAS,MAAM,aAAA,GAAgB,QAAQ,GAAG,QAAA,EAAA,QAAA,EAAM,CAAA;AAAA,8BACxD,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,UAAA,EAAW,SAAA;AAAA,kBACX,OAAA,EAAS,MAAM,aAAA,GAAgB,MAAM,CAAA;AAAA,kBACrC,QAAA,EAAU,WAAA;AAAA,kBAET,QAAA,EAAA;AAAA;AAAA;AACH,aAAA,EACF;AAAA,WAAA,EAEJ;AAAA;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;AAEA,QAAA,CAAS,WAAA,GAAc,UAAA;;;;"}
1
+ {"version":3,"file":"EditCard-DqLSnkih.js","sources":["../../hammer-icon/mdi/round/priority_high.svg","../src/components/EditCard/EditCard.tsx"],"sourcesContent":["import * as React from \"react\";\nconst SvgPriorityHigh = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", width: \"1em\", height: \"1em\", viewBox: \"0 0 24 24\", ...props }, /* @__PURE__ */ React.createElement(\"circle\", { cx: 12, cy: 19, r: 2 }), /* @__PURE__ */ React.createElement(\"path\", { d: \"M12 3c-1.1 0-2 .9-2 2v8c0 1.1.9 2 2 2s2-.9 2-2V5c0-1.1-.9-2-2-2z\" }));\nexport default SvgPriorityHigh;\n","import cx from \"classnames\";\nimport styles from \"./EditCard.module.scss\";\nimport { ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { LayoutUtilProps } from \"../../types\";\nimport Check from \"@servicetitan/hammer-icon/mdi/round/check.svg\";\nimport PriorityHigh from \"@servicetitan/hammer-icon/mdi/round/priority_high.svg\";\nimport { useLayoutPropsUtil } from \"../../internal/hooks\";\nimport { Card } from \"../Card\";\nimport { Text } from \"../Text\";\nimport { Icon } from \"../Icon\";\nimport { Button } from \"../Button\";\n\n/**\n * Props for the EditCard component\n * @extends ComponentPropsWithoutRef<\"div\">\n * @extends LayoutUtilProps\n */\nexport type EditCardProps = ComponentPropsWithoutRef<\"div\"> &\n LayoutUtilProps & {\n /**\n * The header text to display. Can be a string or an object mapping states to different text.\n */\n headerText:\n | string\n | {\n \"not started\": string;\n \"in progress\": string;\n error: string;\n complete: string;\n };\n /**\n * The current state of the edit card.\n */\n state: EditCardState;\n /**\n * Text to display on the save button.\n * @default \"Save\"\n */\n saveButtonText?: string;\n /**\n * Text to display on the edit button.\n * @default \"Edit\"\n */\n editButtonText?: string;\n /**\n * Whether to disable the edit button.\n * @default false\n */\n disableEdit?: boolean;\n /**\n * Whether to disable the save button.\n * @default false\n */\n disableSave?: boolean;\n /**\n * Callback function called when the state changes.\n */\n onStateChange?: (changeType: EditCardChange) => void;\n };\n\n/**\n * The type of state change that can occur.\n * @property {\"edit\"} edit - User clicked the edit button to start editing\n * @property {\"save\"} save - User clicked the save button to save changes\n * @property {\"cancel\"} cancel - User clicked the cancel button to discard changes\n */\nexport type EditCardChange = \"edit\" | \"save\" | \"cancel\";\n\n/**\n * The current state of the edit card.\n * @property {\"not started\"} not started - Initial state, content is not being edited\n * @property {\"in progress\"} in progress - User is currently editing the content\n * @property {\"error\"} error - An error occurred during the edit process\n * @property {\"complete\"} complete - Edit was successfully completed\n */\nexport type EditCardState =\n | \"not started\"\n | \"in progress\"\n | \"error\"\n | \"complete\";\n\n/**\n * EditCard component for managing editable content with different states and actions.\n *\n * Features:\n * - Four distinct states: not started, in progress, error, and complete\n * - Visual indicators for each state with appropriate icons\n * - Dynamic header text that can change based on state\n * - Edit and save buttons with customizable text\n * - Optional button disabling for different states\n * - State change callbacks for handling user interactions\n * - Built on Card component with consistent styling\n * - Supports layout utilities for positioning and spacing\n * - Accessible with proper ARIA attributes\n * - Visual state indicators with color-coded borders\n * - Automatic tracking ID generation for analytics\n *\n * @example\n * <EditCard\n * headerText=\"User Profile\"\n * state=\"not started\"\n * onStateChange={(change) => console.log(change)}\n * >\n * <Text>Profile information goes here</Text>\n * </EditCard>\n */\nexport const EditCard = forwardRef<HTMLDivElement, EditCardProps>(\n (props, ref) => {\n const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n const {\n children,\n className,\n style,\n headerText,\n state,\n editButtonText = \"Edit\",\n saveButtonText = \"Save\",\n disableEdit = false,\n disableSave = false,\n onStateChange,\n ...rest\n } = componentProps;\n\n const kebabState = state?.replaceAll(\" \", \"-\");\n\n const editCardClassNames = cx(\n styles[\"edit-card\"],\n styles[`edit-card-${kebabState}`],\n className,\n );\n\n return (\n <Card\n padding=\"large\"\n className={editCardClassNames}\n data-anv=\"edit-card\"\n style={style}\n ref={ref}\n {...rest}\n >\n <div\n className={cx(styles.indicator, styles[`indicator-${kebabState}`])}\n >\n {state === \"complete\" && <Icon svg={Check} />}\n {state === \"error\" && <Icon svg={PriorityHigh} />}\n </div>\n <div className={styles.container}>\n <div className={styles.header}>\n <Text className={styles.heading} variant=\"headline\" el=\"h3\">\n {typeof headerText === \"string\" ? headerText : headerText[state]}\n </Text>\n {state !== \"in progress\" && (\n <Button\n disabled={disableEdit}\n onClick={() => onStateChange?.(\"edit\")}\n >\n {editButtonText}\n </Button>\n )}\n </div>\n {children && (\n <div className={styles.content} style={layoutStyles}>\n {children}\n </div>\n )}\n {state === \"in progress\" && (\n <div className={styles.footer}>\n <Button onClick={() => onStateChange?.(\"cancel\")}>Cancel</Button>\n <Button\n appearance=\"primary\"\n onClick={() => onStateChange?.(\"save\")}\n disabled={disableSave}\n >\n {saveButtonText}\n </Button>\n </div>\n )}\n </div>\n </Card>\n );\n },\n);\n\nEditCard.displayName = \"EditCard\";\n"],"names":["Check","PriorityHigh"],"mappings":"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"}
package/dist/EditCard.css CHANGED
@@ -1,4 +1,4 @@
1
- .anvil2{@layer starter, reset, base, state, application;._edit-card_1u530_1 {
1
+ .anvil2 {._edit-card_1u530_1 {
2
2
  --a2-mod-edit-card-border-inline-start-color: var(--a2-edit-card-default-border-inline-start-color, var(--a2-border-color-subdued, light-dark(var(--a2-color-neutral-80, #e6e6e6), var(--a2-color-neutral-700, #404040))));
3
3
  --a2-mod-edit-card-border-inline-start-width: var(--a2-edit-card-default-border-inline-start-width, var(--a2-size-quarter, 0.0625rem));
4
4
  border-inline-start: var(--a2-mod-edit-card-border-inline-start-width) solid var(--a2-mod-edit-card-border-inline-start-color);
package/dist/EditCard.js CHANGED
@@ -1,2 +1,2 @@
1
- export { E as EditCard, E as default } from './EditCard-D7-Ye7R0.js';
1
+ export { E as EditCard, E as default } from './EditCard-DqLSnkih.js';
2
2
  //# sourceMappingURL=EditCard.js.map
@@ -1,4 +1,4 @@
1
- .anvil2{@layer starter, reset, base, state, application;._highlight_1v2if_1 {
1
+ .anvil2 {._highlight_1v2if_1 {
2
2
  background-color: var(--a2-background-color-warning, var(--a2-status-color-warning, light-dark(var(--a2-color-yellow-500, #ffbe00), var(--a2-color-yellow-300, #ffe278))));
3
3
  border-radius: var(--a2-border-radius-small, var(--a2-radius-1, 0.1875rem));
4
4
  padding-inline: var(--a2-size-half, 0.125rem);
@@ -9,7 +9,7 @@
9
9
  border-radius: var(--a2-border-radius-small, var(--a2-radius-1, 0.1875rem));
10
10
  padding: var(--a2-size-half, 0.125rem);
11
11
  }
12
- }.anvil2{@layer starter, reset, base, state, application;._label_1hcxw_1 {
12
+ }.anvil2 {._label_1hcxw_1 {
13
13
  --a2-mod-field-label-foreground-color: var(--a2-field-label-foreground-color, var(--a2-foreground-color-default, light-dark(var(--a2-color-neutral-950, #040404), var(--a2-color-neutral-0, #ffffff))));
14
14
  --a2-mod-field-label-required-color: var(--a2-field-label-required-color, var(--a2-foreground-color-danger, light-dark(var(--a2-color-red-600, #d62100), var(--a2-color-red-400, #ff5b3d))));
15
15
  --a2-mod-tooltip-display: flex;