@flywheel-io/vision 20.1.2 → 20.1.3

package/fesm2022/flywheel-io-vision.mjs

@@ -351,6 +351,9 @@ class FwAvatarComponent {
     constructor() {
         this.bordered = input(false, ...(ngDevMode ? [{ debugName: "bordered" }] : []));
         this.color = input('primary', ...(ngDevMode ? [{ debugName: "color" }] : []));
+        /**
+         * A seed that will be hashed to choose a color, overrides the `color` prop if set
+         */
         this.colorSeed = model(...(ngDevMode ? [undefined, { debugName: "colorSeed" }] : []));
         this.content = input('icon', ...(ngDevMode ? [{ debugName: "content" }] : []));
         this.icon = input('user', ...(ngDevMode ? [{ debugName: "icon" }] : []));
@@ -358,6 +361,9 @@ class FwAvatarComponent {
         this.imageUrl = input('', ...(ngDevMode ? [{ debugName: "imageUrl" }] : []));
         this.initial = input('', ...(ngDevMode ? [{ debugName: "initial" }] : []));
         this.selectable = input(false, ...(ngDevMode ? [{ debugName: "selectable" }] : []));
+        /**
+         * Applies selected styling, they can also be applied by host-context
+         */
         this.selected = model(false, ...(ngDevMode ? [{ debugName: "selected" }] : []));
         this.size = input('small', ...(ngDevMode ? [{ debugName: "size" }] : []));
         this.variant = input('circular', ...(ngDevMode ? [{ debugName: "variant" }] : []));
@@ -372,8 +378,8 @@ class FwAvatarComponent {
             ];
             return classes.filter(Boolean).join(' ');
         }, ...(ngDevMode ? [{ debugName: "hostClasses" }] : []));
-        this.hasedColor = computed(() => pickColorViaHash(this.colorSeed()), ...(ngDevMode ? [{ debugName: "hasedColor" }] : []));
-        this.colorToDisplay = computed(() => this.colorSeed() ? this.hasedColor() : namedColorMap[this.color()], ...(ngDevMode ? [{ debugName: "colorToDisplay" }] : []));
+        this.hashedColor = computed(() => pickColorViaHash(this.colorSeed()), ...(ngDevMode ? [{ debugName: "hashedColor" }] : []));
+        this.colorToDisplay = computed(() => this.colorSeed() ? this.hashedColor() : namedColorMap[this.color()], ...(ngDevMode ? [{ debugName: "colorToDisplay" }] : []));
         this.isImageBroken = signal(false, ...(ngDevMode ? [{ debugName: "isImageBroken" }] : []));
         this.reloadImageOnUrlChange = effect(() => {
             this.imageUrl(); // establish dependency
@@ -1159,9 +1165,10 @@ class FwTooltipDirective {
             const tagsToCloseFor = ['mat-option', 'mat-select', 'fw-menu-item'];
             const tagName = nativeElement.tagName.toLowerCase();
             if (tagsToCloseFor.includes(tagName)) {
+                // capture: true so stopPropagation() inside fw-menu-item's handleClick doesn't block this
                 nativeElement.addEventListener('click', () => {
                     this.hideTooltip();
-                });
+                }, { capture: true });
             }
         }, ...(ngDevMode ? [{ debugName: "addMouseEventListeners" }] : []));
         this.openDelayTimer = 0;