@relements/core 0.1.0
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/base.css +1 -0
- package/dist/behaviors/dialog.d.ts +39 -0
- package/dist/behaviors/dialog.js +1 -0
- package/dist/behaviors/dismissible.d.ts +37 -0
- package/dist/behaviors/dismissible.js +1 -0
- package/dist/behaviors/menu-button.d.ts +36 -0
- package/dist/behaviors/menu-button.js +1 -0
- package/dist/behaviors/popover.d.ts +28 -0
- package/dist/behaviors/popover.js +1 -0
- package/dist/behaviors/tabs.d.ts +37 -0
- package/dist/behaviors/tabs.js +1 -0
- package/dist/behaviors/toast.d.ts +42 -0
- package/dist/behaviors/toast.js +1 -0
- package/dist/chunk-GMICGIQW.js +149 -0
- package/dist/chunk-J4EGUBPP.js +68 -0
- package/dist/chunk-PIDPGDBZ.js +62 -0
- package/dist/chunk-PSODVT3V.js +67 -0
- package/dist/chunk-TC4TFP7Y.js +40 -0
- package/dist/chunk-ZHRJNWMH.js +174 -0
- package/dist/components/button.css +1 -0
- package/dist/components/dialog.css +1 -0
- package/dist/components/disclosure.css +1 -0
- package/dist/components/form.css +1 -0
- package/dist/components/link.css +1 -0
- package/dist/components/menu.css +1 -0
- package/dist/components/popover.css +1 -0
- package/dist/components/progress.css +1 -0
- package/dist/components/tabs.css +1 -0
- package/dist/components/toast.css +1 -0
- package/dist/elements/re-menu.d.ts +10 -0
- package/dist/elements/re-menu.js +36 -0
- package/dist/elements/re-popover.d.ts +12 -0
- package/dist/elements/re-popover.js +35 -0
- package/dist/elements/re-tabs.d.ts +20 -0
- package/dist/elements/re-tabs.js +60 -0
- package/dist/elements/re-toast.d.ts +15 -0
- package/dist/elements/re-toast.js +30 -0
- package/dist/index.css +1 -0
- package/dist/index.d.ts +6 -0
- package/dist/index.js +6 -0
- package/dist/reset.css +1 -0
- package/dist/themes/renascent.css +1 -0
- package/dist/tokens.css +1 -0
- package/package.json +84 -0
- package/src/base.css +129 -0
- package/src/behaviors/dialog.js +106 -0
- package/src/behaviors/dismissible.js +68 -0
- package/src/behaviors/menu-button.js +199 -0
- package/src/behaviors/popover.js +103 -0
- package/src/behaviors/tabs.js +171 -0
- package/src/behaviors/toast.js +97 -0
- package/src/components/button.css +141 -0
- package/src/components/dialog.css +106 -0
- package/src/components/disclosure.css +83 -0
- package/src/components/form.css +334 -0
- package/src/components/link.css +61 -0
- package/src/components/menu.css +78 -0
- package/src/components/popover.css +50 -0
- package/src/components/progress.css +112 -0
- package/src/components/tabs.css +86 -0
- package/src/components/toast.css +87 -0
- package/src/elements/re-menu.js +54 -0
- package/src/elements/re-popover.js +59 -0
- package/src/elements/re-tabs.js +92 -0
- package/src/elements/re-toast.js +46 -0
- package/src/index.css +30 -0
- package/src/index.js +13 -0
- package/src/reset.css +103 -0
- package/src/themes/renascent.css +198 -0
- package/src/tokens.css +196 -0
|
@@ -0,0 +1,174 @@
|
|
|
1
|
+
// src/behaviors/menu-button.js
|
|
2
|
+
function enhanceMenuButton(root = document) {
|
|
3
|
+
if (root == null) {
|
|
4
|
+
throw new TypeError("enhanceMenuButton: root must be a Document, Element, or ShadowRoot");
|
|
5
|
+
}
|
|
6
|
+
const cleanups = [];
|
|
7
|
+
if (root instanceof Element && /** @type {Element} */
|
|
8
|
+
root.matches?.("[data-re-menu]")) {
|
|
9
|
+
cleanups.push(wireOne(
|
|
10
|
+
/** @type {HTMLElement} */
|
|
11
|
+
root
|
|
12
|
+
));
|
|
13
|
+
}
|
|
14
|
+
const hosts = root.querySelectorAll("[data-re-menu]");
|
|
15
|
+
hosts.forEach((host) => {
|
|
16
|
+
cleanups.push(wireOne(
|
|
17
|
+
/** @type {HTMLElement} */
|
|
18
|
+
host
|
|
19
|
+
));
|
|
20
|
+
});
|
|
21
|
+
return {
|
|
22
|
+
destroy() {
|
|
23
|
+
while (cleanups.length) {
|
|
24
|
+
const fn = cleanups.pop();
|
|
25
|
+
fn?.();
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
};
|
|
29
|
+
}
|
|
30
|
+
function wireOne(host) {
|
|
31
|
+
const button = (
|
|
32
|
+
/** @type {HTMLElement | null} */
|
|
33
|
+
host.querySelector('[aria-haspopup="menu"], [aria-haspopup="true"]')
|
|
34
|
+
);
|
|
35
|
+
const panel = (
|
|
36
|
+
/** @type {HTMLElement | null} */
|
|
37
|
+
host.querySelector('[role="menu"]')
|
|
38
|
+
);
|
|
39
|
+
if (!button || !panel) return () => {
|
|
40
|
+
};
|
|
41
|
+
const items = () => (
|
|
42
|
+
/** @type {HTMLElement[]} */
|
|
43
|
+
Array.from(panel.querySelectorAll('[role="menuitem"]:not([disabled])'))
|
|
44
|
+
);
|
|
45
|
+
const isOpen = () => button.getAttribute("aria-expanded") === "true";
|
|
46
|
+
const setOpen = (open) => {
|
|
47
|
+
button.setAttribute("aria-expanded", String(open));
|
|
48
|
+
panel.hidden = !open;
|
|
49
|
+
};
|
|
50
|
+
const openMenu = (opts = {}) => {
|
|
51
|
+
if (isOpen()) return;
|
|
52
|
+
setOpen(true);
|
|
53
|
+
if (opts.focusFirst) {
|
|
54
|
+
const first = items()[0];
|
|
55
|
+
first?.focus();
|
|
56
|
+
}
|
|
57
|
+
};
|
|
58
|
+
const closeMenu = (opts = {}) => {
|
|
59
|
+
if (!isOpen()) return;
|
|
60
|
+
setOpen(false);
|
|
61
|
+
if (opts.returnFocus) button.focus();
|
|
62
|
+
};
|
|
63
|
+
const onButtonClick = (event) => {
|
|
64
|
+
event.stopPropagation();
|
|
65
|
+
if (isOpen()) closeMenu();
|
|
66
|
+
else openMenu({ focusFirst: false });
|
|
67
|
+
};
|
|
68
|
+
const onButtonKey = (event) => {
|
|
69
|
+
if (event.key === "ArrowDown" || event.key === "Enter" || event.key === " ") {
|
|
70
|
+
event.preventDefault();
|
|
71
|
+
openMenu({ focusFirst: true });
|
|
72
|
+
} else if (event.key === "ArrowUp") {
|
|
73
|
+
event.preventDefault();
|
|
74
|
+
openMenu();
|
|
75
|
+
const all = items();
|
|
76
|
+
all[all.length - 1]?.focus();
|
|
77
|
+
}
|
|
78
|
+
};
|
|
79
|
+
const onPanelKey = (event) => {
|
|
80
|
+
const all = items();
|
|
81
|
+
const active = document.activeElement;
|
|
82
|
+
const idx = all.findIndex((el) => el === active);
|
|
83
|
+
switch (event.key) {
|
|
84
|
+
case "ArrowDown": {
|
|
85
|
+
event.preventDefault();
|
|
86
|
+
const next = all[(idx + 1 + all.length) % all.length];
|
|
87
|
+
next?.focus();
|
|
88
|
+
return;
|
|
89
|
+
}
|
|
90
|
+
case "ArrowUp": {
|
|
91
|
+
event.preventDefault();
|
|
92
|
+
const prev = all[(idx - 1 + all.length) % all.length];
|
|
93
|
+
prev?.focus();
|
|
94
|
+
return;
|
|
95
|
+
}
|
|
96
|
+
case "Home":
|
|
97
|
+
event.preventDefault();
|
|
98
|
+
all[0]?.focus();
|
|
99
|
+
return;
|
|
100
|
+
case "End":
|
|
101
|
+
event.preventDefault();
|
|
102
|
+
all[all.length - 1]?.focus();
|
|
103
|
+
return;
|
|
104
|
+
case "Escape":
|
|
105
|
+
event.preventDefault();
|
|
106
|
+
closeMenu({ returnFocus: true });
|
|
107
|
+
return;
|
|
108
|
+
case "Tab":
|
|
109
|
+
closeMenu();
|
|
110
|
+
return;
|
|
111
|
+
}
|
|
112
|
+
};
|
|
113
|
+
const onPanelClick = (event) => {
|
|
114
|
+
const target = (
|
|
115
|
+
/** @type {Element | null} */
|
|
116
|
+
event.target
|
|
117
|
+
);
|
|
118
|
+
if (!target) return;
|
|
119
|
+
const item = target.closest('[role="menuitem"]');
|
|
120
|
+
if (!item) return;
|
|
121
|
+
const value = (
|
|
122
|
+
/** @type {HTMLElement} */
|
|
123
|
+
item.dataset.value ?? /** @type {HTMLElement} */
|
|
124
|
+
item.textContent?.trim() ?? ""
|
|
125
|
+
);
|
|
126
|
+
const allowed = host.dispatchEvent(
|
|
127
|
+
new CustomEvent("re-select", {
|
|
128
|
+
bubbles: true,
|
|
129
|
+
cancelable: true,
|
|
130
|
+
detail: { item, value }
|
|
131
|
+
})
|
|
132
|
+
);
|
|
133
|
+
if (allowed) closeMenu({ returnFocus: true });
|
|
134
|
+
};
|
|
135
|
+
const onOutsideClick = (event) => {
|
|
136
|
+
if (!isOpen()) return;
|
|
137
|
+
const t = (
|
|
138
|
+
/** @type {Node | null} */
|
|
139
|
+
event.target
|
|
140
|
+
);
|
|
141
|
+
if (t && host.contains(t)) return;
|
|
142
|
+
closeMenu();
|
|
143
|
+
};
|
|
144
|
+
button.addEventListener("click", onButtonClick);
|
|
145
|
+
button.addEventListener(
|
|
146
|
+
"keydown",
|
|
147
|
+
/** @type {EventListener} */
|
|
148
|
+
onButtonKey
|
|
149
|
+
);
|
|
150
|
+
panel.addEventListener(
|
|
151
|
+
"keydown",
|
|
152
|
+
/** @type {EventListener} */
|
|
153
|
+
onPanelKey
|
|
154
|
+
);
|
|
155
|
+
panel.addEventListener("click", onPanelClick);
|
|
156
|
+
document.addEventListener("click", onOutsideClick);
|
|
157
|
+
return () => {
|
|
158
|
+
button.removeEventListener("click", onButtonClick);
|
|
159
|
+
button.removeEventListener(
|
|
160
|
+
"keydown",
|
|
161
|
+
/** @type {EventListener} */
|
|
162
|
+
onButtonKey
|
|
163
|
+
);
|
|
164
|
+
panel.removeEventListener(
|
|
165
|
+
"keydown",
|
|
166
|
+
/** @type {EventListener} */
|
|
167
|
+
onPanelKey
|
|
168
|
+
);
|
|
169
|
+
panel.removeEventListener("click", onPanelClick);
|
|
170
|
+
document.removeEventListener("click", onOutsideClick);
|
|
171
|
+
};
|
|
172
|
+
}
|
|
173
|
+
|
|
174
|
+
export { enhanceMenuButton };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@layer re.components{.re-button{justify-content:center;align-items:center;gap:var(--re-space-2);box-sizing:border-box;block-size:var(--re-control-height-md);padding-inline:var(--re-space-4);font:inherit;font-weight:var(--re-font-weight-medium);font-size:var(--re-size-text-md);text-align:center;white-space:nowrap;-webkit-user-select:none;user-select:none;color:var(--re-color-text-on-accent);background-color:var(--re-color-accent-600);border:var(--re-border-width) solid transparent;border-radius:var(--re-radius-md);cursor:pointer;transition:background-color var(--re-duration-fast) var(--re-easing-standard), color var(--re-duration-fast) var(--re-easing-standard), border-color var(--re-duration-fast) var(--re-easing-standard), box-shadow var(--re-duration-fast) var(--re-easing-standard);padding-block:0;line-height:1;text-decoration:none;display:inline-flex}a.re-button{-webkit-tap-highlight-color:transparent}.re-button:hover{background-color:var(--re-color-accent-700)}.re-button:active{background-color:var(--re-color-accent-800)}.re-button:focus-visible{box-shadow:var(--re-shadow-focus);outline:none}.re-button:disabled,.re-button[aria-disabled=true]{cursor:not-allowed;opacity:.55;pointer-events:none}a.re-button[aria-disabled=true]{pointer-events:none}.re-button[data-variant=secondary]{color:var(--re-color-text);background-color:var(--re-color-bg);border-color:var(--re-color-border-strong)}.re-button[data-variant=secondary]:hover{background-color:var(--re-color-bg-subtle)}.re-button[data-variant=secondary]:active{background-color:var(--re-color-bg-muted)}.re-button[data-variant=ghost]{color:var(--re-color-text);background-color:#0000;border-color:#0000}.re-button[data-variant=ghost]:hover{background-color:var(--re-color-bg-subtle)}.re-button[data-variant=ghost]:active{background-color:var(--re-color-bg-muted)}.re-button[data-variant=danger]{color:var(--re-color-text-on-accent);background-color:var(--re-color-danger-600)}.re-button[data-variant=danger]:hover{background-color:var(--re-color-danger-700)}.re-button[data-variant=danger]:active{background-color:var(--re-color-danger-700);filter:brightness(.95)}.re-button[data-size=sm]{block-size:var(--re-control-height-sm);padding-inline:var(--re-space-3);font-size:var(--re-size-text-sm)}.re-button[data-size=lg]{block-size:var(--re-control-height-lg);padding-inline:var(--re-space-5);font-size:var(--re-size-text-lg)}.re-button[data-full-width]{inline-size:100%}}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@layer re.components{.re-dialog:not([open]){display:none}.re-dialog{box-sizing:border-box;border:var(--re-border-default);border-radius:var(--re-radius-lg);background-color:var(--re-color-surface);color:var(--re-color-text);max-block-size:min(85vh,40rem);inline-size:min(90vw,32rem);box-shadow:var(--re-shadow-lg);flex-direction:column;padding:0;display:flex;overflow:hidden}.re-dialog::backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background-color:#0006}.re-dialog:focus-visible{outline:none}.re-dialog__header{justify-content:space-between;align-items:center;gap:var(--re-space-3);padding:var(--re-space-4);border-block-end:var(--re-border-default);display:flex}.re-dialog__title{font-size:var(--re-size-text-lg);font-weight:var(--re-font-weight-semibold);line-height:var(--re-line-height-tight);color:var(--re-color-text);margin:0}.re-dialog__close{appearance:none;cursor:pointer;padding:var(--re-space-1) var(--re-space-2);border-radius:var(--re-radius-md);color:var(--re-color-text-muted);font:inherit;font-size:var(--re-size-text-xl);transition:background-color var(--re-duration-fast) var(--re-easing-standard);background:0 0;border:0;line-height:1}.re-dialog__close:hover{background-color:var(--re-color-bg-subtle);color:var(--re-color-text)}.re-dialog__close:focus-visible{box-shadow:var(--re-shadow-focus);outline:none}.re-dialog__body{padding:var(--re-space-4);line-height:var(--re-line-height-normal);overflow-y:auto}.re-dialog__footer{justify-content:flex-end;gap:var(--re-space-3);padding:var(--re-space-4);border-block-start:var(--re-border-default);background-color:var(--re-color-bg-subtle);display:flex}}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@layer re.components{.re-disclosure{border:var(--re-border-default);border-radius:var(--re-radius-md);background-color:var(--re-color-surface);overflow:hidden}.re-disclosure__summary{cursor:pointer;padding:var(--re-space-3) var(--re-space-4);font-weight:var(--re-font-weight-medium);color:var(--re-color-text);align-items:center;gap:var(--re-space-3);-webkit-user-select:none;user-select:none;transition:background-color var(--re-duration-fast) var(--re-easing-standard);list-style:none;display:flex}.re-disclosure__summary::-webkit-details-marker{display:none}.re-disclosure__summary:before{content:"";block-size:.6rem;inline-size:.6rem;transition:transform var(--re-duration-fast) var(--re-easing-standard);border-block-end:2px solid;border-inline-end:2px solid;flex-shrink:0;margin-inline-end:var(--re-space-1);transform:rotate(-45deg)}.re-disclosure[open]>.re-disclosure__summary:before{transform:rotate(45deg)}.re-disclosure__summary:hover{background-color:var(--re-color-bg-subtle)}.re-disclosure__summary:focus-visible{box-shadow:var(--re-shadow-focus);outline:none}.re-disclosure__body{padding:var(--re-space-3) var(--re-space-4) var(--re-space-4);border-block-start:var(--re-border-default);color:var(--re-color-text);line-height:var(--re-line-height-normal)}.re-disclosure[data-variant=plain]{background:0 0;border:0}.re-disclosure[data-variant=plain]>.re-disclosure__body{border-block-start:0;padding-block-start:var(--re-space-2)}}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@layer re.components{.re-input,.re-textarea,.re-select{box-sizing:border-box;inline-size:100%;min-block-size:var(--re-control-height-md);padding-inline:var(--re-control-padding-x);padding-block:var(--re-control-padding-y);font:inherit;font-size:var(--re-size-text-md);line-height:var(--re-line-height-normal);color:var(--re-color-text);background-color:var(--re-color-bg);border:var(--re-border-default);border-radius:var(--re-radius-md);appearance:none;transition:border-color var(--re-duration-fast) var(--re-easing-standard), box-shadow var(--re-duration-fast) var(--re-easing-standard), background-color var(--re-duration-fast) var(--re-easing-standard);display:block}.re-input::placeholder,.re-textarea::placeholder{color:var(--re-color-text-subtle);opacity:1}.re-input:hover,.re-textarea:hover,.re-select:hover{border-color:var(--re-color-border-strong)}.re-input:focus-visible,.re-textarea:focus-visible,.re-select:focus-visible{border-color:var(--re-color-focus-ring);box-shadow:var(--re-shadow-focus);outline:none}:is(.re-input[aria-invalid=true],.re-textarea[aria-invalid=true],.re-select[aria-invalid=true],.re-input:user-invalid,.re-textarea:user-invalid,.re-select:user-invalid){border-color:var(--re-color-border-danger)}:is(.re-input[aria-invalid=true]:focus-visible,.re-textarea[aria-invalid=true]:focus-visible,.re-select[aria-invalid=true]:focus-visible,.re-input:user-invalid:focus-visible,.re-textarea:user-invalid:focus-visible,.re-select:user-invalid:focus-visible){box-shadow:0 0 0 var(--re-focus-ring-offset) var(--re-color-bg), 0 0 0 calc(var(--re-focus-ring-offset) + var(--re-focus-ring-width)) var(--re-color-danger-500)}.re-input:disabled,.re-textarea:disabled,.re-select:disabled,.re-checkbox:disabled,.re-radio:disabled{cursor:not-allowed;background-color:var(--re-color-bg-muted);color:var(--re-color-text-subtle);opacity:.7}.re-input[data-size=sm],.re-textarea[data-size=sm],.re-select[data-size=sm]{min-block-size:var(--re-control-height-sm);font-size:var(--re-size-text-sm);padding-inline:var(--re-space-2)}.re-input[data-size=lg],.re-textarea[data-size=lg],.re-select[data-size=lg]{min-block-size:var(--re-control-height-lg);font-size:var(--re-size-text-lg);padding-inline:var(--re-space-4)}.re-textarea{min-block-size:calc(var(--re-control-height-md) * 2);resize:vertical;line-height:var(--re-line-height-relaxed)}.re-select{background-image:linear-gradient(45deg,#0000 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,#0000 50%);background-position:right var(--re-space-4) top 55%, right calc(var(--re-space-4) - 5px) top 55%;color:var(--re-color-text);background-repeat:no-repeat;background-size:5px 5px,5px 5px;padding-inline-end:var(--re-space-8)}.re-select[multiple]{min-block-size:calc(var(--re-control-height-md) * 3);background-image:none;padding-inline-end:var(--re-control-padding-x)}.re-select[multiple] option{padding-block:var(--re-space-1)}.re-checkbox,.re-radio{appearance:none;background-color:var(--re-color-bg);border:var(--re-border-width-strong) solid var(--re-color-border-strong);cursor:pointer;block-size:1.125rem;inline-size:1.125rem;color:var(--re-color-text-on-accent);transition:background-color var(--re-duration-fast) var(--re-easing-standard), border-color var(--re-duration-fast) var(--re-easing-standard), box-shadow var(--re-duration-fast) var(--re-easing-standard);flex-shrink:0;place-content:center;margin:0;padding:0;display:inline-grid}.re-checkbox{border-radius:var(--re-radius-sm)}.re-radio{border-radius:var(--re-radius-pill)}.re-checkbox:hover,.re-radio:hover{border-color:var(--re-color-accent-600)}.re-checkbox:focus-visible,.re-radio:focus-visible{box-shadow:var(--re-shadow-focus);border-color:var(--re-color-focus-ring);outline:none}.re-checkbox:checked,.re-radio:checked{background-color:var(--re-color-accent-600);border-color:var(--re-color-accent-600)}.re-checkbox:checked:before{content:"";clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0,43% 62%);background-color:currentColor;block-size:.65rem;inline-size:.65rem}.re-radio:checked:before{content:"";border-radius:var(--re-radius-pill);background-color:currentColor;block-size:.55rem;inline-size:.55rem}.re-checkbox:indeterminate{background-color:var(--re-color-accent-600);border-color:var(--re-color-accent-600)}.re-checkbox:indeterminate:before{content:"";border-radius:var(--re-radius-sm);background-color:currentColor;block-size:.18rem;inline-size:.7rem}.re-checkbox[aria-invalid=true],.re-radio[aria-invalid=true]{border-color:var(--re-color-border-danger)}.re-field{gap:var(--re-space-2);color:var(--re-color-text);flex-direction:column;display:flex}.re-field__label{font-size:var(--re-size-text-sm);font-weight:var(--re-font-weight-medium);color:var(--re-color-text);line-height:1.2}.re-field__label[data-required]:after{content:" *";color:var(--re-color-text-danger);margin-inline-start:.1em}.re-field__hint{font-size:var(--re-size-text-sm);color:var(--re-color-text-muted);line-height:var(--re-line-height-normal)}.re-field--inline{align-items:center;gap:var(--re-space-3);flex-direction:row}.re-field-group{gap:var(--re-space-2);border:0;flex-direction:column;margin:0;padding:0;display:flex}.re-field-group__legend{font-size:var(--re-size-text-sm);font-weight:var(--re-font-weight-medium);color:var(--re-color-text);padding:0;line-height:1.2}.re-field-group[data-orientation=horizontal]>.re-field-group__items{gap:var(--re-space-4);flex-flow:wrap}.re-field-group__items{gap:var(--re-space-2);flex-direction:column;display:flex}.re-validation-message{font-size:var(--re-size-text-sm);line-height:var(--re-line-height-normal);color:var(--re-color-text-danger);display:block}.re-validation-message[data-tone=success]{color:var(--re-color-success-700)}.re-validation-message[data-tone=hint]{color:var(--re-color-text-muted)}.re-validation-message[data-tone=warning]{color:var(--re-color-warning-700)}}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@layer re.components{.re-link{color:var(--re-color-link);text-underline-offset:.18em;border-radius:var(--re-radius-sm);transition:color var(--re-duration-fast) var(--re-easing-standard), text-decoration-color var(--re-duration-fast) var(--re-easing-standard);text-decoration-line:underline;text-decoration-color:currentColor;text-decoration-thickness:.08em}.re-link:hover{color:var(--re-color-link-hover)}.re-link:visited{color:var(--re-color-link-visited)}.re-link:focus-visible{box-shadow:var(--re-shadow-focus);outline:none}.re-link[data-variant=muted]{color:var(--re-color-text-muted);-webkit-text-decoration-color:var(--re-color-border-strong);text-decoration-color:var(--re-color-border-strong)}.re-link[data-variant=muted]:hover{color:var(--re-color-text);text-decoration-color:currentColor}.re-link[data-variant=subtle]{text-decoration-line:none}.re-link[data-variant=subtle]:hover{text-decoration-line:underline}.re-link[data-variant=external]:after{content:" ↗";speak:none}}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@layer re.components{.re-menu{display:inline-block;position:relative}.re-menu__panel{background-color:var(--re-color-surface);border:var(--re-border-default);border-radius:var(--re-radius-md);min-inline-size:12rem;box-shadow:var(--re-shadow-md);padding:var(--re-space-1);z-index:var(--re-z-popover);flex-direction:column;gap:1px;display:flex;position:absolute;inset-block-start:calc(100% + var(--re-space-1));inset-inline-start:0}.re-menu__item{appearance:none;cursor:pointer;font:inherit;text-align:start;padding:var(--re-space-2) var(--re-space-3);border-radius:var(--re-radius-sm);color:var(--re-color-text);line-height:var(--re-line-height-normal);background:0 0;border:0}.re-menu__item:hover{background-color:var(--re-color-bg-muted);outline:none}.re-menu__item:focus-visible{background-color:var(--re-color-bg-muted);box-shadow:inset 0 0 0 2px var(--re-color-focus-ring);outline:none}.re-menu__item[aria-disabled=true],.re-menu__item:disabled{color:var(--re-color-text-subtle);cursor:not-allowed}.re-menu__separator{background-color:var(--re-color-border);block-size:1px;margin-block:var(--re-space-1)}}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@layer re.components{.re-popover{border:var(--re-border-default);border-radius:var(--re-radius-md);background-color:var(--re-color-surface);color:var(--re-color-text);padding:var(--re-space-3) var(--re-space-4);box-shadow:var(--re-shadow-md);max-inline-size:22rem;line-height:var(--re-line-height-normal);margin:0;inset:auto}.re-popover:popover-open{margin:0}.re-popover[data-tone=info]{background-color:color-mix(in srgb, var(--re-color-accent-500) 12%, var(--re-color-surface));border-color:var(--re-color-accent-500)}.re-popover[data-tone=warning]{background-color:color-mix(in srgb, var(--re-color-warning-500) 12%, var(--re-color-surface));border-color:var(--re-color-warning-500)}.re-popover[data-tone=danger]{background-color:color-mix(in srgb, var(--re-color-danger-500) 12%, var(--re-color-surface));border-color:var(--re-color-danger-500)}}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@layer re.components{.re-progress,.re-meter{appearance:none;border-radius:var(--re-radius-pill);background-color:var(--re-color-bg-muted);block-size:.5rem;inline-size:100%;color:var(--re-color-accent-600);border:0;overflow:hidden}.re-progress::-webkit-progress-bar{background-color:var(--re-color-bg-muted);border-radius:var(--re-radius-pill)}.re-progress::-webkit-progress-value{background-color:var(--re-color-accent-600);border-radius:var(--re-radius-pill);transition:inline-size var(--re-duration-normal) var(--re-easing-standard)}.re-progress::-moz-progress-bar{background-color:var(--re-color-accent-600);border-radius:var(--re-radius-pill)}.re-progress:indeterminate{background:linear-gradient(90deg, transparent 0%, var(--re-color-accent-300) 50%, transparent 100%) no-repeat, var(--re-color-bg-muted);background-size:40% 100%,100% 100%;animation:1.2s linear infinite re-progress-indeterminate}@keyframes re-progress-indeterminate{0%{background-position:-40% 0,0 0}to{background-position:140% 0,0 0}}@media (prefers-reduced-motion:reduce){.re-progress:indeterminate{animation-duration:.01ms}}.re-meter::-webkit-meter-bar{background-color:var(--re-color-bg-muted);border-radius:var(--re-radius-pill);border:0}.re-meter::-webkit-meter-optimum-value{background-color:var(--re-color-success-600);border-radius:var(--re-radius-pill)}.re-meter::-webkit-meter-suboptimum-value{background-color:var(--re-color-warning-600);border-radius:var(--re-radius-pill)}.re-meter::-webkit-meter-even-less-good-value{background-color:var(--re-color-danger-600);border-radius:var(--re-radius-pill)}.re-meter::-moz-meter-bar{background-color:var(--re-color-success-600);border-radius:var(--re-radius-pill)}.re-meter:-moz-meter-sub-optimum::-moz-meter-bar{background-color:var(--re-color-warning-600)}.re-meter:-moz-meter-sub-sub-optimum::-moz-meter-bar{background-color:var(--re-color-danger-600)}.re-progress[data-size=sm],.re-meter[data-size=sm]{block-size:.25rem}.re-progress[data-size=lg],.re-meter[data-size=lg]{block-size:.75rem}}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@layer re.components{.re-tabs{gap:var(--re-space-4);flex-direction:column;display:flex}.re-tabs__list{gap:var(--re-space-1);border-block-end:var(--re-border-default);flex-wrap:wrap;padding-block-end:0;display:flex}.re-tab{appearance:none;cursor:pointer;font:inherit;color:var(--re-color-text-muted);padding:var(--re-space-2) var(--re-space-4);border-radius:var(--re-radius-md) var(--re-radius-md) 0 0;line-height:1.4;font-weight:var(--re-font-weight-medium);transition:color var(--re-duration-fast) var(--re-easing-standard), background-color var(--re-duration-fast) var(--re-easing-standard);background:0 0;border:0;position:relative}.re-tab:hover{color:var(--re-color-text);background-color:var(--re-color-bg-subtle)}.re-tab:focus-visible{box-shadow:var(--re-shadow-focus);outline:none}.re-tab[aria-selected=true]{color:var(--re-color-text);background-color:var(--re-color-bg)}.re-tab[aria-selected=true]:after{content:"";inset-inline:var(--re-space-2);background-color:var(--re-color-accent-600);border-radius:var(--re-radius-sm);block-size:2px;position:absolute;inset-block-end:calc(var(--re-border-width) * -1)}.re-tabpanel{color:var(--re-color-text);line-height:var(--re-line-height-normal)}.re-tabpanel:focus-visible{box-shadow:var(--re-shadow-focus);border-radius:var(--re-radius-md);outline:none}}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@layer re.components{.re-toast-region{z-index:var(--re-z-toast);pointer-events:none;position:fixed;inset-block-end:var(--re-space-6);inset-inline-end:var(--re-space-6)}.re-toast-list{gap:var(--re-space-2);flex-direction:column-reverse;min-inline-size:16rem;max-inline-size:24rem;margin:0;padding:0;display:flex}.re-toast{pointer-events:auto;gap:var(--re-space-3);padding:var(--re-space-3) var(--re-space-4);background-color:var(--re-color-surface);color:var(--re-color-text);border:var(--re-border-default);border-radius:var(--re-radius-md);box-shadow:var(--re-shadow-md);line-height:var(--re-line-height-normal);align-items:flex-start;display:flex}.re-toast__body{flex:auto}.re-toast__dismiss{appearance:none;cursor:pointer;color:var(--re-color-text-muted);font:inherit;font-size:var(--re-size-text-lg);padding:0 var(--re-space-1);border-radius:var(--re-radius-sm);background:0 0;border:0;line-height:1}.re-toast__dismiss:hover{color:var(--re-color-text);background:var(--re-color-bg-subtle)}.re-toast__dismiss:focus-visible{box-shadow:var(--re-shadow-focus);outline:none}.re-toast[data-tone=success]{background-color:color-mix(in srgb, var(--re-color-success-600) 12%, var(--re-color-surface));border-color:var(--re-color-success-600);color:var(--re-color-text)}.re-toast[data-tone=danger]{background-color:color-mix(in srgb, var(--re-color-danger-600) 12%, var(--re-color-surface));border-color:var(--re-color-danger-600);color:var(--re-color-text)}.re-toast[data-tone=warning]{background-color:color-mix(in srgb, var(--re-color-warning-600) 12%, var(--re-color-surface));border-color:var(--re-color-warning-600);color:var(--re-color-text)}}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import { enhanceMenuButton } from '../chunk-ZHRJNWMH.js';
|
|
2
|
+
|
|
3
|
+
// src/elements/re-menu.js
|
|
4
|
+
var ReMenuElement = class extends HTMLElement {
|
|
5
|
+
/** @type {{ destroy: () => void } | null} */
|
|
6
|
+
#controller = null;
|
|
7
|
+
connectedCallback() {
|
|
8
|
+
this.classList.add("re-menu");
|
|
9
|
+
this.setAttribute("data-re-menu", "");
|
|
10
|
+
this.#controller = enhanceMenuButton(this);
|
|
11
|
+
}
|
|
12
|
+
disconnectedCallback() {
|
|
13
|
+
this.#controller?.destroy();
|
|
14
|
+
this.#controller = null;
|
|
15
|
+
}
|
|
16
|
+
/** @returns {boolean} */
|
|
17
|
+
get open() {
|
|
18
|
+
const btn = this.querySelector('[aria-haspopup="menu"], [aria-haspopup="true"]');
|
|
19
|
+
return btn?.getAttribute("aria-expanded") === "true";
|
|
20
|
+
}
|
|
21
|
+
set open(value) {
|
|
22
|
+
const btn = (
|
|
23
|
+
/** @type {HTMLElement | null} */
|
|
24
|
+
this.querySelector('[aria-haspopup="menu"], [aria-haspopup="true"]')
|
|
25
|
+
);
|
|
26
|
+
if (!btn) return;
|
|
27
|
+
const want = Boolean(value);
|
|
28
|
+
if (this.open === want) return;
|
|
29
|
+
btn.click();
|
|
30
|
+
}
|
|
31
|
+
};
|
|
32
|
+
if (typeof customElements !== "undefined" && !customElements.get("re-menu")) {
|
|
33
|
+
customElements.define("re-menu", ReMenuElement);
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
export { ReMenuElement };
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
declare class RePopoverElement extends HTMLElement {
|
|
2
|
+
connectedCallback(): void;
|
|
3
|
+
disconnectedCallback(): void;
|
|
4
|
+
/** @returns {boolean} */
|
|
5
|
+
get open(): boolean;
|
|
6
|
+
show(): void;
|
|
7
|
+
hide(): void;
|
|
8
|
+
toggle(): void;
|
|
9
|
+
#private;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
export { RePopoverElement };
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import { enhancePopover } from '../chunk-PSODVT3V.js';
|
|
2
|
+
|
|
3
|
+
// src/elements/re-popover.js
|
|
4
|
+
var RePopoverElement = class extends HTMLElement {
|
|
5
|
+
/** @type {{ destroy: () => void } | null} */
|
|
6
|
+
#controller = null;
|
|
7
|
+
connectedCallback() {
|
|
8
|
+
if (!this.hasAttribute("popover")) this.setAttribute("popover", "auto");
|
|
9
|
+
this.classList.add("re-popover");
|
|
10
|
+
this.setAttribute("data-re-popover", "");
|
|
11
|
+
this.#controller = enhancePopover(this);
|
|
12
|
+
}
|
|
13
|
+
disconnectedCallback() {
|
|
14
|
+
this.#controller?.destroy();
|
|
15
|
+
this.#controller = null;
|
|
16
|
+
}
|
|
17
|
+
/** @returns {boolean} */
|
|
18
|
+
get open() {
|
|
19
|
+
return this.matches?.(":popover-open") ?? false;
|
|
20
|
+
}
|
|
21
|
+
show() {
|
|
22
|
+
this.showPopover?.();
|
|
23
|
+
}
|
|
24
|
+
hide() {
|
|
25
|
+
this.hidePopover?.();
|
|
26
|
+
}
|
|
27
|
+
toggle() {
|
|
28
|
+
this.togglePopover?.();
|
|
29
|
+
}
|
|
30
|
+
};
|
|
31
|
+
if (typeof customElements !== "undefined" && !customElements.get("re-popover")) {
|
|
32
|
+
customElements.define("re-popover", RePopoverElement);
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
export { RePopoverElement };
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
declare class ReTabsElement extends HTMLElement {
|
|
2
|
+
static get observedAttributes(): string[];
|
|
3
|
+
connectedCallback(): void;
|
|
4
|
+
disconnectedCallback(): void;
|
|
5
|
+
/**
|
|
6
|
+
* @param {string} name
|
|
7
|
+
* @param {string | null} _oldValue
|
|
8
|
+
* @param {string | null} newValue
|
|
9
|
+
*/
|
|
10
|
+
attributeChangedCallback(name: string, _oldValue: string | null, newValue: string | null): void;
|
|
11
|
+
set value(id: string | null);
|
|
12
|
+
/**
|
|
13
|
+
* Currently selected tab id.
|
|
14
|
+
* @returns {string | null}
|
|
15
|
+
*/
|
|
16
|
+
get value(): string | null;
|
|
17
|
+
#private;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
export { ReTabsElement };
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
import { enhanceTabs } from '../chunk-GMICGIQW.js';
|
|
2
|
+
|
|
3
|
+
// src/elements/re-tabs.js
|
|
4
|
+
var ReTabsElement = class extends HTMLElement {
|
|
5
|
+
/** @type {{ destroy: () => void } | null} */
|
|
6
|
+
#controller = null;
|
|
7
|
+
static get observedAttributes() {
|
|
8
|
+
return ["value"];
|
|
9
|
+
}
|
|
10
|
+
connectedCallback() {
|
|
11
|
+
this.setAttribute("data-re-tabs", "");
|
|
12
|
+
this.#controller = enhanceTabs(this);
|
|
13
|
+
const initial = this.getAttribute("value");
|
|
14
|
+
if (initial) this.#selectById(initial);
|
|
15
|
+
}
|
|
16
|
+
disconnectedCallback() {
|
|
17
|
+
this.#controller?.destroy();
|
|
18
|
+
this.#controller = null;
|
|
19
|
+
}
|
|
20
|
+
/**
|
|
21
|
+
* @param {string} name
|
|
22
|
+
* @param {string | null} _oldValue
|
|
23
|
+
* @param {string | null} newValue
|
|
24
|
+
*/
|
|
25
|
+
attributeChangedCallback(name, _oldValue, newValue) {
|
|
26
|
+
if (name === "value" && newValue) {
|
|
27
|
+
this.#selectById(newValue);
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
/**
|
|
31
|
+
* Currently selected tab id.
|
|
32
|
+
* @returns {string | null}
|
|
33
|
+
*/
|
|
34
|
+
get value() {
|
|
35
|
+
const sel = this.querySelector('[role="tab"][aria-selected="true"]');
|
|
36
|
+
return sel ? sel.id : null;
|
|
37
|
+
}
|
|
38
|
+
set value(id) {
|
|
39
|
+
if (!id) return;
|
|
40
|
+
this.setAttribute("value", id);
|
|
41
|
+
this.#selectById(id);
|
|
42
|
+
}
|
|
43
|
+
/**
|
|
44
|
+
* @param {string} id
|
|
45
|
+
*/
|
|
46
|
+
#selectById(id) {
|
|
47
|
+
const tab = this.querySelector(`[role="tab"]#${cssEscape(id)}`);
|
|
48
|
+
if (tab && tab.getAttribute("aria-selected") !== "true") {
|
|
49
|
+
tab.click();
|
|
50
|
+
}
|
|
51
|
+
}
|
|
52
|
+
};
|
|
53
|
+
function cssEscape(value) {
|
|
54
|
+
return typeof CSS !== "undefined" && CSS.escape ? CSS.escape(value) : value;
|
|
55
|
+
}
|
|
56
|
+
if (typeof customElements !== "undefined" && !customElements.get("re-tabs")) {
|
|
57
|
+
customElements.define("re-tabs", ReTabsElement);
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
export { ReTabsElement };
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { showToast } from '../behaviors/toast.js';
|
|
2
|
+
|
|
3
|
+
declare class ReToastElement extends HTMLElement {
|
|
4
|
+
connectedCallback(): void;
|
|
5
|
+
/**
|
|
6
|
+
* @param {string} message
|
|
7
|
+
* @param {Parameters<typeof showToast>[1]} [options]
|
|
8
|
+
*/
|
|
9
|
+
show(message: string, options?: Parameters<typeof showToast>[1]): {
|
|
10
|
+
dismiss: () => void;
|
|
11
|
+
element: HTMLDivElement;
|
|
12
|
+
};
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
export { ReToastElement };
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { showToast } from '../chunk-PIDPGDBZ.js';
|
|
2
|
+
|
|
3
|
+
// src/elements/re-toast.js
|
|
4
|
+
var ReToastElement = class extends HTMLElement {
|
|
5
|
+
connectedCallback() {
|
|
6
|
+
if (!this.querySelector("[data-re-toast-region]")) {
|
|
7
|
+
this.classList.add("re-toast-region");
|
|
8
|
+
this.setAttribute("role", "region");
|
|
9
|
+
if (!this.hasAttribute("aria-label")) this.setAttribute("aria-label", "Notifications");
|
|
10
|
+
this.setAttribute("data-re-toast-region", "");
|
|
11
|
+
const list = document.createElement("div");
|
|
12
|
+
list.className = "re-toast-list";
|
|
13
|
+
list.setAttribute("aria-live", this.getAttribute("data-live") ?? "polite");
|
|
14
|
+
list.setAttribute("aria-relevant", "additions");
|
|
15
|
+
this.appendChild(list);
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
/**
|
|
19
|
+
* @param {string} message
|
|
20
|
+
* @param {Parameters<typeof showToast>[1]} [options]
|
|
21
|
+
*/
|
|
22
|
+
show(message, options) {
|
|
23
|
+
return showToast(message, { ...options, root: this });
|
|
24
|
+
}
|
|
25
|
+
};
|
|
26
|
+
if (typeof customElements !== "undefined" && !customElements.get("re-toast")) {
|
|
27
|
+
customElements.define("re-toast", ReToastElement);
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
export { ReToastElement };
|
package/dist/index.css
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@layer re.tokens{@layer re.tokens{:root{--re-color-neutral-0:#fff;--re-color-neutral-50:#f8fafc;--re-color-neutral-100:#f1f5f9;--re-color-neutral-200:#e2e8f0;--re-color-neutral-300:#cbd5e1;--re-color-neutral-400:#94a3b8;--re-color-neutral-500:#64748b;--re-color-neutral-600:#475569;--re-color-neutral-700:#334155;--re-color-neutral-800:#1e293b;--re-color-neutral-900:#0f172a;--re-color-neutral-950:#020617;--re-color-accent-50:#eff6ff;--re-color-accent-100:#dbeafe;--re-color-accent-200:#bfdbfe;--re-color-accent-300:#93c5fd;--re-color-accent-400:#60a5fa;--re-color-accent-500:#3b82f6;--re-color-accent-600:#2563eb;--re-color-accent-700:#1d4ed8;--re-color-accent-800:#1e40af;--re-color-accent-900:#1e3a8a;--re-color-danger-500:#ef4444;--re-color-danger-600:#dc2626;--re-color-danger-700:#b91c1c;--re-color-success-500:#10b981;--re-color-success-600:#059669;--re-color-success-700:#047857;--re-color-warning-500:#f59e0b;--re-color-warning-600:#d97706;--re-color-warning-700:#b45309;--re-color-bg:var(--re-color-neutral-0);--re-color-bg-subtle:var(--re-color-neutral-50);--re-color-bg-muted:var(--re-color-neutral-100);--re-color-surface:var(--re-color-neutral-0);--re-color-text:var(--re-color-neutral-900);--re-color-text-muted:var(--re-color-neutral-600);--re-color-text-subtle:var(--re-color-neutral-500);--re-color-text-on-accent:var(--re-color-neutral-0);--re-color-text-danger:var(--re-color-danger-700);--re-color-border:var(--re-color-neutral-200);--re-color-border-strong:var(--re-color-neutral-300);--re-color-border-danger:var(--re-color-danger-500);--re-color-link:var(--re-color-accent-700);--re-color-link-hover:var(--re-color-accent-800);--re-color-link-visited:var(--re-color-accent-800);--re-color-focus-ring:var(--re-color-accent-500);--re-color-selection-bg:var(--re-color-accent-100);--re-color-selection-text:var(--re-color-neutral-900);--re-font-sans:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;--re-font-mono:ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;--re-size-text-xs:.75rem;--re-size-text-sm:.875rem;--re-size-text-md:1rem;--re-size-text-lg:1.125rem;--re-size-text-xl:1.25rem;--re-size-text-2xl:1.5rem;--re-size-text-3xl:1.875rem;--re-size-text-4xl:2.25rem;--re-line-height-tight:1.2;--re-line-height-snug:1.35;--re-line-height-normal:1.5;--re-line-height-relaxed:1.65;--re-font-weight-regular:400;--re-font-weight-medium:500;--re-font-weight-semibold:600;--re-font-weight-bold:700;--re-space-0:0;--re-space-1:.25rem;--re-space-2:.5rem;--re-space-3:.75rem;--re-space-4:1rem;--re-space-5:1.25rem;--re-space-6:1.5rem;--re-space-8:2rem;--re-space-10:2.5rem;--re-space-12:3rem;--re-space-16:4rem;--re-radius-none:0;--re-radius-sm:.25rem;--re-radius-md:.375rem;--re-radius-lg:.5rem;--re-radius-xl:.75rem;--re-radius-pill:9999px;--re-border-width:1px;--re-border-width-strong:2px;--re-border-default:var(--re-border-width) solid var(--re-color-border);--re-border-strong:var(--re-border-width-strong) solid var(--re-color-border-strong);--re-border-danger:var(--re-border-width) solid var(--re-color-border-danger);--re-focus-ring-width:2px;--re-focus-ring-offset:2px;--re-focus-ring-color:var(--re-color-focus-ring);--re-shadow-focus:0 0 0 var(--re-focus-ring-offset) var(--re-color-bg), 0 0 0 calc(var(--re-focus-ring-offset) + var(--re-focus-ring-width)) var(--re-color-focus-ring);--re-shadow-sm:0 1px 2px #0000000f;--re-shadow-md:0 4px 12px #00000014;--re-shadow-lg:0 12px 32px #0000001f;--re-duration-instant:0s;--re-duration-fast:.12s;--re-duration-normal:.2s;--re-duration-slow:.32s;--re-easing-standard:cubic-bezier(.2, 0, 0, 1);--re-easing-emphasized:cubic-bezier(.3, 0, 0, 1);--re-z-base:0;--re-z-overlay:100;--re-z-popover:200;--re-z-dialog:300;--re-z-toast:400;--re-control-height-sm:1.75rem;--re-control-height-md:2.25rem;--re-control-height-lg:2.75rem;--re-control-padding-x:var(--re-space-3);--re-control-padding-y:var(--re-space-2)}@media (prefers-color-scheme:dark){:root{--re-color-bg:var(--re-color-neutral-950);--re-color-bg-subtle:var(--re-color-neutral-900);--re-color-bg-muted:var(--re-color-neutral-800);--re-color-surface:var(--re-color-neutral-900);--re-color-text:var(--re-color-neutral-50);--re-color-text-muted:var(--re-color-neutral-300);--re-color-text-subtle:var(--re-color-neutral-400);--re-color-text-on-accent:var(--re-color-neutral-0);--re-color-text-danger:var(--re-color-danger-500);--re-color-border:var(--re-color-neutral-700);--re-color-border-strong:var(--re-color-neutral-600);--re-color-link:var(--re-color-accent-300);--re-color-link-hover:var(--re-color-accent-200);--re-color-link-visited:var(--re-color-accent-200);--re-color-focus-ring:var(--re-color-accent-400);--re-color-selection-bg:var(--re-color-accent-900);--re-color-selection-text:var(--re-color-neutral-50);--re-focus-ring-offset:0px;--re-shadow-focus:0 0 0 2px var(--re-color-focus-ring)}}}}@layer re.reset{@layer re.reset{*,:before,:after{box-sizing:border-box}html{-moz-text-size-adjust:100%;text-size-adjust:100%;tab-size:4}body{min-height:100dvh;line-height:var(--re-line-height-normal);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0}h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd{margin:0}ul[role=list],ol[role=list]{margin:0;padding:0;list-style:none}img,picture,video,canvas,svg{max-width:100%;height:auto;display:block}input,button,textarea,select{font:inherit;color:inherit}textarea{resize:vertical}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}[hidden]{display:none!important}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}}}@layer re.base{@layer re.base{:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}html{font-family:var(--re-font-sans);font-size:var(--re-size-text-md);line-height:var(--re-line-height-normal);color:var(--re-color-text);background-color:var(--re-color-bg)}::selection{background-color:var(--re-color-selection-bg);color:var(--re-color-selection-text)}h1,h2,h3,h4,h5,h6{line-height:var(--re-line-height-tight);font-weight:var(--re-font-weight-semibold);color:var(--re-color-text)}h1{font-size:var(--re-size-text-4xl)}h2{font-size:var(--re-size-text-3xl)}h3{font-size:var(--re-size-text-2xl)}h4{font-size:var(--re-size-text-xl)}h5{font-size:var(--re-size-text-lg)}h6{font-size:var(--re-size-text-md)}p{line-height:var(--re-line-height-normal);color:var(--re-color-text)}small{font-size:var(--re-size-text-sm);color:var(--re-color-text-muted)}code,kbd,samp,pre{font-family:var(--re-font-mono);font-size:.95em}pre{padding:var(--re-space-3) var(--re-space-4);background-color:var(--re-color-bg-muted);border-radius:var(--re-radius-md);overflow:auto}code{background-color:var(--re-color-bg-muted);border-radius:var(--re-radius-sm);padding:.1em .3em}pre code{background:0 0;border-radius:0;padding:0}hr{border:0;border-top:var(--re-border-default);margin-block:var(--re-space-6)}a{color:var(--re-color-link);text-underline-offset:.2em;text-decoration-thickness:.08em}a:hover{color:var(--re-color-link-hover)}a:visited{color:var(--re-color-link-visited)}:focus-visible{box-shadow:var(--re-shadow-focus);border-radius:var(--re-radius-sm);outline:none}input,textarea,select{color:var(--re-color-text);background-color:var(--re-color-bg)}}}@layer re.components{.re-button{justify-content:center;align-items:center;gap:var(--re-space-2);box-sizing:border-box;block-size:var(--re-control-height-md);padding-inline:var(--re-space-4);font:inherit;font-weight:var(--re-font-weight-medium);font-size:var(--re-size-text-md);text-align:center;white-space:nowrap;-webkit-user-select:none;user-select:none;color:var(--re-color-text-on-accent);background-color:var(--re-color-accent-600);border:var(--re-border-width) solid transparent;border-radius:var(--re-radius-md);cursor:pointer;transition:background-color var(--re-duration-fast) var(--re-easing-standard), color var(--re-duration-fast) var(--re-easing-standard), border-color var(--re-duration-fast) var(--re-easing-standard), box-shadow var(--re-duration-fast) var(--re-easing-standard);padding-block:0;line-height:1;text-decoration:none;display:inline-flex}a.re-button{-webkit-tap-highlight-color:transparent}.re-button:hover{background-color:var(--re-color-accent-700)}.re-button:active{background-color:var(--re-color-accent-800)}.re-button:focus-visible{box-shadow:var(--re-shadow-focus);outline:none}.re-button:disabled,.re-button[aria-disabled=true]{cursor:not-allowed;opacity:.55;pointer-events:none}a.re-button[aria-disabled=true]{pointer-events:none}.re-button[data-variant=secondary]{color:var(--re-color-text);background-color:var(--re-color-bg);border-color:var(--re-color-border-strong)}.re-button[data-variant=secondary]:hover{background-color:var(--re-color-bg-subtle)}.re-button[data-variant=secondary]:active{background-color:var(--re-color-bg-muted)}.re-button[data-variant=ghost]{color:var(--re-color-text);background-color:#0000;border-color:#0000}.re-button[data-variant=ghost]:hover{background-color:var(--re-color-bg-subtle)}.re-button[data-variant=ghost]:active{background-color:var(--re-color-bg-muted)}.re-button[data-variant=danger]{color:var(--re-color-text-on-accent);background-color:var(--re-color-danger-600)}.re-button[data-variant=danger]:hover{background-color:var(--re-color-danger-700)}.re-button[data-variant=danger]:active{background-color:var(--re-color-danger-700);filter:brightness(.95)}.re-button[data-size=sm]{block-size:var(--re-control-height-sm);padding-inline:var(--re-space-3);font-size:var(--re-size-text-sm)}.re-button[data-size=lg]{block-size:var(--re-control-height-lg);padding-inline:var(--re-space-5);font-size:var(--re-size-text-lg)}.re-button[data-full-width]{inline-size:100%}.re-link{color:var(--re-color-link);text-underline-offset:.18em;border-radius:var(--re-radius-sm);transition:color var(--re-duration-fast) var(--re-easing-standard), text-decoration-color var(--re-duration-fast) var(--re-easing-standard);text-decoration-line:underline;text-decoration-color:currentColor;text-decoration-thickness:.08em}.re-link:hover{color:var(--re-color-link-hover)}.re-link:visited{color:var(--re-color-link-visited)}.re-link:focus-visible{box-shadow:var(--re-shadow-focus);outline:none}.re-link[data-variant=muted]{color:var(--re-color-text-muted);-webkit-text-decoration-color:var(--re-color-border-strong);text-decoration-color:var(--re-color-border-strong)}.re-link[data-variant=muted]:hover{color:var(--re-color-text);text-decoration-color:currentColor}.re-link[data-variant=subtle]{text-decoration-line:none}.re-link[data-variant=subtle]:hover{text-decoration-line:underline}.re-link[data-variant=external]:after{content:" ↗";speak:none}.re-input,.re-textarea,.re-select{box-sizing:border-box;inline-size:100%;min-block-size:var(--re-control-height-md);padding-inline:var(--re-control-padding-x);padding-block:var(--re-control-padding-y);font:inherit;font-size:var(--re-size-text-md);line-height:var(--re-line-height-normal);color:var(--re-color-text);background-color:var(--re-color-bg);border:var(--re-border-default);border-radius:var(--re-radius-md);appearance:none;transition:border-color var(--re-duration-fast) var(--re-easing-standard), box-shadow var(--re-duration-fast) var(--re-easing-standard), background-color var(--re-duration-fast) var(--re-easing-standard);display:block}.re-input::placeholder,.re-textarea::placeholder{color:var(--re-color-text-subtle);opacity:1}.re-input:hover,.re-textarea:hover,.re-select:hover{border-color:var(--re-color-border-strong)}.re-input:focus-visible,.re-textarea:focus-visible,.re-select:focus-visible{border-color:var(--re-color-focus-ring);box-shadow:var(--re-shadow-focus);outline:none}:is(.re-input[aria-invalid=true],.re-textarea[aria-invalid=true],.re-select[aria-invalid=true],.re-input:user-invalid,.re-textarea:user-invalid,.re-select:user-invalid){border-color:var(--re-color-border-danger)}:is(.re-input[aria-invalid=true]:focus-visible,.re-textarea[aria-invalid=true]:focus-visible,.re-select[aria-invalid=true]:focus-visible,.re-input:user-invalid:focus-visible,.re-textarea:user-invalid:focus-visible,.re-select:user-invalid:focus-visible){box-shadow:0 0 0 var(--re-focus-ring-offset) var(--re-color-bg), 0 0 0 calc(var(--re-focus-ring-offset) + var(--re-focus-ring-width)) var(--re-color-danger-500)}.re-input:disabled,.re-textarea:disabled,.re-select:disabled,.re-checkbox:disabled,.re-radio:disabled{cursor:not-allowed;background-color:var(--re-color-bg-muted);color:var(--re-color-text-subtle);opacity:.7}.re-input[data-size=sm],.re-textarea[data-size=sm],.re-select[data-size=sm]{min-block-size:var(--re-control-height-sm);font-size:var(--re-size-text-sm);padding-inline:var(--re-space-2)}.re-input[data-size=lg],.re-textarea[data-size=lg],.re-select[data-size=lg]{min-block-size:var(--re-control-height-lg);font-size:var(--re-size-text-lg);padding-inline:var(--re-space-4)}.re-textarea{min-block-size:calc(var(--re-control-height-md) * 2);resize:vertical;line-height:var(--re-line-height-relaxed)}.re-select{background-image:linear-gradient(45deg,#0000 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,#0000 50%);background-position:right var(--re-space-4) top 55%, right calc(var(--re-space-4) - 5px) top 55%;color:var(--re-color-text);background-repeat:no-repeat;background-size:5px 5px,5px 5px;padding-inline-end:var(--re-space-8)}.re-select[multiple]{min-block-size:calc(var(--re-control-height-md) * 3);background-image:none;padding-inline-end:var(--re-control-padding-x)}.re-select[multiple] option{padding-block:var(--re-space-1)}.re-checkbox,.re-radio{appearance:none;background-color:var(--re-color-bg);border:var(--re-border-width-strong) solid var(--re-color-border-strong);cursor:pointer;block-size:1.125rem;inline-size:1.125rem;color:var(--re-color-text-on-accent);transition:background-color var(--re-duration-fast) var(--re-easing-standard), border-color var(--re-duration-fast) var(--re-easing-standard), box-shadow var(--re-duration-fast) var(--re-easing-standard);flex-shrink:0;place-content:center;margin:0;padding:0;display:inline-grid}.re-checkbox{border-radius:var(--re-radius-sm)}.re-radio{border-radius:var(--re-radius-pill)}.re-checkbox:hover,.re-radio:hover{border-color:var(--re-color-accent-600)}.re-checkbox:focus-visible,.re-radio:focus-visible{box-shadow:var(--re-shadow-focus);border-color:var(--re-color-focus-ring);outline:none}.re-checkbox:checked,.re-radio:checked{background-color:var(--re-color-accent-600);border-color:var(--re-color-accent-600)}.re-checkbox:checked:before{content:"";clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0,43% 62%);background-color:currentColor;block-size:.65rem;inline-size:.65rem}.re-radio:checked:before{content:"";border-radius:var(--re-radius-pill);background-color:currentColor;block-size:.55rem;inline-size:.55rem}.re-checkbox:indeterminate{background-color:var(--re-color-accent-600);border-color:var(--re-color-accent-600)}.re-checkbox:indeterminate:before{content:"";border-radius:var(--re-radius-sm);background-color:currentColor;block-size:.18rem;inline-size:.7rem}.re-checkbox[aria-invalid=true],.re-radio[aria-invalid=true]{border-color:var(--re-color-border-danger)}.re-field{gap:var(--re-space-2);color:var(--re-color-text);flex-direction:column;display:flex}.re-field__label{font-size:var(--re-size-text-sm);font-weight:var(--re-font-weight-medium);color:var(--re-color-text);line-height:1.2}.re-field__label[data-required]:after{content:" *";color:var(--re-color-text-danger);margin-inline-start:.1em}.re-field__hint{font-size:var(--re-size-text-sm);color:var(--re-color-text-muted);line-height:var(--re-line-height-normal)}.re-field--inline{align-items:center;gap:var(--re-space-3);flex-direction:row}.re-field-group{gap:var(--re-space-2);border:0;flex-direction:column;margin:0;padding:0;display:flex}.re-field-group__legend{font-size:var(--re-size-text-sm);font-weight:var(--re-font-weight-medium);color:var(--re-color-text);padding:0;line-height:1.2}.re-field-group[data-orientation=horizontal]>.re-field-group__items{gap:var(--re-space-4);flex-flow:wrap}.re-field-group__items{gap:var(--re-space-2);flex-direction:column;display:flex}.re-validation-message{font-size:var(--re-size-text-sm);line-height:var(--re-line-height-normal);color:var(--re-color-text-danger);display:block}.re-validation-message[data-tone=success]{color:var(--re-color-success-700)}.re-validation-message[data-tone=hint]{color:var(--re-color-text-muted)}.re-validation-message[data-tone=warning]{color:var(--re-color-warning-700)}.re-disclosure{border:var(--re-border-default);border-radius:var(--re-radius-md);background-color:var(--re-color-surface);overflow:hidden}.re-disclosure__summary{cursor:pointer;padding:var(--re-space-3) var(--re-space-4);font-weight:var(--re-font-weight-medium);color:var(--re-color-text);align-items:center;gap:var(--re-space-3);-webkit-user-select:none;user-select:none;transition:background-color var(--re-duration-fast) var(--re-easing-standard);list-style:none;display:flex}.re-disclosure__summary::-webkit-details-marker{display:none}.re-disclosure__summary:before{content:"";block-size:.6rem;inline-size:.6rem;transition:transform var(--re-duration-fast) var(--re-easing-standard);border-block-end:2px solid;border-inline-end:2px solid;flex-shrink:0;margin-inline-end:var(--re-space-1);transform:rotate(-45deg)}.re-disclosure[open]>.re-disclosure__summary:before{transform:rotate(45deg)}.re-disclosure__summary:hover{background-color:var(--re-color-bg-subtle)}.re-disclosure__summary:focus-visible{box-shadow:var(--re-shadow-focus);outline:none}.re-disclosure__body{padding:var(--re-space-3) var(--re-space-4) var(--re-space-4);border-block-start:var(--re-border-default);color:var(--re-color-text);line-height:var(--re-line-height-normal)}.re-disclosure[data-variant=plain]{background:0 0;border:0}.re-disclosure[data-variant=plain]>.re-disclosure__body{border-block-start:0;padding-block-start:var(--re-space-2)}.re-dialog:not([open]){display:none}.re-dialog{box-sizing:border-box;border:var(--re-border-default);border-radius:var(--re-radius-lg);background-color:var(--re-color-surface);color:var(--re-color-text);max-block-size:min(85vh,40rem);inline-size:min(90vw,32rem);box-shadow:var(--re-shadow-lg);flex-direction:column;padding:0;display:flex;overflow:hidden}.re-dialog::backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background-color:#0006}.re-dialog:focus-visible{outline:none}.re-dialog__header{justify-content:space-between;align-items:center;gap:var(--re-space-3);padding:var(--re-space-4);border-block-end:var(--re-border-default);display:flex}.re-dialog__title{font-size:var(--re-size-text-lg);font-weight:var(--re-font-weight-semibold);line-height:var(--re-line-height-tight);color:var(--re-color-text);margin:0}.re-dialog__close{appearance:none;cursor:pointer;padding:var(--re-space-1) var(--re-space-2);border-radius:var(--re-radius-md);color:var(--re-color-text-muted);font:inherit;font-size:var(--re-size-text-xl);transition:background-color var(--re-duration-fast) var(--re-easing-standard);background:0 0;border:0;line-height:1}.re-dialog__close:hover{background-color:var(--re-color-bg-subtle);color:var(--re-color-text)}.re-dialog__close:focus-visible{box-shadow:var(--re-shadow-focus);outline:none}.re-dialog__body{padding:var(--re-space-4);line-height:var(--re-line-height-normal);overflow-y:auto}.re-dialog__footer{justify-content:flex-end;gap:var(--re-space-3);padding:var(--re-space-4);border-block-start:var(--re-border-default);background-color:var(--re-color-bg-subtle);display:flex}.re-progress,.re-meter{appearance:none;border-radius:var(--re-radius-pill);background-color:var(--re-color-bg-muted);block-size:.5rem;inline-size:100%;color:var(--re-color-accent-600);border:0;overflow:hidden}.re-progress::-webkit-progress-bar{background-color:var(--re-color-bg-muted);border-radius:var(--re-radius-pill)}.re-progress::-webkit-progress-value{background-color:var(--re-color-accent-600);border-radius:var(--re-radius-pill);transition:inline-size var(--re-duration-normal) var(--re-easing-standard)}.re-progress::-moz-progress-bar{background-color:var(--re-color-accent-600);border-radius:var(--re-radius-pill)}.re-progress:indeterminate{background:linear-gradient(90deg, transparent 0%, var(--re-color-accent-300) 50%, transparent 100%) no-repeat, var(--re-color-bg-muted);background-size:40% 100%,100% 100%;animation:1.2s linear infinite re-progress-indeterminate}@keyframes re-progress-indeterminate{0%{background-position:-40% 0,0 0}to{background-position:140% 0,0 0}}@media (prefers-reduced-motion:reduce){.re-progress:indeterminate{animation-duration:.01ms}}.re-meter::-webkit-meter-bar{background-color:var(--re-color-bg-muted);border-radius:var(--re-radius-pill);border:0}.re-meter::-webkit-meter-optimum-value{background-color:var(--re-color-success-600);border-radius:var(--re-radius-pill)}.re-meter::-webkit-meter-suboptimum-value{background-color:var(--re-color-warning-600);border-radius:var(--re-radius-pill)}.re-meter::-webkit-meter-even-less-good-value{background-color:var(--re-color-danger-600);border-radius:var(--re-radius-pill)}.re-meter::-moz-meter-bar{background-color:var(--re-color-success-600);border-radius:var(--re-radius-pill)}.re-meter:-moz-meter-sub-optimum::-moz-meter-bar{background-color:var(--re-color-warning-600)}.re-meter:-moz-meter-sub-sub-optimum::-moz-meter-bar{background-color:var(--re-color-danger-600)}.re-progress[data-size=sm],.re-meter[data-size=sm]{block-size:.25rem}.re-progress[data-size=lg],.re-meter[data-size=lg]{block-size:.75rem}.re-tabs{gap:var(--re-space-4);flex-direction:column;display:flex}.re-tabs__list{gap:var(--re-space-1);border-block-end:var(--re-border-default);flex-wrap:wrap;padding-block-end:0;display:flex}.re-tab{appearance:none;cursor:pointer;font:inherit;color:var(--re-color-text-muted);padding:var(--re-space-2) var(--re-space-4);border-radius:var(--re-radius-md) var(--re-radius-md) 0 0;line-height:1.4;font-weight:var(--re-font-weight-medium);transition:color var(--re-duration-fast) var(--re-easing-standard), background-color var(--re-duration-fast) var(--re-easing-standard);background:0 0;border:0;position:relative}.re-tab:hover{color:var(--re-color-text);background-color:var(--re-color-bg-subtle)}.re-tab:focus-visible{box-shadow:var(--re-shadow-focus);outline:none}.re-tab[aria-selected=true]{color:var(--re-color-text);background-color:var(--re-color-bg)}.re-tab[aria-selected=true]:after{content:"";inset-inline:var(--re-space-2);background-color:var(--re-color-accent-600);border-radius:var(--re-radius-sm);block-size:2px;position:absolute;inset-block-end:calc(var(--re-border-width) * -1)}.re-tabpanel{color:var(--re-color-text);line-height:var(--re-line-height-normal)}.re-tabpanel:focus-visible{box-shadow:var(--re-shadow-focus);border-radius:var(--re-radius-md);outline:none}.re-menu{display:inline-block;position:relative}.re-menu__panel{background-color:var(--re-color-surface);border:var(--re-border-default);border-radius:var(--re-radius-md);min-inline-size:12rem;box-shadow:var(--re-shadow-md);padding:var(--re-space-1);z-index:var(--re-z-popover);flex-direction:column;gap:1px;display:flex;position:absolute;inset-block-start:calc(100% + var(--re-space-1));inset-inline-start:0}.re-menu__item{appearance:none;cursor:pointer;font:inherit;text-align:start;padding:var(--re-space-2) var(--re-space-3);border-radius:var(--re-radius-sm);color:var(--re-color-text);line-height:var(--re-line-height-normal);background:0 0;border:0}.re-menu__item:hover{background-color:var(--re-color-bg-muted);outline:none}.re-menu__item:focus-visible{background-color:var(--re-color-bg-muted);box-shadow:inset 0 0 0 2px var(--re-color-focus-ring);outline:none}.re-menu__item[aria-disabled=true],.re-menu__item:disabled{color:var(--re-color-text-subtle);cursor:not-allowed}.re-menu__separator{background-color:var(--re-color-border);block-size:1px;margin-block:var(--re-space-1)}.re-popover{border:var(--re-border-default);border-radius:var(--re-radius-md);background-color:var(--re-color-surface);color:var(--re-color-text);padding:var(--re-space-3) var(--re-space-4);box-shadow:var(--re-shadow-md);max-inline-size:22rem;line-height:var(--re-line-height-normal);margin:0;inset:auto}.re-popover:popover-open{margin:0}.re-popover[data-tone=info]{background-color:color-mix(in srgb, var(--re-color-accent-500) 12%, var(--re-color-surface));border-color:var(--re-color-accent-500)}.re-popover[data-tone=warning]{background-color:color-mix(in srgb, var(--re-color-warning-500) 12%, var(--re-color-surface));border-color:var(--re-color-warning-500)}.re-popover[data-tone=danger]{background-color:color-mix(in srgb, var(--re-color-danger-500) 12%, var(--re-color-surface));border-color:var(--re-color-danger-500)}.re-toast-region{z-index:var(--re-z-toast);pointer-events:none;position:fixed;inset-block-end:var(--re-space-6);inset-inline-end:var(--re-space-6)}.re-toast-list{gap:var(--re-space-2);flex-direction:column-reverse;min-inline-size:16rem;max-inline-size:24rem;margin:0;padding:0;display:flex}.re-toast{pointer-events:auto;gap:var(--re-space-3);padding:var(--re-space-3) var(--re-space-4);background-color:var(--re-color-surface);color:var(--re-color-text);border:var(--re-border-default);border-radius:var(--re-radius-md);box-shadow:var(--re-shadow-md);line-height:var(--re-line-height-normal);align-items:flex-start;display:flex}.re-toast__body{flex:auto}.re-toast__dismiss{appearance:none;cursor:pointer;color:var(--re-color-text-muted);font:inherit;font-size:var(--re-size-text-lg);padding:0 var(--re-space-1);border-radius:var(--re-radius-sm);background:0 0;border:0;line-height:1}.re-toast__dismiss:hover{color:var(--re-color-text);background:var(--re-color-bg-subtle)}.re-toast__dismiss:focus-visible{box-shadow:var(--re-shadow-focus);outline:none}.re-toast[data-tone=success]{background-color:color-mix(in srgb, var(--re-color-success-600) 12%, var(--re-color-surface));border-color:var(--re-color-success-600);color:var(--re-color-text)}.re-toast[data-tone=danger]{background-color:color-mix(in srgb, var(--re-color-danger-600) 12%, var(--re-color-surface));border-color:var(--re-color-danger-600);color:var(--re-color-text)}.re-toast[data-tone=warning]{background-color:color-mix(in srgb, var(--re-color-warning-600) 12%, var(--re-color-surface));border-color:var(--re-color-warning-600);color:var(--re-color-text)}}
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
export { enhanceDismissible } from './behaviors/dismissible.js';
|
|
2
|
+
export { enhanceDialog } from './behaviors/dialog.js';
|
|
3
|
+
export { enhanceTabs } from './behaviors/tabs.js';
|
|
4
|
+
export { enhanceMenuButton } from './behaviors/menu-button.js';
|
|
5
|
+
export { enhancePopover } from './behaviors/popover.js';
|
|
6
|
+
export { showToast } from './behaviors/toast.js';
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
export { enhanceDismissible } from './chunk-TC4TFP7Y.js';
|
|
2
|
+
export { enhanceDialog } from './chunk-J4EGUBPP.js';
|
|
3
|
+
export { enhanceMenuButton } from './chunk-ZHRJNWMH.js';
|
|
4
|
+
export { enhancePopover } from './chunk-PSODVT3V.js';
|
|
5
|
+
export { showToast } from './chunk-PIDPGDBZ.js';
|
|
6
|
+
export { enhanceTabs } from './chunk-GMICGIQW.js';
|
package/dist/reset.css
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@layer re.reset{*,:before,:after{box-sizing:border-box}html{-moz-text-size-adjust:100%;text-size-adjust:100%;tab-size:4}body{min-height:100dvh;line-height:var(--re-line-height-normal);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0}h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd{margin:0}ul[role=list],ol[role=list]{margin:0;padding:0;list-style:none}img,picture,video,canvas,svg{max-width:100%;height:auto;display:block}input,button,textarea,select{font:inherit;color:inherit}textarea{resize:vertical}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}[hidden]{display:none!important}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
:root{--lightningcss-light: ;--lightningcss-dark:initial;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--re-color-bg:#0f131a;--re-color-bg-subtle:#171c26;--re-color-bg-muted:#1f2430;--re-color-surface:#171c26;--re-color-text:#f8fafc;--re-color-text-muted:#97a3b4;--re-color-text-subtle:#6b7a90;--re-color-border:#29303d;--re-color-border-strong:#353d4d;--re-color-accent-50:#eff6ff;--re-color-accent-100:#dbeafe;--re-color-accent-200:#bdd6fe;--re-color-accent-300:#93c3fd;--re-color-accent-400:#60a5fa;--re-color-accent-500:#60a5fa;--re-color-accent-600:#3c83f6;--re-color-accent-700:#2563eb;--re-color-accent-800:#1d4ed8;--re-color-accent-900:#1e3a8a;--re-color-link:#3c83f6;--re-color-link-hover:#60a5fa;--re-color-link-visited:#a78bfa;--re-color-focus-ring:#3c83f6;--re-color-text-on-accent:#0f131a;--re-color-success-500:#2fe9d0;--re-color-success-600:#0fd4bb;--re-color-success-700:#0ab8a2;--re-color-warning-500:#f9cf53;--re-color-warning-600:#f0b929;--re-color-warning-700:#d4a020;--re-color-danger-500:#ef4444;--re-color-danger-600:#dc2626;--re-color-danger-700:#b91c1c;--re-focus-ring-offset:0px;--re-shadow-focus:0 0 0 2px var(--re-color-focus-ring);--re-color-selection-bg:#3c83f64d;--re-color-selection-text:#f8fafc;--re-color-text-danger:#f87171;--re-color-border-danger:#ef4444;--re-color-phoenix:#f3753f;--re-color-phoenix-light:#f9a07a;--re-color-phoenix-dark:#d45a26;--re-color-purple:#a855f7;--re-color-purple-light:#c084fc;--re-color-purple-dark:#7c3aed;--re-gradient-brand:linear-gradient(135deg, #3c83f6, #a855f7);--re-gradient-phoenix:linear-gradient(135deg, #f3753f, #f9cf53);--re-gradient-hero:linear-gradient(135deg, #3c83f6 0%, #a855f7 50%, #f3753f 100%)}.theme-renascent{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--re-color-bg:#0f131a;--re-color-bg-subtle:#171c26;--re-color-bg-muted:#1f2430;--re-color-surface:#171c26;--re-color-text:#f8fafc;--re-color-text-muted:#97a3b4;--re-color-text-subtle:#6b7a90;--re-color-border:#29303d;--re-color-border-strong:#353d4d;--re-color-accent-500:#3c83f6;--re-color-accent-600:#2563eb;--re-color-accent-700:#1d4ed8;--re-color-link:#3c83f6;--re-color-link-hover:#60a5fa;--re-color-focus-ring:#3c83f6;--re-color-text-on-accent:#0f131a;--re-color-text-danger:#f87171;--re-color-border-danger:#ef4444;--re-color-success-500:#2fe9d0;--re-color-success-600:#0fd4bb;--re-color-success-700:#0ab8a2;--re-color-warning-500:#f9cf53;--re-color-warning-600:#f0b929;--re-color-warning-700:#d4a020;--re-color-danger-500:#ef4444;--re-color-danger-600:#dc2626;--re-color-danger-700:#b91c1c;--re-focus-ring-offset:0px;--re-shadow-focus:0 0 0 2px var(--re-color-focus-ring);--re-color-selection-bg:#3c83f64d;--re-color-selection-text:#f8fafc;background-color:var(--re-color-bg);color:var(--re-color-text)}.re-button[data-variant=phoenix]{background:var(--re-gradient-phoenix);color:#fff;border-color:#0000}.re-button[data-variant=phoenix]:hover{filter:brightness(1.12);background:var(--re-gradient-phoenix)}.re-button[data-variant=phoenix]:active{filter:brightness(.9)}.re-button[data-variant=phoenix]:focus-visible{border-color:#0000}.re-button[data-variant=phoenix]:disabled,.re-button[data-variant=phoenix][aria-disabled=true]{filter:none;opacity:.55}.re-button[data-variant=brand]{background:var(--re-gradient-brand);color:#fff;border-color:#0000}.re-button[data-variant=brand]:hover{filter:brightness(1.12);background:var(--re-gradient-brand)}.re-button[data-variant=brand]:active{filter:brightness(.9)}.re-button[data-variant=brand]:focus-visible{border-color:#0000}.re-button[data-variant=brand]:disabled,.re-button[data-variant=brand][aria-disabled=true]{filter:none;opacity:.55}
|
package/dist/tokens.css
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@layer re.tokens{:root{--re-color-neutral-0:#fff;--re-color-neutral-50:#f8fafc;--re-color-neutral-100:#f1f5f9;--re-color-neutral-200:#e2e8f0;--re-color-neutral-300:#cbd5e1;--re-color-neutral-400:#94a3b8;--re-color-neutral-500:#64748b;--re-color-neutral-600:#475569;--re-color-neutral-700:#334155;--re-color-neutral-800:#1e293b;--re-color-neutral-900:#0f172a;--re-color-neutral-950:#020617;--re-color-accent-50:#eff6ff;--re-color-accent-100:#dbeafe;--re-color-accent-200:#bfdbfe;--re-color-accent-300:#93c5fd;--re-color-accent-400:#60a5fa;--re-color-accent-500:#3b82f6;--re-color-accent-600:#2563eb;--re-color-accent-700:#1d4ed8;--re-color-accent-800:#1e40af;--re-color-accent-900:#1e3a8a;--re-color-danger-500:#ef4444;--re-color-danger-600:#dc2626;--re-color-danger-700:#b91c1c;--re-color-success-500:#10b981;--re-color-success-600:#059669;--re-color-success-700:#047857;--re-color-warning-500:#f59e0b;--re-color-warning-600:#d97706;--re-color-warning-700:#b45309;--re-color-bg:var(--re-color-neutral-0);--re-color-bg-subtle:var(--re-color-neutral-50);--re-color-bg-muted:var(--re-color-neutral-100);--re-color-surface:var(--re-color-neutral-0);--re-color-text:var(--re-color-neutral-900);--re-color-text-muted:var(--re-color-neutral-600);--re-color-text-subtle:var(--re-color-neutral-500);--re-color-text-on-accent:var(--re-color-neutral-0);--re-color-text-danger:var(--re-color-danger-700);--re-color-border:var(--re-color-neutral-200);--re-color-border-strong:var(--re-color-neutral-300);--re-color-border-danger:var(--re-color-danger-500);--re-color-link:var(--re-color-accent-700);--re-color-link-hover:var(--re-color-accent-800);--re-color-link-visited:var(--re-color-accent-800);--re-color-focus-ring:var(--re-color-accent-500);--re-color-selection-bg:var(--re-color-accent-100);--re-color-selection-text:var(--re-color-neutral-900);--re-font-sans:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;--re-font-mono:ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;--re-size-text-xs:.75rem;--re-size-text-sm:.875rem;--re-size-text-md:1rem;--re-size-text-lg:1.125rem;--re-size-text-xl:1.25rem;--re-size-text-2xl:1.5rem;--re-size-text-3xl:1.875rem;--re-size-text-4xl:2.25rem;--re-line-height-tight:1.2;--re-line-height-snug:1.35;--re-line-height-normal:1.5;--re-line-height-relaxed:1.65;--re-font-weight-regular:400;--re-font-weight-medium:500;--re-font-weight-semibold:600;--re-font-weight-bold:700;--re-space-0:0;--re-space-1:.25rem;--re-space-2:.5rem;--re-space-3:.75rem;--re-space-4:1rem;--re-space-5:1.25rem;--re-space-6:1.5rem;--re-space-8:2rem;--re-space-10:2.5rem;--re-space-12:3rem;--re-space-16:4rem;--re-radius-none:0;--re-radius-sm:.25rem;--re-radius-md:.375rem;--re-radius-lg:.5rem;--re-radius-xl:.75rem;--re-radius-pill:9999px;--re-border-width:1px;--re-border-width-strong:2px;--re-border-default:var(--re-border-width) solid var(--re-color-border);--re-border-strong:var(--re-border-width-strong) solid var(--re-color-border-strong);--re-border-danger:var(--re-border-width) solid var(--re-color-border-danger);--re-focus-ring-width:2px;--re-focus-ring-offset:2px;--re-focus-ring-color:var(--re-color-focus-ring);--re-shadow-focus:0 0 0 var(--re-focus-ring-offset) var(--re-color-bg), 0 0 0 calc(var(--re-focus-ring-offset) + var(--re-focus-ring-width)) var(--re-color-focus-ring);--re-shadow-sm:0 1px 2px #0000000f;--re-shadow-md:0 4px 12px #00000014;--re-shadow-lg:0 12px 32px #0000001f;--re-duration-instant:0s;--re-duration-fast:.12s;--re-duration-normal:.2s;--re-duration-slow:.32s;--re-easing-standard:cubic-bezier(.2, 0, 0, 1);--re-easing-emphasized:cubic-bezier(.3, 0, 0, 1);--re-z-base:0;--re-z-overlay:100;--re-z-popover:200;--re-z-dialog:300;--re-z-toast:400;--re-control-height-sm:1.75rem;--re-control-height-md:2.25rem;--re-control-height-lg:2.75rem;--re-control-padding-x:var(--re-space-3);--re-control-padding-y:var(--re-space-2)}@media (prefers-color-scheme:dark){:root{--re-color-bg:var(--re-color-neutral-950);--re-color-bg-subtle:var(--re-color-neutral-900);--re-color-bg-muted:var(--re-color-neutral-800);--re-color-surface:var(--re-color-neutral-900);--re-color-text:var(--re-color-neutral-50);--re-color-text-muted:var(--re-color-neutral-300);--re-color-text-subtle:var(--re-color-neutral-400);--re-color-text-on-accent:var(--re-color-neutral-0);--re-color-text-danger:var(--re-color-danger-500);--re-color-border:var(--re-color-neutral-700);--re-color-border-strong:var(--re-color-neutral-600);--re-color-link:var(--re-color-accent-300);--re-color-link-hover:var(--re-color-accent-200);--re-color-link-visited:var(--re-color-accent-200);--re-color-focus-ring:var(--re-color-accent-400);--re-color-selection-bg:var(--re-color-accent-900);--re-color-selection-text:var(--re-color-neutral-50);--re-focus-ring-offset:0px;--re-shadow-focus:0 0 0 2px var(--re-color-focus-ring)}}}
|