@fluid-topics/ft-dialog 0.3.71 → 1.0.0-alpha.1

package/build/ft-dialog.css.d.ts

@@ -13,4 +13,3 @@ export declare const FtDialogCssVariables: {
     elevation24: import("@fluid-topics/ft-wc-utils").FtCssVariable;
 };
 export declare const styles: import("lit").CSSResult;
-//# sourceMappingURL=ft-dialog.css.d.ts.map

package/build/ft-dialog.css.js

@@ -116,4 +116,3 @@ export const styles = css `
     }
 
 `;
-//# sourceMappingURL=ft-dialog.css.js.map

package/build/ft-dialog.d.ts

@@ -1,5 +1,6 @@
 import { PropertyValues } from "lit";
 import { ElementDefinitionsMap, FtLitElement } from "@fluid-topics/ft-wc-utils";
+import { FtIconVariants } from "@fluid-topics/ft-icon";
 import { FtDialogProperties } from "./ft-dialog.properties";
 export declare class FtDialog extends FtLitElement implements FtDialogProperties {
     static elementDefinitions: ElementDefinitionsMap;
@@ -10,6 +11,7 @@ export declare class FtDialog extends FtLitElement implements FtDialogProperties
     beforeClose: () => boolean;
     heading: string;
     icon: string;
+    iconVariant?: FtIconVariants;
     buttons: Array<HTMLElement>;
     static styles: import("lit").CSSResult;
     protected render(): import("lit-html").TemplateResult<1> | null;
@@ -19,4 +21,3 @@ export declare class FtDialog extends FtLitElement implements FtDialogProperties
     private watchEscapeKey;
     private onClickOutside;
 }
-//# sourceMappingURL=ft-dialog.d.ts.map

package/build/ft-dialog.js

@@ -11,7 +11,7 @@ import { FtTypography } from "@fluid-topics/ft-typography";
 import { FtIcon } from "@fluid-topics/ft-icon";
 import { FtButton } from "@fluid-topics/ft-button";
 import { styles } from "./ft-dialog.css";
-export class FtDialog extends FtLitElement {
+class FtDialog extends FtLitElement {
     constructor() {
         super(...arguments);
         this.opened = false;
@@ -38,7 +38,7 @@ export class FtDialog extends FtLitElement {
                     ${this.heading ? html `
                         <div class="ft-dialog-heading">
                             ${this.icon ? html `
-                                        <ft-icon variant="material">${this.icon}</ft-icon>
+                                        <ft-icon .variant=${this.iconVariant} value="${this.icon}"></ft-icon>
                                     ` : undefined}
                             <ft-typography element="span" variant="title">${this.heading}</ft-typography>
                             ${this.closable ? html `
@@ -47,7 +47,9 @@ export class FtDialog extends FtLitElement {
                         </div>
                     ` : null}
                     <div class="ft-dialog-content">
-                        <slot></slot>
+                        <ft-typography variant="body1">
+                            <slot></slot>
+                        </ft-typography>
                     </div>
                     <slot name="buttons"
                           class="ft-dialog-buttons ${this.buttons.length > 0 ? "" : "ft-dialog-no-buttons"}"
@@ -112,12 +114,15 @@ __decorate([
     property({ type: () => Boolean })
 ], FtDialog.prototype, "beforeClose", void 0);
 __decorate([
-    property({ type: String })
+    property()
 ], FtDialog.prototype, "heading", void 0);
 __decorate([
-    property({ type: String })
+    property()
 ], FtDialog.prototype, "icon", void 0);
+__decorate([
+    property()
+], FtDialog.prototype, "iconVariant", void 0);
 __decorate([
     queryAssignedElements({ slot: "buttons" })
 ], FtDialog.prototype, "buttons", void 0);
-//# sourceMappingURL=ft-dialog.js.map
+export { FtDialog };