@slotted/angular 0.1.0-beta.1 → 0.1.0-beta.3

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 (169) hide show
  1. package/README.md +4 -0
  2. package/docs/AGENTS.snippet.md +10 -0
  3. package/docs/app-shell.json +1 -1
  4. package/docs/button-group.json +1 -0
  5. package/docs/button-group.md +1 -1
  6. package/docs/button.json +45 -11
  7. package/docs/button.md +10 -6
  8. package/docs/chart.json +7 -0
  9. package/docs/chart.md +1 -0
  10. package/docs/checkbox.json +7 -0
  11. package/docs/checkbox.md +1 -0
  12. package/docs/currency-field.json +32 -1
  13. package/docs/currency-field.md +4 -1
  14. package/docs/dialog.examples.md +20 -0
  15. package/docs/dialog.json +14 -2
  16. package/docs/dialog.md +1 -1
  17. package/docs/event-calendar.json +7 -0
  18. package/docs/event-calendar.md +1 -0
  19. package/docs/guidelines/README.md +27 -0
  20. package/docs/guidelines/async-feedback.md +108 -0
  21. package/docs/guidelines/browsing.md +74 -0
  22. package/docs/guidelines/builders.md +97 -0
  23. package/docs/guidelines/composition.md +129 -0
  24. package/docs/guidelines/conversations.md +59 -0
  25. package/docs/guidelines/errors-and-conflicts.md +71 -0
  26. package/docs/guidelines/forms.md +192 -0
  27. package/docs/guidelines/index.md +121 -0
  28. package/docs/guidelines/layout-alignment.md +95 -0
  29. package/docs/guidelines/ledgers.md +45 -0
  30. package/docs/guidelines/list-pages.md +165 -0
  31. package/docs/guidelines/overviews.md +66 -0
  32. package/docs/guidelines/own-elements.md +115 -0
  33. package/docs/guidelines/reading-permissions.md +55 -0
  34. package/docs/guidelines/record-pages.md +178 -0
  35. package/docs/guidelines/reports.md +123 -0
  36. package/docs/guidelines/shell-composition.md +94 -0
  37. package/docs/guidelines/workspaces.md +46 -0
  38. package/docs/index.md +12 -0
  39. package/docs/list.json +19 -1
  40. package/docs/list.md +3 -1
  41. package/docs/popover.json +1 -1
  42. package/docs/progress-indicator.json +1 -2
  43. package/docs/progress-indicator.md +2 -2
  44. package/docs/segmented-control.json +29 -1
  45. package/docs/segmented-control.md +17 -1
  46. package/docs/skills/build-own-element/SKILL.md +90 -0
  47. package/docs/skills/compose-screen/SKILL.md +76 -0
  48. package/docs/skills/index.md +9 -0
  49. package/docs/skills/review-screen/SKILL.md +70 -0
  50. package/docs/skills/theme-app/SKILL.md +79 -0
  51. package/docs/skills/waiting-states/SKILL.md +139 -0
  52. package/docs/split-button.json +1 -0
  53. package/docs/split-button.md +1 -1
  54. package/docs/stat-card.json +2 -0
  55. package/docs/stat-card.md +1 -1
  56. package/docs/table.examples.md +1 -1
  57. package/docs/table.json +70 -1
  58. package/docs/table.md +10 -1
  59. package/docs/tabs.json +1 -4
  60. package/docs/tabs.md +1 -1
  61. package/docs/toggle-group.json +14 -3
  62. package/docs/toggle-group.md +3 -3
  63. package/docs/toggle.json +12 -3
  64. package/docs/toggle.md +3 -3
  65. package/docs/tokens.md +448 -0
  66. package/docs/tour.json +1 -1
  67. package/fesm2022/slotted-angular-app-shell.mjs +48 -16
  68. package/fesm2022/slotted-angular-app-shell.mjs.map +1 -1
  69. package/fesm2022/slotted-angular-button-group.mjs +4 -4
  70. package/fesm2022/slotted-angular-button-group.mjs.map +1 -1
  71. package/fesm2022/slotted-angular-button.mjs +51 -19
  72. package/fesm2022/slotted-angular-button.mjs.map +1 -1
  73. package/fesm2022/slotted-angular-cascader.mjs +1 -1
  74. package/fesm2022/slotted-angular-cascader.mjs.map +1 -1
  75. package/fesm2022/slotted-angular-chart.mjs +41 -20
  76. package/fesm2022/slotted-angular-chart.mjs.map +1 -1
  77. package/fesm2022/slotted-angular-checkbox.mjs +11 -2
  78. package/fesm2022/slotted-angular-checkbox.mjs.map +1 -1
  79. package/fesm2022/slotted-angular-column-manager.mjs +1 -1
  80. package/fesm2022/slotted-angular-column-manager.mjs.map +1 -1
  81. package/fesm2022/slotted-angular-combobox.mjs +12 -6
  82. package/fesm2022/slotted-angular-combobox.mjs.map +1 -1
  83. package/fesm2022/slotted-angular-currency-field.mjs +59 -8
  84. package/fesm2022/slotted-angular-currency-field.mjs.map +1 -1
  85. package/fesm2022/slotted-angular-dashboard-grid.mjs +18 -22
  86. package/fesm2022/slotted-angular-dashboard-grid.mjs.map +1 -1
  87. package/fesm2022/slotted-angular-data-grid.mjs +7 -3
  88. package/fesm2022/slotted-angular-data-grid.mjs.map +1 -1
  89. package/fesm2022/slotted-angular-data-list.mjs +2 -2
  90. package/fesm2022/slotted-angular-data-list.mjs.map +1 -1
  91. package/fesm2022/slotted-angular-dialog.mjs +4 -4
  92. package/fesm2022/slotted-angular-dialog.mjs.map +1 -1
  93. package/fesm2022/slotted-angular-drawer.mjs +5 -1
  94. package/fesm2022/slotted-angular-drawer.mjs.map +1 -1
  95. package/fesm2022/slotted-angular-event-calendar.mjs +18 -8
  96. package/fesm2022/slotted-angular-event-calendar.mjs.map +1 -1
  97. package/fesm2022/slotted-angular-filter-bar.mjs +8 -8
  98. package/fesm2022/slotted-angular-filter-bar.mjs.map +1 -1
  99. package/fesm2022/slotted-angular-import-export-center.mjs +1 -1
  100. package/fesm2022/slotted-angular-import-export-center.mjs.map +1 -1
  101. package/fesm2022/slotted-angular-list.mjs +28 -17
  102. package/fesm2022/slotted-angular-list.mjs.map +1 -1
  103. package/fesm2022/slotted-angular-loading-overlay.mjs +2 -2
  104. package/fesm2022/slotted-angular-markdown.mjs +1 -1
  105. package/fesm2022/slotted-angular-markdown.mjs.map +1 -1
  106. package/fesm2022/slotted-angular-multi-select.mjs +32 -27
  107. package/fesm2022/slotted-angular-multi-select.mjs.map +1 -1
  108. package/fesm2022/slotted-angular-notification-center.mjs +1 -1
  109. package/fesm2022/slotted-angular-notification-center.mjs.map +1 -1
  110. package/fesm2022/slotted-angular-number-field.mjs +2 -2
  111. package/fesm2022/slotted-angular-number-field.mjs.map +1 -1
  112. package/fesm2022/slotted-angular-progress-indicator.mjs +6 -6
  113. package/fesm2022/slotted-angular-saved-views.mjs +1 -1
  114. package/fesm2022/slotted-angular-saved-views.mjs.map +1 -1
  115. package/fesm2022/slotted-angular-segmented-control.mjs +25 -5
  116. package/fesm2022/slotted-angular-segmented-control.mjs.map +1 -1
  117. package/fesm2022/slotted-angular-select.mjs +1 -25
  118. package/fesm2022/slotted-angular-select.mjs.map +1 -1
  119. package/fesm2022/slotted-angular-split-button.mjs +4 -4
  120. package/fesm2022/slotted-angular-split-button.mjs.map +1 -1
  121. package/fesm2022/slotted-angular-stat-card.mjs +2 -2
  122. package/fesm2022/slotted-angular-stat-card.mjs.map +1 -1
  123. package/fesm2022/slotted-angular-table.mjs +97 -10
  124. package/fesm2022/slotted-angular-table.mjs.map +1 -1
  125. package/fesm2022/slotted-angular-tabs.mjs +2 -2
  126. package/fesm2022/slotted-angular-tabs.mjs.map +1 -1
  127. package/fesm2022/slotted-angular-toggle-group.mjs +17 -4
  128. package/fesm2022/slotted-angular-toggle-group.mjs.map +1 -1
  129. package/fesm2022/slotted-angular-toggle.mjs +2 -2
  130. package/fesm2022/slotted-angular-toggle.mjs.map +1 -1
  131. package/fesm2022/slotted-angular-tour.mjs +1 -1
  132. package/fesm2022/slotted-angular-tour.mjs.map +1 -1
  133. package/fesm2022/slotted-angular-transfer.mjs +1 -1
  134. package/fesm2022/slotted-angular-transfer.mjs.map +1 -1
  135. package/fesm2022/slotted-angular-upload.mjs +2 -2
  136. package/fesm2022/slotted-angular-wizard.mjs +1 -1
  137. package/fesm2022/slotted-angular-wizard.mjs.map +1 -1
  138. package/package.json +3 -3
  139. package/types/slotted-angular-app-shell.d.ts +6 -0
  140. package/types/slotted-angular-app-shell.d.ts.map +1 -1
  141. package/types/slotted-angular-button-group.d.ts +1 -1
  142. package/types/slotted-angular-button.d.ts +33 -13
  143. package/types/slotted-angular-button.d.ts.map +1 -1
  144. package/types/slotted-angular-chart.d.ts +9 -0
  145. package/types/slotted-angular-chart.d.ts.map +1 -1
  146. package/types/slotted-angular-checkbox.d.ts +7 -1
  147. package/types/slotted-angular-checkbox.d.ts.map +1 -1
  148. package/types/slotted-angular-combobox.d.ts.map +1 -1
  149. package/types/slotted-angular-currency-field.d.ts +25 -3
  150. package/types/slotted-angular-currency-field.d.ts.map +1 -1
  151. package/types/slotted-angular-dashboard-grid.d.ts.map +1 -1
  152. package/types/slotted-angular-data-grid.d.ts.map +1 -1
  153. package/types/slotted-angular-drawer.d.ts.map +1 -1
  154. package/types/slotted-angular-event-calendar.d.ts +9 -2
  155. package/types/slotted-angular-event-calendar.d.ts.map +1 -1
  156. package/types/slotted-angular-list.d.ts +42 -27
  157. package/types/slotted-angular-list.d.ts.map +1 -1
  158. package/types/slotted-angular-multi-select.d.ts +10 -0
  159. package/types/slotted-angular-multi-select.d.ts.map +1 -1
  160. package/types/slotted-angular-segmented-control.d.ts +15 -2
  161. package/types/slotted-angular-segmented-control.d.ts.map +1 -1
  162. package/types/slotted-angular-select.d.ts.map +1 -1
  163. package/types/slotted-angular-split-button.d.ts +2 -2
  164. package/types/slotted-angular-table.d.ts +43 -3
  165. package/types/slotted-angular-table.d.ts.map +1 -1
  166. package/types/slotted-angular-toggle-group.d.ts +8 -2
  167. package/types/slotted-angular-toggle-group.d.ts.map +1 -1
  168. package/types/slotted-angular-toggle.d.ts +1 -1
  169. package/types/slotted-angular-toggle.d.ts.map +1 -1
@@ -84,7 +84,7 @@ class SlButtonGroup {
84
84
  flow = computed(() => this.orientation() ?? 'horizontal', /* @ts-ignore */
85
85
  ...(ngDevMode ? [{ debugName: "flow" }] : /* istanbul ignore next */ []));
86
86
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlButtonGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
87
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.7", type: SlButtonGroup, isStandalone: true, selector: "[slButtonGroup]", inputs: { align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, justify: { classPropertyName: "justify", publicName: "justify", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, tone: { classPropertyName: "tone", publicName: "tone", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-ui": "button-group", "data-part": "root" }, properties: { "attr.role": "role", "attr.data-orientation": "orientation() ?? null", "attr.data-align": "align() ?? null", "attr.data-justify": "justify() ?? null", "attr.data-full-width": "fullWidth() ? \"\" : null" } }, providers: [provideGroupPaint()], exportAs: ["slButtonGroup"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: ["@layer slotted.components{[data-ui=button-group]{--_radius: var(--slotted-control-radius, 4px);--_overlap: calc(-1 * var(--slotted-control-border-width, 1px));--_join-main: var(--_radius);--_join-cross: 0;--_overlap-inline: var(--_overlap);--_overlap-block: 0;align-items:stretch;display:inline-flex;flex-direction:row;flex-wrap:nowrap;gap:0;isolation:isolate;min-inline-size:0}[data-ui=button-group]:empty{display:none}[data-ui=button-group][data-orientation=vertical]{--_join-main: 0;--_join-cross: var(--_radius);--_overlap-inline: 0;--_overlap-block: var(--_overlap);flex-direction:column}[data-ui=button-group][data-align=start]{align-items:start}[data-ui=button-group][data-align=center]{align-items:center}[data-ui=button-group][data-align=end]{align-items:end}[data-ui=button-group][data-align=stretch]{align-items:stretch}[data-ui=button-group][data-justify]{display:flex;inline-size:100%}[data-ui=button-group][data-justify=start]{justify-content:start}[data-ui=button-group][data-justify=center]{justify-content:center}[data-ui=button-group][data-justify=end]{justify-content:end}[data-ui=button-group][data-justify=between]{justify-content:space-between}[data-ui=button-group][data-full-width]{display:flex;inline-size:100%}[data-ui=button-group][data-full-width]:not([data-orientation=vertical])>:not([data-part=separator]){flex:1 1 0;min-inline-size:0}[data-ui=button-group]>:not([data-part=separator]):not([data-shape]){min-inline-size:0}[data-ui=button-group]>[data-shape]{flex:none}[data-ui=button-group]>:not([data-ui=button-group]){border-radius:0}[data-ui=button-group]>:not(:first-child):not([data-part=separator]){margin-block-start:var(--_overlap-block);margin-inline-start:var(--_overlap-inline)}[data-ui=button-group]>:first-child{border-end-start-radius:var(--_join-main);border-start-end-radius:var(--_join-cross);border-start-start-radius:var(--_radius)}[data-ui=button-group]>:last-child{border-end-end-radius:var(--_radius);border-end-start-radius:var(--_join-cross);border-start-end-radius:var(--_join-main)}[data-ui=button-group]>:only-child{border-radius:var(--_radius)}[data-ui=button-group] [data-ui=button-group]>:not([data-part=separator]){border-radius:0}[data-ui=button-group]>[data-ui=button-group]:first-child>:first-child{border-end-start-radius:var(--_join-main);border-start-end-radius:var(--_join-cross);border-start-start-radius:var(--_radius)}[data-ui=button-group]>[data-ui=button-group]:last-child>:last-child{border-end-end-radius:var(--_radius);border-end-start-radius:var(--_join-cross);border-start-end-radius:var(--_join-main)}[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline][data-pressed],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline][data-disabled],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline]:disabled{border-color:var(--slotted-control-border-color, ButtonBorder)}[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost][data-pressed],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost][data-disabled],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost]:disabled{border-color:transparent}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button]:not(:last-child),[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button-group]:not(:last-child)>[data-ui=button]:last-child{border-inline-end-color:transparent}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button]:not(:last-child),[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button-group]:not(:last-child)>[data-ui=button]:last-child{border-block-end-color:transparent}[data-ui=button-group]>[data-tone=accent]{--_seam: var(--slotted-tone-accent-solid-active)}[data-ui=button-group]>[data-tone=secondary]{--_seam: var(--slotted-tone-secondary-solid-active)}[data-ui=button-group]>[data-tone=success]{--_seam: var(--slotted-tone-success-solid-active)}[data-ui=button-group]>[data-tone=warning]{--_seam: var(--slotted-tone-warning-solid-active)}[data-ui=button-group]>[data-tone=danger]{--_seam: var(--slotted-tone-danger-solid-active)}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button][data-variant=solid]:not(:first-child){border-inline-start-color:var(--_seam, ButtonBorder)}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button][data-variant=solid]:not(:first-child){border-block-start-color:var(--_seam, ButtonBorder)}[data-ui=button-group]>*:focus-visible,[data-ui=button-group]>*:has(:focus-visible){z-index:1}@media(forced-colors:active){[data-ui=button-group][data-part=root]>[data-ui=button][data-pressed]{border-color:Highlight}}[data-ui=button-group]>[data-part=separator]{background:none;block-size:0;border:0;flex:none;inline-size:0;margin:0}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-part=separator]+[data-ui=button]:not([data-variant=solid]),[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-part=separator]+[data-ui=button-group]>[data-ui=button]:first-child:not([data-variant=solid]){border-inline-start-color:var(--slotted-text-muted, ButtonBorder)}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-part=separator]+[data-ui=button]:not([data-variant=solid]),[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-part=separator]+[data-ui=button-group]>[data-ui=button]:first-child:not([data-variant=solid]){border-block-start-color:var(--slotted-text-muted, ButtonBorder)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
87
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.7", type: SlButtonGroup, isStandalone: true, selector: "[slButtonGroup]", inputs: { align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, justify: { classPropertyName: "justify", publicName: "justify", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, tone: { classPropertyName: "tone", publicName: "tone", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-ui": "button-group", "data-part": "root" }, properties: { "attr.role": "role", "attr.data-orientation": "orientation() ?? null", "attr.data-align": "align() ?? null", "attr.data-justify": "justify() ?? null", "attr.data-full-width": "fullWidth() ? \"\" : null" } }, providers: [provideGroupPaint()], exportAs: ["slButtonGroup"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: ["@layer slotted.components{[data-ui=button-group]{--_radius: var(--slotted-control-radius, 4px);--_overlap: calc(-1 * var(--slotted-control-border-width, 1px));--_join-main: var(--_radius);--_join-cross: 0;--_overlap-inline: var(--_overlap);--_overlap-block: 0;align-items:stretch;display:inline-flex;flex-direction:row;flex-wrap:nowrap;gap:0;isolation:isolate;min-inline-size:0}[data-ui=button-group]:empty{display:none}[data-ui=button-group][data-orientation=vertical]{--_join-main: 0;--_join-cross: var(--_radius);--_overlap-inline: 0;--_overlap-block: var(--_overlap);flex-direction:column}[data-ui=button-group][data-align=start]{align-items:start}[data-ui=button-group][data-align=center]{align-items:center}[data-ui=button-group][data-align=end]{align-items:end}[data-ui=button-group][data-align=stretch]{align-items:stretch}[data-ui=button-group][data-justify]{display:flex;inline-size:100%}[data-ui=button-group][data-justify=start]{justify-content:start}[data-ui=button-group][data-justify=center]{justify-content:center}[data-ui=button-group][data-justify=end]{justify-content:end}[data-ui=button-group][data-justify=between]{justify-content:space-between}[data-ui=button-group][data-full-width]{display:flex;inline-size:100%}[data-ui=button-group][data-full-width]:not([data-orientation=vertical])>:not([data-part=separator]){flex:1 1 0;min-inline-size:0}[data-ui=button-group]>:not([data-part=separator]):not([data-shape]){min-inline-size:0}[data-ui=button-group]>[data-shape]{flex:none}[data-ui=button-group]>:not([data-ui=button-group]){border-radius:0}[data-ui=button-group]>:not(:first-child):not([data-part=separator]){margin-block-start:var(--_overlap-block);margin-inline-start:var(--_overlap-inline)}[data-ui=button-group]>:first-child{border-end-start-radius:var(--_join-main);border-start-end-radius:var(--_join-cross);border-start-start-radius:var(--_radius)}[data-ui=button-group]>:last-child{border-end-end-radius:var(--_radius);border-end-start-radius:var(--_join-cross);border-start-end-radius:var(--_join-main)}[data-ui=button-group]>:only-child{border-radius:var(--_radius)}[data-ui=button-group] [data-ui=button-group]>:not([data-part=separator]){border-radius:0}[data-ui=button-group]>[data-ui=button-group]:first-child>:first-child{border-end-start-radius:var(--_join-main);border-start-end-radius:var(--_join-cross);border-start-start-radius:var(--_radius)}[data-ui=button-group]>[data-ui=button-group]:last-child>:last-child{border-end-end-radius:var(--_radius);border-end-start-radius:var(--_join-cross);border-start-end-radius:var(--_join-main)}[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline][data-pressed],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline][data-disabled],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline]:disabled{border-color:var(--slotted-control-border-color, ButtonBorder)}[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost][data-pressed],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost][data-disabled],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost]:disabled{border-color:transparent}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button]:not(:last-child),[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button-group]:not(:last-child)>[data-ui=button]:last-child{border-inline-end-color:transparent}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button]:not(:last-child),[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button-group]:not(:last-child)>[data-ui=button]:last-child{border-block-end-color:transparent}[data-ui=button-group]>[data-tone=accent]{--_seam: var(--slotted-tone-accent-solid-active)}[data-ui=button-group]>[data-tone=secondary]{--_seam: var(--slotted-tone-secondary-solid-active)}[data-ui=button-group]>[data-tone=neutral]{--_seam: var(--slotted-tone-neutral-solid-active)}[data-ui=button-group]>[data-tone=success]{--_seam: var(--slotted-tone-success-solid-active)}[data-ui=button-group]>[data-tone=warning]{--_seam: var(--slotted-tone-warning-solid-active)}[data-ui=button-group]>[data-tone=danger]{--_seam: var(--slotted-tone-danger-solid-active)}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button][data-variant=solid]:not(:first-child){border-inline-start-color:var(--_seam, ButtonBorder)}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button][data-variant=solid]:not(:first-child){border-block-start-color:var(--_seam, ButtonBorder)}[data-ui=button-group]>*:focus-visible,[data-ui=button-group]>*:has(:focus-visible){z-index:1}@media(forced-colors:active){[data-ui=button-group][data-part=root]>[data-ui=button][data-pressed]{border-color:Highlight}}[data-ui=button-group]>[data-part=separator]{background:none;block-size:0;border:0;flex:none;inline-size:0;margin:0}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-part=separator]+[data-ui=button]:not([data-variant=solid]),[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-part=separator]+[data-ui=button-group]>[data-ui=button]:first-child:not([data-variant=solid]){border-inline-start-color:var(--slotted-text-muted, ButtonBorder)}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-part=separator]+[data-ui=button]:not([data-variant=solid]),[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-part=separator]+[data-ui=button-group]>[data-ui=button]:first-child:not([data-variant=solid]){border-block-start-color:var(--slotted-text-muted, ButtonBorder)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
88
88
  }
89
89
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlButtonGroup, decorators: [{
90
90
  type: Component,
@@ -96,7 +96,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
96
96
  '[attr.data-align]': 'align() ?? null',
97
97
  '[attr.data-justify]': 'justify() ?? null',
98
98
  '[attr.data-full-width]': 'fullWidth() ? "" : null',
99
- }, styles: ["@layer slotted.components{[data-ui=button-group]{--_radius: var(--slotted-control-radius, 4px);--_overlap: calc(-1 * var(--slotted-control-border-width, 1px));--_join-main: var(--_radius);--_join-cross: 0;--_overlap-inline: var(--_overlap);--_overlap-block: 0;align-items:stretch;display:inline-flex;flex-direction:row;flex-wrap:nowrap;gap:0;isolation:isolate;min-inline-size:0}[data-ui=button-group]:empty{display:none}[data-ui=button-group][data-orientation=vertical]{--_join-main: 0;--_join-cross: var(--_radius);--_overlap-inline: 0;--_overlap-block: var(--_overlap);flex-direction:column}[data-ui=button-group][data-align=start]{align-items:start}[data-ui=button-group][data-align=center]{align-items:center}[data-ui=button-group][data-align=end]{align-items:end}[data-ui=button-group][data-align=stretch]{align-items:stretch}[data-ui=button-group][data-justify]{display:flex;inline-size:100%}[data-ui=button-group][data-justify=start]{justify-content:start}[data-ui=button-group][data-justify=center]{justify-content:center}[data-ui=button-group][data-justify=end]{justify-content:end}[data-ui=button-group][data-justify=between]{justify-content:space-between}[data-ui=button-group][data-full-width]{display:flex;inline-size:100%}[data-ui=button-group][data-full-width]:not([data-orientation=vertical])>:not([data-part=separator]){flex:1 1 0;min-inline-size:0}[data-ui=button-group]>:not([data-part=separator]):not([data-shape]){min-inline-size:0}[data-ui=button-group]>[data-shape]{flex:none}[data-ui=button-group]>:not([data-ui=button-group]){border-radius:0}[data-ui=button-group]>:not(:first-child):not([data-part=separator]){margin-block-start:var(--_overlap-block);margin-inline-start:var(--_overlap-inline)}[data-ui=button-group]>:first-child{border-end-start-radius:var(--_join-main);border-start-end-radius:var(--_join-cross);border-start-start-radius:var(--_radius)}[data-ui=button-group]>:last-child{border-end-end-radius:var(--_radius);border-end-start-radius:var(--_join-cross);border-start-end-radius:var(--_join-main)}[data-ui=button-group]>:only-child{border-radius:var(--_radius)}[data-ui=button-group] [data-ui=button-group]>:not([data-part=separator]){border-radius:0}[data-ui=button-group]>[data-ui=button-group]:first-child>:first-child{border-end-start-radius:var(--_join-main);border-start-end-radius:var(--_join-cross);border-start-start-radius:var(--_radius)}[data-ui=button-group]>[data-ui=button-group]:last-child>:last-child{border-end-end-radius:var(--_radius);border-end-start-radius:var(--_join-cross);border-start-end-radius:var(--_join-main)}[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline][data-pressed],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline][data-disabled],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline]:disabled{border-color:var(--slotted-control-border-color, ButtonBorder)}[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost][data-pressed],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost][data-disabled],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost]:disabled{border-color:transparent}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button]:not(:last-child),[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button-group]:not(:last-child)>[data-ui=button]:last-child{border-inline-end-color:transparent}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button]:not(:last-child),[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button-group]:not(:last-child)>[data-ui=button]:last-child{border-block-end-color:transparent}[data-ui=button-group]>[data-tone=accent]{--_seam: var(--slotted-tone-accent-solid-active)}[data-ui=button-group]>[data-tone=secondary]{--_seam: var(--slotted-tone-secondary-solid-active)}[data-ui=button-group]>[data-tone=success]{--_seam: var(--slotted-tone-success-solid-active)}[data-ui=button-group]>[data-tone=warning]{--_seam: var(--slotted-tone-warning-solid-active)}[data-ui=button-group]>[data-tone=danger]{--_seam: var(--slotted-tone-danger-solid-active)}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button][data-variant=solid]:not(:first-child){border-inline-start-color:var(--_seam, ButtonBorder)}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button][data-variant=solid]:not(:first-child){border-block-start-color:var(--_seam, ButtonBorder)}[data-ui=button-group]>*:focus-visible,[data-ui=button-group]>*:has(:focus-visible){z-index:1}@media(forced-colors:active){[data-ui=button-group][data-part=root]>[data-ui=button][data-pressed]{border-color:Highlight}}[data-ui=button-group]>[data-part=separator]{background:none;block-size:0;border:0;flex:none;inline-size:0;margin:0}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-part=separator]+[data-ui=button]:not([data-variant=solid]),[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-part=separator]+[data-ui=button-group]>[data-ui=button]:first-child:not([data-variant=solid]){border-inline-start-color:var(--slotted-text-muted, ButtonBorder)}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-part=separator]+[data-ui=button]:not([data-variant=solid]),[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-part=separator]+[data-ui=button-group]>[data-ui=button]:first-child:not([data-variant=solid]){border-block-start-color:var(--slotted-text-muted, ButtonBorder)}}\n"] }]
99
+ }, styles: ["@layer slotted.components{[data-ui=button-group]{--_radius: var(--slotted-control-radius, 4px);--_overlap: calc(-1 * var(--slotted-control-border-width, 1px));--_join-main: var(--_radius);--_join-cross: 0;--_overlap-inline: var(--_overlap);--_overlap-block: 0;align-items:stretch;display:inline-flex;flex-direction:row;flex-wrap:nowrap;gap:0;isolation:isolate;min-inline-size:0}[data-ui=button-group]:empty{display:none}[data-ui=button-group][data-orientation=vertical]{--_join-main: 0;--_join-cross: var(--_radius);--_overlap-inline: 0;--_overlap-block: var(--_overlap);flex-direction:column}[data-ui=button-group][data-align=start]{align-items:start}[data-ui=button-group][data-align=center]{align-items:center}[data-ui=button-group][data-align=end]{align-items:end}[data-ui=button-group][data-align=stretch]{align-items:stretch}[data-ui=button-group][data-justify]{display:flex;inline-size:100%}[data-ui=button-group][data-justify=start]{justify-content:start}[data-ui=button-group][data-justify=center]{justify-content:center}[data-ui=button-group][data-justify=end]{justify-content:end}[data-ui=button-group][data-justify=between]{justify-content:space-between}[data-ui=button-group][data-full-width]{display:flex;inline-size:100%}[data-ui=button-group][data-full-width]:not([data-orientation=vertical])>:not([data-part=separator]){flex:1 1 0;min-inline-size:0}[data-ui=button-group]>:not([data-part=separator]):not([data-shape]){min-inline-size:0}[data-ui=button-group]>[data-shape]{flex:none}[data-ui=button-group]>:not([data-ui=button-group]){border-radius:0}[data-ui=button-group]>:not(:first-child):not([data-part=separator]){margin-block-start:var(--_overlap-block);margin-inline-start:var(--_overlap-inline)}[data-ui=button-group]>:first-child{border-end-start-radius:var(--_join-main);border-start-end-radius:var(--_join-cross);border-start-start-radius:var(--_radius)}[data-ui=button-group]>:last-child{border-end-end-radius:var(--_radius);border-end-start-radius:var(--_join-cross);border-start-end-radius:var(--_join-main)}[data-ui=button-group]>:only-child{border-radius:var(--_radius)}[data-ui=button-group] [data-ui=button-group]>:not([data-part=separator]){border-radius:0}[data-ui=button-group]>[data-ui=button-group]:first-child>:first-child{border-end-start-radius:var(--_join-main);border-start-end-radius:var(--_join-cross);border-start-start-radius:var(--_radius)}[data-ui=button-group]>[data-ui=button-group]:last-child>:last-child{border-end-end-radius:var(--_radius);border-end-start-radius:var(--_join-cross);border-start-end-radius:var(--_join-main)}[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline][data-pressed],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline][data-disabled],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline]:disabled{border-color:var(--slotted-control-border-color, ButtonBorder)}[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost][data-pressed],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost][data-disabled],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost]:disabled{border-color:transparent}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button]:not(:last-child),[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button-group]:not(:last-child)>[data-ui=button]:last-child{border-inline-end-color:transparent}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button]:not(:last-child),[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button-group]:not(:last-child)>[data-ui=button]:last-child{border-block-end-color:transparent}[data-ui=button-group]>[data-tone=accent]{--_seam: var(--slotted-tone-accent-solid-active)}[data-ui=button-group]>[data-tone=secondary]{--_seam: var(--slotted-tone-secondary-solid-active)}[data-ui=button-group]>[data-tone=neutral]{--_seam: var(--slotted-tone-neutral-solid-active)}[data-ui=button-group]>[data-tone=success]{--_seam: var(--slotted-tone-success-solid-active)}[data-ui=button-group]>[data-tone=warning]{--_seam: var(--slotted-tone-warning-solid-active)}[data-ui=button-group]>[data-tone=danger]{--_seam: var(--slotted-tone-danger-solid-active)}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button][data-variant=solid]:not(:first-child){border-inline-start-color:var(--_seam, ButtonBorder)}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button][data-variant=solid]:not(:first-child){border-block-start-color:var(--_seam, ButtonBorder)}[data-ui=button-group]>*:focus-visible,[data-ui=button-group]>*:has(:focus-visible){z-index:1}@media(forced-colors:active){[data-ui=button-group][data-part=root]>[data-ui=button][data-pressed]{border-color:Highlight}}[data-ui=button-group]>[data-part=separator]{background:none;block-size:0;border:0;flex:none;inline-size:0;margin:0}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-part=separator]+[data-ui=button]:not([data-variant=solid]),[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-part=separator]+[data-ui=button-group]>[data-ui=button]:first-child:not([data-variant=solid]){border-inline-start-color:var(--slotted-text-muted, ButtonBorder)}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-part=separator]+[data-ui=button]:not([data-variant=solid]),[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-part=separator]+[data-ui=button-group]>[data-ui=button]:first-child:not([data-variant=solid]){border-block-start-color:var(--slotted-text-muted, ButtonBorder)}}\n"] }]
100
100
  }], propDecorators: { align: [{ type: i0.Input, args: [{ isSignal: true, alias: "align", required: false }] }], justify: [{ type: i0.Input, args: [{ isSignal: true, alias: "justify", required: false }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], fullWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullWidth", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], tone: [{ type: i0.Input, args: [{ isSignal: true, alias: "tone", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }] } });
101
101
 
102
102
  /**
@@ -126,7 +126,7 @@ class SlButtonGroupSeparator {
126
126
  }, /* @ts-ignore */
127
127
  ...(ngDevMode ? [{ debugName: "axis" }] : /* istanbul ignore next */ []));
128
128
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlButtonGroupSeparator, deps: [], target: i0.ɵɵFactoryTarget.Component });
129
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.7", type: SlButtonGroupSeparator, isStandalone: true, selector: "[slButtonGroupSeparator]", inputs: { decorative: { classPropertyName: "decorative", publicName: "decorative", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-part": "separator" }, properties: { "attr.role": "decorative() ? \"none\" : \"separator\"", "attr.aria-hidden": "decorative() ? \"true\" : null", "attr.aria-orientation": "axis()" } }, exportAs: ["slButtonGroupSeparator"], ngImport: i0, template: '', isInline: true, styles: ["@layer slotted.components{[data-ui=button-group]{--_radius: var(--slotted-control-radius, 4px);--_overlap: calc(-1 * var(--slotted-control-border-width, 1px));--_join-main: var(--_radius);--_join-cross: 0;--_overlap-inline: var(--_overlap);--_overlap-block: 0;align-items:stretch;display:inline-flex;flex-direction:row;flex-wrap:nowrap;gap:0;isolation:isolate;min-inline-size:0}[data-ui=button-group]:empty{display:none}[data-ui=button-group][data-orientation=vertical]{--_join-main: 0;--_join-cross: var(--_radius);--_overlap-inline: 0;--_overlap-block: var(--_overlap);flex-direction:column}[data-ui=button-group][data-align=start]{align-items:start}[data-ui=button-group][data-align=center]{align-items:center}[data-ui=button-group][data-align=end]{align-items:end}[data-ui=button-group][data-align=stretch]{align-items:stretch}[data-ui=button-group][data-justify]{display:flex;inline-size:100%}[data-ui=button-group][data-justify=start]{justify-content:start}[data-ui=button-group][data-justify=center]{justify-content:center}[data-ui=button-group][data-justify=end]{justify-content:end}[data-ui=button-group][data-justify=between]{justify-content:space-between}[data-ui=button-group][data-full-width]{display:flex;inline-size:100%}[data-ui=button-group][data-full-width]:not([data-orientation=vertical])>:not([data-part=separator]){flex:1 1 0;min-inline-size:0}[data-ui=button-group]>:not([data-part=separator]):not([data-shape]){min-inline-size:0}[data-ui=button-group]>[data-shape]{flex:none}[data-ui=button-group]>:not([data-ui=button-group]){border-radius:0}[data-ui=button-group]>:not(:first-child):not([data-part=separator]){margin-block-start:var(--_overlap-block);margin-inline-start:var(--_overlap-inline)}[data-ui=button-group]>:first-child{border-end-start-radius:var(--_join-main);border-start-end-radius:var(--_join-cross);border-start-start-radius:var(--_radius)}[data-ui=button-group]>:last-child{border-end-end-radius:var(--_radius);border-end-start-radius:var(--_join-cross);border-start-end-radius:var(--_join-main)}[data-ui=button-group]>:only-child{border-radius:var(--_radius)}[data-ui=button-group] [data-ui=button-group]>:not([data-part=separator]){border-radius:0}[data-ui=button-group]>[data-ui=button-group]:first-child>:first-child{border-end-start-radius:var(--_join-main);border-start-end-radius:var(--_join-cross);border-start-start-radius:var(--_radius)}[data-ui=button-group]>[data-ui=button-group]:last-child>:last-child{border-end-end-radius:var(--_radius);border-end-start-radius:var(--_join-cross);border-start-end-radius:var(--_join-main)}[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline][data-pressed],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline][data-disabled],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline]:disabled{border-color:var(--slotted-control-border-color, ButtonBorder)}[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost][data-pressed],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost][data-disabled],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost]:disabled{border-color:transparent}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button]:not(:last-child),[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button-group]:not(:last-child)>[data-ui=button]:last-child{border-inline-end-color:transparent}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button]:not(:last-child),[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button-group]:not(:last-child)>[data-ui=button]:last-child{border-block-end-color:transparent}[data-ui=button-group]>[data-tone=accent]{--_seam: var(--slotted-tone-accent-solid-active)}[data-ui=button-group]>[data-tone=secondary]{--_seam: var(--slotted-tone-secondary-solid-active)}[data-ui=button-group]>[data-tone=success]{--_seam: var(--slotted-tone-success-solid-active)}[data-ui=button-group]>[data-tone=warning]{--_seam: var(--slotted-tone-warning-solid-active)}[data-ui=button-group]>[data-tone=danger]{--_seam: var(--slotted-tone-danger-solid-active)}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button][data-variant=solid]:not(:first-child){border-inline-start-color:var(--_seam, ButtonBorder)}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button][data-variant=solid]:not(:first-child){border-block-start-color:var(--_seam, ButtonBorder)}[data-ui=button-group]>*:focus-visible,[data-ui=button-group]>*:has(:focus-visible){z-index:1}@media(forced-colors:active){[data-ui=button-group][data-part=root]>[data-ui=button][data-pressed]{border-color:Highlight}}[data-ui=button-group]>[data-part=separator]{background:none;block-size:0;border:0;flex:none;inline-size:0;margin:0}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-part=separator]+[data-ui=button]:not([data-variant=solid]),[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-part=separator]+[data-ui=button-group]>[data-ui=button]:first-child:not([data-variant=solid]){border-inline-start-color:var(--slotted-text-muted, ButtonBorder)}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-part=separator]+[data-ui=button]:not([data-variant=solid]),[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-part=separator]+[data-ui=button-group]>[data-ui=button]:first-child:not([data-variant=solid]){border-block-start-color:var(--slotted-text-muted, ButtonBorder)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
129
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.7", type: SlButtonGroupSeparator, isStandalone: true, selector: "[slButtonGroupSeparator]", inputs: { decorative: { classPropertyName: "decorative", publicName: "decorative", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-part": "separator" }, properties: { "attr.role": "decorative() ? \"none\" : \"separator\"", "attr.aria-hidden": "decorative() ? \"true\" : null", "attr.aria-orientation": "axis()" } }, exportAs: ["slButtonGroupSeparator"], ngImport: i0, template: '', isInline: true, styles: ["@layer slotted.components{[data-ui=button-group]{--_radius: var(--slotted-control-radius, 4px);--_overlap: calc(-1 * var(--slotted-control-border-width, 1px));--_join-main: var(--_radius);--_join-cross: 0;--_overlap-inline: var(--_overlap);--_overlap-block: 0;align-items:stretch;display:inline-flex;flex-direction:row;flex-wrap:nowrap;gap:0;isolation:isolate;min-inline-size:0}[data-ui=button-group]:empty{display:none}[data-ui=button-group][data-orientation=vertical]{--_join-main: 0;--_join-cross: var(--_radius);--_overlap-inline: 0;--_overlap-block: var(--_overlap);flex-direction:column}[data-ui=button-group][data-align=start]{align-items:start}[data-ui=button-group][data-align=center]{align-items:center}[data-ui=button-group][data-align=end]{align-items:end}[data-ui=button-group][data-align=stretch]{align-items:stretch}[data-ui=button-group][data-justify]{display:flex;inline-size:100%}[data-ui=button-group][data-justify=start]{justify-content:start}[data-ui=button-group][data-justify=center]{justify-content:center}[data-ui=button-group][data-justify=end]{justify-content:end}[data-ui=button-group][data-justify=between]{justify-content:space-between}[data-ui=button-group][data-full-width]{display:flex;inline-size:100%}[data-ui=button-group][data-full-width]:not([data-orientation=vertical])>:not([data-part=separator]){flex:1 1 0;min-inline-size:0}[data-ui=button-group]>:not([data-part=separator]):not([data-shape]){min-inline-size:0}[data-ui=button-group]>[data-shape]{flex:none}[data-ui=button-group]>:not([data-ui=button-group]){border-radius:0}[data-ui=button-group]>:not(:first-child):not([data-part=separator]){margin-block-start:var(--_overlap-block);margin-inline-start:var(--_overlap-inline)}[data-ui=button-group]>:first-child{border-end-start-radius:var(--_join-main);border-start-end-radius:var(--_join-cross);border-start-start-radius:var(--_radius)}[data-ui=button-group]>:last-child{border-end-end-radius:var(--_radius);border-end-start-radius:var(--_join-cross);border-start-end-radius:var(--_join-main)}[data-ui=button-group]>:only-child{border-radius:var(--_radius)}[data-ui=button-group] [data-ui=button-group]>:not([data-part=separator]){border-radius:0}[data-ui=button-group]>[data-ui=button-group]:first-child>:first-child{border-end-start-radius:var(--_join-main);border-start-end-radius:var(--_join-cross);border-start-start-radius:var(--_radius)}[data-ui=button-group]>[data-ui=button-group]:last-child>:last-child{border-end-end-radius:var(--_radius);border-end-start-radius:var(--_join-cross);border-start-end-radius:var(--_join-main)}[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline][data-pressed],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline][data-disabled],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline]:disabled{border-color:var(--slotted-control-border-color, ButtonBorder)}[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost][data-pressed],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost][data-disabled],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost]:disabled{border-color:transparent}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button]:not(:last-child),[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button-group]:not(:last-child)>[data-ui=button]:last-child{border-inline-end-color:transparent}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button]:not(:last-child),[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button-group]:not(:last-child)>[data-ui=button]:last-child{border-block-end-color:transparent}[data-ui=button-group]>[data-tone=accent]{--_seam: var(--slotted-tone-accent-solid-active)}[data-ui=button-group]>[data-tone=secondary]{--_seam: var(--slotted-tone-secondary-solid-active)}[data-ui=button-group]>[data-tone=neutral]{--_seam: var(--slotted-tone-neutral-solid-active)}[data-ui=button-group]>[data-tone=success]{--_seam: var(--slotted-tone-success-solid-active)}[data-ui=button-group]>[data-tone=warning]{--_seam: var(--slotted-tone-warning-solid-active)}[data-ui=button-group]>[data-tone=danger]{--_seam: var(--slotted-tone-danger-solid-active)}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button][data-variant=solid]:not(:first-child){border-inline-start-color:var(--_seam, ButtonBorder)}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button][data-variant=solid]:not(:first-child){border-block-start-color:var(--_seam, ButtonBorder)}[data-ui=button-group]>*:focus-visible,[data-ui=button-group]>*:has(:focus-visible){z-index:1}@media(forced-colors:active){[data-ui=button-group][data-part=root]>[data-ui=button][data-pressed]{border-color:Highlight}}[data-ui=button-group]>[data-part=separator]{background:none;block-size:0;border:0;flex:none;inline-size:0;margin:0}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-part=separator]+[data-ui=button]:not([data-variant=solid]),[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-part=separator]+[data-ui=button-group]>[data-ui=button]:first-child:not([data-variant=solid]){border-inline-start-color:var(--slotted-text-muted, ButtonBorder)}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-part=separator]+[data-ui=button]:not([data-variant=solid]),[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-part=separator]+[data-ui=button-group]>[data-ui=button]:first-child:not([data-variant=solid]){border-block-start-color:var(--slotted-text-muted, ButtonBorder)}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
130
130
  }
131
131
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlButtonGroupSeparator, decorators: [{
132
132
  type: Component,
@@ -135,7 +135,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
135
135
  '[attr.role]': 'decorative() ? "none" : "separator"',
136
136
  '[attr.aria-hidden]': 'decorative() ? "true" : null',
137
137
  '[attr.aria-orientation]': 'axis()',
138
- }, styles: ["@layer slotted.components{[data-ui=button-group]{--_radius: var(--slotted-control-radius, 4px);--_overlap: calc(-1 * var(--slotted-control-border-width, 1px));--_join-main: var(--_radius);--_join-cross: 0;--_overlap-inline: var(--_overlap);--_overlap-block: 0;align-items:stretch;display:inline-flex;flex-direction:row;flex-wrap:nowrap;gap:0;isolation:isolate;min-inline-size:0}[data-ui=button-group]:empty{display:none}[data-ui=button-group][data-orientation=vertical]{--_join-main: 0;--_join-cross: var(--_radius);--_overlap-inline: 0;--_overlap-block: var(--_overlap);flex-direction:column}[data-ui=button-group][data-align=start]{align-items:start}[data-ui=button-group][data-align=center]{align-items:center}[data-ui=button-group][data-align=end]{align-items:end}[data-ui=button-group][data-align=stretch]{align-items:stretch}[data-ui=button-group][data-justify]{display:flex;inline-size:100%}[data-ui=button-group][data-justify=start]{justify-content:start}[data-ui=button-group][data-justify=center]{justify-content:center}[data-ui=button-group][data-justify=end]{justify-content:end}[data-ui=button-group][data-justify=between]{justify-content:space-between}[data-ui=button-group][data-full-width]{display:flex;inline-size:100%}[data-ui=button-group][data-full-width]:not([data-orientation=vertical])>:not([data-part=separator]){flex:1 1 0;min-inline-size:0}[data-ui=button-group]>:not([data-part=separator]):not([data-shape]){min-inline-size:0}[data-ui=button-group]>[data-shape]{flex:none}[data-ui=button-group]>:not([data-ui=button-group]){border-radius:0}[data-ui=button-group]>:not(:first-child):not([data-part=separator]){margin-block-start:var(--_overlap-block);margin-inline-start:var(--_overlap-inline)}[data-ui=button-group]>:first-child{border-end-start-radius:var(--_join-main);border-start-end-radius:var(--_join-cross);border-start-start-radius:var(--_radius)}[data-ui=button-group]>:last-child{border-end-end-radius:var(--_radius);border-end-start-radius:var(--_join-cross);border-start-end-radius:var(--_join-main)}[data-ui=button-group]>:only-child{border-radius:var(--_radius)}[data-ui=button-group] [data-ui=button-group]>:not([data-part=separator]){border-radius:0}[data-ui=button-group]>[data-ui=button-group]:first-child>:first-child{border-end-start-radius:var(--_join-main);border-start-end-radius:var(--_join-cross);border-start-start-radius:var(--_radius)}[data-ui=button-group]>[data-ui=button-group]:last-child>:last-child{border-end-end-radius:var(--_radius);border-end-start-radius:var(--_join-cross);border-start-end-radius:var(--_join-main)}[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline][data-pressed],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline][data-disabled],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline]:disabled{border-color:var(--slotted-control-border-color, ButtonBorder)}[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost][data-pressed],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost][data-disabled],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost]:disabled{border-color:transparent}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button]:not(:last-child),[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button-group]:not(:last-child)>[data-ui=button]:last-child{border-inline-end-color:transparent}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button]:not(:last-child),[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button-group]:not(:last-child)>[data-ui=button]:last-child{border-block-end-color:transparent}[data-ui=button-group]>[data-tone=accent]{--_seam: var(--slotted-tone-accent-solid-active)}[data-ui=button-group]>[data-tone=secondary]{--_seam: var(--slotted-tone-secondary-solid-active)}[data-ui=button-group]>[data-tone=success]{--_seam: var(--slotted-tone-success-solid-active)}[data-ui=button-group]>[data-tone=warning]{--_seam: var(--slotted-tone-warning-solid-active)}[data-ui=button-group]>[data-tone=danger]{--_seam: var(--slotted-tone-danger-solid-active)}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button][data-variant=solid]:not(:first-child){border-inline-start-color:var(--_seam, ButtonBorder)}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button][data-variant=solid]:not(:first-child){border-block-start-color:var(--_seam, ButtonBorder)}[data-ui=button-group]>*:focus-visible,[data-ui=button-group]>*:has(:focus-visible){z-index:1}@media(forced-colors:active){[data-ui=button-group][data-part=root]>[data-ui=button][data-pressed]{border-color:Highlight}}[data-ui=button-group]>[data-part=separator]{background:none;block-size:0;border:0;flex:none;inline-size:0;margin:0}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-part=separator]+[data-ui=button]:not([data-variant=solid]),[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-part=separator]+[data-ui=button-group]>[data-ui=button]:first-child:not([data-variant=solid]){border-inline-start-color:var(--slotted-text-muted, ButtonBorder)}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-part=separator]+[data-ui=button]:not([data-variant=solid]),[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-part=separator]+[data-ui=button-group]>[data-ui=button]:first-child:not([data-variant=solid]){border-block-start-color:var(--slotted-text-muted, ButtonBorder)}}\n"] }]
138
+ }, styles: ["@layer slotted.components{[data-ui=button-group]{--_radius: var(--slotted-control-radius, 4px);--_overlap: calc(-1 * var(--slotted-control-border-width, 1px));--_join-main: var(--_radius);--_join-cross: 0;--_overlap-inline: var(--_overlap);--_overlap-block: 0;align-items:stretch;display:inline-flex;flex-direction:row;flex-wrap:nowrap;gap:0;isolation:isolate;min-inline-size:0}[data-ui=button-group]:empty{display:none}[data-ui=button-group][data-orientation=vertical]{--_join-main: 0;--_join-cross: var(--_radius);--_overlap-inline: 0;--_overlap-block: var(--_overlap);flex-direction:column}[data-ui=button-group][data-align=start]{align-items:start}[data-ui=button-group][data-align=center]{align-items:center}[data-ui=button-group][data-align=end]{align-items:end}[data-ui=button-group][data-align=stretch]{align-items:stretch}[data-ui=button-group][data-justify]{display:flex;inline-size:100%}[data-ui=button-group][data-justify=start]{justify-content:start}[data-ui=button-group][data-justify=center]{justify-content:center}[data-ui=button-group][data-justify=end]{justify-content:end}[data-ui=button-group][data-justify=between]{justify-content:space-between}[data-ui=button-group][data-full-width]{display:flex;inline-size:100%}[data-ui=button-group][data-full-width]:not([data-orientation=vertical])>:not([data-part=separator]){flex:1 1 0;min-inline-size:0}[data-ui=button-group]>:not([data-part=separator]):not([data-shape]){min-inline-size:0}[data-ui=button-group]>[data-shape]{flex:none}[data-ui=button-group]>:not([data-ui=button-group]){border-radius:0}[data-ui=button-group]>:not(:first-child):not([data-part=separator]){margin-block-start:var(--_overlap-block);margin-inline-start:var(--_overlap-inline)}[data-ui=button-group]>:first-child{border-end-start-radius:var(--_join-main);border-start-end-radius:var(--_join-cross);border-start-start-radius:var(--_radius)}[data-ui=button-group]>:last-child{border-end-end-radius:var(--_radius);border-end-start-radius:var(--_join-cross);border-start-end-radius:var(--_join-main)}[data-ui=button-group]>:only-child{border-radius:var(--_radius)}[data-ui=button-group] [data-ui=button-group]>:not([data-part=separator]){border-radius:0}[data-ui=button-group]>[data-ui=button-group]:first-child>:first-child{border-end-start-radius:var(--_join-main);border-start-end-radius:var(--_join-cross);border-start-start-radius:var(--_radius)}[data-ui=button-group]>[data-ui=button-group]:last-child>:last-child{border-end-end-radius:var(--_radius);border-end-start-radius:var(--_join-cross);border-start-end-radius:var(--_join-main)}[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline][data-pressed],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline][data-disabled],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=outline]:disabled{border-color:var(--slotted-control-border-color, ButtonBorder)}[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost][data-pressed],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost][data-disabled],[data-ui=button-group][data-part=root]>[data-ui=button][data-variant=ghost]:disabled{border-color:transparent}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button]:not(:last-child),[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button-group]:not(:last-child)>[data-ui=button]:last-child{border-inline-end-color:transparent}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button]:not(:last-child),[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button-group]:not(:last-child)>[data-ui=button]:last-child{border-block-end-color:transparent}[data-ui=button-group]>[data-tone=accent]{--_seam: var(--slotted-tone-accent-solid-active)}[data-ui=button-group]>[data-tone=secondary]{--_seam: var(--slotted-tone-secondary-solid-active)}[data-ui=button-group]>[data-tone=neutral]{--_seam: var(--slotted-tone-neutral-solid-active)}[data-ui=button-group]>[data-tone=success]{--_seam: var(--slotted-tone-success-solid-active)}[data-ui=button-group]>[data-tone=warning]{--_seam: var(--slotted-tone-warning-solid-active)}[data-ui=button-group]>[data-tone=danger]{--_seam: var(--slotted-tone-danger-solid-active)}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-ui=button][data-variant=solid]:not(:first-child){border-inline-start-color:var(--_seam, ButtonBorder)}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-ui=button][data-variant=solid]:not(:first-child){border-block-start-color:var(--_seam, ButtonBorder)}[data-ui=button-group]>*:focus-visible,[data-ui=button-group]>*:has(:focus-visible){z-index:1}@media(forced-colors:active){[data-ui=button-group][data-part=root]>[data-ui=button][data-pressed]{border-color:Highlight}}[data-ui=button-group]>[data-part=separator]{background:none;block-size:0;border:0;flex:none;inline-size:0;margin:0}[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-part=separator]+[data-ui=button]:not([data-variant=solid]),[data-ui=button-group][data-part=root]:not([data-orientation=vertical])>[data-part=separator]+[data-ui=button-group]>[data-ui=button]:first-child:not([data-variant=solid]){border-inline-start-color:var(--slotted-text-muted, ButtonBorder)}[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-part=separator]+[data-ui=button]:not([data-variant=solid]),[data-ui=button-group][data-part=root][data-orientation=vertical]>[data-part=separator]+[data-ui=button-group]>[data-ui=button]:first-child:not([data-variant=solid]){border-block-start-color:var(--slotted-text-muted, ButtonBorder)}}\n"] }]
139
139
  }], propDecorators: { decorative: [{ type: i0.Input, args: [{ isSignal: true, alias: "decorative", required: false }] }] } });
140
140
 
141
141
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"slotted-angular-button-group.mjs","sources":["../../button-group/src/button-group.ts","../../button-group/src/button-group-separator.ts","../../button-group/src/slotted-angular-button-group.ts"],"sourcesContent":["import {\n booleanAttribute,\n ChangeDetectionStrategy,\n Component,\n computed,\n HostAttributeToken,\n inject,\n input,\n ViewEncapsulation,\n} from '@angular/core';\nimport { BUTTON_DEFAULTS_TOKEN } from '@slotted/angular/button';\nimport type {\n ButtonDefaults,\n ButtonSize,\n ButtonTone,\n ButtonVariant,\n} from '@slotted/angular/button';\n\nimport type {\n ButtonGroupAlign,\n ButtonGroupJustify,\n ButtonGroupOrientation,\n} from './button-group.types';\n\n/**\n * The three axes the group hands down to the buttons inside it, through the\n * button family's own defaults token rather than through a second channel of\n * this family's invention. That is what keeps an explicit input on a button\n * winning over the group, because it is the rule `button` already implements.\n *\n * The value is read through getters so that a button's `computed` tracks the\n * group's signals: a plain snapshot would fix the paint at the moment the\n * first button was created and never move again.\n */\nfunction provideGroupPaint() {\n return {\n provide: BUTTON_DEFAULTS_TOKEN,\n useFactory: (): ButtonDefaults => {\n const group = inject(SlButtonGroup);\n const inherited = inject(BUTTON_DEFAULTS_TOKEN, { skipSelf: true });\n\n return {\n get size() {\n return group.size() ?? inherited.size;\n },\n get tone() {\n return group.tone() ?? inherited.tone;\n },\n get variant() {\n return group.variant() ?? inherited.variant;\n },\n };\n },\n };\n}\n\n/**\n * A set of related actions joined into one shape. The group arranges what the\n * consumer wrote and changes the semantics of nothing inside it: every button\n * keeps its own role, its own state and its own place in the tab sequence.\n *\n * One shape and no other: the buttons share their edges, one border is painted\n * in each shared column, and only the two ends of the bar are rounded. There\n * is no input that spaces the buttons apart and none that unjoins them — a\n * spaced row of buttons is `slInline` or `slStack` holding buttons.\n *\n * It is `role=\"group\"` and not `role=\"toolbar\"`, and the difference is a\n * keyboard model rather than a name. A toolbar is one tab stop with arrow-key\n * navigation between its controls, which is the `toolbar` family. A consumer\n * who wrote `role` on the element keeps it, read before the host binding is\n * written, so the role and the model are never confused by accident.\n *\n * There is no `label` input. The element already accepts `aria-label` and\n * `aria-labelledby`, and a second way to name one thing is a second thing to\n * get wrong.\n */\n@Component({\n selector: '[slButtonGroup]',\n standalone: true,\n exportAs: 'slButtonGroup',\n template: '<ng-content></ng-content>',\n styleUrl: '../../../styles/src/button-group/button-group.css',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n providers: [provideGroupPaint()],\n host: {\n 'data-ui': 'button-group',\n 'data-part': 'root',\n '[attr.role]': 'role',\n '[attr.data-orientation]': 'orientation() ?? null',\n '[attr.data-align]': 'align() ?? null',\n '[attr.data-justify]': 'justify() ?? null',\n '[attr.data-full-width]': 'fullWidth() ? \"\" : null',\n },\n})\nexport class SlButtonGroup {\n /** Positions the buttons across the flow. */\n readonly align = input<ButtonGroupAlign>();\n /** Positions the buttons along the flow, which makes the group hold the line. */\n readonly justify = input<ButtonGroupJustify>();\n readonly orientation = input<ButtonGroupOrientation>();\n /** The group holds the line and its buttons share it in equal segments. */\n readonly fullWidth = input(false, { transform: booleanAttribute });\n\n readonly size = input<ButtonSize | undefined>(undefined);\n readonly tone = input<ButtonTone | undefined>(undefined);\n readonly variant = input<ButtonVariant | undefined>(undefined);\n\n /**\n * A static attribute the consumer wrote survives the host binding, which is\n * how `role=\"toolbar\"` stays possible on an element this family would\n * otherwise call a group.\n *\n * `role=\"\"` is the way out: ARIA reads an empty role as \"use the element's\n * implicit one\", so a `nav` or a `section` carrying this directive keeps the\n * semantics it was chosen for instead of being flattened to a group.\n */\n private readonly writtenRole = inject(new HostAttributeToken('role'), { optional: true });\n protected readonly role = this.writtenRole === '' ? null : (this.writtenRole ?? 'group');\n\n /** What the rule between two runs turns with. */\n readonly flow = computed(() => this.orientation() ?? 'horizontal');\n}\n","import {\n booleanAttribute,\n ChangeDetectionStrategy,\n Component,\n computed,\n inject,\n input,\n ViewEncapsulation,\n} from '@angular/core';\n\nimport { SlButtonGroup } from './button-group';\n\n/**\n * A rule between two runs of actions. It takes no room at all: the bar is one\n * shape, and a rule is not licence to cut it — what the rule marks is painted\n * in the column the shared edge already occupies, one step stronger than the\n * seams around it, so the boundary reads without the bar coming apart. A\n * filled run keeps its seam, which is the darkest step of its own tone and the\n * strongest line that bar has.\n *\n * Its axis is the group's, mirrored: a rule across a row is vertical. It is\n * derived rather than accepted, because a rule that could disagree with the\n * group it divides is a rule that eventually does.\n */\n@Component({\n selector: '[slButtonGroupSeparator]',\n standalone: true,\n exportAs: 'slButtonGroupSeparator',\n template: '',\n styleUrl: '../../../styles/src/button-group/button-group.css',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n host: {\n 'data-part': 'separator',\n '[attr.role]': 'decorative() ? \"none\" : \"separator\"',\n '[attr.aria-hidden]': 'decorative() ? \"true\" : null',\n '[attr.aria-orientation]': 'axis()',\n },\n})\nexport class SlButtonGroupSeparator {\n private readonly group = inject(SlButtonGroup, { optional: true });\n\n /**\n * Drops the rule out of the accessibility tree. Use it when the boundary is\n * cosmetic; a boundary that carries meaning is better said by a nested group\n * with a name of its own.\n */\n readonly decorative = input(false, { transform: booleanAttribute });\n\n protected readonly axis = computed(() => {\n if (this.decorative()) return null;\n return (this.group?.flow() ?? 'horizontal') === 'vertical' ? 'horizontal' : 'vertical';\n });\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"slotted-angular-button-group.mjs","sources":["../../button-group/src/button-group.ts","../../button-group/src/button-group-separator.ts","../../button-group/src/slotted-angular-button-group.ts"],"sourcesContent":["import {\n booleanAttribute,\n ChangeDetectionStrategy,\n Component,\n computed,\n HostAttributeToken,\n inject,\n input,\n ViewEncapsulation,\n} from '@angular/core';\nimport { BUTTON_DEFAULTS_TOKEN } from '@slotted/angular/button';\nimport type {\n ButtonDefaults,\n ButtonSize,\n ButtonTone,\n ButtonVariant,\n} from '@slotted/angular/button';\n\nimport type {\n ButtonGroupAlign,\n ButtonGroupJustify,\n ButtonGroupOrientation,\n} from './button-group.types';\n\n/**\n * The three axes the group hands down to the buttons inside it, through the\n * button family's own defaults token rather than through a second channel of\n * this family's invention. That is what keeps an explicit input on a button\n * winning over the group, because it is the rule `button` already implements.\n *\n * The value is read through getters so that a button's `computed` tracks the\n * group's signals: a plain snapshot would fix the paint at the moment the\n * first button was created and never move again.\n */\nfunction provideGroupPaint() {\n return {\n provide: BUTTON_DEFAULTS_TOKEN,\n useFactory: (): ButtonDefaults => {\n const group = inject(SlButtonGroup);\n const inherited = inject(BUTTON_DEFAULTS_TOKEN, { skipSelf: true });\n\n return {\n get size() {\n return group.size() ?? inherited.size;\n },\n get tone() {\n return group.tone() ?? inherited.tone;\n },\n get variant() {\n return group.variant() ?? inherited.variant;\n },\n };\n },\n };\n}\n\n/**\n * A set of related actions joined into one shape. The group arranges what the\n * consumer wrote and changes the semantics of nothing inside it: every button\n * keeps its own role, its own state and its own place in the tab sequence.\n *\n * One shape and no other: the buttons share their edges, one border is painted\n * in each shared column, and only the two ends of the bar are rounded. There\n * is no input that spaces the buttons apart and none that unjoins them — a\n * spaced row of buttons is `slInline` or `slStack` holding buttons.\n *\n * It is `role=\"group\"` and not `role=\"toolbar\"`, and the difference is a\n * keyboard model rather than a name. A toolbar is one tab stop with arrow-key\n * navigation between its controls, which is the `toolbar` family. A consumer\n * who wrote `role` on the element keeps it, read before the host binding is\n * written, so the role and the model are never confused by accident.\n *\n * There is no `label` input. The element already accepts `aria-label` and\n * `aria-labelledby`, and a second way to name one thing is a second thing to\n * get wrong.\n */\n@Component({\n selector: '[slButtonGroup]',\n standalone: true,\n exportAs: 'slButtonGroup',\n template: '<ng-content></ng-content>',\n styleUrl: '../../../styles/src/button-group/button-group.css',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n providers: [provideGroupPaint()],\n host: {\n 'data-ui': 'button-group',\n 'data-part': 'root',\n '[attr.role]': 'role',\n '[attr.data-orientation]': 'orientation() ?? null',\n '[attr.data-align]': 'align() ?? null',\n '[attr.data-justify]': 'justify() ?? null',\n '[attr.data-full-width]': 'fullWidth() ? \"\" : null',\n },\n})\nexport class SlButtonGroup {\n /** Positions the buttons across the flow. */\n readonly align = input<ButtonGroupAlign>();\n /** Positions the buttons along the flow, which makes the group hold the line. */\n readonly justify = input<ButtonGroupJustify>();\n readonly orientation = input<ButtonGroupOrientation>();\n /** The group holds the line and its buttons share it in equal segments. */\n readonly fullWidth = input(false, { transform: booleanAttribute });\n\n readonly size = input<ButtonSize | undefined>(undefined);\n readonly tone = input<ButtonTone | undefined>(undefined);\n readonly variant = input<ButtonVariant | undefined>(undefined);\n\n /**\n * A static attribute the consumer wrote survives the host binding, which is\n * how `role=\"toolbar\"` stays possible on an element this family would\n * otherwise call a group.\n *\n * `role=\"\"` is the way out: ARIA reads an empty role as \"use the element's\n * implicit one\", so a `nav` or a `section` carrying this directive keeps the\n * semantics it was chosen for instead of being flattened to a group.\n */\n private readonly writtenRole = inject(new HostAttributeToken('role'), { optional: true });\n protected readonly role = this.writtenRole === '' ? null : (this.writtenRole ?? 'group');\n\n /** What the rule between two runs turns with. */\n readonly flow = computed(() => this.orientation() ?? 'horizontal');\n}\n","import {\n booleanAttribute,\n ChangeDetectionStrategy,\n Component,\n computed,\n inject,\n input,\n ViewEncapsulation,\n} from '@angular/core';\n\nimport { SlButtonGroup } from './button-group';\n\n/**\n * A rule between two runs of actions. It takes no room at all: the bar is one\n * shape, and a rule is not licence to cut it — what the rule marks is painted\n * in the column the shared edge already occupies, one step stronger than the\n * seams around it, so the boundary reads without the bar coming apart. A\n * filled run keeps its seam, which is the darkest step of its own tone and the\n * strongest line that bar has.\n *\n * Its axis is the group's, mirrored: a rule across a row is vertical. It is\n * derived rather than accepted, because a rule that could disagree with the\n * group it divides is a rule that eventually does.\n */\n@Component({\n selector: '[slButtonGroupSeparator]',\n standalone: true,\n exportAs: 'slButtonGroupSeparator',\n template: '',\n styleUrl: '../../../styles/src/button-group/button-group.css',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n host: {\n 'data-part': 'separator',\n '[attr.role]': 'decorative() ? \"none\" : \"separator\"',\n '[attr.aria-hidden]': 'decorative() ? \"true\" : null',\n '[attr.aria-orientation]': 'axis()',\n },\n})\nexport class SlButtonGroupSeparator {\n private readonly group = inject(SlButtonGroup, { optional: true });\n\n /**\n * Drops the rule out of the accessibility tree. Use it when the boundary is\n * cosmetic; a boundary that carries meaning is better said by a nested group\n * with a name of its own.\n */\n readonly decorative = input(false, { transform: booleanAttribute });\n\n protected readonly axis = computed(() => {\n if (this.decorative()) return null;\n return (this.group?.flow() ?? 'horizontal') === 'vertical' ? 'horizontal' : 'vertical';\n });\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}