@vandeurenglenn/lite-elements 0.3.55 → 0.3.57

package/exports/prompt/prompt.d.ts

@@ -0,0 +1,9 @@
+import { LiteElement } from '@vandeurenglenn/lite';
+export declare class CustomPrompt extends LiteElement {
+    accessor promptTitle: string;
+    constructor(promptTitle: string);
+    cancel: () => boolean;
+    ok: () => boolean;
+    static styles: import("lit").CSSResult[];
+    render(): import("lit-html").TemplateResult<1>;
+}

package/exports/prompt.js

@@ -0,0 +1,68 @@
+import { _ as __esDecorate, a as __runInitializers } from './tslib.es6-Cg9lAhfj.js';
+import { property, css, html, LiteElement } from '@vandeurenglenn/lite';
+
+// import './../dialog/dialog'
+globalThis.customPrompt = (promptTitle) => {
+    const dialog = document.createElement('custom-prompt');
+    dialog.promptTitle = promptTitle;
+    document.body.appendChild(dialog);
+    return new Promise((resolve) => {
+        dialog.addEventListener('close', ({ detail }) => {
+            dialog.remove();
+            resolve(detail);
+        });
+    });
+};
+let CustomPrompt = (() => {
+    let _classSuper = LiteElement;
+    let _promptTitle_decorators;
+    let _promptTitle_initializers = [];
+    let _promptTitle_extraInitializers = [];
+    return class CustomPrompt extends _classSuper {
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            _promptTitle_decorators = [property({ type: String })];
+            __esDecorate(this, null, _promptTitle_decorators, { kind: "accessor", name: "promptTitle", static: false, private: false, access: { has: obj => "promptTitle" in obj, get: obj => obj.promptTitle, set: (obj, value) => { obj.promptTitle = value; } }, metadata: _metadata }, _promptTitle_initializers, _promptTitle_extraInitializers);
+            if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+        }
+        #promptTitle_accessor_storage = __runInitializers(this, _promptTitle_initializers, 'Prompt Title');
+        get promptTitle() { return this.#promptTitle_accessor_storage; }
+        set promptTitle(value) { this.#promptTitle_accessor_storage = value; }
+        constructor(promptTitle) {
+            super();
+            this.setAttribute('prompt-title', promptTitle);
+        }
+        cancel = (__runInitializers(this, _promptTitle_extraInitializers), () => this.dispatchEvent(new CustomEvent('close', { detail: undefined })));
+        ok = () => this.dispatchEvent(new CustomEvent('close', { detail: this.shadowRoot.querySelector('input').value }));
+        static styles = [
+            css `
+      :host {
+        display: contents;
+      }
+
+      footer {
+        display: flex;
+        justify-content: flex-end;
+      }
+
+      input {
+        background: var(--background);
+      }
+    `
+        ];
+        render() {
+            return html `
+      <custom-dialog>
+        <header slot="header">${this.promptTitle}</header>
+        <input />
+        <footer slot="actions">
+          <custom-button label="Cancel" action="cancel" @click=${this.cancel}></custom-button>
+          <custom-button label="Ok" action="ok" @click=${this.ok}></custom-button>
+        </footer>
+      </custom-dialog>
+    `;
+        }
+    };
+})();
+
+export { CustomPrompt };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@vandeurenglenn/lite-elements",
-	"version": "0.3.55",
+	"version": "0.3.57",
 	"description": "set of lite elements following Material Design 3 spec",
 	"type": "module",
 	"scripts": {
@@ -331,6 +331,14 @@
 			"import": "./exports/pane.js",
 			"types": "./exports/pane/pane.d.ts"
 		},
+		"./prompt": {
+			"import": "./exports/prompt.js",
+			"types": "./exports/prompt/prompt.d.ts"
+		},
+		"./prompt.js": {
+			"import": "./exports/prompt.js",
+			"types": "./exports/prompt/prompt.d.ts"
+		},
 		"./rail": {
 			"import": "./exports/rail.js",
 			"types": "./exports/rail/rail.d.ts"

package/exports/bundle/row-Bc6ZibAv.js

@@ -1,28 +0,0 @@
-import{x as t,B as e,L as i}from"./property-FNGRBR93.js";Symbol.metadata??=Symbol("metadata");class s extends HTMLElement{static get observedAttributes(){return this[Symbol.metadata]?.observedAttributes?.values()??[]}attributeChangedCallback(t,e,i){this[t]===i&&e===i||(this[t]=i,this.attributeChangeTimeout&&clearTimeout(this.attributeChangeTimeout),this.attributeChangeTimeout=setTimeout((()=>{this.requestRender()}),this.renderedOnce?150:0))}constructor(){super(),this.renderedOnce=!1,this.rendered=new Promise((t=>{this.renderResolve=t})),this.attachShadow({mode:"open"});const t=customElements.get(this.localName);this.shadowRoot.adoptedStyleSheets=t.styles?t.styles.map((t=>t.styleSheet??t)):[],this.requestRender()}render(){return t`<slot></slot>`}requestRender(){e(this.render(),this.shadowRoot),this.renderedOnce||(this.renderResolve(!0),this.renderedOnce=!0,this.firstRender&&this.firstRender())}}const r=(t,e)=>{let i=t;return e===Boolean?i=Boolean("true"===t):e===Number?i=Number(t):e===Uint8Array?i=new Uint8Array(t.split(",")):e!==Array&&e!==Object&&e!==WeakMap&&e!==Map&&e!==Uint8Array||(i=JSON.parse(t),e===Map&&(i=new Map(t)),e===WeakMap&&(i=new WeakMap(t))),i};globalThis.pubsub=globalThis.pubsub||new i;const a={type:String,reflect:!1,renders:!0,batchDelay:50,temporaryRender:10},n=t=>{t={...a,...t};let e=0;return function(i,{kind:a,name:n,addInitializer:o,access:c,metadata:h}){const{type:d,reflect:l,renders:u,batches:g,batchDelay:m,consumer:p,provider:_,temporaryRender:b}=t,y=t.attribute??l,f=String(n),v=y&&"string"==typeof y?y:f,x=d===Boolean,w=p||"boolean"==typeof t.consumes?v:t.consumes,S=_||"boolean"==typeof t.provides?v:t.provides;if(t.provider&&console.warn(`${f}: 'options.provider' is deprecated, use options.provides instead`),t.consumer&&console.warn(`${f}: 'options.consumer' is deprecated, use options.consumes instead`),o((function(){"accessor"!==a&&console.warn(`${this.localName}: @property(${t}) ${f} ${a} is not supported`),y&&(h||(h={}),h.observedAttributes||(h.observedAttributes=new Map),h.observedAttributes.set(f,v)),w&&globalThis.pubsub.subscribe(w,(async t=>{this[n]=t}))})),"accessor"===a)return{get(){return C.call(this)},set(t){return $.call(this,t)},init(t){return this.hasAttribute(v)&&(t=x?this.hasAttribute(v):r(this.getAttribute(v),d)),void 0===t||w||$.call(this,t),this[n]}};function C(){return y?x?this.hasAttribute(v):r(this.getAttribute(v),d):this[`__lite_${f}`]?this[`__lite_${f}`]:this[`_lite_${f}`]}async function $(t){if(S&&globalThis.pubsub.publish(S,t),this[`_lite_${f}`]!==t){this.willChange&&(this[`__lite_${f}`]=await this.willChange(n,t)),y?x?t||this[`__lite_${f}`]?this.setAttribute(v,""):this.removeAttribute(v):t||this[`__lite_${f}`]?this.setAttribute(v,((t,e)=>{let i=e;if(t===Boolean||t===Number||t===Uint8Array)return e.toString();if(t===Array||t===Object||t===WeakMap||t===Map||t===Uint8Array){let r;t!==Map&&t!==WeakMap||(r=Object(e).entries()),i=JSON.stringify(r)}return i})(d,this[`__lite_${f}`]??t)):this.removeAttribute(v):this[`_lite_${f}`]=t;const i=()=>{e=0,this.requestRender&&u&&this.requestRender(),this.onChange&&this.onChange(n,this[`__lite_${f}`]??t)};g?e===b?i():(this[`_${f}_timeout`]&&clearTimeout(this[`_${f}_timeout`]),this[`_${f}_timeout`]=setTimeout(i,m)):i()}}}};var o=function(t,e,i,r,a,n){function o(t){if(void 0!==t&&"function"!=typeof t)throw new TypeError("Function expected");return t}for(var c,h=r.kind,d="getter"===h?"get":"setter"===h?"set":"value",l=!e&&t?r.static?t:t.prototype:null,u=e||(l?Object.getOwnPropertyDescriptor(l,r.name):{}),g=!1,m=i.length-1;m>=0;m--){var p={};for(var _ in r)p[_]="access"===_?{}:r[_];for(var _ in r.access)p.access[_]=r.access[_];p.addInitializer=function(t){if(g)throw new TypeError("Cannot add initializers after decoration has completed");n.push(o(t||null))};var b=(0,i[m])("accessor"===h?{get:u.get,set:u.set}:u[d],p);if("accessor"===h){if(void 0===b)continue;if(null===b||"object"!=typeof b)throw new TypeError("Object expected");(c=o(b.get))&&(u.get=c),(c=o(b.set))&&(u.set=c),(c=o(b.init))&&a.unshift(c)}else(c=o(b))&&("field"===h?a.unshift(c):u[d]=c)}l&&Object.defineProperty(l,r.name,u),g=!0},c=function(t,e,i){for(var r=arguments.length>2,a=0;a<e.length;a++)i=r?e[a].call(t,i):e[a].call(t);return r?i:void 0};let h=(()=>{let e,i,r,a,h,d,l,u,g,m,p=s,_=[],b=[],y=[],f=[],v=[],x=[],w=[],S=[],C=[],$=[],W=[],j=[],A=[],k=[],z=[],O=[],T=[],R=[],I=[],M=[];return class FlexDisplay extends p{static{const t="function"==typeof Symbol&&Symbol.metadata?Object.create(p[Symbol.metadata]??null):void 0;e=[n({type:String})],i=[n({type:String})],r=[n({type:String})],a=[n({type:String})],h=[n({type:String,reflect:!0})],d=[n({type:Boolean,reflect:!0})],l=[n({type:Boolean,reflect:!0,attribute:"center-center"})],u=[n({type:String})],g=[n({type:String})],m=[n({type:String})],o(this,null,e,{kind:"accessor",name:"padding",static:!1,private:!1,access:{has:t=>"padding"in t,get:t=>t.padding,set:(t,e)=>{t.padding=e}},metadata:t},_,b),o(this,null,i,{kind:"accessor",name:"minWidth",static:!1,private:!1,access:{has:t=>"minWidth"in t,get:t=>t.minWidth,set:(t,e)=>{t.minWidth=e}},metadata:t},y,f),o(this,null,r,{kind:"accessor",name:"maxWidth",static:!1,private:!1,access:{has:t=>"maxWidth"in t,get:t=>t.maxWidth,set:(t,e)=>{t.maxWidth=e}},metadata:t},v,x),o(this,null,a,{kind:"accessor",name:"width",static:!1,private:!1,access:{has:t=>"width"in t,get:t=>t.width,set:(t,e)=>{t.width=e}},metadata:t},w,S),o(this,null,h,{kind:"accessor",name:"direction",static:!1,private:!1,access:{has:t=>"direction"in t,get:t=>t.direction,set:(t,e)=>{t.direction=e}},metadata:t},C,$),o(this,null,d,{kind:"accessor",name:"center",static:!1,private:!1,access:{has:t=>"center"in t,get:t=>t.center,set:(t,e)=>{t.center=e}},metadata:t},W,j),o(this,null,l,{kind:"accessor",name:"centerCenter",static:!1,private:!1,access:{has:t=>"centerCenter"in t,get:t=>t.centerCenter,set:(t,e)=>{t.centerCenter=e}},metadata:t},A,k),o(this,null,u,{kind:"accessor",name:"justifyContent",static:!1,private:!1,access:{has:t=>"justifyContent"in t,get:t=>t.justifyContent,set:(t,e)=>{t.justifyContent=e}},metadata:t},z,O),o(this,null,g,{kind:"accessor",name:"alignItems",static:!1,private:!1,access:{has:t=>"alignItems"in t,get:t=>t.alignItems,set:(t,e)=>{t.alignItems=e}},metadata:t},T,R),o(this,null,m,{kind:"accessor",name:"boxSizing",static:!1,private:!1,access:{has:t=>"boxSizing"in t,get:t=>t.boxSizing,set:(t,e)=>{t.boxSizing=e}},metadata:t},I,M),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}#t=c(this,_,"0");get padding(){return this.#t}set padding(t){this.#t=t}#e=(c(this,b),c(this,y,"auto"));get minWidth(){return this.#e}set minWidth(t){this.#e=t}#s=(c(this,f),c(this,v,"auto"));get maxWidth(){return this.#s}set maxWidth(t){this.#s=t}#i=(c(this,x),c(this,w,"100%"));get width(){return this.#i}set width(t){this.#i=t}#r=(c(this,S),c(this,C,"row"));get direction(){return this.#r}set direction(t){this.#r=t}#a=(c(this,$),c(this,W,void 0));get center(){return this.#a}set center(t){this.#a=t}#n=(c(this,j),c(this,A,void 0));get centerCenter(){return this.#n}set centerCenter(t){this.#n=t}#o=(c(this,k),c(this,z,"flex-start"));get justifyContent(){return this.#o}set justifyContent(t){this.#o=t}#c=(c(this,O),c(this,T,"flex-start"));get alignItems(){return this.#c}set alignItems(t){this.#c=t}#h=(c(this,R),c(this,I,"border-box"));get boxSizing(){return this.#h}set boxSizing(t){this.#h=t}render(){return t`
-      <style>
-        :host {
-          display: flex;
-          box-sizing: var(--flex-display-box-sizing, ${this.boxSizing});
-          max-width: var(--flex-display-max-width, ${this.maxWidth});
-          min-width: var(--flex-display-min-width, ${this.minWidth});
-          width: var(--flex-display-width, ${this.width});
-          flex-direction: var(--flex-display-direction, ${this.direction});
-          justify-content: var(
-            --flex-display-justify-content,
-            ${this.justifyContent}
-          );
-          align-items: var(--flex-display-align-items, ${this.alignItems});
-          padding: var(--flex-display-padding, ${this.padding});
-        }
-
-        :host([center]) {
-          align-items: center;
-        }
-
-        :host([center-center]) {
-          align-items: center;
-          justify-content: center;
-        }
-      </style>
-      <slot></slot>
-    `}constructor(){super(...arguments),c(this,M)}}})();customElements.define("flex-row",class FlexRow extends h{constructor(){super(),this.direction="row",this.width="auto"}});export{h as F};