@cloudscape-design/components-themeable 3.0.951 → 3.0.952

package/lib/internal/manifest.json

@@ -1,3 +1,3 @@
 {
-  "commit": "80e41ae23b9b8f34e39608bfcbe6886df13a00cd"
+  "commit": "0e8e875d2e19e4123db4770aa25a786ba4a969f7"
 }

package/lib/internal/template/app-layout/drawer/overflow-menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"overflow-menu.d.ts","sourceRoot":"","sources":["../../../../src/app-layout/drawer/overflow-menu.tsx"],"names":[],"mappings":";AAIA,OAAO,EACL,mBAAmB,EACnB,2BAA2B,EAE5B,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAI/C,KAAK,MAAM,GAAG,cAAc,CAAC,MAAM,GAAG;IAAE,MAAM,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC;AAE3D,UAAU,iBAAiB;IACzB,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACrB,WAAW,EAAE,sBAAsB,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,CAAC;IAC1E,oBAAoB,CAAC,EAAE,2BAA2B,CAAC,sBAAsB,CAAC,CAAC;IAC3E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uBAAuB,CAAC,EAAE,MAAM,CAAC;CAClC;AAYD,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,KAAK,EAAE,OAAO,EACd,WAAW,EACX,oBAAoB,EACpB,SAAS,EACT,uBAAuB,GACxB,EAAE,iBAAiB,eAuBnB"}
+{"version":3,"file":"overflow-menu.d.ts","sourceRoot":"","sources":["../../../../src/app-layout/drawer/overflow-menu.tsx"],"names":[],"mappings":";AAIA,OAAO,EACL,mBAAmB,EACnB,2BAA2B,EAE5B,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAI/C,KAAK,MAAM,GAAG,cAAc,CAAC,MAAM,GAAG;IAAE,MAAM,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC;AAE3D,UAAU,iBAAiB;IACzB,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACrB,WAAW,EAAE,sBAAsB,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,CAAC;IAC1E,oBAAoB,CAAC,EAAE,2BAA2B,CAAC,sBAAsB,CAAC,CAAC;IAC3E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uBAAuB,CAAC,EAAE,MAAM,CAAC;CAClC;AAYD,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,KAAK,EAAE,OAAO,EACd,WAAW,EACX,oBAAoB,EACpB,SAAS,EACT,uBAAuB,GACxB,EAAE,iBAAiB,eA0BnB"}

package/lib/internal/template/app-layout/drawer/overflow-menu.js

@@ -3,19 +3,20 @@
 import React from 'react';
 import InternalButtonDropdown from '../../button-dropdown/internal';
 import testutilStyles from '../test-classes/styles.css.js';
-const mapDrawerToItem = (drawer) => ({
+const mapDrawerToItem = (drawer, isTypeCheckbox) => ({
     id: drawer.id,
     text: drawer.ariaLabels.drawerName,
     iconName: drawer.trigger.iconName,
     iconSvg: drawer.trigger.iconSvg,
     badge: drawer.badge,
-    itemType: 'checkbox',
+    itemType: isTypeCheckbox ? 'checkbox' : undefined,
     checked: drawer.active,
 });
 export default function OverflowMenu({ items: drawers, onItemClick, customTriggerBuilder, ariaLabel, globalDrawersStartIndex, }) {
-    const itemsFlatList = drawers.map(mapDrawerToItem);
+    const hasGlobalDrawers = globalDrawersStartIndex !== undefined;
+    const itemsFlatList = drawers.map((item, index) => mapDrawerToItem(item, hasGlobalDrawers && index >= globalDrawersStartIndex));
     let items;
-    if (globalDrawersStartIndex !== undefined && globalDrawersStartIndex > 0) {
+    if (hasGlobalDrawers) {
         items = [
             { items: itemsFlatList.slice(0, globalDrawersStartIndex) },
             { items: itemsFlatList.slice(globalDrawersStartIndex) },

package/lib/internal/template/app-layout/drawer/overflow-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"overflow-menu.js","sourceRoot":"","sources":["../../../../src/app-layout/drawer/overflow-menu.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,OAAO,sBAAsB,MAAM,gCAAgC,CAAC;AAIpE,OAAO,cAAc,MAAM,+BAA+B,CAAC;AAY3D,MAAM,eAAe,GAAG,CAAC,MAAc,EAAE,EAAE,CAAC,CAAC;IAC3C,EAAE,EAAE,MAAM,CAAC,EAAE;IACb,IAAI,EAAE,MAAM,CAAC,UAAU,CAAC,UAAU;IAClC,QAAQ,EAAE,MAAM,CAAC,OAAQ,CAAC,QAAQ;IAClC,OAAO,EAAE,MAAM,CAAC,OAAQ,CAAC,OAAO;IAChC,KAAK,EAAE,MAAM,CAAC,KAAK;IACnB,QAAQ,EAAE,UAA0C;IACpD,OAAO,EAAE,MAAM,CAAC,MAAM;CACvB,CAAC,CAAC;AAEH,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,KAAK,EAAE,OAAO,EACd,WAAW,EACX,oBAAoB,EACpB,SAAS,EACT,uBAAuB,GACL;IAClB,MAAM,aAAa,GAAG,OAAO,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACnD,IAAI,KAAyC,CAAC;IAC9C,IAAI,uBAAuB,KAAK,SAAS,IAAI,uBAAuB,GAAG,CAAC,EAAE;QACxE,KAAK,GAAG;YACN,EAAE,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC,EAAE,uBAAuB,CAAC,EAAE;YAC1D,EAAE,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC,uBAAuB,CAAC,EAAE;SACxD,CAAC;KACH;SAAM;QACL,KAAK,GAAG,aAAa,CAAC;KACvB;IAED,OAAO,CACL,oBAAC,sBAAsB,IACrB,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,cAAc,CAAC,eAAe,CAAC,EAC1C,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAC,MAAM,EACd,oBAAoB,EAAE,oBAAoB,EAC1C,gBAAgB,EAAE,IAAI,GACtB,CACH,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport {\n  ButtonDropdownProps,\n  InternalButtonDropdownProps,\n  InternalItemOrGroup,\n} from '../../button-dropdown/interfaces';\nimport InternalButtonDropdown from '../../button-dropdown/internal';\nimport { CancelableEventHandler } from '../../internal/events';\nimport { AppLayoutProps } from '../interfaces';\n\nimport testutilStyles from '../test-classes/styles.css.js';\n\ntype Drawer = AppLayoutProps.Drawer & { active?: boolean };\n\ninterface OverflowMenuProps {\n  items: Array<Drawer>;\n  onItemClick: CancelableEventHandler<ButtonDropdownProps.ItemClickDetails>;\n  customTriggerBuilder?: InternalButtonDropdownProps['customTriggerBuilder'];\n  ariaLabel?: string;\n  globalDrawersStartIndex?: number;\n}\n\nconst mapDrawerToItem = (drawer: Drawer) => ({\n  id: drawer.id,\n  text: drawer.ariaLabels.drawerName,\n  iconName: drawer.trigger!.iconName,\n  iconSvg: drawer.trigger!.iconSvg,\n  badge: drawer.badge,\n  itemType: 'checkbox' as ButtonDropdownProps.ItemType,\n  checked: drawer.active,\n});\n\nexport default function OverflowMenu({\n  items: drawers,\n  onItemClick,\n  customTriggerBuilder,\n  ariaLabel,\n  globalDrawersStartIndex,\n}: OverflowMenuProps) {\n  const itemsFlatList = drawers.map(mapDrawerToItem);\n  let items: ReadonlyArray<InternalItemOrGroup>;\n  if (globalDrawersStartIndex !== undefined && globalDrawersStartIndex > 0) {\n    items = [\n      { items: itemsFlatList.slice(0, globalDrawersStartIndex) },\n      { items: itemsFlatList.slice(globalDrawersStartIndex) },\n    ];\n  } else {\n    items = itemsFlatList;\n  }\n\n  return (\n    <InternalButtonDropdown\n      items={items}\n      className={testutilStyles['overflow-menu']}\n      onItemClick={onItemClick}\n      ariaLabel={ariaLabel}\n      variant=\"icon\"\n      customTriggerBuilder={customTriggerBuilder}\n      expandToViewport={true}\n    />\n  );\n}\n"]}
+{"version":3,"file":"overflow-menu.js","sourceRoot":"","sources":["../../../../src/app-layout/drawer/overflow-menu.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,OAAO,sBAAsB,MAAM,gCAAgC,CAAC;AAIpE,OAAO,cAAc,MAAM,+BAA+B,CAAC;AAY3D,MAAM,eAAe,GAAG,CAAC,MAAc,EAAE,cAAuB,EAAE,EAAE,CAAC,CAAC;IACpE,EAAE,EAAE,MAAM,CAAC,EAAE;IACb,IAAI,EAAE,MAAM,CAAC,UAAU,CAAC,UAAU;IAClC,QAAQ,EAAE,MAAM,CAAC,OAAQ,CAAC,QAAQ;IAClC,OAAO,EAAE,MAAM,CAAC,OAAQ,CAAC,OAAO;IAChC,KAAK,EAAE,MAAM,CAAC,KAAK;IACnB,QAAQ,EAAE,cAAc,CAAC,CAAC,CAAE,UAA2C,CAAC,CAAC,CAAC,SAAS;IACnF,OAAO,EAAE,MAAM,CAAC,MAAM;CACvB,CAAC,CAAC;AAEH,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,KAAK,EAAE,OAAO,EACd,WAAW,EACX,oBAAoB,EACpB,SAAS,EACT,uBAAuB,GACL;IAClB,MAAM,gBAAgB,GAAG,uBAAuB,KAAK,SAAS,CAAC;IAC/D,MAAM,aAAa,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAChD,eAAe,CAAC,IAAI,EAAE,gBAAgB,IAAI,KAAK,IAAI,uBAAuB,CAAC,CAC5E,CAAC;IACF,IAAI,KAAyC,CAAC;IAC9C,IAAI,gBAAgB,EAAE;QACpB,KAAK,GAAG;YACN,EAAE,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC,EAAE,uBAAuB,CAAC,EAAE;YAC1D,EAAE,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC,uBAAuB,CAAC,EAAE;SACxD,CAAC;KACH;SAAM;QACL,KAAK,GAAG,aAAa,CAAC;KACvB;IAED,OAAO,CACL,oBAAC,sBAAsB,IACrB,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,cAAc,CAAC,eAAe,CAAC,EAC1C,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAC,MAAM,EACd,oBAAoB,EAAE,oBAAoB,EAC1C,gBAAgB,EAAE,IAAI,GACtB,CACH,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport {\n  ButtonDropdownProps,\n  InternalButtonDropdownProps,\n  InternalItemOrGroup,\n} from '../../button-dropdown/interfaces';\nimport InternalButtonDropdown from '../../button-dropdown/internal';\nimport { CancelableEventHandler } from '../../internal/events';\nimport { AppLayoutProps } from '../interfaces';\n\nimport testutilStyles from '../test-classes/styles.css.js';\n\ntype Drawer = AppLayoutProps.Drawer & { active?: boolean };\n\ninterface OverflowMenuProps {\n  items: Array<Drawer>;\n  onItemClick: CancelableEventHandler<ButtonDropdownProps.ItemClickDetails>;\n  customTriggerBuilder?: InternalButtonDropdownProps['customTriggerBuilder'];\n  ariaLabel?: string;\n  globalDrawersStartIndex?: number;\n}\n\nconst mapDrawerToItem = (drawer: Drawer, isTypeCheckbox: boolean) => ({\n  id: drawer.id,\n  text: drawer.ariaLabels.drawerName,\n  iconName: drawer.trigger!.iconName,\n  iconSvg: drawer.trigger!.iconSvg,\n  badge: drawer.badge,\n  itemType: isTypeCheckbox ? ('checkbox' as ButtonDropdownProps.ItemType) : undefined,\n  checked: drawer.active,\n});\n\nexport default function OverflowMenu({\n  items: drawers,\n  onItemClick,\n  customTriggerBuilder,\n  ariaLabel,\n  globalDrawersStartIndex,\n}: OverflowMenuProps) {\n  const hasGlobalDrawers = globalDrawersStartIndex !== undefined;\n  const itemsFlatList = drawers.map((item, index) =>\n    mapDrawerToItem(item, hasGlobalDrawers && index >= globalDrawersStartIndex)\n  );\n  let items: ReadonlyArray<InternalItemOrGroup>;\n  if (hasGlobalDrawers) {\n    items = [\n      { items: itemsFlatList.slice(0, globalDrawersStartIndex) },\n      { items: itemsFlatList.slice(globalDrawersStartIndex) },\n    ];\n  } else {\n    items = itemsFlatList;\n  }\n\n  return (\n    <InternalButtonDropdown\n      items={items}\n      className={testutilStyles['overflow-menu']}\n      onItemClick={onItemClick}\n      ariaLabel={ariaLabel}\n      variant=\"icon\"\n      customTriggerBuilder={customTriggerBuilder}\n      expandToViewport={true}\n    />\n  );\n}\n"]}

package/lib/internal/template/internal/base-component/styles.scoped.css

@@ -248,6 +248,7 @@
   --color-background-slider-warning-pressed-bnqgti:#906806;
   --color-background-status-error-ljmwh5:#fdf3f1;
   --color-background-status-info-zgt1yi:#f1faff;
+  --color-background-dialog-738f4h:#f1faff;
   --color-background-status-success-igaq7v:#f2f8f0;
   --color-background-status-warning-bqz9of:#fffef0;
   --color-background-table-header-1ikpca:#fafafa;
@@ -313,6 +314,7 @@
   --color-border-status-info-7kw04i:#0073bb;
   --color-border-status-success-acmcj0:#1d8102;
   --color-border-status-warning-wkps52:#906806;
+  --color-border-dialog-a8e3bh:#0073bb;
   --color-border-divider-interactive-default-f75ypy:#687078;
   --color-border-tabs-divider-x9swcr:#aab7b8;
   --color-border-tabs-shadow-eb3y7s:#eaeded;
@@ -510,8 +512,11 @@
   --border-link-focus-ring-outline-bptw2p:5px auto Highlight;
   --border-link-focus-ring-shadow-spread-yrkso1:0px;
   --border-width-alert-i75nxu:1px;
+  --border-width-button-2u0zo4:1px;
+  --border-width-dropdown-jbel12:1px;
   --border-width-field-9kmoac:1px;
   --border-width-popover-ymjvav:1px;
+  --border-width-token-k07qn1:1px;
   --motion-duration-extra-slow-f38nn3:270ms;
   --motion-duration-fast-ayppw9:90ms;
   --motion-duration-moderate-pycjrk:135ms;
@@ -889,6 +894,7 @@
     --color-background-slider-warning-pressed-bnqgti:#fbd332;
     --color-background-status-error-ljmwh5:#270a11;
     --color-background-status-info-zgt1yi:#12293b;
+    --color-background-dialog-738f4h:#12293b;
     --color-background-status-success-igaq7v:#172211;
     --color-background-status-warning-bqz9of:#191100;
     --color-background-table-header-1ikpca:#21252c;
@@ -935,6 +941,7 @@
     --color-border-segment-hover-2w1whe:#ffffff;
     --color-border-status-info-7kw04i:#00a1c9;
     --color-border-status-warning-wkps52:#fbd332;
+    --color-border-dialog-a8e3bh:#00a1c9;
     --color-border-tabs-divider-x9swcr:#414750;
     --color-border-tabs-shadow-eb3y7s:rgba(0, 0, 0, 0.3);
     --color-border-tabs-underline-3q3di9:#fafafa;
@@ -1203,6 +1210,7 @@
   --color-background-slider-warning-pressed-bnqgti:#fbd332;
   --color-background-status-error-ljmwh5:#270a11;
   --color-background-status-info-zgt1yi:#12293b;
+  --color-background-dialog-738f4h:#12293b;
   --color-background-status-success-igaq7v:#172211;
   --color-background-status-warning-bqz9of:#191100;
   --color-background-table-header-1ikpca:#21252c;
@@ -1249,6 +1257,7 @@
   --color-border-segment-hover-2w1whe:#ffffff;
   --color-border-status-info-7kw04i:#00a1c9;
   --color-border-status-warning-wkps52:#fbd332;
+  --color-border-dialog-a8e3bh:#00a1c9;
   --color-border-tabs-divider-x9swcr:#414750;
   --color-border-tabs-shadow-eb3y7s:rgba(0, 0, 0, 0.3);
   --color-border-tabs-underline-3q3di9:#fafafa;
@@ -1553,6 +1562,7 @@
   --color-background-slider-warning-pressed-bnqgti:#855900;
   --color-background-status-error-ljmwh5:#fff5f5;
   --color-background-status-info-zgt1yi:#f0fbff;
+  --color-background-dialog-738f4h:#f0fbff;
   --color-background-status-success-igaq7v:#effff1;
   --color-background-table-header-1ikpca:#ffffff;
   --color-background-tiles-disabled-c21opp:#ebebf0;
@@ -1613,6 +1623,7 @@
   --color-border-status-info-7kw04i:#006ce0;
   --color-border-status-success-acmcj0:#00802f;
   --color-border-status-warning-wkps52:#855900;
+  --color-border-dialog-a8e3bh:#006ce0;
   --color-border-divider-interactive-default-f75ypy:#8c8c94;
   --color-border-tabs-divider-x9swcr:#c6c6cd;
   --color-border-tabs-shadow-eb3y7s:rgba(15, 20, 26, 0.12);
@@ -1776,8 +1787,11 @@
   --border-link-focus-ring-outline-bptw2p:0;
   --border-link-focus-ring-shadow-spread-yrkso1:2px;
   --border-width-alert-i75nxu:2px;
+  --border-width-button-2u0zo4:2px;
+  --border-width-dropdown-jbel12:2px;
   --border-width-field-9kmoac:2px;
   --border-width-popover-ymjvav:2px;
+  --border-width-token-k07qn1:2px;
   --motion-duration-refresh-only-fast-ww2eh4:115ms;
   --motion-duration-refresh-only-medium-kd6k1u:165ms;
   --motion-duration-refresh-only-slow-ov3t11:250ms;
@@ -1923,6 +1937,7 @@
     --color-background-slider-warning-pressed-bnqgti:#fbd332;
     --color-background-status-error-ljmwh5:#1f0000;
     --color-background-status-info-zgt1yi:#001129;
+    --color-background-dialog-738f4h:#001129;
     --color-background-status-success-igaq7v:#001401;
     --color-background-table-header-1ikpca:#161d26;
     --color-background-tiles-disabled-c21opp:#1b232d;
@@ -1971,6 +1986,7 @@
     --color-border-status-info-7kw04i:#42b4ff;
     --color-border-status-success-acmcj0:#2bb534;
     --color-border-status-warning-wkps52:#fbd332;
+    --color-border-dialog-a8e3bh:#42b4ff;
     --color-border-divider-interactive-default-f75ypy:#dedee3;
     --color-border-tabs-divider-x9swcr:#424650;
     --color-border-tabs-shadow-eb3y7s:rgba(15, 20, 26, 1);
@@ -2201,6 +2217,7 @@
   --color-background-slider-error-pressed-9g3bmc:#ff7a7a;
   --color-background-status-error-ljmwh5:#1f0000;
   --color-background-status-info-zgt1yi:#001129;
+  --color-background-dialog-738f4h:#001129;
   --color-background-status-success-igaq7v:#001401;
   --color-background-table-header-1ikpca:#161d26;
   --color-background-tiles-disabled-c21opp:#1b232d;
@@ -2253,6 +2270,7 @@
   --color-border-status-error-5n723o:#ff7a7a;
   --color-border-status-info-7kw04i:#42b4ff;
   --color-border-status-success-acmcj0:#2bb534;
+  --color-border-dialog-a8e3bh:#42b4ff;
   --color-border-divider-interactive-default-f75ypy:#dedee3;
   --color-border-tabs-divider-x9swcr:#424650;
   --color-border-tabs-shadow-eb3y7s:rgba(15, 20, 26, 1);
@@ -2409,6 +2427,7 @@
   --color-background-slider-warning-pressed-bnqgti:#fbd332;
   --color-background-status-error-ljmwh5:#1f0000;
   --color-background-status-info-zgt1yi:#001129;
+  --color-background-dialog-738f4h:#001129;
   --color-background-status-success-igaq7v:#001401;
   --color-background-table-header-1ikpca:#161d26;
   --color-background-tiles-disabled-c21opp:#1b232d;
@@ -2457,6 +2476,7 @@
   --color-border-status-info-7kw04i:#42b4ff;
   --color-border-status-success-acmcj0:#2bb534;
   --color-border-status-warning-wkps52:#fbd332;
+  --color-border-dialog-a8e3bh:#42b4ff;
   --color-border-divider-interactive-default-f75ypy:#dedee3;
   --color-border-tabs-divider-x9swcr:#424650;
   --color-border-tabs-shadow-eb3y7s:rgba(15, 20, 26, 1);
@@ -2614,6 +2634,7 @@
   --color-background-slider-warning-pressed-bnqgti:#fbd332;
   --color-background-status-error-ljmwh5:#1f0000;
   --color-background-status-info-zgt1yi:#001129;
+  --color-background-dialog-738f4h:#001129;
   --color-background-status-success-igaq7v:#001401;
   --color-background-status-warning-bqz9of:#191100;
   --color-background-table-header-1ikpca:#0f141a;
@@ -2663,6 +2684,7 @@
   --color-border-status-info-7kw04i:#42b4ff;
   --color-border-status-success-acmcj0:#2bb534;
   --color-border-status-warning-wkps52:#fbd332;
+  --color-border-dialog-a8e3bh:#42b4ff;
   --color-border-divider-interactive-default-f75ypy:#dedee3;
   --color-border-tabs-divider-x9swcr:#424650;
   --color-border-tabs-shadow-eb3y7s:rgba(15, 20, 26, 1);
@@ -2833,6 +2855,7 @@
   --color-background-slider-warning-pressed-bnqgti:#fbd332;
   --color-background-status-error-ljmwh5:#1f0000;
   --color-background-status-info-zgt1yi:#001129;
+  --color-background-dialog-738f4h:#001129;
   --color-background-status-success-igaq7v:#001401;
   --color-background-status-warning-bqz9of:#191100;
   --color-background-table-header-1ikpca:#0f141a;
@@ -2882,6 +2905,7 @@
   --color-border-status-info-7kw04i:#42b4ff;
   --color-border-status-success-acmcj0:#2bb534;
   --color-border-status-warning-wkps52:#fbd332;
+  --color-border-dialog-a8e3bh:#42b4ff;
   --color-border-divider-interactive-default-f75ypy:#dedee3;
   --color-border-tabs-divider-x9swcr:#424650;
   --color-border-tabs-shadow-eb3y7s:rgba(15, 20, 26, 1);
@@ -3256,6 +3280,7 @@
   --color-background-slider-warning-pressed-bnqgti:#fbd332;
   --color-background-status-error-ljmwh5:#1f0000;
   --color-background-status-info-zgt1yi:#001129;
+  --color-background-dialog-738f4h:#001129;
   --color-background-status-success-igaq7v:#001401;
   --color-background-status-warning-bqz9of:#191100;
   --color-background-table-header-1ikpca:#161d26;
@@ -3305,6 +3330,7 @@
   --color-border-status-info-7kw04i:#42b4ff;
   --color-border-status-success-acmcj0:#2bb534;
   --color-border-status-warning-wkps52:#fbd332;
+  --color-border-dialog-a8e3bh:#42b4ff;
   --color-border-divider-interactive-default-f75ypy:#dedee3;
   --color-border-tabs-divider-x9swcr:#424650;
   --color-border-tabs-shadow-eb3y7s:rgba(15, 20, 26, 1);
@@ -3463,6 +3489,7 @@
   --color-background-slider-warning-pressed-bnqgti:#fbd332;
   --color-background-status-error-ljmwh5:#1f0000;
   --color-background-status-info-zgt1yi:#001129;
+  --color-background-dialog-738f4h:#001129;
   --color-background-status-success-igaq7v:#001401;
   --color-background-status-warning-bqz9of:#191100;
   --color-background-table-header-1ikpca:#161d26;
@@ -3512,6 +3539,7 @@
   --color-border-status-info-7kw04i:#42b4ff;
   --color-border-status-success-acmcj0:#2bb534;
   --color-border-status-warning-wkps52:#fbd332;
+  --color-border-dialog-a8e3bh:#42b4ff;
   --color-border-divider-interactive-default-f75ypy:#dedee3;
   --color-border-tabs-divider-x9swcr:#424650;
   --color-border-tabs-shadow-eb3y7s:rgba(15, 20, 26, 1);

package/lib/internal/template/internal/environment.js

@@ -1,4 +1,4 @@
 export var PACKAGE_SOURCE = "components";
-export var PACKAGE_VERSION = "3.0.0 (80e41ae2)";
+export var PACKAGE_VERSION = "3.0.0 (0e8e875d)";
 export var THEME = "open-source-visual-refresh";
 export var ALWAYS_VISUAL_REFRESH = true;

package/lib/internal/template/internal/environment.json

@@ -1,6 +1,6 @@
 {
   "PACKAGE_SOURCE": "components",
-  "PACKAGE_VERSION": "3.0.0 (80e41ae2)",
+  "PACKAGE_VERSION": "3.0.0 (0e8e875d)",
   "THEME": "default",
   "ALWAYS_VISUAL_REFRESH": false
 }

package/lib/internal/template/internal/generated/styles/tokens.d.ts

@@ -307,6 +307,7 @@ export const colorBackgroundSliderErrorPressed: string;
 export const colorBackgroundSliderWarningPressed: string;
 export const colorBackgroundStatusError: string;
 export const colorBackgroundStatusInfo: string;
+export const colorBackgroundDialog: string;
 export const colorBackgroundStatusSuccess: string;
 export const colorBackgroundStatusWarning: string;
 export const colorBackgroundTableHeader: string;
@@ -372,6 +373,7 @@ export const colorBorderStatusError: string;
 export const colorBorderStatusInfo: string;
 export const colorBorderStatusSuccess: string;
 export const colorBorderStatusWarning: string;
+export const colorBorderDialog: string;
 export const colorBorderDividerInteractiveDefault: string;
 export const colorBorderTabsDivider: string;
 export const colorBorderTabsShadow: string;
@@ -576,8 +578,11 @@ export const borderTableStickyWidth: string;
 export const borderLinkFocusRingOutline: string;
 export const borderLinkFocusRingShadowSpread: string;
 export const borderWidthAlert: string;
+export const borderWidthButton: string;
+export const borderWidthDropdown: string;
 export const borderWidthField: string;
 export const borderWidthPopover: string;
+export const borderWidthToken: string;
 export const motionDurationExtraFast: string;
 export const motionDurationExtraSlow: string;
 export const motionDurationFast: string;

package/lib/internal/template/internal/generated/styles/tokens.js

@@ -307,6 +307,7 @@ export var colorBackgroundSliderErrorPressed = "var(--color-background-slider-er
 export var colorBackgroundSliderWarningPressed = "var(--color-background-slider-warning-pressed-pg5aih, #855900)";
 export var colorBackgroundStatusError = "var(--color-background-status-error-5fz45j, #fff5f5)";
 export var colorBackgroundStatusInfo = "var(--color-background-status-info-gflgo4, #f0fbff)";
+export var colorBackgroundDialog = "var(--color-background-dialog-wtz1wl, #f0fbff)";
 export var colorBackgroundStatusSuccess = "var(--color-background-status-success-ua29ej, #effff1)";
 export var colorBackgroundStatusWarning = "var(--color-background-status-warning-03nxlw, #fffef0)";
 export var colorBackgroundTableHeader = "var(--color-background-table-header-inc72b, #ffffff)";
@@ -372,6 +373,7 @@ export var colorBorderStatusError = "var(--color-border-status-error-adxa56, #db
 export var colorBorderStatusInfo = "var(--color-border-status-info-z6pwqy, #006ce0)";
 export var colorBorderStatusSuccess = "var(--color-border-status-success-4x6srk, #00802f)";
 export var colorBorderStatusWarning = "var(--color-border-status-warning-3feumr, #855900)";
+export var colorBorderDialog = "var(--color-border-dialog-u915ow, #006ce0)";
 export var colorBorderDividerInteractiveDefault = "var(--color-border-divider-interactive-default-0c10au, #8c8c94)";
 export var colorBorderTabsDivider = "var(--color-border-tabs-divider-djfdfj, #c6c6cd)";
 export var colorBorderTabsShadow = "var(--color-border-tabs-shadow-enjrr2, rgba(15, 20, 26, 0.12))";
@@ -576,8 +578,11 @@ export var borderTableStickyWidth = "var(--border-table-sticky-width-87kf12, 1px
 export var borderLinkFocusRingOutline = "var(--border-link-focus-ring-outline-kkfop6, 0)";
 export var borderLinkFocusRingShadowSpread = "var(--border-link-focus-ring-shadow-spread-v8hkrl, 2px)";
 export var borderWidthAlert = "var(--border-width-alert-t0f3yn, 2px)";
+export var borderWidthButton = "var(--border-width-button-ru6lbi, 2px)";
+export var borderWidthDropdown = "var(--border-width-dropdown-hh98qt, 2px)";
 export var borderWidthField = "var(--border-width-field-h1g7tw, 2px)";
 export var borderWidthPopover = "var(--border-width-popover-h2a419, 2px)";
+export var borderWidthToken = "var(--border-width-token-zo28pf, 2px)";
 export var motionDurationExtraFast = "var(--motion-duration-extra-fast-3huyux, 45ms)";
 export var motionDurationExtraSlow = "var(--motion-duration-extra-slow-ngjb9g, 270ms)";
 export var motionDurationFast = "var(--motion-duration-fast-sbm3r7, 90ms)";

package/lib/internal/template/internal/generated/theming/index.cjs

@@ -1113,6 +1113,10 @@ module.exports.preset = {
         "light": "{colorBlue100}",
         "dark": "{colorBlue900}"
       },
+      "colorBackgroundDialog": {
+        "light": "{colorBackgroundStatusInfo}",
+        "dark": "{colorBackgroundStatusInfo}"
+      },
       "colorBackgroundStatusSuccess": {
         "light": "{colorGreen100}",
         "dark": "{colorGreen900}"
@@ -1373,6 +1377,10 @@ module.exports.preset = {
         "light": "{colorYellow800}",
         "dark": "{colorYellow700}"
       },
+      "colorBorderDialog": {
+        "light": "{colorBorderStatusInfo}",
+        "dark": "{colorBorderStatusInfo}"
+      },
       "colorBorderDividerInteractiveDefault": {
         "light": "{colorGrey500}",
         "dark": "{colorGrey300}"
@@ -1928,8 +1936,11 @@ module.exports.preset = {
       "borderLinkFocusRingOutline": "0",
       "borderLinkFocusRingShadowSpread": "2px",
       "borderWidthAlert": "2px",
+      "borderWidthButton": "2px",
+      "borderWidthDropdown": "2px",
       "borderWidthField": "2px",
       "borderWidthPopover": "2px",
+      "borderWidthToken": "2px",
       "motionDurationExtraFast": {
         "default": "45ms",
         "disabled": "0ms"
@@ -3358,6 +3369,10 @@ module.exports.preset = {
             "light": "{colorBlue900}",
             "dark": "{colorBlue900}"
           },
+          "colorBackgroundDialog": {
+            "light": "{colorBackgroundStatusInfo}",
+            "dark": "{colorBackgroundStatusInfo}"
+          },
           "colorBackgroundStatusSuccess": {
             "light": "{colorGreen900}",
             "dark": "{colorGreen900}"
@@ -3618,6 +3633,10 @@ module.exports.preset = {
             "light": "{colorYellow700}",
             "dark": "{colorYellow700}"
           },
+          "colorBorderDialog": {
+            "light": "{colorBorderStatusInfo}",
+            "dark": "{colorBorderStatusInfo}"
+          },
           "colorBorderDividerInteractiveDefault": {
             "light": "{colorGrey300}",
             "dark": "{colorGrey300}"
@@ -4504,6 +4523,10 @@ module.exports.preset = {
             "light": "{colorBlue900}",
             "dark": "{colorBlue900}"
           },
+          "colorBackgroundDialog": {
+            "light": "{colorBackgroundStatusInfo}",
+            "dark": "{colorBackgroundStatusInfo}"
+          },
           "colorBackgroundStatusSuccess": {
             "light": "{colorGreen900}",
             "dark": "{colorGreen900}"
@@ -4764,6 +4787,10 @@ module.exports.preset = {
             "light": "{colorYellow700}",
             "dark": "{colorYellow700}"
           },
+          "colorBorderDialog": {
+            "light": "{colorBorderStatusInfo}",
+            "dark": "{colorBorderStatusInfo}"
+          },
           "colorBorderDividerInteractiveDefault": {
             "light": "{colorGrey300}",
             "dark": "{colorGrey300}"
@@ -5582,6 +5609,10 @@ module.exports.preset = {
             "light": "{colorBlue100}",
             "dark": "{colorBlue900}"
           },
+          "colorBackgroundDialog": {
+            "light": "{colorBackgroundStatusInfo}",
+            "dark": "{colorBackgroundStatusInfo}"
+          },
           "colorBackgroundStatusSuccess": {
             "light": "{colorGreen100}",
             "dark": "{colorGreen900}"
@@ -5842,6 +5873,10 @@ module.exports.preset = {
             "light": "{colorYellow800}",
             "dark": "{colorYellow700}"
           },
+          "colorBorderDialog": {
+            "light": "{colorBorderStatusInfo}",
+            "dark": "{colorBorderStatusInfo}"
+          },
           "colorBorderDividerInteractiveDefault": {
             "light": "{colorGrey500}",
             "dark": "{colorGrey300}"
@@ -6660,6 +6695,10 @@ module.exports.preset = {
             "light": "{colorBlue100}",
             "dark": "{colorBlue900}"
           },
+          "colorBackgroundDialog": {
+            "light": "{colorBackgroundStatusInfo}",
+            "dark": "{colorBackgroundStatusInfo}"
+          },
           "colorBackgroundStatusSuccess": {
             "light": "{colorGreen100}",
             "dark": "{colorGreen900}"
@@ -6920,6 +6959,10 @@ module.exports.preset = {
             "light": "{colorYellow800}",
             "dark": "{colorYellow700}"
           },
+          "colorBorderDialog": {
+            "light": "{colorBorderStatusInfo}",
+            "dark": "{colorBorderStatusInfo}"
+          },
           "colorBorderDividerInteractiveDefault": {
             "light": "{colorGrey500}",
             "dark": "{colorGrey300}"
@@ -7738,6 +7781,10 @@ module.exports.preset = {
             "light": "{colorBlue100}",
             "dark": "{colorBlue900}"
           },
+          "colorBackgroundDialog": {
+            "light": "{colorBackgroundStatusInfo}",
+            "dark": "{colorBackgroundStatusInfo}"
+          },
           "colorBackgroundStatusSuccess": {
             "light": "{colorGreen100}",
             "dark": "{colorGreen900}"
@@ -7998,6 +8045,10 @@ module.exports.preset = {
             "light": "{colorYellow800}",
             "dark": "{colorYellow700}"
           },
+          "colorBorderDialog": {
+            "light": "{colorBorderStatusInfo}",
+            "dark": "{colorBorderStatusInfo}"
+          },
           "colorBorderDividerInteractiveDefault": {
             "light": "{colorGrey500}",
             "dark": "{colorGrey300}"
@@ -8818,6 +8869,10 @@ module.exports.preset = {
             "light": "{colorBlue900}",
             "dark": "{colorBlue900}"
           },
+          "colorBackgroundDialog": {
+            "light": "{colorBackgroundStatusInfo}",
+            "dark": "{colorBackgroundStatusInfo}"
+          },
           "colorBackgroundStatusSuccess": {
             "light": "{colorGreen900}",
             "dark": "{colorGreen900}"
@@ -9078,6 +9133,10 @@ module.exports.preset = {
             "light": "{colorYellow700}",
             "dark": "{colorYellow700}"
           },
+          "colorBorderDialog": {
+            "light": "{colorBorderStatusInfo}",
+            "dark": "{colorBorderStatusInfo}"
+          },
           "colorBorderDividerInteractiveDefault": {
             "light": "{colorGrey300}",
             "dark": "{colorGrey300}"
@@ -9805,6 +9864,7 @@ module.exports.preset = {
       "colorBackgroundSliderWarningPressed": "color",
       "colorBackgroundStatusError": "color",
       "colorBackgroundStatusInfo": "color",
+      "colorBackgroundDialog": "color",
       "colorBackgroundStatusSuccess": "color",
       "colorBackgroundStatusWarning": "color",
       "colorBackgroundTableHeader": "color",
@@ -9870,6 +9930,7 @@ module.exports.preset = {
       "colorBorderStatusInfo": "color",
       "colorBorderStatusSuccess": "color",
       "colorBorderStatusWarning": "color",
+      "colorBorderDialog": "color",
       "colorBorderDividerInteractiveDefault": "color",
       "colorBorderTabsDivider": "color",
       "colorBorderTabsShadow": "color",
@@ -10270,6 +10331,7 @@ module.exports.preset = {
     "colorBackgroundSegmentHover",
     "colorBackgroundStatusError",
     "colorBackgroundStatusInfo",
+    "colorBackgroundDialog",
     "colorBackgroundStatusSuccess",
     "colorBackgroundStatusWarning",
     "colorBackgroundToggleCheckedDisabled",
@@ -10303,6 +10365,7 @@ module.exports.preset = {
     "colorBorderStatusInfo",
     "colorBorderStatusSuccess",
     "colorBorderStatusWarning",
+    "colorBorderDialog",
     "colorForegroundControlDefault",
     "colorForegroundControlDisabled",
     "colorForegroundControlReadOnly",
@@ -10401,8 +10464,11 @@ module.exports.preset = {
     "borderRadiusToken",
     "borderRadiusTutorialPanelItem",
     "borderWidthAlert",
+    "borderWidthButton",
+    "borderWidthDropdown",
     "borderWidthField",
-    "borderWidthPopover"
+    "borderWidthPopover",
+    "borderWidthToken"
   ],
   "exposed": [
     "colorChartsRed300",
@@ -10610,6 +10676,7 @@ module.exports.preset = {
     "colorBackgroundSegmentHover",
     "colorBackgroundStatusError",
     "colorBackgroundStatusInfo",
+    "colorBackgroundDialog",
     "colorBackgroundStatusSuccess",
     "colorBackgroundStatusWarning",
     "colorBackgroundToggleCheckedDisabled",
@@ -10647,6 +10714,7 @@ module.exports.preset = {
     "colorBorderStatusInfo",
     "colorBorderStatusSuccess",
     "colorBorderStatusWarning",
+    "colorBorderDialog",
     "colorForegroundControlDefault",
     "colorForegroundControlDisabled",
     "colorForegroundControlReadOnly",
@@ -10748,8 +10816,11 @@ module.exports.preset = {
     "borderRadiusChatBubble",
     "borderRadiusTutorialPanelItem",
     "borderWidthAlert",
+    "borderWidthButton",
+    "borderWidthDropdown",
     "borderWidthField",
     "borderWidthPopover",
+    "borderWidthToken",
     "motionDurationAvatarGenAiGradient",
     "motionDurationAvatarLoadingDots",
     "motionEasingAvatarGenAiGradient",
@@ -11095,6 +11166,7 @@ module.exports.preset = {
     "colorBackgroundSliderWarningPressed": "color-background-slider-warning-pressed",
     "colorBackgroundStatusError": "color-background-status-error",
     "colorBackgroundStatusInfo": "color-background-status-info",
+    "colorBackgroundDialog": "color-background-dialog",
     "colorBackgroundStatusSuccess": "color-background-status-success",
     "colorBackgroundStatusWarning": "color-background-status-warning",
     "colorBackgroundTableHeader": "color-background-table-header",
@@ -11160,6 +11232,7 @@ module.exports.preset = {
     "colorBorderStatusInfo": "color-border-status-info",
     "colorBorderStatusSuccess": "color-border-status-success",
     "colorBorderStatusWarning": "color-border-status-warning",
+    "colorBorderDialog": "color-border-dialog",
     "colorBorderDividerInteractiveDefault": "color-border-divider-interactive-default",
     "colorBorderTabsDivider": "color-border-tabs-divider",
     "colorBorderTabsShadow": "color-border-tabs-shadow",
@@ -11364,8 +11437,11 @@ module.exports.preset = {
     "borderLinkFocusRingOutline": "border-link-focus-ring-outline",
     "borderLinkFocusRingShadowSpread": "border-link-focus-ring-shadow-spread",
     "borderWidthAlert": "border-width-alert",
+    "borderWidthButton": "border-width-button",
+    "borderWidthDropdown": "border-width-dropdown",
     "borderWidthField": "border-width-field",
     "borderWidthPopover": "border-width-popover",
+    "borderWidthToken": "border-width-token",
     "motionDurationExtraFast": "motion-duration-extra-fast",
     "motionDurationExtraSlow": "motion-duration-extra-slow",
     "motionDurationFast": "motion-duration-fast",
@@ -11844,6 +11920,7 @@ module.exports.preset = {
     "colorBackgroundSliderWarningPressed": "--color-background-slider-warning-pressed-pg5aih",
     "colorBackgroundStatusError": "--color-background-status-error-5fz45j",
     "colorBackgroundStatusInfo": "--color-background-status-info-gflgo4",
+    "colorBackgroundDialog": "--color-background-dialog-wtz1wl",
     "colorBackgroundStatusSuccess": "--color-background-status-success-ua29ej",
     "colorBackgroundStatusWarning": "--color-background-status-warning-03nxlw",
     "colorBackgroundTableHeader": "--color-background-table-header-inc72b",
@@ -11909,6 +11986,7 @@ module.exports.preset = {
     "colorBorderStatusInfo": "--color-border-status-info-z6pwqy",
     "colorBorderStatusSuccess": "--color-border-status-success-4x6srk",
     "colorBorderStatusWarning": "--color-border-status-warning-3feumr",
+    "colorBorderDialog": "--color-border-dialog-u915ow",
     "colorBorderDividerInteractiveDefault": "--color-border-divider-interactive-default-0c10au",
     "colorBorderTabsDivider": "--color-border-tabs-divider-djfdfj",
     "colorBorderTabsShadow": "--color-border-tabs-shadow-enjrr2",
@@ -12113,8 +12191,11 @@ module.exports.preset = {
     "borderLinkFocusRingOutline": "--border-link-focus-ring-outline-kkfop6",
     "borderLinkFocusRingShadowSpread": "--border-link-focus-ring-shadow-spread-v8hkrl",
     "borderWidthAlert": "--border-width-alert-t0f3yn",
+    "borderWidthButton": "--border-width-button-ru6lbi",
+    "borderWidthDropdown": "--border-width-dropdown-hh98qt",
     "borderWidthField": "--border-width-field-h1g7tw",
     "borderWidthPopover": "--border-width-popover-h2a419",
+    "borderWidthToken": "--border-width-token-zo28pf",
     "motionDurationExtraFast": "--motion-duration-extra-fast-3huyux",
     "motionDurationExtraSlow": "--motion-duration-extra-slow-ngjb9g",
     "motionDurationFast": "--motion-duration-fast-sbm3r7",