@fluid-topics/ft-confirm-button 1.2.52 → 1.2.53

package/build/ftds-confirm-button.d.ts

@@ -2,7 +2,7 @@ import { ElementDefinitionsMap, FtLitElement } from "@fluid-topics/ft-wc-utils";
 import { FtIcons } from "@fluid-topics/ft-icon";
 import { FtdsModalConfirm } from "@fluid-topics/ft-modal";
 import { FtdsConfirmButtonProperties } from "./ftds-confirm-button.properties";
-import { DesignSystemSize, DesignSystemFamily } from "@fluid-topics/design-system-variables";
+import { DesignSystemFamily, DesignSystemSize } from "@fluid-topics/design-system-variables";
 import { Position } from "@fluid-topics/ft-tooltip";
 export declare class ConfirmEvent extends CustomEvent<void> {
     constructor();
@@ -28,6 +28,9 @@ export declare class FtdsConfirmButton extends FtLitElement implements FtdsConfi
     loading: boolean;
     disabled: boolean;
     modal: FtdsModalConfirm;
+    slotElement: HTMLSlotElement;
+    private hasSlottedContent;
     protected render(): import("lit-html").TemplateResult<1>;
     private askConfirmation;
+    private onSlotchange;
 }

package/build/ftds-confirm-button.js

@@ -10,7 +10,7 @@ import { css, html } from "lit";
 import { FtdsButton } from "@fluid-topics/ft-button";
 import { FtIcons } from "@fluid-topics/ft-icon";
 import { FtdsModalConfirm } from "@fluid-topics/ft-modal";
-import { DesignSystemSize, DesignSystemFamily } from "@fluid-topics/design-system-variables";
+import { DesignSystemFamily, DesignSystemSize } from "@fluid-topics/design-system-variables";
 export class ConfirmEvent extends CustomEvent {
     constructor() {
         super("confirm");
@@ -35,6 +35,7 @@ let FtdsConfirmButton = class FtdsConfirmButton extends FtLitElement {
         this.cancelIcon = FtIcons.CLOSE;
         this.loading = false;
         this.disabled = false;
+        this.hasSlottedContent = false;
     }
     render() {
         return html `
@@ -49,7 +50,8 @@ let FtdsConfirmButton = class FtdsConfirmButton extends FtLitElement {
                          size=${this.buttonSize}
                          family=${this.buttonFamily}
                          @click=${() => this.askConfirmation()}>
-                <slot>${this.buttonText}</slot>
+                <slot @slotchange=${this.onSlotchange}></slot>
+                ${this.hasSlottedContent ? html `` : html `${this.buttonText}`}
             </ftds-button>
             <ftds-modal-confirm heading=${this.heading}
                                 text=${this.text}
@@ -66,6 +68,10 @@ let FtdsConfirmButton = class FtdsConfirmButton extends FtLitElement {
             this.dispatchEvent(new ConfirmEvent());
         }
     }
+    onSlotchange() {
+        this.hasSlottedContent = this.slotElement.assignedNodes().length > 0;
+        this.requestUpdate();
+    }
 };
 FtdsConfirmButton.elementDefinitions = {
     "ftds-button": FtdsButton,
@@ -126,6 +132,9 @@ __decorate([
 __decorate([
     query("ftds-modal-confirm")
 ], FtdsConfirmButton.prototype, "modal", void 0);
+__decorate([
+    query("slot")
+], FtdsConfirmButton.prototype, "slotElement", void 0);
 FtdsConfirmButton = __decorate([
     customElement("ftds-confirm-button")
 ], FtdsConfirmButton);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluid-topics/ft-confirm-button",
-  "version": "1.2.52",
+  "version": "1.2.53",
   "description": "A two step confirmation button",
   "keywords": [
     "Lit"
@@ -19,11 +19,11 @@
     "url": "ssh://git@scm.mrs.antidot.net:2222/fluidtopics/ft-web-components.git"
   },
   "dependencies": {
-    "@fluid-topics/ft-wc-utils": "1.2.52",
+    "@fluid-topics/ft-wc-utils": "1.2.53",
     "lit": "3.1.0"
   },
   "devDependencies": {
-    "@fluid-topics/ft-wc-test-utils": "1.2.52"
+    "@fluid-topics/ft-wc-test-utils": "1.2.53"
   },
-  "gitHead": "5bdea3806bc9a17448a0533c5c3ecfee0cfa8bac"
+  "gitHead": "bd51f81f7882978f24a88c30c24427c56f2faa86"
 }