@rogieking/figui3 2.23.0 → 2.24.0

package/components.css

@@ -466,7 +466,6 @@ input[type="text"][list] {
         }
       }
 
-      max-inline-size: var(--max-width);
       padding-block: 0;
       will-change: scale;
 
@@ -599,8 +598,9 @@ fig-dropdown,
     display: none !important;
   }
   > select {
-    display: block;
-    width: 100%;
+    display: flex;
+    align-items: center;
+    flex: 1;
   }
 
   /* Chevron icon using mask-image for light-dark support */

package/fig.js

@@ -5076,6 +5076,8 @@ customElements.define("fig-chit", FigChit);
  */
 class FigImage extends HTMLElement {
   #src = null;
+  #boundHandleFileInput = this.#handleFileInput.bind(this);
+  #boundHandleDownload = this.#handleDownload.bind(this);
   constructor() {
     super();
   }
@@ -5108,10 +5110,8 @@ class FigImage extends HTMLElement {
     this.#updateRefs();
   }
   disconnectedCallback() {
-    this.fileInput.removeEventListener(
-      "change",
-      this.#handleFileInput.bind(this)
-    );
+    this.fileInput?.removeEventListener("change", this.#boundHandleFileInput);
+    this.downloadButton?.removeEventListener("click", this.#boundHandleDownload);
   }
 
   #updateRefs() {
@@ -5120,25 +5120,13 @@ class FigImage extends HTMLElement {
       if (this.upload) {
         this.uploadButton = this.querySelector("fig-button[type='upload']");
         this.fileInput = this.uploadButton?.querySelector("input");
-        this.fileInput.removeEventListener(
-          "change",
-          this.#handleFileInput.bind(this)
-        );
-        this.fileInput.addEventListener(
-          "change",
-          this.#handleFileInput.bind(this)
-        );
+        this.fileInput?.removeEventListener("change", this.#boundHandleFileInput);
+        this.fileInput?.addEventListener("change", this.#boundHandleFileInput);
       }
       if (this.download) {
         this.downloadButton = this.querySelector("fig-button[type='download']");
-        this.downloadButton.removeEventListener(
-          "click",
-          this.#handleDownload.bind(this)
-        );
-        this.downloadButton.addEventListener(
-          "click",
-          this.#handleDownload.bind(this)
-        );
+        this.downloadButton?.removeEventListener("click", this.#boundHandleDownload);
+        this.downloadButton?.addEventListener("click", this.#boundHandleDownload);
       }
     });
   }

package/index.html

@@ -1577,7 +1577,8 @@
                 </fig-field>
                 <fig-field direction="horizontal">
                     <label>Dropdown</label>
-                    <fig-dropdown full>
+                    <fig-dropdown full
+                                  experimental="modern">
                         <option>Option One</option>
                         <option>Option Two</option>
                         <option>Option Three</option>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rogieking/figui3",
-  "version": "2.23.0",
+  "version": "2.24.0",
   "description": "A lightweight web components library for building Figma plugin and widget UIs with native look and feel",
   "author": "Rogie King",
   "license": "MIT",