godown 3.0.0 → 3.0.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/build/godown+lit.iife.js +12 -12
- package/build/godown+lit.iife.js.map +1 -1
- package/build/godown+lit.js +12 -12
- package/build/godown+lit.js.map +1 -1
- package/build/godown+lit.umd.js +12 -12
- package/build/godown+lit.umd.js.map +1 -1
- package/build/godown.iife.js +11 -11
- package/build/godown.js +11 -11
- package/build/godown.js.map +1 -1
- package/build/godown.umd.js +11 -11
- package/build/godown.umd.js.map +1 -1
- package/components/alert.d.ts.map +1 -1
- package/components/alert.js +1 -1
- package/components/alert.js.map +1 -1
- package/components/avatar.d.ts.map +1 -1
- package/components/avatar.js +1 -1
- package/components/avatar.js.map +1 -1
- package/components/badge.d.ts.map +1 -1
- package/components/badge.js +1 -1
- package/components/badge.js.map +1 -1
- package/components/breath.d.ts.map +1 -1
- package/components/breath.js +1 -1
- package/components/breath.js.map +1 -1
- package/components/button.d.ts.map +1 -1
- package/components/button.js +1 -1
- package/components/button.js.map +1 -1
- package/components/card.d.ts.map +1 -1
- package/components/card.js +1 -1
- package/components/card.js.map +1 -1
- package/components/carousel.d.ts.map +1 -1
- package/components/carousel.js +1 -1
- package/components/carousel.js.map +1 -1
- package/components/details.d.ts.map +1 -1
- package/components/details.js +1 -1
- package/components/details.js.map +1 -1
- package/components/dialog.d.ts.map +1 -1
- package/components/dialog.js +1 -1
- package/components/dialog.js.map +1 -1
- package/components/divider.d.ts.map +1 -1
- package/components/divider.js +1 -1
- package/components/divider.js.map +1 -1
- package/components/dragbox.d.ts.map +1 -1
- package/components/dragbox.js +1 -1
- package/components/dragbox.js.map +1 -1
- package/components/flex.d.ts.map +1 -1
- package/components/flex.js.map +1 -1
- package/components/form.d.ts.map +1 -1
- package/components/form.js.map +1 -1
- package/components/grid.d.ts.map +1 -1
- package/components/grid.js.map +1 -1
- package/components/heading.d.ts.map +1 -1
- package/components/heading.js +1 -1
- package/components/heading.js.map +1 -1
- package/components/input.d.ts.map +1 -1
- package/components/input.js +1 -1
- package/components/input.js.map +1 -1
- package/components/layout.d.ts.map +1 -1
- package/components/layout.js +1 -1
- package/components/layout.js.map +1 -1
- package/components/link.js.map +1 -1
- package/components/progress.d.ts.map +1 -1
- package/components/progress.js +1 -1
- package/components/progress.js.map +1 -1
- package/components/range.d.ts.map +1 -1
- package/components/range.js +1 -1
- package/components/range.js.map +1 -1
- package/components/rotate.d.ts.map +1 -1
- package/components/rotate.js +1 -1
- package/components/rotate.js.map +1 -1
- package/components/router.d.ts +20 -25
- package/components/router.d.ts.map +1 -1
- package/components/router.js +1 -1
- package/components/router.js.map +1 -1
- package/components/select.d.ts.map +1 -1
- package/components/select.js +1 -1
- package/components/select.js.map +1 -1
- package/components/skeleton.d.ts.map +1 -1
- package/components/skeleton.js +1 -1
- package/components/skeleton.js.map +1 -1
- package/components/split.d.ts.map +1 -1
- package/components/split.js +1 -1
- package/components/split.js.map +1 -1
- package/components/switch.d.ts.map +1 -1
- package/components/switch.js +1 -1
- package/components/switch.js.map +1 -1
- package/components/text.d.ts.map +1 -1
- package/components/text.js +1 -1
- package/components/text.js.map +1 -1
- package/components/time.d.ts.map +1 -1
- package/components/time.js.map +1 -1
- package/components/tooltip.d.ts.map +1 -1
- package/components/tooltip.js +1 -1
- package/components/tooltip.js.map +1 -1
- package/components/typewriter.d.ts.map +1 -1
- package/components/typewriter.js +1 -1
- package/components/typewriter.js.map +1 -1
- package/core/global-style.d.ts.map +1 -1
- package/core/global-style.js +1 -1
- package/core/global-style.js.map +1 -1
- package/core/super-anchor.d.ts.map +1 -1
- package/core/super-anchor.js +1 -1
- package/core/super-anchor.js.map +1 -1
- package/core/super-input.d.ts.map +1 -1
- package/core/super-input.js +1 -1
- package/core/super-input.js.map +1 -1
- package/core/super-openable.d.ts.map +1 -1
- package/core/super-openable.js.map +1 -1
- package/custom-elements.json +1 -1
- package/dev/components/alert.d.ts.map +1 -1
- package/dev/components/alert.js +82 -69
- package/dev/components/alert.js.map +1 -1
- package/dev/components/avatar.d.ts.map +1 -1
- package/dev/components/avatar.js +52 -36
- package/dev/components/avatar.js.map +1 -1
- package/dev/components/badge.d.ts.map +1 -1
- package/dev/components/badge.js +57 -50
- package/dev/components/badge.js.map +1 -1
- package/dev/components/breath.d.ts.map +1 -1
- package/dev/components/breath.js +20 -14
- package/dev/components/breath.js.map +1 -1
- package/dev/components/button.d.ts.map +1 -1
- package/dev/components/button.js +13 -10
- package/dev/components/button.js.map +1 -1
- package/dev/components/card.d.ts.map +1 -1
- package/dev/components/card.js +40 -35
- package/dev/components/card.js.map +1 -1
- package/dev/components/carousel.d.ts.map +1 -1
- package/dev/components/carousel.js +63 -43
- package/dev/components/carousel.js.map +1 -1
- package/dev/components/details.d.ts.map +1 -1
- package/dev/components/details.js +72 -61
- package/dev/components/details.js.map +1 -1
- package/dev/components/dialog.d.ts.map +1 -1
- package/dev/components/dialog.js +61 -57
- package/dev/components/dialog.js.map +1 -1
- package/dev/components/divider.d.ts.map +1 -1
- package/dev/components/divider.js +28 -23
- package/dev/components/divider.js.map +1 -1
- package/dev/components/dragbox.d.ts.map +1 -1
- package/dev/components/dragbox.js +19 -17
- package/dev/components/dragbox.js.map +1 -1
- package/dev/components/flex.d.ts.map +1 -1
- package/dev/components/flex.js +16 -11
- package/dev/components/flex.js.map +1 -1
- package/dev/components/form.d.ts.map +1 -1
- package/dev/components/form.js +4 -4
- package/dev/components/form.js.map +1 -1
- package/dev/components/grid.d.ts.map +1 -1
- package/dev/components/grid.js +16 -11
- package/dev/components/grid.js.map +1 -1
- package/dev/components/heading.d.ts.map +1 -1
- package/dev/components/heading.js +62 -40
- package/dev/components/heading.js.map +1 -1
- package/dev/components/input.d.ts.map +1 -1
- package/dev/components/input.js +32 -24
- package/dev/components/input.js.map +1 -1
- package/dev/components/layout.d.ts.map +1 -1
- package/dev/components/layout.js +43 -30
- package/dev/components/layout.js.map +1 -1
- package/dev/components/link.js +1 -1
- package/dev/components/link.js.map +1 -1
- package/dev/components/progress.d.ts.map +1 -1
- package/dev/components/progress.js +51 -42
- package/dev/components/progress.js.map +1 -1
- package/dev/components/range.d.ts.map +1 -1
- package/dev/components/range.js +33 -30
- package/dev/components/range.js.map +1 -1
- package/dev/components/rotate.d.ts.map +1 -1
- package/dev/components/rotate.js +12 -5
- package/dev/components/rotate.js.map +1 -1
- package/dev/components/router.d.ts +20 -25
- package/dev/components/router.d.ts.map +1 -1
- package/dev/components/router.js +17 -17
- package/dev/components/router.js.map +1 -1
- package/dev/components/select.d.ts.map +1 -1
- package/dev/components/select.js +65 -57
- package/dev/components/select.js.map +1 -1
- package/dev/components/skeleton.d.ts.map +1 -1
- package/dev/components/skeleton.js +65 -61
- package/dev/components/skeleton.js.map +1 -1
- package/dev/components/split.d.ts.map +1 -1
- package/dev/components/split.js +66 -58
- package/dev/components/split.js.map +1 -1
- package/dev/components/switch.d.ts.map +1 -1
- package/dev/components/switch.js +88 -79
- package/dev/components/switch.js.map +1 -1
- package/dev/components/text.d.ts.map +1 -1
- package/dev/components/text.js +51 -45
- package/dev/components/text.js.map +1 -1
- package/dev/components/time.d.ts.map +1 -1
- package/dev/components/time.js +13 -2
- package/dev/components/time.js.map +1 -1
- package/dev/components/tooltip.d.ts.map +1 -1
- package/dev/components/tooltip.js +31 -23
- package/dev/components/tooltip.js.map +1 -1
- package/dev/components/typewriter.d.ts.map +1 -1
- package/dev/components/typewriter.js +35 -27
- package/dev/components/typewriter.js.map +1 -1
- package/dev/core/global-style.d.ts.map +1 -1
- package/dev/core/global-style.js +9 -9
- package/dev/core/global-style.js.map +1 -1
- package/dev/core/super-anchor.d.ts.map +1 -1
- package/dev/core/super-anchor.js +27 -26
- package/dev/core/super-anchor.js.map +1 -1
- package/dev/core/super-input.d.ts.map +1 -1
- package/dev/core/super-input.js +83 -68
- package/dev/core/super-input.js.map +1 -1
- package/dev/core/super-openable.d.ts.map +1 -1
- package/dev/core/super-openable.js +1 -2
- package/dev/core/super-openable.js.map +1 -1
- package/package.json +5 -5
- package/src/components/alert.ts +84 -75
- package/src/components/avatar.ts +54 -40
- package/src/components/badge.ts +68 -65
- package/src/components/breath.ts +23 -19
- package/src/components/button.ts +14 -11
- package/src/components/card.ts +42 -40
- package/src/components/carousel.ts +65 -47
- package/src/components/details.ts +74 -65
- package/src/components/dialog.ts +64 -62
- package/src/components/divider.ts +33 -30
- package/src/components/dragbox.ts +22 -22
- package/src/components/flex.ts +31 -28
- package/src/components/form.ts +7 -9
- package/src/components/grid.ts +31 -28
- package/src/components/heading.ts +67 -49
- package/src/components/input.ts +37 -31
- package/src/components/layout.ts +45 -34
- package/src/components/link.ts +1 -1
- package/src/components/progress.ts +53 -46
- package/src/components/range.ts +58 -52
- package/src/components/rotate.ts +15 -10
- package/src/components/router.ts +40 -45
- package/src/components/select.ts +74 -70
- package/src/components/skeleton.ts +67 -65
- package/src/components/split.ts +73 -69
- package/src/components/switch.ts +90 -83
- package/src/components/text.ts +53 -49
- package/src/components/time.ts +14 -3
- package/src/components/tooltip.ts +32 -24
- package/src/components/typewriter.ts +37 -31
- package/src/core/global-style.ts +11 -12
- package/src/core/super-anchor.ts +29 -30
- package/src/core/super-input.ts +86 -73
- package/src/core/super-openable.ts +2 -8
- package/web-types.json +1 -1
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../src/components/alert.ts"],"names":[],"mappings":"AASA,OAAO,
|
1
|
+
{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../src/components/alert.ts"],"names":[],"mappings":"AASA,OAAO,EAAE,KAAK,cAAc,EAAa,MAAM,KAAK,CAAC;AAGrD,OAAO,EAAE,WAAW,EAA8B,MAAM,yBAAyB,CAAC;AAwFlF;;;;;;;;;;GAUG;AACH,cAmEM,KAAM,SAAQ,WAAW;IAC7B;;OAEG;IAEH,IAAI,EAAE,KAAK,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,QAAQ,GAAG,OAAO,GAAG,MAAM,GAAG,YAAY,CAAC;IAE1F;;;OAGG;IAEH,KAAK,EACD,OAAO,GACP,OAAO,GACP,MAAM,GACN,OAAO,GACP,MAAM,GACN,MAAM,GACN,KAAK,GACL,QAAQ,GACR,QAAQ,GACR,QAAQ,GACR,MAAM,GACN,MAAM,CAAU;IAEpB;;OAEG;IAEH,SAAS,SAAK;IAEd;;OAEG;IAEH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IAEH,OAAO,EAAE,MAAM,CAAC;IAEhB;;;;OAIG;IAEH,SAAS,UAAS;IAElB;;;;OAIG;IAEH,OAAO,EAAE,YAAY,GAAG,MAAM,GAAG,OAAO,CAAU;IAElD,SAAS,CAAC,MAAM,IAAI,cAAc,CAAC,CAAC,CAAC;IA6BrC,KAAK,IAAI,IAAI;IAKb,SAAS,CAAC,YAAY,IAAI,IAAI;IAM9B,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,WAAW,EAAE,MAAM,EAAE,OAAO,CAAC,KAAK,CAAC,GAAG,KAAK;CAM/D;AAED,eAAe,KAAK,CAAC;AACrB,OAAO,EAAE,KAAK,EAAE,CAAC"}
|
package/dev/components/alert.js
CHANGED
@@ -6,11 +6,11 @@ import iconInfoCircle from "@godown/f7-icon/icons/info-circle.js";
|
|
6
6
|
import iconLightbulb from "@godown/f7-icon/icons/lightbulb.js";
|
7
7
|
import iconQuestionCircle from "@godown/f7-icon/icons/question-circle.js";
|
8
8
|
import iconSlashCircle from "@godown/f7-icon/icons/slash-circle.js";
|
9
|
-
import iconXmark from "@godown/f7-icon/icons/xmark.js";
|
10
9
|
import iconXmarkCircle from "@godown/f7-icon/icons/xmark-circle.js";
|
10
|
+
import iconXmark from "@godown/f7-icon/icons/xmark.js";
|
11
11
|
import { css, html } from "lit";
|
12
12
|
import { property } from "lit/decorators.js";
|
13
|
-
import {
|
13
|
+
import { GlobalStyle, cssGlobalVars, scopePrefix } from "../core/global-style.js";
|
14
14
|
const protoName = "alert";
|
15
15
|
const cssScope = scopePrefix(protoName);
|
16
16
|
const vars = ["color", "background"].map((v) => `${cssScope}--${v}`);
|
@@ -119,17 +119,30 @@ let Alert = class Alert extends GlobalStyle {
|
|
119
119
|
render() {
|
120
120
|
const color = calls[this.call]?.color || this.color;
|
121
121
|
const icon = this.call ? calls[this.call].icon() : htmlSlot("icon");
|
122
|
-
return html
|
123
|
-
<div
|
124
|
-
|
125
|
-
|
126
|
-
|
122
|
+
return html `
|
123
|
+
<div
|
124
|
+
part="root"
|
125
|
+
${attr(this.observedRecord)}
|
126
|
+
>
|
127
|
+
<div part="icon">${icon}</div>
|
128
|
+
<div part="content">
|
129
|
+
<strong part="title">${this.title || htmlSlot("title")}</strong>
|
130
|
+
${this.content || htmlSlot()}
|
131
|
+
</div>
|
132
|
+
${this.hideClose || this.variant === "blockquote"
|
133
|
+
? ""
|
134
|
+
: html `
|
135
|
+
<div
|
136
|
+
part="close"
|
137
|
+
tabindex="0"
|
138
|
+
@click="${this.close}"
|
139
|
+
>
|
140
|
+
${iconXmark()}
|
141
|
+
</div>
|
142
|
+
`}
|
143
|
+
${htmlStyle(this.variant === "dark" ? darkStyles[color] : lightStyles[color])}
|
127
144
|
</div>
|
128
|
-
|
129
|
-
? html `<div part="close" tabindex="0" @click="${this.close}">${iconXmark()}</div>`
|
130
|
-
: ""}
|
131
|
-
${htmlStyle(this.variant === "light" ? lightStyles[color] : darkStyles[color])}
|
132
|
-
</div>`;
|
145
|
+
`;
|
133
146
|
}
|
134
147
|
close() {
|
135
148
|
this.remove();
|
@@ -171,71 +184,71 @@ __decorate([
|
|
171
184
|
Alert = __decorate([
|
172
185
|
godown(protoName),
|
173
186
|
styles(css `
|
174
|
-
|
175
|
-
|
176
|
-
|
177
|
-
|
178
|
-
|
179
|
-
|
180
|
-
|
181
|
-
|
182
|
-
|
183
|
-
|
187
|
+
:host,
|
188
|
+
:where(:host([contents]) [part="root"]) {
|
189
|
+
border-radius: var(${cssScope}--border-radius);
|
190
|
+
${cssScope}--border-radius: .25em;
|
191
|
+
${cssScope}--border-width: .075em;
|
192
|
+
${cssScope}--blockquote-width: .2em;
|
193
|
+
${cssScope}--padding: .5em;
|
194
|
+
display: block;
|
195
|
+
width: 100%;
|
196
|
+
}
|
184
197
|
|
185
|
-
|
186
|
-
|
187
|
-
|
188
|
-
|
189
|
-
|
190
|
-
|
191
|
-
|
192
|
-
|
193
|
-
|
194
|
-
|
195
|
-
|
196
|
-
|
198
|
+
[part="root"] {
|
199
|
+
--color: var(${cssScope}--color);
|
200
|
+
color: var(--color);
|
201
|
+
width: 100%;
|
202
|
+
transition: 0.25s;
|
203
|
+
display: flex;
|
204
|
+
justify-content: space-between;
|
205
|
+
padding: var(${cssScope}--padding);
|
206
|
+
border-radius: inherit;
|
207
|
+
border: var(${cssScope}--border-width) solid var(--color);
|
208
|
+
background: var(${cssScope}--background);
|
209
|
+
}
|
197
210
|
|
198
|
-
|
199
|
-
|
200
|
-
|
201
|
-
|
202
|
-
|
203
|
-
|
204
|
-
|
205
|
-
|
211
|
+
[variant="blockquote"] {
|
212
|
+
border-radius: 0;
|
213
|
+
border-left: var(${cssScope}--blockquote-width) solid var(--color);
|
214
|
+
border-bottom: none;
|
215
|
+
border-right: none;
|
216
|
+
border-top: none;
|
217
|
+
background: transparent;
|
218
|
+
}
|
206
219
|
|
207
|
-
|
208
|
-
|
209
|
-
|
220
|
+
[part="content"] {
|
221
|
+
color: var(--color);
|
222
|
+
}
|
210
223
|
|
211
|
-
|
212
|
-
|
213
|
-
|
214
|
-
|
215
|
-
|
216
|
-
|
224
|
+
[part="root"] {
|
225
|
+
display: grid;
|
226
|
+
align-items: center;
|
227
|
+
grid-template-columns: auto 1fr auto;
|
228
|
+
grid-template-rows: auto 1fr;
|
229
|
+
}
|
217
230
|
|
218
|
-
|
219
|
-
|
220
|
-
|
231
|
+
[part="title"] {
|
232
|
+
line-height: 2em;
|
233
|
+
}
|
221
234
|
|
222
|
-
|
223
|
-
|
224
|
-
|
225
|
-
|
226
|
-
|
235
|
+
[part="icon"] {
|
236
|
+
display: inline-grid;
|
237
|
+
align-items: center;
|
238
|
+
height: 2em;
|
239
|
+
}
|
227
240
|
|
228
|
-
|
229
|
-
|
230
|
-
|
231
|
-
|
232
|
-
|
241
|
+
[part="icon"] svg {
|
242
|
+
margin-right: 0.5em;
|
243
|
+
width: 1.25em;
|
244
|
+
height: 1.25em;
|
245
|
+
}
|
233
246
|
|
234
|
-
|
235
|
-
|
236
|
-
|
237
|
-
|
238
|
-
|
247
|
+
[part="content"] {
|
248
|
+
grid-row: span 2 / span 2;
|
249
|
+
line-height: 1.5em;
|
250
|
+
}
|
251
|
+
`)
|
239
252
|
], Alert);
|
240
253
|
export default Alert;
|
241
254
|
export { Alert };
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"alert.js","sourceRoot":"","sources":["../../src/components/alert.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,kBAAkB,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AACvG,OAAO,kBAAkB,MAAM,+CAA+C,CAAC;AAC/E,OAAO,qBAAqB,MAAM,iDAAiD,CAAC;AACpF,OAAO,cAAc,MAAM,sCAAsC,CAAC;AAClE,OAAO,aAAa,MAAM,oCAAoC,CAAC;AAC/D,OAAO,kBAAkB,MAAM,0CAA0C,CAAC;AAC1E,OAAO,eAAe,MAAM,uCAAuC,CAAC;AACpE,OAAO,
|
1
|
+
{"version":3,"file":"alert.js","sourceRoot":"","sources":["../../src/components/alert.ts"],"names":[],"mappings":"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"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"avatar.d.ts","sourceRoot":"","sources":["../../src/components/avatar.ts"],"names":[],"mappings":"AACA,OAAO,
|
1
|
+
{"version":3,"file":"avatar.d.ts","sourceRoot":"","sources":["../../src/components/avatar.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,cAAc,EAAa,MAAM,KAAK,CAAC;AAGrD,OAAO,EAAE,WAAW,EAAe,MAAM,yBAAyB,CAAC;AAKnE;;;;;;;;GAQG;AACH,cAwCM,MAAO,SAAQ,WAAW;IAC9B;;OAEG;IAEH,GAAG,EAAE,MAAM,GAAG,SAAS,GAAG,IAAI,CAAC;IAE/B;;OAEG;IAEH,IAAI,SAAM;IAEV;;OAEG;IAEH,KAAK,UAAS;IAEd,SAAS,CAAC,MAAM,IAAI,cAAc,CAAC,CAAC,CAAC;IAWrC,OAAO,CAAC,aAAa;IAmBrB,MAAM,IAAI,MAAM;IAIhB,YAAY,IAAI,IAAI;CAGrB;AAED,eAAe,MAAM,CAAC;AACtB,OAAO,EAAE,MAAM,EAAE,CAAC"}
|
package/dev/components/avatar.js
CHANGED
@@ -27,14 +27,30 @@ let Avatar = class Avatar extends GlobalStyle {
|
|
27
27
|
this.round = false;
|
28
28
|
}
|
29
29
|
render() {
|
30
|
-
return html
|
30
|
+
return html `
|
31
|
+
<div
|
32
|
+
part="root"
|
33
|
+
${attr(omit(this.observedRecord, "src"))}
|
34
|
+
>
|
35
|
+
${this._renderAvatar()}
|
36
|
+
</div>
|
37
|
+
`;
|
31
38
|
}
|
32
39
|
_renderAvatar() {
|
33
40
|
if (this.src) {
|
34
|
-
return html
|
41
|
+
return html `
|
42
|
+
<img
|
43
|
+
part="image"
|
44
|
+
src="${this.src}"
|
45
|
+
alt="${this.name}"
|
46
|
+
@error=${this._handleError}
|
47
|
+
/>
|
48
|
+
`;
|
35
49
|
}
|
36
50
|
if (this.name) {
|
37
|
-
return html
|
51
|
+
return html `
|
52
|
+
<span part="name">${this.format()}</span>
|
53
|
+
`;
|
38
54
|
}
|
39
55
|
return htmlSlot();
|
40
56
|
}
|
@@ -57,44 +73,44 @@ __decorate([
|
|
57
73
|
Avatar = __decorate([
|
58
74
|
godown(protoName),
|
59
75
|
styles(css `
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
76
|
+
:host {
|
77
|
+
${cssScope}--size: 2em;
|
78
|
+
width: var(${cssScope}--size);
|
79
|
+
height: var(${cssScope}--size);
|
80
|
+
vertical-align: bottom;
|
81
|
+
}
|
66
82
|
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
83
|
+
:host,
|
84
|
+
[part="root"] {
|
85
|
+
display: inline-flex;
|
86
|
+
}
|
71
87
|
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
88
|
+
:host([contents]) [part="root"] {
|
89
|
+
display: inline-flex;
|
90
|
+
width: inherit;
|
91
|
+
height: inherit;
|
92
|
+
}
|
77
93
|
|
78
|
-
|
79
|
-
|
80
|
-
|
94
|
+
:host([round]) {
|
95
|
+
border-radius: 50%;
|
96
|
+
}
|
81
97
|
|
82
|
-
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
|
98
|
+
[part="image"] {
|
99
|
+
width: 100%;
|
100
|
+
height: 100%;
|
101
|
+
object-fit: cover;
|
102
|
+
}
|
87
103
|
|
88
|
-
|
89
|
-
|
90
|
-
|
91
|
-
|
92
|
-
|
93
|
-
|
94
|
-
|
95
|
-
|
96
|
-
|
97
|
-
|
104
|
+
[part="root"] {
|
105
|
+
overflow: hidden;
|
106
|
+
position: relative;
|
107
|
+
border-radius: inherit;
|
108
|
+
width: 100%;
|
109
|
+
height: 100%;
|
110
|
+
align-items: center;
|
111
|
+
justify-content: center;
|
112
|
+
}
|
113
|
+
`)
|
98
114
|
], Avatar);
|
99
115
|
export default Avatar;
|
100
116
|
export { Avatar };
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"avatar.js","sourceRoot":"","sources":["../../src/components/avatar.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACvE,OAAO,
|
1
|
+
{"version":3,"file":"avatar.js","sourceRoot":"","sources":["../../src/components/avatar.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACvE,OAAO,EAAuB,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAEnE,MAAM,SAAS,GAAG,QAAQ,CAAC;AAC3B,MAAM,QAAQ,GAAG,WAAW,CAAC,SAAS,CAAC,CAAC;AAExC;;;;;;;;GAQG;AAyCH,IAAM,MAAM,GAAZ,MAAM,MAAO,SAAQ,WAAW;IAAhC;;QAOE;;WAEG;QAEH,SAAI,GAAG,EAAE,CAAC;QAEV;;WAEG;QAEH,UAAK,GAAG,KAAK,CAAC;IAuChB,CAAC;IArCW,MAAM;QACd,OAAO,IAAI,CAAA;;;UAGL,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,KAAK,CAAC,CAAC;;UAEtC,IAAI,CAAC,aAAa,EAAE;;KAEzB,CAAC;IACJ,CAAC;IAEO,aAAa;QACnB,IAAI,IAAI,CAAC,GAAG,EAAE,CAAC;YACb,OAAO,IAAI,CAAA;;;iBAGA,IAAI,CAAC,GAAG;iBACR,IAAI,CAAC,IAAI;mBACP,IAAI,CAAC,YAAY;;OAE7B,CAAC;QACJ,CAAC;QACD,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACd,OAAO,IAAI,CAAA;4BACW,IAAI,CAAC,MAAM,EAAE;OAClC,CAAC;QACJ,CAAC;QACD,OAAO,QAAQ,EAAE,CAAC;IACpB,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAC,IAAI,CAAC;IACnB,CAAC;IAED,YAAY;QACV,IAAI,CAAC,GAAG,GAAG,SAAS,CAAC;IACvB,CAAC;CACF,CAAA;AAnDC;IADC,QAAQ,EAAE;mCACoB;AAM/B;IADC,QAAQ,EAAE;oCACD;AAMV;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;qCACd;AAjBV,MAAM;IAxCX,MAAM,CAAC,SAAS,CAAC;IACjB,MAAM,CAAC,GAAG,CAAA;;MAEL,QAAQ;iBACG,QAAQ;kBACP,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkCzB,CAAC;GACI,MAAM,CAwDX;AAED,eAAe,MAAM,CAAC;AACtB,OAAO,EAAE,MAAM,EAAE,CAAC"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../src/components/badge.ts"],"names":[],"mappings":"AACA,OAAO,
|
1
|
+
{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../src/components/badge.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,cAAc,EAAa,MAAM,KAAK,CAAC;AAGrD,OAAO,EAAE,WAAW,EAA8B,MAAM,yBAAyB,CAAC;AAElF,KAAK,QAAQ,GAAG,WAAW,GAAG,UAAU,GAAG,cAAc,GAAG,aAAa,CAAC;AAK1E;;;;;GAKG;AACH,cAsDM,KAAM,SAAQ,WAAW;IAE7B,QAAQ,EAAE,QAAQ,CAAe;IAGjC,KAAK,SAAK;IAEV;;OAEG;IAEH,GAAG,UAAS;IAGZ,GAAG,SAAM;IAET,OAAO,CAAC,WAAW;IAInB,MAAM,IAAI,cAAc,CAAC,CAAC,CAAC;CAe5B;AAED,eAAe,KAAK,CAAC;AACrB,OAAO,EAAE,KAAK,EAAE,CAAC"}
|
package/dev/components/badge.js
CHANGED
@@ -2,7 +2,7 @@ import { __decorate } from "tslib";
|
|
2
2
|
import { attr, godown, htmlSlot, styles } from "@godown/element";
|
3
3
|
import { css, html } from "lit";
|
4
4
|
import { property } from "lit/decorators.js";
|
5
|
-
import {
|
5
|
+
import { GlobalStyle, cssGlobalVars, scopePrefix } from "../core/global-style.js";
|
6
6
|
const protoName = "badge";
|
7
7
|
const cssScope = scopePrefix(protoName);
|
8
8
|
/**
|
@@ -26,12 +26,19 @@ let Badge = class Badge extends GlobalStyle {
|
|
26
26
|
return value > this.max ? this.max + "+" : value + "";
|
27
27
|
}
|
28
28
|
render() {
|
29
|
-
return html
|
30
|
-
|
31
|
-
|
32
|
-
|
29
|
+
return html `
|
30
|
+
<div
|
31
|
+
part="root"
|
32
|
+
${attr(this.observedRecord)}
|
33
|
+
>
|
34
|
+
${htmlSlot()}
|
35
|
+
${this.value || this.dot
|
36
|
+
? html `
|
37
|
+
<div part="badge">${this.dot ? "" : this.formatValue(this.value)}</div>
|
38
|
+
`
|
33
39
|
: ""}
|
34
|
-
|
40
|
+
</div>
|
41
|
+
`;
|
35
42
|
}
|
36
43
|
};
|
37
44
|
__decorate([
|
@@ -49,58 +56,58 @@ __decorate([
|
|
49
56
|
Badge = __decorate([
|
50
57
|
godown(protoName),
|
51
58
|
styles(css `
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
59
|
+
:host {
|
60
|
+
${cssScope}--background: var(${cssGlobalVars.active});
|
61
|
+
${cssScope}--offset: 0%;
|
62
|
+
${cssScope}--offset-x: var(${cssScope}--offset);
|
63
|
+
${cssScope}--offset-y: var(${cssScope}--offset);
|
64
|
+
}
|
58
65
|
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
66
|
+
:host,
|
67
|
+
:host([contents]) [part="root"] {
|
68
|
+
display: inline-block;
|
69
|
+
}
|
63
70
|
|
64
|
-
|
65
|
-
|
66
|
-
|
71
|
+
[part="root"] {
|
72
|
+
position: relative;
|
73
|
+
}
|
67
74
|
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
|
75
|
+
[part="badge"] {
|
76
|
+
position: absolute;
|
77
|
+
font-size: 75%;
|
78
|
+
padding: 0 0.5em;
|
79
|
+
user-select: none;
|
80
|
+
border-radius: calc(infinity * 1px);
|
81
|
+
transform: translate(-50%, -50%);
|
82
|
+
left: var(--left);
|
83
|
+
top: var(--top);
|
84
|
+
background: var(${cssScope}--background);
|
85
|
+
}
|
79
86
|
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
|
87
|
+
[part="badge"]:empty {
|
88
|
+
width: 0.5em;
|
89
|
+
height: 0.5em;
|
90
|
+
font-size: 100%;
|
91
|
+
padding: 0;
|
92
|
+
border-radius: 50%;
|
93
|
+
}
|
87
94
|
|
88
|
-
|
89
|
-
|
90
|
-
|
95
|
+
[position^="top"] {
|
96
|
+
--top: calc(0% + var(${cssScope}--offset-y));
|
97
|
+
}
|
91
98
|
|
92
|
-
|
93
|
-
|
94
|
-
|
99
|
+
[position$="right"] {
|
100
|
+
--left: calc(100% - var(${cssScope}--offset-x));
|
101
|
+
}
|
95
102
|
|
96
|
-
|
97
|
-
|
98
|
-
|
103
|
+
[position^="bottom"] {
|
104
|
+
--top: calc(100% - var(${cssScope}--offset-y));
|
105
|
+
}
|
99
106
|
|
100
|
-
|
101
|
-
|
102
|
-
|
103
|
-
|
107
|
+
[position$="left"] {
|
108
|
+
--left: calc(0% + var(${cssScope}--offset-x));
|
109
|
+
}
|
110
|
+
`)
|
104
111
|
], Badge);
|
105
112
|
export default Badge;
|
106
113
|
export { Badge };
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"badge.js","sourceRoot":"","sources":["../../src/components/badge.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACjE,OAAO,
|
1
|
+
{"version":3,"file":"badge.js","sourceRoot":"","sources":["../../src/components/badge.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACjE,OAAO,EAAuB,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAIlF,MAAM,SAAS,GAAG,OAAO,CAAC;AAC1B,MAAM,QAAQ,GAAG,WAAW,CAAC,SAAS,CAAC,CAAC;AAExC;;;;;GAKG;AAuDH,IAAM,KAAK,GAAX,MAAM,KAAM,SAAQ,WAAW;IAA/B;;QAEE,aAAQ,GAAa,WAAW,CAAC;QAGjC,UAAK,GAAG,CAAC,CAAC;QAEV;;WAEG;QAEH,QAAG,GAAG,KAAK,CAAC;QAGZ,QAAG,GAAG,EAAE,CAAC;IAqBX,CAAC;IAnBS,WAAW,CAAC,KAAa;QAC/B,OAAO,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC,CAAC,CAAC,KAAK,GAAG,EAAE,CAAC;IACxD,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;UAGL,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC;;UAEzB,QAAQ,EAAE;UACV,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,GAAG;YACtB,CAAC,CAAC,IAAI,CAAA;kCACkB,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC;aACjE;YACH,CAAC,CAAC,EAAE;;KAET,CAAC;IACJ,CAAC;CACF,CAAA;AAjCC;IADC,QAAQ,EAAE;uCACsB;AAGjC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oCACjB;AAMV;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;kCAChB;AAGZ;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kCAClB;AAdL,KAAK;IAtDV,MAAM,CAAC,SAAS,CAAC;IACjB,MAAM,CAAC,GAAG,CAAA;;MAEL,QAAQ,qBAAqB,aAAa,CAAC,MAAM;MACjD,QAAQ;MACR,QAAQ,mBAAmB,QAAQ;MACnC,QAAQ,mBAAmB,QAAQ;;;;;;;;;;;;;;;;;;;;;sBAqBnB,QAAQ;;;;;;;;;;;;2BAYH,QAAQ;;;;8BAIL,QAAQ;;;;6BAIT,QAAQ;;;;4BAIT,QAAQ;;CAEnC,CAAC;GACI,KAAK,CAmCV;AAED,eAAe,KAAK,CAAC;AACrB,OAAO,EAAE,KAAK,EAAE,CAAC"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"breath.d.ts","sourceRoot":"","sources":["../../src/components/breath.ts"],"names":[],"mappings":"AACA,OAAO,
|
1
|
+
{"version":3,"file":"breath.d.ts","sourceRoot":"","sources":["../../src/components/breath.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,cAAc,EAAa,MAAM,KAAK,CAAC;AAGrD,OAAO,EAAE,WAAW,EAA8B,MAAM,yBAAyB,CAAC;AAKlF;;;;;;;;;;;;;;GAcG;AACH,cAqEM,MAAO,SAAQ,WAAW;IAC9B;;;;OAIG;IAEH,IAAI,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAExB;;OAEG;IAEH,QAAQ,EAAE,MAAM,CAAC;IAEjB,SAAS,CAAC,MAAM,IAAI,cAAc,CAAC,CAAC,CAAC;IAYrC,SAAS,CAAC,UAAU,CAAC,IAAI,EAAE,MAAM,GAAG,cAAc,CAAC,CAAC,CAAC;IASrD,SAAS,CAAC,QAAQ,IAAI,MAAM,EAAE;IAI9B,SAAS,CAAC,aAAa,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM;IAc5C,SAAS,CAAC,aAAa,IAAI,MAAM,GAAG,SAAS;CAW9C;AAED,eAAe,MAAM,CAAC;AACtB,OAAO,EAAE,MAAM,EAAE,CAAC"}
|
package/dev/components/breath.js
CHANGED
@@ -2,7 +2,7 @@ import { __decorate } from "tslib";
|
|
2
2
|
import { attr, godown, htmlStyle, styles } from "@godown/element";
|
3
3
|
import { css, html } from "lit";
|
4
4
|
import { property } from "lit/decorators.js";
|
5
|
-
import {
|
5
|
+
import { GlobalStyle, cssGlobalVars, scopePrefix } from "../core/global-style.js";
|
6
6
|
const defineName = "breath";
|
7
7
|
const cssScope = scopePrefix(defineName);
|
8
8
|
/**
|
@@ -23,15 +23,22 @@ const cssScope = scopePrefix(defineName);
|
|
23
23
|
let Breath = class Breath extends GlobalStyle {
|
24
24
|
render() {
|
25
25
|
const texts = this.getTexts();
|
26
|
-
return html
|
27
|
-
|
28
|
-
|
26
|
+
return html `
|
27
|
+
<div
|
28
|
+
part="root"
|
29
|
+
${attr(this.observedRecord)}
|
30
|
+
>
|
31
|
+
${[texts.map(this.renderText), htmlStyle(this._computeStyle(texts.length))]}
|
32
|
+
</div>
|
33
|
+
`;
|
29
34
|
}
|
30
35
|
renderText(text) {
|
31
|
-
return html
|
32
|
-
<span class="
|
33
|
-
|
34
|
-
|
36
|
+
return html `
|
37
|
+
<span class="rel">
|
38
|
+
<span class="nocolor">${text}</span>
|
39
|
+
<span class="colorful">${text}</span>
|
40
|
+
</span>
|
41
|
+
`;
|
35
42
|
}
|
36
43
|
getTexts() {
|
37
44
|
return Array.isArray(this.text) ? this.text : (this.text || this.textContent).split(/\s+/).filter((x) => x);
|
@@ -41,12 +48,11 @@ let Breath = class Breath extends GlobalStyle {
|
|
41
48
|
const duration = this.parseDuration() || len * 2 + 2;
|
42
49
|
let style1 = "";
|
43
50
|
for (let number = 1; number <= len; number++) {
|
44
|
-
const delay = -duration / len * (len - number + 1);
|
51
|
+
const delay = (-duration / len) * (len - number + 1);
|
45
52
|
const defaultNumber = ((number - 1) % 3) + 1;
|
46
|
-
style1 +=
|
47
|
-
`.rel:nth-child(${number}) .colorful{animation-delay:${delay}s;background:var(${cssScope}--${number},var(${cssScope}--${defaultNumber}));}`;
|
53
|
+
style1 += `.rel:nth-child(${number}) .colorful{animation-delay:${delay}s;background:var(${cssScope}--${number},var(${cssScope}--${defaultNumber}));}`;
|
48
54
|
}
|
49
|
-
return
|
55
|
+
return `.colorful{animation-duration:${duration}s;}@keyframes colorfulN{0%,${gap * 3}%{opacity:0;}${gap}%,${gap * 2}%{opacity:1;}}${style1}`;
|
50
56
|
}
|
51
57
|
parseDuration() {
|
52
58
|
const { duration } = this;
|
@@ -91,11 +97,11 @@ Breath = __decorate([
|
|
91
97
|
}
|
92
98
|
|
93
99
|
:host,
|
94
|
-
:host([contents]) [part=root] {
|
100
|
+
:host([contents]) [part="root"] {
|
95
101
|
display: flex;
|
96
102
|
}
|
97
103
|
|
98
|
-
[part=root] {
|
104
|
+
[part="root"] {
|
99
105
|
display: contents;
|
100
106
|
}
|
101
107
|
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"breath.js","sourceRoot":"","sources":["../../src/components/breath.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAClE,OAAO,
|
1
|
+
{"version":3,"file":"breath.js","sourceRoot":"","sources":["../../src/components/breath.ts"],"names":[],"mappings":"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"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/components/button.ts"],"names":[],"mappings":"AACA,OAAO,
|
1
|
+
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/components/button.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,cAAc,EAAa,MAAM,KAAK,CAAC;AAGrD,OAAO,EAAE,WAAW,EAA8B,MAAM,yBAAyB,CAAC;AAQlF,KAAK,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,GAAG,QAAQ,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,OAAO,CAAC;AACvH,QAAA,MAAM,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CA6DlC,CAAC;AAEF;;;;;;;;;;;;GAYG;AACH,cAiGM,MAAO,SAAQ,WAAW;IAC9B;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,KAAK,UAAS;IAEd;;OAEG;IAEH,MAAM,UAAS;IAEf;;OAEG;IAEH,KAAK,UAAS;IAEd;;OAEG;IAEH,KAAK,EAAE,MAAM,GAAG,MAAM,OAAO,MAAM,CAAW;IAE9C;;OAEG;IAEH,OAAO,EAAE,MAAM,CAAC;IAGhB,SAAS,CAAC,UAAU,EAAE,WAAW,CAAC;IAElC,SAAS,CAAC,KAAK,EAAE,WAAW,CAAC;IAE7B,SAAS,CAAC,MAAM,IAAI,cAAc,CAAC,CAAC,CAAC;IAarC,KAAK,IAAI,IAAI;IAQb,IAAI,IAAI,IAAI;IAKZ,YAAY,IAAI,IAAI;IAIpB,SAAS,CAAC,YAAY,CAAC,CAAC,EAAE,UAAU,GAAG,IAAI;IAS3C,SAAS,CAAC,YAAY,CAAC,CAAC,EAAE,UAAU,GAAG,IAAI;IAc3C,SAAS,IAAI,MAAM,GAAG,MAAM;CAG7B;AAED,eAAe,MAAM,CAAC;AACtB,OAAO,EAAE,MAAM,EAAE,CAAC"}
|