godown 3.0.0-canary.0 → 3.0.0-canary.1
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/dev/alert.d.ts +8 -0
- package/dev/alert.d.ts.map +1 -0
- package/dev/alert.js +4 -0
- package/dev/alert.js.map +1 -0
- package/dev/avatar.d.ts +8 -0
- package/dev/avatar.d.ts.map +1 -0
- package/dev/avatar.js +4 -0
- package/dev/avatar.js.map +1 -0
- package/dev/breath.d.ts +9 -0
- package/dev/breath.d.ts.map +1 -0
- package/dev/breath.js +5 -0
- package/dev/breath.js.map +1 -0
- package/dev/button.d.ts +8 -0
- package/dev/button.d.ts.map +1 -0
- package/dev/button.js +4 -0
- package/dev/button.js.map +1 -0
- package/dev/card.d.ts +8 -0
- package/dev/card.d.ts.map +1 -0
- package/dev/card.js +4 -0
- package/dev/card.js.map +1 -0
- package/dev/carousel.d.ts +8 -0
- package/dev/carousel.d.ts.map +1 -0
- package/dev/carousel.js +4 -0
- package/dev/carousel.js.map +1 -0
- package/dev/components/alert.d.ts +50 -0
- package/dev/components/alert.d.ts.map +1 -0
- package/dev/components/alert.js +234 -0
- package/dev/components/alert.js.map +1 -0
- package/dev/components/avatar.d.ts +26 -0
- package/dev/components/avatar.d.ts.map +1 -0
- package/dev/components/avatar.js +91 -0
- package/dev/components/avatar.js.map +1 -0
- package/dev/components/breath.d.ts +34 -0
- package/dev/components/breath.d.ts.map +1 -0
- package/dev/components/breath.js +133 -0
- package/dev/components/breath.js.map +1 -0
- package/dev/components/button.d.ts +45 -0
- package/dev/components/button.d.ts.map +1 -0
- package/dev/components/button.js +256 -0
- package/dev/components/button.js.map +1 -0
- package/dev/components/card.d.ts +20 -0
- package/dev/components/card.d.ts.map +1 -0
- package/dev/components/card.js +89 -0
- package/dev/components/card.js.map +1 -0
- package/dev/components/carousel.d.ts +40 -0
- package/dev/components/carousel.d.ts.map +1 -0
- package/dev/components/carousel.js +155 -0
- package/dev/components/carousel.js.map +1 -0
- package/dev/components/details.d.ts +20 -0
- package/dev/components/details.d.ts.map +1 -0
- package/dev/components/details.js +115 -0
- package/dev/components/details.js.map +1 -0
- package/dev/components/dialog.d.ts +33 -0
- package/dev/components/dialog.d.ts.map +1 -0
- package/dev/components/dialog.js +154 -0
- package/dev/components/dialog.js.map +1 -0
- package/dev/components/divider.d.ts +17 -0
- package/dev/components/divider.d.ts.map +1 -0
- package/dev/components/divider.js +46 -0
- package/dev/components/divider.js.map +1 -0
- package/dev/components/dragbox.d.ts +40 -0
- package/dev/components/dragbox.d.ts.map +1 -0
- package/dev/components/dragbox.js +117 -0
- package/dev/components/dragbox.js.map +1 -0
- package/dev/components/flex.d.ts +31 -0
- package/dev/components/flex.d.ts.map +1 -0
- package/dev/components/flex.js +52 -0
- package/dev/components/flex.js.map +1 -0
- package/dev/components/form.d.ts +24 -0
- package/dev/components/form.d.ts.map +1 -0
- package/dev/components/form.js +79 -0
- package/dev/components/form.js.map +1 -0
- package/dev/components/grid.d.ts +31 -0
- package/dev/components/grid.d.ts.map +1 -0
- package/dev/components/grid.js +53 -0
- package/dev/components/grid.js.map +1 -0
- package/dev/components/input.d.ts +20 -0
- package/dev/components/input.d.ts.map +1 -0
- package/dev/components/input.js +89 -0
- package/dev/components/input.js.map +1 -0
- package/dev/components/layout.d.ts +29 -0
- package/dev/components/layout.d.ts.map +1 -0
- package/dev/components/layout.js +69 -0
- package/dev/components/layout.js.map +1 -0
- package/dev/components/link.d.ts +20 -0
- package/dev/components/link.d.ts.map +1 -0
- package/dev/components/link.js +40 -0
- package/dev/components/link.js.map +1 -0
- package/dev/components/progress.d.ts +30 -0
- package/dev/components/progress.d.ts.map +1 -0
- package/dev/components/progress.js +108 -0
- package/dev/components/progress.js.map +1 -0
- package/dev/components/range.d.ts +60 -0
- package/dev/components/range.d.ts.map +1 -0
- package/dev/components/range.js +306 -0
- package/dev/components/range.js.map +1 -0
- package/dev/components/rotate.d.ts +26 -0
- package/dev/components/rotate.d.ts.map +1 -0
- package/dev/components/rotate.js +86 -0
- package/dev/components/rotate.js.map +1 -0
- package/dev/components/router.d.ts +121 -0
- package/dev/components/router.d.ts.map +1 -0
- package/dev/components/router.js +248 -0
- package/dev/components/router.js.map +1 -0
- package/dev/components/select.d.ts +50 -0
- package/dev/components/select.d.ts.map +1 -0
- package/dev/components/select.js +243 -0
- package/dev/components/select.js.map +1 -0
- package/dev/components/skeleton.d.ts +26 -0
- package/dev/components/skeleton.d.ts.map +1 -0
- package/dev/components/skeleton.js +119 -0
- package/dev/components/skeleton.js.map +1 -0
- package/dev/components/split.d.ts +32 -0
- package/dev/components/split.d.ts.map +1 -0
- package/dev/components/split.js +173 -0
- package/dev/components/split.js.map +1 -0
- package/dev/components/switch.d.ts +39 -0
- package/dev/components/switch.d.ts.map +1 -0
- package/dev/components/switch.js +183 -0
- package/dev/components/switch.js.map +1 -0
- package/dev/components/text.d.ts +19 -0
- package/dev/components/text.d.ts.map +1 -0
- package/dev/components/text.js +93 -0
- package/dev/components/text.js.map +1 -0
- package/dev/components/time.d.ts +53 -0
- package/dev/components/time.d.ts.map +1 -0
- package/dev/components/time.js +136 -0
- package/dev/components/time.js.map +1 -0
- package/dev/components/tooltip.d.ts +38 -0
- package/dev/components/tooltip.d.ts.map +1 -0
- package/dev/components/tooltip.js +114 -0
- package/dev/components/tooltip.js.map +1 -0
- package/dev/components/typewriter.d.ts +55 -0
- package/dev/components/typewriter.d.ts.map +1 -0
- package/dev/components/typewriter.js +156 -0
- package/dev/components/typewriter.js.map +1 -0
- package/dev/core/global-style.d.ts +21 -0
- package/dev/core/global-style.d.ts.map +1 -0
- package/dev/core/global-style.js +77 -0
- package/dev/core/global-style.js.map +1 -0
- package/dev/core/super-anchor.d.ts +15 -0
- package/dev/core/super-anchor.d.ts.map +1 -0
- package/dev/core/super-anchor.js +58 -0
- package/dev/core/super-anchor.js.map +1 -0
- package/dev/core/super-input.d.ts +39 -0
- package/dev/core/super-input.d.ts.map +1 -0
- package/dev/core/super-input.js +181 -0
- package/dev/core/super-input.js.map +1 -0
- package/dev/core/super-openable.d.ts +19 -0
- package/dev/core/super-openable.d.ts.map +1 -0
- package/dev/core/super-openable.js +36 -0
- package/dev/core/super-openable.js.map +1 -0
- package/dev/details.d.ts +8 -0
- package/dev/details.d.ts.map +1 -0
- package/dev/details.js +4 -0
- package/dev/details.js.map +1 -0
- package/dev/dialog.d.ts +8 -0
- package/dev/dialog.d.ts.map +1 -0
- package/dev/dialog.js +4 -0
- package/dev/dialog.js.map +1 -0
- package/dev/divider.d.ts +8 -0
- package/dev/divider.d.ts.map +1 -0
- package/dev/divider.js +4 -0
- package/dev/divider.js.map +1 -0
- package/dev/dragbox.d.ts +8 -0
- package/dev/dragbox.d.ts.map +1 -0
- package/dev/dragbox.js +4 -0
- package/dev/dragbox.js.map +1 -0
- package/dev/flex.d.ts +8 -0
- package/dev/flex.d.ts.map +1 -0
- package/dev/flex.js +4 -0
- package/dev/flex.js.map +1 -0
- package/dev/form.d.ts +8 -0
- package/dev/form.d.ts.map +1 -0
- package/dev/form.js +4 -0
- package/dev/form.js.map +1 -0
- package/dev/grid.d.ts +8 -0
- package/dev/grid.d.ts.map +1 -0
- package/dev/grid.js +4 -0
- package/dev/grid.js.map +1 -0
- package/dev/index.d.ts +29 -0
- package/dev/index.d.ts.map +1 -0
- package/dev/index.js +29 -0
- package/dev/index.js.map +1 -0
- package/dev/input.d.ts +9 -0
- package/dev/input.d.ts.map +1 -0
- package/dev/input.js +5 -0
- package/dev/input.js.map +1 -0
- package/dev/layout.d.ts +9 -0
- package/dev/layout.d.ts.map +1 -0
- package/dev/layout.js +5 -0
- package/dev/layout.js.map +1 -0
- package/dev/link.d.ts +9 -0
- package/dev/link.d.ts.map +1 -0
- package/dev/link.js +5 -0
- package/dev/link.js.map +1 -0
- package/dev/progress.d.ts +9 -0
- package/dev/progress.d.ts.map +1 -0
- package/dev/progress.js +5 -0
- package/dev/progress.js.map +1 -0
- package/dev/range.d.ts +9 -0
- package/dev/range.d.ts.map +1 -0
- package/dev/range.js +5 -0
- package/dev/range.js.map +1 -0
- package/dev/rotate.d.ts +9 -0
- package/dev/rotate.d.ts.map +1 -0
- package/dev/rotate.js +5 -0
- package/dev/rotate.js.map +1 -0
- package/dev/router.d.ts +9 -0
- package/dev/router.d.ts.map +1 -0
- package/dev/router.js +5 -0
- package/dev/router.js.map +1 -0
- package/dev/select.d.ts +9 -0
- package/dev/select.d.ts.map +1 -0
- package/dev/select.js +5 -0
- package/dev/select.js.map +1 -0
- package/dev/skeleton.d.ts +9 -0
- package/dev/skeleton.d.ts.map +1 -0
- package/dev/skeleton.js +5 -0
- package/dev/skeleton.js.map +1 -0
- package/dev/split.d.ts +9 -0
- package/dev/split.d.ts.map +1 -0
- package/dev/split.js +5 -0
- package/dev/split.js.map +1 -0
- package/dev/switch.d.ts +9 -0
- package/dev/switch.d.ts.map +1 -0
- package/dev/switch.js +5 -0
- package/dev/switch.js.map +1 -0
- package/dev/text.d.ts +9 -0
- package/dev/text.d.ts.map +1 -0
- package/dev/text.js +5 -0
- package/dev/text.js.map +1 -0
- package/dev/time.d.ts +9 -0
- package/dev/time.d.ts.map +1 -0
- package/dev/time.js +5 -0
- package/dev/time.js.map +1 -0
- package/dev/tooltip.d.ts +9 -0
- package/dev/tooltip.d.ts.map +1 -0
- package/dev/tooltip.js +5 -0
- package/dev/tooltip.js.map +1 -0
- package/dev/typewriter.d.ts +8 -0
- package/dev/typewriter.d.ts.map +1 -0
- package/dev/typewriter.js +4 -0
- package/dev/typewriter.js.map +1 -0
- package/package.json +3 -3
- package/web-types.json +1 -1
@@ -0,0 +1,117 @@
|
|
1
|
+
import { __decorate } from "tslib";
|
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, html } from "lit";
|
6
|
+
import { property } from "lit/decorators.js";
|
7
|
+
import { GlobalStyle } from "../core/global-style.js";
|
8
|
+
const protoName = "dragbox";
|
9
|
+
/**
|
10
|
+
* {@linkcode Dragbox} does not extend beyond the range of {@linkcode Dragbox.offsetsWidth} and {@linkcode Dragbox.offsetsHeight}.
|
11
|
+
*
|
12
|
+
* @category wrapper
|
13
|
+
*/
|
14
|
+
let Dragbox = class Dragbox extends GlobalStyle {
|
15
|
+
constructor() {
|
16
|
+
super(...arguments);
|
17
|
+
/**
|
18
|
+
* Position x.
|
19
|
+
*/
|
20
|
+
this.x = "auto";
|
21
|
+
/**
|
22
|
+
* Position y.
|
23
|
+
*/
|
24
|
+
this.y = "auto";
|
25
|
+
}
|
26
|
+
/**
|
27
|
+
* Width of (`this.offsetParent` or `document.body`).
|
28
|
+
*/
|
29
|
+
get offsetsWidth() {
|
30
|
+
return this.offsetParent?.clientWidth ?? document.body.offsetWidth;
|
31
|
+
}
|
32
|
+
/**
|
33
|
+
* Height of (`this.offsetParent` or `document.body`).
|
34
|
+
*/
|
35
|
+
get offsetsHeight() {
|
36
|
+
return this.offsetParent?.clientHeight ?? document.body.offsetHeight;
|
37
|
+
}
|
38
|
+
render() {
|
39
|
+
return html `<div @mousedown="${this._handleDragStart}" @mouseup="${this._handleDragEnd}">${htmlSlot()}</div>`;
|
40
|
+
}
|
41
|
+
firstUpdated() {
|
42
|
+
this.reset();
|
43
|
+
}
|
44
|
+
_handleDragStart(e) {
|
45
|
+
this.cx = e.clientX;
|
46
|
+
this.cy = e.clientY;
|
47
|
+
this.t = this.offsetTop;
|
48
|
+
this.l = this.offsetLeft;
|
49
|
+
this.drag = true;
|
50
|
+
this._handleMouseMove = this.events.add(document, "mousemove", this._handleDrag.bind(this));
|
51
|
+
this._handleMouseLeave = this.events.add(document, "mouseleave", this._handleDragEnd.bind(this));
|
52
|
+
}
|
53
|
+
_handleDragEnd() {
|
54
|
+
this.drag = false;
|
55
|
+
this.events.remove(document, "mousemove", this._handleMouseMove);
|
56
|
+
this.events.remove(document, "mouseleave", this._handleMouseLeave);
|
57
|
+
}
|
58
|
+
_handleDrag(e) {
|
59
|
+
if (!this.drag) {
|
60
|
+
return;
|
61
|
+
}
|
62
|
+
const nl = e.clientX - (this.cx - this.l);
|
63
|
+
const nt = e.clientY - (this.cy - this.t);
|
64
|
+
const { style, offsetsWidth, offsetsHeight, offsetWidth, offsetHeight } = this;
|
65
|
+
if (nl < 0) {
|
66
|
+
style.left = "0";
|
67
|
+
}
|
68
|
+
else if (nl < offsetsWidth - offsetWidth) {
|
69
|
+
style.left = `${nl}px`;
|
70
|
+
}
|
71
|
+
else {
|
72
|
+
style.left = `${offsetsWidth - offsetWidth}"px"`;
|
73
|
+
}
|
74
|
+
if (nt < 0) {
|
75
|
+
style.top = "0";
|
76
|
+
}
|
77
|
+
else if (nt < offsetsHeight - offsetHeight) {
|
78
|
+
style.top = `${nt}px`;
|
79
|
+
}
|
80
|
+
else {
|
81
|
+
style.top = `${offsetsHeight - offsetHeight}px`;
|
82
|
+
}
|
83
|
+
}
|
84
|
+
reset() {
|
85
|
+
const { x, y, style, offsetsWidth, offsetsHeight, offsetWidth, offsetHeight, offsetLeft, offsetTop } = this;
|
86
|
+
style.left = x || "0";
|
87
|
+
style.top = y || "0";
|
88
|
+
if (offsetLeft > offsetsWidth - offsetWidth) {
|
89
|
+
style.left = `${offsetsWidth - offsetWidth}px`;
|
90
|
+
}
|
91
|
+
if (offsetTop > offsetsHeight - offsetHeight) {
|
92
|
+
style.top = `${offsetsHeight - offsetHeight}px`;
|
93
|
+
}
|
94
|
+
}
|
95
|
+
};
|
96
|
+
__decorate([
|
97
|
+
property()
|
98
|
+
], Dragbox.prototype, "x", void 0);
|
99
|
+
__decorate([
|
100
|
+
property()
|
101
|
+
], Dragbox.prototype, "y", void 0);
|
102
|
+
Dragbox = __decorate([
|
103
|
+
godown(protoName),
|
104
|
+
styles(css `
|
105
|
+
:host {
|
106
|
+
position: absolute;
|
107
|
+
display: block;
|
108
|
+
}
|
109
|
+
|
110
|
+
:host(:active) {
|
111
|
+
-webkit-user-select: none;
|
112
|
+
user-select: none;
|
113
|
+
}
|
114
|
+
`)
|
115
|
+
], Dragbox);
|
116
|
+
export default Dragbox;
|
117
|
+
//# sourceMappingURL=dragbox.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"dragbox.js","sourceRoot":"","sources":["../../src/components/dragbox.ts"],"names":[],"mappings":"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"}
|
@@ -0,0 +1,31 @@
|
|
1
|
+
import { GlobalStyle } from "../core/global-style.js";
|
2
|
+
/**
|
3
|
+
* {@linkcode Flex} provides flex layout.
|
4
|
+
*
|
5
|
+
* @category layout
|
6
|
+
*/
|
7
|
+
declare class Flex extends GlobalStyle {
|
8
|
+
/**
|
9
|
+
* CSS property `flex-flow` (`flex-direction flex-wrap`).
|
10
|
+
*/
|
11
|
+
flexFlow: string;
|
12
|
+
/**
|
13
|
+
* CSS property `gap`.
|
14
|
+
*/
|
15
|
+
gap: string;
|
16
|
+
/**
|
17
|
+
* CSS property `justify-content`.
|
18
|
+
*/
|
19
|
+
content: string;
|
20
|
+
/**
|
21
|
+
* CSS property `align-items`.
|
22
|
+
*/
|
23
|
+
items: string;
|
24
|
+
/**
|
25
|
+
* If true, set flex-direction to "column".
|
26
|
+
*/
|
27
|
+
vertical: boolean;
|
28
|
+
protected render(): import("lit").TemplateResult<1>[];
|
29
|
+
}
|
30
|
+
export default Flex;
|
31
|
+
//# sourceMappingURL=flex.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"flex.d.ts","sourceRoot":"","sources":["../../src/components/flex.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAItD;;;;GAIG;AACH,cAEM,IAAK,SAAQ,WAAW;IAC5B;;OAEG;IAEH,QAAQ,EAAE,MAAM,CAAC;IACjB;;OAEG;IAEH,GAAG,EAAE,MAAM,CAAC;IACZ;;OAEG;IAEH,OAAO,EAAE,MAAM,CAAC;IAChB;;OAEG;IAEH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IAEH,QAAQ,EAAE,OAAO,CAAC;IAElB,SAAS,CAAC,MAAM;CAgBjB;AAED,eAAe,IAAI,CAAC"}
|
@@ -0,0 +1,52 @@
|
|
1
|
+
import { __decorate } from "tslib";
|
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 { htmlStyle } from "@godown/element/directives/html-style.js";
|
6
|
+
import { joinRules } from "@godown/element/tools/css.js";
|
7
|
+
import { css } from "lit";
|
8
|
+
import { property } from "lit/decorators.js";
|
9
|
+
import { GlobalStyle } from "../core/global-style.js";
|
10
|
+
const protoName = "flex";
|
11
|
+
/**
|
12
|
+
* {@linkcode Flex} provides flex layout.
|
13
|
+
*
|
14
|
+
* @category layout
|
15
|
+
*/
|
16
|
+
let Flex = class Flex extends GlobalStyle {
|
17
|
+
render() {
|
18
|
+
return [
|
19
|
+
htmlSlot(),
|
20
|
+
htmlStyle(joinRules({
|
21
|
+
":host": {
|
22
|
+
gap: this.gap,
|
23
|
+
"flex-flow": this.flexFlow,
|
24
|
+
"flex-direction": this.vertical && "column",
|
25
|
+
"align-items": this.items,
|
26
|
+
"justify-content": this.content,
|
27
|
+
},
|
28
|
+
})),
|
29
|
+
];
|
30
|
+
}
|
31
|
+
};
|
32
|
+
__decorate([
|
33
|
+
property({ attribute: "flex-flow" })
|
34
|
+
], Flex.prototype, "flexFlow", void 0);
|
35
|
+
__decorate([
|
36
|
+
property()
|
37
|
+
], Flex.prototype, "gap", void 0);
|
38
|
+
__decorate([
|
39
|
+
property()
|
40
|
+
], Flex.prototype, "content", void 0);
|
41
|
+
__decorate([
|
42
|
+
property()
|
43
|
+
], Flex.prototype, "items", void 0);
|
44
|
+
__decorate([
|
45
|
+
property({ type: Boolean })
|
46
|
+
], Flex.prototype, "vertical", void 0);
|
47
|
+
Flex = __decorate([
|
48
|
+
godown(protoName),
|
49
|
+
styles(css `:host {display:flex;}`)
|
50
|
+
], Flex);
|
51
|
+
export default Flex;
|
52
|
+
//# sourceMappingURL=flex.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"flex.js","sourceRoot":"","sources":["../../src/components/flex.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAC9D,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAC9D,OAAO,EAAE,QAAQ,EAAE,MAAM,yCAAyC,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,0CAA0C,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAEtD,MAAM,SAAS,GAAG,MAAM,CAAC;AAEzB;;;;GAIG;AAGH,IAAM,IAAI,GAAV,MAAM,IAAK,SAAQ,WAAW;IA2BlB,MAAM;QACd,OAAO;YACL,QAAQ,EAAE;YACV,SAAS,CACP,SAAS,CAAC;gBACR,OAAO,EAAE;oBACP,GAAG,EAAE,IAAI,CAAC,GAAG;oBACb,WAAW,EAAE,IAAI,CAAC,QAAQ;oBAC1B,gBAAgB,EAAE,IAAI,CAAC,QAAQ,IAAI,QAAQ;oBAC3C,aAAa,EAAE,IAAI,CAAC,KAAK;oBACzB,iBAAiB,EAAE,IAAI,CAAC,OAAO;iBAChC;aACF,CAAC,CACH;SACF,CAAC;IACJ,CAAC;CACF,CAAA;AAtCC;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,WAAW,EAAE,CAAC;sCACpB;AAKjB;IADC,QAAQ,EAAE;iCACC;AAKZ;IADC,QAAQ,EAAE;qCACK;AAKhB;IADC,QAAQ,EAAE;mCACG;AAKd;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;sCACV;AAzBd,IAAI;IAFT,MAAM,CAAC,SAAS,CAAC;IACjB,MAAM,CAAC,GAAG,CAAA,uBAAuB,CAAC;GAC7B,IAAI,CA2CT;AAED,eAAe,IAAI,CAAC"}
|
@@ -0,0 +1,24 @@
|
|
1
|
+
import { GlobalStyle } from "../core/global-style.js";
|
2
|
+
/**
|
3
|
+
* {@linkcode Form} Gets child element key-value object,
|
4
|
+
* which will be nested if the child element is the same as this element.
|
5
|
+
*
|
6
|
+
* @slot - Child elements.
|
7
|
+
*
|
8
|
+
* @category form
|
9
|
+
*/
|
10
|
+
declare class Form<T = object> extends GlobalStyle {
|
11
|
+
name: string;
|
12
|
+
get value(): T;
|
13
|
+
nameValue: () => [string, T];
|
14
|
+
protected render(): import("lit").TemplateResult<1>;
|
15
|
+
reset(): void;
|
16
|
+
namevalue(): [string, T];
|
17
|
+
static buildValue(elements: (Element & {
|
18
|
+
name?: string;
|
19
|
+
value?: unknown;
|
20
|
+
namevalue?: () => [string, unknown];
|
21
|
+
})[]): Record<string, any>;
|
22
|
+
}
|
23
|
+
export default Form;
|
24
|
+
//# sourceMappingURL=form.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"form.d.ts","sourceRoot":"","sources":["../../src/components/form.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAItD;;;;;;;GAOG;AACH,cAQM,IAAI,CAAC,CAAC,GAAG,MAAM,CAAE,SAAQ,WAAW;IAExC,IAAI,SAAM;IACV,IAAI,KAAK,IAAI,CAAC,CAEb;IAED,SAAS,QAiBI,CAAC,MAAM,EAAE,CAAC,CAAC,CAjBG;IAE3B,SAAS,CAAC,MAAM;IAIhB,KAAK;IAWL,SAAS,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC;IAIxB,MAAM,CAAC,UAAU,CACf,QAAQ,EAAE,CAAC,OAAO,GAAG;QACnB,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,KAAK,CAAC,EAAE,OAAO,CAAC;QAChB,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;KACrC,CAAC,EAAE,GACH,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;CAoBvB;AAED,eAAe,IAAI,CAAC"}
|
@@ -0,0 +1,79 @@
|
|
1
|
+
var Form_1;
|
2
|
+
import { __decorate } from "tslib";
|
3
|
+
import { godown } from "@godown/element/decorators/godown.js";
|
4
|
+
import { styles } from "@godown/element/decorators/styles.js";
|
5
|
+
import { htmlSlot } from "@godown/element/directives/html-slot.js";
|
6
|
+
import { css } from "lit";
|
7
|
+
import { property } from "lit/decorators.js";
|
8
|
+
import { GlobalStyle } from "../core/global-style.js";
|
9
|
+
const protoName = "form";
|
10
|
+
/**
|
11
|
+
* {@linkcode Form} Gets child element key-value object,
|
12
|
+
* which will be nested if the child element is the same as this element.
|
13
|
+
*
|
14
|
+
* @slot - Child elements.
|
15
|
+
*
|
16
|
+
* @category form
|
17
|
+
*/
|
18
|
+
let Form = Form_1 = class Form extends GlobalStyle {
|
19
|
+
constructor() {
|
20
|
+
super(...arguments);
|
21
|
+
this.name = "";
|
22
|
+
this.nameValue = this.namevalue;
|
23
|
+
}
|
24
|
+
get value() {
|
25
|
+
return Form_1.buildValue(this._slot.assignedElements());
|
26
|
+
}
|
27
|
+
render() {
|
28
|
+
return htmlSlot();
|
29
|
+
}
|
30
|
+
reset() {
|
31
|
+
this.deepQuerySelectorAll("*").forEach((el) => {
|
32
|
+
if (el.tagName === this.tagName) {
|
33
|
+
return;
|
34
|
+
}
|
35
|
+
if (el.reset) {
|
36
|
+
el.reset();
|
37
|
+
}
|
38
|
+
});
|
39
|
+
}
|
40
|
+
namevalue() {
|
41
|
+
return [this.name, this.value];
|
42
|
+
}
|
43
|
+
static buildValue(elements) {
|
44
|
+
const result = {};
|
45
|
+
for (const el of elements) {
|
46
|
+
if (el.tagName === "FORM") {
|
47
|
+
Object.assign(result, Object.fromEntries(new FormData(el).entries()));
|
48
|
+
}
|
49
|
+
else if (el.namevalue) {
|
50
|
+
const [name, value] = el.namevalue();
|
51
|
+
if (name) {
|
52
|
+
result[name] = value;
|
53
|
+
}
|
54
|
+
}
|
55
|
+
else if (el.name && el.value !== undefined) {
|
56
|
+
result[el.name] = el.value;
|
57
|
+
}
|
58
|
+
else if (el.shadowRoot) {
|
59
|
+
for (const slot of el.shadowRoot.querySelectorAll("slot")) {
|
60
|
+
Object.assign(result, this.buildValue(slot.assignedElements()));
|
61
|
+
}
|
62
|
+
}
|
63
|
+
}
|
64
|
+
return result;
|
65
|
+
}
|
66
|
+
};
|
67
|
+
__decorate([
|
68
|
+
property()
|
69
|
+
], Form.prototype, "name", void 0);
|
70
|
+
Form = Form_1 = __decorate([
|
71
|
+
godown(protoName),
|
72
|
+
styles(css `
|
73
|
+
:host {
|
74
|
+
display: block;
|
75
|
+
}
|
76
|
+
`)
|
77
|
+
], Form);
|
78
|
+
export default Form;
|
79
|
+
//# sourceMappingURL=form.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"form.js","sourceRoot":"","sources":["../../src/components/form.ts"],"names":[],"mappings":";;AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAC9D,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAC9D,OAAO,EAAE,QAAQ,EAAE,MAAM,yCAAyC,CAAC;AACnE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAEtD,MAAM,SAAS,GAAG,MAAM,CAAC;AAEzB;;;;;;;GAOG;AASH,IAAM,IAAI,YAAV,MAAM,IAAiB,SAAQ,WAAW;IAA1C;;QAEE,SAAI,GAAG,EAAE,CAAC;QAKV,cAAS,GAAG,IAAI,CAAC,SAAS,CAAC;IA+C7B,CAAC;IAnDC,IAAI,KAAK;QACP,OAAO,MAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,gBAAgB,EAAE,CAAM,CAAC;IAC7D,CAAC;IAIS,MAAM;QACd,OAAO,QAAQ,EAAE,CAAC;IACpB,CAAC;IAED,KAAK;QACH,IAAI,CAAC,oBAAoB,CAAwC,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC,EAAE,EAAE,EAAE;YACnF,IAAI,EAAE,CAAC,OAAO,KAAK,IAAI,CAAC,OAAO,EAAE,CAAC;gBAChC,OAAO;YACT,CAAC;YACD,IAAI,EAAE,CAAC,KAAK,EAAE,CAAC;gBACb,EAAE,CAAC,KAAK,EAAE,CAAC;YACb,CAAC;QACH,CAAC,CAAC,CAAC;IACL,CAAC;IAED,SAAS;QACP,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;IACjC,CAAC;IAED,MAAM,CAAC,UAAU,CACf,QAII;QAEJ,MAAM,MAAM,GAAG,EAAE,CAAC;QAClB,KAAK,MAAM,EAAE,IAAI,QAAQ,EAAE,CAAC;YAC1B,IAAI,EAAE,CAAC,OAAO,KAAK,MAAM,EAAE,CAAC;gBAC1B,MAAM,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,WAAW,CAAC,IAAI,QAAQ,CAAC,EAAqB,CAAC,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC;YAC3F,CAAC;iBAAM,IAAI,EAAE,CAAC,SAAS,EAAE,CAAC;gBACxB,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC,GAAG,EAAE,CAAC,SAAS,EAAE,CAAC;gBACrC,IAAI,IAAI,EAAE,CAAC;oBACT,MAAM,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC;gBACvB,CAAC;YACH,CAAC;iBAAM,IAAI,EAAE,CAAC,IAAI,IAAI,EAAE,CAAC,KAAK,KAAK,SAAS,EAAE,CAAC;gBAC7C,MAAM,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC;YAC7B,CAAC;iBAAM,IAAI,EAAE,CAAC,UAAU,EAAE,CAAC;gBACzB,KAAK,MAAM,IAAI,IAAI,EAAE,CAAC,UAAU,CAAC,gBAAgB,CAAC,MAAM,CAAC,EAAE,CAAC;oBAC1D,MAAM,CAAC,MAAM,CAAC,MAAM,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,gBAAgB,EAAE,CAAC,CAAC,CAAC;gBAClE,CAAC;YACH,CAAC;QACH,CAAC;QACD,OAAO,MAAM,CAAC;IAChB,CAAC;CACF,CAAA;AApDC;IADC,QAAQ,EAAE;kCACD;AAFN,IAAI;IART,MAAM,CAAC,SAAS,CAAC;IACjB,MAAM,CACL,GAAG,CAAA;;;;GAIF,CACF;GACK,IAAI,CAsDT;AAED,eAAe,IAAI,CAAC"}
|
@@ -0,0 +1,31 @@
|
|
1
|
+
import { GlobalStyle } from "../core/global-style.js";
|
2
|
+
/**
|
3
|
+
* {@linkcode Grid} provides gird layout.
|
4
|
+
*
|
5
|
+
* @category layout
|
6
|
+
*/
|
7
|
+
declare class Grid extends GlobalStyle {
|
8
|
+
/**
|
9
|
+
* CSS property `gap`.
|
10
|
+
*/
|
11
|
+
gap: string;
|
12
|
+
/**
|
13
|
+
* CSS property `grid-template-columns`, if {@linkcode isNumerical} divide equally.
|
14
|
+
*/
|
15
|
+
columns: string | number;
|
16
|
+
/**
|
17
|
+
* CSS property `grid-template-rows`, if {@linkcode isNumerical} divide equally.
|
18
|
+
*/
|
19
|
+
rows: string | number;
|
20
|
+
/**
|
21
|
+
* CSS property `place-content` (`align-content justify-content`).
|
22
|
+
*/
|
23
|
+
content: string;
|
24
|
+
/**
|
25
|
+
* CSS property `place-items` (`align-items justify-items`).
|
26
|
+
*/
|
27
|
+
items: string;
|
28
|
+
protected render(): import("lit").TemplateResult<1>[];
|
29
|
+
}
|
30
|
+
export default Grid;
|
31
|
+
//# sourceMappingURL=grid.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"grid.d.ts","sourceRoot":"","sources":["../../src/components/grid.ts"],"names":[],"mappings":"AASA,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAItD;;;;GAIG;AACH,cAEM,IAAK,SAAQ,WAAW;IAC5B;;OAEG;IAEH,GAAG,EAAE,MAAM,CAAC;IACZ;;OAEG;IAEH,OAAO,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB;;OAEG;IAEH,IAAI,EAAE,MAAM,GAAG,MAAM,CAAC;IACtB;;OAEG;IAEH,OAAO,EAAE,MAAM,CAAC;IAChB;;OAEG;IAEH,KAAK,EAAE,MAAM,CAAC;IAEd,SAAS,CAAC,MAAM;CAgBjB;AAED,eAAe,IAAI,CAAC"}
|
@@ -0,0 +1,53 @@
|
|
1
|
+
import { __decorate } from "tslib";
|
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 { htmlStyle } from "@godown/element/directives/html-style.js";
|
6
|
+
import { joinRules } from "@godown/element/tools/css.js";
|
7
|
+
import { isNumerical } from "@godown/element/tools/lib.js";
|
8
|
+
import { css } from "lit";
|
9
|
+
import { property } from "lit/decorators.js";
|
10
|
+
import { GlobalStyle } from "../core/global-style.js";
|
11
|
+
const protoName = "grid";
|
12
|
+
/**
|
13
|
+
* {@linkcode Grid} provides gird layout.
|
14
|
+
*
|
15
|
+
* @category layout
|
16
|
+
*/
|
17
|
+
let Grid = class Grid extends GlobalStyle {
|
18
|
+
render() {
|
19
|
+
return [
|
20
|
+
htmlSlot(),
|
21
|
+
htmlStyle(joinRules({
|
22
|
+
":host": {
|
23
|
+
gap: this.gap,
|
24
|
+
"grid-template-columns": isNumerical(this.columns) ? `repeat(${this.columns},1fr)` : this.columns,
|
25
|
+
"grid-template-rows": isNumerical(this.rows) ? `repeat(${this.rows},1fr)` : this.rows,
|
26
|
+
"place-content": this.content,
|
27
|
+
"place-items": this.items,
|
28
|
+
},
|
29
|
+
})),
|
30
|
+
];
|
31
|
+
}
|
32
|
+
};
|
33
|
+
__decorate([
|
34
|
+
property()
|
35
|
+
], Grid.prototype, "gap", void 0);
|
36
|
+
__decorate([
|
37
|
+
property()
|
38
|
+
], Grid.prototype, "columns", void 0);
|
39
|
+
__decorate([
|
40
|
+
property()
|
41
|
+
], Grid.prototype, "rows", void 0);
|
42
|
+
__decorate([
|
43
|
+
property()
|
44
|
+
], Grid.prototype, "content", void 0);
|
45
|
+
__decorate([
|
46
|
+
property()
|
47
|
+
], Grid.prototype, "items", void 0);
|
48
|
+
Grid = __decorate([
|
49
|
+
godown(protoName),
|
50
|
+
styles(css `:host{display:grid;}`)
|
51
|
+
], Grid);
|
52
|
+
export default Grid;
|
53
|
+
//# sourceMappingURL=grid.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"grid.js","sourceRoot":"","sources":["../../src/components/grid.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAC9D,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAC9D,OAAO,EAAE,QAAQ,EAAE,MAAM,yCAAyC,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,0CAA0C,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAC3D,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAEtD,MAAM,SAAS,GAAG,MAAM,CAAC;AAEzB;;;;GAIG;AAGH,IAAM,IAAI,GAAV,MAAM,IAAK,SAAQ,WAAW;IA2BlB,MAAM;QACd,OAAO;YACL,QAAQ,EAAE;YACV,SAAS,CACP,SAAS,CAAC;gBACR,OAAO,EAAE;oBACP,GAAG,EAAE,IAAI,CAAC,GAAG;oBACb,uBAAuB,EAAE,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,UAAU,IAAI,CAAC,OAAO,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO;oBACjG,oBAAoB,EAAE,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,UAAU,IAAI,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI;oBACrF,eAAe,EAAE,IAAI,CAAC,OAAO;oBAC7B,aAAa,EAAE,IAAI,CAAC,KAAK;iBAC1B;aACF,CAAC,CACH;SACF,CAAC;IACJ,CAAC;CACF,CAAA;AAtCC;IADC,QAAQ,EAAE;iCACC;AAKZ;IADC,QAAQ,EAAE;qCACc;AAKzB;IADC,QAAQ,EAAE;kCACW;AAKtB;IADC,QAAQ,EAAE;qCACK;AAKhB;IADC,QAAQ,EAAE;mCACG;AAzBV,IAAI;IAFT,MAAM,CAAC,SAAS,CAAC;IACjB,MAAM,CAAC,GAAG,CAAA,sBAAsB,CAAC;GAC5B,IAAI,CA2CT;AAED,eAAe,IAAI,CAAC"}
|
@@ -0,0 +1,20 @@
|
|
1
|
+
import SuperInput from "../core/super-input.js";
|
2
|
+
/**
|
3
|
+
* {@linkcode Input} used for text input.
|
4
|
+
*
|
5
|
+
* @category input
|
6
|
+
*/
|
7
|
+
declare class Input extends SuperInput {
|
8
|
+
type: "text" | "search" | "tel" | "url" | "email" | "password";
|
9
|
+
value: string;
|
10
|
+
/**
|
11
|
+
* If outline, the outline is always present.
|
12
|
+
*/
|
13
|
+
variant: "default" | "outline";
|
14
|
+
accept: string;
|
15
|
+
_input: HTMLInputElement;
|
16
|
+
protected render(): import("lit").TemplateResult<1>;
|
17
|
+
reset(): void;
|
18
|
+
}
|
19
|
+
export default Input;
|
20
|
+
//# sourceMappingURL=input.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../src/components/input.ts"],"names":[],"mappings":"AAQA,OAAO,UAAU,MAAM,wBAAwB,CAAC;AAIhD;;;;GAIG;AACH,cA6BM,KAAM,SAAQ,UAAU;IAC5B,IAAI,EAAE,MAAM,GAAG,QAAQ,GAAG,KAAK,GAAG,KAAK,GAAG,OAAO,GAAG,UAAU,CAAU;IACxE,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IAEH,OAAO,EAAE,SAAS,GAAG,SAAS,CAAa;IAG3C,MAAM,EAAE,MAAM,CAAC;IAGf,MAAM,EAAE,gBAAgB,CAAC;IAEzB,SAAS,CAAC,MAAM;IAqBhB,KAAK;CAIN;AAED,eAAe,KAAK,CAAC"}
|
@@ -0,0 +1,89 @@
|
|
1
|
+
import { __decorate } from "tslib";
|
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 { classList } from "@godown/element/directives/class-list.js";
|
6
|
+
import { css, html, nothing } from "lit";
|
7
|
+
import { property } from "lit/decorators.js";
|
8
|
+
import { cssGlobalVars } from "../core/global-style.js";
|
9
|
+
import SuperInput from "../core/super-input.js";
|
10
|
+
const protoName = "input";
|
11
|
+
/**
|
12
|
+
* {@linkcode Input} used for text input.
|
13
|
+
*
|
14
|
+
* @category input
|
15
|
+
*/
|
16
|
+
let Input = class Input extends SuperInput {
|
17
|
+
constructor() {
|
18
|
+
super(...arguments);
|
19
|
+
this.type = "text";
|
20
|
+
/**
|
21
|
+
* If outline, the outline is always present.
|
22
|
+
*/
|
23
|
+
this.variant = "default";
|
24
|
+
}
|
25
|
+
render() {
|
26
|
+
return html `<div part="root" class="${classList("input-field", this.variant)}">
|
27
|
+
${[
|
28
|
+
this._renderPrefix(),
|
29
|
+
html `<input
|
30
|
+
part="input"
|
31
|
+
type="${this.type}"
|
32
|
+
id="${this.makeId}"
|
33
|
+
.value="${this.value}"
|
34
|
+
placeholder="${this.placeholder || nothing}"
|
35
|
+
?autofocus="${this.autofocus}"
|
36
|
+
autocapitalize="${this.autocapitalize || nothing}"
|
37
|
+
autocomplete="${this.autocomplete || nothing}"
|
38
|
+
?disabled="${this.disabled}"
|
39
|
+
@input="${this._handleInput}"
|
40
|
+
>`,
|
41
|
+
this._renderSuffix(),
|
42
|
+
]}
|
43
|
+
</div>`;
|
44
|
+
}
|
45
|
+
reset() {
|
46
|
+
this._input.value = this.default;
|
47
|
+
this.value = this.default;
|
48
|
+
}
|
49
|
+
};
|
50
|
+
__decorate([
|
51
|
+
property()
|
52
|
+
], Input.prototype, "variant", void 0);
|
53
|
+
__decorate([
|
54
|
+
property()
|
55
|
+
], Input.prototype, "accept", void 0);
|
56
|
+
__decorate([
|
57
|
+
part("input")
|
58
|
+
], Input.prototype, "_input", void 0);
|
59
|
+
Input = __decorate([
|
60
|
+
godown(protoName),
|
61
|
+
styles(css `
|
62
|
+
:host {
|
63
|
+
width: var(${cssGlobalVars.input}-width);
|
64
|
+
height: var(${cssGlobalVars.input}-height);
|
65
|
+
color: var(${cssGlobalVars.foreground});
|
66
|
+
background: var(${cssGlobalVars.input}-background);
|
67
|
+
border-radius: var(${cssGlobalVars.input}-radius);
|
68
|
+
display: block;
|
69
|
+
}
|
70
|
+
|
71
|
+
[part="root"] {
|
72
|
+
width: 100%;
|
73
|
+
display: flex;
|
74
|
+
align-items: center;
|
75
|
+
cursor: inherit;
|
76
|
+
}
|
77
|
+
|
78
|
+
input {
|
79
|
+
height: 100%;
|
80
|
+
width: 100%;
|
81
|
+
margin: 0;
|
82
|
+
color: inherit;
|
83
|
+
cursor: inherit;
|
84
|
+
border-radius: inherit;
|
85
|
+
}
|
86
|
+
`)
|
87
|
+
], Input);
|
88
|
+
export default Input;
|
89
|
+
//# sourceMappingURL=input.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"input.js","sourceRoot":"","sources":["../../src/components/input.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAC9D,OAAO,EAAE,IAAI,EAAE,MAAM,oCAAoC,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAC9D,OAAO,EAAE,SAAS,EAAE,MAAM,0CAA0C,CAAC;AACrE,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACzC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AACxD,OAAO,UAAU,MAAM,wBAAwB,CAAC;AAEhD,MAAM,SAAS,GAAG,OAAO,CAAC;AAE1B;;;;GAIG;AA8BH,IAAM,KAAK,GAAX,MAAM,KAAM,SAAQ,UAAU;IAA9B;;QACE,SAAI,GAA6D,MAAM,CAAC;QAGxE;;WAEG;QAEH,YAAO,GAA0B,SAAS,CAAC;IAiC7C,CAAC;IAzBW,MAAM;QACd,OAAO,IAAI,CAAA,2BAA2B,SAAS,CAAC,aAAa,EAAE,IAAI,CAAC,OAAO,CAAC;MAC1E;YACA,IAAI,CAAC,aAAa,EAAE;YACpB,IAAI,CAAA;;gBAEM,IAAI,CAAC,IAAI;cACX,IAAI,CAAC,MAAM;kBACP,IAAI,CAAC,KAAK;uBACL,IAAI,CAAC,WAAW,IAAI,OAAO;sBAC5B,IAAI,CAAC,SAAS;0BACV,IAAI,CAAC,cAAc,IAAI,OAAO;wBAChC,IAAI,CAAC,YAAY,IAAI,OAAO;qBAC/B,IAAI,CAAC,QAAQ;kBAChB,IAAI,CAAC,YAAY;QAC3B;YACF,IAAI,CAAC,aAAa,EAAE;SACrB;WACM,CAAC;IACV,CAAC;IAED,KAAK;QACH,IAAI,CAAC,MAAM,CAAC,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC;QACjC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC;IAC5B,CAAC;CACF,CAAA;AAjCC;IADC,QAAQ,EAAE;sCACgC;AAG3C;IADC,QAAQ,EAAE;qCACI;AAGf;IADC,IAAI,CAAC,OAAO,CAAC;qCACW;AAdrB,KAAK;IA7BV,MAAM,CAAC,SAAS,CAAC;IACjB,MAAM,CACL,GAAG,CAAA;;mBAEc,aAAa,CAAC,KAAK;oBAClB,aAAa,CAAC,KAAK;mBACpB,aAAa,CAAC,UAAU;wBACnB,aAAa,CAAC,KAAK;2BAChB,aAAa,CAAC,KAAK;;;;;;;;;;;;;;;;;;;GAmB3C,CACF;GACK,KAAK,CAyCV;AAED,eAAe,KAAK,CAAC"}
|
@@ -0,0 +1,29 @@
|
|
1
|
+
import { GlobalStyle } from "../core/global-style.js";
|
2
|
+
/**
|
3
|
+
* {@linkcode NavLayout} renders slot and optional top header, bottom footer.
|
4
|
+
*
|
5
|
+
* @slot - The main content of the layout.
|
6
|
+
*
|
7
|
+
* @slot header - The header of the layout.
|
8
|
+
*
|
9
|
+
* @slot footer - The footer of the layout.
|
10
|
+
*
|
11
|
+
* @category layout
|
12
|
+
*/
|
13
|
+
declare class NavLayout extends GlobalStyle {
|
14
|
+
/**
|
15
|
+
* If true, hide the header slot.
|
16
|
+
*/
|
17
|
+
noHeader: boolean;
|
18
|
+
/**
|
19
|
+
* If true, hide the footer slot.
|
20
|
+
*/
|
21
|
+
noFooter: boolean;
|
22
|
+
/**
|
23
|
+
* If true, header will sticky.
|
24
|
+
*/
|
25
|
+
sticky: boolean;
|
26
|
+
protected render(): import("lit").TemplateResult<1>[];
|
27
|
+
}
|
28
|
+
export default NavLayout;
|
29
|
+
//# sourceMappingURL=layout.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"layout.d.ts","sourceRoot":"","sources":["../../src/components/layout.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAItD;;;;;;;;;;GAUG;AACH,cA4BM,SAAU,SAAQ,WAAW;IACjC;;OAEG;IAEH,QAAQ,EAAE,OAAO,CAAC;IAClB;;OAEG;IAEH,QAAQ,EAAE,OAAO,CAAC;IAElB;;OAEG;IAEH,MAAM,EAAE,OAAO,CAAC;IAEhB,SAAS,CAAC,MAAM;CAUjB;AAED,eAAe,SAAS,CAAC"}
|
@@ -0,0 +1,69 @@
|
|
1
|
+
import { __decorate } from "tslib";
|
2
|
+
import { godown } from "@godown/element/decorators/godown.js";
|
3
|
+
import { styles } from "@godown/element/decorators/styles.js";
|
4
|
+
import { classList } from "@godown/element/directives/class-list.js";
|
5
|
+
import { conditionIf } from "@godown/element/directives/condition-if.js";
|
6
|
+
import { htmlSlot } from "@godown/element/directives/html-slot.js";
|
7
|
+
import { css, html } from "lit";
|
8
|
+
import { property } from "lit/decorators.js";
|
9
|
+
import { GlobalStyle } from "../core/global-style.js";
|
10
|
+
const protoName = "layout";
|
11
|
+
/**
|
12
|
+
* {@linkcode NavLayout} renders slot and optional top header, bottom footer.
|
13
|
+
*
|
14
|
+
* @slot - The main content of the layout.
|
15
|
+
*
|
16
|
+
* @slot header - The header of the layout.
|
17
|
+
*
|
18
|
+
* @slot footer - The footer of the layout.
|
19
|
+
*
|
20
|
+
* @category layout
|
21
|
+
*/
|
22
|
+
let NavLayout = class NavLayout extends GlobalStyle {
|
23
|
+
render() {
|
24
|
+
return [
|
25
|
+
conditionIf(!this.noHeader, html `<header part="header" class="${classList({ sticky: this.sticky })}">${htmlSlot("header")}</header>`),
|
26
|
+
html `<main part="main">${htmlSlot()}</main>`,
|
27
|
+
conditionIf(!this.noFooter, html `<footer part="footer">${htmlSlot("footer")}</footer> `),
|
28
|
+
];
|
29
|
+
}
|
30
|
+
};
|
31
|
+
__decorate([
|
32
|
+
property({ type: Boolean })
|
33
|
+
], NavLayout.prototype, "noHeader", void 0);
|
34
|
+
__decorate([
|
35
|
+
property({ type: Boolean })
|
36
|
+
], NavLayout.prototype, "noFooter", void 0);
|
37
|
+
__decorate([
|
38
|
+
property({ type: Boolean })
|
39
|
+
], NavLayout.prototype, "sticky", void 0);
|
40
|
+
NavLayout = __decorate([
|
41
|
+
godown(protoName),
|
42
|
+
styles(css `
|
43
|
+
:host {
|
44
|
+
min-height: 100%;
|
45
|
+
display: flex;
|
46
|
+
flex-direction: column;
|
47
|
+
}
|
48
|
+
|
49
|
+
.sticky {
|
50
|
+
position: sticky;
|
51
|
+
top: 0;
|
52
|
+
z-index: 1;
|
53
|
+
}
|
54
|
+
|
55
|
+
[part="main"] {
|
56
|
+
position: relative;
|
57
|
+
flex: 1;
|
58
|
+
width: 100%;
|
59
|
+
}
|
60
|
+
|
61
|
+
header,
|
62
|
+
main,
|
63
|
+
footer {
|
64
|
+
width: 100%;
|
65
|
+
}
|
66
|
+
`)
|
67
|
+
], NavLayout);
|
68
|
+
export default NavLayout;
|
69
|
+
//# sourceMappingURL=layout.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"layout.js","sourceRoot":"","sources":["../../src/components/layout.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAC9D,OAAO,EAAE,MAAM,EAAE,MAAM,sCAAsC,CAAC;AAC9D,OAAO,EAAE,SAAS,EAAE,MAAM,0CAA0C,CAAC;AACrE,OAAO,EAAE,WAAW,EAAE,MAAM,4CAA4C,CAAC;AACzE,OAAO,EAAE,QAAQ,EAAE,MAAM,yCAAyC,CAAC;AACnE,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAEtD,MAAM,SAAS,GAAG,QAAQ,CAAC;AAE3B;;;;;;;;;;GAUG;AA6BH,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,WAAW;IAkBvB,MAAM;QACd,OAAO;YACL,WAAW,CACT,CAAC,IAAI,CAAC,QAAQ,EACd,IAAI,CAAA,gCAAgC,SAAS,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC,KAAK,QAAQ,CAAC,QAAQ,CAAC,WAAW,CACzG;YACD,IAAI,CAAA,qBAAqB,QAAQ,EAAE,SAAS;YAC5C,WAAW,CAAC,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAA,yBAAyB,QAAQ,CAAC,QAAQ,CAAC,YAAY,CAAC;SACzF,CAAC;IACJ,CAAC;CACF,CAAA;AAvBC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;2CACV;AAKlB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;2CACV;AAMlB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;yCACZ;AAhBZ,SAAS;IA5Bd,MAAM,CAAC,SAAS,CAAC;IACjB,MAAM,CACL,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwBF,CACF;GACK,SAAS,CA4Bd;AAED,eAAe,SAAS,CAAC"}
|