@nldd/design-system 0.8.92 → 0.8.94

package/dist/components/actions/button/button.d.ts

@@ -2,22 +2,24 @@
  * Nederlandse Digitale Dienst Button Component (Lit + TypeScript)
  *
  * @element nldd-button
- * @attr {string} variant - Button variant: 'primary' | 'secondary' | 'destructive' | 'accent-filled' | 'accent-transparent' | 'neutral-tinted' | 'neutral-base' | 'neutral-transparent' | 'critical-tinted' | 'critical-transparent' | 'inherit-filled' | 'inherit-tinted'. The inherit variants derive their colors from currentColor, for buttons on colored surfaces; inherit-filled uses the surface color (--context-parent-background-color) as the label color, with a white/black contrast flip as a fallback.
+ * @attr {string} appearance - Visual style, color included: 'primary' | 'secondary' | 'destructive' | 'accent-filled' | 'accent-transparent' | 'neutral-tinted' | 'neutral-base' | 'neutral-transparent' | 'critical-tinted' | 'critical-transparent' | 'inherit-filled' | 'inherit-tinted'. The inherit appearances derive their colors from currentColor, for buttons on colored surfaces; inherit-filled uses the surface color (--context-parent-background-color) as the label color, with a white/black contrast flip as a fallback.
  * @attr {string} size - Button size: 'xs' | 'sm' | 'md' | 'lg' (default: 'md'). 'lg' uses larger text and 24px start/end icons.
  * @attr {string} horizontal-alignment - Horizontal alignment of the button content: 'left' | 'center' | 'right' (default: unset, centered). Most visible with width="full" or a fixed width.
  * @attr {boolean} loading - Loading state (default: false). Shows an activity indicator over the visually hidden content, sets aria-busy on the inner control and blocks activation, without dropping the button from the tab order (unlike disabled). The content stays laid out, so the button keeps its width.
+ * @attr {string} loading-text - What the screen reader announces while `loading` is on, for a button that does more than load: "Aan het bewaren". Leave it out and the activity indicator says its translated "Laden".
  * @attr {boolean} disabled - Disabled state
  * @attr {string} type - Button type for form submission: 'button' | 'submit' | 'reset' (ignored when href is set)
  * @attr {string} popovertarget - ID of a popover element this button invokes; forwarded to the inner button. Use the popoverTargetElement property instead when the popover lives in another tree.
  * @attr {boolean} expandable - Whether the button has a icon to indicate it opens a menu or popover
  * @attr {boolean} expanded - Whether the popover/menu controlled by this button is currently open. Forwarded as aria-expanded on the inner button; toggles the is-expanded visual state.
- * @attr {string} popup-type - Type of popup container this button opens: 'menu' | 'listbox' | 'dialog' | 'tree' | 'grid'. Sets aria-haspopup on the inner button and forces aria-expanded to always be present (true/false) so screen readers know the popup state.
+ * @attr {string} popup-type - Type of popup container this button opens: 'menu' | 'listbox' | 'dialog' | 'tree' | 'grid'. Sets aria-haspopup on the inner button and forces aria-expanded to always be present (true/false) so screen readers know the popup state. An nldd-menu or nldd-popover in the `popup` slot, or anchored to this button, sets it itself from the first render; set it only for another kind of popup.
+ * @attr {string} form - Id of the form this button submits or resets, for a button that sits outside it. Takes an `nldd-form` as well as a plain `<form>`. Without it the button acts on the form it stands in. The id is looked up in the button's own root, as the platform does it: a button inside a shadow tree does not reach a form in the document around it. An id that finds nothing, or an `nldd-form` that has not rendered its form yet, says so in development rather than letting the click do nothing.
  * @attr {string} width - Width mode: 'full' (stretches to container) or any CSS length (e.g. '240px')
  * @attr {string} max-width - Caps the width at this CSS length (e.g. '320px'). Combines with `width="full"`: the button follows its container up to the cap. A label that doesn't fit is truncated with an ellipsis — a cap only means something if the content respects it.
  * @attr {string} text - Button text
  * @attr {string} supporting-text - Supporting text shown below the text (md/lg) or after it (sm/xs), in a secondary color. Part of the accessible name (unless `accessible-label` is set, which replaces the whole accessible name).
  * @attr {boolean} single-line - When true, truncates overflowing text with an ellipsis instead of letting it wrap. Requires the button (or an ancestor) to constrain the width.
- * @attr {boolean} no-highlight-border - Removes the per-variant highlight border (e.g. when nldd-button-bar draws a single group border instead).
+ * @attr {boolean} no-highlight-border - Removes the per-appearance highlight border (e.g. when nldd-button-bar draws a single group border instead).
  * @attr {boolean} no-tab - Takes the button out of the tab order (tabindex="-1"), for a control owned by a roving container (e.g. a button in a row of an nldd-list, where the arrow keys move between rows) that manages focus itself. Still mouse- and script-focusable.
  * @attr {string} start-icon - Icon name for the start icon (before text)
  * @attr {string} end-icon - Icon name for the end icon (after text)
@@ -38,7 +40,7 @@ import { LitElement } from 'lit';
 import { PopupAnchorController } from '../../../utilities/popup-anchor-controller.js';
 import './../../content/icon/icon.js';
 import './../../status-and-feedback/activity-indicator/activity-indicator.js';
-type Variant = 'primary' | 'secondary' | 'destructive' | 'accent-filled' | 'accent-transparent' | 'neutral-tinted' | 'neutral-base' | 'neutral-transparent' | 'critical-tinted' | 'critical-transparent' | 'inherit-filled' | 'inherit-tinted';
+type Appearance = 'primary' | 'secondary' | 'destructive' | 'accent-filled' | 'accent-transparent' | 'neutral-tinted' | 'neutral-base' | 'neutral-transparent' | 'critical-tinted' | 'critical-transparent' | 'inherit-filled' | 'inherit-tinted';
 type Size = 'xs' | 'sm' | 'md' | 'lg';
 type ButtonType = 'button' | 'submit' | 'reset';
 type PopupType = 'menu' | 'listbox' | 'dialog' | 'tree' | 'grid';
@@ -52,7 +54,7 @@ export declare class NLDDButton extends NLDDButton_base {
     static styles: import("lit").CSSResult;
     static formAssociated: boolean;
     private _internals;
-    variant: Variant;
+    appearance: Appearance;
     size: Size;
     /** Horizontal alignment of the button content. Most visible with width="full" or a fixed width. */
     horizontalAlignment: 'left' | 'center' | 'right' | '';
@@ -104,13 +106,15 @@ export declare class NLDDButton extends NLDDButton_base {
      * `click` listener delegated on an ancestor receives nothing while loading.
      */
     loading: boolean;
+    /** What the screen reader announces while loading. Empty falls back to the activity indicator's "Laden". */
+    loadingText: string;
     disabled: boolean;
     /** Button text. */
     text: string;
     /** Supporting text: below the text (md/lg) or after it (sm/xs), in a secondary color. Part of the accessible name (unless `accessible-label` is set, which replaces the whole accessible name). */
     supportingText: string;
     singleLine: boolean;
-    /** Removes the per-variant highlight border (e.g. when nldd-button-bar draws a single group border instead). */
+    /** Removes the per-appearance highlight border (e.g. when nldd-button-bar draws a single group border instead). */
     noHighlightBorder: boolean;
     /** Icon name for the start icon (before text). When not set, the start-icon slot is used. */
     startIcon: string;
@@ -128,12 +132,30 @@ export declare class NLDDButton extends NLDDButton_base {
      */
     rel: string | undefined;
     private _warnedA11y;
+    private _warnedFormId;
     /** Shared wiring for an overlay slotted into `popup`: anchors it to this
      * button and turns clicks into open/close. Not private: the template module
      * binds its handlers. */
     _popup: PopupAnchorController;
     updated(changedProperties: Map<string, unknown>): void;
     private _handleClick;
+    /**
+     * The form this button acts on: the one it sits in, or the one its `form`
+     * attribute names.
+     *
+     * The platform resolves that attribute itself, but only to a real `<form>`.
+     * An `nldd-form` renders its form in the light DOM without handing it the id
+     * the consumer wrote, so an id pointing at the component finds an element
+     * that is not a form, and the button ends up with no form owner at all. That
+     * is the whole reason a save button in a page footer, outside the form it
+     * belongs to, used to do nothing.
+     *
+     * The id is looked up in the button's own root, the same scope the platform
+     * searches: a button inside a shadow tree reaches the forms in that tree, not
+     * one in the document around it. Put the two in the same tree, or hand the
+     * button its form another way.
+     */
+    private _ownerForm;
     /**
      * Delegates focus to the inner `<button>` (or `<a>` when `href` is set), so
      * consumers can call `buttonEl.focus()` without reaching into shadow DOM.

package/dist/components/actions/button/button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../../src/components/actions/button/button.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAOjC,OAAO,EAAE,qBAAqB,EAAE,MAAM,+CAA+C,CAAC;AACtF,OAAO,8BAA8B,CAAC;AACtC,OAAO,sEAAsE,CAAC;AAG9E,KAAK,OAAO,GACT,SAAS,GACT,WAAW,GACX,aAAa,GACb,eAAe,GACf,oBAAoB,GACpB,gBAAgB,GAChB,cAAc,GACd,qBAAqB,GACrB,iBAAiB,GACjB,sBAAsB,GACtB,gBAAgB,GAChB,gBAAgB,CAAC;AACpB,KAAK,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AACtC,KAAK,UAAU,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;AAChD,KAAK,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAC;;;;;;;AAEjE,qBACa,UAAW,SAAQ,eAAiE;IAChG,OAAgB,MAAM,0BAAgB;IAKtC,MAAM,CAAC,cAAc,UAAQ;IAC7B,OAAO,CAAC,UAAU,CAA0B;IAG5C,OAAO,EAAE,OAAO,CAAoB;IAGpC,IAAI,EAAE,IAAI,CAAQ;IAElB,mGAAmG;IAEnG,mBAAmB,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,EAAE,CAAM;IAE3D,mEAAmE;IAEnE,KAAK,SAAM;IAEX;;6DAEyD;IAEzD,QAAQ,SAAM;IAEd;;qFAEiF;IAEjF,KAAK,UAAS;IAGd,UAAU,UAAS;IAGnB,QAAQ,UAAS;IAEjB;;;;OAIG;IAEH,SAAS,CAAC,EAAE,SAAS,CAAC;IAGtB,IAAI,EAAE,UAAU,CAAY;IAG5B,aAAa,EAAE,MAAM,GAAG,SAAS,CAAa;IAE9C;;;;;;;;OAQG;IAEH,oBAAoB,EAAE,OAAO,GAAG,IAAI,CAAQ;IAE5C;;;;;;OAMG;IAEH,mBAAmB,EAAE,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAY;IAE3D;;;;;;;;OAQG;IAEH,OAAO,UAAS;IAGhB,QAAQ,UAAS;IAEjB,mBAAmB;IAEnB,IAAI,SAAM;IAEV,mMAAmM;IAEnM,cAAc,SAAM;IAGpB,UAAU,UAAS;IAEnB,gHAAgH;IAEhH,iBAAiB,UAAS;IAE1B,6FAA6F;IAE7F,SAAS,SAAM;IAEf,wFAAwF;IAExF,OAAO,SAAM;IAEb,0GAA0G;IAE1G,eAAe,SAAM;IAErB,4DAA4D;IAE5D,IAAI,EAAE,MAAM,GAAG,SAAS,CAAa;IAErC,+DAA+D;IAE/D,MAAM,EAAE,MAAM,GAAG,SAAS,CAAa;IAEvC;;;OAGG;IAEH,GAAG,EAAE,MAAM,GAAG,SAAS,CAAa;IAEpC,OAAO,CAAC,WAAW,CAAS;IAE5B;;6BAEyB;IACzB,MAAM,wBAAmC;IAEhC,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAmC/D,OAAO,CAAC,YAAY;IA+BpB;;;OAGG;IACM,KAAK,CAAC,OAAO,CAAC,EAAE,YAAY,GAAG,IAAI;IAI5C,6DAA6D;IACpD,eAAe,IAAI,OAAO,GAAG,IAAI;IAIjC,MAAM;CAKf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,aAAa,EAAE,UAAU,CAAC;KAC1B;CACD"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../../src/components/actions/button/button.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAOjC,OAAO,EAAE,qBAAqB,EAAE,MAAM,+CAA+C,CAAC;AACtF,OAAO,8BAA8B,CAAC;AACtC,OAAO,sEAAsE,CAAC;AAG9E,KAAK,UAAU,GACZ,SAAS,GACT,WAAW,GACX,aAAa,GACb,eAAe,GACf,oBAAoB,GACpB,gBAAgB,GAChB,cAAc,GACd,qBAAqB,GACrB,iBAAiB,GACjB,sBAAsB,GACtB,gBAAgB,GAChB,gBAAgB,CAAC;AACpB,KAAK,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AACtC,KAAK,UAAU,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;AAChD,KAAK,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAC;;;;;;;AAEjE,qBACa,UAAW,SAAQ,eAAiE;IAChG,OAAgB,MAAM,0BAAgB;IAKtC,MAAM,CAAC,cAAc,UAAQ;IAC7B,OAAO,CAAC,UAAU,CAA0B;IAG5C,UAAU,EAAE,UAAU,CAAoB;IAG1C,IAAI,EAAE,IAAI,CAAQ;IAElB,mGAAmG;IAEnG,mBAAmB,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,EAAE,CAAM;IAE3D,mEAAmE;IAEnE,KAAK,SAAM;IAEX;;6DAEyD;IAEzD,QAAQ,SAAM;IAEd;;qFAEiF;IAEjF,KAAK,UAAS;IAGd,UAAU,UAAS;IAGnB,QAAQ,UAAS;IAEjB;;;;OAIG;IAEH,SAAS,CAAC,EAAE,SAAS,CAAC;IAGtB,IAAI,EAAE,UAAU,CAAY;IAG5B,aAAa,EAAE,MAAM,GAAG,SAAS,CAAa;IAE9C;;;;;;;;OAQG;IAEH,oBAAoB,EAAE,OAAO,GAAG,IAAI,CAAQ;IAE5C;;;;;;OAMG;IAEH,mBAAmB,EAAE,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAY;IAE3D;;;;;;;;OAQG;IAEH,OAAO,UAAS;IAEhB,4GAA4G;IAE5G,WAAW,SAAM;IAGjB,QAAQ,UAAS;IAEjB,mBAAmB;IAEnB,IAAI,SAAM;IAEV,mMAAmM;IAEnM,cAAc,SAAM;IAGpB,UAAU,UAAS;IAEnB,mHAAmH;IAEnH,iBAAiB,UAAS;IAE1B,6FAA6F;IAE7F,SAAS,SAAM;IAEf,wFAAwF;IAExF,OAAO,SAAM;IAEb,0GAA0G;IAE1G,eAAe,SAAM;IAErB,4DAA4D;IAE5D,IAAI,EAAE,MAAM,GAAG,SAAS,CAAa;IAErC,+DAA+D;IAE/D,MAAM,EAAE,MAAM,GAAG,SAAS,CAAa;IAEvC;;;OAGG;IAEH,GAAG,EAAE,MAAM,GAAG,SAAS,CAAa;IAEpC,OAAO,CAAC,WAAW,CAAS;IAC5B,OAAO,CAAC,aAAa,CAAuB;IAE5C;;6BAEyB;IACzB,MAAM,wBAAmC;IAEhC,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAmC/D,OAAO,CAAC,YAAY;IAgCpB;;;;;;;;;;;;;;;OAeG;IACH,OAAO,CAAC,UAAU;IAuBlB;;;OAGG;IACM,KAAK,CAAC,OAAO,CAAC,EAAE,YAAY,GAAG,IAAI;IAI5C,6DAA6D;IACpD,eAAe,IAAI,OAAO,GAAG,IAAI;IAIjC,MAAM;CAKf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,aAAa,EAAE,UAAU,CAAC;KAC1B;CACD"}

package/dist/components/actions/button/button.js

@@ -2,22 +2,24 @@
  * Nederlandse Digitale Dienst Button Component (Lit + TypeScript)
  *
  * @element nldd-button
- * @attr {string} variant - Button variant: 'primary' | 'secondary' | 'destructive' | 'accent-filled' | 'accent-transparent' | 'neutral-tinted' | 'neutral-base' | 'neutral-transparent' | 'critical-tinted' | 'critical-transparent' | 'inherit-filled' | 'inherit-tinted'. The inherit variants derive their colors from currentColor, for buttons on colored surfaces; inherit-filled uses the surface color (--context-parent-background-color) as the label color, with a white/black contrast flip as a fallback.
+ * @attr {string} appearance - Visual style, color included: 'primary' | 'secondary' | 'destructive' | 'accent-filled' | 'accent-transparent' | 'neutral-tinted' | 'neutral-base' | 'neutral-transparent' | 'critical-tinted' | 'critical-transparent' | 'inherit-filled' | 'inherit-tinted'. The inherit appearances derive their colors from currentColor, for buttons on colored surfaces; inherit-filled uses the surface color (--context-parent-background-color) as the label color, with a white/black contrast flip as a fallback.
  * @attr {string} size - Button size: 'xs' | 'sm' | 'md' | 'lg' (default: 'md'). 'lg' uses larger text and 24px start/end icons.
  * @attr {string} horizontal-alignment - Horizontal alignment of the button content: 'left' | 'center' | 'right' (default: unset, centered). Most visible with width="full" or a fixed width.
  * @attr {boolean} loading - Loading state (default: false). Shows an activity indicator over the visually hidden content, sets aria-busy on the inner control and blocks activation, without dropping the button from the tab order (unlike disabled). The content stays laid out, so the button keeps its width.
+ * @attr {string} loading-text - What the screen reader announces while `loading` is on, for a button that does more than load: "Aan het bewaren". Leave it out and the activity indicator says its translated "Laden".
  * @attr {boolean} disabled - Disabled state
  * @attr {string} type - Button type for form submission: 'button' | 'submit' | 'reset' (ignored when href is set)
  * @attr {string} popovertarget - ID of a popover element this button invokes; forwarded to the inner button. Use the popoverTargetElement property instead when the popover lives in another tree.
  * @attr {boolean} expandable - Whether the button has a icon to indicate it opens a menu or popover
  * @attr {boolean} expanded - Whether the popover/menu controlled by this button is currently open. Forwarded as aria-expanded on the inner button; toggles the is-expanded visual state.
- * @attr {string} popup-type - Type of popup container this button opens: 'menu' | 'listbox' | 'dialog' | 'tree' | 'grid'. Sets aria-haspopup on the inner button and forces aria-expanded to always be present (true/false) so screen readers know the popup state.
+ * @attr {string} popup-type - Type of popup container this button opens: 'menu' | 'listbox' | 'dialog' | 'tree' | 'grid'. Sets aria-haspopup on the inner button and forces aria-expanded to always be present (true/false) so screen readers know the popup state. An nldd-menu or nldd-popover in the `popup` slot, or anchored to this button, sets it itself from the first render; set it only for another kind of popup.
+ * @attr {string} form - Id of the form this button submits or resets, for a button that sits outside it. Takes an `nldd-form` as well as a plain `<form>`. Without it the button acts on the form it stands in. The id is looked up in the button's own root, as the platform does it: a button inside a shadow tree does not reach a form in the document around it. An id that finds nothing, or an `nldd-form` that has not rendered its form yet, says so in development rather than letting the click do nothing.
  * @attr {string} width - Width mode: 'full' (stretches to container) or any CSS length (e.g. '240px')
  * @attr {string} max-width - Caps the width at this CSS length (e.g. '320px'). Combines with `width="full"`: the button follows its container up to the cap. A label that doesn't fit is truncated with an ellipsis — a cap only means something if the content respects it.
  * @attr {string} text - Button text
  * @attr {string} supporting-text - Supporting text shown below the text (md/lg) or after it (sm/xs), in a secondary color. Part of the accessible name (unless `accessible-label` is set, which replaces the whole accessible name).
  * @attr {boolean} single-line - When true, truncates overflowing text with an ellipsis instead of letting it wrap. Requires the button (or an ancestor) to constrain the width.
- * @attr {boolean} no-highlight-border - Removes the per-variant highlight border (e.g. when nldd-button-bar draws a single group border instead).
+ * @attr {boolean} no-highlight-border - Removes the per-appearance highlight border (e.g. when nldd-button-bar draws a single group border instead).
  * @attr {boolean} no-tab - Takes the button out of the tab order (tabindex="-1"), for a control owned by a roving container (e.g. a button in a row of an nldd-list, where the arrow keys move between rows) that manages focus itself. Still mouse- and script-focusable.
  * @attr {string} start-icon - Icon name for the start icon (before text)
  * @attr {string} end-icon - Icon name for the end icon (after text)
@@ -55,7 +57,7 @@ let NLDDButton = class NLDDButton extends DescribedBy(withTranslations(LitElemen
     constructor() {
         super(...arguments);
         this._internals = this.attachInternals();
-        this.variant = 'neutral-tinted';
+        this.appearance = 'neutral-tinted';
         this.size = 'md';
         /** Horizontal alignment of the button content. Most visible with width="full" or a fixed width. */
         this.horizontalAlignment = '';
@@ -101,13 +103,15 @@ let NLDDButton = class NLDDButton extends DescribedBy(withTranslations(LitElemen
          * `click` listener delegated on an ancestor receives nothing while loading.
          */
         this.loading = false;
+        /** What the screen reader announces while loading. Empty falls back to the activity indicator's "Laden". */
+        this.loadingText = '';
         this.disabled = false;
         /** Button text. */
         this.text = '';
         /** Supporting text: below the text (md/lg) or after it (sm/xs), in a secondary color. Part of the accessible name (unless `accessible-label` is set, which replaces the whole accessible name). */
         this.supportingText = '';
         this.singleLine = false;
-        /** Removes the per-variant highlight border (e.g. when nldd-button-bar draws a single group border instead). */
+        /** Removes the per-appearance highlight border (e.g. when nldd-button-bar draws a single group border instead). */
         this.noHighlightBorder = false;
         /** Icon name for the start icon (before text). When not set, the start-icon slot is used. */
         this.startIcon = '';
@@ -125,6 +129,7 @@ let NLDDButton = class NLDDButton extends DescribedBy(withTranslations(LitElemen
          */
         this.rel = undefined;
         this._warnedA11y = false;
+        this._warnedFormId = null;
         /** Shared wiring for an overlay slotted into `popup`: anchors it to this
          * button and turns clicks into open/close. Not private: the template module
          * binds its handlers. */
@@ -194,10 +199,52 @@ let NLDDButton = class NLDDButton extends DescribedBy(withTranslations(LitElemen
         // or separate forms.
         if (this.href)
             return;
+        const form = this._ownerForm();
         if (this.type === 'submit')
-            this._internals.form?.requestSubmit();
+            form?.requestSubmit();
         else if (this.type === 'reset')
-            this._internals.form?.reset();
+            form?.reset();
+    }
+    /**
+     * The form this button acts on: the one it sits in, or the one its `form`
+     * attribute names.
+     *
+     * The platform resolves that attribute itself, but only to a real `<form>`.
+     * An `nldd-form` renders its form in the light DOM without handing it the id
+     * the consumer wrote, so an id pointing at the component finds an element
+     * that is not a form, and the button ends up with no form owner at all. That
+     * is the whole reason a save button in a page footer, outside the form it
+     * belongs to, used to do nothing.
+     *
+     * The id is looked up in the button's own root, the same scope the platform
+     * searches: a button inside a shadow tree reaches the forms in that tree, not
+     * one in the document around it. Put the two in the same tree, or hand the
+     * button its form another way.
+     */
+    _ownerForm() {
+        const id = this.getAttribute('form');
+        if (!id)
+            return this._internals.form;
+        const root = this.getRootNode();
+        const target = 'getElementById' in root ? root.getElementById(id) : null;
+        if (target instanceof HTMLFormElement)
+            return target;
+        const rendered = target?.form;
+        if (rendered instanceof HTMLFormElement)
+            return rendered;
+        // Nothing to submit is the silent failure this attribute exists to end:
+        // the click does nothing and no error says why. Say it once per button,
+        // naming what the id found, since a typo and an nldd-form that has not
+        // rendered yet look identical from the outside.
+        // Keyed on the id, not a flag: fix a typo and point at another form that
+        // does not exist either, and that one has to be said as well.
+        if (import.meta.env?.DEV && this._warnedFormId !== id) {
+            this._warnedFormId = id;
+            console.warn(target
+                ? `<nldd-button form="${id}">: that id is an <${target.tagName.toLowerCase()}> without a form, so this button submits nothing. An nldd-form only has one once it has rendered.`
+                : `<nldd-button form="${id}">: nothing in this root has that id, so this button submits nothing.`);
+        }
+        return null;
     }
     /**
      * Delegates focus to the inner `<button>` (or `<a>` when `href` is set), so
@@ -223,7 +270,7 @@ NLDDButton.styles = buttonStyles;
 NLDDButton.formAssociated = true;
 __decorate([
     property({ reflect: true, converter: reflectNonDefault('neutral-tinted') })
-], NLDDButton.prototype, "variant", void 0);
+], NLDDButton.prototype, "appearance", void 0);
 __decorate([
     property({ reflect: true, converter: reflectNonDefault('md') })
 ], NLDDButton.prototype, "size", void 0);
@@ -263,6 +310,9 @@ __decorate([
 __decorate([
     property({ type: Boolean, reflect: true })
 ], NLDDButton.prototype, "loading", void 0);
+__decorate([
+    property({ attribute: 'loading-text' })
+], NLDDButton.prototype, "loadingText", void 0);
 __decorate([
     property({ type: Boolean, reflect: true })
 ], NLDDButton.prototype, "disabled", void 0);

package/dist/components/actions/button/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../../src/components/actions/button/button.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../../src/components/actions/button/button.ts"],"names":[],"mappings":"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"}

package/dist/components/actions/button/button.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/actions/button/button.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,YAAY,yBAknBxB,CAAC"}
+{"version":3,"file":"button.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/actions/button/button.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,YAAY,yBAolBxB,CAAC"}

package/dist/components/actions/button/button.styles.js

@@ -10,7 +10,9 @@ export const buttonStyles = css `
 
 	:host {
 		--_corner-radius: var(--semantics-controls-md-corner-radius);
-		--_width: auto;
+		/* A parent that stacks its buttons says so through the context variable;
+		   the button's own width attribute overrides it with an inline style. */
+		--_width: var(--context-button-width, auto);
 		--_min-size: var(--semantics-controls-md-min-size);
 		--_block-padding: var(--semantics-controls-md-block-padding);
 		--_inline-padding: var(--semantics-buttons-md-inline-padding);
@@ -86,7 +88,7 @@ export const buttonStyles = css `
 		--_supporting-font: var(--semantics-buttons-lg-supporting-text-font);
 	}
 
-	:host([variant="neutral-base"]) {
+	:host([appearance="neutral-base"]) {
 		--_background-color: var(--semantics-buttons-neutral-base-background-color);
 		--_primary-content-color: var(--semantics-buttons-neutral-base-content-color);
 		--_secondary-content-color: var(--semantics-buttons-neutral-base-content-secondary-color);
@@ -101,7 +103,7 @@ export const buttonStyles = css `
 		--_is-active-highlight-border-color: var(--semantics-buttons-neutral-base-is-active-highlight-border-color);
 	}
 
-	:host([variant="neutral-transparent"]) {
+	:host([appearance="neutral-transparent"]) {
 		--_background-color: transparent;
 		--_primary-content-color: var(--semantics-buttons-neutral-transparent-content-color);
 		--_secondary-content-color: var(--semantics-buttons-neutral-transparent-content-secondary-color);
@@ -116,8 +118,8 @@ export const buttonStyles = css `
 		--_is-active-highlight-border-color: transparent;
 	}
 
-	:host([variant="accent-filled"]),
-	:host([variant="primary"]) {
+	:host([appearance="accent-filled"]),
+	:host([appearance="primary"]) {
 		--_background-color: var(--semantics-buttons-accent-filled-background-color);
 		--_primary-content-color: var(--semantics-buttons-accent-filled-content-color);
 		--_secondary-content-color: var(--semantics-buttons-accent-filled-content-secondary-color);
@@ -132,7 +134,7 @@ export const buttonStyles = css `
 		--_is-active-highlight-border-color: var(--semantics-buttons-accent-filled-is-active-highlight-border-color);
 	}
 
-	:host([variant="accent-transparent"]) {
+	:host([appearance="accent-transparent"]) {
 		--_background-color: transparent;
 		--_primary-content-color: var(--semantics-buttons-accent-transparent-content-color);
 		--_secondary-content-color: var(--semantics-buttons-accent-transparent-content-secondary-color);
@@ -147,8 +149,8 @@ export const buttonStyles = css `
 		--_is-active-highlight-border-color: transparent;
 	}
 
-	:host([variant="critical-tinted"]),
-	:host([variant="destructive"]) {
+	:host([appearance="critical-tinted"]),
+	:host([appearance="destructive"]) {
 		--_background-color: var(--semantics-buttons-critical-tinted-background-color);
 		--_primary-content-color: var(--semantics-buttons-critical-tinted-content-color);
 		--_secondary-content-color: var(--semantics-buttons-critical-tinted-content-secondary-color);
@@ -163,7 +165,7 @@ export const buttonStyles = css `
 		--_is-active-highlight-border-color: var(--semantics-buttons-critical-tinted-is-active-highlight-border-color);
 	}
 
-	:host([variant="critical-transparent"]) {
+	:host([appearance="critical-transparent"]) {
 		--_background-color: transparent;
 		--_primary-content-color: var(--semantics-buttons-critical-transparent-content-color);
 		--_secondary-content-color: var(--semantics-buttons-critical-transparent-content-secondary-color);
@@ -184,34 +186,36 @@ export const buttonStyles = css `
 	   here on the host — inside a :root token it would freeze — with the
 	   tokens' white/black contrast flip as fallback. */
 
-	:host([variant="inherit-tinted"]) {
-		--_background-color: var(--semantics-buttons-inherit-tinted-background-color);
+	:host([appearance="inherit-tinted"]),
+	:host([expanded][appearance="inherit-tinted"]) {
+		--_background-color: var(--context-button-background-color, var(--semantics-buttons-inherit-tinted-background-color));
 		--_primary-content-color: var(--semantics-buttons-inherit-tinted-content-color);
 		--_secondary-content-color: var(--semantics-buttons-inherit-tinted-content-secondary-color);
 		--_highlight-border-color: var(--semantics-buttons-inherit-tinted-highlight-border-color);
-		--_is-hovered-background-color: var(--semantics-buttons-inherit-tinted-is-hovered-background-color);
-		--_is-hovered-primary-content-color: var(--semantics-buttons-inherit-tinted-is-hovered-content-color);
-		--_is-hovered-secondary-content-color: var(--semantics-buttons-inherit-tinted-is-hovered-content-secondary-color);
-		--_is-hovered-highlight-border-color: var(--semantics-buttons-inherit-tinted-is-hovered-highlight-border-color);
-		--_is-active-background-color: var(--semantics-buttons-inherit-tinted-is-active-background-color);
-		--_is-active-primary-content-color: var(--semantics-buttons-inherit-tinted-is-active-content-color);
-		--_is-active-secondary-content-color: var(--semantics-buttons-inherit-tinted-is-active-content-secondary-color);
-		--_is-active-highlight-border-color: var(--semantics-buttons-inherit-tinted-is-active-highlight-border-color);
-	}
-
-	:host([variant="inherit-filled"]) {
+		--_is-hovered-background-color: var(--_background-color);
+		--_is-hovered-primary-content-color: var(--_primary-content-color);
+		--_is-hovered-secondary-content-color: var(--_secondary-content-color);
+		--_is-hovered-highlight-border-color: var(--_highlight-border-color);
+		--_is-active-background-color: var(--_background-color);
+		--_is-active-primary-content-color: var(--_primary-content-color);
+		--_is-active-secondary-content-color: var(--_secondary-content-color);
+		--_is-active-highlight-border-color: var(--_highlight-border-color);
+	}
+
+	:host([appearance="inherit-filled"]),
+	:host([expanded][appearance="inherit-filled"]) {
 		--_background-color: var(--semantics-buttons-inherit-filled-background-color);
 		--_primary-content-color: var(--context-parent-background-color, var(--semantics-buttons-inherit-filled-content-color));
 		--_secondary-content-color: var(--semantics-buttons-inherit-filled-content-secondary-color);
 		--_highlight-border-color: var(--semantics-buttons-inherit-filled-highlight-border-color);
-		--_is-hovered-background-color: var(--semantics-buttons-inherit-filled-is-hovered-background-color);
-		--_is-hovered-primary-content-color: var(--semantics-buttons-inherit-filled-is-hovered-content-color);
-		--_is-hovered-secondary-content-color: var(--semantics-buttons-inherit-filled-is-hovered-content-secondary-color);
-		--_is-hovered-highlight-border-color: var(--semantics-buttons-inherit-filled-is-hovered-highlight-border-color);
-		--_is-active-background-color: var(--semantics-buttons-inherit-filled-is-active-background-color);
-		--_is-active-primary-content-color: var(--semantics-buttons-inherit-filled-is-active-content-color);
-		--_is-active-secondary-content-color: var(--semantics-buttons-inherit-filled-is-active-content-secondary-color);
-		--_is-active-highlight-border-color: var(--semantics-buttons-inherit-filled-is-active-highlight-border-color);
+		--_is-hovered-background-color: var(--_background-color);
+		--_is-hovered-primary-content-color: var(--_primary-content-color);
+		--_is-hovered-secondary-content-color: var(--_secondary-content-color);
+		--_is-hovered-highlight-border-color: var(--_highlight-border-color);
+		--_is-active-background-color: var(--_background-color);
+		--_is-active-primary-content-color: var(--_primary-content-color);
+		--_is-active-secondary-content-color: var(--_secondary-content-color);
+		--_is-active-highlight-border-color: var(--_highlight-border-color);
 	}
 
 	/* For inherit-filled the inner button keeps the inherited on-color:
@@ -219,11 +223,11 @@ export const buttonStyles = css `
 	   against it, and would otherwise self-reference the label. The label
 	   color moves to the content layer instead. The higher specificity of
 	   these rules deliberately pins the color through hover/active/expanded. */
-	:host([variant="inherit-filled"]) .button {
+	:host([appearance="inherit-filled"]) .button {
 		color: inherit;
 	}
 
-	:host([variant="inherit-filled"]) .button > * {
+	:host([appearance="inherit-filled"]) .button > * {
 		color: var(--_primary-content-color);
 	}
 
@@ -244,7 +248,7 @@ export const buttonStyles = css `
 		--_is-active-highlight-border-color: var(--semantics-buttons-neutral-tinted-is-expanded-is-active-highlight-border-color);
 	}
 
-	:host([expanded][variant="neutral-base"]) {
+	:host([expanded][appearance="neutral-base"]) {
 		--_background-color: var(--semantics-buttons-neutral-base-is-expanded-background-color);
 		--_primary-content-color: var(--semantics-buttons-neutral-base-is-expanded-content-color);
 		--_secondary-content-color: var(--semantics-buttons-neutral-base-is-expanded-content-secondary-color);
@@ -259,7 +263,7 @@ export const buttonStyles = css `
 		--_is-active-highlight-border-color: var(--semantics-buttons-neutral-base-is-expanded-is-active-highlight-border-color);
 	}
 
-	:host([expanded][variant="neutral-transparent"]) {
+	:host([expanded][appearance="neutral-transparent"]) {
 		--_background-color: transparent;
 		--_primary-content-color: var(--semantics-buttons-neutral-transparent-content-color);
 		--_secondary-content-color: var(--semantics-buttons-neutral-transparent-content-secondary-color);
@@ -274,8 +278,8 @@ export const buttonStyles = css `
 		--_is-active-highlight-border-color: transparent;
 	}
 
-	:host([expanded][variant="accent-filled"]),
-	:host([expanded][variant="primary"]) {
+	:host([expanded][appearance="accent-filled"]),
+	:host([expanded][appearance="primary"]) {
 		--_background-color: var(--semantics-buttons-accent-filled-is-expanded-background-color);
 		--_primary-content-color: var(--semantics-buttons-accent-filled-is-expanded-content-color);
 		--_secondary-content-color: var(--semantics-buttons-accent-filled-is-expanded-content-secondary-color);
@@ -290,7 +294,7 @@ export const buttonStyles = css `
 		--_is-active-highlight-border-color: var(--semantics-buttons-accent-filled-is-expanded-is-active-highlight-border-color);
 	}
 
-	:host([expanded][variant="accent-transparent"]) {
+	:host([expanded][appearance="accent-transparent"]) {
 		--_background-color: transparent;
 		--_primary-content-color: var(--semantics-buttons-accent-transparent-content-color);
 		--_secondary-content-color: var(--semantics-buttons-accent-transparent-content-secondary-color);
@@ -305,8 +309,8 @@ export const buttonStyles = css `
 		--_is-active-highlight-border-color: transparent;
 	}
 
-	:host([expanded][variant="critical-tinted"]),
-	:host([expanded][variant="destructive"]) {
+	:host([expanded][appearance="critical-tinted"]),
+	:host([expanded][appearance="destructive"]) {
 		--_background-color: var(--semantics-buttons-critical-tinted-is-expanded-background-color);
 		--_primary-content-color: var(--semantics-buttons-critical-tinted-is-expanded-content-color);
 		--_secondary-content-color: var(--semantics-buttons-critical-tinted-is-expanded-content-secondary-color);
@@ -321,7 +325,7 @@ export const buttonStyles = css `
 		--_is-active-highlight-border-color: var(--semantics-buttons-critical-tinted-is-expanded-is-active-highlight-border-color);
 	}
 
-	:host([expanded][variant="critical-transparent"]) {
+	:host([expanded][appearance="critical-transparent"]) {
 		--_background-color: transparent;
 		--_primary-content-color: var(--semantics-buttons-critical-transparent-content-color);
 		--_secondary-content-color: var(--semantics-buttons-critical-transparent-content-secondary-color);
@@ -336,40 +340,6 @@ export const buttonStyles = css `
 		--_is-active-highlight-border-color: transparent;
 	}
 
-	/* The on-color variants keep their currentColor-derived content; expanded
-	   only deepens the background. Content is restated (not inherited from the
-	   resting block) because the default [expanded] block has equal
-	   specificity and later source order, so it would otherwise win. */
-	:host([expanded][variant="inherit-tinted"]) {
-		--_background-color: var(--semantics-buttons-inherit-tinted-is-expanded-background-color);
-		--_primary-content-color: var(--semantics-buttons-inherit-tinted-is-expanded-content-color);
-		--_secondary-content-color: var(--semantics-buttons-inherit-tinted-is-expanded-content-secondary-color);
-		--_highlight-border-color: var(--semantics-buttons-inherit-tinted-is-expanded-highlight-border-color);
-		--_is-hovered-background-color: var(--semantics-buttons-inherit-tinted-is-expanded-is-hovered-background-color);
-		--_is-hovered-primary-content-color: var(--semantics-buttons-inherit-tinted-is-expanded-is-hovered-content-color);
-		--_is-hovered-secondary-content-color: var(--semantics-buttons-inherit-tinted-is-expanded-is-hovered-content-secondary-color);
-		--_is-hovered-highlight-border-color: var(--semantics-buttons-inherit-tinted-is-expanded-is-hovered-highlight-border-color);
-		--_is-active-background-color: var(--semantics-buttons-inherit-tinted-is-expanded-is-active-background-color);
-		--_is-active-primary-content-color: var(--semantics-buttons-inherit-tinted-is-expanded-is-active-content-color);
-		--_is-active-secondary-content-color: var(--semantics-buttons-inherit-tinted-is-expanded-is-active-content-secondary-color);
-		--_is-active-highlight-border-color: var(--semantics-buttons-inherit-tinted-is-expanded-is-active-highlight-border-color);
-	}
-
-	:host([expanded][variant="inherit-filled"]) {
-		--_background-color: var(--semantics-buttons-inherit-filled-is-expanded-background-color);
-		--_primary-content-color: var(--context-parent-background-color, var(--semantics-buttons-inherit-filled-is-expanded-content-color));
-		--_secondary-content-color: var(--semantics-buttons-inherit-filled-is-expanded-content-secondary-color);
-		--_highlight-border-color: var(--semantics-buttons-inherit-filled-is-expanded-highlight-border-color);
-		--_is-hovered-background-color: var(--semantics-buttons-inherit-filled-is-expanded-is-hovered-background-color);
-		--_is-hovered-primary-content-color: var(--semantics-buttons-inherit-filled-is-expanded-is-hovered-content-color);
-		--_is-hovered-secondary-content-color: var(--semantics-buttons-inherit-filled-is-expanded-is-hovered-content-secondary-color);
-		--_is-hovered-highlight-border-color: var(--semantics-buttons-inherit-filled-is-expanded-is-hovered-highlight-border-color);
-		--_is-active-background-color: var(--semantics-buttons-inherit-filled-is-expanded-is-active-background-color);
-		--_is-active-primary-content-color: var(--semantics-buttons-inherit-filled-is-expanded-is-active-content-color);
-		--_is-active-secondary-content-color: var(--semantics-buttons-inherit-filled-is-expanded-is-active-content-secondary-color);
-		--_is-active-highlight-border-color: var(--semantics-buttons-inherit-filled-is-expanded-is-active-highlight-border-color);
-	}
-
 	:host([width="full"]) {
 		display: block;
 		width: 100%;

package/dist/components/actions/button/button.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.styles.js","sourceRoot":"","sources":["../../../../src/components/actions/button/button.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAC;AAE7E,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAgC3B,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAklBrB,CAAC"}
+{"version":3,"file":"button.styles.js","sourceRoot":"","sources":["../../../../src/components/actions/button/button.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,yCAAyC,CAAC;AAE7E,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAkC3B,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkjBrB,CAAC"}

package/dist/components/actions/button/button.template.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.template.d.ts","sourceRoot":"","sources":["../../../../src/components/actions/button/button.template.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAG9C,UAAU,eAAe;IACxB,WAAW,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;CACrC;AA+BD,wBAAgB,QAAQ,CAAC,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,eAAe,wCAiHlE"}
+{"version":3,"file":"button.template.d.ts","sourceRoot":"","sources":["../../../../src/components/actions/button/button.template.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAG9C,UAAU,eAAe;IACxB,WAAW,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;CACrC;AA+BD,wBAAgB,QAAQ,CAAC,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,eAAe,wCAkHlE"}

package/dist/components/actions/button/button.template.js

@@ -8,7 +8,7 @@ function renderContent(component) {
 		<span class="button__content">
 			${component.startIcon ? html `
 				<span class="button__start-icon">
-					<nldd-icon name=${component.startIcon}></nldd-icon>
+					<nldd-icon icon=${component.startIcon}></nldd-icon>
 				</span>
 			` : html `<slot name="start-icon"></slot>`}
 			<span class="button__text-area">
@@ -17,13 +17,13 @@ function renderContent(component) {
 			</span>
 			${component.endIcon ? html `
 				<span class="button__end-icon">
-					<nldd-icon name=${component.endIcon}></nldd-icon>
+					<nldd-icon icon=${component.endIcon}></nldd-icon>
 				</span>
 			` : html `<slot name="end-icon"></slot>`}
 		</span>
 		${component.expandable ? html `
 			<nldd-icon class="button__disclosure-icon"
-				name="chevron-down-small"
+				icon="chevron-down-small"
 			></nldd-icon>
 		` : nothing}
 	`;
@@ -75,6 +75,7 @@ export function template(helpers) {
 				<nldd-activity-indicator
 					timing="instant"
 					size=${this.size === 'xs' ? '16' : this.size === 'sm' ? '20' : this.size === 'lg' ? '28' : '24'}
+					text=${this.loadingText || nothing}
 				></nldd-activity-indicator>
 			</div>
 		`

package/dist/components/actions/button/button.template.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.template.js","sourceRoot":"","sources":["../../../../src/components/actions/button/button.template.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"button.template.js","sourceRoot":"","sources":["../../../../src/components/actions/button/button.template.ts"],"names":[],"mappings":"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"}