tinkiet 0.7.2 → 0.7.6
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/package.json +1 -1
- package/umd/tinkiet.min.d.ts.map +1 -1
- package/umd/tinkiet.min.js +1 -1
- package/tinkiet/accordion/accordion.d.ts +0 -18
- package/tinkiet/accordion/accordion.js +0 -94
- package/tinkiet/accordion/accordion.scss.js +0 -4
- package/tinkiet/accordion/index.d.ts +0 -1
- package/tinkiet/accordion/index.js +0 -1
- package/tinkiet/badge/badge.d.ts +0 -15
- package/tinkiet/badge/badge.js +0 -27
- package/tinkiet/badge/badge.scss.js +0 -4
- package/tinkiet/badge/index.d.ts +0 -1
- package/tinkiet/badge/index.js +0 -1
- package/tinkiet/box/box.d.ts +0 -56
- package/tinkiet/box/box.js +0 -182
- package/tinkiet/box/box.scss.js +0 -4
- package/tinkiet/box/focusable-box.d.ts +0 -13
- package/tinkiet/box/focusable-box.js +0 -30
- package/tinkiet/box/index.d.ts +0 -1
- package/tinkiet/box/index.js +0 -1
- package/tinkiet/button/button.d.ts +0 -39
- package/tinkiet/button/button.js +0 -125
- package/tinkiet/button/button.scss.js +0 -4
- package/tinkiet/button/index.d.ts +0 -1
- package/tinkiet/button/index.js +0 -1
- package/tinkiet/checkbox/checkbox.d.ts +0 -21
- package/tinkiet/checkbox/checkbox.js +0 -83
- package/tinkiet/checkbox/checkbox.scss.js +0 -4
- package/tinkiet/checkbox/index.d.ts +0 -1
- package/tinkiet/checkbox/index.js +0 -1
- package/tinkiet/dialog/dialog.d.ts +0 -18
- package/tinkiet/dialog/dialog.js +0 -58
- package/tinkiet/dialog/dialog.scss.js +0 -4
- package/tinkiet/dialog/index.d.ts +0 -1
- package/tinkiet/dialog/index.js +0 -1
- package/tinkiet/drawer/drawer.d.ts +0 -29
- package/tinkiet/drawer/drawer.js +0 -152
- package/tinkiet/drawer/drawer.scss.js +0 -4
- package/tinkiet/drawer/index.d.ts +0 -1
- package/tinkiet/drawer/index.js +0 -1
- package/tinkiet/form/form.d.ts +0 -15
- package/tinkiet/form/form.js +0 -57
- package/tinkiet/form/index.d.ts +0 -1
- package/tinkiet/form/index.js +0 -1
- package/tinkiet/icon/icon.d.ts +0 -17
- package/tinkiet/icon/icon.js +0 -75
- package/tinkiet/icon/icon.scss.js +0 -4
- package/tinkiet/icon/icons.d.ts +0 -7
- package/tinkiet/icon/icons.js +0 -24
- package/tinkiet/icon/index.d.ts +0 -2
- package/tinkiet/icon/index.js +0 -2
- package/tinkiet/index.d.ts +0 -24
- package/tinkiet/index.d.ts.map +0 -1
- package/tinkiet/index.js +0 -47
- package/tinkiet/list-item/index.d.ts +0 -1
- package/tinkiet/list-item/index.js +0 -1
- package/tinkiet/list-item/list-item.d.ts +0 -20
- package/tinkiet/list-item/list-item.js +0 -72
- package/tinkiet/list-item/list-item.scss.js +0 -4
- package/tinkiet/loading/index.d.ts +0 -1
- package/tinkiet/loading/index.js +0 -1
- package/tinkiet/loading/loading.d.ts +0 -14
- package/tinkiet/loading/loading.js +0 -64
- package/tinkiet/loading/loading.scss.js +0 -4
- package/tinkiet/navbar/index.d.ts +0 -1
- package/tinkiet/navbar/index.js +0 -1
- package/tinkiet/navbar/navbar.d.ts +0 -11
- package/tinkiet/navbar/navbar.js +0 -33
- package/tinkiet/navbar/navbar.scss.js +0 -4
- package/tinkiet/notie/index.d.ts +0 -1
- package/tinkiet/notie/index.js +0 -1
- package/tinkiet/notie/notie.d.ts +0 -69
- package/tinkiet/notie/notie.js +0 -193
- package/tinkiet/notie/notie.scss.js +0 -4
- package/tinkiet/pages/index.d.ts +0 -1
- package/tinkiet/pages/index.js +0 -1
- package/tinkiet/pages/pages.d.ts +0 -18
- package/tinkiet/pages/pages.js +0 -75
- package/tinkiet/pages/pages.scss.js +0 -4
- package/tinkiet/radio/index.d.ts +0 -1
- package/tinkiet/radio/index.js +0 -1
- package/tinkiet/radio/radio.d.ts +0 -24
- package/tinkiet/radio/radio.js +0 -98
- package/tinkiet/radio/radio.scss.js +0 -4
- package/tinkiet/select/index.d.ts +0 -1
- package/tinkiet/select/index.js +0 -1
- package/tinkiet/select/select.d.ts +0 -32
- package/tinkiet/select/select.js +0 -132
- package/tinkiet/select/select.scss.js +0 -4
- package/tinkiet/slider/index.d.ts +0 -1
- package/tinkiet/slider/index.js +0 -1
- package/tinkiet/slider/slider.d.ts +0 -30
- package/tinkiet/slider/slider.js +0 -135
- package/tinkiet/slider/slider.scss.js +0 -4
- package/tinkiet/switch/index.d.ts +0 -1
- package/tinkiet/switch/index.js +0 -1
- package/tinkiet/switch/switch.d.ts +0 -24
- package/tinkiet/switch/switch.js +0 -99
- package/tinkiet/switch/switch.scss.js +0 -4
- package/tinkiet/tab-group/index.d.ts +0 -1
- package/tinkiet/tab-group/index.js +0 -1
- package/tinkiet/tab-group/tab-group.d.ts +0 -21
- package/tinkiet/tab-group/tab-group.js +0 -97
- package/tinkiet/tab-group/tab-group.scss.js +0 -4
- package/tinkiet/tag/index.d.ts +0 -1
- package/tinkiet/tag/index.js +0 -1
- package/tinkiet/tag/tag.d.ts +0 -11
- package/tinkiet/tag/tag.js +0 -20
- package/tinkiet/tag/tag.scss.js +0 -4
- package/tinkiet/textarea/index.d.ts +0 -1
- package/tinkiet/textarea/index.js +0 -1
- package/tinkiet/textarea/textarea.d.ts +0 -33
- package/tinkiet/textarea/textarea.js +0 -133
- package/tinkiet/textarea/textarea.scss.js +0 -4
- package/tinkiet/textfield/index.d.ts +0 -1
- package/tinkiet/textfield/index.js +0 -1
- package/tinkiet/textfield/textfield.d.ts +0 -34
- package/tinkiet/textfield/textfield.js +0 -136
- package/tinkiet/textfield/textfield.scss.js +0 -4
- package/tinkiet/theme/index.d.ts +0 -1
- package/tinkiet/theme/index.js +0 -1
- package/tinkiet/theme/theme.d.ts +0 -33
- package/tinkiet/theme/theme.js +0 -187
- package/tinkiet/theme/theme.scss.js +0 -4
- package/tinkiet/utils/unique.d.ts +0 -7
- package/tinkiet/utils/unique.js +0 -12
package/tinkiet/icon/icon.d.ts
DELETED
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import { TkBox } from "../box/index";
|
|
2
|
-
declare class TkIcon extends TkBox {
|
|
3
|
-
static get styles(): import("lit").CSSResult[];
|
|
4
|
-
name: string;
|
|
5
|
-
library: string;
|
|
6
|
-
path: string;
|
|
7
|
-
private svg;
|
|
8
|
-
render(): import("lit-html").TemplateResult<1>;
|
|
9
|
-
updated(props: any): void;
|
|
10
|
-
loadIcon(): Promise<void>;
|
|
11
|
-
}
|
|
12
|
-
declare global {
|
|
13
|
-
interface HTMLElementTagNameMap {
|
|
14
|
-
"tk-icon": TkIcon;
|
|
15
|
-
}
|
|
16
|
-
}
|
|
17
|
-
export { TkIcon };
|
package/tinkiet/icon/icon.js
DELETED
|
@@ -1,75 +0,0 @@
|
|
|
1
|
-
import { __decorate } from 'tslib';
|
|
2
|
-
import { css, unsafeCSS, html } from 'lit';
|
|
3
|
-
import { property, customElement } from 'lit/decorators.js';
|
|
4
|
-
import { unsafeHTML } from 'lit/directives/unsafe-html.js';
|
|
5
|
-
import '../box/index.js';
|
|
6
|
-
import css_248z from './icon.scss.js';
|
|
7
|
-
import { TkBox } from '../box/box.js';
|
|
8
|
-
|
|
9
|
-
let TkIcon = class TkIcon extends TkBox {
|
|
10
|
-
constructor() {
|
|
11
|
-
super(...arguments);
|
|
12
|
-
this.svg = "";
|
|
13
|
-
}
|
|
14
|
-
static get styles() {
|
|
15
|
-
return [
|
|
16
|
-
...TkBox.styles,
|
|
17
|
-
css `
|
|
18
|
-
${unsafeCSS(css_248z)}
|
|
19
|
-
`
|
|
20
|
-
];
|
|
21
|
-
}
|
|
22
|
-
render() {
|
|
23
|
-
return html `
|
|
24
|
-
${this.path
|
|
25
|
-
? html `
|
|
26
|
-
<svg viewBox="0 0 24 24"><path d="${this.path}"></path></svg>
|
|
27
|
-
`
|
|
28
|
-
: html `
|
|
29
|
-
${unsafeHTML(this.svg)}
|
|
30
|
-
`}
|
|
31
|
-
`;
|
|
32
|
-
}
|
|
33
|
-
updated(props) {
|
|
34
|
-
if (props.has("name") && this.name)
|
|
35
|
-
this.loadIcon();
|
|
36
|
-
}
|
|
37
|
-
async loadIcon() {
|
|
38
|
-
const resolver = this.library
|
|
39
|
-
? document.querySelector(`tk-icons[library=${this.library}]`)
|
|
40
|
-
: document.querySelector("tk-icons");
|
|
41
|
-
if (resolver) {
|
|
42
|
-
this.svg = await fetch(resolver.resolve(this.name))
|
|
43
|
-
.then(response => {
|
|
44
|
-
return response.blob().then(blob => {
|
|
45
|
-
return {
|
|
46
|
-
contentType: response.headers.get("Content-Type"),
|
|
47
|
-
raw: blob
|
|
48
|
-
};
|
|
49
|
-
});
|
|
50
|
-
})
|
|
51
|
-
.then(data => {
|
|
52
|
-
if (data.contentType && /svg/.test(data.contentType))
|
|
53
|
-
return data.raw.text();
|
|
54
|
-
return "";
|
|
55
|
-
});
|
|
56
|
-
}
|
|
57
|
-
}
|
|
58
|
-
};
|
|
59
|
-
__decorate([
|
|
60
|
-
property()
|
|
61
|
-
], TkIcon.prototype, "name", void 0);
|
|
62
|
-
__decorate([
|
|
63
|
-
property()
|
|
64
|
-
], TkIcon.prototype, "library", void 0);
|
|
65
|
-
__decorate([
|
|
66
|
-
property()
|
|
67
|
-
], TkIcon.prototype, "path", void 0);
|
|
68
|
-
__decorate([
|
|
69
|
-
property()
|
|
70
|
-
], TkIcon.prototype, "svg", void 0);
|
|
71
|
-
TkIcon = __decorate([
|
|
72
|
-
customElement("tk-icon")
|
|
73
|
-
], TkIcon);
|
|
74
|
-
|
|
75
|
-
export { TkIcon };
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
var css_248z = "*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--color:var(--tk-icon-color,currentColor);display:inline-flex;height:1.5em;width:1.5em}:host svg{fill:var(--color);display:block;height:100%;width:100%}";
|
|
2
|
-
var stylesheet="*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--color:var(--tk-icon-color,currentColor);display:inline-flex;height:1.5em;width:1.5em}:host svg{fill:var(--color);display:block;height:100%;width:100%}";
|
|
3
|
-
|
|
4
|
-
export { css_248z as default, stylesheet };
|
package/tinkiet/icon/icons.d.ts
DELETED
package/tinkiet/icon/icons.js
DELETED
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
import { __decorate } from 'tslib';
|
|
2
|
-
import { LitElement } from 'lit';
|
|
3
|
-
import { property, customElement } from 'lit/decorators.js';
|
|
4
|
-
|
|
5
|
-
let TkIcons = class TkIcons extends LitElement {
|
|
6
|
-
constructor() {
|
|
7
|
-
super(...arguments);
|
|
8
|
-
this.library = "default";
|
|
9
|
-
}
|
|
10
|
-
firstUpdated() {
|
|
11
|
-
window.document.body.appendChild(this);
|
|
12
|
-
}
|
|
13
|
-
};
|
|
14
|
-
__decorate([
|
|
15
|
-
property({ attribute: false })
|
|
16
|
-
], TkIcons.prototype, "resolve", void 0);
|
|
17
|
-
__decorate([
|
|
18
|
-
property({ reflect: true })
|
|
19
|
-
], TkIcons.prototype, "library", void 0);
|
|
20
|
-
TkIcons = __decorate([
|
|
21
|
-
customElement("tk-icons")
|
|
22
|
-
], TkIcons);
|
|
23
|
-
|
|
24
|
-
export { TkIcons };
|
package/tinkiet/icon/index.d.ts
DELETED
package/tinkiet/icon/index.js
DELETED
package/tinkiet/index.d.ts
DELETED
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
export * from "./accordion/index";
|
|
2
|
-
export * from "./badge/index";
|
|
3
|
-
export * from "./box/index";
|
|
4
|
-
export * from "./button/index";
|
|
5
|
-
export * from "./checkbox/index";
|
|
6
|
-
export * from "./dialog/index";
|
|
7
|
-
export * from "./drawer/index";
|
|
8
|
-
export * from "./form/index";
|
|
9
|
-
export * from "./icon/index";
|
|
10
|
-
export * from "./list-item/index";
|
|
11
|
-
export * from "./loading/index";
|
|
12
|
-
export * from "./navbar/index";
|
|
13
|
-
export * from "./notie/index";
|
|
14
|
-
export * from "./pages/index";
|
|
15
|
-
export * from "./radio/index";
|
|
16
|
-
export * from "./select/index";
|
|
17
|
-
export * from "./slider/index";
|
|
18
|
-
export * from "./switch/index";
|
|
19
|
-
export * from "./tab-group/index";
|
|
20
|
-
export * from "./tag/index";
|
|
21
|
-
export * from "./textarea/index";
|
|
22
|
-
export * from "./textfield/index";
|
|
23
|
-
export * from "./theme/index";
|
|
24
|
-
//# sourceMappingURL=tinkiet/index.d.ts.map
|
package/tinkiet/index.d.ts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"tinkiet/index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAAA,kCAA4B;AAC5B,8BAAwB;AACxB,4BAAsB;AACtB,+BAAyB;AACzB,iCAA2B;AAC3B,+BAAyB;AACzB,+BAAyB;AACzB,6BAAuB;AACvB,6BAAuB;AACvB,kCAA4B;AAC5B,gCAA0B;AAC1B,+BAAyB;AACzB,8BAAwB;AACxB,8BAAwB;AACxB,8BAAwB;AACxB,+BAAyB;AACzB,+BAAyB;AACzB,+BAAyB;AACzB,kCAA4B;AAC5B,4BAAsB;AACtB,iCAA2B;AAC3B,kCAA4B;AAC5B,8BAAwB"}
|
package/tinkiet/index.js
DELETED
|
@@ -1,47 +0,0 @@
|
|
|
1
|
-
import './accordion/index.js';
|
|
2
|
-
import './badge/index.js';
|
|
3
|
-
import './box/index.js';
|
|
4
|
-
import './button/index.js';
|
|
5
|
-
import './checkbox/index.js';
|
|
6
|
-
import './dialog/index.js';
|
|
7
|
-
import './drawer/index.js';
|
|
8
|
-
import './form/index.js';
|
|
9
|
-
import './icon/index.js';
|
|
10
|
-
import './list-item/index.js';
|
|
11
|
-
import './loading/index.js';
|
|
12
|
-
import './navbar/index.js';
|
|
13
|
-
import './notie/index.js';
|
|
14
|
-
import './pages/index.js';
|
|
15
|
-
import './radio/index.js';
|
|
16
|
-
import './select/index.js';
|
|
17
|
-
import './slider/index.js';
|
|
18
|
-
import './switch/index.js';
|
|
19
|
-
import './tab-group/index.js';
|
|
20
|
-
import './tag/index.js';
|
|
21
|
-
import './textarea/index.js';
|
|
22
|
-
import './textfield/index.js';
|
|
23
|
-
import './theme/index.js';
|
|
24
|
-
export { TkAccordion } from './accordion/accordion.js';
|
|
25
|
-
export { TkBadge } from './badge/badge.js';
|
|
26
|
-
export { TkBox } from './box/box.js';
|
|
27
|
-
export { TkButton } from './button/button.js';
|
|
28
|
-
export { TkCheckbox } from './checkbox/checkbox.js';
|
|
29
|
-
export { TkDialog } from './dialog/dialog.js';
|
|
30
|
-
export { TkDrawer } from './drawer/drawer.js';
|
|
31
|
-
export { TkForm } from './form/form.js';
|
|
32
|
-
export { TkIcon } from './icon/icon.js';
|
|
33
|
-
export { TkIcons } from './icon/icons.js';
|
|
34
|
-
export { TkListItem } from './list-item/list-item.js';
|
|
35
|
-
export { TkLoading } from './loading/loading.js';
|
|
36
|
-
export { TkNavbar } from './navbar/navbar.js';
|
|
37
|
-
export { TkNotie } from './notie/notie.js';
|
|
38
|
-
export { TkPages } from './pages/pages.js';
|
|
39
|
-
export { TkRadio } from './radio/radio.js';
|
|
40
|
-
export { TkSelect } from './select/select.js';
|
|
41
|
-
export { TkSlider } from './slider/slider.js';
|
|
42
|
-
export { TkSwitch } from './switch/switch.js';
|
|
43
|
-
export { TkTabGroup } from './tab-group/tab-group.js';
|
|
44
|
-
export { TkTag } from './tag/tag.js';
|
|
45
|
-
export { TkTextarea } from './textarea/textarea.js';
|
|
46
|
-
export { TkTextfield } from './textfield/textfield.js';
|
|
47
|
-
export { TkTheme } from './theme/theme.js';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from "./list-item";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { TkListItem } from './list-item.js';
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import { LitElement } from "lit";
|
|
2
|
-
declare class TkListItem extends LitElement {
|
|
3
|
-
static styles: import("lit").CSSResult;
|
|
4
|
-
href: string;
|
|
5
|
-
target: string;
|
|
6
|
-
ariaLabel: string;
|
|
7
|
-
protected $ahref: HTMLAnchorElement;
|
|
8
|
-
render(): import("lit-html").TemplateResult<1>;
|
|
9
|
-
constructor();
|
|
10
|
-
firstUpdated(): void;
|
|
11
|
-
connectedCallback(): void;
|
|
12
|
-
disconnectedCallback(): void;
|
|
13
|
-
protected handleClick(e: Event): void;
|
|
14
|
-
}
|
|
15
|
-
declare global {
|
|
16
|
-
interface HTMLElementTagNameMap {
|
|
17
|
-
"tk-list-item": TkListItem;
|
|
18
|
-
}
|
|
19
|
-
}
|
|
20
|
-
export { TkListItem };
|
|
@@ -1,72 +0,0 @@
|
|
|
1
|
-
import { __decorate } from 'tslib';
|
|
2
|
-
import { LitElement, html, css, unsafeCSS } from 'lit';
|
|
3
|
-
import { property, query, customElement } from 'lit/decorators.js';
|
|
4
|
-
import css_248z from './list-item.scss.js';
|
|
5
|
-
|
|
6
|
-
let TkListItem = class TkListItem extends LitElement {
|
|
7
|
-
render() {
|
|
8
|
-
return html `
|
|
9
|
-
<slot name="before" @click=${this.handleClick}></slot>
|
|
10
|
-
<div id="content">
|
|
11
|
-
<slot></slot>
|
|
12
|
-
</div>
|
|
13
|
-
<slot name="after" @click=${this.handleClick}></slot>
|
|
14
|
-
${this.href
|
|
15
|
-
? html `
|
|
16
|
-
<a tabindex="-1" id="ahref" href="${this.href}" rel="noreferrer" aria-label=${this.ariaLabel}></a>
|
|
17
|
-
`
|
|
18
|
-
: ""}
|
|
19
|
-
`;
|
|
20
|
-
}
|
|
21
|
-
constructor() {
|
|
22
|
-
super();
|
|
23
|
-
this.href = "";
|
|
24
|
-
this.target = "";
|
|
25
|
-
}
|
|
26
|
-
firstUpdated() {
|
|
27
|
-
if (!this.ariaLabel && this.innerText)
|
|
28
|
-
this.ariaLabel = this.innerText;
|
|
29
|
-
}
|
|
30
|
-
connectedCallback() {
|
|
31
|
-
super.connectedCallback();
|
|
32
|
-
this.addEventListener("click", this.handleClick.bind(this));
|
|
33
|
-
}
|
|
34
|
-
disconnectedCallback() {
|
|
35
|
-
this.removeEventListener("click", this.handleClick);
|
|
36
|
-
super.disconnectedCallback();
|
|
37
|
-
}
|
|
38
|
-
handleClick(e) {
|
|
39
|
-
const target = e.target;
|
|
40
|
-
// In case click cames from a slotted element with href attribute we stop propagation
|
|
41
|
-
if ((target.tagName == "BUTTON" || target.tagName == "TK-BUTTON") && target.hasAttribute("href")) {
|
|
42
|
-
// e.preventDefault();
|
|
43
|
-
//e.stopPropagation();
|
|
44
|
-
}
|
|
45
|
-
;
|
|
46
|
-
if (this.href && e.isTrusted) {
|
|
47
|
-
e.stopPropagation();
|
|
48
|
-
e.preventDefault();
|
|
49
|
-
this.$ahref.click();
|
|
50
|
-
}
|
|
51
|
-
}
|
|
52
|
-
};
|
|
53
|
-
TkListItem.styles = css `
|
|
54
|
-
${unsafeCSS(css_248z)}
|
|
55
|
-
`;
|
|
56
|
-
__decorate([
|
|
57
|
-
property({ attribute: true })
|
|
58
|
-
], TkListItem.prototype, "href", void 0);
|
|
59
|
-
__decorate([
|
|
60
|
-
property({ attribute: true })
|
|
61
|
-
], TkListItem.prototype, "target", void 0);
|
|
62
|
-
__decorate([
|
|
63
|
-
property({ attribute: "aria-label" })
|
|
64
|
-
], TkListItem.prototype, "ariaLabel", void 0);
|
|
65
|
-
__decorate([
|
|
66
|
-
query("#ahref")
|
|
67
|
-
], TkListItem.prototype, "$ahref", void 0);
|
|
68
|
-
TkListItem = __decorate([
|
|
69
|
-
customElement("tk-list-item")
|
|
70
|
-
], TkListItem);
|
|
71
|
-
|
|
72
|
-
export { TkListItem };
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
var css_248z = "*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--text:var(--list-item-color,var(--foreground,#454545));--color:var(--list-item-bg,var(--background,#f7f7f7));align-items:center;background:var(--color);border-radius:var(--list-item-border-radius,var(--border-radius-large,.5rem));color:var(--text);display:flex;outline:none;overflow:hidden;padding:var(--spacing-m,1rem) var(--spacing-m,1rem);position:relative;text-align:left;transition:var(--list-item-transition,background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease))}:host([clickable]),:host([href]){user-select:none}:host([clickable]:not([active]):not([disabled])),:host([href]:not([active]):not([disabled])){cursor:pointer}:host(:focus),:host(:hover){--color:var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3)));will-change:background,color}:host([active]:focus),:host([active]:hover){--text:var(--primary-darker,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),calc(var(--primary-l, 59.4118%)*0.7)));--color:var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3)))}:host([disabled]){--text:var(--shade-dark,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*0.85)));--color:var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%)));opacity:.4;pointer-events:none}:host([active]){--text:var(--primary-darker,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),calc(var(--primary-l, 59.4118%)*0.7)));--color:var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3)))}::slotted([slot=after]),::slotted([slot=before]){flex-shrink:0}::slotted([slot=before]){align-self:var(--list-item-left-align-self,center);margin:0 var(--spacing-m,1rem) 0 0}::slotted([slot=after]){align-self:var(--list-item-left-align-self,center);margin:0 0 0 var(--spacing-m,1rem)}#content{display:flex;flex-direction:column;flex-grow:1}";
|
|
2
|
-
var stylesheet="*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--text:var(--list-item-color,var(--foreground,#454545));--color:var(--list-item-bg,var(--background,#f7f7f7));align-items:center;background:var(--color);border-radius:var(--list-item-border-radius,var(--border-radius-large,.5rem));color:var(--text);display:flex;outline:none;overflow:hidden;padding:var(--spacing-m,1rem) var(--spacing-m,1rem);position:relative;text-align:left;transition:var(--list-item-transition,background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease))}:host([clickable]),:host([href]){user-select:none}:host([clickable]:not([active]):not([disabled])),:host([href]:not([active]):not([disabled])){cursor:pointer}:host(:focus),:host(:hover){--color:var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3)));will-change:background,color}:host([active]:focus),:host([active]:hover){--text:var(--primary-darker,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),calc(var(--primary-l, 59.4118%)*0.7)));--color:var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3)))}:host([disabled]){--text:var(--shade-dark,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*0.85)));--color:var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%)));opacity:.4;pointer-events:none}:host([active]){--text:var(--primary-darker,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),calc(var(--primary-l, 59.4118%)*0.7)));--color:var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3)))}::slotted([slot=after]),::slotted([slot=before]){flex-shrink:0}::slotted([slot=before]){align-self:var(--list-item-left-align-self,center);margin:0 var(--spacing-m,1rem) 0 0}::slotted([slot=after]){align-self:var(--list-item-left-align-self,center);margin:0 0 0 var(--spacing-m,1rem)}#content{display:flex;flex-direction:column;flex-grow:1}";
|
|
3
|
-
|
|
4
|
-
export { css_248z as default, stylesheet };
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from "./loading";
|
package/tinkiet/loading/index.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { TkLoading } from './loading.js';
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
import { TkBox } from "../box/index";
|
|
2
|
-
declare class TkLoading extends TkBox {
|
|
3
|
-
static get styles(): import("lit").CSSResult[];
|
|
4
|
-
circle: boolean;
|
|
5
|
-
indeterminate: boolean;
|
|
6
|
-
percent: number;
|
|
7
|
-
render(): import("lit-html").TemplateResult<1>;
|
|
8
|
-
}
|
|
9
|
-
declare global {
|
|
10
|
-
interface HTMLElementTagNameMap {
|
|
11
|
-
"tk-loading": TkLoading;
|
|
12
|
-
}
|
|
13
|
-
}
|
|
14
|
-
export { TkLoading };
|
|
@@ -1,64 +0,0 @@
|
|
|
1
|
-
import { __decorate } from 'tslib';
|
|
2
|
-
import { css, unsafeCSS, html } from 'lit';
|
|
3
|
-
import { property, customElement } from 'lit/decorators.js';
|
|
4
|
-
import { classMap } from 'lit/directives/class-map.js';
|
|
5
|
-
import '../../node_modules/lit/directives/style-map.js';
|
|
6
|
-
import '../box/index.js';
|
|
7
|
-
import css_248z from './loading.scss.js';
|
|
8
|
-
import { TkBox } from '../box/box.js';
|
|
9
|
-
import { styleMap as i } from '../../node_modules/lit-html/directives/style-map.js';
|
|
10
|
-
|
|
11
|
-
let TkLoading = class TkLoading extends TkBox {
|
|
12
|
-
constructor() {
|
|
13
|
-
super(...arguments);
|
|
14
|
-
this.circle = false;
|
|
15
|
-
this.indeterminate = false;
|
|
16
|
-
this.percent = 0;
|
|
17
|
-
}
|
|
18
|
-
static get styles() {
|
|
19
|
-
return [
|
|
20
|
-
...TkBox.styles,
|
|
21
|
-
css `
|
|
22
|
-
${unsafeCSS(css_248z)}
|
|
23
|
-
`
|
|
24
|
-
];
|
|
25
|
-
}
|
|
26
|
-
render() {
|
|
27
|
-
const lineStyle = { width: this.percent + "%" };
|
|
28
|
-
return html `
|
|
29
|
-
${this.circle
|
|
30
|
-
? html `
|
|
31
|
-
<svg class="circle" viewBox="0 0 100 100">
|
|
32
|
-
<circle
|
|
33
|
-
class=${classMap({ indeterminate: this.indeterminate, path: true })}
|
|
34
|
-
fill="none"
|
|
35
|
-
stroke-width="1em"
|
|
36
|
-
stroke-linecap="butt"
|
|
37
|
-
cx="50"
|
|
38
|
-
cy="50"
|
|
39
|
-
r="40"
|
|
40
|
-
></circle>
|
|
41
|
-
</svg>
|
|
42
|
-
`
|
|
43
|
-
: html `
|
|
44
|
-
<div class="line">
|
|
45
|
-
<div class=${classMap({ progress: true, indeterminate: this.indeterminate })} style="${i(lineStyle)}"></div>
|
|
46
|
-
</div>
|
|
47
|
-
`}
|
|
48
|
-
`;
|
|
49
|
-
}
|
|
50
|
-
};
|
|
51
|
-
__decorate([
|
|
52
|
-
property({ attribute: true, type: Boolean })
|
|
53
|
-
], TkLoading.prototype, "circle", void 0);
|
|
54
|
-
__decorate([
|
|
55
|
-
property({ attribute: true, type: Boolean })
|
|
56
|
-
], TkLoading.prototype, "indeterminate", void 0);
|
|
57
|
-
__decorate([
|
|
58
|
-
property({ attribute: true, type: Number })
|
|
59
|
-
], TkLoading.prototype, "percent", void 0);
|
|
60
|
-
TkLoading = __decorate([
|
|
61
|
-
customElement("tk-loading")
|
|
62
|
-
], TkLoading);
|
|
63
|
-
|
|
64
|
-
export { TkLoading };
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
var css_248z = "*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--color:currentColor;--background-color:var(--tk-loading-background-color,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))))}:host([accent]){--color:var(--accent)}:host([error]){--color:var(--error)}.circle{animation:rotator 3s linear infinite;display:inline-flex;height:2em;width:2em}.circle,.circle .path{transform-origin:center}.circle .path{stroke-dasharray:265;stroke-dashoffset:0;stroke:var(--color);animation:dash 3s ease-in-out infinite}@keyframes rotator{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes dash{0%{stroke-dashoffset:265}50%{stroke-dashoffset:65;transform:rotate(90deg)}to{stroke-dashoffset:265;transform:rotate(1turn)}}.line{background-color:var(--background-color);height:.4em;overflow:hidden;position:relative}.line .progress{height:100%}.line .indeterminate,.line .progress{background-color:var(--color)}.line .indeterminate:before{animation:indeterminate 2.1s cubic-bezier(.65,.815,.735,.395) infinite}.line .indeterminate:after,.line .indeterminate:before{background-color:inherit;bottom:0;content:\"\";left:0;position:absolute;top:0;will-change:left,right}.line .indeterminate:after{animation:indeterminate-short 2.1s cubic-bezier(.165,.84,.44,1) infinite;animation-delay:1.15s}@keyframes indeterminate{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@keyframes indeterminate-short{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}";
|
|
2
|
-
var stylesheet="*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--color:currentColor;--background-color:var(--tk-loading-background-color,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))))}:host([accent]){--color:var(--accent)}:host([error]){--color:var(--error)}.circle{animation:rotator 3s linear infinite;display:inline-flex;height:2em;width:2em}.circle,.circle .path{transform-origin:center}.circle .path{stroke-dasharray:265;stroke-dashoffset:0;stroke:var(--color);animation:dash 3s ease-in-out infinite}@keyframes rotator{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes dash{0%{stroke-dashoffset:265}50%{stroke-dashoffset:65;transform:rotate(90deg)}to{stroke-dashoffset:265;transform:rotate(1turn)}}.line{background-color:var(--background-color);height:.4em;overflow:hidden;position:relative}.line .progress{height:100%}.line .indeterminate,.line .progress{background-color:var(--color)}.line .indeterminate:before{animation:indeterminate 2.1s cubic-bezier(.65,.815,.735,.395) infinite}.line .indeterminate:after,.line .indeterminate:before{background-color:inherit;bottom:0;content:\"\";left:0;position:absolute;top:0;will-change:left,right}.line .indeterminate:after{animation:indeterminate-short 2.1s cubic-bezier(.165,.84,.44,1) infinite;animation-delay:1.15s}@keyframes indeterminate{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@keyframes indeterminate-short{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}";
|
|
3
|
-
|
|
4
|
-
export { css_248z as default, stylesheet };
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from "./navbar";
|
package/tinkiet/navbar/index.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { TkNavbar } from './navbar.js';
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import { TkBox } from "../box/index";
|
|
2
|
-
declare class TkNavbar extends TkBox {
|
|
3
|
-
static get styles(): import("lit").CSSResult[];
|
|
4
|
-
render(): import("lit-html").TemplateResult<1>;
|
|
5
|
-
}
|
|
6
|
-
declare global {
|
|
7
|
-
interface HTMLElementTagNameMap {
|
|
8
|
-
"tk-navbar": TkNavbar;
|
|
9
|
-
}
|
|
10
|
-
}
|
|
11
|
-
export { TkNavbar };
|
package/tinkiet/navbar/navbar.js
DELETED
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
import { __decorate } from 'tslib';
|
|
2
|
-
import { css, unsafeCSS, html } from 'lit';
|
|
3
|
-
import { customElement } from 'lit/decorators.js';
|
|
4
|
-
import '../box/index.js';
|
|
5
|
-
import css_248z from './navbar.scss.js';
|
|
6
|
-
import { TkBox } from '../box/box.js';
|
|
7
|
-
|
|
8
|
-
let TkNavbar = class TkNavbar extends TkBox {
|
|
9
|
-
static get styles() {
|
|
10
|
-
return [
|
|
11
|
-
...TkBox.styles,
|
|
12
|
-
css `
|
|
13
|
-
${unsafeCSS(css_248z)}
|
|
14
|
-
`
|
|
15
|
-
];
|
|
16
|
-
}
|
|
17
|
-
render() {
|
|
18
|
-
return html `
|
|
19
|
-
<div id="left">
|
|
20
|
-
<slot name="left"></slot>
|
|
21
|
-
<slot name="title"></slot>
|
|
22
|
-
</div>
|
|
23
|
-
<div id="right">
|
|
24
|
-
<slot name="right"></slot>
|
|
25
|
-
</div>
|
|
26
|
-
`;
|
|
27
|
-
}
|
|
28
|
-
};
|
|
29
|
-
TkNavbar = __decorate([
|
|
30
|
-
customElement("tk-navbar")
|
|
31
|
-
], TkNavbar);
|
|
32
|
-
|
|
33
|
-
export { TkNavbar };
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
var css_248z = "*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--color:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)));--text:var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%)));align-items:center;background:var(--color);color:var(--text);flex-direction:row;justify-content:space-between}:host([inverted]){--color:var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%)));--text:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)))}:host([fixed]){left:0;position:fixed;right:0;top:0;z-index:var(--navbar-z-index,100)}#left,#right,#title,::slotted([slot=left]),::slotted([slot=right]),::slotted([slot=title]){align-items:center;display:flex;height:100%}#title,::slotted([slot=title]){font-weight:var(--nav-title-font-weight,var(--font-weight-regular,500));margin:var(--nav-title-margin,0 0 0 var(--spacing-l,1.25rem))}";
|
|
2
|
-
var stylesheet="*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--color:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)));--text:var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%)));align-items:center;background:var(--color);color:var(--text);flex-direction:row;justify-content:space-between}:host([inverted]){--color:var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%)));--text:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)))}:host([fixed]){left:0;position:fixed;right:0;top:0;z-index:var(--navbar-z-index,100)}#left,#right,#title,::slotted([slot=left]),::slotted([slot=right]),::slotted([slot=title]){align-items:center;display:flex;height:100%}#title,::slotted([slot=title]){font-weight:var(--nav-title-font-weight,var(--font-weight-regular,500));margin:var(--nav-title-margin,0 0 0 var(--spacing-l,1.25rem))}";
|
|
3
|
-
|
|
4
|
-
export { css_248z as default, stylesheet };
|
package/tinkiet/notie/index.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from "./notie";
|
package/tinkiet/notie/index.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { TkNotie } from './notie.js';
|
package/tinkiet/notie/notie.d.ts
DELETED
|
@@ -1,69 +0,0 @@
|
|
|
1
|
-
import { TemplateResult } from "lit";
|
|
2
|
-
import { TkBox } from "../box/index";
|
|
3
|
-
interface NotieOptions {
|
|
4
|
-
background?: string;
|
|
5
|
-
level?: NotieLevel;
|
|
6
|
-
color?: string;
|
|
7
|
-
text?: string;
|
|
8
|
-
delay?: number;
|
|
9
|
-
zIndex?: number;
|
|
10
|
-
template?: TemplateResult;
|
|
11
|
-
container?: HTMLElement;
|
|
12
|
-
position?: "bottom" | "top";
|
|
13
|
-
}
|
|
14
|
-
interface NotieForceOptions extends NotieOptions {
|
|
15
|
-
buttonText?: string;
|
|
16
|
-
}
|
|
17
|
-
interface NotieConfirmOptions extends NotieOptions {
|
|
18
|
-
confirmText?: string;
|
|
19
|
-
cancelText?: string;
|
|
20
|
-
}
|
|
21
|
-
interface NotieInputOptions extends NotieConfirmOptions {
|
|
22
|
-
password?: boolean;
|
|
23
|
-
}
|
|
24
|
-
declare enum NotieType {
|
|
25
|
-
show = "show",
|
|
26
|
-
force = "force",
|
|
27
|
-
confirm = "confirm",
|
|
28
|
-
input = "input"
|
|
29
|
-
}
|
|
30
|
-
declare enum NotieLevel {
|
|
31
|
-
success = "success",
|
|
32
|
-
warning = "warning",
|
|
33
|
-
error = "error",
|
|
34
|
-
info = "info",
|
|
35
|
-
neutral = "neutral"
|
|
36
|
-
}
|
|
37
|
-
declare class TkNotie extends TkBox {
|
|
38
|
-
static get styles(): import("lit").CSSResult[];
|
|
39
|
-
persistent: boolean;
|
|
40
|
-
open: boolean;
|
|
41
|
-
position: NotieOptions["position"];
|
|
42
|
-
type: NotieType;
|
|
43
|
-
level: NotieLevel;
|
|
44
|
-
delay: number;
|
|
45
|
-
animationDelay: number;
|
|
46
|
-
text: string;
|
|
47
|
-
buttonText: string;
|
|
48
|
-
confirmText: string;
|
|
49
|
-
cancelText: string;
|
|
50
|
-
template: TemplateResult;
|
|
51
|
-
private $input;
|
|
52
|
-
private $container;
|
|
53
|
-
private resolve;
|
|
54
|
-
render(): TemplateResult<1>;
|
|
55
|
-
show(): Promise<string | boolean>;
|
|
56
|
-
hide(value: boolean | string | null): void;
|
|
57
|
-
constructor(text?: string);
|
|
58
|
-
static show(options: NotieOptions): Promise<boolean | string | null>;
|
|
59
|
-
static force(options: NotieForceOptions): Promise<boolean | string | null>;
|
|
60
|
-
static confirm(options: NotieConfirmOptions): Promise<boolean | string | null>;
|
|
61
|
-
static input(options: NotieInputOptions): Promise<boolean | string | null>;
|
|
62
|
-
private static getNotie;
|
|
63
|
-
}
|
|
64
|
-
declare global {
|
|
65
|
-
interface HTMLElementTagNameMap {
|
|
66
|
-
"tk-notie": TkNotie;
|
|
67
|
-
}
|
|
68
|
-
}
|
|
69
|
-
export { TkNotie };
|