@ni/spright-components 4.1.20 → 4.2.0

package/dist/all-components-bundle.js

@@ -8602,18 +8602,20 @@
        * @internal
        */
       clickHandler(e) {
-          if (this.disabled) {
+          const captured = e.target.closest(`option,[role=option]`);
+          if (this.disabled || (captured === null || captured === void 0 ? void 0 : captured.disabled)) {
               return;
           }
           if (this.open) {
-              const captured = e.target.closest(`option,[role=option]`);
-              if (!captured || captured.disabled) {
+              if (e.composedPath()[0] === this.control) {
                   return;
               }
-              this.selectedOptions = [captured];
-              this.control.value = captured.text;
-              this.clearSelectionRange();
-              this.updateValue(true);
+              if (captured) {
+                  this.selectedOptions = [captured];
+                  this.control.value = captured.text;
+                  this.clearSelectionRange();
+                  this.updateValue(true);
+              }
           }
           this.open = !this.open;
           if (this.open) {
@@ -9442,7 +9444,12 @@
        * @internal
        */
       handleChange() {
-          this.node.store.set(this.token, this.observer.observe(this.node.target, defaultExecutionContext));
+          try {
+              this.node.store.set(this.token, this.observer.observe(this.node.target, defaultExecutionContext));
+          }
+          catch (e) {
+              console.error(e);
+          }
       }
   }
   /**
@@ -9464,6 +9471,7 @@
       }
       delete(token) {
           this.values.delete(token);
+          Observable.getNotifier(this).notify(token.id);
       }
       all() {
           return this.values.entries();
@@ -9689,6 +9697,9 @@
               const parent = childToParent.get(this);
               parent.removeChild(this);
           }
+          for (const token of this.bindingObservers.keys()) {
+              this.tearDownBindingObserver(token);
+          }
       }
       /**
        * Appends a child to a parent DesignTokenNode.
@@ -9706,6 +9717,8 @@
           // How can we not notify *every* subscriber?
           for (const [token, value] of this.store.all()) {
               child.hydrate(token, this.bindingObservers.has(token) ? this.getRaw(token) : value);
+              // Need to stop reflecting any tokens that can now be inherited
+              child.updateCSSTokenReflection(child.store, token);
           }
       }
       /**
@@ -9718,7 +9731,16 @@
               this.children.splice(childIndex, 1);
           }
           Observable.getNotifier(this.store).unsubscribe(child);
-          return child.parent === this ? childToParent.delete(child) : false;
+          if (child.parent !== this) {
+              return false;
+          }
+          const deleted = childToParent.delete(child);
+          for (const [token] of this.store.all()) {
+              child.hydrate(token, child.getRaw(token));
+              // Need to start reflecting any assigned values that were previously inherited
+              child.updateCSSTokenReflection(child.store, token);
+          }
+          return deleted;
       }
       /**
        * Tests whether a provided node is contained by
@@ -18399,7 +18421,7 @@
   };
   const floppyDiskPen16X16 = {
       name: 'floppy_disk_pen_16_x_16',
-      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M7.17 11.108 7.299 11H7V9H5v2H4V8h6v.696l1.626-1.386c.107-.09.228-.155.355-.206L12 3.546c0-.33-.215-.546-.545-.546H2.583A.585.585 0 0 0 2 3.598V10.5l1.5 1.497 3.136.001zM3 7V4h8v3z" class="cls-2"/><path d="M12.275 8.07c.218-.185.693-.008 1.205.552s.635 1.038.418 1.223l-.92.784-1.621-1.775zm-4.92 6.113 1.98-.899-.985.164.043-.94-.32.161.104-.652-1.17 1.786zm2.212-.645L6 15l1.945-3.236 2.1-1.791 1.622 1.774zm2.862-2.49-1.622-1.774c-.118-.13.148-.349.262-.224l1.623 1.775c.117.128-.15.348-.263.224m-.522.452-1.622-1.775c-.118-.129.148-.349.262-.223l1.623 1.774c.117.128-.15.348-.263.224" class="cls-1"/></svg>`,
+      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M7.803 11H7V9H5v2H4V8h6v.617l1.469-1.471q.227-.224.514-.347L12 3.546c0-.33-.215-.546-.545-.546H2.583A.585.585 0 0 0 2 3.598V10.5l1.5 1.497L7.372 12zM3 7V4h8v3zm11.166 1.935L13.09 7.859a.64.64 0 0 0-.908 0l-3.388 3.393-1.503 3.483 3.487-1.5 3.388-3.392a.64.64 0 0 0 0-.908m-5.683 4.803-.198-.199.916-2.116.34 1.06 1.058.35z" class="cls-1"/></svg>`,
   };
   const floppyDiskStarArrowRight16X16 = {
       name: 'floppy_disk_star_arrow_right_16_x_16',
@@ -18497,6 +18519,10 @@
       name: 'layer_group_16_x_16',
       data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m3.555 9.546.89-.445 5.333 2.667 1.778-.89.889.449v1.33L9.778 13.99l-6.223-3.11Zm0-6.222L6.222 1.99l6.223 3.112v1.333L9.778 7.768l-6.223-3.11Zm0 3.11.89-.444 5.333 2.667 1.778-.89.889.448v1.33L9.778 10.88 3.555 7.768Z" class="cls-1"/></svg>`,
   };
+  const lightbulb16X16 = {
+      name: 'lightbulb_16_x_16',
+      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M12 5.53C12 3.584 10.206 2 8 2S4 3.583 4 5.53c0 .736.256 1.44.74 2.04.801.99 1.285 2.456 1.555 3.427h3.41c.27-.97.754-2.437 1.556-3.428.483-.598.739-1.303.739-2.038M9.138 14H6.862l-.569-1.001v-.3l.285-.15-.285-.15v-.401h3.414v.4l-.285.15.285.15V13z" class="cls-1"/></svg>`,
+  };
   const lightningBolt16X16 = {
       name: 'lightning_bolt_16_x_16',
       data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M4.732 7.953 6.909 2h3.636L8.364 7.013h2.909L4.727 14l2.21-6.049Z" class="cls-1"/></svg>`,
@@ -18533,6 +18559,10 @@
       name: 'markdown_16_x_16',
       data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M14.25 3H1.75a.74.74 0 0 0-.75.73v8.54a.74.74 0 0 0 .75.73h12.5a.74.74 0 0 0 .75-.73V3.73a.74.74 0 0 0-.75-.73m-6.285 7.059h-.991V7.773L5.982 9.35l-.99-1.577v2.286H4V5.934h.91L5.982 7.51l1.073-1.576h.91Zm2.459.007L8.848 7.945h1.1V5.934h.99v2.01H12Z" class="cls-1"/></svg>`,
   };
+  const microphone16X16 = {
+      name: 'microphone_16_x_16',
+      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M6 8V4a2 2 0 1 1 4 0v4a2 2 0 0 1-4 0m6 0v-.5a.5.5 0 1 0-1 0V8a3 3 0 1 1-6 0v-.5a.5.5 0 1 0-1 0V8c0 1.859 1.28 3.411 3 3.858V14h2v-2.142c1.72-.447 3-2 3-3.858" class="cls-1"/><path d="M6 8V4a2 2 0 1 1 4 0v4a2 2 0 0 1-4 0m6 0v-.5a.5.5 0 1 0-1 0V8a3 3 0 1 1-6 0v-.5a.5.5 0 1 0-1 0V8c0 1.859 1.28 3.411 3 3.858V14h2v-2.142c1.72-.447 3-2 3-3.858" class="cls-1"/></svg>`,
+  };
   const minus16X16 = {
       name: 'minus_16_x_16',
       data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M4 7h8v2H4z" class="cls-1"/></svg>`,
@@ -18545,6 +18575,10 @@
       name: 'mobile_16_x_16',
       data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M10.462 2.077H4.538A.54.54 0 0 0 4 2.615v10.77a.54.54 0 0 0 .538.538h5.924a.54.54 0 0 0 .538-.538V2.615a.54.54 0 0 0-.538-.538M10 12H5V3h5Z" class="cls-1"/></svg>`,
   };
+  const mountainSun16X16 = {
+      name: 'mountain_sun_16_x_16',
+      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m13.457 10.097-1.468-3.011-1.195-1.026-.677.48-2.343-3.556L4.688 8.14l-1.204-.678-1.468 1.543L1 13h14zm-10.478-.2-.939 1.047.372-1.652.975-.993 2.722 3.04zm5.924.764L7.181 9.335l.17-1.958-2.192.896L7.605 4.19 9.4 7.06l-.11.943 1.197-1.038 2.228 4.345zM4.5 4.487a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0" class="cls-1"/></svg>`,
+  };
   const ni16X16 = {
       name: 'ni_16_x_16',
       data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M7.172 4c1.675 0 3 1.354 3 3.103V13h-3V7h-3V4zm-3 9h-3V7h3zm10.656-9v9c-1.681 0-3-1.378-3-3V4z" class="cls-1"/></svg>`,
@@ -18565,6 +18599,14 @@
       name: 'outward_squares_three_16_x_16',
       data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M9 9H7V7h2zm-6 4h4V9H3zM3 3v4h2V5h6v6H9v2h4V3zm7 3H9v1h1z" class="cls-1"/></svg>`,
   };
+  const paperPlane16X16 = {
+      name: 'paper_plane_16_x_16',
+      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m1 12.5 2-4 6-1-6-1-2-4 14 5z" class="cls-1"/></svg>`,
+  };
+  const paperclip16X16 = {
+      name: 'paperclip_16_x_16',
+      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M8.5 14C6.406 14 5 12.393 5 10V5c0-1.822.981-3 2.5-3S10 3.178 10 5v3.98c0 1.328-.505 2-1.5 2s-1.5-.672-1.5-2V6h1v2.98c0 1 .266 1 .5 1s.5 0 .5-1V5c0-.602-.146-2-1.5-2S6 4.398 6 5v5c0 1.384.654 3 2.5 3s2.5-1.616 2.5-3V6h1v4c0 2.393-1.406 4-3.5 4"/></svg>`,
+  };
   const paste16X16 = {
       name: 'paste_16_x_16',
       data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M9 5V3H3v6h2v1H2V2h8v3ZM6 6v8h8V6Z" class="cls-1"/></svg>`,
@@ -18575,7 +18617,7 @@
   };
   const pencil16X16 = {
       name: 'pencil_16_x_16',
-      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M11.413 2.674c.326-.288 1.04-.013 1.807.857.768.869.952 1.61.626 1.898l-1.378 1.218-2.433-2.757Zm-7.381 9.493 2.97-1.396-1.477.254.064-1.459-.48.25.156-1.013-1.754 2.774Zm3.319-1.002L2 13.435 4.917 8.41l3.15-2.78L10.5 8.383Zm4.293-3.866L9.21 4.544c-.177-.202.222-.543.394-.349l2.434 2.756c.175.2-.224.54-.394.348m-.783.7L8.428 5.244c-.178-.201.22-.542.393-.347l2.433 2.755c.176.199-.223.54-.393.347" class="cls-1"/></svg>`,
+      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M10.118 2.793 4.84 8.076 2.5 13.5l5.43-2.335 5.278-5.284a1 1 0 0 0-.001-1.414l-1.675-1.674a1 1 0 0 0-1.414 0m-5.76 9.154-.31-.309 1.427-3.296.53 1.652 1.648.543z" class="cls-1"/></svg>`,
   };
   const play = {
       name: 'play',
@@ -18593,6 +18635,10 @@
       name: 'rectangle_check_lines_16_x_16',
       data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M3 2v12h10V2zm9 11H4V3h8z" class="cls-2"/><path d="M5 9h6v1H5zM5 11h3v1H5z" class="cls-2"/><path d="M11 4.643 7.591 8 6 6.434l.682-.672.937.923L10.347 4z" class="cls-1"/></svg>`,
   };
+  const rectangleLines16X16 = {
+      name: 'rectangle_lines_16_x_16',
+      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M3 2v11h10V2zm6 7H5V8h4zm2-2H5V6h6zm0-2H5V4h6z" class="cls-1"/></svg>`,
+  };
   const runningArrow16X16 = {
       name: 'running_arrow_16_x_16',
       data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m13.45 7.985-7.602 4.013L7.75 8 5.848 3.987zM3.945 2.997 2.05 2 4.9 8l-2.85 6 1.902-1.005L6.325 8z" class="cls-1"/></svg>`,
@@ -18657,6 +18703,10 @@
       name: 'square_x_16_x_16',
       data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M3 3v10h10V3zm8 7.01-.99.99L8 8.99 5.99 11 5 10.01 7.01 8 5 5.99 5.99 5 8 7.01 10.01 5l.99.99L8.99 8z" class="cls-1"/></svg>`,
   };
+  const star8Point16X16 = {
+      name: 'star_8_point_16_x_16',
+      data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M10.756 6.872 15 8.002 10.754 9.13l1.722 3.335-3.31-1.74L8.046 15l-1.118-4.276-3.312 1.736 1.727-3.332L1 7.996 5.343 6.87 3.621 3.535l3.308 1.74L8.052 1l1.12 4.276 3.31-1.734z" class="cls-1"/></svg>`,
+  };
   const stopSquare16X16 = {
       name: 'stop_square_16_x_16',
       data: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M3 3h10v10H3z" class="cls-1"/></svg>`,
@@ -23859,6 +23909,18 @@ so this becomes the fallback color for the slot */ ''}
   }
   registerIcon('icon-layer-group', IconLayerGroup);
 
+  // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
+  // See generation source in nimble-components/build/generate-icons
+  /**
+   * The icon component for the 'lightbulb' icon
+   */
+  class IconLightbulb extends Icon {
+      constructor() {
+          super(lightbulb16X16);
+      }
+  }
+  registerIcon('icon-lightbulb', IconLightbulb);
+
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
@@ -23969,6 +24031,18 @@ so this becomes the fallback color for the slot */ ''}
   }
   registerIcon('icon-markdown', IconMarkdown);
 
+  // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
+  // See generation source in nimble-components/build/generate-icons
+  /**
+   * The icon component for the 'microphone' icon
+   */
+  class IconMicrophone extends Icon {
+      constructor() {
+          super(microphone16X16);
+      }
+  }
+  registerIcon('icon-microphone', IconMicrophone);
+
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
@@ -24006,6 +24080,18 @@ so this becomes the fallback color for the slot */ ''}
   }
   registerIcon('icon-mobile', IconMobile);
 
+  // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
+  // See generation source in nimble-components/build/generate-icons
+  /**
+   * The icon component for the 'mountainSun' icon
+   */
+  class IconMountainSun extends Icon {
+      constructor() {
+          super(mountainSun16X16);
+      }
+  }
+  registerIcon('icon-mountain-sun', IconMountainSun);
+
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
@@ -24067,6 +24153,30 @@ so this becomes the fallback color for the slot */ ''}
   }
   registerIcon('icon-outward-squares-three', IconOutwardSquaresThree);
 
+  // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
+  // See generation source in nimble-components/build/generate-icons
+  /**
+   * The icon component for the 'paperPlane' icon
+   */
+  class IconPaperPlane extends Icon {
+      constructor() {
+          super(paperPlane16X16);
+      }
+  }
+  registerIcon('icon-paper-plane', IconPaperPlane);
+
+  // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
+  // See generation source in nimble-components/build/generate-icons
+  /**
+   * The icon component for the 'paperclip' icon
+   */
+  class IconPaperclip extends Icon {
+      constructor() {
+          super(paperclip16X16);
+      }
+  }
+  registerIcon('icon-paperclip', IconPaperclip);
+
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
@@ -24151,6 +24261,18 @@ so this becomes the fallback color for the slot */ ''}
   }
   registerIcon('icon-rectangle-check-lines', IconRectangleCheckLines);
 
+  // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
+  // See generation source in nimble-components/build/generate-icons
+  /**
+   * The icon component for the 'rectangleLines' icon
+   */
+  class IconRectangleLines extends Icon {
+      constructor() {
+          super(rectangleLines16X16);
+      }
+  }
+  registerIcon('icon-rectangle-lines', IconRectangleLines);
+
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**
@@ -24343,6 +24465,18 @@ so this becomes the fallback color for the slot */ ''}
   }
   registerIcon('icon-square-x', IconSquareX);
 
+  // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
+  // See generation source in nimble-components/build/generate-icons
+  /**
+   * The icon component for the 'star8Point' icon
+   */
+  class IconStar8Point extends Icon {
+      constructor() {
+          super(star8Point16X16);
+      }
+  }
+  registerIcon('icon-star-8-point', IconStar8Point);
+
   // AUTO-GENERATED FILE - DO NOT EDIT DIRECTLY
   // See generation source in nimble-components/build/generate-icons
   /**