godown 3.0.0-canary.12 → 3.0.0-canary.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/alert.js +1 -5
- package/alert.js.map +1 -1
- package/avatar.js +1 -5
- package/avatar.js.map +1 -1
- package/breath.js +1 -5
- package/breath.js.map +1 -1
- package/button.js +1 -5
- package/button.js.map +1 -1
- package/card.js +1 -5
- package/card.js.map +1 -1
- package/carousel.js +1 -5
- package/carousel.js.map +1 -1
- package/components/alert.js +1 -174
- package/components/alert.js.map +1 -1
- package/components/avatar.js +1 -68
- package/components/avatar.js.map +1 -1
- package/components/breath.js +1 -81
- package/components/breath.js.map +1 -1
- package/components/button.js +1 -185
- package/components/button.js.map +1 -1
- package/components/card.js +1 -49
- package/components/card.js.map +1 -1
- package/components/carousel.js +1 -119
- package/components/carousel.js.map +1 -1
- package/components/details.js +1 -53
- package/components/details.js.map +1 -1
- package/components/dialog.js +1 -98
- package/components/dialog.js.map +1 -1
- package/components/divider.js +1 -35
- package/components/divider.js.map +1 -1
- package/components/dragbox.js +1 -111
- package/components/dragbox.js.map +1 -1
- package/components/flex.js +1 -63
- package/components/flex.js.map +1 -1
- package/components/form.js +1 -75
- package/components/form.js.map +1 -1
- package/components/grid.js +1 -57
- package/components/grid.js.map +1 -1
- package/components/input.js +1 -51
- package/components/input.js.map +1 -1
- package/components/layout.js +1 -58
- package/components/layout.js.map +1 -1
- package/components/link.js +1 -53
- package/components/link.js.map +1 -1
- package/components/progress.js +1 -59
- package/components/progress.js.map +1 -1
- package/components/range.d.ts +1 -0
- package/components/range.d.ts.map +1 -1
- package/components/range.js +1 -267
- package/components/range.js.map +1 -1
- package/components/rotate.js +1 -56
- package/components/rotate.js.map +1 -1
- package/components/router.d.ts +1 -2
- package/components/router.d.ts.map +1 -1
- package/components/router.js +1 -250
- package/components/router.js.map +1 -1
- package/components/select.js +1 -217
- package/components/select.js.map +1 -1
- package/components/skeleton.js +1 -55
- package/components/skeleton.js.map +1 -1
- package/components/split.js +1 -154
- package/components/split.js.map +1 -1
- package/components/switch.js +1 -93
- package/components/switch.js.map +1 -1
- package/components/text.js +1 -46
- package/components/text.js.map +1 -1
- package/components/time.js +1 -78
- package/components/time.js.map +1 -1
- package/components/tooltip.js +1 -85
- package/components/tooltip.js.map +1 -1
- package/components/typewriter.js +1 -128
- package/components/typewriter.js.map +1 -1
- package/core/global-style.js +1 -52
- package/core/global-style.js.map +1 -1
- package/core/super-anchor.js +1 -39
- package/core/super-anchor.js.map +1 -1
- package/core/super-input.js +1 -117
- package/core/super-input.js.map +1 -1
- package/core/super-openable.js +1 -37
- package/core/super-openable.js.map +1 -1
- package/custom-elements.json +1 -1
- package/details.js +1 -5
- package/details.js.map +1 -1
- package/dev/components/range.d.ts +1 -0
- package/dev/components/range.d.ts.map +1 -1
- package/dev/components/range.js +8 -3
- package/dev/components/range.js.map +1 -1
- package/dev/components/router.d.ts +1 -2
- package/dev/components/router.d.ts.map +1 -1
- package/dev/components/router.js +4 -7
- package/dev/components/router.js.map +1 -1
- package/dialog.js +1 -5
- package/dialog.js.map +1 -1
- package/divider.js +1 -5
- package/divider.js.map +1 -1
- package/dragbox.js +1 -5
- package/dragbox.js.map +1 -1
- package/flex.js +1 -5
- package/flex.js.map +1 -1
- package/form.js +1 -5
- package/form.js.map +1 -1
- package/grid.js +1 -5
- package/grid.js.map +1 -1
- package/index.js +1 -56
- package/index.js.map +1 -1
- package/input.js +1 -5
- package/input.js.map +1 -1
- package/layout.js +1 -5
- package/layout.js.map +1 -1
- package/link.js +1 -5
- package/link.js.map +1 -1
- package/package.json +2 -2
- package/progress.js +1 -5
- package/progress.js.map +1 -1
- package/range.js +1 -5
- package/range.js.map +1 -1
- package/rotate.js +1 -5
- package/rotate.js.map +1 -1
- package/router.js +1 -5
- package/router.js.map +1 -1
- package/select.js +1 -5
- package/select.js.map +1 -1
- package/skeleton.js +1 -5
- package/skeleton.js.map +1 -1
- package/split.js +1 -5
- package/split.js.map +1 -1
- package/src/components/range.ts +9 -3
- package/src/components/router.ts +4 -8
- package/switch.js +1 -5
- package/switch.js.map +1 -1
- package/text.js +1 -5
- package/text.js.map +1 -1
- package/time.js +1 -5
- package/time.js.map +1 -1
- package/tooltip.js +1 -5
- package/tooltip.js.map +1 -1
- package/typewriter.js +1 -5
- package/typewriter.js.map +1 -1
- package/web-types.json +1 -1
package/components/time.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"time.js","sources":["../src/components/time.ts"],"sourcesContent":null,"names":[
|
1
|
+
{"version":3,"file":"time.js","sources":["../src/components/time.ts"],"sourcesContent":null,"names":["Time","GlobalStyle","constructor","this","escape","format","time","Date","render","html","attr","observedRecord","fmtime","firstUpdated","timeout","timeoutId","startTimeout","updated","changedProperties","has","clearInterval","disconnectedCallback","window","setInterval","getTime","gap","Math","abs","__decorate","property","prototype","type","Object","Number","godown","styles","css","Time$1"],"mappings":"sXAkBA,IAAMA,EAAN,MAAMA,aAAaC,EAAnB,WAAAC,uBAKEC,KAAMC,OAAG,IAMTD,KAAME,OAAG,2BAMTF,KAAAG,KAAa,IAAIC,KAgBP,MAAAC,GACR,OAAOC,CAAI,qBAAqBC,EAAKP,KAAKQ,mBACtCC,EAAOT,KAAKE,OAAQF,KAAKG,KAAMH,KAAKC,iBAIhC,YAAAS,GACJV,KAAKW,UACPX,KAAKY,UAAYZ,KAAKa,gBAIhB,OAAAC,CAAQC,GACZA,EAAkBC,IAAI,aACxBC,cAAcjB,KAAKY,WACfZ,KAAKW,UACPX,KAAKY,UAAYZ,KAAKa,iBAK5B,oBAAAK,GACED,cAAcjB,KAAKY,WAGrB,YAAAC,GACE,OAAOM,OAAOC,aAAY,KACxBpB,KAAKG,KAAO,IAAIC,KAAKJ,KAAKG,KAAKkB,WAAarB,KAAKsB,KAAOtB,KAAKW,SAAS,GACrEY,KAAKC,IAAIxB,KAAKW,YAxDnBc,EAAA,CADCC,KACW7B,EAAA8B,UAAA,cAAA,GAMZF,EAAA,CADCC,KACkC7B,EAAA8B,UAAA,cAAA,GAMnCF,EAAA,CADCC,EAAS,CAAEE,KAAMC,UACKhC,EAAA8B,UAAA,YAAA,GAMvBF,EAAA,CADCC,EAAS,CAAEE,KAAME,UACNjC,EAAA8B,UAAA,eAAA,GAMZF,EAAA,CADCC,EAAS,CAAEE,KAAME,UACVjC,EAAA8B,UAAA,WAAA,GA7BJ9B,EAAI4B,EAAA,CAFTM,EAPiB,QAQjBC,EAAOC,CAAG,6BACLpC,GAiEN,IAAAqC,EAAerC"}
|
package/components/tooltip.js
CHANGED
@@ -1,86 +1,2 @@
|
|
1
|
-
import {
|
2
|
-
import { godown } from '@godown/element/decorators/godown.js';
|
3
|
-
import { styles } from '@godown/element/decorators/styles.js';
|
4
|
-
import { attr } from '@godown/element/directives/attr.js';
|
5
|
-
import { htmlSlot } from '@godown/element/directives/html-slot.js';
|
6
|
-
import { css, html } from 'lit';
|
7
|
-
import { property } from 'lit/decorators.js';
|
8
|
-
import { scopePrefix } from '../core/global-style.js';
|
9
|
-
import SuperOpenable from '../core/super-openable.js';
|
10
|
-
|
11
|
-
var Tooltip_1;
|
12
|
-
const protoName = "tooltip";
|
13
|
-
const cssScope = scopePrefix(protoName);
|
14
|
-
/**
|
15
|
-
* {@linkcode Tooltip} provide tooltip for slot elements.
|
16
|
-
*
|
17
|
-
* If it has the tip property, ignore the slot tip.
|
18
|
-
*
|
19
|
-
* @slot tip - Tip element if no `tip` provided.
|
20
|
-
* @slot - Content.
|
21
|
-
* @category feedback
|
22
|
-
*/
|
23
|
-
let Tooltip = Tooltip_1 = class Tooltip extends SuperOpenable {
|
24
|
-
constructor() {
|
25
|
-
super(...arguments);
|
26
|
-
/**
|
27
|
-
* Direction of opening the tip.
|
28
|
-
*/
|
29
|
-
this.direction = "top";
|
30
|
-
/**
|
31
|
-
* Content alignment.
|
32
|
-
*/
|
33
|
-
this.align = "center";
|
34
|
-
/**
|
35
|
-
* If true, allow penetration of the tip.
|
36
|
-
*/
|
37
|
-
this.propagation = false;
|
38
|
-
/**
|
39
|
-
* How can tips be triggered.
|
40
|
-
*
|
41
|
-
* If `focus`, element will be focusable, open tip when focused.
|
42
|
-
*
|
43
|
-
* If `hover`, element will open tip when hovered.
|
44
|
-
*
|
45
|
-
* @default "hover"
|
46
|
-
*/
|
47
|
-
this.type = "hover";
|
48
|
-
}
|
49
|
-
render() {
|
50
|
-
const align = Tooltip_1.aligns[this.align] || "inherit";
|
51
|
-
const isFocusable = this.type === "focus";
|
52
|
-
return html `<div part="root" ${attr(this.observedRecord)} tabindex="${isFocusable ? 0 : -1}" @focus="${isFocusable ? () => this.open = true : null}" @blur="${isFocusable ? () => this.open = false : null}" @mouseenter="${isFocusable ? null : () => this.open = true}" @mouseleave="${isFocusable ? null : () => this.open = false}" style="justify-content:${align};align-items:${align}">${htmlSlot()}<div part="tip">${this.tip
|
53
|
-
? html `<span class="passive">${this.tip}</span>`
|
54
|
-
: htmlSlot("tip")}</div></div>`;
|
55
|
-
}
|
56
|
-
};
|
57
|
-
Tooltip.aligns = {
|
58
|
-
start: "flex-start",
|
59
|
-
end: "flex-end",
|
60
|
-
center: "center",
|
61
|
-
"flex-start": "flex-start",
|
62
|
-
"flex-end": "flex-end",
|
63
|
-
};
|
64
|
-
__decorate([
|
65
|
-
property()
|
66
|
-
], Tooltip.prototype, "tip", void 0);
|
67
|
-
__decorate([
|
68
|
-
property()
|
69
|
-
], Tooltip.prototype, "direction", void 0);
|
70
|
-
__decorate([
|
71
|
-
property()
|
72
|
-
], Tooltip.prototype, "align", void 0);
|
73
|
-
__decorate([
|
74
|
-
property({ type: Boolean })
|
75
|
-
], Tooltip.prototype, "propagation", void 0);
|
76
|
-
__decorate([
|
77
|
-
property()
|
78
|
-
], Tooltip.prototype, "type", void 0);
|
79
|
-
Tooltip = Tooltip_1 = __decorate([
|
80
|
-
godown(protoName),
|
81
|
-
styles(css `:host{${cssScope}--tip-background:inherit;width:-moz-fit-content;width:fit-content}:host,[part=root]{display:inline-flex}[part=root]{position:relative;transition:inherit;border-radius:inherit}[part=tip]{width:-moz-fit-content;width:fit-content;height:-moz-fit-content;height:fit-content;position:absolute;visibility:hidden;transition:inherit;-webkit-user-select:none;user-select:none}:host([open]) [part=tip]{visibility:visible}.passive{background:var(${cssScope}--tip-background)}[propagation] [part=tip]{pointer-events:none}`, css `[direction^=top] [part=tip]{bottom:100%}[direction^=bottom] [part=tip]{top:100%}[direction$=right] [part=tip]{left:100%}[direction$=left] [part=tip]{right:100%}`)
|
82
|
-
], Tooltip);
|
83
|
-
var Tooltip$1 = Tooltip;
|
84
|
-
|
85
|
-
export { Tooltip$1 as default };
|
1
|
+
import{__decorate as t}from"tslib";import{godown as i}from"@godown/element/decorators/godown.js";import{styles as o}from"@godown/element/decorators/styles.js";import{attr as e}from"@godown/element/directives/attr.js";import{htmlSlot as r}from"@godown/element/directives/html-slot.js";import{css as n,html as s}from"lit";import{property as p}from"lit/decorators.js";import{scopePrefix as a}from"../core/global-style.js";import l from"../core/super-openable.js";var d;const c="tooltip",h=a(c);let m=d=class Tooltip extends l{constructor(){super(...arguments),this.direction="top",this.align="center",this.propagation=!1,this.type="hover"}render(){const t=d.aligns[this.align]||"inherit",i="focus"===this.type;return s`<div part="root" ${e(this.observedRecord)} tabindex="${i?0:-1}" @focus="${i?()=>this.open=!0:null}" @blur="${i?()=>this.open=!1:null}" @mouseenter="${i?null:()=>this.open=!0}" @mouseleave="${i?null:()=>this.open=!1}" style="justify-content:${t};align-items:${t}">${r()}<div part="tip">${this.tip?s`<span class="passive">${this.tip}</span>`:r("tip")}</div></div>`}};m.aligns={start:"flex-start",end:"flex-end",center:"center","flex-start":"flex-start","flex-end":"flex-end"},t([p()],m.prototype,"tip",void 0),t([p()],m.prototype,"direction",void 0),t([p()],m.prototype,"align",void 0),t([p({type:Boolean})],m.prototype,"propagation",void 0),t([p()],m.prototype,"type",void 0),m=d=t([i(c),o(n`:host{${h}--tip-background:inherit;width:-moz-fit-content;width:fit-content}:host,[part=root]{display:inline-flex}[part=root]{position:relative;transition:inherit;border-radius:inherit}[part=tip]{width:-moz-fit-content;width:fit-content;height:-moz-fit-content;height:fit-content;position:absolute;visibility:hidden;transition:inherit;-webkit-user-select:none;user-select:none}:host([open]) [part=tip]{visibility:visible}.passive{background:var(${h}--tip-background)}[propagation] [part=tip]{pointer-events:none}`,n`[direction^=top] [part=tip]{bottom:100%}[direction^=bottom] [part=tip]{top:100%}[direction$=right] [part=tip]{left:100%}[direction$=left] [part=tip]{right:100%}`)],m);var f=m;export{f as default};
|
86
2
|
//# sourceMappingURL=tooltip.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"tooltip.js","sources":["../src/components/tooltip.ts"],"sourcesContent":null,"names":[
|
1
|
+
{"version":3,"file":"tooltip.js","sources":["../src/components/tooltip.ts"],"sourcesContent":null,"names":["protoName","cssScope","scopePrefix","Tooltip","Tooltip_1","SuperOpenable","constructor","this","direction","align","propagation","type","render","aligns","isFocusable","html","attr","observedRecord","open","htmlSlot","tip","start","end","center","__decorate","property","prototype","Boolean","godown","styles","css","Tooltip$1"],"mappings":"kdAUA,MAAMA,EAAY,UACZC,EAAWC,EAAYF,GAgB7B,IAAMG,EAAOC,EAAb,MAAMD,gBAAgBE,EAAtB,WAAAC,uBAWEC,KAASC,UAAe,MAMxBD,KAAKE,MAA2D,SAMhEF,KAAWG,aAAG,EAYdH,KAAII,KAAsB,QAUhB,MAAAC,GACR,MAAMH,EAAQL,EAAQS,OAAON,KAAKE,QAAU,UACtCK,EAA4B,UAAdP,KAAKI,KACzB,OAAOI,CAAI,oBAEPC,EAAKT,KAAKU,6BACAH,EAAc,GAAK,cACrBA,EAAc,IAAMP,KAAKW,MAAO,EAAO,gBACxCJ,EAAc,IAAMP,KAAKW,MAAO,EAAQ,sBAClCJ,EAAc,KAAO,IAAMP,KAAKW,MAAO,mBACvCJ,EAAc,KAAO,IAAMP,KAAKW,MAAO,6BAC7BT,iBAAqBA,MAC5CU,sBAGFZ,KAAKa,IACDL,CAAI,yBAAyBR,KAAKa,aAClCD,EAAS,uBAzBVhB,EAAAU,OAAS,CACdQ,MAAO,aACPC,IAAK,WACLC,OAAQ,SACR,aAAc,aACd,WAAY,YArCdC,EAAA,CADCC,KACUtB,EAAAuB,UAAA,WAAA,GAMXF,EAAA,CADCC,KAC4BtB,EAAAuB,UAAA,iBAAA,GAM7BF,EAAA,CADCC,KACuEtB,EAAAuB,UAAA,aAAA,GAMxEF,EAAA,CADCC,EAAS,CAAEd,KAAMgB,WACCxB,EAAAuB,UAAA,mBAAA,GAYnBF,EAAA,CADCC,KACgCtB,EAAAuB,UAAA,YAAA,GAnC7BvB,EAAOC,EAAAoB,EAAA,CALZI,EAAO5B,GACP6B,EACCC,CAAG,SAAS7B,ubAA8bA,mEAC1c6B,CAAG,qKAEC3B,GAqEN,IAAA4B,EAAe5B"}
|
package/components/typewriter.js
CHANGED
@@ -1,129 +1,2 @@
|
|
1
|
-
import {
|
2
|
-
import { godown } from '@godown/element/decorators/godown.js';
|
3
|
-
import { styles } from '@godown/element/decorators/styles.js';
|
4
|
-
import { attr } from '@godown/element/directives/attr.js';
|
5
|
-
import { classList } from '@godown/element/directives/class-list.js';
|
6
|
-
import { htmlSlot } from '@godown/element/directives/html-slot.js';
|
7
|
-
import { random } from '@godown/element/tools/lib.js';
|
8
|
-
import { css, html } from 'lit';
|
9
|
-
import { property, state, query } from 'lit/decorators.js';
|
10
|
-
import { scopePrefix, GlobalStyle } from '../core/global-style.js';
|
11
|
-
|
12
|
-
const protoName = "typewriter";
|
13
|
-
const cssScope = scopePrefix(protoName);
|
14
|
-
/**
|
15
|
-
* {@linkcode Typewriter} renders a typewriter effect to text.
|
16
|
-
*
|
17
|
-
* @category effect
|
18
|
-
*/
|
19
|
-
let Typewriter = class Typewriter extends GlobalStyle {
|
20
|
-
constructor() {
|
21
|
-
super(...arguments);
|
22
|
-
/**
|
23
|
-
* Raw text.
|
24
|
-
*/
|
25
|
-
this.text = "";
|
26
|
-
/**
|
27
|
-
* Start immediately after {@linkcode Typewriter.firstUpdated}.
|
28
|
-
*/
|
29
|
-
this.stopped = false;
|
30
|
-
/**
|
31
|
-
* If true, hide the cursor
|
32
|
-
*/
|
33
|
-
this.ended = false;
|
34
|
-
/**
|
35
|
-
* Maximum random time.
|
36
|
-
*/
|
37
|
-
this.max = 100;
|
38
|
-
/**
|
39
|
-
* Minimum random time.
|
40
|
-
*/
|
41
|
-
this.min = 50;
|
42
|
-
/**
|
43
|
-
* Fixed time.
|
44
|
-
*/
|
45
|
-
this.delay = 0;
|
46
|
-
/**
|
47
|
-
* The index at the beginning.
|
48
|
-
*/
|
49
|
-
this.index = 0;
|
50
|
-
/**
|
51
|
-
* Internal text.
|
52
|
-
*/
|
53
|
-
this.content = "";
|
54
|
-
}
|
55
|
-
/**
|
56
|
-
* {@linkcode Typewriter.text} length.
|
57
|
-
*/
|
58
|
-
get len() {
|
59
|
-
return this.text.length;
|
60
|
-
}
|
61
|
-
render() {
|
62
|
-
return html `<div part="root" ${attr(this.observedRecord)}>${htmlSlot()} ${this.content} <i part="cursor" class="${classList({ hidden: this.ended })}"></i></div>`;
|
63
|
-
}
|
64
|
-
firstUpdated() {
|
65
|
-
if (!this.text) {
|
66
|
-
this.text = this._slot?.assignedNodes()[0]?.textContent.trim() || "";
|
67
|
-
}
|
68
|
-
if (!this.stopped && this.len) {
|
69
|
-
this.write();
|
70
|
-
}
|
71
|
-
}
|
72
|
-
updated(changedProperties) {
|
73
|
-
if (changedProperties.has("index")) {
|
74
|
-
this.dispatchEvent(new CustomEvent(this.index === this.len ? "done" : "write", { detail: this.content }));
|
75
|
-
}
|
76
|
-
}
|
77
|
-
write(at = this.index) {
|
78
|
-
this.content = this.text.slice(0, at + 1);
|
79
|
-
const timeout = this.delay || random(this.max, this.min);
|
80
|
-
this.timeoutID = window.setTimeout(() => {
|
81
|
-
const nx = at + 1;
|
82
|
-
if (nx <= this.len) {
|
83
|
-
this.index = nx;
|
84
|
-
this.write();
|
85
|
-
}
|
86
|
-
}, timeout);
|
87
|
-
}
|
88
|
-
stop() {
|
89
|
-
clearTimeout(this.timeoutID);
|
90
|
-
}
|
91
|
-
end() {
|
92
|
-
this.ended = true;
|
93
|
-
}
|
94
|
-
};
|
95
|
-
__decorate([
|
96
|
-
property()
|
97
|
-
], Typewriter.prototype, "text", void 0);
|
98
|
-
__decorate([
|
99
|
-
property({ type: Boolean })
|
100
|
-
], Typewriter.prototype, "stopped", void 0);
|
101
|
-
__decorate([
|
102
|
-
property({ type: Boolean })
|
103
|
-
], Typewriter.prototype, "ended", void 0);
|
104
|
-
__decorate([
|
105
|
-
property({ type: Number })
|
106
|
-
], Typewriter.prototype, "max", void 0);
|
107
|
-
__decorate([
|
108
|
-
property({ type: Number })
|
109
|
-
], Typewriter.prototype, "min", void 0);
|
110
|
-
__decorate([
|
111
|
-
property({ type: Number })
|
112
|
-
], Typewriter.prototype, "delay", void 0);
|
113
|
-
__decorate([
|
114
|
-
property({ type: Number })
|
115
|
-
], Typewriter.prototype, "index", void 0);
|
116
|
-
__decorate([
|
117
|
-
state()
|
118
|
-
], Typewriter.prototype, "content", void 0);
|
119
|
-
__decorate([
|
120
|
-
query("i")
|
121
|
-
], Typewriter.prototype, "_i", void 0);
|
122
|
-
Typewriter = __decorate([
|
123
|
-
godown(protoName),
|
124
|
-
styles(css `:host{${cssScope}--cursor-width:.05em}:host,:host([contents]) [part=root]{display:inline-block}i{border-right:var(${cssScope}--cursor-width) solid;margin-left:.02em;animation:s 1.5s steps(1) infinite}@keyframes s{0%{border-color:currentColor}50%{border-color:transparent}}slot{display:none}.hidden{visibility:hidden}`)
|
125
|
-
], Typewriter);
|
126
|
-
var Typewriter$1 = Typewriter;
|
127
|
-
|
128
|
-
export { Typewriter$1 as default };
|
1
|
+
import{__decorate as t}from"tslib";import{godown as e}from"@godown/element/decorators/godown.js";import{styles as o}from"@godown/element/decorators/styles.js";import{attr as i}from"@godown/element/directives/attr.js";import{classList as s}from"@godown/element/directives/class-list.js";import{htmlSlot as r}from"@godown/element/directives/html-slot.js";import{random as n}from"@godown/element/tools/lib.js";import{css as d,html as p}from"lit";import{property as l,state as m,query as h}from"lit/decorators.js";import{scopePrefix as a,GlobalStyle as c}from"../core/global-style.js";const y="typewriter",v=a(y);let u=class Typewriter extends c{constructor(){super(...arguments),this.text="",this.stopped=!1,this.ended=!1,this.max=100,this.min=50,this.delay=0,this.index=0,this.content=""}get len(){return this.text.length}render(){return p`<div part="root" ${i(this.observedRecord)}>${r()} ${this.content} <i part="cursor" class="${s({hidden:this.ended})}"></i></div>`}firstUpdated(){this.text||(this.text=this._slot?.assignedNodes()[0]?.textContent.trim()||""),!this.stopped&&this.len&&this.write()}updated(t){t.has("index")&&this.dispatchEvent(new CustomEvent(this.index===this.len?"done":"write",{detail:this.content}))}write(t=this.index){this.content=this.text.slice(0,t+1);const e=this.delay||n(this.max,this.min);this.timeoutID=window.setTimeout((()=>{const e=t+1;e<=this.len&&(this.index=e,this.write())}),e)}stop(){clearTimeout(this.timeoutID)}end(){this.ended=!0}};t([l()],u.prototype,"text",void 0),t([l({type:Boolean})],u.prototype,"stopped",void 0),t([l({type:Boolean})],u.prototype,"ended",void 0),t([l({type:Number})],u.prototype,"max",void 0),t([l({type:Number})],u.prototype,"min",void 0),t([l({type:Number})],u.prototype,"delay",void 0),t([l({type:Number})],u.prototype,"index",void 0),t([m()],u.prototype,"content",void 0),t([h("i")],u.prototype,"_i",void 0),u=t([e(y),o(d`:host{${v}--cursor-width:.05em}:host,:host([contents]) [part=root]{display:inline-block}i{border-right:var(${v}--cursor-width) solid;margin-left:.02em;animation:s 1.5s steps(1) infinite}@keyframes s{0%{border-color:currentColor}50%{border-color:transparent}}slot{display:none}.hidden{visibility:hidden}`)],u);var w=u;export{w as default};
|
129
2
|
//# sourceMappingURL=typewriter.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"typewriter.js","sources":["../src/components/typewriter.ts"],"sourcesContent":null,"names":[
|
1
|
+
{"version":3,"file":"typewriter.js","sources":["../src/components/typewriter.ts"],"sourcesContent":null,"names":["protoName","cssScope","scopePrefix","Typewriter","GlobalStyle","constructor","this","text","stopped","ended","max","min","delay","index","content","len","length","render","html","attr","observedRecord","htmlSlot","classList","hidden","firstUpdated","_slot","assignedNodes","textContent","trim","write","updated","changedProperties","has","dispatchEvent","CustomEvent","detail","at","slice","timeout","random","timeoutID","window","setTimeout","nx","stop","clearTimeout","end","__decorate","property","prototype","type","Boolean","Number","state","query","godown","styles","css","Typewriter$1"],"mappings":"qkBAWA,MAAMA,EAAY,aACZC,EAAWC,EAAYF,GAS7B,IAAMG,EAAN,MAAMA,mBAAmBC,EAAzB,WAAAC,uBAKEC,KAAIC,KAAG,GAMPD,KAAOE,SAAG,EAMVF,KAAKG,OAAG,EAMRH,KAAGI,IAAG,IAMNJ,KAAGK,IAAG,GAMNL,KAAKM,MAAG,EAMRN,KAAKO,MAAG,EAMRP,KAAOQ,QAAG,GAUV,OAAIC,GACF,OAAOT,KAAKC,KAAKS,OAGT,MAAAC,GACR,OAAOC,CAAI,oBAAoBC,EAAKb,KAAKc,mBACrCC,OACAf,KAAKQ,mCACmBQ,EAAU,CAAEC,OAAQjB,KAAKG,sBAI7C,YAAAe,GACHlB,KAAKC,OACRD,KAAKC,KAAOD,KAAKmB,OAAOC,gBAAgB,IAAIC,YAAYC,QAAU,KAE/DtB,KAAKE,SAAWF,KAAKS,KACxBT,KAAKuB,QAIC,OAAAC,CAAQC,GACZA,EAAkBC,IAAI,UACxB1B,KAAK2B,cAAc,IAAIC,YAAY5B,KAAKO,QAAUP,KAAKS,IAAM,OAAS,QAAS,CAAEoB,OAAQ7B,KAAKQ,WAIlG,KAAAe,CAAMO,EAAa9B,KAAKO,OACtBP,KAAKQ,QAAUR,KAAKC,KAAK8B,MAAM,EAAGD,EAAK,GACvC,MAAME,EAAUhC,KAAKM,OAAS2B,EAAOjC,KAAKI,IAAKJ,KAAKK,KACpDL,KAAKkC,UAAYC,OAAOC,YAAW,KACjC,MAAMC,EAAKP,EAAK,EACZO,GAAMrC,KAAKS,MACbT,KAAKO,MAAQ8B,EACbrC,KAAKuB,WAENS,GAGL,IAAAM,GACEC,aAAavC,KAAKkC,WAGpB,GAAAM,GACExC,KAAKG,OAAQ,IAhGfsC,EAAA,CADCC,KACQ7C,EAAA8C,UAAA,YAAA,GAMTF,EAAA,CADCC,EAAS,CAAEE,KAAMC,WACHhD,EAAA8C,UAAA,eAAA,GAMfF,EAAA,CADCC,EAAS,CAAEE,KAAMC,WACLhD,EAAA8C,UAAA,aAAA,GAMbF,EAAA,CADCC,EAAS,CAAEE,KAAME,UACTjD,EAAA8C,UAAA,WAAA,GAMTF,EAAA,CADCC,EAAS,CAAEE,KAAME,UACVjD,EAAA8C,UAAA,WAAA,GAMRF,EAAA,CADCC,EAAS,CAAEE,KAAME,UACTjD,EAAA8C,UAAA,aAAA,GAMTF,EAAA,CADCC,EAAS,CAAEE,KAAME,UACTjD,EAAA8C,UAAA,aAAA,GAMTF,EAAA,CADCM,KACWlD,EAAA8C,UAAA,eAAA,GAKFF,EAAA,CADTO,EAAM,MACkBnD,EAAA8C,UAAA,UAAA,GApDrB9C,EAAU4C,EAAA,CAFfQ,EAAOvD,GACPwD,EAAOC,CAAG,SAASxD,qGAA4GA,qMAC1HE,GAyGN,IAAAuD,EAAevD"}
|
package/core/global-style.js
CHANGED
@@ -1,53 +1,2 @@
|
|
1
|
-
import
|
2
|
-
import { travel } from '@godown/colors/travel.js';
|
3
|
-
import GodownElement from '@godown/element';
|
4
|
-
import GodownConfig from '@godown/element/config.js';
|
5
|
-
import { joinProperties } from '@godown/element/tools/css.js';
|
6
|
-
import { trim } from '@godown/element/tools/lib.js';
|
7
|
-
import { unsafeCSS, css } from 'lit';
|
8
|
-
|
9
|
-
GodownElement.godownConfig ||= new GodownConfig();
|
10
|
-
class GlobalStyle extends GodownElement {
|
11
|
-
}
|
12
|
-
const cssvar = trim(GlobalStyle.godownConfig.prefix, "-");
|
13
|
-
function scopePrefix(scope, len = 1) {
|
14
|
-
return variablePrefix(cssvar + "-".repeat(len) + scope);
|
15
|
-
}
|
16
|
-
function variablePrefix(variable) {
|
17
|
-
return unsafeCSS("--" + variable);
|
18
|
-
}
|
19
|
-
const cssGlobalVars = {
|
20
|
-
foreground: scopePrefix("foreground", 2),
|
21
|
-
background: scopePrefix("background", 2),
|
22
|
-
clipBackground: scopePrefix("clip-background", 2),
|
23
|
-
active: scopePrefix("active", 2),
|
24
|
-
passive: scopePrefix("passive", 2),
|
25
|
-
_colors: {},
|
26
|
-
input: scopePrefix("input", 2),
|
27
|
-
white: scopePrefix("color-white", 2),
|
28
|
-
black: scopePrefix("color-black", 2),
|
29
|
-
};
|
30
|
-
GlobalStyle.styles = [
|
31
|
-
unsafeCSS(":host{"
|
32
|
-
+ `${cssGlobalVars.black}:rgb(0 0 0);`
|
33
|
-
+ `${cssGlobalVars.white}:rgb(255 255 255);`
|
34
|
-
+ travel((key, gradient, rgb) => {
|
35
|
-
cssGlobalVars._colors[key] ||= [];
|
36
|
-
cssGlobalVars._colors[key].push(unsafeCSS(scopePrefix("color", 2) + "-" + key + "-" + gradient));
|
37
|
-
const endKey = `-${key}-${gradient}`;
|
38
|
-
const colorKey = scopePrefix("color", 2) + endKey;
|
39
|
-
return `${colorKey}:rgb(${rgb});`;
|
40
|
-
}, presetsRGB).join("")
|
41
|
-
+ joinProperties({
|
42
|
-
[cssGlobalVars.background + ""]: `var(${cssGlobalVars._colors.darkgray[9]})`,
|
43
|
-
[cssGlobalVars.foreground + ""]: `var(${cssGlobalVars._colors.lightgray[0]})`,
|
44
|
-
[cssGlobalVars.active + ""]: `var(${cssGlobalVars._colors.blue[6]})`,
|
45
|
-
[cssGlobalVars.passive + ""]: `var(${cssGlobalVars._colors.darkgray[6]})`,
|
46
|
-
[cssGlobalVars.clipBackground + ""]: `linear-gradient(to bottom, var(${cssGlobalVars.foreground}), var(${cssGlobalVars.passive}))`,
|
47
|
-
})
|
48
|
-
+ "}"),
|
49
|
-
css `*{border:0;outline:0;margin:0;padding:0;font-size:100%;font-style:normal;box-sizing:border-box}:host{box-sizing:border-box}a{text-decoration:none}span{white-space:nowrap}svg{-webkit-user-select:none;user-select:none}:host([contents]){display:contents}:where(:host([contents]) [part=root]){all:inherit;display:revert}`,
|
50
|
-
];
|
51
|
-
|
52
|
-
export { GlobalStyle, cssGlobalVars, scopePrefix, variablePrefix };
|
1
|
+
import{presetsRGB as o}from"@godown/colors/presets-rgb.js";import{travel as r}from"@godown/colors/travel.js";import e from"@godown/element";import t from"@godown/element/config.js";import{joinProperties as n}from"@godown/element/tools/css.js";import{trim as s}from"@godown/element/tools/lib.js";import{unsafeCSS as l,css as i}from"lit";e.godownConfig||=new t;class GlobalStyle extends e{}const a=s(GlobalStyle.godownConfig.prefix,"-");function c(o,r=1){return g(a+"-".repeat(r)+o)}function g(o){return l("--"+o)}const d={foreground:c("foreground",2),background:c("background",2),clipBackground:c("clip-background",2),active:c("active",2),passive:c("passive",2),_colors:{},input:c("input",2),white:c("color-white",2),black:c("color-black",2)};GlobalStyle.styles=[l(`:host{${d.black}:rgb(0 0 0);${d.white}:rgb(255 255 255);`+r(((o,r,e)=>{d._colors[o]||=[],d._colors[o].push(l(c("color",2)+"-"+o+"-"+r));const t=`-${o}-${r}`;return`${c("color",2)+t}:rgb(${e});`}),o).join("")+n({[d.background+""]:`var(${d._colors.darkgray[9]})`,[d.foreground+""]:`var(${d._colors.lightgray[0]})`,[d.active+""]:`var(${d._colors.blue[6]})`,[d.passive+""]:`var(${d._colors.darkgray[6]})`,[d.clipBackground+""]:`linear-gradient(to bottom, var(${d.foreground}), var(${d.passive}))`})+"}"),i`*{border:0;outline:0;margin:0;padding:0;font-size:100%;font-style:normal;box-sizing:border-box}:host{box-sizing:border-box}a{text-decoration:none}span{white-space:nowrap}svg{-webkit-user-select:none;user-select:none}:host([contents]){display:contents}:where(:host([contents]) [part=root]){all:inherit;display:revert}`];export{GlobalStyle,d as cssGlobalVars,c as scopePrefix,g as variablePrefix};
|
53
2
|
//# sourceMappingURL=global-style.js.map
|
package/core/global-style.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"global-style.js","sources":["../src/core/global-style.ts"],"sourcesContent":null,"names":[
|
1
|
+
{"version":3,"file":"global-style.js","sources":["../src/core/global-style.ts"],"sourcesContent":null,"names":["GodownElement","godownConfig","GodownConfig","GlobalStyle","cssvar","trim","prefix","scopePrefix","scope","len","variablePrefix","repeat","variable","unsafeCSS","cssGlobalVars","foreground","background","clipBackground","active","passive","_colors","input","white","black","styles","travel","key","gradient","rgb","push","endKey","presetsRGB","join","joinProperties","darkgray","lightgray","blue","css"],"mappings":"gVAQAA,EAAcC,eAAiB,IAAIC,EAE7B,MAAOC,oBAAoBH,GAGjC,MAAMI,EAASC,EAAKF,YAAYF,aAAaK,OAAQ,cAErCC,EAAYC,EAAeC,EAAM,GAC/C,OAAOC,EAAeN,EAAS,IAAIO,OAAOF,GAAOD,EACnD,CAEM,SAAUE,EAAeE,GAC7B,OAAOC,EAAU,KAAOD,EAC1B,CAEa,MAAAE,EAUT,CACFC,WAAYR,EAAY,aAAc,GACtCS,WAAYT,EAAY,aAAc,GACtCU,eAAgBV,EAAY,kBAAmB,GAC/CW,OAAQX,EAAY,SAAU,GAC9BY,QAASZ,EAAY,UAAW,GAChCa,QAAS,CAA+B,EACxCC,MAAOd,EAAY,QAAS,GAC5Be,MAAOf,EAAY,cAAe,GAClCgB,MAAOhB,EAAY,cAAe,IAIpCJ,YAAYqB,OAAS,CACnBX,EAEM,SAAGC,EAAcS,oBACdT,EAAcQ,0BACjBG,GAAO,CAACC,EAAKC,EAAUC,KACvBd,EAAcM,QAAQM,KAAS,GAC/BZ,EAAcM,QAAQM,GAAKG,KAAKhB,EAAUN,EAAY,QAAS,GAAK,IAAMmB,EAAM,IAAMC,IACtF,MAAMG,EAAS,IAAIJ,KAAOC,IAE1B,MAAO,GADUpB,EAAY,QAAS,GAAKuB,SACjBF,KAAO,GAChCG,GAAYC,KAAK,IAClBC,EAAe,CACf,CAACnB,EAAcE,WAAa,IAAK,OAAOF,EAAcM,QAAQc,SAAS,MACvE,CAACpB,EAAcC,WAAa,IAAK,OAAOD,EAAcM,QAAQe,UAAU,MACxE,CAACrB,EAAcI,OAAS,IAAK,OAAOJ,EAAcM,QAAQgB,KAAK,MAC/D,CAACtB,EAAcK,QAAU,IAAK,OAAOL,EAAcM,QAAQc,SAAS,MACpE,CAACpB,EAAcG,eAAiB,IAC9B,kCAAkCH,EAAcC,oBAAoBD,EAAcK,cAEpF,KAENkB,CAAG"}
|
package/core/super-anchor.js
CHANGED
@@ -1,40 +1,2 @@
|
|
1
|
-
import {
|
2
|
-
import { styles } from '@godown/element/decorators/index.js';
|
3
|
-
import { attr } from '@godown/element/directives/attr.js';
|
4
|
-
import { htmlSlot } from '@godown/element/directives/html-slot.js';
|
5
|
-
import { css, html } from 'lit';
|
6
|
-
import { property } from 'lit/decorators.js';
|
7
|
-
import { ifDefined } from 'lit/directives/if-defined.js';
|
8
|
-
import { GlobalStyle } from './global-style.js';
|
9
|
-
|
10
|
-
let SuperAnchor = class SuperAnchor extends GlobalStyle {
|
11
|
-
constructor() {
|
12
|
-
super(...arguments);
|
13
|
-
/**
|
14
|
-
* A element href.
|
15
|
-
*/
|
16
|
-
this.href = undefined;
|
17
|
-
/**
|
18
|
-
* A element target.
|
19
|
-
*/
|
20
|
-
this.target = "_self";
|
21
|
-
}
|
22
|
-
render() {
|
23
|
-
return html `<a part="root" ${attr(this.observedRecord)} href="${ifDefined(this.href)}" target="${this.target}" @click="${this._handleClick}">${htmlSlot()}</a>`;
|
24
|
-
}
|
25
|
-
// eslint-disable-next-line
|
26
|
-
_handleClick(_) { }
|
27
|
-
};
|
28
|
-
__decorate([
|
29
|
-
property()
|
30
|
-
], SuperAnchor.prototype, "href", void 0);
|
31
|
-
__decorate([
|
32
|
-
property()
|
33
|
-
], SuperAnchor.prototype, "target", void 0);
|
34
|
-
SuperAnchor = __decorate([
|
35
|
-
styles(css `:host{display:inline-block;color:currentColor;text-decoration:none;cursor:default}:host([href]){cursor:pointer}[part=root]{width:100%;color:inherit;display:inline-block;text-decoration:inherit}`)
|
36
|
-
], SuperAnchor);
|
37
|
-
var SuperAnchor$1 = SuperAnchor;
|
38
|
-
|
39
|
-
export { SuperAnchor$1 as default };
|
1
|
+
import{__decorate as t}from"tslib";import{styles as r}from"@godown/element/decorators/index.js";import{attr as o}from"@godown/element/directives/attr.js";import{htmlSlot as e}from"@godown/element/directives/html-slot.js";import{css as i,html as s}from"lit";import{property as l}from"lit/decorators.js";import{ifDefined as d}from"lit/directives/if-defined.js";import{GlobalStyle as n}from"./global-style.js";let a=class SuperAnchor extends n{constructor(){super(...arguments),this.href=void 0,this.target="_self"}render(){return s`<a part="root" ${o(this.observedRecord)} href="${d(this.href)}" target="${this.target}" @click="${this._handleClick}">${e()}</a>`}_handleClick(t){}};t([l()],a.prototype,"href",void 0),t([l()],a.prototype,"target",void 0),a=t([r(i`:host{display:inline-block;color:currentColor;text-decoration:none;cursor:default}:host([href]){cursor:pointer}[part=root]{width:100%;color:inherit;display:inline-block;text-decoration:inherit}`)],a);var c=a;export{c as default};
|
40
2
|
//# sourceMappingURL=super-anchor.js.map
|
package/core/super-anchor.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"super-anchor.js","sources":["../src/core/super-anchor.ts"],"sourcesContent":null,"names":[
|
1
|
+
{"version":3,"file":"super-anchor.js","sources":["../src/core/super-anchor.ts"],"sourcesContent":null,"names":["SuperAnchor","GlobalStyle","constructor","this","href","undefined","target","render","html","attr","observedRecord","ifDefined","_handleClick","htmlSlot","_","__decorate","property","prototype","styles","css","SuperAnchor$1"],"mappings":"uZAUA,IAAMA,EAAN,MAAMA,oBAAoBC,EAA1B,WAAAC,uBAKEC,KAAIC,UAAWC,EAKfF,KAAMG,OAA4C,QAExC,MAAAC,GACR,OAAOC,CAAI,kBACPC,EAAKN,KAAKO,yBACJC,EAAUR,KAAKC,kBACbD,KAAKG,mBACNH,KAAKS,iBACZC,UAKI,YAAAD,CAAaE,GAAa,GAlBpCC,EAAA,CADCC,KACuBhB,EAAAiB,UAAA,YAAA,GAKxBF,EAAA,CADCC,KACwDhB,EAAAiB,UAAA,cAAA,GAVrDjB,EAAWe,EAAA,CADhBG,EAAOC,CAAG,sMACLnB,GA0BN,IAAAoB,EAAepB"}
|
package/core/super-input.js
CHANGED
@@ -1,118 +1,2 @@
|
|
1
|
-
import {
|
2
|
-
import { part } from '@godown/element/decorators/part.js';
|
3
|
-
import { styles } from '@godown/element/decorators/styles.js';
|
4
|
-
import { htmlSlot } from '@godown/element/directives/index.js';
|
5
|
-
import iconEyeSlashFill from '@godown/f7-icon/icons/eye-slash-fill.js';
|
6
|
-
import { css, html } from 'lit';
|
7
|
-
import { property } from 'lit/decorators.js';
|
8
|
-
import { cssGlobalVars, GlobalStyle } from './global-style.js';
|
9
|
-
|
10
|
-
const fieldStyle = css `.input-field{display:flex;position:relative;align-items:center;border-radius:inherit;height:inherit}.input-field [part=input]{background:0 0;height:100%;width:100%;color:inherit;padding:0 var(${cssGlobalVars.input}-space)}.input-field.outline,.input-field:focus-within{box-shadow:var(${cssGlobalVars.input}-box-shadow)}.input-field [part=icon]{display:flex;align-items:center;justify-content:center}.input-field [part=prefix],.input-field [part=suffix]{height:100%;display:flex}.input-field [part=suffix] [part=icon]{padding-inline-end:var(${cssGlobalVars.input}-space)}.input-field [part=prefix] [part=icon]{padding-inline-start:var(${cssGlobalVars.input}-space)}`;
|
11
|
-
const inputStyle = css `:host{${cssGlobalVars.input}-width:10em;${cssGlobalVars.input}-height:1.6em;${cssGlobalVars.input}-space:.2em;${cssGlobalVars.input}-background:var(${cssGlobalVars.background});${cssGlobalVars.input}-control:var(${cssGlobalVars.foreground});${cssGlobalVars.input}-control-edge:var(${cssGlobalVars.active});${cssGlobalVars.input}-radius:.2em;${cssGlobalVars.input}-box-shadow:0 0 0 .1em var(${cssGlobalVars.active});border-radius:var(${cssGlobalVars.input}-radius)}:host([disabled]){cursor:not-allowed;filter:brightness(.85)}input:disabled{cursor:inherit}input::-ms-clear,input::-ms-reveal{display:none}`;
|
12
|
-
let SuperInput = class SuperInput extends GlobalStyle {
|
13
|
-
constructor() {
|
14
|
-
super(...arguments);
|
15
|
-
this.autofocus = false;
|
16
|
-
this.disabled = false;
|
17
|
-
/**
|
18
|
-
* Returns true when the input is compositing.
|
19
|
-
*/
|
20
|
-
this.compositing = false;
|
21
|
-
this.makeId = Math.random().toString(36).slice(1);
|
22
|
-
this.nameValue = this.namevalue;
|
23
|
-
}
|
24
|
-
set defaultValue(value) {
|
25
|
-
this.default = value;
|
26
|
-
}
|
27
|
-
get defaultValue() {
|
28
|
-
return this.default;
|
29
|
-
}
|
30
|
-
namevalue() {
|
31
|
-
return [this.name, this.value];
|
32
|
-
}
|
33
|
-
reset() {
|
34
|
-
this.value = this.default;
|
35
|
-
this._input.value = this.default;
|
36
|
-
}
|
37
|
-
_handleInput(e) {
|
38
|
-
e.stopPropagation();
|
39
|
-
if (this.compositing) {
|
40
|
-
return;
|
41
|
-
}
|
42
|
-
this.value = e.target.value?.trim();
|
43
|
-
this.dispatchEvent(new CustomEvent("input", {
|
44
|
-
detail: this.value,
|
45
|
-
bubbles: true,
|
46
|
-
composed: true,
|
47
|
-
}));
|
48
|
-
this.dispatchEvent(new CustomEvent("change", { detail: this.value, composed: true }));
|
49
|
-
}
|
50
|
-
connectedCallback() {
|
51
|
-
super.connectedCallback();
|
52
|
-
this._connectedInit();
|
53
|
-
}
|
54
|
-
_connectedInit() {
|
55
|
-
this.default ??= this.value || "";
|
56
|
-
this.value ??= this.default;
|
57
|
-
}
|
58
|
-
_compositionInit() {
|
59
|
-
if (this._input) {
|
60
|
-
this.events.add(this._input, "compositionstart", () => this.compositing = true);
|
61
|
-
this.events.add(this._input, "compositionend", (e) => {
|
62
|
-
this.compositing = false;
|
63
|
-
this._handleInput(e);
|
64
|
-
});
|
65
|
-
}
|
66
|
-
}
|
67
|
-
_changeInputType(t) {
|
68
|
-
if (this._input) {
|
69
|
-
this._input.type = t;
|
70
|
-
}
|
71
|
-
}
|
72
|
-
focus(options) {
|
73
|
-
this._input?.focus(options);
|
74
|
-
}
|
75
|
-
firstUpdated() {
|
76
|
-
this._compositionInit();
|
77
|
-
}
|
78
|
-
_renderPrefix() {
|
79
|
-
return html `<label for="${this.makeId}" part="prefix">${htmlSlot("prefix")}</label>`;
|
80
|
-
}
|
81
|
-
_renderSuffix() {
|
82
|
-
const PASSWORD = "password";
|
83
|
-
return html `<label for="${this.makeId}" part="suffix">${this.type === "password"
|
84
|
-
? html `<i part="icon" @mousedown="${() => this._changeInputType("text")}" @mouseup="${() => this._changeInputType(PASSWORD)}" @mouseleave="${() => this._changeInputType(PASSWORD)}">${iconEyeSlashFill()}</i>`
|
85
|
-
: htmlSlot("suffix")}</label>`;
|
86
|
-
}
|
87
|
-
};
|
88
|
-
__decorate([
|
89
|
-
property()
|
90
|
-
], SuperInput.prototype, "autocomplete", void 0);
|
91
|
-
__decorate([
|
92
|
-
property({ type: Boolean, reflect: true })
|
93
|
-
], SuperInput.prototype, "disabled", void 0);
|
94
|
-
__decorate([
|
95
|
-
property({ reflect: true })
|
96
|
-
], SuperInput.prototype, "type", void 0);
|
97
|
-
__decorate([
|
98
|
-
property({ reflect: true })
|
99
|
-
], SuperInput.prototype, "placeholder", void 0);
|
100
|
-
__decorate([
|
101
|
-
property({ reflect: true })
|
102
|
-
], SuperInput.prototype, "name", void 0);
|
103
|
-
__decorate([
|
104
|
-
property()
|
105
|
-
], SuperInput.prototype, "value", void 0);
|
106
|
-
__decorate([
|
107
|
-
property()
|
108
|
-
], SuperInput.prototype, "default", void 0);
|
109
|
-
__decorate([
|
110
|
-
part("input")
|
111
|
-
], SuperInput.prototype, "_input", void 0);
|
112
|
-
SuperInput = __decorate([
|
113
|
-
styles(fieldStyle, inputStyle)
|
114
|
-
], SuperInput);
|
115
|
-
var SuperInput$1 = SuperInput;
|
116
|
-
|
117
|
-
export { SuperInput$1 as default };
|
1
|
+
import{__decorate as t}from"tslib";import{part as e}from"@godown/element/decorators/part.js";import{styles as i}from"@godown/element/decorators/styles.js";import{htmlSlot as o}from"@godown/element/directives/index.js";import n from"@godown/f7-icon/icons/eye-slash-fill.js";import{css as s,html as a}from"lit";import{property as p}from"lit/decorators.js";import{cssGlobalVars as r,GlobalStyle as u}from"./global-style.js";const d=s`.input-field{display:flex;position:relative;align-items:center;border-radius:inherit;height:inherit}.input-field [part=input]{background:0 0;height:100%;width:100%;color:inherit;padding:0 var(${r.input}-space)}.input-field.outline,.input-field:focus-within{box-shadow:var(${r.input}-box-shadow)}.input-field [part=icon]{display:flex;align-items:center;justify-content:center}.input-field [part=prefix],.input-field [part=suffix]{height:100%;display:flex}.input-field [part=suffix] [part=icon]{padding-inline-end:var(${r.input}-space)}.input-field [part=prefix] [part=icon]{padding-inline-start:var(${r.input}-space)}`,l=s`:host{${r.input}-width:10em;${r.input}-height:1.6em;${r.input}-space:.2em;${r.input}-background:var(${r.background});${r.input}-control:var(${r.foreground});${r.input}-control-edge:var(${r.active});${r.input}-radius:.2em;${r.input}-box-shadow:0 0 0 .1em var(${r.active});border-radius:var(${r.input}-radius)}:host([disabled]){cursor:not-allowed;filter:brightness(.85)}input:disabled{cursor:inherit}input::-ms-clear,input::-ms-reveal{display:none}`;let h=class SuperInput extends u{constructor(){super(...arguments),this.autofocus=!1,this.disabled=!1,this.compositing=!1,this.makeId=Math.random().toString(36).slice(1),this.nameValue=this.namevalue}set defaultValue(t){this.default=t}get defaultValue(){return this.default}namevalue(){return[this.name,this.value]}reset(){this.value=this.default,this._input.value=this.default}_handleInput(t){t.stopPropagation(),this.compositing||(this.value=t.target.value?.trim(),this.dispatchEvent(new CustomEvent("input",{detail:this.value,bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("change",{detail:this.value,composed:!0})))}connectedCallback(){super.connectedCallback(),this._connectedInit()}_connectedInit(){this.default??=this.value||"",this.value??=this.default}_compositionInit(){this._input&&(this.events.add(this._input,"compositionstart",(()=>this.compositing=!0)),this.events.add(this._input,"compositionend",(t=>{this.compositing=!1,this._handleInput(t)})))}_changeInputType(t){this._input&&(this._input.type=t)}focus(t){this._input?.focus(t)}firstUpdated(){this._compositionInit()}_renderPrefix(){return a`<label for="${this.makeId}" part="prefix">${o("prefix")}</label>`}_renderSuffix(){const t="password";return a`<label for="${this.makeId}" part="suffix">${"password"===this.type?a`<i part="icon" @mousedown="${()=>this._changeInputType("text")}" @mouseup="${()=>this._changeInputType(t)}" @mouseleave="${()=>this._changeInputType(t)}">${n()}</i>`:o("suffix")}</label>`}};t([p()],h.prototype,"autocomplete",void 0),t([p({type:Boolean,reflect:!0})],h.prototype,"disabled",void 0),t([p({reflect:!0})],h.prototype,"type",void 0),t([p({reflect:!0})],h.prototype,"placeholder",void 0),t([p({reflect:!0})],h.prototype,"name",void 0),t([p()],h.prototype,"value",void 0),t([p()],h.prototype,"default",void 0),t([e("input")],h.prototype,"_input",void 0),h=t([i(d,l)],h);var c=h;export{c as default};
|
118
2
|
//# sourceMappingURL=super-input.js.map
|
package/core/super-input.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"super-input.js","sources":["../src/core/super-input.ts"],"sourcesContent":null,"names":[
|
1
|
+
{"version":3,"file":"super-input.js","sources":["../src/core/super-input.ts"],"sourcesContent":null,"names":["fieldStyle","css","cssGlobalVars","input","inputStyle","background","foreground","active","SuperInput","GlobalStyle","constructor","this","autofocus","disabled","compositing","makeId","Math","random","toString","slice","nameValue","namevalue","defaultValue","value","default","name","reset","_input","_handleInput","e","stopPropagation","target","trim","dispatchEvent","CustomEvent","detail","bubbles","composed","connectedCallback","super","_connectedInit","_compositionInit","events","add","_changeInputType","t","type","focus","options","firstUpdated","_renderPrefix","html","htmlSlot","_renderSuffix","PASSWORD","iconEyeSlashFill","__decorate","property","prototype","Boolean","reflect","part","styles","SuperInput$1"],"mappings":"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"}
|
package/core/super-openable.js
CHANGED
@@ -1,38 +1,2 @@
|
|
1
|
-
import {
|
2
|
-
import { property } from 'lit/decorators.js';
|
3
|
-
import { GlobalStyle } from './global-style.js';
|
4
|
-
|
5
|
-
class SuperOpenable extends GlobalStyle {
|
6
|
-
constructor() {
|
7
|
-
super(...arguments);
|
8
|
-
/**
|
9
|
-
* Open the content.
|
10
|
-
*/
|
11
|
-
this.open = false;
|
12
|
-
}
|
13
|
-
toggle(to = (!this.open)) {
|
14
|
-
this.open = to;
|
15
|
-
}
|
16
|
-
close() {
|
17
|
-
this.open = false;
|
18
|
-
}
|
19
|
-
show() {
|
20
|
-
this.open = true;
|
21
|
-
}
|
22
|
-
updated(changedProperties) {
|
23
|
-
const open = changedProperties.get("open");
|
24
|
-
if (open !== undefined) {
|
25
|
-
this.dispatchEvent(new CustomEvent("change", { detail: this.open }));
|
26
|
-
}
|
27
|
-
}
|
28
|
-
// eslint-disable-next-line
|
29
|
-
_handelClick(_) {
|
30
|
-
this.toggle();
|
31
|
-
}
|
32
|
-
}
|
33
|
-
__decorate([
|
34
|
-
property({ type: Boolean, reflect: true })
|
35
|
-
], SuperOpenable.prototype, "open", void 0);
|
36
|
-
|
37
|
-
export { SuperOpenable as default };
|
1
|
+
import{__decorate as e}from"tslib";import{property as t}from"lit/decorators.js";import{GlobalStyle as o}from"./global-style.js";class SuperOpenable extends o{constructor(){super(...arguments),this.open=!1}toggle(e=!this.open){this.open=e}close(){this.open=!1}show(){this.open=!0}updated(e){void 0!==e.get("open")&&this.dispatchEvent(new CustomEvent("change",{detail:this.open}))}_handelClick(e){this.toggle()}}e([t({type:Boolean,reflect:!0})],SuperOpenable.prototype,"open",void 0);export{SuperOpenable as default};
|
38
2
|
//# sourceMappingURL=super-openable.js.map
|