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/dialog.js
CHANGED
@@ -1,99 +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, cssGlobalVars } from '../core/global-style.js';
|
9
|
-
import SuperOpenable from '../core/super-openable.js';
|
10
|
-
|
11
|
-
const protoName = "dialog";
|
12
|
-
const cssScope = scopePrefix(protoName);
|
13
|
-
/**
|
14
|
-
* {@linkcode Dialog} similar to `<dialog>`.
|
15
|
-
*
|
16
|
-
* Like dialog, it listens for submit events and closes itself when the target method is "dialog".
|
17
|
-
*
|
18
|
-
* It listens for the keydown event and also closes itself when the {@linkcode key} contained in the key is pressed.
|
19
|
-
*
|
20
|
-
* @category feedback
|
21
|
-
*/
|
22
|
-
let Dialog = class Dialog extends SuperOpenable {
|
23
|
-
constructor() {
|
24
|
-
super(...arguments);
|
25
|
-
/**
|
26
|
-
* Direction of the opening animation.
|
27
|
-
*/
|
28
|
-
this.direction = "center";
|
29
|
-
/**
|
30
|
-
* Enable modal, blocking event penetration.
|
31
|
-
*/
|
32
|
-
this.modal = false;
|
33
|
-
/**
|
34
|
-
* Close key.
|
35
|
-
*/
|
36
|
-
this.key = "Escape";
|
37
|
-
this._modalInvoke = false;
|
38
|
-
}
|
39
|
-
render() {
|
40
|
-
return html `<div part="root" ${attr(this.observedRecord)}><div part="modal"></div><div part="container">${htmlSlot()}</div></div>`;
|
41
|
-
}
|
42
|
-
showModal() {
|
43
|
-
if (!this.modal) {
|
44
|
-
this.modal = true;
|
45
|
-
this._modalInvoke = true;
|
46
|
-
}
|
47
|
-
this.show();
|
48
|
-
}
|
49
|
-
updated(changedProperties) {
|
50
|
-
if (changedProperties.has("open")) {
|
51
|
-
if (this.open) {
|
52
|
-
this._submitEvent = this.events.add(this, "submit", this._handelSubmit);
|
53
|
-
if (this.key) {
|
54
|
-
this._keydownEvent = this.events.add(document, "keydown", this._handleKeydown.bind(this));
|
55
|
-
}
|
56
|
-
}
|
57
|
-
else {
|
58
|
-
this.events.remove(this, "submit", this._submitEvent);
|
59
|
-
this.events.remove(document, "keydown", this._keydownEvent);
|
60
|
-
}
|
61
|
-
}
|
62
|
-
}
|
63
|
-
_handleKeydown(e) {
|
64
|
-
e.preventDefault();
|
65
|
-
const keys = this.key.split(/[\s,]/);
|
66
|
-
if (keys.includes(e.key) || keys.includes(e.code)) {
|
67
|
-
this.close();
|
68
|
-
}
|
69
|
-
}
|
70
|
-
_handelSubmit(e) {
|
71
|
-
if (e.target.method === "dialog") {
|
72
|
-
this.close();
|
73
|
-
}
|
74
|
-
}
|
75
|
-
close() {
|
76
|
-
if (this._modalInvoke) {
|
77
|
-
this.modal = false;
|
78
|
-
this._modalInvoke = false;
|
79
|
-
}
|
80
|
-
this.open = false;
|
81
|
-
}
|
82
|
-
};
|
83
|
-
__decorate([
|
84
|
-
property()
|
85
|
-
], Dialog.prototype, "direction", void 0);
|
86
|
-
__decorate([
|
87
|
-
property({ type: Boolean, reflect: true })
|
88
|
-
], Dialog.prototype, "modal", void 0);
|
89
|
-
__decorate([
|
90
|
-
property()
|
91
|
-
], Dialog.prototype, "key", void 0);
|
92
|
-
Dialog = __decorate([
|
93
|
-
godown(protoName),
|
94
|
-
styles(css `:host{${cssScope}--background:none;${cssScope}--background-modal:var(${cssGlobalVars.background});${cssScope}--opacity-modal:0.2;background:var(${cssScope}--background);pointer-events:none;visibility:hidden;position:fixed;z-index:1;inset:0}:host([open]){visibility:visible}:host([open][modal]) [part=modal]{pointer-events:all;visibility:visible;opacity:var(${cssScope}--opacity-modal)}[part=modal]{visibility:hidden;opacity:0;width:100%;height:100%;position:absolute;background:var(${cssScope}--background-modal)}[part=root]{width:100%;height:100%;display:flex;position:relative;align-items:center;justify-content:center}[part=container]{pointer-events:all;position:absolute}[direction^=top] [part=container]{top:0}[direction^=bottom] [part=container]{bottom:0}[direction$=right] [part=container]{right:0}[direction$=left] [part=container]{left:0}`)
|
95
|
-
], Dialog);
|
96
|
-
var Dialog$1 = Dialog;
|
97
|
-
|
98
|
-
export { Dialog$1 as default };
|
1
|
+
import{__decorate as t}from"tslib";import{godown as o}from"@godown/element/decorators/godown.js";import{styles as e}from"@godown/element/decorators/styles.js";import{attr as i}from"@godown/element/directives/attr.js";import{htmlSlot as n}from"@godown/element/directives/html-slot.js";import{css as s,html as r}from"lit";import{property as d}from"lit/decorators.js";import{scopePrefix as a,cssGlobalVars as l}from"../core/global-style.js";import m from"../core/super-openable.js";const p="dialog",h=a(p);let c=class Dialog extends m{constructor(){super(...arguments),this.direction="center",this.modal=!1,this.key="Escape",this._modalInvoke=!1}render(){return r`<div part="root" ${i(this.observedRecord)}><div part="modal"></div><div part="container">${n()}</div></div>`}showModal(){this.modal||(this.modal=!0,this._modalInvoke=!0),this.show()}updated(t){t.has("open")&&(this.open?(this._submitEvent=this.events.add(this,"submit",this._handelSubmit),this.key&&(this._keydownEvent=this.events.add(document,"keydown",this._handleKeydown.bind(this)))):(this.events.remove(this,"submit",this._submitEvent),this.events.remove(document,"keydown",this._keydownEvent)))}_handleKeydown(t){t.preventDefault();const o=this.key.split(/[\s,]/);(o.includes(t.key)||o.includes(t.code))&&this.close()}_handelSubmit(t){"dialog"===t.target.method&&this.close()}close(){this._modalInvoke&&(this.modal=!1,this._modalInvoke=!1),this.open=!1}};t([d()],c.prototype,"direction",void 0),t([d({type:Boolean,reflect:!0})],c.prototype,"modal",void 0),t([d()],c.prototype,"key",void 0),c=t([o(p),e(s`:host{${h}--background:none;${h}--background-modal:var(${l.background});${h}--opacity-modal:0.2;background:var(${h}--background);pointer-events:none;visibility:hidden;position:fixed;z-index:1;inset:0}:host([open]){visibility:visible}:host([open][modal]) [part=modal]{pointer-events:all;visibility:visible;opacity:var(${h}--opacity-modal)}[part=modal]{visibility:hidden;opacity:0;width:100%;height:100%;position:absolute;background:var(${h}--background-modal)}[part=root]{width:100%;height:100%;display:flex;position:relative;align-items:center;justify-content:center}[part=container]{pointer-events:all;position:absolute}[direction^=top] [part=container]{top:0}[direction^=bottom] [part=container]{bottom:0}[direction$=right] [part=container]{right:0}[direction$=left] [part=container]{left:0}`)],c);var v=c;export{v as default};
|
99
2
|
//# sourceMappingURL=dialog.js.map
|
package/components/dialog.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"dialog.js","sources":["../src/components/dialog.ts"],"sourcesContent":null,"names":[
|
1
|
+
{"version":3,"file":"dialog.js","sources":["../src/components/dialog.ts"],"sourcesContent":null,"names":["protoName","cssScope","scopePrefix","Dialog","SuperOpenable","constructor","this","direction","modal","key","_modalInvoke","render","html","attr","observedRecord","htmlSlot","showModal","show","updated","changedProperties","has","open","_submitEvent","events","add","_handelSubmit","_keydownEvent","document","_handleKeydown","bind","remove","e","preventDefault","keys","split","includes","code","close","target","method","__decorate","property","prototype","type","Boolean","reflect","godown","styles","css","cssGlobalVars","background","Dialog$1"],"mappings":"+dAWA,MAAMA,EAAY,SACZC,EAAWC,EAAYF,GAe7B,IAAMG,EAAN,MAAMA,eAAeC,EAArB,WAAAC,uBAKEC,KAASC,UAAe,SAMxBD,KAAKE,OAAG,EAMRF,KAAGG,IAAG,SAEEH,KAAYI,cAAG,EAEb,MAAAC,GACR,OAAOC,CAAI,oBAAoBC,EAAKP,KAAKQ,iEAEfC,kBAI5B,SAAAC,GACOV,KAAKE,QACRF,KAAKE,OAAQ,EACbF,KAAKI,cAAe,GAEtBJ,KAAKW,OAMG,OAAAC,CAAQC,GACZA,EAAkBC,IAAI,UACpBd,KAAKe,MACPf,KAAKgB,aAAehB,KAAKiB,OAAOC,IAAIlB,KAAM,SAAUA,KAAKmB,eACrDnB,KAAKG,MACPH,KAAKoB,cAAgBpB,KAAKiB,OAAOC,IAAIG,SAAU,UAAWrB,KAAKsB,eAAeC,KAAKvB,UAGrFA,KAAKiB,OAAOO,OAAOxB,KAAM,SAAUA,KAAKgB,cACxChB,KAAKiB,OAAOO,OAAOH,SAAU,UAAWrB,KAAKoB,iBAKzC,cAAAE,CAAeG,GACvBA,EAAEC,iBACF,MAAMC,EAAO3B,KAAKG,IAAIyB,MAAM,UACxBD,EAAKE,SAASJ,EAAEtB,MAAQwB,EAAKE,SAASJ,EAAEK,QAC1C9B,KAAK+B,QAIC,aAAAZ,CAAcM,GACE,WAApBA,EAAEO,OAAOC,QACXjC,KAAK+B,QAIT,KAAAA,GACM/B,KAAKI,eACPJ,KAAKE,OAAQ,EACbF,KAAKI,cAAe,GAEtBJ,KAAKe,MAAO,IAnEdmB,EAAA,CADCC,KAC+BtC,EAAAuC,UAAA,iBAAA,GAMhCF,EAAA,CADCC,EAAS,CAAEE,KAAMC,QAASC,SAAS,KACvB1C,EAAAuC,UAAA,aAAA,GAMbF,EAAA,CADCC,KACatC,EAAAuC,UAAA,WAAA,GAjBVvC,EAAMqC,EAAA,CAJXM,EAAO9C,GACP+C,EACCC,CAAG,SAAS/C,sBAA6BA,2BAAkCgD,EAAcC,eAAejD,uCAA8CA,8MAAqNA,sHAA6HA,wWAEpeE,GA4EN,IAAAgD,EAAehD"}
|
package/components/divider.js
CHANGED
@@ -1,36 +1,2 @@
|
|
1
|
-
import {
|
2
|
-
import { godown, styles } from '@godown/element/decorators/index.js';
|
3
|
-
import { attr } from '@godown/element/directives/attr.js';
|
4
|
-
import { css, html } from 'lit';
|
5
|
-
import { property } from 'lit/decorators.js';
|
6
|
-
import { GlobalStyle } from '../core/global-style.js';
|
7
|
-
|
8
|
-
const protoName = "divider";
|
9
|
-
/**
|
10
|
-
* {@linkcode Divider} similar to `<hr>`.
|
11
|
-
*
|
12
|
-
* @category layout
|
13
|
-
*/
|
14
|
-
let Divider = class Divider extends GlobalStyle {
|
15
|
-
constructor() {
|
16
|
-
super(...arguments);
|
17
|
-
/**
|
18
|
-
* Vertical display.
|
19
|
-
*/
|
20
|
-
this.vertical = false;
|
21
|
-
}
|
22
|
-
render() {
|
23
|
-
return html `<div part="root" ${attr(this.observedRecord)}></div>`;
|
24
|
-
}
|
25
|
-
};
|
26
|
-
__decorate([
|
27
|
-
property({ type: Boolean, reflect: true })
|
28
|
-
], Divider.prototype, "vertical", void 0);
|
29
|
-
Divider = __decorate([
|
30
|
-
godown(protoName),
|
31
|
-
styles(css `:host{width:100%;height:.05em;margin:auto;display:block;background:currentColor}:host([vertical]){width:.05em;height:max(1em,100%)}:host([contents]) [part=root]{width:100%;height:.05em;margin:auto;display:block;background:currentColor}[part=root]{display:contents}`)
|
32
|
-
], Divider);
|
33
|
-
var Divider$1 = Divider;
|
34
|
-
|
35
|
-
export { Divider$1 as default };
|
1
|
+
import{__decorate as t}from"tslib";import{godown as o,styles as r}from"@godown/element/decorators/index.js";import{attr as e}from"@godown/element/directives/attr.js";import{css as i,html as s}from"lit";import{property as a}from"lit/decorators.js";import{GlobalStyle as d}from"../core/global-style.js";let l=class Divider extends d{constructor(){super(...arguments),this.vertical=!1}render(){return s`<div part="root" ${e(this.observedRecord)}></div>`}};t([a({type:Boolean,reflect:!0})],l.prototype,"vertical",void 0),l=t([o("divider"),r(i`:host{width:100%;height:.05em;margin:auto;display:block;background:currentColor}:host([vertical]){width:.05em;height:max(1em,100%)}:host([contents]) [part=root]{width:100%;height:.05em;margin:auto;display:block;background:currentColor}[part=root]{display:contents}`)],l);var m=l;export{m as default};
|
36
2
|
//# sourceMappingURL=divider.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"divider.js","sources":["../src/components/divider.ts"],"sourcesContent":null,"names":[
|
1
|
+
{"version":3,"file":"divider.js","sources":["../src/components/divider.ts"],"sourcesContent":null,"names":["Divider","GlobalStyle","constructor","this","vertical","render","html","attr","observedRecord","__decorate","property","type","Boolean","reflect","prototype","godown","styles","css","Divider$1"],"mappings":"6SAkBA,IAAMA,EAAN,MAAMA,gBAAgBC,EAAtB,WAAAC,uBAKEC,KAAQC,UAAG,EAED,MAAAC,GACR,OAAOC,CAAI,oBAAoBC,EAAKJ,KAAKK,2BAH3CC,EAAA,CADCC,EAAS,CAAEC,KAAMC,QAASC,SAAS,KACpBb,EAAAc,UAAA,gBAAA,GALZd,EAAOS,EAAA,CAJZM,EAPiB,WAQjBC,EACCC,CAAG,6QAECjB,GAYN,IAAAkB,EAAelB"}
|
package/components/dragbox.js
CHANGED
@@ -1,112 +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 { GlobalStyle } from '../core/global-style.js';
|
9
|
-
|
10
|
-
const protoName = "dragbox";
|
11
|
-
/**
|
12
|
-
* {@linkcode Dragbox} does not extend beyond the range of {@linkcode Dragbox.offsetsWidth} and {@linkcode Dragbox.offsetsHeight}.
|
13
|
-
*
|
14
|
-
* @category wrapper
|
15
|
-
*/
|
16
|
-
let Dragbox = class Dragbox extends GlobalStyle {
|
17
|
-
constructor() {
|
18
|
-
super(...arguments);
|
19
|
-
this.drag = false;
|
20
|
-
/**
|
21
|
-
* Position x.
|
22
|
-
*/
|
23
|
-
this.x = "auto";
|
24
|
-
/**
|
25
|
-
* Position y.
|
26
|
-
*/
|
27
|
-
this.y = "auto";
|
28
|
-
}
|
29
|
-
/**
|
30
|
-
* Width of (`this.offsetParent` or `document.body`).
|
31
|
-
*/
|
32
|
-
get offsetsWidth() {
|
33
|
-
return this.offsetParent?.clientWidth ?? document.body.offsetWidth;
|
34
|
-
}
|
35
|
-
/**
|
36
|
-
* Height of (`this.offsetParent` or `document.body`).
|
37
|
-
*/
|
38
|
-
get offsetsHeight() {
|
39
|
-
return this.offsetParent?.clientHeight ?? document.body.offsetHeight;
|
40
|
-
}
|
41
|
-
render() {
|
42
|
-
return html `<div part="root" ${attr(this.observedRecord)} @mousedown="${this._handleDragStart}" @mouseup="${this._handleDragEnd}">${htmlSlot()}</div>`;
|
43
|
-
}
|
44
|
-
firstUpdated() {
|
45
|
-
this.reset();
|
46
|
-
}
|
47
|
-
_handleDragStart(e) {
|
48
|
-
this.cx = e.clientX;
|
49
|
-
this.cy = e.clientY;
|
50
|
-
this.t = this.offsetTop;
|
51
|
-
this.l = this.offsetLeft;
|
52
|
-
this.drag = true;
|
53
|
-
this._handleMouseMove = this.events.add(document, "mousemove", this._handleDrag.bind(this));
|
54
|
-
this._handleMouseLeave = this.events.add(document, "mouseleave", this._handleDragEnd.bind(this));
|
55
|
-
}
|
56
|
-
_handleDragEnd() {
|
57
|
-
this.drag = false;
|
58
|
-
this.events.remove(document, "mousemove", this._handleMouseMove);
|
59
|
-
this.events.remove(document, "mouseleave", this._handleMouseLeave);
|
60
|
-
}
|
61
|
-
_handleDrag(e) {
|
62
|
-
if (!this.drag) {
|
63
|
-
return;
|
64
|
-
}
|
65
|
-
const nl = e.clientX - (this.cx - this.l);
|
66
|
-
const nt = e.clientY - (this.cy - this.t);
|
67
|
-
const { style, offsetsWidth, offsetsHeight, offsetWidth, offsetHeight } = this;
|
68
|
-
if (nl < 0) {
|
69
|
-
style.left = "0";
|
70
|
-
}
|
71
|
-
else if (nl < offsetsWidth - offsetWidth) {
|
72
|
-
style.left = `${nl}px`;
|
73
|
-
}
|
74
|
-
else {
|
75
|
-
style.left = `${offsetsWidth - offsetWidth}"px"`;
|
76
|
-
}
|
77
|
-
if (nt < 0) {
|
78
|
-
style.top = "0";
|
79
|
-
}
|
80
|
-
else if (nt < offsetsHeight - offsetHeight) {
|
81
|
-
style.top = `${nt}px`;
|
82
|
-
}
|
83
|
-
else {
|
84
|
-
style.top = `${offsetsHeight - offsetHeight}px`;
|
85
|
-
}
|
86
|
-
}
|
87
|
-
reset() {
|
88
|
-
const { x, y, style, offsetsWidth, offsetsHeight, offsetWidth, offsetHeight, offsetLeft, offsetTop } = this;
|
89
|
-
style.left = x || "0";
|
90
|
-
style.top = y || "0";
|
91
|
-
if (offsetLeft > offsetsWidth - offsetWidth) {
|
92
|
-
style.left = `${offsetsWidth - offsetWidth}px`;
|
93
|
-
}
|
94
|
-
if (offsetTop > offsetsHeight - offsetHeight) {
|
95
|
-
style.top = `${offsetsHeight - offsetHeight}px`;
|
96
|
-
}
|
97
|
-
}
|
98
|
-
};
|
99
|
-
__decorate([
|
100
|
-
property()
|
101
|
-
], Dragbox.prototype, "x", void 0);
|
102
|
-
__decorate([
|
103
|
-
property()
|
104
|
-
], Dragbox.prototype, "y", void 0);
|
105
|
-
Dragbox = __decorate([
|
106
|
-
godown(protoName),
|
107
|
-
styles(css `:host{position:absolute;display:block}:host(:active){-webkit-user-select:none;user-select:none}`)
|
108
|
-
], Dragbox);
|
109
|
-
var Dragbox$1 = Dragbox;
|
110
|
-
|
111
|
-
export { Dragbox$1 as default };
|
1
|
+
import{__decorate as t}from"tslib";import{godown as e}from"@godown/element/decorators/godown.js";import{styles as s}from"@godown/element/decorators/styles.js";import{attr as o}from"@godown/element/directives/attr.js";import{htmlSlot as i}from"@godown/element/directives/html-slot.js";import{css as r,html as h}from"lit";import{property as d}from"lit/decorators.js";import{GlobalStyle as n}from"../core/global-style.js";let f=class Dragbox extends n{constructor(){super(...arguments),this.drag=!1,this.x="auto",this.y="auto"}get offsetsWidth(){return this.offsetParent?.clientWidth??document.body.offsetWidth}get offsetsHeight(){return this.offsetParent?.clientHeight??document.body.offsetHeight}render(){return h`<div part="root" ${o(this.observedRecord)} @mousedown="${this._handleDragStart}" @mouseup="${this._handleDragEnd}">${i()}</div>`}firstUpdated(){this.reset()}_handleDragStart(t){this.cx=t.clientX,this.cy=t.clientY,this.t=this.offsetTop,this.l=this.offsetLeft,this.drag=!0,this._handleMouseMove=this.events.add(document,"mousemove",this._handleDrag.bind(this)),this._handleMouseLeave=this.events.add(document,"mouseleave",this._handleDragEnd.bind(this))}_handleDragEnd(){this.drag=!1,this.events.remove(document,"mousemove",this._handleMouseMove),this.events.remove(document,"mouseleave",this._handleMouseLeave)}_handleDrag(t){if(!this.drag)return;const e=t.clientX-(this.cx-this.l),s=t.clientY-(this.cy-this.t),{style:o,offsetsWidth:i,offsetsHeight:r,offsetWidth:h,offsetHeight:d}=this;o.left=e<0?"0":e<i-h?`${e}px`:i-h+'"px"',o.top=s<0?"0":s<r-d?`${s}px`:r-d+"px"}reset(){const{x:t,y:e,style:s,offsetsWidth:o,offsetsHeight:i,offsetWidth:r,offsetHeight:h,offsetLeft:d,offsetTop:n}=this;s.left=t||"0",s.top=e||"0",d>o-r&&(s.left=o-r+"px"),n>i-h&&(s.top=i-h+"px")}};t([d()],f.prototype,"x",void 0),t([d()],f.prototype,"y",void 0),f=t([e("dragbox"),s(r`:host{position:absolute;display:block}:host(:active){-webkit-user-select:none;user-select:none}`)],f);var a=f;export{a as default};
|
112
2
|
//# sourceMappingURL=dragbox.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"dragbox.js","sources":["../src/components/dragbox.ts"],"sourcesContent":null,"names":[
|
1
|
+
{"version":3,"file":"dragbox.js","sources":["../src/components/dragbox.ts"],"sourcesContent":null,"names":["Dragbox","GlobalStyle","constructor","this","drag","x","y","offsetsWidth","offsetParent","clientWidth","document","body","offsetWidth","offsetsHeight","clientHeight","offsetHeight","render","html","attr","observedRecord","_handleDragStart","_handleDragEnd","htmlSlot","firstUpdated","reset","e","cx","clientX","cy","clientY","t","offsetTop","l","offsetLeft","_handleMouseMove","events","add","_handleDrag","bind","_handleMouseLeave","remove","nl","nt","style","left","top","__decorate","property","prototype","godown","styles","css","Dragbox$1"],"mappings":"maAqBA,IAAMA,EAAN,MAAMA,gBAAgBC,EAAtB,WAAAC,uBAeUC,KAAIC,MAAG,EAUfD,KAACE,EAAG,OAMJF,KAACG,EAAG,OA3BJ,gBAAIC,GACF,OAAOJ,KAAKK,cAAcC,aAAeC,SAASC,KAAKC,YAMzD,iBAAIC,GACF,OAAOV,KAAKK,cAAcM,cAAgBJ,SAASC,KAAKI,aAqBhD,MAAAC,GACR,OAAOC,CAAI,oBAEPC,EAAKf,KAAKgB,+BACEhB,KAAKiB,+BACPjB,KAAKkB,mBACfC,YAII,YAAAC,GACRpB,KAAKqB,QAGG,gBAAAJ,CAAiBK,GACzBtB,KAAKuB,GAAKD,EAAEE,QACZxB,KAAKyB,GAAKH,EAAEI,QACZ1B,KAAK2B,EAAI3B,KAAK4B,UACd5B,KAAK6B,EAAI7B,KAAK8B,WACd9B,KAAKC,MAAO,EACZD,KAAK+B,iBAAmB/B,KAAKgC,OAAOC,IAAI1B,SAAU,YAAaP,KAAKkC,YAAYC,KAAKnC,OACrFA,KAAKoC,kBAAoBpC,KAAKgC,OAAOC,IAAI1B,SAAU,aAAcP,KAAKkB,eAAeiB,KAAKnC,OAMlF,cAAAkB,GACRlB,KAAKC,MAAO,EACZD,KAAKgC,OAAOK,OAAO9B,SAAU,YAAaP,KAAK+B,kBAC/C/B,KAAKgC,OAAOK,OAAO9B,SAAU,aAAcP,KAAKoC,mBAGxC,WAAAF,CAAYZ,GACpB,IAAKtB,KAAKC,KACR,OAEF,MAAMqC,EAAKhB,EAAEE,SAAWxB,KAAKuB,GAAKvB,KAAK6B,GACjCU,EAAKjB,EAAEI,SAAW1B,KAAKyB,GAAKzB,KAAK2B,IACjCa,MAAEA,EAAKpC,aAAEA,EAAYM,cAAEA,EAAaD,YAAEA,EAAWG,aAAEA,GAAiBZ,KAExEwC,EAAMC,KADJH,EAAK,EACM,IACJA,EAAKlC,EAAeK,EAChB,GAAG6B,MAEAlC,EAAeK,EAAlB,OAGb+B,EAAME,IADJH,EAAK,EACK,IACHA,EAAK7B,EAAgBE,EAClB,GAAG2B,MAEA7B,EAAgBE,EAAnB,KAIhB,KAAAS,GACE,MAAMnB,EAAEA,EAACC,EAAEA,EAACqC,MAAEA,EAAKpC,aAAEA,EAAYM,cAAEA,EAAaD,YAAEA,EAAWG,aAAEA,EAAYkB,WAAEA,EAAUF,UAAEA,GAAc5B,KACvGwC,EAAMC,KAAOvC,GAAK,IAClBsC,EAAME,IAAMvC,GAAK,IACb2B,EAAa1B,EAAeK,IAC9B+B,EAAMC,KAAUrC,EAAeK,EAAlB,MAEXmB,EAAYlB,EAAgBE,IAC9B4B,EAAME,IAAShC,EAAgBE,EAAnB,QAxEhB+B,EAAA,CADCC,KACS/C,EAAAgD,UAAA,SAAA,GAMVF,EAAA,CADCC,KACS/C,EAAAgD,UAAA,SAAA,GA/BNhD,EAAO8C,EAAA,CAJZG,EAPiB,WAQjBC,EACCC,CAAG,oGAECnD,GAsGN,IAAAoD,EAAepD"}
|
package/components/flex.js
CHANGED
@@ -1,64 +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 { htmlStyle } from '@godown/element/directives/html-style.js';
|
7
|
-
import { joinRules } from '@godown/element/tools/css.js';
|
8
|
-
import { css, html } from 'lit';
|
9
|
-
import { property } from 'lit/decorators.js';
|
10
|
-
import { GlobalStyle } from '../core/global-style.js';
|
11
|
-
|
12
|
-
const protoName = "flex";
|
13
|
-
/**
|
14
|
-
* {@linkcode Flex} provides flex layout.
|
15
|
-
*
|
16
|
-
* @slot - Flex items.
|
17
|
-
* @category layout
|
18
|
-
*/
|
19
|
-
let Flex = class Flex extends GlobalStyle {
|
20
|
-
constructor() {
|
21
|
-
super(...arguments);
|
22
|
-
/**
|
23
|
-
* If true, set flex-direction to "column".
|
24
|
-
*/
|
25
|
-
this.vertical = false;
|
26
|
-
}
|
27
|
-
render() {
|
28
|
-
return html `<div part="root" ${attr(this.observedRecord)}>${[
|
29
|
-
htmlSlot(),
|
30
|
-
htmlStyle(joinRules({
|
31
|
-
":host": {
|
32
|
-
gap: this.gap,
|
33
|
-
"flex-flow": this.flexFlow,
|
34
|
-
"flex-direction": this.vertical && "column",
|
35
|
-
"align-items": this.items,
|
36
|
-
"justify-content": this.content,
|
37
|
-
},
|
38
|
-
})),
|
39
|
-
]}</div>`;
|
40
|
-
}
|
41
|
-
};
|
42
|
-
__decorate([
|
43
|
-
property({ attribute: "flex-flow" })
|
44
|
-
], Flex.prototype, "flexFlow", void 0);
|
45
|
-
__decorate([
|
46
|
-
property()
|
47
|
-
], Flex.prototype, "gap", void 0);
|
48
|
-
__decorate([
|
49
|
-
property()
|
50
|
-
], Flex.prototype, "content", void 0);
|
51
|
-
__decorate([
|
52
|
-
property()
|
53
|
-
], Flex.prototype, "items", void 0);
|
54
|
-
__decorate([
|
55
|
-
property({ type: Boolean })
|
56
|
-
], Flex.prototype, "vertical", void 0);
|
57
|
-
Flex = __decorate([
|
58
|
-
godown(protoName),
|
59
|
-
styles(css `:host,:host([contents]) [part=root]{display:flex}[part=root]{display:contents}`)
|
60
|
-
], Flex);
|
61
|
-
var Flex$1 = Flex;
|
62
|
-
|
63
|
-
export { Flex$1 as default };
|
1
|
+
import{__decorate as t}from"tslib";import{godown as o}from"@godown/element/decorators/godown.js";import{styles as e}from"@godown/element/decorators/styles.js";import{attr as r}from"@godown/element/directives/attr.js";import{htmlSlot as s}from"@godown/element/directives/html-slot.js";import{htmlStyle as i}from"@godown/element/directives/html-style.js";import{joinRules as l}from"@godown/element/tools/css.js";import{css as m,html as n}from"lit";import{property as p}from"lit/decorators.js";import{GlobalStyle as d}from"../core/global-style.js";let a=class Flex extends d{constructor(){super(...arguments),this.vertical=!1}render(){return n`<div part="root" ${r(this.observedRecord)}>${[s(),i(l({":host":{gap:this.gap,"flex-flow":this.flexFlow,"flex-direction":this.vertical&&"column","align-items":this.items,"justify-content":this.content}}))]}</div>`}};t([p({attribute:"flex-flow"})],a.prototype,"flexFlow",void 0),t([p()],a.prototype,"gap",void 0),t([p()],a.prototype,"content",void 0),t([p()],a.prototype,"items",void 0),t([p({type:Boolean})],a.prototype,"vertical",void 0),a=t([o("flex"),e(m`:host,:host([contents]) [part=root]{display:flex}[part=root]{display:contents}`)],a);var c=a;export{c as default};
|
64
2
|
//# sourceMappingURL=flex.js.map
|
package/components/flex.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"flex.js","sources":["../src/components/flex.ts"],"sourcesContent":null,"names":[
|
1
|
+
{"version":3,"file":"flex.js","sources":["../src/components/flex.ts"],"sourcesContent":null,"names":["Flex","GlobalStyle","constructor","this","vertical","render","html","attr","observedRecord","htmlSlot","htmlStyle","joinRules","gap","flexFlow","items","content","__decorate","property","attribute","prototype","type","Boolean","godown","styles","css","Flex$1"],"mappings":"iiBAqBA,IAAMA,EAAN,MAAMA,aAAaC,EAAnB,WAAAC,uBA6BEC,KAAQC,UAAG,EAED,MAAAC,GACR,OAAOC,CAAI,oBAAoBC,EAAKJ,KAAKK,mBACvC,CACAC,IACAC,EACEC,EAAU,CACR,QAAS,CACPC,IAAKT,KAAKS,IACV,YAAaT,KAAKU,SAClB,iBAAkBV,KAAKC,UAAY,SACnC,cAAeD,KAAKW,MACpB,kBAAmBX,KAAKY,uBArClCC,EAAA,CADCC,EAAS,CAAEC,UAAW,eACPlB,EAAAmB,UAAA,gBAAA,GAMhBH,EAAA,CADCC,KACUjB,EAAAmB,UAAA,WAAA,GAMXH,EAAA,CADCC,KACcjB,EAAAmB,UAAA,eAAA,GAMfH,EAAA,CADCC,KACYjB,EAAAmB,UAAA,aAAA,GAMbH,EAAA,CADCC,EAAS,CAAEG,KAAMC,WACFrB,EAAAmB,UAAA,gBAAA,GA7BZnB,EAAIgB,EAAA,CAFTM,EARiB,QASjBC,EAAOC,CAAG,mFACLxB,GAmDN,IAAAyB,EAAezB"}
|
package/components/form.js
CHANGED
@@ -1,76 +1,2 @@
|
|
1
|
-
import {
|
2
|
-
import { godown } from '@godown/element/decorators/godown.js';
|
3
|
-
import { styles } from '@godown/element/decorators/styles.js';
|
4
|
-
import { htmlSlot } from '@godown/element/directives/html-slot.js';
|
5
|
-
import { css } from 'lit';
|
6
|
-
import { property } from 'lit/decorators.js';
|
7
|
-
import { GlobalStyle } from '../core/global-style.js';
|
8
|
-
|
9
|
-
var Form_1;
|
10
|
-
const protoName = "form";
|
11
|
-
/**
|
12
|
-
* {@linkcode Form} Gets child element key-value object,
|
13
|
-
* which will be nested if the child element is the same as this element.
|
14
|
-
*
|
15
|
-
* @category form
|
16
|
-
*/
|
17
|
-
let Form = Form_1 = class Form extends GlobalStyle {
|
18
|
-
constructor() {
|
19
|
-
super(...arguments);
|
20
|
-
this.name = "";
|
21
|
-
this.nameValue = this.namevalue;
|
22
|
-
}
|
23
|
-
get value() {
|
24
|
-
return Form_1.buildValue(this._slot.assignedElements());
|
25
|
-
}
|
26
|
-
render() {
|
27
|
-
return htmlSlot();
|
28
|
-
}
|
29
|
-
reset() {
|
30
|
-
this.deepQuerySelectorAll("*").forEach((el) => {
|
31
|
-
if (el.tagName === this.tagName) {
|
32
|
-
return;
|
33
|
-
}
|
34
|
-
if (el.reset) {
|
35
|
-
el.reset();
|
36
|
-
}
|
37
|
-
});
|
38
|
-
}
|
39
|
-
namevalue() {
|
40
|
-
return [this.name, this.value];
|
41
|
-
}
|
42
|
-
static buildValue(elements) {
|
43
|
-
const result = {};
|
44
|
-
for (const el of elements) {
|
45
|
-
if (el.tagName === "FORM") {
|
46
|
-
Object.assign(result, Object.fromEntries(new FormData(el).entries()));
|
47
|
-
}
|
48
|
-
else if (el.namevalue) {
|
49
|
-
const [name, value] = el.namevalue();
|
50
|
-
if (name) {
|
51
|
-
result[name] = value;
|
52
|
-
}
|
53
|
-
}
|
54
|
-
else if (el.name && el.value !== undefined) {
|
55
|
-
result[el.name] = el.value;
|
56
|
-
}
|
57
|
-
else if (el.shadowRoot) {
|
58
|
-
for (const slot of el.shadowRoot.querySelectorAll("slot")) {
|
59
|
-
Object.assign(result, this.buildValue(slot.assignedElements()));
|
60
|
-
}
|
61
|
-
}
|
62
|
-
}
|
63
|
-
return result;
|
64
|
-
}
|
65
|
-
};
|
66
|
-
__decorate([
|
67
|
-
property()
|
68
|
-
], Form.prototype, "name", void 0);
|
69
|
-
Form = Form_1 = __decorate([
|
70
|
-
godown(protoName),
|
71
|
-
styles(css `:host{display:block}`)
|
72
|
-
], Form);
|
73
|
-
var Form$1 = Form;
|
74
|
-
|
75
|
-
export { Form$1 as default };
|
1
|
+
import{__decorate as e}from"tslib";import{godown as t}from"@godown/element/decorators/godown.js";import{styles as o}from"@godown/element/decorators/styles.js";import{htmlSlot as s}from"@godown/element/directives/html-slot.js";import{css as r}from"lit";import{property as a}from"lit/decorators.js";import{GlobalStyle as l}from"../core/global-style.js";var i;let m=i=class Form extends l{constructor(){super(...arguments),this.name="",this.nameValue=this.namevalue}get value(){return i.buildValue(this._slot.assignedElements())}render(){return s()}reset(){this.deepQuerySelectorAll("*").forEach((e=>{e.tagName!==this.tagName&&e.reset&&e.reset()}))}namevalue(){return[this.name,this.value]}static buildValue(e){const t={};for(const o of e)if("FORM"===o.tagName)Object.assign(t,Object.fromEntries(new FormData(o).entries()));else if(o.namevalue){const[e,s]=o.namevalue();e&&(t[e]=s)}else if(o.name&&void 0!==o.value)t[o.name]=o.value;else if(o.shadowRoot)for(const e of o.shadowRoot.querySelectorAll("slot"))Object.assign(t,this.buildValue(e.assignedElements()));return t}};e([a()],m.prototype,"name",void 0),m=i=e([t("form"),o(r`:host{display:block}`)],m);var n=m;export{n as default};
|
76
2
|
//# sourceMappingURL=form.js.map
|
package/components/form.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"form.js","sources":["../src/components/form.ts"],"sourcesContent":null,"names":[
|
1
|
+
{"version":3,"file":"form.js","sources":["../src/components/form.ts"],"sourcesContent":null,"names":["Form","Form_1","GlobalStyle","constructor","this","name","nameValue","namevalue","value","buildValue","_slot","assignedElements","render","htmlSlot","reset","deepQuerySelectorAll","forEach","el","tagName","elements","result","Object","assign","fromEntries","FormData","entries","undefined","shadowRoot","slot","querySelectorAll","__decorate","property","prototype","godown","styles","css","Form$1"],"mappings":"qWAoBA,IAAMA,EAAIC,EAAV,MAAMD,aAAyBE,EAA/B,WAAAC,uBAEEC,KAAIC,KAAG,GAMPD,KAAAE,UAA+BF,KAAKG,UAJpC,SAAIC,GACF,OAAOP,EAAKQ,WAAWL,KAAKM,MAAMC,oBAK1B,MAAAC,GACR,OAAOC,IAGT,KAAAC,GACEV,KAAKW,qBAA4D,KAAKC,SAASC,IACzEA,EAAGC,UAAYd,KAAKc,SAGpBD,EAAGH,OACLG,EAAGH,WAKT,SAAAP,GACE,MAAO,CAACH,KAAKC,KAAMD,KAAKI,OAG1B,iBAAOC,CACLU,GAMA,MAAMC,EAAS,CAAE,EACjB,IAAK,MAAMH,KAAME,EACf,GAAmB,SAAfF,EAAGC,QACLG,OAAOC,OAAOF,EAAQC,OAAOE,YAAY,IAAIC,SAASP,GAAuBQ,iBACxE,GAAIR,EAAGV,UAAW,CACvB,MAAOF,EAAMG,GAASS,EAAGV,YACrBF,IACFe,EAAOf,GAAQG,QAEZ,GAAIS,EAAGZ,WAAqBqB,IAAbT,EAAGT,MACvBY,EAAOH,EAAGZ,MAAQY,EAAGT,WAChB,GAAIS,EAAGU,WACZ,IAAK,MAAMC,KAAQX,EAAGU,WAAWE,iBAAiB,QAChDR,OAAOC,OAAOF,EAAQhB,KAAKK,WAAWmB,EAAKjB,qBAIjD,OAAOS,IAnDTU,EAAA,CADCC,KACQ/B,EAAAgC,UAAA,YAAA,GAFLhC,EAAIC,EAAA6B,EAAA,CAJTG,EARiB,QASjBC,EACCC,CAAG,yBAECnC,GAyDN,IAAAoC,EAAepC"}
|
package/components/grid.js
CHANGED
@@ -1,58 +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 { htmlStyle } from '@godown/element/directives/html-style.js';
|
7
|
-
import { joinRules } from '@godown/element/tools/css.js';
|
8
|
-
import { isNumerical } from '@godown/element/tools/lib.js';
|
9
|
-
import { css, html } from 'lit';
|
10
|
-
import { property } from 'lit/decorators.js';
|
11
|
-
import { GlobalStyle } from '../core/global-style.js';
|
12
|
-
|
13
|
-
const protoName = "grid";
|
14
|
-
/**
|
15
|
-
* {@linkcode Grid} provides gird layout.
|
16
|
-
*
|
17
|
-
* @slot - Grid items.
|
18
|
-
* @category layout
|
19
|
-
*/
|
20
|
-
let Grid = class Grid extends GlobalStyle {
|
21
|
-
render() {
|
22
|
-
return html `<div part="root" ${attr(this.observedRecord)}>${[
|
23
|
-
htmlSlot(),
|
24
|
-
htmlStyle(joinRules({
|
25
|
-
":host": {
|
26
|
-
gap: this.gap,
|
27
|
-
"grid-template-columns": isNumerical(this.columns) ? `repeat(${this.columns},1fr)` : this.columns,
|
28
|
-
"grid-template-rows": isNumerical(this.rows) ? `repeat(${this.rows},1fr)` : this.rows,
|
29
|
-
"place-content": this.content,
|
30
|
-
"place-items": this.items,
|
31
|
-
},
|
32
|
-
})),
|
33
|
-
]}</div>`;
|
34
|
-
}
|
35
|
-
};
|
36
|
-
__decorate([
|
37
|
-
property()
|
38
|
-
], Grid.prototype, "gap", void 0);
|
39
|
-
__decorate([
|
40
|
-
property()
|
41
|
-
], Grid.prototype, "columns", void 0);
|
42
|
-
__decorate([
|
43
|
-
property()
|
44
|
-
], Grid.prototype, "rows", void 0);
|
45
|
-
__decorate([
|
46
|
-
property()
|
47
|
-
], Grid.prototype, "content", void 0);
|
48
|
-
__decorate([
|
49
|
-
property()
|
50
|
-
], Grid.prototype, "items", void 0);
|
51
|
-
Grid = __decorate([
|
52
|
-
godown(protoName),
|
53
|
-
styles(css `:host,:host([contents]) [part=root]{display:grid}[part=root]{display:contents}`)
|
54
|
-
], Grid);
|
55
|
-
var Grid$1 = Grid;
|
56
|
-
|
57
|
-
export { Grid$1 as default };
|
1
|
+
import{__decorate as o}from"tslib";import{godown as t}from"@godown/element/decorators/godown.js";import{styles as e}from"@godown/element/decorators/styles.js";import{attr as r}from"@godown/element/directives/attr.js";import{htmlSlot as s}from"@godown/element/directives/html-slot.js";import{htmlStyle as i}from"@godown/element/directives/html-style.js";import{joinRules as m}from"@godown/element/tools/css.js";import{isNumerical as p}from"@godown/element/tools/lib.js";import{css as l,html as d}from"lit";import{property as n}from"lit/decorators.js";import{GlobalStyle as a}from"../core/global-style.js";let c=class Grid extends a{render(){return d`<div part="root" ${r(this.observedRecord)}>${[s(),i(m({":host":{gap:this.gap,"grid-template-columns":p(this.columns)?`repeat(${this.columns},1fr)`:this.columns,"grid-template-rows":p(this.rows)?`repeat(${this.rows},1fr)`:this.rows,"place-content":this.content,"place-items":this.items}}))]}</div>`}};o([n()],c.prototype,"gap",void 0),o([n()],c.prototype,"columns",void 0),o([n()],c.prototype,"rows",void 0),o([n()],c.prototype,"content",void 0),o([n()],c.prototype,"items",void 0),c=o([t("grid"),e(l`:host,:host([contents]) [part=root]{display:grid}[part=root]{display:contents}`)],c);var g=c;export{g as default};
|
58
2
|
//# sourceMappingURL=grid.js.map
|
package/components/grid.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"grid.js","sources":["../src/components/grid.ts"],"sourcesContent":null,"names":[
|
1
|
+
{"version":3,"file":"grid.js","sources":["../src/components/grid.ts"],"sourcesContent":null,"names":["Grid","GlobalStyle","render","html","attr","this","observedRecord","htmlSlot","htmlStyle","joinRules","gap","isNumerical","columns","rows","content","items","__decorate","property","prototype","godown","styles","css","Grid$1"],"mappings":"4lBAsBA,IAAMA,EAAN,MAAMA,aAAaC,EAmCP,MAAAC,GACR,OAAOC,CAAI,oBAAoBC,EAAKC,KAAKC,mBACvC,CACAC,IACAC,EACEC,EAAU,CACR,QAAS,CACPC,IAAKL,KAAKK,IACV,wBAAyBC,EAAYN,KAAKO,SAAW,UAAUP,KAAKO,eAAiBP,KAAKO,QAC1F,qBAAsBD,EAAYN,KAAKQ,MAAQ,UAAUR,KAAKQ,YAAcR,KAAKQ,KACjF,gBAAiBR,KAAKS,QACtB,cAAeT,KAAKU,qBAzC9BC,EAAA,CADCC,KACUjB,EAAAkB,UAAA,WAAA,GAQXF,EAAA,CADCC,KACuBjB,EAAAkB,UAAA,eAAA,GAQxBF,EAAA,CADCC,KACoBjB,EAAAkB,UAAA,YAAA,GAMrBF,EAAA,CADCC,KACcjB,EAAAkB,UAAA,eAAA,GAMfF,EAAA,CADCC,KACYjB,EAAAkB,UAAA,aAAA,GAjCTlB,EAAIgB,EAAA,CAFTG,EARiB,QASjBC,EAAOC,CAAG,mFACLrB,GAuDN,IAAAsB,EAAetB"}
|
package/components/input.js
CHANGED
@@ -1,52 +1,2 @@
|
|
1
|
-
import {
|
2
|
-
import { godown } from '@godown/element/decorators/godown.js';
|
3
|
-
import { part } from '@godown/element/decorators/part.js';
|
4
|
-
import { styles } from '@godown/element/decorators/styles.js';
|
5
|
-
import { attr } from '@godown/element/directives/attr.js';
|
6
|
-
import { classList } from '@godown/element/directives/class-list.js';
|
7
|
-
import { css, html, nothing } from 'lit';
|
8
|
-
import { property } from 'lit/decorators.js';
|
9
|
-
import { cssGlobalVars } from '../core/global-style.js';
|
10
|
-
import SuperInput from '../core/super-input.js';
|
11
|
-
|
12
|
-
const protoName = "input";
|
13
|
-
/**
|
14
|
-
* {@linkcode Input} renders a text input.
|
15
|
-
*
|
16
|
-
* @category input
|
17
|
-
*/
|
18
|
-
let Input = class Input extends SuperInput {
|
19
|
-
constructor() {
|
20
|
-
super(...arguments);
|
21
|
-
this.type = "text";
|
22
|
-
/**
|
23
|
-
* If outline, the outline is always present.
|
24
|
-
*/
|
25
|
-
this.variant = "default";
|
26
|
-
}
|
27
|
-
render() {
|
28
|
-
return html `<div part="root" ${attr(this.observedRecord)} class="${classList("input-field", this.variant)}">${[
|
29
|
-
this._renderPrefix(),
|
30
|
-
html `<input part="input" type="${this.type}" id="${this.makeId}" .value="${this.value}" placeholder="${this.placeholder || nothing}" ?autofocus="${this.autofocus}" autocapitalize="${this.autocapitalize || nothing}" autocomplete="${this.autocomplete || nothing}" ?disabled="${this.disabled}" @input="${this._handleInput}">`,
|
31
|
-
this._renderSuffix(),
|
32
|
-
]}</div>`;
|
33
|
-
}
|
34
|
-
reset() {
|
35
|
-
this._input.value = this.default;
|
36
|
-
this.value = this.default;
|
37
|
-
}
|
38
|
-
};
|
39
|
-
__decorate([
|
40
|
-
property()
|
41
|
-
], Input.prototype, "variant", void 0);
|
42
|
-
__decorate([
|
43
|
-
part("input")
|
44
|
-
], Input.prototype, "_input", void 0);
|
45
|
-
Input = __decorate([
|
46
|
-
godown(protoName),
|
47
|
-
styles(css `:host{width:var(${cssGlobalVars.input}-width);height:var(${cssGlobalVars.input}-height);color:var(${cssGlobalVars.foreground});background:var(${cssGlobalVars.input}-background);border-radius:var(${cssGlobalVars.input}-radius);display:block}`)
|
48
|
-
], Input);
|
49
|
-
var Input$1 = Input;
|
50
|
-
|
51
|
-
export { Input$1 as default };
|
1
|
+
import{__decorate as t}from"tslib";import{godown as e}from"@godown/element/decorators/godown.js";import{part as o}from"@godown/element/decorators/part.js";import{styles as r}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{css as a,html as d,nothing as p}from"lit";import{property as u}from"lit/decorators.js";import{cssGlobalVars as l}from"../core/global-style.js";import n from"../core/super-input.js";let h=class Input extends n{constructor(){super(...arguments),this.type="text",this.variant="default"}render(){return d`<div part="root" ${i(this.observedRecord)} class="${s("input-field",this.variant)}">${[this._renderPrefix(),d`<input part="input" type="${this.type}" id="${this.makeId}" .value="${this.value}" placeholder="${this.placeholder||p}" ?autofocus="${this.autofocus}" autocapitalize="${this.autocapitalize||p}" autocomplete="${this.autocomplete||p}" ?disabled="${this.disabled}" @input="${this._handleInput}">`,this._renderSuffix()]}</div>`}reset(){this._input.value=this.default,this.value=this.default}};t([u()],h.prototype,"variant",void 0),t([o("input")],h.prototype,"_input",void 0),h=t([e("input"),r(a`:host{width:var(${l.input}-width);height:var(${l.input}-height);color:var(${l.foreground});background:var(${l.input}-background);border-radius:var(${l.input}-radius);display:block}`)],h);var m=h;export{m as default};
|
52
2
|
//# sourceMappingURL=input.js.map
|