@ni/nimble-components 20.13.0 → 20.14.1

package/dist/all-components-bundle.js

@@ -16298,7 +16298,7 @@
 
   /**
    * Do not edit directly
-   * Generated on Thu, 02 Nov 2023 18:04:35 GMT
+   * Generated on Wed, 08 Nov 2023 15:51:23 GMT
    */
 
   const Information100DarkUi = "#a46eff";
@@ -16468,6 +16468,12 @@
       iconSize: 'icon-size',
       groupHeaderTextTransform: 'group-header-text-transform',
       drawerWidth: 'drawer-width',
+      dialogSmallWidth: 'dialog-small-width',
+      dialogSmallHeight: 'dialog-small-height',
+      dialogSmallMaxHeight: 'dialog-small-max-height',
+      dialogLargeWidth: 'dialog-large-width',
+      dialogLargeHeight: 'dialog-large-height',
+      dialogLargeMaxHeight: 'dialog-large-max-height',
       bannerGapSize: 'banner-gap-size',
       spinnerSmallHeight: 'spinner-small-height',
       spinnerMediumHeight: 'spinner-medium-height',
@@ -16873,6 +16879,12 @@
   const borderWidth = DesignToken.create(styleNameFromTokenName(tokenNames.borderWidth)).withDefault('1px');
   const iconSize = DesignToken.create(styleNameFromTokenName(tokenNames.iconSize)).withDefault('16px');
   const drawerWidth = DesignToken.create(styleNameFromTokenName(tokenNames.drawerWidth)).withDefault('784px');
+  const dialogSmallWidth = DesignToken.create(styleNameFromTokenName(tokenNames.dialogSmallWidth)).withDefault('400px');
+  const dialogSmallHeight = DesignToken.create(styleNameFromTokenName(tokenNames.dialogSmallHeight)).withDefault('fit-content');
+  const dialogSmallMaxHeight = DesignToken.create(styleNameFromTokenName(tokenNames.dialogSmallMaxHeight)).withDefault('600px');
+  DesignToken.create(styleNameFromTokenName(tokenNames.dialogLargeWidth)).withDefault('1024px');
+  DesignToken.create(styleNameFromTokenName(tokenNames.dialogLargeHeight)).withDefault('680px');
+  DesignToken.create(styleNameFromTokenName(tokenNames.dialogLargeMaxHeight)).withDefault('680px');
   DesignToken.create(styleNameFromTokenName(tokenNames.bannerGapSize)).withDefault('1px');
   const spinnerSmallHeight = DesignToken.create(styleNameFromTokenName(tokenNames.spinnerSmallHeight)).withDefault('16px');
   DesignToken.create(styleNameFromTokenName(tokenNames.spinnerMediumHeight)).withDefault('32px');
@@ -19948,14 +19960,15 @@
         display: contents;
     }
 
-    ::slotted([slot='title']) {
+    slot[name='title'] {
         font: ${titleFont};
         color: ${titleFontColor};
     }
 `;
 
   const template$s = html `
-    <section aria-labelledby="title-slot">
+    ${'' /* Explicitly set role to work around Lighthouse error. See https://github.com/ni/nimble/issues/1650. */}
+    <section role="region" aria-labelledby="title-slot">
         <slot name="title" id="title-slot"></slot>
         <slot></slot>
     </section>
@@ -21129,8 +21142,9 @@
         border: none;
         box-shadow: ${elevation3BoxShadow};
         padding: 0px;
-        width: 400px;
-        max-height: 600px;
+        width: ${dialogSmallWidth};
+        height: ${dialogSmallHeight};
+        max-height: ${dialogSmallMaxHeight};
     }
 
     dialog[open] {
@@ -21226,6 +21240,7 @@
         <dialog
             ${ref('dialogElement')}
             role="dialog"
+            part="control"
             @cancel="${(x, c) => x.cancelHandler(c.event)}"
             aria-labelledby="header"
         >