@fluid-topics/ft-dialog 0.3.1 → 0.3.4

package/build/ft-dialog.d.ts

@@ -28,6 +28,7 @@ export declare class FtDialog extends FtLitElement implements FtDialogProperties
     closeOnEsc: boolean;
     closeOnClickOutside: boolean;
     closable: boolean;
+    beforeClose: () => boolean;
     heading: string;
     icon: string;
     static get styles(): import("lit").CSSResult;

package/build/ft-dialog.js

@@ -31,6 +31,7 @@ export class FtDialog extends FtLitElement {
         this.closeOnEsc = false;
         this.closeOnClickOutside = false;
         this.closable = false;
+        this.beforeClose = () => true;
         this.heading = "";
         this.icon = "";
     }
@@ -94,6 +95,10 @@ export class FtDialog extends FtLitElement {
             }
 
             .ft-dialog-heading {
+                text-overflow: ellipsis;
+                overflow: hidden;
+                white-space: nowrap;
+                
                 display: flex;
                 align-items: center;
                 margin-bottom: 20px;
@@ -167,7 +172,9 @@ export class FtDialog extends FtLitElement {
         document.removeEventListener("keydown", this.watchEscapeKey.bind(this));
     }
     close() {
-        this.opened = false;
+        if (this.beforeClose()) {
+            this.opened = false;
+        }
     }
     open() {
         this.opened = true;
@@ -206,6 +213,9 @@ __decorate([
 __decorate([
     property({ type: Boolean })
 ], FtDialog.prototype, "closable", void 0);
+__decorate([
+    property({ type: () => Boolean })
+], FtDialog.prototype, "beforeClose", void 0);
 __decorate([
     property({ type: String })
 ], FtDialog.prototype, "heading", void 0);

package/build/ft-dialog.light.js

@@ -538,7 +538,7 @@ const D=Symbol.for(""),U=t=>{if((null==t?void 0:t.r)===D)return null==t?void 0:t
             </ft-tooltip>
         `}resolveIcon(){return this.loading?e.html`
                 <ft-loader></ft-loader> `:this.icon?e.html`
-                        <ft-icon variant="material">${this.icon}</ft-icon> `:e.nothing}focus(){var t;null===(t=this.button)||void 0===t||t.focus()}getLabel(){return this.label||this.textContent}get textContent(){return this.unslotText(this.slottedContent).trim()}unslotText(t){return t instanceof HTMLSlotElement?t.assignedNodes().map((t=>this.unslotText(t))).join(""):(null==t?void 0:t.textContent)||""}hasTextContent(){return this.textContent.length>0}onSlotchange(){this.requestUpdate()}isDisabled(){return this.disabled||this.loading}}Zi.elementDefinitions={"ft-ripple":ki,"ft-tooltip":Ni,"ft-typography":ai,"ft-icon":ci,"ft-loader":Ii},Ti([o.property({type:Boolean})],Zi.prototype,"primary",void 0),Ti([o.property({type:Boolean})],Zi.prototype,"outlined",void 0),Ti([o.property({type:Boolean})],Zi.prototype,"disabled",void 0),Ti([o.property({type:Boolean})],Zi.prototype,"dense",void 0),Ti([o.property({type:Boolean})],Zi.prototype,"round",void 0),Ti([o.property({type:String})],Zi.prototype,"label",void 0),Ti([o.property({type:String})],Zi.prototype,"icon",void 0),Ti([o.property({type:Boolean})],Zi.prototype,"trailingIcon",void 0),Ti([o.property({type:Boolean})],Zi.prototype,"loading",void 0),Ti([o.property({type:String})],Zi.prototype,"tooltipPosition",void 0),Ti([o.query(".ft-button")],Zi.prototype,"button",void 0),Ti([o.query(".ft-button--label slot")],Zi.prototype,"slottedContent",void 0),i.customElement("ft-button")(Zi);var Di=function(t,i,e,o){for(var n,s=arguments.length,r=s<3?i:null===o?o=Object.getOwnPropertyDescriptor(i,e):o,a=t.length-1;a>=0;a--)(n=t[a])&&(r=(s<3?n(r):s>3?n(i,e,r):n(i,e))||r);return s>3&&r&&Object.defineProperty(i,e,r),r};const Ui={zIndex:i.FtCssVariableFactory.create("--ft-dialog-z-index","NUMBER","2"),overlayBackgroundColor:i.FtCssVariableFactory.create("--ft-dialog-overlay-background-color","COLOR","rgba(0, 0, 0, 0.3)"),height:i.FtCssVariableFactory.create("--ft-dialog-height","SIZE","unset"),width:i.FtCssVariableFactory.create("--ft-dialog-width","SIZE","unset"),minWidth:i.FtCssVariableFactory.create("--ft-dialog-min-width","SIZE","unset"),paddingTop:i.FtCssVariableFactory.create("--ft-dialog-padding-top","SIZE","20px"),paddingSide:i.FtCssVariableFactory.create("--ft-dialog-padding-side","SIZE","16px"),paddingButtons:i.FtCssVariableFactory.create("--ft-dialog-padding-buttons","SIZE","20px"),colorSurface:i.FtCssVariableFactory.external(i.designSystemVariables.colorSurface,"Design system"),headingColor:i.FtCssVariableFactory.external(i.designSystemVariables.colorOnSurfaceMedium,"Design system"),borderRadiusS:i.FtCssVariableFactory.external(i.designSystemVariables.borderRadiusS,"Design system"),elevation24:i.FtCssVariableFactory.external(i.designSystemVariables.elevation24,"Design system")};class Wi extends i.FtLitElement{constructor(){super(...arguments),this.opened=!1,this.closeOnEsc=!1,this.closeOnClickOutside=!1,this.closable=!1,this.heading="",this.icon=""}static get styles(){return e.css`
+                        <ft-icon variant="material">${this.icon}</ft-icon> `:e.nothing}focus(){var t;null===(t=this.button)||void 0===t||t.focus()}getLabel(){return this.label||this.textContent}get textContent(){return this.unslotText(this.slottedContent).trim()}unslotText(t){return t instanceof HTMLSlotElement?t.assignedNodes().map((t=>this.unslotText(t))).join(""):(null==t?void 0:t.textContent)||""}hasTextContent(){return this.textContent.length>0}onSlotchange(){this.requestUpdate()}isDisabled(){return this.disabled||this.loading}}Zi.elementDefinitions={"ft-ripple":ki,"ft-tooltip":Ni,"ft-typography":ai,"ft-icon":ci,"ft-loader":Ii},Ti([o.property({type:Boolean})],Zi.prototype,"primary",void 0),Ti([o.property({type:Boolean})],Zi.prototype,"outlined",void 0),Ti([o.property({type:Boolean})],Zi.prototype,"disabled",void 0),Ti([o.property({type:Boolean})],Zi.prototype,"dense",void 0),Ti([o.property({type:Boolean})],Zi.prototype,"round",void 0),Ti([o.property({type:String})],Zi.prototype,"label",void 0),Ti([o.property({type:String})],Zi.prototype,"icon",void 0),Ti([o.property({type:Boolean})],Zi.prototype,"trailingIcon",void 0),Ti([o.property({type:Boolean})],Zi.prototype,"loading",void 0),Ti([o.property({type:String})],Zi.prototype,"tooltipPosition",void 0),Ti([o.query(".ft-button")],Zi.prototype,"button",void 0),Ti([o.query(".ft-button--label slot")],Zi.prototype,"slottedContent",void 0),i.customElement("ft-button")(Zi);var Di=function(t,i,e,o){for(var n,s=arguments.length,r=s<3?i:null===o?o=Object.getOwnPropertyDescriptor(i,e):o,a=t.length-1;a>=0;a--)(n=t[a])&&(r=(s<3?n(r):s>3?n(i,e,r):n(i,e))||r);return s>3&&r&&Object.defineProperty(i,e,r),r};const Ui={zIndex:i.FtCssVariableFactory.create("--ft-dialog-z-index","NUMBER","2"),overlayBackgroundColor:i.FtCssVariableFactory.create("--ft-dialog-overlay-background-color","COLOR","rgba(0, 0, 0, 0.3)"),height:i.FtCssVariableFactory.create("--ft-dialog-height","SIZE","unset"),width:i.FtCssVariableFactory.create("--ft-dialog-width","SIZE","unset"),minWidth:i.FtCssVariableFactory.create("--ft-dialog-min-width","SIZE","unset"),paddingTop:i.FtCssVariableFactory.create("--ft-dialog-padding-top","SIZE","20px"),paddingSide:i.FtCssVariableFactory.create("--ft-dialog-padding-side","SIZE","16px"),paddingButtons:i.FtCssVariableFactory.create("--ft-dialog-padding-buttons","SIZE","20px"),colorSurface:i.FtCssVariableFactory.external(i.designSystemVariables.colorSurface,"Design system"),headingColor:i.FtCssVariableFactory.external(i.designSystemVariables.colorOnSurfaceMedium,"Design system"),borderRadiusS:i.FtCssVariableFactory.external(i.designSystemVariables.borderRadiusS,"Design system"),elevation24:i.FtCssVariableFactory.external(i.designSystemVariables.elevation24,"Design system")};class Wi extends i.FtLitElement{constructor(){super(...arguments),this.opened=!1,this.closeOnEsc=!1,this.closeOnClickOutside=!1,this.closable=!1,this.beforeClose=()=>!0,this.heading="",this.icon=""}static get styles(){return e.css`
             .ft-dialog {
                 position: fixed;
                 top: 0;
@@ -596,6 +596,10 @@ const D=Symbol.for(""),U=t=>{if((null==t?void 0:t.r)===D)return null==t?void 0:t
             }
 
             .ft-dialog-heading {
+                text-overflow: ellipsis;
+                overflow: hidden;
+                white-space: nowrap;
+                
                 display: flex;
                 align-items: center;
                 margin-bottom: 20px;
@@ -646,4 +650,4 @@ const D=Symbol.for(""),U=t=>{if((null==t?void 0:t.r)===D)return null==t?void 0:t
                     </div>
                 </div>
             </div>
-        `:null}updated(t){if(t.has("opened")){const t=new CustomEvent("opened-changed",{detail:{opened:this.opened}});this.dispatchEvent(t)}}connectedCallback(){super.connectedCallback(),document.addEventListener("keydown",this.watchEscapeKey.bind(this))}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("keydown",this.watchEscapeKey.bind(this))}close(){this.opened=!1}open(){this.opened=!0}watchEscapeKey(t){"Escape"===t.key&&this.closeOnEsc&&this.close()}watchClickOutside(){this.closeOnClickOutside&&this.close()}}Wi.elementDefinitions={"ft-typography":ai,"ft-icon":ci,"ft-button":Zi},Di([o.property({type:Boolean,hasChanged:(t,i)=>!1===i&&!0===t||!0===i&&!1===t})],Wi.prototype,"opened",void 0),Di([o.property({type:Boolean})],Wi.prototype,"closeOnEsc",void 0),Di([o.property({type:Boolean})],Wi.prototype,"closeOnClickOutside",void 0),Di([o.property({type:Boolean})],Wi.prototype,"closable",void 0),Di([o.property({type:String})],Wi.prototype,"heading",void 0),Di([o.property({type:String})],Wi.prototype,"icon",void 0),i.customElement("ft-dialog")(Wi),t.FtDialog=Wi,t.FtDialogCssVariables=Ui,t.default=Wi,Object.defineProperty(t,"t",{value:!0})}({},ftGlobals.wcUtils,ftGlobals.lit,ftGlobals.litDecorators,ftGlobals.litUnsafeHTML,ftGlobals.litClassMap);
+        `:null}updated(t){if(t.has("opened")){const t=new CustomEvent("opened-changed",{detail:{opened:this.opened}});this.dispatchEvent(t)}}connectedCallback(){super.connectedCallback(),document.addEventListener("keydown",this.watchEscapeKey.bind(this))}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("keydown",this.watchEscapeKey.bind(this))}close(){this.beforeClose()&&(this.opened=!1)}open(){this.opened=!0}watchEscapeKey(t){"Escape"===t.key&&this.closeOnEsc&&this.close()}watchClickOutside(){this.closeOnClickOutside&&this.close()}}Wi.elementDefinitions={"ft-typography":ai,"ft-icon":ci,"ft-button":Zi},Di([o.property({type:Boolean,hasChanged:(t,i)=>!1===i&&!0===t||!0===i&&!1===t})],Wi.prototype,"opened",void 0),Di([o.property({type:Boolean})],Wi.prototype,"closeOnEsc",void 0),Di([o.property({type:Boolean})],Wi.prototype,"closeOnClickOutside",void 0),Di([o.property({type:Boolean})],Wi.prototype,"closable",void 0),Di([o.property({type:()=>Boolean})],Wi.prototype,"beforeClose",void 0),Di([o.property({type:String})],Wi.prototype,"heading",void 0),Di([o.property({type:String})],Wi.prototype,"icon",void 0),i.customElement("ft-dialog")(Wi),t.FtDialog=Wi,t.FtDialogCssVariables=Ui,t.default=Wi,Object.defineProperty(t,"t",{value:!0})}({},ftGlobals.wcUtils,ftGlobals.lit,ftGlobals.litDecorators,ftGlobals.litUnsafeHTML,ftGlobals.litClassMap);

package/build/ft-dialog.min.js

@@ -637,7 +637,7 @@ function(t,e,i){let o,n=t;return"object"==typeof t?(n=t.slot,o=t):o={flatten:e},
             </ft-tooltip>
         `}resolveIcon(){return this.loading?W`
                 <ft-loader></ft-loader> `:this.icon?W`
-                        <ft-icon variant="material">${this.icon}</ft-icon> `:K}focus(){var t;null===(t=this.button)||void 0===t||t.focus()}getLabel(){return this.label||this.textContent}get textContent(){return this.unslotText(this.slottedContent).trim()}unslotText(t){return t instanceof HTMLSlotElement?t.assignedNodes().map((t=>this.unslotText(t))).join(""):(null==t?void 0:t.textContent)||""}hasTextContent(){return this.textContent.length>0}onSlotchange(){this.requestUpdate()}isDisabled(){return this.disabled||this.loading}}Ci.elementDefinitions={"ft-ripple":hi,"ft-tooltip":vi,"ft-typography":_e,"ft-icon":Qe,"ft-loader":bi},mi([o({type:Boolean})],Ci.prototype,"primary",void 0),mi([o({type:Boolean})],Ci.prototype,"outlined",void 0),mi([o({type:Boolean})],Ci.prototype,"disabled",void 0),mi([o({type:Boolean})],Ci.prototype,"dense",void 0),mi([o({type:Boolean})],Ci.prototype,"round",void 0),mi([o({type:String})],Ci.prototype,"label",void 0),mi([o({type:String})],Ci.prototype,"icon",void 0),mi([o({type:Boolean})],Ci.prototype,"trailingIcon",void 0),mi([o({type:Boolean})],Ci.prototype,"loading",void 0),mi([o({type:String})],Ci.prototype,"tooltipPosition",void 0),mi([r(".ft-button")],Ci.prototype,"button",void 0),mi([r(".ft-button--label slot")],Ci.prototype,"slottedContent",void 0),p("ft-button")(Ci);var Ni=function(t,e,i,o){for(var n,s=arguments.length,r=s<3?e:null===o?o=Object.getOwnPropertyDescriptor(e,i):o,a=t.length-1;a>=0;a--)(n=t[a])&&(r=(s<3?n(r):s>3?n(e,i,r):n(e,i))||r);return s>3&&r&&Object.defineProperty(e,i,r),r};const Ei={zIndex:ht.create("--ft-dialog-z-index","NUMBER","2"),overlayBackgroundColor:ht.create("--ft-dialog-overlay-background-color","COLOR","rgba(0, 0, 0, 0.3)"),height:ht.create("--ft-dialog-height","SIZE","unset"),width:ht.create("--ft-dialog-width","SIZE","unset"),minWidth:ht.create("--ft-dialog-min-width","SIZE","unset"),paddingTop:ht.create("--ft-dialog-padding-top","SIZE","20px"),paddingSide:ht.create("--ft-dialog-padding-side","SIZE","16px"),paddingButtons:ht.create("--ft-dialog-padding-buttons","SIZE","20px"),colorSurface:ht.external(dt.colorSurface,"Design system"),headingColor:ht.external(dt.colorOnSurfaceMedium,"Design system"),borderRadiusS:ht.external(dt.borderRadiusS,"Design system"),elevation24:ht.external(dt.elevation24,"Design system")};class Ri extends ut{constructor(){super(...arguments),this.opened=!1,this.closeOnEsc=!1,this.closeOnClickOutside=!1,this.closable=!1,this.heading="",this.icon=""}static get styles(){return y`
+                        <ft-icon variant="material">${this.icon}</ft-icon> `:K}focus(){var t;null===(t=this.button)||void 0===t||t.focus()}getLabel(){return this.label||this.textContent}get textContent(){return this.unslotText(this.slottedContent).trim()}unslotText(t){return t instanceof HTMLSlotElement?t.assignedNodes().map((t=>this.unslotText(t))).join(""):(null==t?void 0:t.textContent)||""}hasTextContent(){return this.textContent.length>0}onSlotchange(){this.requestUpdate()}isDisabled(){return this.disabled||this.loading}}Ci.elementDefinitions={"ft-ripple":hi,"ft-tooltip":vi,"ft-typography":_e,"ft-icon":Qe,"ft-loader":bi},mi([o({type:Boolean})],Ci.prototype,"primary",void 0),mi([o({type:Boolean})],Ci.prototype,"outlined",void 0),mi([o({type:Boolean})],Ci.prototype,"disabled",void 0),mi([o({type:Boolean})],Ci.prototype,"dense",void 0),mi([o({type:Boolean})],Ci.prototype,"round",void 0),mi([o({type:String})],Ci.prototype,"label",void 0),mi([o({type:String})],Ci.prototype,"icon",void 0),mi([o({type:Boolean})],Ci.prototype,"trailingIcon",void 0),mi([o({type:Boolean})],Ci.prototype,"loading",void 0),mi([o({type:String})],Ci.prototype,"tooltipPosition",void 0),mi([r(".ft-button")],Ci.prototype,"button",void 0),mi([r(".ft-button--label slot")],Ci.prototype,"slottedContent",void 0),p("ft-button")(Ci);var Ni=function(t,e,i,o){for(var n,s=arguments.length,r=s<3?e:null===o?o=Object.getOwnPropertyDescriptor(e,i):o,a=t.length-1;a>=0;a--)(n=t[a])&&(r=(s<3?n(r):s>3?n(e,i,r):n(e,i))||r);return s>3&&r&&Object.defineProperty(e,i,r),r};const Ei={zIndex:ht.create("--ft-dialog-z-index","NUMBER","2"),overlayBackgroundColor:ht.create("--ft-dialog-overlay-background-color","COLOR","rgba(0, 0, 0, 0.3)"),height:ht.create("--ft-dialog-height","SIZE","unset"),width:ht.create("--ft-dialog-width","SIZE","unset"),minWidth:ht.create("--ft-dialog-min-width","SIZE","unset"),paddingTop:ht.create("--ft-dialog-padding-top","SIZE","20px"),paddingSide:ht.create("--ft-dialog-padding-side","SIZE","16px"),paddingButtons:ht.create("--ft-dialog-padding-buttons","SIZE","20px"),colorSurface:ht.external(dt.colorSurface,"Design system"),headingColor:ht.external(dt.colorOnSurfaceMedium,"Design system"),borderRadiusS:ht.external(dt.borderRadiusS,"Design system"),elevation24:ht.external(dt.elevation24,"Design system")};class Ri extends ut{constructor(){super(...arguments),this.opened=!1,this.closeOnEsc=!1,this.closeOnClickOutside=!1,this.closable=!1,this.beforeClose=()=>!0,this.heading="",this.icon=""}static get styles(){return y`
             .ft-dialog {
                 position: fixed;
                 top: 0;
@@ -695,6 +695,10 @@ function(t,e,i){let o,n=t;return"object"==typeof t?(n=t.slot,o=t):o={flatten:e},
             }
 
             .ft-dialog-heading {
+                text-overflow: ellipsis;
+                overflow: hidden;
+                white-space: nowrap;
+                
                 display: flex;
                 align-items: center;
                 margin-bottom: 20px;
@@ -745,4 +749,4 @@ function(t,e,i){let o,n=t;return"object"==typeof t?(n=t.slot,o=t):o={flatten:e},
                     </div>
                 </div>
             </div>
-        `:null}updated(t){if(t.has("opened")){const t=new CustomEvent("opened-changed",{detail:{opened:this.opened}});this.dispatchEvent(t)}}connectedCallback(){super.connectedCallback(),document.addEventListener("keydown",this.watchEscapeKey.bind(this))}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("keydown",this.watchEscapeKey.bind(this))}close(){this.opened=!1}open(){this.opened=!0}watchEscapeKey(t){"Escape"===t.key&&this.closeOnEsc&&this.close()}watchClickOutside(){this.closeOnClickOutside&&this.close()}}Ri.elementDefinitions={"ft-typography":_e,"ft-icon":Qe,"ft-button":Ci},Ni([o({type:Boolean,hasChanged:(t,e)=>!1===e&&!0===t||!0===e&&!1===t})],Ri.prototype,"opened",void 0),Ni([o({type:Boolean})],Ri.prototype,"closeOnEsc",void 0),Ni([o({type:Boolean})],Ri.prototype,"closeOnClickOutside",void 0),Ni([o({type:Boolean})],Ri.prototype,"closable",void 0),Ni([o({type:String})],Ri.prototype,"heading",void 0),Ni([o({type:String})],Ri.prototype,"icon",void 0),p("ft-dialog")(Ri),t.FtDialog=Ri,t.FtDialogCssVariables=Ei,t.default=Ri,Object.defineProperty(t,"i",{value:!0})}({});
+        `:null}updated(t){if(t.has("opened")){const t=new CustomEvent("opened-changed",{detail:{opened:this.opened}});this.dispatchEvent(t)}}connectedCallback(){super.connectedCallback(),document.addEventListener("keydown",this.watchEscapeKey.bind(this))}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("keydown",this.watchEscapeKey.bind(this))}close(){this.beforeClose()&&(this.opened=!1)}open(){this.opened=!0}watchEscapeKey(t){"Escape"===t.key&&this.closeOnEsc&&this.close()}watchClickOutside(){this.closeOnClickOutside&&this.close()}}Ri.elementDefinitions={"ft-typography":_e,"ft-icon":Qe,"ft-button":Ci},Ni([o({type:Boolean,hasChanged:(t,e)=>!1===e&&!0===t||!0===e&&!1===t})],Ri.prototype,"opened",void 0),Ni([o({type:Boolean})],Ri.prototype,"closeOnEsc",void 0),Ni([o({type:Boolean})],Ri.prototype,"closeOnClickOutside",void 0),Ni([o({type:Boolean})],Ri.prototype,"closable",void 0),Ni([o({type:()=>Boolean})],Ri.prototype,"beforeClose",void 0),Ni([o({type:String})],Ri.prototype,"heading",void 0),Ni([o({type:String})],Ri.prototype,"icon",void 0),p("ft-dialog")(Ri),t.FtDialog=Ri,t.FtDialogCssVariables=Ei,t.default=Ri,Object.defineProperty(t,"i",{value:!0})}({});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluid-topics/ft-dialog",
-  "version": "0.3.1",
+  "version": "0.3.4",
   "description": "A simple dialog component",
   "keywords": [
     "Lit"
@@ -19,11 +19,11 @@
     "url": "ssh://git@scm.mrs.antidot.net:2222/fluidtopics/ft-web-components.git"
   },
   "dependencies": {
-    "@fluid-topics/ft-button": "0.3.1",
-    "@fluid-topics/ft-icon": "0.3.1",
-    "@fluid-topics/ft-typography": "0.3.1",
-    "@fluid-topics/ft-wc-utils": "0.3.1",
+    "@fluid-topics/ft-button": "0.3.4",
+    "@fluid-topics/ft-icon": "0.3.4",
+    "@fluid-topics/ft-typography": "0.3.4",
+    "@fluid-topics/ft-wc-utils": "0.3.4",
     "lit": "2.2.8"
   },
-  "gitHead": "59991498f66c54210024c0fc6702955901f94952"
+  "gitHead": "3179cf74226f9447314e09a6b16a816871c0e15f"
 }