@cloudscape-design/components-themeable 3.0.1080 → 3.0.1082

package/lib/internal/template/button/styles.selectors.js

@@ -2,27 +2,27 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "content": "awsui_content_vjswe_1arqf_153",
-  "button": "awsui_button_vjswe_1arqf_157",
-  "variant-normal": "awsui_variant-normal_vjswe_1arqf_206",
-  "disabled": "awsui_disabled_vjswe_1arqf_224",
-  "variant-primary": "awsui_variant-primary_vjswe_1arqf_231",
-  "variant-link": "awsui_variant-link_vjswe_1arqf_256",
-  "variant-icon": "awsui_variant-icon_vjswe_1arqf_281",
-  "variant-inline-icon": "awsui_variant-inline-icon_vjswe_1arqf_306",
-  "variant-inline-icon-pointer-target": "awsui_variant-inline-icon-pointer-target_vjswe_1arqf_331",
-  "variant-inline-link": "awsui_variant-inline-link_vjswe_1arqf_356",
-  "variant-modal-dismiss": "awsui_variant-modal-dismiss_vjswe_1arqf_385",
-  "variant-flashbar-icon": "awsui_variant-flashbar-icon_vjswe_1arqf_410",
-  "variant-breadcrumb-group": "awsui_variant-breadcrumb-group_vjswe_1arqf_435",
-  "variant-menu-trigger": "awsui_variant-menu-trigger_vjswe_1arqf_465",
-  "button-no-text": "awsui_button-no-text_vjswe_1arqf_557",
-  "button-no-wrap": "awsui_button-no-wrap_vjswe_1arqf_561",
-  "full-width": "awsui_full-width_vjswe_1arqf_564",
-  "icon-left": "awsui_icon-left_vjswe_1arqf_586",
-  "icon-right": "awsui_icon-right_vjswe_1arqf_591",
-  "icon": "awsui_icon_vjswe_1arqf_586",
-  "link": "awsui_link_vjswe_1arqf_610",
-  "disabled-with-reason": "awsui_disabled-with-reason_vjswe_1arqf_610"
+  "content": "awsui_content_vjswe_1qe56_153",
+  "button": "awsui_button_vjswe_1qe56_157",
+  "variant-normal": "awsui_variant-normal_vjswe_1qe56_206",
+  "disabled": "awsui_disabled_vjswe_1qe56_227",
+  "variant-primary": "awsui_variant-primary_vjswe_1qe56_235",
+  "variant-link": "awsui_variant-link_vjswe_1qe56_264",
+  "variant-icon": "awsui_variant-icon_vjswe_1qe56_293",
+  "variant-inline-icon": "awsui_variant-inline-icon_vjswe_1qe56_322",
+  "variant-inline-icon-pointer-target": "awsui_variant-inline-icon-pointer-target_vjswe_1qe56_351",
+  "variant-inline-link": "awsui_variant-inline-link_vjswe_1qe56_380",
+  "variant-modal-dismiss": "awsui_variant-modal-dismiss_vjswe_1qe56_413",
+  "variant-flashbar-icon": "awsui_variant-flashbar-icon_vjswe_1qe56_442",
+  "variant-breadcrumb-group": "awsui_variant-breadcrumb-group_vjswe_1qe56_471",
+  "variant-menu-trigger": "awsui_variant-menu-trigger_vjswe_1qe56_505",
+  "button-no-text": "awsui_button-no-text_vjswe_1qe56_601",
+  "button-no-wrap": "awsui_button-no-wrap_vjswe_1qe56_605",
+  "full-width": "awsui_full-width_vjswe_1qe56_608",
+  "icon-left": "awsui_icon-left_vjswe_1qe56_630",
+  "icon-right": "awsui_icon-right_vjswe_1qe56_635",
+  "icon": "awsui_icon_vjswe_1qe56_630",
+  "link": "awsui_link_vjswe_1qe56_654",
+  "disabled-with-reason": "awsui_disabled-with-reason_vjswe_1qe56_654"
 };
   

package/lib/internal/template/button-dropdown/item-element/styles.css.js

@@ -1,21 +1,21 @@
 
     import './styles.scoped.css';
     export default {
-  "item-element": "awsui_item-element_93a1u_1x28u_145",
-  "disabled": "awsui_disabled_93a1u_1x28u_157",
-  "show-divider": "awsui_show-divider_93a1u_1x28u_164",
-  "highlighted": "awsui_highlighted_93a1u_1x28u_167",
-  "is-focused": "awsui_is-focused_93a1u_1x28u_182",
-  "visual-refresh": "awsui_visual-refresh_93a1u_1x28u_185",
-  "menu-item": "awsui_menu-item_93a1u_1x28u_189",
-  "link-style": "awsui_link-style_93a1u_1x28u_201",
-  "current-breadcrumb": "awsui_current-breadcrumb_93a1u_1x28u_237",
-  "link-style-highlighted": "awsui_link-style-highlighted_93a1u_1x28u_245",
-  "has-category-header": "awsui_has-category-header_93a1u_1x28u_251",
-  "item-tooltip-wrapper": "awsui_item-tooltip-wrapper_93a1u_1x28u_251",
-  "has-checkmark": "awsui_has-checkmark_93a1u_1x28u_251",
-  "icon": "awsui_icon_93a1u_1x28u_255",
-  "checkmark": "awsui_checkmark_93a1u_1x28u_259",
-  "external-icon": "awsui_external-icon_93a1u_1x28u_266"
+  "item-element": "awsui_item-element_93a1u_1d1yq_145",
+  "disabled": "awsui_disabled_93a1u_1d1yq_157",
+  "show-divider": "awsui_show-divider_93a1u_1d1yq_164",
+  "highlighted": "awsui_highlighted_93a1u_1d1yq_167",
+  "is-focused": "awsui_is-focused_93a1u_1d1yq_182",
+  "visual-refresh": "awsui_visual-refresh_93a1u_1d1yq_185",
+  "menu-item": "awsui_menu-item_93a1u_1d1yq_189",
+  "link-style": "awsui_link-style_93a1u_1d1yq_201",
+  "current-breadcrumb": "awsui_current-breadcrumb_93a1u_1d1yq_237",
+  "link-style-highlighted": "awsui_link-style-highlighted_93a1u_1d1yq_245",
+  "has-category-header": "awsui_has-category-header_93a1u_1d1yq_251",
+  "item-tooltip-wrapper": "awsui_item-tooltip-wrapper_93a1u_1d1yq_251",
+  "has-checkmark": "awsui_has-checkmark_93a1u_1d1yq_251",
+  "icon": "awsui_icon_93a1u_1d1yq_255",
+  "checkmark": "awsui_checkmark_93a1u_1d1yq_259",
+  "external-icon": "awsui_external-icon_93a1u_1d1yq_266"
 };
   

package/lib/internal/template/button-dropdown/item-element/styles.scoped.css

@@ -142,7 +142,7 @@
 */
 /* Style used for links in slots/components that are text heavy, to help links stand out among
 surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F73#description */
-.awsui_item-element_93a1u_1x28u_145:not(#\9) {
+.awsui_item-element_93a1u_1d1yq_145:not(#\9) {
   position: relative;
   z-index: 1;
   border-block: var(--border-item-width-acvlhx, 1px) solid transparent;
@@ -154,17 +154,17 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   margin-block-start: calc(-1 * var(--border-width-dropdown-qic2p4, 1px));
   cursor: pointer;
 }
-.awsui_item-element_93a1u_1x28u_145.awsui_disabled_93a1u_1x28u_157:not(#\9) {
+.awsui_item-element_93a1u_1d1yq_145.awsui_disabled_93a1u_1d1yq_157:not(#\9) {
   cursor: default;
   color: var(--color-text-dropdown-item-disabled-oysy8n, #aab7b8);
 }
-.awsui_item-element_93a1u_1x28u_145:not(#\9):first-child {
+.awsui_item-element_93a1u_1d1yq_145:not(#\9):first-child {
   margin-block-start: 0;
 }
-.awsui_item-element_93a1u_1x28u_145.awsui_show-divider_93a1u_1x28u_164:not(#\9) {
+.awsui_item-element_93a1u_1d1yq_145.awsui_show-divider_93a1u_1d1yq_164:not(#\9) {
   border-block-end: var(--border-item-width-acvlhx, 1px) solid var(--color-border-dropdown-group-dg9zg5, #eaeded);
 }
-.awsui_item-element_93a1u_1x28u_145.awsui_highlighted_93a1u_1x28u_167:not(#\9) {
+.awsui_item-element_93a1u_1d1yq_145.awsui_highlighted_93a1u_1d1yq_167:not(#\9) {
   color: var(--color-text-dropdown-item-highlighted-bchk26, #16191f);
   z-index: 2;
   background-color: var(--color-background-dropdown-item-hover-353r6f, #f2f3f3);
@@ -174,19 +174,19 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-end-start-radius: var(--border-radius-item-xggxkd, 0px);
   border-end-end-radius: var(--border-radius-item-xggxkd, 0px);
 }
-.awsui_item-element_93a1u_1x28u_145.awsui_highlighted_93a1u_1x28u_167.awsui_disabled_93a1u_1x28u_157:not(#\9) {
+.awsui_item-element_93a1u_1d1yq_145.awsui_highlighted_93a1u_1d1yq_167.awsui_disabled_93a1u_1d1yq_157:not(#\9) {
   color: var(--color-text-dropdown-item-dimmed-0xf8v3, #aab7b8);
   border-color: var(--color-border-dropdown-item-dimmed-hover-twsd8z, #879596);
   background-color: var(--color-background-dropdown-item-dimmed-2hwvu9, transparent);
 }
-.awsui_item-element_93a1u_1x28u_145.awsui_highlighted_93a1u_1x28u_167.awsui_is-focused_93a1u_1x28u_182:not(#\9) {
+.awsui_item-element_93a1u_1d1yq_145.awsui_highlighted_93a1u_1d1yq_167.awsui_is-focused_93a1u_1d1yq_182:not(#\9) {
   border-color: var(--color-border-dropdown-item-focused-xty1zx, #0073bb);
 }
-.awsui_item-element_93a1u_1x28u_145.awsui_highlighted_93a1u_1x28u_167.awsui_is-focused_93a1u_1x28u_182:not(#\9):not(.awsui_visual-refresh_93a1u_1x28u_185) {
+.awsui_item-element_93a1u_1d1yq_145.awsui_highlighted_93a1u_1d1yq_167.awsui_is-focused_93a1u_1d1yq_182:not(#\9):not(.awsui_visual-refresh_93a1u_1d1yq_185) {
   box-shadow: inset 0 0 0 var(--border-control-focus-ring-shadow-spread-ql2vj7, 1px) var(--color-border-item-focused-r5f6xl, #0073bb);
 }
 
-.awsui_menu-item_93a1u_1x28u_189:not(#\9) {
+.awsui_menu-item_93a1u_1d1yq_189:not(#\9) {
   min-inline-size: 0;
   word-break: break-word;
   display: flex;
@@ -198,11 +198,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   /* stylelint-disable selector-max-type */
   /* stylelint-enable selector-max-type */
 }
-.awsui_menu-item_93a1u_1x28u_189.awsui_link-style_93a1u_1x28u_201:not(#\9) {
+.awsui_menu-item_93a1u_1d1yq_189.awsui_link-style_93a1u_1d1yq_201:not(#\9) {
   padding-block-end: calc(var(--space-xxs-jnczic, 4px) + var(--space-xxxs-3w1kr2, 2px));
   text-underline-offset: 0.25em;
   text-decoration-thickness: 1px;
-  color: var(--awsui-style-color-default-mdigke, var(--color-text-link-default-x6cnv5, #0073bb));
+  color: var(--awsui-style-color-default-kiajpc, var(--color-text-link-default-x6cnv5, #0073bb));
   font-weight: inherit;
   letter-spacing: normal;
   text-decoration-line: underline;
@@ -213,30 +213,30 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   transition-duration: var(--motion-duration-refresh-only-medium-h3wrr6, 0ms);
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_menu-item_93a1u_1x28u_189.awsui_link-style_93a1u_1x28u_201:not(#\9) {
+  .awsui_menu-item_93a1u_1d1yq_189.awsui_link-style_93a1u_1d1yq_201:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_menu-item_93a1u_1x28u_189.awsui_link-style_93a1u_1x28u_201:not(#\9), .awsui-mode-entering .awsui_menu-item_93a1u_1x28u_189.awsui_link-style_93a1u_1x28u_201:not(#\9) {
+.awsui-motion-disabled .awsui_menu-item_93a1u_1d1yq_189.awsui_link-style_93a1u_1d1yq_201:not(#\9), .awsui-mode-entering .awsui_menu-item_93a1u_1d1yq_189.awsui_link-style_93a1u_1d1yq_201:not(#\9) {
   animation: none;
   transition: none;
 }
-.awsui_menu-item_93a1u_1x28u_189.awsui_link-style_93a1u_1x28u_201:not(#\9):hover {
+.awsui_menu-item_93a1u_1d1yq_189.awsui_link-style_93a1u_1d1yq_201:not(#\9):hover {
   cursor: pointer;
-  color: var(--awsui-style-color-hover-mdigke, var(--color-text-link-hover-tk5gkv, #0a4a74));
+  color: var(--awsui-style-color-hover-kiajpc, var(--color-text-link-hover-tk5gkv, #0a4a74));
 }
-.awsui_menu-item_93a1u_1x28u_189.awsui_link-style_93a1u_1x28u_201:not(#\9):focus {
+.awsui_menu-item_93a1u_1d1yq_189.awsui_link-style_93a1u_1d1yq_201:not(#\9):focus {
   outline: none;
 }
-.awsui_menu-item_93a1u_1x28u_189.awsui_link-style_93a1u_1x28u_201:not(#\9):active {
-  color: var(--awsui-style-color-active-mdigke, var(--color-text-link-hover-tk5gkv, #0a4a74));
+.awsui_menu-item_93a1u_1d1yq_189.awsui_link-style_93a1u_1d1yq_201:not(#\9):active {
+  color: var(--awsui-style-color-active-kiajpc, var(--color-text-link-hover-tk5gkv, #0a4a74));
 }
-.awsui_menu-item_93a1u_1x28u_189.awsui_link-style_93a1u_1x28u_201:not(#\9):active, .awsui_menu-item_93a1u_1x28u_189.awsui_link-style_93a1u_1x28u_201:not(#\9):focus, .awsui_menu-item_93a1u_1x28u_189.awsui_link-style_93a1u_1x28u_201:not(#\9):hover {
+.awsui_menu-item_93a1u_1d1yq_189.awsui_link-style_93a1u_1d1yq_201:not(#\9):active, .awsui_menu-item_93a1u_1d1yq_189.awsui_link-style_93a1u_1d1yq_201:not(#\9):focus, .awsui_menu-item_93a1u_1d1yq_189.awsui_link-style_93a1u_1d1yq_201:not(#\9):hover {
   text-decoration-line: underline;
   text-decoration-color: currentColor;
 }
-.awsui_menu-item_93a1u_1x28u_189.awsui_link-style_93a1u_1x28u_201.awsui_current-breadcrumb_93a1u_1x28u_237:not(#\9) {
+.awsui_menu-item_93a1u_1d1yq_189.awsui_link-style_93a1u_1d1yq_201.awsui_current-breadcrumb_93a1u_1d1yq_237:not(#\9) {
   font-weight: var(--font-weight-button-hh0ago, 700);
   -webkit-font-smoothing: var(--font-smoothing-webkit-px4az4, auto);
   -moz-osx-font-smoothing: var(--font-smoothing-moz-osx-ev3sgf, auto);
@@ -244,27 +244,27 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   font-weight: 700;
   text-decoration: none;
 }
-.awsui_menu-item_93a1u_1x28u_189.awsui_link-style_93a1u_1x28u_201.awsui_link-style-highlighted_93a1u_1x28u_245:not(#\9) {
+.awsui_menu-item_93a1u_1d1yq_189.awsui_link-style_93a1u_1d1yq_201.awsui_link-style-highlighted_93a1u_1d1yq_245:not(#\9) {
   color: var(--color-text-link-hover-tk5gkv, #0a4a74);
 }
-.awsui_menu-item_93a1u_1x28u_189:not(#\9):focus {
+.awsui_menu-item_93a1u_1d1yq_189:not(#\9):focus {
   outline: none;
 }
-.awsui_has-category-header_93a1u_1x28u_251 > .awsui_menu-item_93a1u_1x28u_189:not(#\9), .awsui_has-category-header_93a1u_1x28u_251 > .awsui_item-tooltip-wrapper_93a1u_1x28u_251 > .awsui_menu-item_93a1u_1x28u_189:not(#\9), .awsui_has-category-header_93a1u_1x28u_251:not(#\9):not(.awsui_has-checkmark_93a1u_1x28u_251) > span > .awsui_menu-item_93a1u_1x28u_189 {
+.awsui_has-category-header_93a1u_1d1yq_251 > .awsui_menu-item_93a1u_1d1yq_189:not(#\9), .awsui_has-category-header_93a1u_1d1yq_251 > .awsui_item-tooltip-wrapper_93a1u_1d1yq_251 > .awsui_menu-item_93a1u_1d1yq_189:not(#\9), .awsui_has-category-header_93a1u_1d1yq_251:not(#\9):not(.awsui_has-checkmark_93a1u_1d1yq_251) > span > .awsui_menu-item_93a1u_1d1yq_189 {
   padding-inline-start: calc(var(--space-xs-kw7k3v, 8px) + var(--space-l-3cws6j, 20px));
 }
 
-.awsui_icon_93a1u_1x28u_255:not(#\9) {
+.awsui_icon_93a1u_1d1yq_255:not(#\9) {
   padding-inline-end: var(--space-xxs-jnczic, 4px);
   flex-shrink: 0;
 }
-.awsui_icon_93a1u_1x28u_255.awsui_checkmark_93a1u_1x28u_259:not(#\9) {
+.awsui_icon_93a1u_1d1yq_255.awsui_checkmark_93a1u_1d1yq_259:not(#\9) {
   color: var(--color-text-status-info-xt2ka7, #0073bb);
 }
-.awsui_icon_93a1u_1x28u_255.awsui_disabled_93a1u_1x28u_157:not(#\9) {
+.awsui_icon_93a1u_1d1yq_255.awsui_disabled_93a1u_1d1yq_157:not(#\9) {
   color: var(--color-text-interactive-disabled-xwt2jl, #aab7b8);
 }
 
-.awsui_external-icon_93a1u_1x28u_266:not(#\9) {
+.awsui_external-icon_93a1u_1d1yq_266:not(#\9) {
   margin-inline-start: var(--space-xxs-jnczic, 4px);
 }

package/lib/internal/template/button-dropdown/item-element/styles.selectors.js

@@ -2,21 +2,21 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "item-element": "awsui_item-element_93a1u_1x28u_145",
-  "disabled": "awsui_disabled_93a1u_1x28u_157",
-  "show-divider": "awsui_show-divider_93a1u_1x28u_164",
-  "highlighted": "awsui_highlighted_93a1u_1x28u_167",
-  "is-focused": "awsui_is-focused_93a1u_1x28u_182",
-  "visual-refresh": "awsui_visual-refresh_93a1u_1x28u_185",
-  "menu-item": "awsui_menu-item_93a1u_1x28u_189",
-  "link-style": "awsui_link-style_93a1u_1x28u_201",
-  "current-breadcrumb": "awsui_current-breadcrumb_93a1u_1x28u_237",
-  "link-style-highlighted": "awsui_link-style-highlighted_93a1u_1x28u_245",
-  "has-category-header": "awsui_has-category-header_93a1u_1x28u_251",
-  "item-tooltip-wrapper": "awsui_item-tooltip-wrapper_93a1u_1x28u_251",
-  "has-checkmark": "awsui_has-checkmark_93a1u_1x28u_251",
-  "icon": "awsui_icon_93a1u_1x28u_255",
-  "checkmark": "awsui_checkmark_93a1u_1x28u_259",
-  "external-icon": "awsui_external-icon_93a1u_1x28u_266"
+  "item-element": "awsui_item-element_93a1u_1d1yq_145",
+  "disabled": "awsui_disabled_93a1u_1d1yq_157",
+  "show-divider": "awsui_show-divider_93a1u_1d1yq_164",
+  "highlighted": "awsui_highlighted_93a1u_1d1yq_167",
+  "is-focused": "awsui_is-focused_93a1u_1d1yq_182",
+  "visual-refresh": "awsui_visual-refresh_93a1u_1d1yq_185",
+  "menu-item": "awsui_menu-item_93a1u_1d1yq_189",
+  "link-style": "awsui_link-style_93a1u_1d1yq_201",
+  "current-breadcrumb": "awsui_current-breadcrumb_93a1u_1d1yq_237",
+  "link-style-highlighted": "awsui_link-style-highlighted_93a1u_1d1yq_245",
+  "has-category-header": "awsui_has-category-header_93a1u_1d1yq_251",
+  "item-tooltip-wrapper": "awsui_item-tooltip-wrapper_93a1u_1d1yq_251",
+  "has-checkmark": "awsui_has-checkmark_93a1u_1d1yq_251",
+  "icon": "awsui_icon_93a1u_1d1yq_255",
+  "checkmark": "awsui_checkmark_93a1u_1d1yq_259",
+  "external-icon": "awsui_external-icon_93a1u_1d1yq_266"
 };
   

package/lib/internal/template/button-group/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/button-group/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAGhD,OAAO,EAAE,gBAAgB,EAAE,CAAC;AAE5B,QAAA,MAAM,WAAW,+FAqChB,CAAC;AAoBF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/button-group/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAGhD,OAAO,EAAE,gBAAgB,EAAE,CAAC;AAE5B,QAAA,MAAM,WAAW,+FAyChB,CAAC;AAoBF,eAAe,WAAW,CAAC"}

package/lib/internal/template/button-group/index.js

@@ -10,7 +10,7 @@ import { applyDisplayName } from '../internal/utils/apply-display-name';
 import { getExternalProps } from '../internal/utils/external-props';
 import InternalButtonGroup from './internal';
 const ButtonGroup = React.forwardRef((_a, ref) => {
-    var { variant, dropdownExpandToViewport = false } = _a, rest = __rest(_a, ["variant", "dropdownExpandToViewport"]);
+    var { variant, dropdownExpandToViewport = false, style } = _a, rest = __rest(_a, ["variant", "dropdownExpandToViewport", "style"]);
     const baseProps = getBaseProps(rest);
     const itemCounts = getItemCounts(rest.items);
     const baseComponentProps = useBaseComponent('ButtonGroup', {
@@ -31,7 +31,7 @@ const ButtonGroup = React.forwardRef((_a, ref) => {
         name: 'awsui.ButtonGroup',
         label: { root: 'self' },
     };
-    return (React.createElement(InternalButtonGroup, Object.assign({}, baseProps, baseComponentProps, externalProps, { ref: ref, variant: variant, dropdownExpandToViewport: dropdownExpandToViewport }, getAnalyticsMetadataAttribute({ component: componentMetadata }))));
+    return (React.createElement(InternalButtonGroup, Object.assign({}, baseProps, baseComponentProps, externalProps, { ref: ref, variant: variant, dropdownExpandToViewport: dropdownExpandToViewport, style: style }, getAnalyticsMetadataAttribute({ component: componentMetadata }))));
 });
 function getItemCounts(allItems = []) {
     const counters = { 'icon-button': 0, 'icon-toggle-button': 0, 'icon-file-input': 0, 'menu-dropdown': 0, group: 0 };

package/lib/internal/template/button-group/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/button-group/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,YAAY,CAAC;;AACb,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,6BAA6B,EAAE,MAAM,kEAAkE,CAAC;AAEjH,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AAGpE,OAAO,mBAAmB,MAAM,YAAY,CAAC;AAI7C,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CAClC,CAAC,EAAwE,EAAE,GAAoC,EAAE,EAAE;QAAlH,EAAE,OAAO,EAAE,wBAAwB,GAAG,KAAK,OAA6B,EAAxB,IAAI,cAApD,uCAAsD,CAAF;IACnD,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IACrC,MAAM,UAAU,GAAG,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC7C,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,aAAa,EAAE;QACzD,KAAK,EAAE;YACL,OAAO;YACP,wBAAwB;SACzB;QACD,QAAQ,EAAE;YACR,gBAAgB,EAAE,UAAU,CAAC,aAAa,CAAC;YAC3C,sBAAsB,EAAE,UAAU,CAAC,oBAAoB,CAAC;YACxD,mBAAmB,EAAE,UAAU,CAAC,iBAAiB,CAAC;YAClD,kBAAkB,EAAE,UAAU,CAAC,eAAe,CAAC;YAC/C,WAAW,EAAE,UAAU,CAAC,KAAK;SAC9B;KACF,CAAC,CAAC;IAEH,MAAM,aAAa,GAAG,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAE7C,MAAM,iBAAiB,GAAmD;QACxE,IAAI,EAAE,mBAAmB;QACzB,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;KACxB,CAAC;IAEF,OAAO,CACL,oBAAC,mBAAmB,oBACd,SAAS,EACT,kBAAkB,EAClB,aAAa,IACjB,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,OAAO,EAChB,wBAAwB,EAAE,wBAAwB,IAC9C,6BAA6B,CAAC,EAAE,SAAS,EAAE,iBAAiB,EAAE,CAAC,EACnE,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,SAAS,aAAa,CAAC,WAAoD,EAAE;IAC3E,MAAM,QAAQ,GAAG,EAAE,aAAa,EAAE,CAAC,EAAE,oBAAoB,EAAE,CAAC,EAAE,iBAAiB,EAAE,CAAC,EAAE,eAAe,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC;IAEnH,SAAS,KAAK,CAAC,KAA8C;QAC3D,KAAK,MAAM,IAAI,IAAI,KAAK,EAAE;YACxB,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YAEzB,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,EAAE;gBACzB,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;aACnB;SACF;IACH,CAAC;IACD,KAAK,CAAC,QAAQ,CAAC,CAAC;IAEhB,OAAO,QAAQ,CAAC;AAClB,CAAC;AAED,gBAAgB,CAAC,WAAW,EAAE,aAAa,CAAC,CAAC;AAC7C,eAAe,WAAW,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n'use client';\nimport React from 'react';\n\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { getBaseProps } from '../internal/base-component';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { getExternalProps } from '../internal/utils/external-props';\nimport { GeneratedAnalyticsMetadataButtonGroupComponent } from './analytics-metadata/interfaces';\nimport { ButtonGroupProps } from './interfaces';\nimport InternalButtonGroup from './internal';\n\nexport { ButtonGroupProps };\n\nconst ButtonGroup = React.forwardRef(\n  ({ variant, dropdownExpandToViewport = false, ...rest }: ButtonGroupProps, ref: React.Ref<ButtonGroupProps.Ref>) => {\n    const baseProps = getBaseProps(rest);\n    const itemCounts = getItemCounts(rest.items);\n    const baseComponentProps = useBaseComponent('ButtonGroup', {\n      props: {\n        variant,\n        dropdownExpandToViewport,\n      },\n      metadata: {\n        iconButtonsCount: itemCounts['icon-button'],\n        iconToggleButtonsCount: itemCounts['icon-toggle-button'],\n        iconFileInputsCount: itemCounts['icon-file-input'],\n        menuDropdownsCount: itemCounts['menu-dropdown'],\n        groupsCount: itemCounts.group,\n      },\n    });\n\n    const externalProps = getExternalProps(rest);\n\n    const componentMetadata: GeneratedAnalyticsMetadataButtonGroupComponent = {\n      name: 'awsui.ButtonGroup',\n      label: { root: 'self' },\n    };\n\n    return (\n      <InternalButtonGroup\n        {...baseProps}\n        {...baseComponentProps}\n        {...externalProps}\n        ref={ref}\n        variant={variant}\n        dropdownExpandToViewport={dropdownExpandToViewport}\n        {...getAnalyticsMetadataAttribute({ component: componentMetadata })}\n      />\n    );\n  }\n);\n\nfunction getItemCounts(allItems: readonly ButtonGroupProps.ItemOrGroup[] = []) {\n  const counters = { 'icon-button': 0, 'icon-toggle-button': 0, 'icon-file-input': 0, 'menu-dropdown': 0, group: 0 };\n\n  function count(items: readonly ButtonGroupProps.ItemOrGroup[]) {\n    for (const item of items) {\n      counters[item.type] += 1;\n\n      if (item.type === 'group') {\n        count(item.items);\n      }\n    }\n  }\n  count(allItems);\n\n  return counters;\n}\n\napplyDisplayName(ButtonGroup, 'ButtonGroup');\nexport default ButtonGroup;\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/button-group/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,YAAY,CAAC;;AACb,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,6BAA6B,EAAE,MAAM,kEAAkE,CAAC;AAEjH,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AAGpE,OAAO,mBAAmB,MAAM,YAAY,CAAC;AAI7C,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CAClC,CACE,EAA+E,EAC/E,GAAoC,EACpC,EAAE;QAFF,EAAE,OAAO,EAAE,wBAAwB,GAAG,KAAK,EAAE,KAAK,OAA6B,EAAxB,IAAI,cAA3D,gDAA6D,CAAF;IAG3D,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IACrC,MAAM,UAAU,GAAG,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC7C,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,aAAa,EAAE;QACzD,KAAK,EAAE;YACL,OAAO;YACP,wBAAwB;SACzB;QACD,QAAQ,EAAE;YACR,gBAAgB,EAAE,UAAU,CAAC,aAAa,CAAC;YAC3C,sBAAsB,EAAE,UAAU,CAAC,oBAAoB,CAAC;YACxD,mBAAmB,EAAE,UAAU,CAAC,iBAAiB,CAAC;YAClD,kBAAkB,EAAE,UAAU,CAAC,eAAe,CAAC;YAC/C,WAAW,EAAE,UAAU,CAAC,KAAK;SAC9B;KACF,CAAC,CAAC;IAEH,MAAM,aAAa,GAAG,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAE7C,MAAM,iBAAiB,GAAmD;QACxE,IAAI,EAAE,mBAAmB;QACzB,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;KACxB,CAAC;IAEF,OAAO,CACL,oBAAC,mBAAmB,oBACd,SAAS,EACT,kBAAkB,EAClB,aAAa,IACjB,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,OAAO,EAChB,wBAAwB,EAAE,wBAAwB,EAClD,KAAK,EAAE,KAAK,IACR,6BAA6B,CAAC,EAAE,SAAS,EAAE,iBAAiB,EAAE,CAAC,EACnE,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,SAAS,aAAa,CAAC,WAAoD,EAAE;IAC3E,MAAM,QAAQ,GAAG,EAAE,aAAa,EAAE,CAAC,EAAE,oBAAoB,EAAE,CAAC,EAAE,iBAAiB,EAAE,CAAC,EAAE,eAAe,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC;IAEnH,SAAS,KAAK,CAAC,KAA8C;QAC3D,KAAK,MAAM,IAAI,IAAI,KAAK,EAAE;YACxB,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YAEzB,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,EAAE;gBACzB,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;aACnB;SACF;IACH,CAAC;IACD,KAAK,CAAC,QAAQ,CAAC,CAAC;IAEhB,OAAO,QAAQ,CAAC;AAClB,CAAC;AAED,gBAAgB,CAAC,WAAW,EAAE,aAAa,CAAC,CAAC;AAC7C,eAAe,WAAW,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n'use client';\nimport React from 'react';\n\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { getBaseProps } from '../internal/base-component';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { getExternalProps } from '../internal/utils/external-props';\nimport { GeneratedAnalyticsMetadataButtonGroupComponent } from './analytics-metadata/interfaces';\nimport { ButtonGroupProps } from './interfaces';\nimport InternalButtonGroup from './internal';\n\nexport { ButtonGroupProps };\n\nconst ButtonGroup = React.forwardRef(\n  (\n    { variant, dropdownExpandToViewport = false, style, ...rest }: ButtonGroupProps,\n    ref: React.Ref<ButtonGroupProps.Ref>\n  ) => {\n    const baseProps = getBaseProps(rest);\n    const itemCounts = getItemCounts(rest.items);\n    const baseComponentProps = useBaseComponent('ButtonGroup', {\n      props: {\n        variant,\n        dropdownExpandToViewport,\n      },\n      metadata: {\n        iconButtonsCount: itemCounts['icon-button'],\n        iconToggleButtonsCount: itemCounts['icon-toggle-button'],\n        iconFileInputsCount: itemCounts['icon-file-input'],\n        menuDropdownsCount: itemCounts['menu-dropdown'],\n        groupsCount: itemCounts.group,\n      },\n    });\n\n    const externalProps = getExternalProps(rest);\n\n    const componentMetadata: GeneratedAnalyticsMetadataButtonGroupComponent = {\n      name: 'awsui.ButtonGroup',\n      label: { root: 'self' },\n    };\n\n    return (\n      <InternalButtonGroup\n        {...baseProps}\n        {...baseComponentProps}\n        {...externalProps}\n        ref={ref}\n        variant={variant}\n        dropdownExpandToViewport={dropdownExpandToViewport}\n        style={style}\n        {...getAnalyticsMetadataAttribute({ component: componentMetadata })}\n      />\n    );\n  }\n);\n\nfunction getItemCounts(allItems: readonly ButtonGroupProps.ItemOrGroup[] = []) {\n  const counters = { 'icon-button': 0, 'icon-toggle-button': 0, 'icon-file-input': 0, 'menu-dropdown': 0, group: 0 };\n\n  function count(items: readonly ButtonGroupProps.ItemOrGroup[]) {\n    for (const item of items) {\n      counters[item.type] += 1;\n\n      if (item.type === 'group') {\n        count(item.items);\n      }\n    }\n  }\n  count(allItems);\n\n  return counters;\n}\n\napplyDisplayName(ButtonGroup, 'ButtonGroup');\nexport default ButtonGroup;\n"]}

package/lib/internal/template/button-group/interfaces.d.ts

@@ -96,8 +96,13 @@ export interface ButtonGroupProps extends BaseComponentProps {
      * Called when the user uploads files. The event detail object contains the id and files from the file input item.
      */
     onFilesChange?: NonCancelableEventHandler<ButtonGroupProps.FilesChangeDetails>;
+    /**
+     * @awsuiSystem core
+     */
+    style?: ButtonGroupProps.Style;
 }
 export interface InternalButtonGroupProps extends SomeRequired<ButtonGroupProps, 'dropdownExpandToViewport'>, InternalBaseComponentProps {
+    style?: ButtonGroupProps.Style;
 }
 export declare namespace ButtonGroupProps {
     type Variant = 'icon';
@@ -172,5 +177,40 @@ export declare namespace ButtonGroupProps {
          */
         focus(itemId: string): void;
     }
+    interface Style {
+        root?: {
+            background?: string;
+            borderColor?: string;
+            borderRadius?: string;
+            borderWidth?: string;
+            paddingBlock?: string;
+            paddingInline?: string;
+            boxShadow?: string;
+            focusRing?: {
+                borderColor?: string;
+                borderRadius?: string;
+                borderWidth?: string;
+            };
+        };
+        item?: {
+            color?: {
+                active?: string;
+                default?: string;
+                disabled?: string;
+                hover?: string;
+            };
+            boxShadow?: {
+                active?: string;
+                default?: string;
+                disabled?: string;
+                hover?: string;
+            };
+            focusRing?: {
+                borderColor?: string;
+                borderRadius?: string;
+                borderWidth?: string;
+            };
+        };
+    }
 }
 //# sourceMappingURL=interfaces.d.ts.map

package/lib/internal/template/button-group/interfaces.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/button-group/interfaces.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/button-group/interfaces.ts"],"names":[],"mappings":"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"}

package/lib/internal/template/button-group/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/button-group/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { ButtonDropdownProps } from '../button-dropdown/interfaces';\nimport { IconProps } from '../icon/interfaces';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { SomeRequired } from '../internal/types';\n\nexport interface ButtonGroupProps extends BaseComponentProps {\n  /**\n   * Adds `aria-label` to the button group toolbar element.\n   * Use this to provide a unique accessible name for each button group on the page.\n   */\n  ariaLabel?: string;\n  /**\n   * Determines the general styling of the button dropdown.\n   * * `icon` for icon buttons.\n   */\n  variant: ButtonGroupProps.Variant;\n  /**\n   * Use this property to determine dropdown placement strategy for all menu dropdown items.\n   *\n   * By default, the dropdown height is constrained to fit inside the height of its next scrollable container element.\n   * Enabling this property will allow the dropdown to extend beyond that container by using fixed positioning and\n   * [React Portals](https://reactjs.org/docs/portals.html).\n   *\n   * Set this property if the dropdown would otherwise be constrained by a scrollable container,\n   * for example inside table and split view layouts.\n   *\n   * We recommend you use discretion, and don't enable this property unless necessary\n   * because fixed positioning results in a slight, visible lag when scrolling complex pages.\n   */\n  dropdownExpandToViewport?: boolean;\n  /**\n   * Array of objects with a number of supported types.\n   *\n   * ### icon-button\n   *\n   * * `id` (string) - The unique identifier of the button, used as detail in `onItemClick` handler and to focus the button using `ref.focus(id)`.\n   * * `text` (string) - The name shown as a tooltip for this button.\n   * * `disabled` (optional, boolean) - The disabled state indication for this button.\n   * * `disabledReason` (optional, boolean) - Provides a reason why the button is disabled (only when `disabled` is `true`). If provided, the button becomes focusable.\n   * * `loading` (optional, boolean) - The loading state indication for this button.\n   * * `loadingText` (optional, string) - The loading text announced to screen readers.\n   * * `iconName` (optional, string) - Specifies the name of the icon, used with the [icon component](/components/icon/).\n   * * `iconAlt` (optional, string) - Specifies alternate text for the icon when using `iconUrl`.\n   * * `iconUrl` (optional, string) - Specifies the URL of a custom icon.\n   * * `iconSvg` (optional, ReactNode) - Custom SVG icon. Equivalent to the `svg` slot of the [icon component](/components/icon/).\n   * * `popoverFeedback` (optional, ReactNode) - Text that appears when the user clicks the button. Use to provide feedback to the user.\n   *\n   * ### icon-toggle-button\n   *\n   * * `id` (string) - The unique identifier of the button, used as detail in `onItemClick` handler and to focus the button using `ref.focus(id)`.\n   * * `pressed` (boolean) - The toggle button pressed state.\n   * * `text` (string) - The name shown as a tooltip for this button.\n   * * `disabled` (optional, boolean) - The disabled state indication for this button.\n   * * `disabledReason` (optional, boolean) - Provides a reason why the button is disabled (only when `disabled` is `true`). If provided, the button becomes focusable.\n   * * `loading` (optional, boolean) - The loading state indication for this button.\n   * * `loadingText` (optional, string) - The loading text announced to screen readers.\n   * * `iconName` (optional, string) - Specifies the name of the icon, used with the [icon component](/components/icon/).\n   * * `iconUrl` (optional, string) - Specifies the URL of a custom icon.\n   * * `iconSvg` (optional, ReactNode) - Custom SVG icon. Equivalent to the `svg` slot of the [icon component](/components/icon/).\n   * * `pressedIconName` (optional, string) - Specifies the name of the icon in pressed state, used with the [icon component](/components/icon/).\n   * * `pressedIconUrl` (optional, string) - Specifies the URL of a custom icon in pressed state.\n   * * `pressedIconSvg` (optional, ReactNode) - Custom SVG icon in pressed state. Equivalent to the `svg` slot of the [icon component](/components/icon/).\n   * * `popoverFeedback` (optional, ReactNode) - Text that appears when the user clicks the button. Use to provide feedback to the user.\n   * * `pressedPopoverFeedback` (optional, ReactNode) - Text that appears when the user clicks the button in pressed state. Defaults to `popoverFeedback`.\n   *\n   * * ### file-input\n   *\n   * * `id` (string) - The unique identifier of the button, used as detail in `onFilesChange`.\n   * * `text` (string) - The name of the menu button shown as a tooltip.\n   * * `accept` (optional, string) - Specifies the native file input `accept` attribute to describe the allow-list of file types.\n   * * `multiple` (optional, string) - Specifies the native file input `multiple` attribute to allow users entering more than one file.\n   *\n   * ### menu-dropdown\n   *\n   * * `id` (string) - The unique identifier of the button, used as detail in `onItemClick`.\n   * * `text` (string) - The name of the menu button shown as a tooltip.\n   * * `disabled` (optional, boolean) - The disabled state indication for the menu button.\n   * * `disabledReason` (optional, boolean) - Provides a reason why the button is disabled (only when `disabled` is `true`). If provided, the button becomes focusable.\n   * * `loading` (optional, boolean) - The loading state indication for the menu button.\n   * * `loadingText` (optional, string) - The loading text announced to screen readers.\n   * * `items` (ButtonDropdownProps.ItemOrGroup[]) - The array of dropdown items that belong to this menu.\n   *\n   * ### group\n   *\n   * * `text` (string) - The name of the group rendered as ARIA label for this group.\n   * * `items` ((ButtonGroupProps.IconButton | ButtonGroupProps.MenuDropdown)[]) - The array of items that belong to this group.\n   */\n  items: ReadonlyArray<ButtonGroupProps.ItemOrGroup>;\n  /**\n   * Called when the user clicks on an item, and the item is not disabled. The event detail object contains the id of the clicked item.\n   */\n  onItemClick?: NonCancelableEventHandler<ButtonGroupProps.ItemClickDetails>;\n  /**\n   * Called when the user uploads files. The event detail object contains the id and files from the file input item.\n   */\n  onFilesChange?: NonCancelableEventHandler<ButtonGroupProps.FilesChangeDetails>;\n}\n\nexport interface InternalButtonGroupProps\n  extends SomeRequired<ButtonGroupProps, 'dropdownExpandToViewport'>,\n    InternalBaseComponentProps {}\n\nexport namespace ButtonGroupProps {\n  export type Variant = 'icon';\n\n  export type ItemOrGroup = Item | Group;\n  export type Item = IconButton | IconToggleButton | IconFileInput | MenuDropdown;\n\n  export interface IconButton {\n    type: 'icon-button';\n    id: string;\n    text: string;\n    disabled?: boolean;\n    disabledReason?: string;\n    loading?: boolean;\n    loadingText?: string;\n    iconName?: IconProps.Name;\n    iconAlt?: string;\n    iconUrl?: string;\n    iconSvg?: React.ReactNode;\n    popoverFeedback?: React.ReactNode;\n  }\n\n  export interface IconToggleButton {\n    type: 'icon-toggle-button';\n    id: string;\n    text: string;\n    pressed: boolean;\n    disabled?: boolean;\n    disabledReason?: string;\n    loading?: boolean;\n    loadingText?: string;\n    iconName?: IconProps.Name;\n    iconUrl?: string;\n    iconSvg?: React.ReactNode;\n    pressedIconName?: IconProps.Name;\n    pressedIconUrl?: string;\n    pressedIconSvg?: React.ReactNode;\n    popoverFeedback?: React.ReactNode;\n    pressedPopoverFeedback?: React.ReactNode;\n  }\n\n  export interface IconFileInput {\n    type: 'icon-file-input';\n    id: string;\n    text: string;\n    accept?: string;\n    multiple?: boolean;\n  }\n\n  export interface MenuDropdown {\n    type: 'menu-dropdown';\n    id: string;\n    text: string;\n    disabled?: boolean;\n    disabledReason?: string;\n    loading?: boolean;\n    loadingText?: string;\n    items: ReadonlyArray<ButtonDropdownProps.ItemOrGroup>;\n  }\n\n  export interface Group {\n    type: 'group';\n    text: string;\n    items: ReadonlyArray<ButtonGroupProps.Item>;\n  }\n\n  export interface ItemClickDetails {\n    id: string;\n    pressed?: boolean;\n    checked?: boolean;\n  }\n\n  export interface FilesChangeDetails {\n    id: string;\n    files: File[];\n  }\n\n  export interface Ref {\n    /**\n     * Focuses button group item by id.\n     */\n    focus(itemId: string): void;\n  }\n}\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/button-group/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { ButtonDropdownProps } from '../button-dropdown/interfaces';\nimport { IconProps } from '../icon/interfaces';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { SomeRequired } from '../internal/types';\n\nexport interface ButtonGroupProps extends BaseComponentProps {\n  /**\n   * Adds `aria-label` to the button group toolbar element.\n   * Use this to provide a unique accessible name for each button group on the page.\n   */\n  ariaLabel?: string;\n  /**\n   * Determines the general styling of the button dropdown.\n   * * `icon` for icon buttons.\n   */\n  variant: ButtonGroupProps.Variant;\n  /**\n   * Use this property to determine dropdown placement strategy for all menu dropdown items.\n   *\n   * By default, the dropdown height is constrained to fit inside the height of its next scrollable container element.\n   * Enabling this property will allow the dropdown to extend beyond that container by using fixed positioning and\n   * [React Portals](https://reactjs.org/docs/portals.html).\n   *\n   * Set this property if the dropdown would otherwise be constrained by a scrollable container,\n   * for example inside table and split view layouts.\n   *\n   * We recommend you use discretion, and don't enable this property unless necessary\n   * because fixed positioning results in a slight, visible lag when scrolling complex pages.\n   */\n  dropdownExpandToViewport?: boolean;\n  /**\n   * Array of objects with a number of supported types.\n   *\n   * ### icon-button\n   *\n   * * `id` (string) - The unique identifier of the button, used as detail in `onItemClick` handler and to focus the button using `ref.focus(id)`.\n   * * `text` (string) - The name shown as a tooltip for this button.\n   * * `disabled` (optional, boolean) - The disabled state indication for this button.\n   * * `disabledReason` (optional, boolean) - Provides a reason why the button is disabled (only when `disabled` is `true`). If provided, the button becomes focusable.\n   * * `loading` (optional, boolean) - The loading state indication for this button.\n   * * `loadingText` (optional, string) - The loading text announced to screen readers.\n   * * `iconName` (optional, string) - Specifies the name of the icon, used with the [icon component](/components/icon/).\n   * * `iconAlt` (optional, string) - Specifies alternate text for the icon when using `iconUrl`.\n   * * `iconUrl` (optional, string) - Specifies the URL of a custom icon.\n   * * `iconSvg` (optional, ReactNode) - Custom SVG icon. Equivalent to the `svg` slot of the [icon component](/components/icon/).\n   * * `popoverFeedback` (optional, ReactNode) - Text that appears when the user clicks the button. Use to provide feedback to the user.\n   *\n   * ### icon-toggle-button\n   *\n   * * `id` (string) - The unique identifier of the button, used as detail in `onItemClick` handler and to focus the button using `ref.focus(id)`.\n   * * `pressed` (boolean) - The toggle button pressed state.\n   * * `text` (string) - The name shown as a tooltip for this button.\n   * * `disabled` (optional, boolean) - The disabled state indication for this button.\n   * * `disabledReason` (optional, boolean) - Provides a reason why the button is disabled (only when `disabled` is `true`). If provided, the button becomes focusable.\n   * * `loading` (optional, boolean) - The loading state indication for this button.\n   * * `loadingText` (optional, string) - The loading text announced to screen readers.\n   * * `iconName` (optional, string) - Specifies the name of the icon, used with the [icon component](/components/icon/).\n   * * `iconUrl` (optional, string) - Specifies the URL of a custom icon.\n   * * `iconSvg` (optional, ReactNode) - Custom SVG icon. Equivalent to the `svg` slot of the [icon component](/components/icon/).\n   * * `pressedIconName` (optional, string) - Specifies the name of the icon in pressed state, used with the [icon component](/components/icon/).\n   * * `pressedIconUrl` (optional, string) - Specifies the URL of a custom icon in pressed state.\n   * * `pressedIconSvg` (optional, ReactNode) - Custom SVG icon in pressed state. Equivalent to the `svg` slot of the [icon component](/components/icon/).\n   * * `popoverFeedback` (optional, ReactNode) - Text that appears when the user clicks the button. Use to provide feedback to the user.\n   * * `pressedPopoverFeedback` (optional, ReactNode) - Text that appears when the user clicks the button in pressed state. Defaults to `popoverFeedback`.\n   *\n   * * ### file-input\n   *\n   * * `id` (string) - The unique identifier of the button, used as detail in `onFilesChange`.\n   * * `text` (string) - The name of the menu button shown as a tooltip.\n   * * `accept` (optional, string) - Specifies the native file input `accept` attribute to describe the allow-list of file types.\n   * * `multiple` (optional, string) - Specifies the native file input `multiple` attribute to allow users entering more than one file.\n   *\n   * ### menu-dropdown\n   *\n   * * `id` (string) - The unique identifier of the button, used as detail in `onItemClick`.\n   * * `text` (string) - The name of the menu button shown as a tooltip.\n   * * `disabled` (optional, boolean) - The disabled state indication for the menu button.\n   * * `disabledReason` (optional, boolean) - Provides a reason why the button is disabled (only when `disabled` is `true`). If provided, the button becomes focusable.\n   * * `loading` (optional, boolean) - The loading state indication for the menu button.\n   * * `loadingText` (optional, string) - The loading text announced to screen readers.\n   * * `items` (ButtonDropdownProps.ItemOrGroup[]) - The array of dropdown items that belong to this menu.\n   *\n   * ### group\n   *\n   * * `text` (string) - The name of the group rendered as ARIA label for this group.\n   * * `items` ((ButtonGroupProps.IconButton | ButtonGroupProps.MenuDropdown)[]) - The array of items that belong to this group.\n   */\n  items: ReadonlyArray<ButtonGroupProps.ItemOrGroup>;\n  /**\n   * Called when the user clicks on an item, and the item is not disabled. The event detail object contains the id of the clicked item.\n   */\n  onItemClick?: NonCancelableEventHandler<ButtonGroupProps.ItemClickDetails>;\n  /**\n   * Called when the user uploads files. The event detail object contains the id and files from the file input item.\n   */\n  onFilesChange?: NonCancelableEventHandler<ButtonGroupProps.FilesChangeDetails>;\n  /**\n   * @awsuiSystem core\n   */\n  style?: ButtonGroupProps.Style;\n}\n\nexport interface InternalButtonGroupProps\n  extends SomeRequired<ButtonGroupProps, 'dropdownExpandToViewport'>,\n    InternalBaseComponentProps {\n  style?: ButtonGroupProps.Style;\n}\n\nexport namespace ButtonGroupProps {\n  export type Variant = 'icon';\n\n  export type ItemOrGroup = Item | Group;\n  export type Item = IconButton | IconToggleButton | IconFileInput | MenuDropdown;\n\n  export interface IconButton {\n    type: 'icon-button';\n    id: string;\n    text: string;\n    disabled?: boolean;\n    disabledReason?: string;\n    loading?: boolean;\n    loadingText?: string;\n    iconName?: IconProps.Name;\n    iconAlt?: string;\n    iconUrl?: string;\n    iconSvg?: React.ReactNode;\n    popoverFeedback?: React.ReactNode;\n  }\n\n  export interface IconToggleButton {\n    type: 'icon-toggle-button';\n    id: string;\n    text: string;\n    pressed: boolean;\n    disabled?: boolean;\n    disabledReason?: string;\n    loading?: boolean;\n    loadingText?: string;\n    iconName?: IconProps.Name;\n    iconUrl?: string;\n    iconSvg?: React.ReactNode;\n    pressedIconName?: IconProps.Name;\n    pressedIconUrl?: string;\n    pressedIconSvg?: React.ReactNode;\n    popoverFeedback?: React.ReactNode;\n    pressedPopoverFeedback?: React.ReactNode;\n  }\n\n  export interface IconFileInput {\n    type: 'icon-file-input';\n    id: string;\n    text: string;\n    accept?: string;\n    multiple?: boolean;\n  }\n\n  export interface MenuDropdown {\n    type: 'menu-dropdown';\n    id: string;\n    text: string;\n    disabled?: boolean;\n    disabledReason?: string;\n    loading?: boolean;\n    loadingText?: string;\n    items: ReadonlyArray<ButtonDropdownProps.ItemOrGroup>;\n  }\n\n  export interface Group {\n    type: 'group';\n    text: string;\n    items: ReadonlyArray<ButtonGroupProps.Item>;\n  }\n\n  export interface ItemClickDetails {\n    id: string;\n    pressed?: boolean;\n    checked?: boolean;\n  }\n\n  export interface FilesChangeDetails {\n    id: string;\n    files: File[];\n  }\n\n  export interface Ref {\n    /**\n     * Focuses button group item by id.\n     */\n    focus(itemId: string): void;\n  }\n  export interface Style {\n    root?: {\n      background?: string;\n      borderColor?: string;\n      borderRadius?: string;\n      borderWidth?: string;\n      paddingBlock?: string;\n      paddingInline?: string;\n      boxShadow?: string;\n      focusRing?: {\n        borderColor?: string;\n        borderRadius?: string;\n        borderWidth?: string;\n      };\n    };\n    item?: {\n      color?: {\n        active?: string;\n        default?: string;\n        disabled?: string;\n        hover?: string;\n      };\n      boxShadow?: {\n        active?: string;\n        default?: string;\n        disabled?: string;\n        hover?: string;\n      };\n      focusRing?: {\n        borderColor?: string;\n        borderRadius?: string;\n        borderWidth?: string;\n      };\n    };\n  }\n}\n"]}

package/lib/internal/template/button-group/internal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/button-group/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAuE,MAAM,OAAO,CAAC;AAgB5F,OAAO,EAAE,gBAAgB,EAAE,wBAAwB,EAAE,MAAM,cAAc,CAAC;AAM1E,QAAA,MAAM,mBAAmB,uGAuKxB,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
+{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/button-group/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAuE,MAAM,OAAO,CAAC;AAgB5F,OAAO,EAAE,gBAAgB,EAAE,wBAAwB,EAAE,MAAM,cAAc,CAAC;AAO1E,QAAA,MAAM,mBAAmB,uGA4KxB,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/lib/internal/template/button-group/internal.js

@@ -12,10 +12,11 @@ import { KeyCode } from '../internal/keycode';
 import { circleIndex } from '../internal/utils/circle-index';
 import handleKey from '../internal/utils/handle-key';
 import ItemElement from './item-element.js';
+import { getButtonGroupStyles } from './style';
 import styles from './styles.css.js';
 import testUtilStyles from './test-classes/styles.css.js';
 const InternalButtonGroup = forwardRef((_a, ref) => {
-    var { items = [], onItemClick, onFilesChange, ariaLabel, dropdownExpandToViewport, __internalRootRef } = _a, props = __rest(_a, ["items", "onItemClick", "onFilesChange", "ariaLabel", "dropdownExpandToViewport", "__internalRootRef"]);
+    var { items = [], onItemClick, onFilesChange, ariaLabel, dropdownExpandToViewport, style, __internalRootRef } = _a, props = __rest(_a, ["items", "onItemClick", "onFilesChange", "ariaLabel", "dropdownExpandToViewport", "style", "__internalRootRef"]);
     const baseProps = getBaseProps(props);
     const focusedIdRef = useRef(null);
     const navigationAPI = useRef(null);
@@ -102,10 +103,11 @@ const InternalButtonGroup = forwardRef((_a, ref) => {
         }
         return getAllFocusables(target).filter(el => isElementRegistered(el) && !isElementDisabled(el));
     }
-    return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(styles.root, testUtilStyles['button-group'], baseProps.className), ref: containerRef, role: "toolbar", "aria-label": ariaLabel, onFocus: onFocus, onBlur: onBlur, onKeyDown: onKeyDown }),
+    const stylePropertiesAndVariables = getButtonGroupStyles(style);
+    return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(styles.root, testUtilStyles['button-group'], baseProps.className), ref: containerRef, role: "toolbar", "aria-label": ariaLabel, onFocus: onFocus, onBlur: onBlur, onKeyDown: onKeyDown, style: stylePropertiesAndVariables }),
         React.createElement(SingleTabStopNavigationProvider, { ref: navigationAPI, navigationActive: true, getNextFocusTarget: getNextFocusTarget, onUnregisterActive: onUnregisterActive }, items.map((itemOrGroup, index) => {
             var _a;
-            const itemContent = (item, position) => (React.createElement(ItemElement, { key: item.id, item: item, dropdownExpandToViewport: dropdownExpandToViewport, tooltip: tooltip, setTooltip: setTooltip, onItemClick: onItemClick, onFilesChange: onFilesChange, ref: element => (itemsRef.current[item.id] = element), position: position }));
+            const itemContent = (item, position) => (React.createElement(ItemElement, { key: item.id, item: item, dropdownExpandToViewport: dropdownExpandToViewport, tooltip: tooltip, setTooltip: setTooltip, onItemClick: onItemClick, onFilesChange: onFilesChange, ref: element => (itemsRef.current[item.id] = element), position: position, style: style }));
             const isGroupBefore = ((_a = items[index - 1]) === null || _a === void 0 ? void 0 : _a.type) === 'group';
             const currentItem = items[index];
             const isGroupNow = (currentItem === null || currentItem === void 0 ? void 0 : currentItem.type) === 'group';

package/lib/internal/template/button-group/internal.js.map

@@ -1 +1 @@
-{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/button-group/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { forwardRef, useEffect, useImperativeHandle, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { useMergeRefs, warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nimport { ButtonProps } from '../button/interfaces';\nimport { getBaseProps } from '../internal/base-component';\nimport { getAllFocusables } from '../internal/components/focus-lock/utils';\nimport {\n  SingleTabStopNavigationAPI,\n  SingleTabStopNavigationProvider,\n} from '../internal/context/single-tab-stop-navigation-context';\nimport { hasModifierKeys } from '../internal/events';\nimport { KeyCode } from '../internal/keycode';\nimport { circleIndex } from '../internal/utils/circle-index';\nimport handleKey from '../internal/utils/handle-key';\nimport { ButtonGroupProps, InternalButtonGroupProps } from './interfaces';\nimport ItemElement from './item-element.js';\n\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\nconst InternalButtonGroup = forwardRef(\n  (\n    {\n      items = [],\n      onItemClick,\n      onFilesChange,\n      ariaLabel,\n      dropdownExpandToViewport,\n      __internalRootRef,\n      ...props\n    }: InternalButtonGroupProps,\n    ref: React.Ref<ButtonGroupProps.Ref>\n  ) => {\n    const baseProps = getBaseProps(props);\n    const focusedIdRef = useRef<null | string>(null);\n    const navigationAPI = useRef<SingleTabStopNavigationAPI>(null);\n    const containerObjectRef = useRef<HTMLDivElement>(null);\n    const containerRef = useMergeRefs(containerObjectRef, __internalRootRef);\n    const itemsRef = useRef<Record<string, ButtonProps.Ref | null>>({});\n    const [tooltip, setTooltip] = useState<null | { item: string; feedback: boolean }>(null);\n\n    useImperativeHandle(ref, () => ({\n      focus: id => {\n        itemsRef.current[id]?.focus();\n      },\n    }));\n\n    function getNextFocusTarget(): null | HTMLElement {\n      if (containerObjectRef.current) {\n        const buttons: HTMLButtonElement[] = Array.from(\n          containerObjectRef.current.querySelectorAll(`.${testUtilStyles.item}`)\n        );\n        const activeButtons = buttons.filter(button => !button.disabled);\n        return activeButtons.find(button => button.dataset.itemid === focusedIdRef.current) ?? activeButtons[0] ?? null;\n      }\n      return null;\n    }\n\n    function onUnregisterActive(focusableElement: HTMLElement) {\n      // Only refocus when the node is actually removed (no such ID anymore).\n      const target = navigationAPI.current?.getFocusTarget();\n\n      if (target && target.dataset.itemid !== focusableElement.dataset.itemid) {\n        target.focus();\n      }\n    }\n\n    useEffect(() => {\n      navigationAPI.current?.updateFocusTarget();\n    });\n\n    function onFocus(event: React.FocusEvent) {\n      if (event.target instanceof HTMLElement && event.target.dataset.itemid) {\n        focusedIdRef.current = event.target.dataset.itemid;\n      }\n\n      navigationAPI.current?.updateFocusTarget();\n    }\n\n    function onBlur() {\n      navigationAPI.current?.updateFocusTarget();\n    }\n\n    function onKeyDown(event: React.KeyboardEvent) {\n      const focusTarget = navigationAPI.current?.getFocusTarget();\n      const specialKeys = [KeyCode.right, KeyCode.left, KeyCode.end, KeyCode.home, KeyCode.pageUp, KeyCode.pageDown];\n      if (hasModifierKeys(event) || specialKeys.indexOf(event.keyCode) === -1) {\n        return;\n      }\n      if (!containerObjectRef.current || !focusTarget) {\n        return;\n      }\n      // Ignore navigation when the focused element is not an item.\n      if (document.activeElement && !document.activeElement.matches(`.${testUtilStyles.item}`)) {\n        return;\n      }\n      event.preventDefault();\n\n      const focusables = getFocusablesFrom(containerObjectRef.current);\n      const activeIndex = focusables.indexOf(focusTarget);\n      handleKey(event as any, {\n        onHome: () => focusElement(focusables[0]),\n        onEnd: () => focusElement(focusables[focusables.length - 1]),\n        onInlineStart: () => focusElement(focusables[circleIndex(activeIndex - 1, [0, focusables.length - 1])]),\n        onInlineEnd: () => focusElement(focusables[circleIndex(activeIndex + 1, [0, focusables.length - 1])]),\n      });\n    }\n\n    function focusElement(element: HTMLElement) {\n      element.focus();\n    }\n\n    // List all non-disabled and registered focusables: those are eligible for keyboard navigation.\n    function getFocusablesFrom(target: HTMLElement) {\n      function isElementRegistered(element: HTMLElement) {\n        return navigationAPI.current?.isRegistered(element) ?? false;\n      }\n\n      function isElementDisabled(element: HTMLElement) {\n        if (element instanceof HTMLButtonElement) {\n          return element.disabled;\n        }\n\n        return false;\n      }\n\n      return getAllFocusables(target).filter(el => isElementRegistered(el) && !isElementDisabled(el));\n    }\n\n    return (\n      <div\n        {...baseProps}\n        className={clsx(styles.root, testUtilStyles['button-group'], baseProps.className)}\n        ref={containerRef}\n        role=\"toolbar\"\n        aria-label={ariaLabel}\n        onFocus={onFocus}\n        onBlur={onBlur}\n        onKeyDown={onKeyDown}\n      >\n        <SingleTabStopNavigationProvider\n          ref={navigationAPI}\n          navigationActive={true}\n          getNextFocusTarget={getNextFocusTarget}\n          onUnregisterActive={onUnregisterActive}\n        >\n          {items.map((itemOrGroup, index) => {\n            const itemContent = (item: ButtonGroupProps.Item, position: string) => (\n              <ItemElement\n                key={item.id}\n                item={item}\n                dropdownExpandToViewport={dropdownExpandToViewport}\n                tooltip={tooltip}\n                setTooltip={setTooltip}\n                onItemClick={onItemClick}\n                onFilesChange={onFilesChange}\n                ref={element => (itemsRef.current[item.id] = element)}\n                position={position}\n              />\n            );\n\n            const isGroupBefore = items[index - 1]?.type === 'group';\n            const currentItem = items[index];\n            const isGroupNow = currentItem?.type === 'group';\n            const shouldAddDivider = isGroupBefore || (!isGroupBefore && isGroupNow && index !== 0);\n\n            if (isGroupNow && currentItem.items.length === 0) {\n              warnOnce('ButtonGroup', 'Empty group detected. Empty groups are not allowed.');\n            }\n\n            return (\n              <React.Fragment key={itemOrGroup.type === 'group' ? index : itemOrGroup.id}>\n                {shouldAddDivider && <div className={styles.divider} />}\n                {itemOrGroup.type === 'group' ? (\n                  <div key={index} role=\"group\" aria-label={itemOrGroup.text} className={styles.group}>\n                    {itemOrGroup.items.map((item, subIndex) => itemContent(item, `${index + 1},${subIndex + 1}`))}\n                  </div>\n                ) : (\n                  itemContent(itemOrGroup, `${index + 1}`)\n                )}\n              </React.Fragment>\n            );\n          })}\n        </SingleTabStopNavigationProvider>\n      </div>\n    );\n  }\n);\n\nexport default InternalButtonGroup;\n"]}
+{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/button-group/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { forwardRef, useEffect, useImperativeHandle, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { useMergeRefs, warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nimport { ButtonProps } from '../button/interfaces';\nimport { getBaseProps } from '../internal/base-component';\nimport { getAllFocusables } from '../internal/components/focus-lock/utils';\nimport {\n  SingleTabStopNavigationAPI,\n  SingleTabStopNavigationProvider,\n} from '../internal/context/single-tab-stop-navigation-context';\nimport { hasModifierKeys } from '../internal/events';\nimport { KeyCode } from '../internal/keycode';\nimport { circleIndex } from '../internal/utils/circle-index';\nimport handleKey from '../internal/utils/handle-key';\nimport { ButtonGroupProps, InternalButtonGroupProps } from './interfaces';\nimport ItemElement from './item-element.js';\nimport { getButtonGroupStyles } from './style';\n\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\nconst InternalButtonGroup = forwardRef(\n  (\n    {\n      items = [],\n      onItemClick,\n      onFilesChange,\n      ariaLabel,\n      dropdownExpandToViewport,\n      style,\n      __internalRootRef,\n      ...props\n    }: InternalButtonGroupProps,\n    ref: React.Ref<ButtonGroupProps.Ref>\n  ) => {\n    const baseProps = getBaseProps(props);\n    const focusedIdRef = useRef<null | string>(null);\n    const navigationAPI = useRef<SingleTabStopNavigationAPI>(null);\n    const containerObjectRef = useRef<HTMLDivElement>(null);\n    const containerRef = useMergeRefs(containerObjectRef, __internalRootRef);\n    const itemsRef = useRef<Record<string, ButtonProps.Ref | null>>({});\n    const [tooltip, setTooltip] = useState<null | { item: string; feedback: boolean }>(null);\n\n    useImperativeHandle(ref, () => ({\n      focus: id => {\n        itemsRef.current[id]?.focus();\n      },\n    }));\n\n    function getNextFocusTarget(): null | HTMLElement {\n      if (containerObjectRef.current) {\n        const buttons: HTMLButtonElement[] = Array.from(\n          containerObjectRef.current.querySelectorAll(`.${testUtilStyles.item}`)\n        );\n        const activeButtons = buttons.filter(button => !button.disabled);\n        return activeButtons.find(button => button.dataset.itemid === focusedIdRef.current) ?? activeButtons[0] ?? null;\n      }\n      return null;\n    }\n\n    function onUnregisterActive(focusableElement: HTMLElement) {\n      // Only refocus when the node is actually removed (no such ID anymore).\n      const target = navigationAPI.current?.getFocusTarget();\n\n      if (target && target.dataset.itemid !== focusableElement.dataset.itemid) {\n        target.focus();\n      }\n    }\n\n    useEffect(() => {\n      navigationAPI.current?.updateFocusTarget();\n    });\n\n    function onFocus(event: React.FocusEvent) {\n      if (event.target instanceof HTMLElement && event.target.dataset.itemid) {\n        focusedIdRef.current = event.target.dataset.itemid;\n      }\n\n      navigationAPI.current?.updateFocusTarget();\n    }\n\n    function onBlur() {\n      navigationAPI.current?.updateFocusTarget();\n    }\n\n    function onKeyDown(event: React.KeyboardEvent) {\n      const focusTarget = navigationAPI.current?.getFocusTarget();\n      const specialKeys = [KeyCode.right, KeyCode.left, KeyCode.end, KeyCode.home, KeyCode.pageUp, KeyCode.pageDown];\n      if (hasModifierKeys(event) || specialKeys.indexOf(event.keyCode) === -1) {\n        return;\n      }\n      if (!containerObjectRef.current || !focusTarget) {\n        return;\n      }\n      // Ignore navigation when the focused element is not an item.\n      if (document.activeElement && !document.activeElement.matches(`.${testUtilStyles.item}`)) {\n        return;\n      }\n      event.preventDefault();\n\n      const focusables = getFocusablesFrom(containerObjectRef.current);\n      const activeIndex = focusables.indexOf(focusTarget);\n      handleKey(event as any, {\n        onHome: () => focusElement(focusables[0]),\n        onEnd: () => focusElement(focusables[focusables.length - 1]),\n        onInlineStart: () => focusElement(focusables[circleIndex(activeIndex - 1, [0, focusables.length - 1])]),\n        onInlineEnd: () => focusElement(focusables[circleIndex(activeIndex + 1, [0, focusables.length - 1])]),\n      });\n    }\n\n    function focusElement(element: HTMLElement) {\n      element.focus();\n    }\n\n    // List all non-disabled and registered focusables: those are eligible for keyboard navigation.\n    function getFocusablesFrom(target: HTMLElement) {\n      function isElementRegistered(element: HTMLElement) {\n        return navigationAPI.current?.isRegistered(element) ?? false;\n      }\n\n      function isElementDisabled(element: HTMLElement) {\n        if (element instanceof HTMLButtonElement) {\n          return element.disabled;\n        }\n\n        return false;\n      }\n\n      return getAllFocusables(target).filter(el => isElementRegistered(el) && !isElementDisabled(el));\n    }\n\n    const stylePropertiesAndVariables = getButtonGroupStyles(style);\n\n    return (\n      <div\n        {...baseProps}\n        className={clsx(styles.root, testUtilStyles['button-group'], baseProps.className)}\n        ref={containerRef}\n        role=\"toolbar\"\n        aria-label={ariaLabel}\n        onFocus={onFocus}\n        onBlur={onBlur}\n        onKeyDown={onKeyDown}\n        style={stylePropertiesAndVariables}\n      >\n        <SingleTabStopNavigationProvider\n          ref={navigationAPI}\n          navigationActive={true}\n          getNextFocusTarget={getNextFocusTarget}\n          onUnregisterActive={onUnregisterActive}\n        >\n          {items.map((itemOrGroup, index) => {\n            const itemContent = (item: ButtonGroupProps.Item, position: string) => (\n              <ItemElement\n                key={item.id}\n                item={item}\n                dropdownExpandToViewport={dropdownExpandToViewport}\n                tooltip={tooltip}\n                setTooltip={setTooltip}\n                onItemClick={onItemClick}\n                onFilesChange={onFilesChange}\n                ref={element => (itemsRef.current[item.id] = element)}\n                position={position}\n                style={style}\n              />\n            );\n\n            const isGroupBefore = items[index - 1]?.type === 'group';\n            const currentItem = items[index];\n            const isGroupNow = currentItem?.type === 'group';\n            const shouldAddDivider = isGroupBefore || (!isGroupBefore && isGroupNow && index !== 0);\n\n            if (isGroupNow && currentItem.items.length === 0) {\n              warnOnce('ButtonGroup', 'Empty group detected. Empty groups are not allowed.');\n            }\n\n            return (\n              <React.Fragment key={itemOrGroup.type === 'group' ? index : itemOrGroup.id}>\n                {shouldAddDivider && <div className={styles.divider} />}\n                {itemOrGroup.type === 'group' ? (\n                  <div key={index} role=\"group\" aria-label={itemOrGroup.text} className={styles.group}>\n                    {itemOrGroup.items.map((item, subIndex) => itemContent(item, `${index + 1},${subIndex + 1}`))}\n                  </div>\n                ) : (\n                  itemContent(itemOrGroup, `${index + 1}`)\n                )}\n              </React.Fragment>\n            );\n          })}\n        </SingleTabStopNavigationProvider>\n      </div>\n    );\n  }\n);\n\nexport default InternalButtonGroup;\n"]}

package/lib/internal/template/button-group/item-element.d.ts

@@ -16,6 +16,7 @@ interface ItemElementProps {
     onItemClick?: NonCancelableEventHandler<ButtonGroupProps.ItemClickDetails> | undefined;
     onFilesChange?: NonCancelableEventHandler<ButtonGroupProps.FilesChangeDetails> | undefined;
     position: string;
+    style?: ButtonGroupProps.Style;
 }
 declare const ItemElement: React.ForwardRefExoticComponent<ItemElementProps & React.RefAttributes<ButtonProps.Ref>>;
 export default ItemElement;

package/lib/internal/template/button-group/item-element.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"item-element.d.ts","sourceRoot":"","sources":["../../../src/button-group/item-element.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA6D,MAAM,OAAO,CAAC;AAIlF,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAGtD,OAAO,EAAuB,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAKpF,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAKhD,UAAU,gBAAgB;IACxB,IAAI,EAAE,gBAAgB,CAAC,IAAI,CAAC;IAC5B,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,OAAO,EAAE,IAAI,GAAG;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAA;KAAE,CAAC;IACpD,UAAU,EAAE,CAAC,OAAO,EAAE,IAAI,GAAG;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAA;KAAE,KAAK,IAAI,CAAC;IAC1E,WAAW,CAAC,EAAE,yBAAyB,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,GAAG,SAAS,CAAC;IACvF,aAAa,CAAC,EAAE,yBAAyB,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,GAAG,SAAS,CAAC;IAC3F,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,QAAA,MAAM,WAAW,0FA+IhB,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"item-element.d.ts","sourceRoot":"","sources":["../../../src/button-group/item-element.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA6D,MAAM,OAAO,CAAC;AAIlF,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAGtD,OAAO,EAAuB,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAKpF,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAMhD,UAAU,gBAAgB;IACxB,IAAI,EAAE,gBAAgB,CAAC,IAAI,CAAC;IAC5B,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,OAAO,EAAE,IAAI,GAAG;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAA;KAAE,CAAC;IACpD,UAAU,EAAE,CAAC,OAAO,EAAE,IAAI,GAAG;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAA;KAAE,KAAK,IAAI,CAAC;IAC1E,WAAW,CAAC,EAAE,yBAAyB,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,GAAG,SAAS,CAAC;IACvF,aAAa,CAAC,EAAE,yBAAyB,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,GAAG,SAAS,CAAC;IAC3F,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,gBAAgB,CAAC,KAAK,CAAC;CAChC;AAED,QAAA,MAAM,WAAW,0FA2JhB,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/lib/internal/template/button-group/item-element.js

@@ -8,8 +8,9 @@ import FileInputItem from './file-input-item';
 import IconButtonItem from './icon-button-item';
 import IconToggleButtonItem from './icon-toggle-button-item.js';
 import MenuDropdownItem from './menu-dropdown-item';
+import { getButtonGroupItemStyles } from './style';
 import styles from './styles.css.js';
-const ItemElement = forwardRef(({ item, dropdownExpandToViewport, tooltip, setTooltip, onItemClick, onFilesChange, position }, ref) => {
+const ItemElement = forwardRef(({ item, dropdownExpandToViewport, tooltip, setTooltip, onItemClick, onFilesChange, position, style, }, ref) => {
     const containerRef = useRef(null);
     const buttonRef = useRef(null);
     const fileInputRef = useRef(null);
@@ -70,6 +71,7 @@ const ItemElement = forwardRef(({ item, dropdownExpandToViewport, tooltip, setTo
         fireCancelableEvent(onFilesChange, event.detail, event);
         setTooltip(null);
     };
+    const itemStylePropertiesAndVariables = getButtonGroupItemStyles(style);
     return (React.createElement("div", Object.assign({ key: item.id, className: styles['item-wrapper'], ref: containerRef, onPointerEnter: () => onShowTooltipSoft(true), onPointerLeave: () => onShowTooltipSoft(false), onFocus: event => {
             // Showing no tooltip when the focus comes from inside the container.
             // This is needed to prevent the tooltip after a menu closes with item selection or Escape.
@@ -77,7 +79,7 @@ const ItemElement = forwardRef(({ item, dropdownExpandToViewport, tooltip, setTo
                 return;
             }
             onShowTooltipHard(true);
-        }, onBlur: () => onShowTooltipHard(false) }, (item.type === 'menu-dropdown' || item.disabled
+        }, onBlur: () => onShowTooltipHard(false), style: itemStylePropertiesAndVariables }, (item.type === 'menu-dropdown' || item.disabled
         ? {}
         : getAnalyticsMetadataAttribute({ detail: { position, id: item.id } }))),
         item.type === 'icon-button' && (React.createElement(IconButtonItem, { ref: buttonRef, item: item, onItemClick: onClickHandler, showTooltip: (tooltip === null || tooltip === void 0 ? void 0 : tooltip.item) === item.id, showFeedback: !!(tooltip === null || tooltip === void 0 ? void 0 : tooltip.feedback), onTooltipDismiss: () => setTooltip(null) })),