@fluentui/web-components 3.0.0-beta.45 → 3.0.0-beta.46

package/dist/web-components.js

@@ -5151,7 +5151,7 @@ var __decorateClass$o = (decorators, target, key, kind) => {
   if (kind && result) __defProp$o(target, key, result);
   return result;
 };
-class Button extends FASTElement {
+class BaseButton extends FASTElement {
   constructor() {
     super();
     this.disabledFocusable = false;
@@ -5162,22 +5162,8 @@ class Button extends FASTElement {
      * @internal
      */
     this.elementInternals = this.attachInternals();
-    this.iconOnly = false;
     this.elementInternals.role = "button";
   }
-  /**
-   * Handles changes to appearance attribute custom states
-   * @param prev - the previous state
-   * @param next - the next state
-   */
-  appearanceChanged(prev, next) {
-    if (prev) {
-      toggleState(this.elementInternals, `${prev}`, false);
-    }
-    if (next) {
-      toggleState(this.elementInternals, `${next}`, true);
-    }
-  }
   /**
    * Sets the element's internal disabled state when the element is focusable while disabled.
    *
@@ -5198,14 +5184,6 @@ class Button extends FASTElement {
   get form() {
     return this.elementInternals.form;
   }
-  /**
-   * Handles changes to icon only custom states
-   * @param prev - the previous state
-   * @param next - the next state
-   */
-  iconOnlyChanged(prev, next) {
-    toggleState(this.elementInternals, "icon", next);
-  }
   /**
    * A reference to all associated label elements.
    *
@@ -5214,32 +5192,6 @@ class Button extends FASTElement {
   get labels() {
     return Object.freeze(Array.from(this.elementInternals.labels));
   }
-  /**
-   * Handles changes to shape attribute custom states
-   * @param prev - the previous state
-   * @param next - the next state
-   */
-  shapeChanged(prev, next) {
-    if (prev) {
-      toggleState(this.elementInternals, `${prev}`, false);
-    }
-    if (next) {
-      toggleState(this.elementInternals, `${next}`, true);
-    }
-  }
-  /**
-   * Handles changes to size attribute custom states
-   * @param prev - the previous state
-   * @param next - the next state
-   */
-  sizeChanged(prev, next) {
-    if (prev) {
-      toggleState(this.elementInternals, `${prev}`, false);
-    }
-    if (next) {
-      toggleState(this.elementInternals, `${next}`, true);
-    }
-  }
   /**
    * Removes the form submission fallback control when the type changes.
    *
@@ -5399,52 +5351,105 @@ class Button extends FASTElement {
  *
  * @public
  */
-Button.formAssociated = true;
-__decorateClass$o([attr], Button.prototype, "appearance", 2);
+BaseButton.formAssociated = true;
 __decorateClass$o([attr({
   mode: "boolean"
-})], Button.prototype, "autofocus", 2);
-__decorateClass$o([observable], Button.prototype, "defaultSlottedContent", 2);
+})], BaseButton.prototype, "autofocus", 2);
+__decorateClass$o([observable], BaseButton.prototype, "defaultSlottedContent", 2);
 __decorateClass$o([attr({
   mode: "boolean"
-})], Button.prototype, "disabled", 2);
+})], BaseButton.prototype, "disabled", 2);
 __decorateClass$o([attr({
   attribute: "disabled-focusable",
   mode: "boolean"
-})], Button.prototype, "disabledFocusable", 2);
+})], BaseButton.prototype, "disabledFocusable", 2);
 __decorateClass$o([attr({
   attribute: "tabindex",
   mode: "fromView",
   converter: nullableNumberConverter
-})], Button.prototype, "tabIndex", 2);
+})], BaseButton.prototype, "tabIndex", 2);
 __decorateClass$o([attr({
   attribute: "formaction"
-})], Button.prototype, "formAction", 2);
+})], BaseButton.prototype, "formAction", 2);
 __decorateClass$o([attr({
   attribute: "form"
-})], Button.prototype, "formAttribute", 2);
+})], BaseButton.prototype, "formAttribute", 2);
 __decorateClass$o([attr({
   attribute: "formenctype"
-})], Button.prototype, "formEnctype", 2);
+})], BaseButton.prototype, "formEnctype", 2);
 __decorateClass$o([attr({
   attribute: "formmethod"
-})], Button.prototype, "formMethod", 2);
+})], BaseButton.prototype, "formMethod", 2);
 __decorateClass$o([attr({
   attribute: "formnovalidate",
   mode: "boolean"
-})], Button.prototype, "formNoValidate", 2);
+})], BaseButton.prototype, "formNoValidate", 2);
 __decorateClass$o([attr({
   attribute: "formtarget"
-})], Button.prototype, "formTarget", 2);
+})], BaseButton.prototype, "formTarget", 2);
+__decorateClass$o([attr], BaseButton.prototype, "name", 2);
+__decorateClass$o([attr], BaseButton.prototype, "type", 2);
+__decorateClass$o([attr], BaseButton.prototype, "value", 2);
+class Button extends BaseButton {
+  constructor() {
+    super(...arguments);
+    this.iconOnly = false;
+  }
+  /**
+   * Handles changes to appearance attribute custom states
+   * @param prev - the previous state
+   * @param next - the next state
+   */
+  appearanceChanged(prev, next) {
+    if (prev) {
+      toggleState(this.elementInternals, `${prev}`, false);
+    }
+    if (next) {
+      toggleState(this.elementInternals, `${next}`, true);
+    }
+  }
+  /**
+   * Handles changes to shape attribute custom states
+   * @param prev - the previous state
+   * @param next - the next state
+   */
+  shapeChanged(prev, next) {
+    if (prev) {
+      toggleState(this.elementInternals, `${prev}`, false);
+    }
+    if (next) {
+      toggleState(this.elementInternals, `${next}`, true);
+    }
+  }
+  /**
+   * Handles changes to size attribute custom states
+   * @param prev - the previous state
+   * @param next - the next state
+   */
+  sizeChanged(prev, next) {
+    if (prev) {
+      toggleState(this.elementInternals, `${prev}`, false);
+    }
+    if (next) {
+      toggleState(this.elementInternals, `${next}`, true);
+    }
+  }
+  /**
+   * Handles changes to icon only custom states
+   * @param prev - the previous state
+   * @param next - the next state
+   */
+  iconOnlyChanged(prev, next) {
+    toggleState(this.elementInternals, "icon", next);
+  }
+}
+__decorateClass$o([attr], Button.prototype, "appearance", 2);
+__decorateClass$o([attr], Button.prototype, "shape", 2);
+__decorateClass$o([attr], Button.prototype, "size", 2);
 __decorateClass$o([attr({
   attribute: "icon-only",
   mode: "boolean"
 })], Button.prototype, "iconOnly", 2);
-__decorateClass$o([attr], Button.prototype, "name", 2);
-__decorateClass$o([attr], Button.prototype, "shape", 2);
-__decorateClass$o([attr], Button.prototype, "size", 2);
-__decorateClass$o([attr], Button.prototype, "type", 2);
-__decorateClass$o([attr], Button.prototype, "value", 2);
 applyMixins(Button, StartEnd);
 
 function buttonTemplate$1(options = {}) {