@threadlabs/looma 0.1.1 → 0.1.3
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/dist/{chunk-YK4MTZGJ.js → chunk-UDP2LUZ2.js} +26 -26
- package/dist/cjs/ui-button.cjs.entry.js +3 -4
- package/dist/collection/components/ui-button/ui-button.css +22 -12
- package/dist/collection/components/ui-button/ui-button.js +7 -7
- package/dist/components/ui-button.js +1 -1
- package/dist/esm/ui-button.entry.js +3 -4
- package/dist/index.cjs +3 -4
- package/dist/index.js +1 -1
- package/dist/looma/looma.esm.js +1 -1
- package/dist/looma/p-5717a4c4.entry.js +1 -0
- package/dist/types/components/ui-button/ui-button.d.ts +1 -1
- package/dist/types/components.d.ts +9 -3
- package/dist/{ui-avatar-group.entry-BZGXBOSE.js → ui-avatar-group.entry-VDMJ7TD3.js} +1 -1
- package/dist/{ui-avatar.entry-S2O2W5SA.js → ui-avatar.entry-OV25NM66.js} +1 -1
- package/dist/{ui-badge.entry-CVJDISCR.js → ui-badge.entry-MX66BWUJ.js} +1 -1
- package/dist/ui-button.entry-UCVR22M7.js +71 -0
- package/dist/{ui-checkbox.entry-5RA2CB43.js → ui-checkbox.entry-KL47EXSZ.js} +1 -1
- package/dist/{ui-context-menu.entry-UUOCT75F.js → ui-context-menu.entry-677NGG3Q.js} +1 -1
- package/dist/{ui-dialog.entry-OEPJTEES.js → ui-dialog.entry-WZIIRD4O.js} +1 -1
- package/dist/{ui-disclosure.entry-LRRISGUD.js → ui-disclosure.entry-Z7LSLWFL.js} +1 -1
- package/dist/{ui-floating-action-button.entry-7TSAZRXP.js → ui-floating-action-button.entry-ZDMXBJVC.js} +1 -1
- package/dist/{ui-form-field.entry-73YOVICF.js → ui-form-field.entry-DZSNUUXG.js} +1 -1
- package/dist/{ui-icon-button.entry-MNXGPG36.js → ui-icon-button.entry-QKEQNOKJ.js} +1 -1
- package/dist/{ui-input.entry-UWRVAOSW.js → ui-input.entry-BI74QOJP.js} +1 -1
- package/dist/{ui-menu-item.entry-5AOJO5MP.js → ui-menu-item.entry-GB462MWK.js} +1 -1
- package/dist/{ui-menu.entry-YDS6UMB5.js → ui-menu.entry-RUJ5XZ7Y.js} +1 -1
- package/dist/{ui-popover.entry-PGWDCQIX.js → ui-popover.entry-QW26NSSB.js} +1 -1
- package/dist/{ui-radio-group.entry-RHP5GNWU.js → ui-radio-group.entry-LC2BSS35.js} +1 -1
- package/dist/{ui-radio.entry-5WRWPSTK.js → ui-radio.entry-2RQD4K5L.js} +1 -1
- package/dist/{ui-search-result-row.entry-IKJB2SJJ.js → ui-search-result-row.entry-BAHYKCAZ.js} +1 -1
- package/dist/{ui-search-shell.entry-ZIWF4ZHH.js → ui-search-shell.entry-PW2AF6HX.js} +1 -1
- package/dist/{ui-select.entry-N5TIKHR7.js → ui-select.entry-NHWCGJQH.js} +1 -1
- package/dist/{ui-switch.entry-WUSZTXIR.js → ui-switch.entry-76KOUHCH.js} +1 -1
- package/dist/{ui-tabs.entry-UFAVAQIF.js → ui-tabs.entry-5PZGTNKM.js} +1 -1
- package/dist/{ui-textarea.entry-BYT47RAQ.js → ui-textarea.entry-IQHQHO3L.js} +1 -1
- package/dist/{ui-toast-region.entry-6UYR3ZU2.js → ui-toast-region.entry-2LT2RTPJ.js} +1 -1
- package/dist/{ui-tooltip.entry-YS7UX4FS.js → ui-tooltip.entry-42V5BSUT.js} +1 -1
- package/dist/{ui-top-bar.entry-V27H6NFO.js → ui-top-bar.entry-UZTSRNFZ.js} +1 -1
- package/editor/{chunk-NOOV344H.js → chunk-CWCXYQMT.js} +32 -4
- package/editor/index.js +1 -1
- package/editor/ui.js +1 -1
- package/editor.css +68 -24
- package/package.json +1 -1
- package/styles.css +18 -13
- package/theme-dark.css +6 -6
- package/theme-light.css +3 -3
- package/tokens.css +16 -16
- package/vue/{chunk-J4UBEIIL.js → chunk-P72L3GWE.js} +1 -0
- package/vue/editor/index.js +1 -1
- package/vue/index.js +1 -1
- package/dist/looma/p-fa4659c4.entry.js +0 -1
- package/dist/ui-button.entry-LNJBEJFE.js +0 -72
|
@@ -6,32 +6,32 @@ var __glob = (map) => (path) => {
|
|
|
6
6
|
|
|
7
7
|
// import("./**/*.entry.js") in dist/esm/index-CEeiinfk.js
|
|
8
8
|
var globImport_entry_js = __glob({
|
|
9
|
-
"./ui-avatar-group.entry.js": () => import("./ui-avatar-group.entry-
|
|
10
|
-
"./ui-avatar.entry.js": () => import("./ui-avatar.entry-
|
|
11
|
-
"./ui-badge.entry.js": () => import("./ui-badge.entry-
|
|
12
|
-
"./ui-button.entry.js": () => import("./ui-button.entry-
|
|
13
|
-
"./ui-checkbox.entry.js": () => import("./ui-checkbox.entry-
|
|
14
|
-
"./ui-context-menu.entry.js": () => import("./ui-context-menu.entry-
|
|
15
|
-
"./ui-dialog.entry.js": () => import("./ui-dialog.entry-
|
|
16
|
-
"./ui-disclosure.entry.js": () => import("./ui-disclosure.entry-
|
|
17
|
-
"./ui-floating-action-button.entry.js": () => import("./ui-floating-action-button.entry-
|
|
18
|
-
"./ui-form-field.entry.js": () => import("./ui-form-field.entry-
|
|
19
|
-
"./ui-icon-button.entry.js": () => import("./ui-icon-button.entry-
|
|
20
|
-
"./ui-input.entry.js": () => import("./ui-input.entry-
|
|
21
|
-
"./ui-menu-item.entry.js": () => import("./ui-menu-item.entry-
|
|
22
|
-
"./ui-menu.entry.js": () => import("./ui-menu.entry-
|
|
23
|
-
"./ui-popover.entry.js": () => import("./ui-popover.entry-
|
|
24
|
-
"./ui-radio-group.entry.js": () => import("./ui-radio-group.entry-
|
|
25
|
-
"./ui-radio.entry.js": () => import("./ui-radio.entry-
|
|
26
|
-
"./ui-search-result-row.entry.js": () => import("./ui-search-result-row.entry-
|
|
27
|
-
"./ui-search-shell.entry.js": () => import("./ui-search-shell.entry-
|
|
28
|
-
"./ui-select.entry.js": () => import("./ui-select.entry-
|
|
29
|
-
"./ui-switch.entry.js": () => import("./ui-switch.entry-
|
|
30
|
-
"./ui-tabs.entry.js": () => import("./ui-tabs.entry-
|
|
31
|
-
"./ui-textarea.entry.js": () => import("./ui-textarea.entry-
|
|
32
|
-
"./ui-toast-region.entry.js": () => import("./ui-toast-region.entry-
|
|
33
|
-
"./ui-tooltip.entry.js": () => import("./ui-tooltip.entry-
|
|
34
|
-
"./ui-top-bar.entry.js": () => import("./ui-top-bar.entry-
|
|
9
|
+
"./ui-avatar-group.entry.js": () => import("./ui-avatar-group.entry-VDMJ7TD3.js"),
|
|
10
|
+
"./ui-avatar.entry.js": () => import("./ui-avatar.entry-OV25NM66.js"),
|
|
11
|
+
"./ui-badge.entry.js": () => import("./ui-badge.entry-MX66BWUJ.js"),
|
|
12
|
+
"./ui-button.entry.js": () => import("./ui-button.entry-UCVR22M7.js"),
|
|
13
|
+
"./ui-checkbox.entry.js": () => import("./ui-checkbox.entry-KL47EXSZ.js"),
|
|
14
|
+
"./ui-context-menu.entry.js": () => import("./ui-context-menu.entry-677NGG3Q.js"),
|
|
15
|
+
"./ui-dialog.entry.js": () => import("./ui-dialog.entry-WZIIRD4O.js"),
|
|
16
|
+
"./ui-disclosure.entry.js": () => import("./ui-disclosure.entry-Z7LSLWFL.js"),
|
|
17
|
+
"./ui-floating-action-button.entry.js": () => import("./ui-floating-action-button.entry-ZDMXBJVC.js"),
|
|
18
|
+
"./ui-form-field.entry.js": () => import("./ui-form-field.entry-DZSNUUXG.js"),
|
|
19
|
+
"./ui-icon-button.entry.js": () => import("./ui-icon-button.entry-QKEQNOKJ.js"),
|
|
20
|
+
"./ui-input.entry.js": () => import("./ui-input.entry-BI74QOJP.js"),
|
|
21
|
+
"./ui-menu-item.entry.js": () => import("./ui-menu-item.entry-GB462MWK.js"),
|
|
22
|
+
"./ui-menu.entry.js": () => import("./ui-menu.entry-RUJ5XZ7Y.js"),
|
|
23
|
+
"./ui-popover.entry.js": () => import("./ui-popover.entry-QW26NSSB.js"),
|
|
24
|
+
"./ui-radio-group.entry.js": () => import("./ui-radio-group.entry-LC2BSS35.js"),
|
|
25
|
+
"./ui-radio.entry.js": () => import("./ui-radio.entry-2RQD4K5L.js"),
|
|
26
|
+
"./ui-search-result-row.entry.js": () => import("./ui-search-result-row.entry-BAHYKCAZ.js"),
|
|
27
|
+
"./ui-search-shell.entry.js": () => import("./ui-search-shell.entry-PW2AF6HX.js"),
|
|
28
|
+
"./ui-select.entry.js": () => import("./ui-select.entry-NHWCGJQH.js"),
|
|
29
|
+
"./ui-switch.entry.js": () => import("./ui-switch.entry-76KOUHCH.js"),
|
|
30
|
+
"./ui-tabs.entry.js": () => import("./ui-tabs.entry-5PZGTNKM.js"),
|
|
31
|
+
"./ui-textarea.entry.js": () => import("./ui-textarea.entry-IQHQHO3L.js"),
|
|
32
|
+
"./ui-toast-region.entry.js": () => import("./ui-toast-region.entry-2LT2RTPJ.js"),
|
|
33
|
+
"./ui-tooltip.entry.js": () => import("./ui-tooltip.entry-42V5BSUT.js"),
|
|
34
|
+
"./ui-top-bar.entry.js": () => import("./ui-top-bar.entry-UZTSRNFZ.js")
|
|
35
35
|
});
|
|
36
36
|
|
|
37
37
|
// dist/esm/index-CEeiinfk.js
|
|
@@ -3,14 +3,14 @@
|
|
|
3
3
|
var index = require('./index-D07f6BOw.js');
|
|
4
4
|
var events = require('./events-TcQIzpNv.js');
|
|
5
5
|
|
|
6
|
-
const uiButtonCss = () => `:host{display:inline-flex;vertical-align:middle;color:var(--ui-text-primary)}::slotted(button){appearance:none;border:1px solid var(--ui-border-default);border-radius:var(--ui-radius-2);background:var(--ui-surface-default);color:inherit;font:inherit;font-weight:var(--ui-font-medium, 500);line-height:var(--ui-line-height-tight);padding:var(--ui-space-2) var(--ui-space-3);cursor:pointer;transition:background-color var(--ui-motion-fast) var(--ui-motion-ease), border-color var(--ui-motion-fast) var(--ui-motion-ease), color var(--ui-motion-fast) var(--ui-motion-ease), box-shadow var(--ui-motion-fast) var(--ui-motion-ease);margin:0}:host([data-size='sm'])::slotted(button){padding:var(--ui-space-1) var(--ui-space-2);font-size:0.875rem}:host([data-size='lg'])::slotted(button){padding:var(--ui-space-3) var(--ui-space-4);font-size:1rem}::slotted(button:hover:enabled){background:var(--ui-surface-muted);border-color:var(--ui-border-strong)}::slotted(button:active:enabled){background:var(--ui-surface-subtle)}:host([
|
|
6
|
+
const uiButtonCss = () => `:host{display:inline-flex;vertical-align:middle;color:var(--ui-text-primary)}:host([variant='outline'])::slotted(button),::slotted(button){appearance:none;border:1px solid var(--ui-border-default);border-radius:var(--ui-button-radius, var(--ui-radius-2));background:var(--ui-surface-default);color:inherit;font:inherit;font-weight:var(--ui-font-medium, 500);line-height:var(--ui-line-height-tight);padding:var(--ui-space-2) var(--ui-space-3);cursor:pointer;transition:background-color var(--ui-motion-fast) var(--ui-motion-ease), border-color var(--ui-motion-fast) var(--ui-motion-ease), color var(--ui-motion-fast) var(--ui-motion-ease), box-shadow var(--ui-motion-fast) var(--ui-motion-ease), transform var(--ui-motion-fast) var(--ui-motion-ease);margin:0}:host([data-size='sm'])::slotted(button){padding:var(--ui-space-1) var(--ui-space-2);font-size:0.875rem}:host([data-size='lg'])::slotted(button){padding:var(--ui-space-3) var(--ui-space-4);font-size:1rem}::slotted(button:hover:enabled){background:var(--ui-surface-muted);border-color:var(--ui-border-strong)}::slotted(button:active:enabled){background:var(--ui-surface-subtle)}:host([variant='solid'])::slotted(button){border-color:var(--ui-accent-solid);background:var(--ui-accent-solid);color:var(--ui-text-on-accent);box-shadow:var(--ui-button-solid-shadow, inset 0 1px rgb(255 255 255 / 0.16), var(--ui-shadow-xs))}:host([variant='solid'])::slotted(button:hover:enabled){background:var(--ui-accent-hover);border-color:var(--ui-accent-hover);box-shadow:var(--ui-shadow-sm);transform:translateY(-1px)}:host([variant='solid'])::slotted(button:active:enabled){background:var(--ui-accent-active);border-color:var(--ui-accent-active);box-shadow:none;transform:translateY(0)}:host([variant='destructive'])::slotted(button){border-color:var(--ui-danger-solid);background:var(--ui-danger-solid);color:var(--ui-text-on-accent);box-shadow:var(--ui-button-destructive-shadow, inset 0 1px rgb(255 255 255 / 0.14), var(--ui-shadow-xs))}:host([variant='destructive'])::slotted(button:hover:enabled){background:var(--ui-danger-hover);border-color:var(--ui-danger-hover);box-shadow:var(--ui-shadow-sm);transform:translateY(-1px)}:host([variant='destructive'])::slotted(button:active:enabled){box-shadow:none;transform:translateY(0)}:host([variant='ghost'])::slotted(button){border-color:transparent;background:transparent}:host([variant='ghost'])::slotted(button:hover:enabled){background:var(--ui-surface-muted);border-color:transparent}:host([variant='ghost'])::slotted(button:active:enabled){background:var(--ui-surface-subtle);border-color:transparent}::slotted(button:focus-visible){outline:2px solid var(--ui-focus-ring);outline-offset:2px}::slotted(button:disabled),:host([data-disabled]){opacity:0.6;cursor:not-allowed}`;
|
|
7
7
|
|
|
8
8
|
const UIButton = class {
|
|
9
9
|
constructor(hostRef) {
|
|
10
10
|
index.registerInstance(this, hostRef);
|
|
11
11
|
}
|
|
12
12
|
get host() { return index.getElement(this); }
|
|
13
|
-
variant;
|
|
13
|
+
variant = 'outline';
|
|
14
14
|
size;
|
|
15
15
|
disabled = false;
|
|
16
16
|
slotRef;
|
|
@@ -18,7 +18,6 @@ const UIButton = class {
|
|
|
18
18
|
const btn = this.getButton();
|
|
19
19
|
if (!btn)
|
|
20
20
|
return;
|
|
21
|
-
this.host.dataset.variant = this.variant || '';
|
|
22
21
|
this.host.dataset.size = this.size || '';
|
|
23
22
|
this.host.dataset.disabled = this.disabled ? 'true' : '';
|
|
24
23
|
btn.disabled = this.disabled;
|
|
@@ -43,7 +42,7 @@ const UIButton = class {
|
|
|
43
42
|
this.host.click();
|
|
44
43
|
};
|
|
45
44
|
render() {
|
|
46
|
-
return (index.h(index.Host, { key: '
|
|
45
|
+
return (index.h(index.Host, { key: '7840303538ca2e4724ea634809fd6c2ad451f9d1', "data-size": this.size || undefined, "data-disabled": this.disabled ? '' : undefined, onKeyDown: this.onKeydown }, index.h("slot", { key: '731348c7cbb5c5f196dbd565058e0f410836ace2', ref: (el) => (this.slotRef = el) })));
|
|
47
46
|
}
|
|
48
47
|
static get watchers() { return {
|
|
49
48
|
"variant": [{
|
|
@@ -4,10 +4,11 @@
|
|
|
4
4
|
color: var(--ui-text-primary);
|
|
5
5
|
}
|
|
6
6
|
|
|
7
|
+
:host([variant='outline'])::slotted(button),
|
|
7
8
|
::slotted(button) {
|
|
8
9
|
appearance: none;
|
|
9
10
|
border: 1px solid var(--ui-border-default);
|
|
10
|
-
border-radius: var(--ui-radius-2);
|
|
11
|
+
border-radius: var(--ui-button-radius, var(--ui-radius-2));
|
|
11
12
|
background: var(--ui-surface-default);
|
|
12
13
|
color: inherit;
|
|
13
14
|
font: inherit;
|
|
@@ -19,7 +20,8 @@
|
|
|
19
20
|
background-color var(--ui-motion-fast) var(--ui-motion-ease),
|
|
20
21
|
border-color var(--ui-motion-fast) var(--ui-motion-ease),
|
|
21
22
|
color var(--ui-motion-fast) var(--ui-motion-ease),
|
|
22
|
-
box-shadow var(--ui-motion-fast) var(--ui-motion-ease)
|
|
23
|
+
box-shadow var(--ui-motion-fast) var(--ui-motion-ease),
|
|
24
|
+
transform var(--ui-motion-fast) var(--ui-motion-ease);
|
|
23
25
|
margin: 0;
|
|
24
26
|
}
|
|
25
27
|
|
|
@@ -42,49 +44,57 @@
|
|
|
42
44
|
background: var(--ui-surface-subtle);
|
|
43
45
|
}
|
|
44
46
|
|
|
45
|
-
:host([
|
|
47
|
+
:host([variant='solid'])::slotted(button) {
|
|
46
48
|
border-color: var(--ui-accent-solid);
|
|
47
49
|
background: var(--ui-accent-solid);
|
|
48
50
|
color: var(--ui-text-on-accent);
|
|
49
|
-
box-shadow: var(--ui-shadow-xs);
|
|
51
|
+
box-shadow: var(--ui-button-solid-shadow, inset 0 1px rgb(255 255 255 / 0.16), var(--ui-shadow-xs));
|
|
50
52
|
}
|
|
51
53
|
|
|
52
|
-
:host([
|
|
54
|
+
:host([variant='solid'])::slotted(button:hover:enabled) {
|
|
53
55
|
background: var(--ui-accent-hover);
|
|
54
56
|
border-color: var(--ui-accent-hover);
|
|
55
57
|
box-shadow: var(--ui-shadow-sm);
|
|
58
|
+
transform: translateY(-1px);
|
|
56
59
|
}
|
|
57
60
|
|
|
58
|
-
:host([
|
|
61
|
+
:host([variant='solid'])::slotted(button:active:enabled) {
|
|
59
62
|
background: var(--ui-accent-active);
|
|
60
63
|
border-color: var(--ui-accent-active);
|
|
61
64
|
box-shadow: none;
|
|
65
|
+
transform: translateY(0);
|
|
62
66
|
}
|
|
63
67
|
|
|
64
|
-
:host([
|
|
68
|
+
:host([variant='destructive'])::slotted(button) {
|
|
65
69
|
border-color: var(--ui-danger-solid);
|
|
66
70
|
background: var(--ui-danger-solid);
|
|
67
71
|
color: var(--ui-text-on-accent);
|
|
68
|
-
box-shadow: var(--ui-shadow-xs);
|
|
72
|
+
box-shadow: var(--ui-button-destructive-shadow, inset 0 1px rgb(255 255 255 / 0.14), var(--ui-shadow-xs));
|
|
69
73
|
}
|
|
70
74
|
|
|
71
|
-
:host([
|
|
75
|
+
:host([variant='destructive'])::slotted(button:hover:enabled) {
|
|
72
76
|
background: var(--ui-danger-hover);
|
|
73
77
|
border-color: var(--ui-danger-hover);
|
|
74
78
|
box-shadow: var(--ui-shadow-sm);
|
|
79
|
+
transform: translateY(-1px);
|
|
75
80
|
}
|
|
76
81
|
|
|
77
|
-
:host([
|
|
82
|
+
:host([variant='destructive'])::slotted(button:active:enabled) {
|
|
83
|
+
box-shadow: none;
|
|
84
|
+
transform: translateY(0);
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
:host([variant='ghost'])::slotted(button) {
|
|
78
88
|
border-color: transparent;
|
|
79
89
|
background: transparent;
|
|
80
90
|
}
|
|
81
91
|
|
|
82
|
-
:host([
|
|
92
|
+
:host([variant='ghost'])::slotted(button:hover:enabled) {
|
|
83
93
|
background: var(--ui-surface-muted);
|
|
84
94
|
border-color: transparent;
|
|
85
95
|
}
|
|
86
96
|
|
|
87
|
-
:host([
|
|
97
|
+
:host([variant='ghost'])::slotted(button:active:enabled) {
|
|
88
98
|
background: var(--ui-surface-subtle);
|
|
89
99
|
border-color: transparent;
|
|
90
100
|
}
|
|
@@ -2,7 +2,7 @@ import { Host, h } from "@stencil/core";
|
|
|
2
2
|
import { isActivationKey } from "../../utils/events";
|
|
3
3
|
export class UIButton {
|
|
4
4
|
host;
|
|
5
|
-
variant;
|
|
5
|
+
variant = 'outline';
|
|
6
6
|
size;
|
|
7
7
|
disabled = false;
|
|
8
8
|
slotRef;
|
|
@@ -10,7 +10,6 @@ export class UIButton {
|
|
|
10
10
|
const btn = this.getButton();
|
|
11
11
|
if (!btn)
|
|
12
12
|
return;
|
|
13
|
-
this.host.dataset.variant = this.variant || '';
|
|
14
13
|
this.host.dataset.size = this.size || '';
|
|
15
14
|
this.host.dataset.disabled = this.disabled ? 'true' : '';
|
|
16
15
|
btn.disabled = this.disabled;
|
|
@@ -35,7 +34,7 @@ export class UIButton {
|
|
|
35
34
|
this.host.click();
|
|
36
35
|
};
|
|
37
36
|
render() {
|
|
38
|
-
return (h(Host, { key: '
|
|
37
|
+
return (h(Host, { key: '7840303538ca2e4724ea634809fd6c2ad451f9d1', "data-size": this.size || undefined, "data-disabled": this.disabled ? '' : undefined, onKeyDown: this.onKeydown }, h("slot", { key: '731348c7cbb5c5f196dbd565058e0f410836ace2', ref: (el) => (this.slotRef = el) })));
|
|
39
38
|
}
|
|
40
39
|
static get is() { return "ui-button"; }
|
|
41
40
|
static get encapsulation() { return "shadow"; }
|
|
@@ -55,12 +54,12 @@ export class UIButton {
|
|
|
55
54
|
"type": "string",
|
|
56
55
|
"mutable": false,
|
|
57
56
|
"complexType": {
|
|
58
|
-
"original": "
|
|
59
|
-
"resolved": "
|
|
57
|
+
"original": "'outline' | 'solid' | 'destructive' | 'ghost'",
|
|
58
|
+
"resolved": "\"destructive\" | \"ghost\" | \"outline\" | \"solid\"",
|
|
60
59
|
"references": {}
|
|
61
60
|
},
|
|
62
61
|
"required": false,
|
|
63
|
-
"optional":
|
|
62
|
+
"optional": false,
|
|
64
63
|
"docs": {
|
|
65
64
|
"tags": [],
|
|
66
65
|
"text": ""
|
|
@@ -68,7 +67,8 @@ export class UIButton {
|
|
|
68
67
|
"getter": false,
|
|
69
68
|
"setter": false,
|
|
70
69
|
"reflect": false,
|
|
71
|
-
"attribute": "variant"
|
|
70
|
+
"attribute": "variant",
|
|
71
|
+
"defaultValue": "'outline'"
|
|
72
72
|
},
|
|
73
73
|
"size": {
|
|
74
74
|
"type": "string",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as t,H as o,h as a,c as
|
|
1
|
+
import{p as t,H as o,h as a,c as r,t as e}from"./p-CIA4RyEp.js";import{i as s}from"./p-JwSoedEO.js";const i=t(class extends o{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}get host(){return this}variant="outline";size;disabled=!1;slotRef;syncToButton(){const t=this.getButton();t&&(this.host.dataset.size=this.size||"",this.host.dataset.disabled=this.disabled?"true":"",t.disabled=this.disabled)}componentDidLoad(){this.slotRef?.addEventListener("slotchange",(()=>this.syncToButton())),this.syncToButton()}componentDidUpdate(){this.syncToButton()}getButton(){const t=this.host.shadowRoot?.querySelector("slot");return(t?.assignedElements()??Array.from(this.host.children)).find((t=>"BUTTON"===t.tagName))??null}onKeydown=t=>{this.getButton()||this.disabled||!s(t)||(t.preventDefault(),this.host.click())};render(){return a(r,{key:"7840303538ca2e4724ea634809fd6c2ad451f9d1","data-size":this.size||void 0,"data-disabled":this.disabled?"":void 0,onKeyDown:this.onKeydown},a("slot",{key:"731348c7cbb5c5f196dbd565058e0f410836ace2",ref:t=>this.slotRef=t}))}static get watchers(){return{variant:[{syncToButton:0}],size:[{syncToButton:0}],disabled:[{syncToButton:0}]}}static get style(){return":host{display:inline-flex;vertical-align:middle;color:var(--ui-text-primary)}:host([variant='outline'])::slotted(button),::slotted(button){appearance:none;border:1px solid var(--ui-border-default);border-radius:var(--ui-button-radius, var(--ui-radius-2));background:var(--ui-surface-default);color:inherit;font:inherit;font-weight:var(--ui-font-medium, 500);line-height:var(--ui-line-height-tight);padding:var(--ui-space-2) var(--ui-space-3);cursor:pointer;transition:background-color var(--ui-motion-fast) var(--ui-motion-ease), border-color var(--ui-motion-fast) var(--ui-motion-ease), color var(--ui-motion-fast) var(--ui-motion-ease), box-shadow var(--ui-motion-fast) var(--ui-motion-ease), transform var(--ui-motion-fast) var(--ui-motion-ease);margin:0}:host([data-size='sm'])::slotted(button){padding:var(--ui-space-1) var(--ui-space-2);font-size:0.875rem}:host([data-size='lg'])::slotted(button){padding:var(--ui-space-3) var(--ui-space-4);font-size:1rem}::slotted(button:hover:enabled){background:var(--ui-surface-muted);border-color:var(--ui-border-strong)}::slotted(button:active:enabled){background:var(--ui-surface-subtle)}:host([variant='solid'])::slotted(button){border-color:var(--ui-accent-solid);background:var(--ui-accent-solid);color:var(--ui-text-on-accent);box-shadow:var(--ui-button-solid-shadow, inset 0 1px rgb(255 255 255 / 0.16), var(--ui-shadow-xs))}:host([variant='solid'])::slotted(button:hover:enabled){background:var(--ui-accent-hover);border-color:var(--ui-accent-hover);box-shadow:var(--ui-shadow-sm);transform:translateY(-1px)}:host([variant='solid'])::slotted(button:active:enabled){background:var(--ui-accent-active);border-color:var(--ui-accent-active);box-shadow:none;transform:translateY(0)}:host([variant='destructive'])::slotted(button){border-color:var(--ui-danger-solid);background:var(--ui-danger-solid);color:var(--ui-text-on-accent);box-shadow:var(--ui-button-destructive-shadow, inset 0 1px rgb(255 255 255 / 0.14), var(--ui-shadow-xs))}:host([variant='destructive'])::slotted(button:hover:enabled){background:var(--ui-danger-hover);border-color:var(--ui-danger-hover);box-shadow:var(--ui-shadow-sm);transform:translateY(-1px)}:host([variant='destructive'])::slotted(button:active:enabled){box-shadow:none;transform:translateY(0)}:host([variant='ghost'])::slotted(button){border-color:transparent;background:transparent}:host([variant='ghost'])::slotted(button:hover:enabled){background:var(--ui-surface-muted);border-color:transparent}:host([variant='ghost'])::slotted(button:active:enabled){background:var(--ui-surface-subtle);border-color:transparent}::slotted(button:focus-visible){outline:2px solid var(--ui-focus-ring);outline-offset:2px}::slotted(button:disabled),:host([data-disabled]){opacity:0.6;cursor:not-allowed}"}},[769,"ui-button",{variant:[1],size:[1],disabled:[4]},void 0,{variant:[{syncToButton:0}],size:[{syncToButton:0}],disabled:[{syncToButton:0}]}]),n=i,d=function(){"undefined"!=typeof customElements&&["ui-button"].forEach((t=>{"ui-button"===t&&(customElements.get(e(t))||customElements.define(e(t),i))}))};export{n as UiButton,d as defineCustomElement}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import { r as registerInstance, g as getElement, h, H as Host } from './index-CEeiinfk.js';
|
|
2
2
|
import { i as isActivationKey } from './events-JwSoedEO.js';
|
|
3
3
|
|
|
4
|
-
const uiButtonCss = () => `:host{display:inline-flex;vertical-align:middle;color:var(--ui-text-primary)}::slotted(button){appearance:none;border:1px solid var(--ui-border-default);border-radius:var(--ui-radius-2);background:var(--ui-surface-default);color:inherit;font:inherit;font-weight:var(--ui-font-medium, 500);line-height:var(--ui-line-height-tight);padding:var(--ui-space-2) var(--ui-space-3);cursor:pointer;transition:background-color var(--ui-motion-fast) var(--ui-motion-ease), border-color var(--ui-motion-fast) var(--ui-motion-ease), color var(--ui-motion-fast) var(--ui-motion-ease), box-shadow var(--ui-motion-fast) var(--ui-motion-ease);margin:0}:host([data-size='sm'])::slotted(button){padding:var(--ui-space-1) var(--ui-space-2);font-size:0.875rem}:host([data-size='lg'])::slotted(button){padding:var(--ui-space-3) var(--ui-space-4);font-size:1rem}::slotted(button:hover:enabled){background:var(--ui-surface-muted);border-color:var(--ui-border-strong)}::slotted(button:active:enabled){background:var(--ui-surface-subtle)}:host([
|
|
4
|
+
const uiButtonCss = () => `:host{display:inline-flex;vertical-align:middle;color:var(--ui-text-primary)}:host([variant='outline'])::slotted(button),::slotted(button){appearance:none;border:1px solid var(--ui-border-default);border-radius:var(--ui-button-radius, var(--ui-radius-2));background:var(--ui-surface-default);color:inherit;font:inherit;font-weight:var(--ui-font-medium, 500);line-height:var(--ui-line-height-tight);padding:var(--ui-space-2) var(--ui-space-3);cursor:pointer;transition:background-color var(--ui-motion-fast) var(--ui-motion-ease), border-color var(--ui-motion-fast) var(--ui-motion-ease), color var(--ui-motion-fast) var(--ui-motion-ease), box-shadow var(--ui-motion-fast) var(--ui-motion-ease), transform var(--ui-motion-fast) var(--ui-motion-ease);margin:0}:host([data-size='sm'])::slotted(button){padding:var(--ui-space-1) var(--ui-space-2);font-size:0.875rem}:host([data-size='lg'])::slotted(button){padding:var(--ui-space-3) var(--ui-space-4);font-size:1rem}::slotted(button:hover:enabled){background:var(--ui-surface-muted);border-color:var(--ui-border-strong)}::slotted(button:active:enabled){background:var(--ui-surface-subtle)}:host([variant='solid'])::slotted(button){border-color:var(--ui-accent-solid);background:var(--ui-accent-solid);color:var(--ui-text-on-accent);box-shadow:var(--ui-button-solid-shadow, inset 0 1px rgb(255 255 255 / 0.16), var(--ui-shadow-xs))}:host([variant='solid'])::slotted(button:hover:enabled){background:var(--ui-accent-hover);border-color:var(--ui-accent-hover);box-shadow:var(--ui-shadow-sm);transform:translateY(-1px)}:host([variant='solid'])::slotted(button:active:enabled){background:var(--ui-accent-active);border-color:var(--ui-accent-active);box-shadow:none;transform:translateY(0)}:host([variant='destructive'])::slotted(button){border-color:var(--ui-danger-solid);background:var(--ui-danger-solid);color:var(--ui-text-on-accent);box-shadow:var(--ui-button-destructive-shadow, inset 0 1px rgb(255 255 255 / 0.14), var(--ui-shadow-xs))}:host([variant='destructive'])::slotted(button:hover:enabled){background:var(--ui-danger-hover);border-color:var(--ui-danger-hover);box-shadow:var(--ui-shadow-sm);transform:translateY(-1px)}:host([variant='destructive'])::slotted(button:active:enabled){box-shadow:none;transform:translateY(0)}:host([variant='ghost'])::slotted(button){border-color:transparent;background:transparent}:host([variant='ghost'])::slotted(button:hover:enabled){background:var(--ui-surface-muted);border-color:transparent}:host([variant='ghost'])::slotted(button:active:enabled){background:var(--ui-surface-subtle);border-color:transparent}::slotted(button:focus-visible){outline:2px solid var(--ui-focus-ring);outline-offset:2px}::slotted(button:disabled),:host([data-disabled]){opacity:0.6;cursor:not-allowed}`;
|
|
5
5
|
|
|
6
6
|
const UIButton = class {
|
|
7
7
|
constructor(hostRef) {
|
|
8
8
|
registerInstance(this, hostRef);
|
|
9
9
|
}
|
|
10
10
|
get host() { return getElement(this); }
|
|
11
|
-
variant;
|
|
11
|
+
variant = 'outline';
|
|
12
12
|
size;
|
|
13
13
|
disabled = false;
|
|
14
14
|
slotRef;
|
|
@@ -16,7 +16,6 @@ const UIButton = class {
|
|
|
16
16
|
const btn = this.getButton();
|
|
17
17
|
if (!btn)
|
|
18
18
|
return;
|
|
19
|
-
this.host.dataset.variant = this.variant || '';
|
|
20
19
|
this.host.dataset.size = this.size || '';
|
|
21
20
|
this.host.dataset.disabled = this.disabled ? 'true' : '';
|
|
22
21
|
btn.disabled = this.disabled;
|
|
@@ -41,7 +40,7 @@ const UIButton = class {
|
|
|
41
40
|
this.host.click();
|
|
42
41
|
};
|
|
43
42
|
render() {
|
|
44
|
-
return (h(Host, { key: '
|
|
43
|
+
return (h(Host, { key: '7840303538ca2e4724ea634809fd6c2ad451f9d1', "data-size": this.size || undefined, "data-disabled": this.disabled ? '' : undefined, onKeyDown: this.onKeydown }, h("slot", { key: '731348c7cbb5c5f196dbd565058e0f410836ace2', ref: (el) => (this.slotRef = el) })));
|
|
45
44
|
}
|
|
46
45
|
static get watchers() { return {
|
|
47
46
|
"variant": [{
|
package/dist/index.cjs
CHANGED
|
@@ -190,7 +190,7 @@ var init_ui_button_entry = __esm({
|
|
|
190
190
|
"dist/esm/ui-button.entry.js"() {
|
|
191
191
|
init_index_CEeiinfk();
|
|
192
192
|
init_events_JwSoedEO();
|
|
193
|
-
uiButtonCss = () => `:host{display:inline-flex;vertical-align:middle;color:var(--ui-text-primary)}::slotted(button){appearance:none;border:1px solid var(--ui-border-default);border-radius:var(--ui-radius-2);background:var(--ui-surface-default);color:inherit;font:inherit;font-weight:var(--ui-font-medium, 500);line-height:var(--ui-line-height-tight);padding:var(--ui-space-2) var(--ui-space-3);cursor:pointer;transition:background-color var(--ui-motion-fast) var(--ui-motion-ease), border-color var(--ui-motion-fast) var(--ui-motion-ease), color var(--ui-motion-fast) var(--ui-motion-ease), box-shadow var(--ui-motion-fast) var(--ui-motion-ease);margin:0}:host([data-size='sm'])::slotted(button){padding:var(--ui-space-1) var(--ui-space-2);font-size:0.875rem}:host([data-size='lg'])::slotted(button){padding:var(--ui-space-3) var(--ui-space-4);font-size:1rem}::slotted(button:hover:enabled){background:var(--ui-surface-muted);border-color:var(--ui-border-strong)}::slotted(button:active:enabled){background:var(--ui-surface-subtle)}:host([
|
|
193
|
+
uiButtonCss = () => `:host{display:inline-flex;vertical-align:middle;color:var(--ui-text-primary)}:host([variant='outline'])::slotted(button),::slotted(button){appearance:none;border:1px solid var(--ui-border-default);border-radius:var(--ui-button-radius, var(--ui-radius-2));background:var(--ui-surface-default);color:inherit;font:inherit;font-weight:var(--ui-font-medium, 500);line-height:var(--ui-line-height-tight);padding:var(--ui-space-2) var(--ui-space-3);cursor:pointer;transition:background-color var(--ui-motion-fast) var(--ui-motion-ease), border-color var(--ui-motion-fast) var(--ui-motion-ease), color var(--ui-motion-fast) var(--ui-motion-ease), box-shadow var(--ui-motion-fast) var(--ui-motion-ease), transform var(--ui-motion-fast) var(--ui-motion-ease);margin:0}:host([data-size='sm'])::slotted(button){padding:var(--ui-space-1) var(--ui-space-2);font-size:0.875rem}:host([data-size='lg'])::slotted(button){padding:var(--ui-space-3) var(--ui-space-4);font-size:1rem}::slotted(button:hover:enabled){background:var(--ui-surface-muted);border-color:var(--ui-border-strong)}::slotted(button:active:enabled){background:var(--ui-surface-subtle)}:host([variant='solid'])::slotted(button){border-color:var(--ui-accent-solid);background:var(--ui-accent-solid);color:var(--ui-text-on-accent);box-shadow:var(--ui-button-solid-shadow, inset 0 1px rgb(255 255 255 / 0.16), var(--ui-shadow-xs))}:host([variant='solid'])::slotted(button:hover:enabled){background:var(--ui-accent-hover);border-color:var(--ui-accent-hover);box-shadow:var(--ui-shadow-sm);transform:translateY(-1px)}:host([variant='solid'])::slotted(button:active:enabled){background:var(--ui-accent-active);border-color:var(--ui-accent-active);box-shadow:none;transform:translateY(0)}:host([variant='destructive'])::slotted(button){border-color:var(--ui-danger-solid);background:var(--ui-danger-solid);color:var(--ui-text-on-accent);box-shadow:var(--ui-button-destructive-shadow, inset 0 1px rgb(255 255 255 / 0.14), var(--ui-shadow-xs))}:host([variant='destructive'])::slotted(button:hover:enabled){background:var(--ui-danger-hover);border-color:var(--ui-danger-hover);box-shadow:var(--ui-shadow-sm);transform:translateY(-1px)}:host([variant='destructive'])::slotted(button:active:enabled){box-shadow:none;transform:translateY(0)}:host([variant='ghost'])::slotted(button){border-color:transparent;background:transparent}:host([variant='ghost'])::slotted(button:hover:enabled){background:var(--ui-surface-muted);border-color:transparent}:host([variant='ghost'])::slotted(button:active:enabled){background:var(--ui-surface-subtle);border-color:transparent}::slotted(button:focus-visible){outline:2px solid var(--ui-focus-ring);outline-offset:2px}::slotted(button:disabled),:host([data-disabled]){opacity:0.6;cursor:not-allowed}`;
|
|
194
194
|
UIButton = class {
|
|
195
195
|
constructor(hostRef) {
|
|
196
196
|
registerInstance(this, hostRef);
|
|
@@ -198,7 +198,7 @@ var init_ui_button_entry = __esm({
|
|
|
198
198
|
get host() {
|
|
199
199
|
return getElement(this);
|
|
200
200
|
}
|
|
201
|
-
variant;
|
|
201
|
+
variant = "outline";
|
|
202
202
|
size;
|
|
203
203
|
disabled = false;
|
|
204
204
|
slotRef;
|
|
@@ -206,7 +206,6 @@ var init_ui_button_entry = __esm({
|
|
|
206
206
|
const btn = this.getButton();
|
|
207
207
|
if (!btn)
|
|
208
208
|
return;
|
|
209
|
-
this.host.dataset.variant = this.variant || "";
|
|
210
209
|
this.host.dataset.size = this.size || "";
|
|
211
210
|
this.host.dataset.disabled = this.disabled ? "true" : "";
|
|
212
211
|
btn.disabled = this.disabled;
|
|
@@ -231,7 +230,7 @@ var init_ui_button_entry = __esm({
|
|
|
231
230
|
this.host.click();
|
|
232
231
|
};
|
|
233
232
|
render() {
|
|
234
|
-
return h(Host, { key: "
|
|
233
|
+
return h(Host, { key: "7840303538ca2e4724ea634809fd6c2ad451f9d1", "data-size": this.size || void 0, "data-disabled": this.disabled ? "" : void 0, onKeyDown: this.onKeydown }, h("slot", { key: "731348c7cbb5c5f196dbd565058e0f410836ace2", ref: (el) => this.slotRef = el }));
|
|
235
234
|
}
|
|
236
235
|
static get watchers() {
|
|
237
236
|
return {
|
package/dist/index.js
CHANGED
package/dist/looma/looma.esm.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as e,b as n}from"./p-CEeiinfk.js";export{s as setNonce}from"./p-CEeiinfk.js";import{g as a}from"./p-DQuL1Twl.js";(()=>{const n=import.meta.url,a={};return""!==n&&(a.resourcesUrl=new URL(".",n).href),e(a)})().then((async e=>(await a(),n([["p-41d62a83",[[769,"ui-context-menu",{open:[4],defaultOpen:[4,"default-open"],for:[1],internalOpen:[32]},null,{open:[{syncFromProp:0}],for:[{syncTarget:0}],internalOpen:[{syncOverlay:0}]}]]],["p-201243dc",[[513,"ui-avatar",{src:[1],alt:[1],name:[1],fallback:[1],hasImage:[32]},null,{src:[{watchSrc:0}]}]]],["p-15e619fd",[[769,"ui-avatar-group",{max:[2],label:[1],overflowCount:[32]},null,{max:[{syncOverflow:0}]}]]],["p-c14233bc",[[769,"ui-badge",{variant:[1],tone:[1]}]]],["p-
|
|
1
|
+
import{p as e,b as n}from"./p-CEeiinfk.js";export{s as setNonce}from"./p-CEeiinfk.js";import{g as a}from"./p-DQuL1Twl.js";(()=>{const n=import.meta.url,a={};return""!==n&&(a.resourcesUrl=new URL(".",n).href),e(a)})().then((async e=>(await a(),n([["p-41d62a83",[[769,"ui-context-menu",{open:[4],defaultOpen:[4,"default-open"],for:[1],internalOpen:[32]},null,{open:[{syncFromProp:0}],for:[{syncTarget:0}],internalOpen:[{syncOverlay:0}]}]]],["p-201243dc",[[513,"ui-avatar",{src:[1],alt:[1],name:[1],fallback:[1],hasImage:[32]},null,{src:[{watchSrc:0}]}]]],["p-15e619fd",[[769,"ui-avatar-group",{max:[2],label:[1],overflowCount:[32]},null,{max:[{syncOverflow:0}]}]]],["p-c14233bc",[[769,"ui-badge",{variant:[1],tone:[1]}]]],["p-5717a4c4",[[769,"ui-button",{variant:[1],size:[1],disabled:[4]},null,{variant:[{syncToButton:0}],size:[{syncToButton:0}],disabled:[{syncToButton:0}]}]]],["p-dc857ed4",[[769,"ui-checkbox",{checked:[4],defaultChecked:[4,"default-checked"],disabled:[4],indeterminate:[4],required:[4],value:[1],internalChecked:[32]},null,{checked:[{syncFromProp:0}],internalChecked:[{syncToInput:0}],indeterminate:[{syncToInput:0}],disabled:[{syncToInput:0}],required:[{syncToInput:0}]}]]],["p-ecb5739b",[[769,"ui-dialog",{open:[4],defaultOpen:[4,"default-open"],modal:[4],dismissible:[4],internalOpen:[32]},null,{open:[{syncFromProp:0}],internalOpen:[{syncOpen:0}]}]]],["p-dfcb2cca",[[769,"ui-disclosure",{open:[4],defaultOpen:[4,"default-open"],disabled:[4],internalOpen:[32],contentId:[32]},null,{open:[{syncFromProp:0}],internalOpen:[{syncState:0}]}]]],["p-dff144bd",[[769,"ui-floating-action-button",{disabled:[516],mobileOnly:[516,"mobile-only"],label:[1]}]]],["p-955fb814",[[769,"ui-form-field",{invalid:[4],disabled:[4],required:[4]}]]],["p-754cfff3",[[769,"ui-icon-button",{disabled:[516],label:[1],size:[513],variant:[513]}]]],["p-96de71ad",[[769,"ui-input",{value:[1],defaultValue:[1,"default-value"],disabled:[4],invalid:[4],readOnly:[4,"readonly"],internalValue:[32]},null,{value:[{syncFromProp:0}],internalValue:[{syncToInput:0}],defaultValue:[{syncToInput:0}],disabled:[{syncToInput:0}],invalid:[{syncToInput:0}],readOnly:[{syncToInput:0}]}]]],["p-24d7aa5b",[[769,"ui-menu-item",{disabled:[516],value:[1]}]]],["p-649dad92",[[769,"ui-popover",{open:[4],defaultOpen:[4,"default-open"],internalOpen:[32]},null,{open:[{syncFromProp:0}],internalOpen:[{onOpenChange:0}]}]]],["p-4c54d489",[[769,"ui-radio",{checked:[4],defaultChecked:[4,"default-checked"],disabled:[4],name:[1],required:[4],value:[1]},null,{checked:[{syncToInput:0}],disabled:[{syncToInput:0}],name:[{syncToInput:0}],required:[{syncToInput:0}],value:[{syncToInput:0}]}]]],["p-66a203a1",[[769,"ui-radio-group",{value:[1],name:[1],orientation:[1],disabled:[4],required:[4],internalValue:[32]},null,{value:[{syncFromProp:0}],internalValue:[{syncToRadios:0}],name:[{syncToRadios:0}],orientation:[{syncToRadios:0}],disabled:[{syncToRadios:0}]}]]],["p-5a645647",[[769,"ui-search-result-row",{disabled:[516],selected:[516],hasLeading:[32],hasMeta:[32],hasExcerpt:[32],hasTrailing:[32]}]]],["p-341ba64a",[[769,"ui-search-shell",{hasStatus:[32],hasFooter:[32]}]]],["p-ee31c7b4",[[769,"ui-select",{value:[1],defaultValue:[1,"default-value"],disabled:[4],invalid:[4],required:[4],internalValue:[32]},null,{value:[{syncFromProp:0}],internalValue:[{syncToSelect:0}],defaultValue:[{syncToSelect:0}],disabled:[{syncToSelect:0}],invalid:[{syncToSelect:0}],required:[{syncToSelect:0}]}]]],["p-93ce1c62",[[769,"ui-switch",{checked:[4],defaultChecked:[4,"default-checked"],disabled:[4],required:[4],value:[1],internalChecked:[32]},null,{checked:[{syncFromProp:0}]}]]],["p-4742e6b4",[[769,"ui-tabs",{value:[1],defaultValue:[1,"default-value"],orientation:[1],internalValue:[32]},null,{value:[{syncFromProp:0}],internalValue:[{syncState:0}],orientation:[{syncState:0}]}]]],["p-610b2eca",[[769,"ui-textarea",{value:[1],defaultValue:[1,"default-value"],disabled:[4],invalid:[4],readOnly:[4,"readonly"],rows:[2],internalValue:[32]},null,{value:[{syncFromProp:0}],internalValue:[{syncToTextarea:0}],defaultValue:[{syncToTextarea:0}],disabled:[{syncToTextarea:0}],invalid:[{syncToTextarea:0}],readOnly:[{syncToTextarea:0}],rows:[{syncToTextarea:0}]}]]],["p-ebb74106",[[769,"ui-toast-region",{open:[4],internalOpen:[32]},null,{open:[{syncFromProp:0}]}]]],["p-03f0594b",[[769,"ui-tooltip",{for:[1],open:[4],defaultOpen:[4,"default-open"],internalOpen:[32]},null,{open:[{syncFromProp:0}],internalOpen:[{syncOverlay:0}]}]]],["p-52c537fa",[[769,"ui-top-bar",{hasLeading:[32],hasSearch:[32],hasActions:[32]}]]],["p-ab4151d5",[[769,"ui-menu",{open:[4],defaultOpen:[4,"default-open"],internalOpen:[32]},null,{open:[{syncFromProp:0}]}]]]],e))));
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as t,g as o,h as a,H as r}from"./p-CEeiinfk.js";import{i as e}from"./p-JwSoedEO.js";const s=class{constructor(o){t(this,o)}get host(){return o(this)}variant="outline";size;disabled=!1;slotRef;syncToButton(){const t=this.getButton();t&&(this.host.dataset.size=this.size||"",this.host.dataset.disabled=this.disabled?"true":"",t.disabled=this.disabled)}componentDidLoad(){this.slotRef?.addEventListener("slotchange",(()=>this.syncToButton())),this.syncToButton()}componentDidUpdate(){this.syncToButton()}getButton(){const t=this.host.shadowRoot?.querySelector("slot");return(t?.assignedElements()??Array.from(this.host.children)).find((t=>"BUTTON"===t.tagName))??null}onKeydown=t=>{this.getButton()||this.disabled||!e(t)||(t.preventDefault(),this.host.click())};render(){return a(r,{key:"7840303538ca2e4724ea634809fd6c2ad451f9d1","data-size":this.size||void 0,"data-disabled":this.disabled?"":void 0,onKeyDown:this.onKeydown},a("slot",{key:"731348c7cbb5c5f196dbd565058e0f410836ace2",ref:t=>this.slotRef=t}))}static get watchers(){return{variant:[{syncToButton:0}],size:[{syncToButton:0}],disabled:[{syncToButton:0}]}}};s.style=":host{display:inline-flex;vertical-align:middle;color:var(--ui-text-primary)}:host([variant='outline'])::slotted(button),::slotted(button){appearance:none;border:1px solid var(--ui-border-default);border-radius:var(--ui-button-radius, var(--ui-radius-2));background:var(--ui-surface-default);color:inherit;font:inherit;font-weight:var(--ui-font-medium, 500);line-height:var(--ui-line-height-tight);padding:var(--ui-space-2) var(--ui-space-3);cursor:pointer;transition:background-color var(--ui-motion-fast) var(--ui-motion-ease), border-color var(--ui-motion-fast) var(--ui-motion-ease), color var(--ui-motion-fast) var(--ui-motion-ease), box-shadow var(--ui-motion-fast) var(--ui-motion-ease), transform var(--ui-motion-fast) var(--ui-motion-ease);margin:0}:host([data-size='sm'])::slotted(button){padding:var(--ui-space-1) var(--ui-space-2);font-size:0.875rem}:host([data-size='lg'])::slotted(button){padding:var(--ui-space-3) var(--ui-space-4);font-size:1rem}::slotted(button:hover:enabled){background:var(--ui-surface-muted);border-color:var(--ui-border-strong)}::slotted(button:active:enabled){background:var(--ui-surface-subtle)}:host([variant='solid'])::slotted(button){border-color:var(--ui-accent-solid);background:var(--ui-accent-solid);color:var(--ui-text-on-accent);box-shadow:var(--ui-button-solid-shadow, inset 0 1px rgb(255 255 255 / 0.16), var(--ui-shadow-xs))}:host([variant='solid'])::slotted(button:hover:enabled){background:var(--ui-accent-hover);border-color:var(--ui-accent-hover);box-shadow:var(--ui-shadow-sm);transform:translateY(-1px)}:host([variant='solid'])::slotted(button:active:enabled){background:var(--ui-accent-active);border-color:var(--ui-accent-active);box-shadow:none;transform:translateY(0)}:host([variant='destructive'])::slotted(button){border-color:var(--ui-danger-solid);background:var(--ui-danger-solid);color:var(--ui-text-on-accent);box-shadow:var(--ui-button-destructive-shadow, inset 0 1px rgb(255 255 255 / 0.14), var(--ui-shadow-xs))}:host([variant='destructive'])::slotted(button:hover:enabled){background:var(--ui-danger-hover);border-color:var(--ui-danger-hover);box-shadow:var(--ui-shadow-sm);transform:translateY(-1px)}:host([variant='destructive'])::slotted(button:active:enabled){box-shadow:none;transform:translateY(0)}:host([variant='ghost'])::slotted(button){border-color:transparent;background:transparent}:host([variant='ghost'])::slotted(button:hover:enabled){background:var(--ui-surface-muted);border-color:transparent}:host([variant='ghost'])::slotted(button:active:enabled){background:var(--ui-surface-subtle);border-color:transparent}::slotted(button:focus-visible){outline:2px solid var(--ui-focus-ring);outline-offset:2px}::slotted(button:disabled),:host([data-disabled]){opacity:0.6;cursor:not-allowed}";export{s as ui_button}
|
|
@@ -44,7 +44,10 @@ export namespace Components {
|
|
|
44
44
|
*/
|
|
45
45
|
"disabled": boolean;
|
|
46
46
|
"size"?: string;
|
|
47
|
-
|
|
47
|
+
/**
|
|
48
|
+
* @default 'outline'
|
|
49
|
+
*/
|
|
50
|
+
"variant": 'outline' | 'solid' | 'destructive' | 'ghost';
|
|
48
51
|
}
|
|
49
52
|
interface UiCheckbox {
|
|
50
53
|
/**
|
|
@@ -610,7 +613,10 @@ declare namespace LocalJSX {
|
|
|
610
613
|
*/
|
|
611
614
|
"disabled"?: boolean;
|
|
612
615
|
"size"?: string;
|
|
613
|
-
|
|
616
|
+
/**
|
|
617
|
+
* @default 'outline'
|
|
618
|
+
*/
|
|
619
|
+
"variant"?: 'outline' | 'solid' | 'destructive' | 'ghost';
|
|
614
620
|
}
|
|
615
621
|
interface UiCheckbox {
|
|
616
622
|
/**
|
|
@@ -966,7 +972,7 @@ declare namespace LocalJSX {
|
|
|
966
972
|
"tone": string;
|
|
967
973
|
}
|
|
968
974
|
interface UiButtonAttributes {
|
|
969
|
-
"variant":
|
|
975
|
+
"variant": 'outline' | 'solid' | 'destructive' | 'ghost';
|
|
970
976
|
"size": string;
|
|
971
977
|
"disabled": boolean;
|
|
972
978
|
}
|
|
@@ -3,7 +3,7 @@ import {
|
|
|
3
3
|
getElement,
|
|
4
4
|
h,
|
|
5
5
|
registerInstance
|
|
6
|
-
} from "./chunk-
|
|
6
|
+
} from "./chunk-UDP2LUZ2.js";
|
|
7
7
|
|
|
8
8
|
// dist/esm/ui-avatar-group.entry.js
|
|
9
9
|
var uiAvatarGroupCss = () => `:host{display:flex;align-items:center;flex-direction:row-reverse;gap:0}::slotted(*:not([data-ui-avatar-group-overflow])){margin-inline-end:-0.5rem;flex-shrink:0}::slotted(*:last-of-type:not([data-ui-avatar-group-overflow])){margin-inline-end:0}.overflow{margin-inline-end:-0.5rem;display:inline-flex;align-items:center;justify-content:center;inline-size:2.5rem;block-size:2.5rem;border-radius:999px;border:1px solid var(--ui-border-default);background:var(--ui-surface-muted);color:var(--ui-text-secondary);font:inherit;font-size:0.75rem;font-weight:600;flex-shrink:0}`;
|
|
@@ -2,7 +2,7 @@ import {
|
|
|
2
2
|
Host,
|
|
3
3
|
h,
|
|
4
4
|
registerInstance
|
|
5
|
-
} from "./chunk-
|
|
5
|
+
} from "./chunk-UDP2LUZ2.js";
|
|
6
6
|
|
|
7
7
|
// dist/esm/ui-badge.entry.js
|
|
8
8
|
var uiBadgeCss = () => `:host{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--ui-border-default);border-radius:999px;background:var(--ui-surface-muted);color:var(--ui-text-secondary);font:inherit;font-size:0.75rem;line-height:1;padding:0.25em 0.6em;white-space:nowrap}:host([data-tone='accent']){background:var(--ui-accent-solid);border-color:var(--ui-accent-solid);color:var(--ui-text-on-accent)}:host([data-tone='danger']){background:var(--ui-danger-solid);border-color:var(--ui-danger-solid);color:var(--ui-text-on-accent)}:host([data-tone='success']){background:var(--ui-success-solid);border-color:var(--ui-success-solid);color:var(--ui-text-on-accent)}:host([data-tone='warning']){background:var(--ui-warning-solid);border-color:var(--ui-warning-solid);color:var(--ui-text-primary)}:host([data-tone='info']){background:var(--ui-info-solid);border-color:var(--ui-info-solid);color:var(--ui-text-on-accent)}:host([data-variant='subtle'][data-tone='accent']){background:var(--ui-accent-soft);border-color:var(--ui-accent-soft);color:var(--ui-accent-solid)}:host([data-variant='subtle'][data-tone='danger']){background:var(--ui-danger-soft);border-color:var(--ui-danger-soft);color:var(--ui-danger-solid)}:host([data-variant='subtle'][data-tone='success']){background:var(--ui-success-soft);border-color:var(--ui-success-soft);color:var(--ui-success-solid)}:host([data-variant='subtle'][data-tone='warning']){background:var(--ui-warning-soft);border-color:var(--ui-warning-soft);color:var(--ui-warning-solid)}:host([data-variant='subtle'][data-tone='info']){background:var(--ui-info-soft);border-color:var(--ui-info-soft);color:var(--ui-info-solid)}`;
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
import {
|
|
2
|
+
isActivationKey
|
|
3
|
+
} from "./chunk-UL7UIUJZ.js";
|
|
4
|
+
import {
|
|
5
|
+
Host,
|
|
6
|
+
getElement,
|
|
7
|
+
h,
|
|
8
|
+
registerInstance
|
|
9
|
+
} from "./chunk-UDP2LUZ2.js";
|
|
10
|
+
|
|
11
|
+
// dist/esm/ui-button.entry.js
|
|
12
|
+
var uiButtonCss = () => `:host{display:inline-flex;vertical-align:middle;color:var(--ui-text-primary)}:host([variant='outline'])::slotted(button),::slotted(button){appearance:none;border:1px solid var(--ui-border-default);border-radius:var(--ui-button-radius, var(--ui-radius-2));background:var(--ui-surface-default);color:inherit;font:inherit;font-weight:var(--ui-font-medium, 500);line-height:var(--ui-line-height-tight);padding:var(--ui-space-2) var(--ui-space-3);cursor:pointer;transition:background-color var(--ui-motion-fast) var(--ui-motion-ease), border-color var(--ui-motion-fast) var(--ui-motion-ease), color var(--ui-motion-fast) var(--ui-motion-ease), box-shadow var(--ui-motion-fast) var(--ui-motion-ease), transform var(--ui-motion-fast) var(--ui-motion-ease);margin:0}:host([data-size='sm'])::slotted(button){padding:var(--ui-space-1) var(--ui-space-2);font-size:0.875rem}:host([data-size='lg'])::slotted(button){padding:var(--ui-space-3) var(--ui-space-4);font-size:1rem}::slotted(button:hover:enabled){background:var(--ui-surface-muted);border-color:var(--ui-border-strong)}::slotted(button:active:enabled){background:var(--ui-surface-subtle)}:host([variant='solid'])::slotted(button){border-color:var(--ui-accent-solid);background:var(--ui-accent-solid);color:var(--ui-text-on-accent);box-shadow:var(--ui-button-solid-shadow, inset 0 1px rgb(255 255 255 / 0.16), var(--ui-shadow-xs))}:host([variant='solid'])::slotted(button:hover:enabled){background:var(--ui-accent-hover);border-color:var(--ui-accent-hover);box-shadow:var(--ui-shadow-sm);transform:translateY(-1px)}:host([variant='solid'])::slotted(button:active:enabled){background:var(--ui-accent-active);border-color:var(--ui-accent-active);box-shadow:none;transform:translateY(0)}:host([variant='destructive'])::slotted(button){border-color:var(--ui-danger-solid);background:var(--ui-danger-solid);color:var(--ui-text-on-accent);box-shadow:var(--ui-button-destructive-shadow, inset 0 1px rgb(255 255 255 / 0.14), var(--ui-shadow-xs))}:host([variant='destructive'])::slotted(button:hover:enabled){background:var(--ui-danger-hover);border-color:var(--ui-danger-hover);box-shadow:var(--ui-shadow-sm);transform:translateY(-1px)}:host([variant='destructive'])::slotted(button:active:enabled){box-shadow:none;transform:translateY(0)}:host([variant='ghost'])::slotted(button){border-color:transparent;background:transparent}:host([variant='ghost'])::slotted(button:hover:enabled){background:var(--ui-surface-muted);border-color:transparent}:host([variant='ghost'])::slotted(button:active:enabled){background:var(--ui-surface-subtle);border-color:transparent}::slotted(button:focus-visible){outline:2px solid var(--ui-focus-ring);outline-offset:2px}::slotted(button:disabled),:host([data-disabled]){opacity:0.6;cursor:not-allowed}`;
|
|
13
|
+
var UIButton = class {
|
|
14
|
+
constructor(hostRef) {
|
|
15
|
+
registerInstance(this, hostRef);
|
|
16
|
+
}
|
|
17
|
+
get host() {
|
|
18
|
+
return getElement(this);
|
|
19
|
+
}
|
|
20
|
+
variant = "outline";
|
|
21
|
+
size;
|
|
22
|
+
disabled = false;
|
|
23
|
+
slotRef;
|
|
24
|
+
syncToButton() {
|
|
25
|
+
const btn = this.getButton();
|
|
26
|
+
if (!btn)
|
|
27
|
+
return;
|
|
28
|
+
this.host.dataset.size = this.size || "";
|
|
29
|
+
this.host.dataset.disabled = this.disabled ? "true" : "";
|
|
30
|
+
btn.disabled = this.disabled;
|
|
31
|
+
}
|
|
32
|
+
componentDidLoad() {
|
|
33
|
+
this.slotRef?.addEventListener("slotchange", () => this.syncToButton());
|
|
34
|
+
this.syncToButton();
|
|
35
|
+
}
|
|
36
|
+
componentDidUpdate() {
|
|
37
|
+
this.syncToButton();
|
|
38
|
+
}
|
|
39
|
+
getButton() {
|
|
40
|
+
const slot = this.host.shadowRoot?.querySelector("slot");
|
|
41
|
+
const nodes = slot?.assignedElements() ?? Array.from(this.host.children);
|
|
42
|
+
return nodes.find((el) => el.tagName === "BUTTON") ?? null;
|
|
43
|
+
}
|
|
44
|
+
onKeydown = (e) => {
|
|
45
|
+
const btn = this.getButton();
|
|
46
|
+
if (btn || this.disabled || !isActivationKey(e))
|
|
47
|
+
return;
|
|
48
|
+
e.preventDefault();
|
|
49
|
+
this.host.click();
|
|
50
|
+
};
|
|
51
|
+
render() {
|
|
52
|
+
return h(Host, { key: "7840303538ca2e4724ea634809fd6c2ad451f9d1", "data-size": this.size || void 0, "data-disabled": this.disabled ? "" : void 0, onKeyDown: this.onKeydown }, h("slot", { key: "731348c7cbb5c5f196dbd565058e0f410836ace2", ref: (el) => this.slotRef = el }));
|
|
53
|
+
}
|
|
54
|
+
static get watchers() {
|
|
55
|
+
return {
|
|
56
|
+
"variant": [{
|
|
57
|
+
"syncToButton": 0
|
|
58
|
+
}],
|
|
59
|
+
"size": [{
|
|
60
|
+
"syncToButton": 0
|
|
61
|
+
}],
|
|
62
|
+
"disabled": [{
|
|
63
|
+
"syncToButton": 0
|
|
64
|
+
}]
|
|
65
|
+
};
|
|
66
|
+
}
|
|
67
|
+
};
|
|
68
|
+
UIButton.style = uiButtonCss();
|
|
69
|
+
export {
|
|
70
|
+
UIButton as ui_button
|
|
71
|
+
};
|
|
@@ -7,7 +7,7 @@ import {
|
|
|
7
7
|
getElement,
|
|
8
8
|
h,
|
|
9
9
|
registerInstance
|
|
10
|
-
} from "./chunk-
|
|
10
|
+
} from "./chunk-UDP2LUZ2.js";
|
|
11
11
|
|
|
12
12
|
// dist/esm/ui-checkbox.entry.js
|
|
13
13
|
var uiCheckboxCss = () => `:host{display:inline-flex;align-items:center;gap:var(--ui-space-2);color:var(--ui-text-primary)}:host([aria-disabled='true']),:host([data-disabled='true']){opacity:0.6;cursor:not-allowed}::slotted(input[type='checkbox']){accent-color:var(--ui-accent-solid);width:1.125em;height:1.125em;cursor:pointer}::slotted(input[type='checkbox']:focus-visible){outline:2px solid var(--ui-accent-solid);outline-offset:2px}`;
|
|
@@ -11,7 +11,7 @@ import {
|
|
|
11
11
|
getElement,
|
|
12
12
|
h,
|
|
13
13
|
registerInstance
|
|
14
|
-
} from "./chunk-
|
|
14
|
+
} from "./chunk-UDP2LUZ2.js";
|
|
15
15
|
|
|
16
16
|
// dist/esm/ui-context-menu.entry.js
|
|
17
17
|
var uiContextMenuCss = () => `:host{display:contents}.menu{position:fixed;z-index:var(--ui-z-overlay, 1000);min-width:12rem}.menu[data-open]{display:block}.menu:not([data-open]){display:none !important}`;
|
|
@@ -11,7 +11,7 @@ import {
|
|
|
11
11
|
getElement,
|
|
12
12
|
h,
|
|
13
13
|
registerInstance
|
|
14
|
-
} from "./chunk-
|
|
14
|
+
} from "./chunk-UDP2LUZ2.js";
|
|
15
15
|
|
|
16
16
|
// dist/esm/ui-dialog.entry.js
|
|
17
17
|
var uiDialogCss = () => `:host{display:block}:host:not([open]){display:none}:host dialog{--ui-dialog-duration:var(--ui-motion-base);position:fixed;inset:var(--ui-space-4);width:min(100%, 440px);max-width:min(100%, 440px);margin:auto;padding:var(--ui-space-4);background:var(--ui-surface-elevated);border:1px solid var(--ui-border-default);border-radius:var(--ui-radius-dialog);box-shadow:var(--ui-shadow-dialog);visibility:hidden;pointer-events:none;opacity:0;transform:scale(0.96);transition:opacity var(--ui-dialog-duration) var(--ui-motion-ease), transform var(--ui-dialog-duration) var(--ui-motion-ease), visibility var(--ui-dialog-duration), display var(--ui-dialog-duration) var(--ui-motion-ease) allow-discrete, overlay var(--ui-dialog-duration) var(--ui-motion-ease) allow-discrete}:host dialog[open]{visibility:visible;pointer-events:auto;opacity:1;transform:scale(1);animation:ui-dialog-enter var(--ui-dialog-duration) var(--ui-motion-ease)}@keyframes ui-dialog-enter{from{opacity:0;transform:scale(0.96)}}:host dialog::backdrop{background-color:transparent;transition:background-color var(--ui-dialog-duration) var(--ui-motion-ease), display var(--ui-dialog-duration) var(--ui-motion-ease) allow-discrete, overlay var(--ui-dialog-duration) var(--ui-motion-ease) allow-discrete}:host dialog[open]::backdrop{background-color:var(--ui-overlay-backdrop);animation:ui-dialog-backdrop-enter var(--ui-dialog-duration) var(--ui-motion-ease)}@keyframes ui-dialog-backdrop-enter{from{background-color:transparent}}`;
|
|
@@ -2,7 +2,7 @@ import {
|
|
|
2
2
|
Host,
|
|
3
3
|
h,
|
|
4
4
|
registerInstance
|
|
5
|
-
} from "./chunk-
|
|
5
|
+
} from "./chunk-UDP2LUZ2.js";
|
|
6
6
|
|
|
7
7
|
// dist/esm/ui-floating-action-button.entry.js
|
|
8
8
|
var uiFloatingActionButtonCss = () => `:host{position:fixed;inset-block-end:calc( var(--ui-floating-action-button-bottom, var(--ui-space-6, 1.5rem)) + env(safe-area-inset-bottom) );inset-inline-end:var(--ui-floating-action-button-inline-end, var(--ui-space-5, 1.25rem));inline-size:var(--ui-floating-action-button-size, 56px);block-size:var(--ui-floating-action-button-size, 56px);display:inline-flex;z-index:var(--ui-floating-action-button-z-index, 100)}button{appearance:none;inline-size:100%;block-size:100%;border:none;border-radius:999px;margin:0;padding:0;display:inline-flex;align-items:center;justify-content:center;background:var(--ui-floating-action-button-bg, var(--ui-accent-solid));color:var(--ui-floating-action-button-color, var(--ui-text-on-accent));box-shadow:var( --ui-floating-action-button-shadow, 0 4px 12px color-mix(in srgb, var(--ui-accent-solid) 40%, transparent) );cursor:pointer;transition:background-color var(--ui-motion-fast, 160ms) var(--ui-motion-ease, ease), transform var(--ui-motion-fast, 160ms) var(--ui-motion-ease, ease), box-shadow var(--ui-motion-fast, 160ms) var(--ui-motion-ease, ease)}button:hover:enabled{background:var(--ui-floating-action-button-hover-bg, var(--ui-accent-hover));box-shadow:var( --ui-floating-action-button-hover-shadow, 0 6px 16px color-mix(in srgb, var(--ui-accent-solid) 50%, transparent) )}button:active:enabled{transform:scale(var(--ui-floating-action-button-active-scale, 0.94))}button:focus-visible{outline:2px solid var(--ui-focus-ring);outline-offset:2px}button:disabled,:host([disabled]){opacity:0.6;cursor:not-allowed}::slotted(svg){inline-size:var(--ui-floating-action-button-icon-size, 24px);block-size:var(--ui-floating-action-button-icon-size, 24px);flex-shrink:0}@media (min-width: 768px){:host([mobile-only]){display:none}}`;
|