@ni/nimble-components 32.8.1 → 32.9.0

package/dist/all-components-bundle.js

@@ -18127,6 +18127,10 @@
       name: 'arrows_repeat_16_x_16',
       data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M8.75 11.75 10 14l-6-3 6-3-1.25 2.25ZM8 11h1a4 4 0 0 0 4-4M7.25 5.75 6 8l6-3-6-3 1.25 2.25ZM8 5H7a4 4 0 0 0-4 4" class="cls-1"/></svg>`,
   };
+  const asterisk5X5 = {
+      name: 'asterisk_5_x_5',
+      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 5 5"><path d="m.721 4.076.813-1.372-1.429-.63.266-.84 1.527.349L2.05 0h.883l.154 1.583 1.541-.35.266.84-1.442.631.812 1.372-.715.519L2.5 3.376 1.435 4.595z" class="cls-1"/></svg>`,
+  };
   const at16X16 = {
       name: 'at_16_x_16',
       data: `<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 16 16"><path d="M12.139 3.621a5.5 5.5 0 0 1 1.206 1.845q.435 1.074.436 2.407 0 .961-.275 1.954t-.687 1.646H9.343l-.11-.536a4.6 4.6 0 0 1-.756.415q-.364.155-1.051.155-1.12 0-1.813-.924t-.694-2.49q0-.837.234-1.467.234-.628.639-1.095.377-.44.914-.687a2.5 2.5 0 0 1 1.064-.248q.453 0 .804.169.35.168.543.353v-.425h1.594v5.605h1.168q.248-.543.368-1.178.12-.636.12-1.22 0-1.161-.323-2.036-.322-.877-.892-1.453a3.7 3.7 0 0 0-1.366-.879 4.9 4.9 0 0 0-1.697-.289q-.871 0-1.657.343a4.6 4.6 0 0 0-1.383.928q-.61.598-.992 1.497c-.382.899-.381 1.257-.381 1.972q0 1.167.36 2.068.36.9.958 1.497.596.59 1.386.9a4.5 4.5 0 0 0 1.668.309q.583 0 1.328-.106a9 9 0 0 0 1.321-.279v1.333q-.64.144-1.271.22-.633.074-1.381.075a6.1 6.1 0 0 1-2.325-.433 5.4 5.4 0 0 1-1.852-1.23 5.6 5.6 0 0 1-1.212-1.91 6.7 6.7 0 0 1-.436-2.444q0-1.278.453-2.366a5.9 5.9 0 0 1 1.25-1.9A5.7 5.7 0 0 1 5.781 2.46 5.8 5.8 0 0 1 8.079 2q1.209 0 2.257.426a5.3 5.3 0 0 1 1.803 1.195M9.082 9.652V6.19a3 3 0 0 0-.522-.21 2 2 0 0 0-.543-.065q-.66 0-1.017.577c-.357.577-.357.912-.357 1.58q0 1.085.295 1.607.296.522.975.522.357 0 .625-.141.269-.14.544-.408"/></svg>`,
@@ -20371,12 +20375,11 @@ so this becomes the fallback color for the slot */ ''}
 `;
 
   const styles$L = css `
-    ${display('inline-flex')}
+    ${display('inline-grid')}
     ${styles$M}
 
     :host {
         font: ${bodyFont};
-        align-items: center;
         cursor: pointer;
         outline: none;
         ${userSelectNone}
@@ -20387,8 +20390,14 @@ so this becomes the fallback color for the slot */ ''}
         cursor: default;
     }
 
-    .container {
+    .outer-container {
+        height: 100%;
+        display: flex;
+        align-items: center;
         position: relative;
+    }
+
+    .container {
         display: grid;
         grid-template-columns: auto 1fr auto;
         grid-template-rows: ${bodyFontLineHeight} auto;
@@ -20513,27 +20522,29 @@ so this becomes the fallback color for the slot */ ''}
         @click="${(x, c) => x.clickHandler(c.event)}"
         class="${x => (x.readOnly ? 'readonly' : '')} ${x => (x.checked ? 'checked' : '')} ${x => (x.indeterminate ? 'indeterminate' : '')}"
     >
-        <div part="container" class="container">
-            <div part="control" class="control">
-                <slot name="checked-indicator">
-                    ${definition.checkedIndicator || ''}
-                </slot>
-                <slot name="indeterminate-indicator">
-                    ${definition.indeterminateIndicator || ''}
-                </slot>
-            </div>
-            <label
-                part="label"
-                class="${x => (x.defaultSlottedNodes?.length
+        <div class="outer-container">
+            <div part="container" class="container">
+                <div part="control" class="control">
+                    <slot name="checked-indicator">
+                        ${definition.checkedIndicator || ''}
+                    </slot>
+                    <slot name="indeterminate-indicator">
+                        ${definition.indeterminateIndicator || ''}
+                    </slot>
+                </div>
+                <label
+                    part="label"
+                    class="${x => (x.defaultSlottedNodes?.length
     ? 'label'
     : 'label label__hidden')}"
-            >
-                <slot ${slotted('defaultSlottedNodes')}></slot>
-            </label>
-            <${iconExclamationMarkTag}
-                severity="error"
-                class="error-icon"
-            ></${iconExclamationMarkTag}>
+                >
+                    <slot ${slotted('defaultSlottedNodes')}></slot>
+                </label>
+                <${iconExclamationMarkTag}
+                    severity="error"
+                    class="error-icon"
+                ></${iconExclamationMarkTag}>
+            </div>
             ${errorTextTemplate}
         </div>
     </template>
@@ -22789,6 +22800,18 @@ so this becomes the fallback color for the slot */ ''}
   }
   registerIcon('icon-arrows-repeat', IconArrowsRepeat);
 
+  // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
+  // See generation source in nimble-components/build/generate-icons
+  /**
+   * The icon component for the 'asterisk' icon
+   */
+  class IconAsterisk extends Icon {
+      constructor() {
+          super(asterisk5X5);
+      }
+  }
+  registerIcon('icon-asterisk', IconAsterisk);
+
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**