@sekiui/elements 0.0.27 → 0.0.29
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/cjs/{index-B1pILoQg.js → index-dzrwTIbP.js} +96 -2
- package/dist/cjs/index.cjs.js +84 -0
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/seki-button.cjs.entry.js +2 -2
- package/dist/cjs/seki-input.cjs.entry.js +2 -2
- package/dist/cjs/seki-skeleton.cjs.entry.js +3 -3
- package/dist/cjs/seki-switch.cjs.entry.js +8 -0
- package/dist/cjs/sekiui.cjs.js +2 -2
- package/dist/collection/collection-manifest.json +1 -0
- package/dist/collection/components/button/seki-button.js +1 -1
- package/dist/collection/components/input/seki-input.js +1 -1
- package/dist/collection/components/skeleton/seki-skeleton.css +1 -1
- package/dist/collection/components/skeleton/seki-skeleton.js +1 -1
- package/dist/collection/components/switch/seki-switch.css +94 -0
- package/dist/collection/components/switch/seki-switch.js +294 -0
- package/dist/collection/index.js +1 -1
- package/dist/components/index.js +104 -1185
- package/dist/components/p--oknAIA5.js +1274 -0
- package/dist/components/seki-button.js +2 -2
- package/dist/components/seki-input.js +2 -2
- package/dist/components/seki-skeleton.js +3 -3
- package/dist/components/seki-switch.d.ts +11 -0
- package/dist/components/seki-switch.js +6 -0
- package/dist/esm/{index-CLC2YwJ6.js → index-F_LoNrhC.js} +96 -3
- package/dist/esm/index.js +83 -0
- package/dist/esm/loader.js +3 -3
- package/dist/esm/seki-button.entry.js +2 -2
- package/dist/esm/seki-input.entry.js +2 -2
- package/dist/esm/seki-skeleton.entry.js +3 -3
- package/dist/esm/seki-switch.entry.js +2 -0
- package/dist/esm/sekiui.js +3 -3
- package/dist/sekiui/index.esm.js +1 -0
- package/dist/sekiui/{p-6573bc92.entry.js → p-23858479.entry.js} +1 -1
- package/dist/sekiui/p-3a4a98f8.entry.js +1 -0
- package/dist/sekiui/p-F_LoNrhC.js +2 -0
- package/dist/sekiui/{p-6bb2c486.entry.js → p-a22c9d08.entry.js} +1 -1
- package/dist/sekiui/{p-10c9b8b2.entry.js → p-b0298d88.entry.js} +1 -1
- package/dist/sekiui/sekiui.esm.js +1 -1
- package/dist/types/components/switch/seki-switch.d.ts +71 -0
- package/dist/types/components.d.ts +128 -0
- package/dist/types/index.d.ts +1 -0
- package/package.json +1 -1
- package/dist/sekiui/p-CLC2YwJ6.js +0 -2
|
@@ -93,6 +93,23 @@ var plt = {
|
|
|
93
93
|
rel: (el, eventName, listener, opts) => el.removeEventListener(eventName, listener, opts),
|
|
94
94
|
ce: (eventName, opts) => new CustomEvent(eventName, opts)
|
|
95
95
|
};
|
|
96
|
+
var supportsListenerOptions = /* @__PURE__ */ (() => {
|
|
97
|
+
var _a;
|
|
98
|
+
let supportsListenerOptions2 = false;
|
|
99
|
+
try {
|
|
100
|
+
(_a = win.document) == null ? void 0 : _a.addEventListener(
|
|
101
|
+
"e",
|
|
102
|
+
null,
|
|
103
|
+
Object.defineProperty({}, "passive", {
|
|
104
|
+
get() {
|
|
105
|
+
supportsListenerOptions2 = true;
|
|
106
|
+
}
|
|
107
|
+
})
|
|
108
|
+
);
|
|
109
|
+
} catch (e) {
|
|
110
|
+
}
|
|
111
|
+
return supportsListenerOptions2;
|
|
112
|
+
})();
|
|
96
113
|
var promiseResolve = (v) => Promise.resolve(v);
|
|
97
114
|
var supportsConstructableStylesheets = /* @__PURE__ */ (() => {
|
|
98
115
|
try {
|
|
@@ -471,6 +488,27 @@ var setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags, initialRen
|
|
|
471
488
|
classList.remove(...oldClasses.filter((c) => c && !newClasses.includes(c)));
|
|
472
489
|
classList.add(...newClasses.filter((c) => c && !oldClasses.includes(c)));
|
|
473
490
|
}
|
|
491
|
+
} else if (memberName === "style") {
|
|
492
|
+
{
|
|
493
|
+
for (const prop in oldValue) {
|
|
494
|
+
if (!newValue || newValue[prop] == null) {
|
|
495
|
+
if (prop.includes("-")) {
|
|
496
|
+
elm.style.removeProperty(prop);
|
|
497
|
+
} else {
|
|
498
|
+
elm.style[prop] = "";
|
|
499
|
+
}
|
|
500
|
+
}
|
|
501
|
+
}
|
|
502
|
+
}
|
|
503
|
+
for (const prop in newValue) {
|
|
504
|
+
if (!oldValue || newValue[prop] !== oldValue[prop]) {
|
|
505
|
+
if (prop.includes("-")) {
|
|
506
|
+
elm.style.setProperty(prop, newValue[prop]);
|
|
507
|
+
} else {
|
|
508
|
+
elm.style[prop] = newValue[prop];
|
|
509
|
+
}
|
|
510
|
+
}
|
|
511
|
+
}
|
|
474
512
|
} else if (memberName === "key") ; else if ((!isProp ) && memberName[0] === "o" && memberName[1] === "n") {
|
|
475
513
|
if (memberName[2] === "-") {
|
|
476
514
|
memberName = memberName.slice(3);
|
|
@@ -581,7 +619,9 @@ var createElm = (oldParentVNode, newParentVNode, childIndex) => {
|
|
|
581
619
|
let i2 = 0;
|
|
582
620
|
let elm;
|
|
583
621
|
let childNode;
|
|
584
|
-
{
|
|
622
|
+
if (newVNode2.$text$ !== null) {
|
|
623
|
+
elm = newVNode2.$elm$ = win.document.createTextNode(newVNode2.$text$);
|
|
624
|
+
} else {
|
|
585
625
|
if (!win.document) {
|
|
586
626
|
throw new Error(
|
|
587
627
|
"You are trying to render a Stencil component in an environment that doesn't support the DOM. Make sure to populate the [`window`](https://developer.mozilla.org/en-US/docs/Web/API/Window/window) object before rendering a component."
|
|
@@ -732,13 +772,17 @@ var patch = (oldVNode, newVNode2, isInitialRender = false) => {
|
|
|
732
772
|
const elm = newVNode2.$elm$ = oldVNode.$elm$;
|
|
733
773
|
const oldChildren = oldVNode.$children$;
|
|
734
774
|
const newChildren = newVNode2.$children$;
|
|
735
|
-
|
|
775
|
+
const text = newVNode2.$text$;
|
|
776
|
+
if (text === null) {
|
|
736
777
|
{
|
|
737
778
|
updateElement(oldVNode, newVNode2, isSvgMode);
|
|
738
779
|
}
|
|
739
780
|
if (oldChildren !== null && newChildren !== null) {
|
|
740
781
|
updateChildren(elm, oldChildren, newVNode2, newChildren, isInitialRender);
|
|
741
782
|
} else if (newChildren !== null) {
|
|
783
|
+
if (oldVNode.$text$ !== null) {
|
|
784
|
+
elm.textContent = "";
|
|
785
|
+
}
|
|
742
786
|
addVnodes(elm, null, newVNode2, newChildren, 0, newChildren.length - 1);
|
|
743
787
|
} else if (
|
|
744
788
|
// don't do this on initial render as it can cause non-hydrated content to be removed
|
|
@@ -746,6 +790,8 @@ var patch = (oldVNode, newVNode2, isInitialRender = false) => {
|
|
|
746
790
|
) {
|
|
747
791
|
removeVnodes(oldChildren, 0, oldChildren.length - 1);
|
|
748
792
|
} else ;
|
|
793
|
+
} else if (oldVNode.$text$ !== text) {
|
|
794
|
+
elm.data = text;
|
|
749
795
|
}
|
|
750
796
|
};
|
|
751
797
|
var insertBefore = (parent, newNode, reference) => {
|
|
@@ -825,6 +871,13 @@ var dispatchHooks = (hostRef, isInitialLoad) => {
|
|
|
825
871
|
let maybePromise;
|
|
826
872
|
if (isInitialLoad) {
|
|
827
873
|
{
|
|
874
|
+
{
|
|
875
|
+
hostRef.$flags$ |= 256 /* isListenReady */;
|
|
876
|
+
if (hostRef.$queuedListeners$) {
|
|
877
|
+
hostRef.$queuedListeners$.map(([methodName, event]) => safeCall(instance, methodName, event, elm));
|
|
878
|
+
hostRef.$queuedListeners$ = void 0;
|
|
879
|
+
}
|
|
880
|
+
}
|
|
828
881
|
if (hostRef.$fetchedCbList$.length) {
|
|
829
882
|
hostRef.$fetchedCbList$.forEach((cb) => cb(elm));
|
|
830
883
|
}
|
|
@@ -1217,6 +1270,7 @@ var connectedCallback = (elm) => {
|
|
|
1217
1270
|
initializeComponent(elm, hostRef, cmpMeta);
|
|
1218
1271
|
}
|
|
1219
1272
|
} else {
|
|
1273
|
+
addHostEventListeners(elm, hostRef, cmpMeta.$listeners$);
|
|
1220
1274
|
if (hostRef == null ? void 0 : hostRef.$lazyInstance$) {
|
|
1221
1275
|
fireConnectedCallback(hostRef.$lazyInstance$, elm);
|
|
1222
1276
|
} else if (hostRef == null ? void 0 : hostRef.$onReadyPromise$) {
|
|
@@ -1234,6 +1288,12 @@ var disconnectInstance = (instance, elm) => {
|
|
|
1234
1288
|
var disconnectedCallback = async (elm) => {
|
|
1235
1289
|
if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) {
|
|
1236
1290
|
const hostRef = getHostRef(elm);
|
|
1291
|
+
{
|
|
1292
|
+
if (hostRef == null ? void 0 : hostRef.$rmListeners$) {
|
|
1293
|
+
hostRef.$rmListeners$.map((rmListener) => rmListener());
|
|
1294
|
+
hostRef.$rmListeners$ = void 0;
|
|
1295
|
+
}
|
|
1296
|
+
}
|
|
1237
1297
|
if (hostRef == null ? void 0 : hostRef.$lazyInstance$) {
|
|
1238
1298
|
disconnectInstance(hostRef.$lazyInstance$, elm);
|
|
1239
1299
|
} else if (hostRef == null ? void 0 : hostRef.$onReadyPromise$) {
|
|
@@ -1282,6 +1342,9 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
|
|
|
1282
1342
|
{
|
|
1283
1343
|
cmpMeta.$members$ = compactMeta[2];
|
|
1284
1344
|
}
|
|
1345
|
+
{
|
|
1346
|
+
cmpMeta.$listeners$ = compactMeta[3];
|
|
1347
|
+
}
|
|
1285
1348
|
{
|
|
1286
1349
|
cmpMeta.$attrsToReflect$ = [];
|
|
1287
1350
|
}
|
|
@@ -1314,6 +1377,7 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
|
|
|
1314
1377
|
}
|
|
1315
1378
|
if (!this.hasRegisteredEventListeners) {
|
|
1316
1379
|
this.hasRegisteredEventListeners = true;
|
|
1380
|
+
addHostEventListeners(this, hostRef, cmpMeta.$listeners$);
|
|
1317
1381
|
}
|
|
1318
1382
|
if (appLoadFallback) {
|
|
1319
1383
|
clearTimeout(appLoadFallback);
|
|
@@ -1383,10 +1447,40 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
|
|
|
1383
1447
|
}
|
|
1384
1448
|
endBootstrap();
|
|
1385
1449
|
};
|
|
1450
|
+
var addHostEventListeners = (elm, hostRef, listeners, attachParentListeners) => {
|
|
1451
|
+
if (listeners && win.document) {
|
|
1452
|
+
listeners.map(([flags, name, method]) => {
|
|
1453
|
+
const target = elm;
|
|
1454
|
+
const handler = hostListenerProxy(hostRef, method);
|
|
1455
|
+
const opts = hostListenerOpts(flags);
|
|
1456
|
+
plt.ael(target, name, handler, opts);
|
|
1457
|
+
(hostRef.$rmListeners$ = hostRef.$rmListeners$ || []).push(() => plt.rel(target, name, handler, opts));
|
|
1458
|
+
});
|
|
1459
|
+
}
|
|
1460
|
+
};
|
|
1461
|
+
var hostListenerProxy = (hostRef, methodName) => (ev) => {
|
|
1462
|
+
var _a;
|
|
1463
|
+
try {
|
|
1464
|
+
{
|
|
1465
|
+
if (hostRef.$flags$ & 256 /* isListenReady */) {
|
|
1466
|
+
(_a = hostRef.$lazyInstance$) == null ? void 0 : _a[methodName](ev);
|
|
1467
|
+
} else {
|
|
1468
|
+
(hostRef.$queuedListeners$ = hostRef.$queuedListeners$ || []).push([methodName, ev]);
|
|
1469
|
+
}
|
|
1470
|
+
}
|
|
1471
|
+
} catch (e) {
|
|
1472
|
+
consoleError(e, hostRef.$hostElement$);
|
|
1473
|
+
}
|
|
1474
|
+
};
|
|
1475
|
+
var hostListenerOpts = (flags) => supportsListenerOptions ? {
|
|
1476
|
+
passive: (flags & 1 /* Passive */) !== 0,
|
|
1477
|
+
capture: (flags & 2 /* Capture */) !== 0
|
|
1478
|
+
} : (flags & 2 /* Capture */) !== 0;
|
|
1386
1479
|
|
|
1387
1480
|
// src/runtime/nonce.ts
|
|
1388
1481
|
var setNonce = (nonce) => plt.$nonce$ = nonce;
|
|
1389
1482
|
|
|
1483
|
+
exports.Host = Host;
|
|
1390
1484
|
exports.bootstrapLazy = bootstrapLazy;
|
|
1391
1485
|
exports.createEvent = createEvent;
|
|
1392
1486
|
exports.h = h;
|
package/dist/cjs/index.cjs.js
CHANGED
|
@@ -1,2 +1,86 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
var index = require('./index-dzrwTIbP.js');
|
|
4
|
+
|
|
5
|
+
const sekiSwitchCss = ":host{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px}.switch{width:var(--seki-switch-width, 2.75rem);height:var(--seki-switch-height, 1.5rem);position:relative;display:inline-flex;align-items:center;flex-shrink:0;background-color:var(--seki-switch-bg-unchecked, hsl(var(--muted, 240 4.8% 95.9%)));border-radius:9999px;cursor:pointer;transition:background-color var(--seki-switch-transition-duration, 150ms) ease-out;outline:none}.switch:focus-visible{outline:2px solid var(--seki-switch-focus-ring, hsl(var(--ring, 240 5% 64.9%)));outline-offset:2px}:host([data-state=\"checked\"]) .switch{background-color:var(--seki-switch-bg-checked, hsl(var(--primary, 240 5.9% 10%)))}:host([data-disabled]) .switch{background-color:var(--seki-switch-bg-disabled, hsl(var(--muted, 240 4.8% 95.9%) / 0.5));cursor:not-allowed;opacity:0.5}.thumb{width:var(--seki-switch-thumb-size, 1.25rem);height:var(--seki-switch-thumb-size, 1.25rem);background-color:var(--seki-switch-thumb-bg, hsl(var(--background, 0 0% 100%)));position:absolute;left:0.125rem;border-radius:50%;box-shadow:0 1px 2px 0 rgb(0 0 0 / 0.05);transition:transform var(--seki-switch-transition-duration, 150ms) ease-out;pointer-events:none}:host([data-state=\"checked\"]) .thumb{transform:translateX(calc(var(--seki-switch-width, 2.75rem) - var(--seki-switch-thumb-size, 1.25rem) - 0.25rem))}@media (prefers-color-scheme: dark){.switch{--seki-switch-bg-unchecked:hsl(var(--muted, 240 3.7% 15.9%))}.thumb{--seki-switch-thumb-bg:hsl(var(--background, 240 10% 3.9%))}}";
|
|
6
|
+
|
|
7
|
+
const SekiSwitch = class {
|
|
8
|
+
constructor(hostRef) {
|
|
9
|
+
index.registerInstance(this, hostRef);
|
|
10
|
+
this.sekiChange = index.createEvent(this, "sekiChange");
|
|
11
|
+
/**
|
|
12
|
+
* @description Initial checked state for uncontrolled mode. Ignored if checked prop is provided.
|
|
13
|
+
*/
|
|
14
|
+
this.defaultChecked = false;
|
|
15
|
+
/**
|
|
16
|
+
* @description Disables all interactions when true.
|
|
17
|
+
*/
|
|
18
|
+
this.disabled = false;
|
|
19
|
+
/**
|
|
20
|
+
* @description Marks switch as required for form validation.
|
|
21
|
+
*/
|
|
22
|
+
this.required = false;
|
|
23
|
+
/**
|
|
24
|
+
* @description Value sent in form data when switch is checked. Defaults to 'on'.
|
|
25
|
+
*/
|
|
26
|
+
this.value = 'on';
|
|
27
|
+
/**
|
|
28
|
+
* @description Internal checked state for uncontrolled mode.
|
|
29
|
+
*/
|
|
30
|
+
this.internalChecked = false;
|
|
31
|
+
/**
|
|
32
|
+
* Toggle switch state and emit event
|
|
33
|
+
*/
|
|
34
|
+
this.toggle = () => {
|
|
35
|
+
if (this.disabled) {
|
|
36
|
+
return;
|
|
37
|
+
}
|
|
38
|
+
const newCheckedState = !this.isChecked;
|
|
39
|
+
// Update internal state only in uncontrolled mode
|
|
40
|
+
if (this.checked === undefined) {
|
|
41
|
+
this.internalChecked = newCheckedState;
|
|
42
|
+
}
|
|
43
|
+
// Always emit event (for both controlled and uncontrolled)
|
|
44
|
+
this.sekiChange.emit({ checked: newCheckedState });
|
|
45
|
+
};
|
|
46
|
+
/**
|
|
47
|
+
* Handle click events
|
|
48
|
+
*/
|
|
49
|
+
this.handleClick = () => {
|
|
50
|
+
this.toggle();
|
|
51
|
+
};
|
|
52
|
+
}
|
|
53
|
+
/**
|
|
54
|
+
* Initialize internal checked state from defaultChecked
|
|
55
|
+
*/
|
|
56
|
+
componentWillLoad() {
|
|
57
|
+
this.internalChecked = this.defaultChecked;
|
|
58
|
+
}
|
|
59
|
+
/**
|
|
60
|
+
* Get current checked state (controlled vs uncontrolled)
|
|
61
|
+
*/
|
|
62
|
+
get isChecked() {
|
|
63
|
+
return this.checked !== undefined ? this.checked : this.internalChecked;
|
|
64
|
+
}
|
|
65
|
+
/**
|
|
66
|
+
* Handle keyboard events (Space and Enter keys)
|
|
67
|
+
*/
|
|
68
|
+
handleKeyDown(event) {
|
|
69
|
+
if (this.disabled) {
|
|
70
|
+
return;
|
|
71
|
+
}
|
|
72
|
+
// Toggle on Space or Enter
|
|
73
|
+
if (event.key === ' ' || event.key === 'Enter') {
|
|
74
|
+
event.preventDefault(); // Prevent page scroll on Space
|
|
75
|
+
this.toggle();
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
render() {
|
|
79
|
+
const isChecked = this.isChecked;
|
|
80
|
+
const dataState = isChecked ? 'checked' : 'unchecked';
|
|
81
|
+
return (index.h(index.Host, { key: 'af5412cee9d097e57d8e626522619913b7459e4b', "data-state": dataState, "data-disabled": this.disabled ? '' : null }, index.h("div", { key: 'a2c15a3f6b33b4e98e215d82c14cba9dd47bd951', class: "switch", part: "switch", role: "switch", "aria-checked": isChecked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : undefined, "aria-label": this.ariaLabel || undefined, "aria-required": this.required ? 'true' : undefined, tabindex: this.disabled ? -1 : 0, onClick: this.handleClick }, index.h("span", { key: '51fb815c2710b8fd5ac12bdc90b09c44a3bf9b24', class: "thumb", part: "thumb" })), this.name && (index.h("input", { key: '37f059d43e01b82c9fc3e6f1f1df5c894e8a6102', type: "checkbox", name: this.name, value: this.value, checked: isChecked, required: this.required, disabled: this.disabled, style: { display: 'none' }, tabindex: -1, "aria-hidden": "true" }))));
|
|
82
|
+
}
|
|
83
|
+
};
|
|
84
|
+
SekiSwitch.style = sekiSwitchCss;
|
|
85
|
+
|
|
86
|
+
exports.SekiSwitch = SekiSwitch;
|
package/dist/cjs/loader.cjs.js
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-dzrwTIbP.js');
|
|
4
4
|
var appGlobals = require('./app-globals-V2Kpy_OQ.js');
|
|
5
5
|
|
|
6
6
|
const defineCustomElements = async (win, options) => {
|
|
7
7
|
if (typeof window === 'undefined') return undefined;
|
|
8
8
|
await appGlobals.globalScripts();
|
|
9
|
-
return index.bootstrapLazy([["seki-button.cjs",[[257,"seki-button",{"variant":[1],"size":[1],"disabled":[4],"type":[1],"ariaLabel":[1,"aria-label"]}]]],["seki-input.cjs",[[257,"seki-input",{"type":[1],"value":[1537],"placeholder":[1],"disabled":[4],"readonly":[4],"required":[4],"name":[1],"autocomplete":[1],"min":[8],"max":[8],"step":[8],"pattern":[1],"minlength":[2],"maxlength":[2],"size":[1],"invalid":[4],"ariaLabel":[1,"aria-label"],"ariaDescribedby":[1,"aria-describedby"]}]]],["seki-skeleton.cjs",[[257,"seki-skeleton",{"ariaLabel":[1,"aria-label"]}]]]], options);
|
|
9
|
+
return index.bootstrapLazy([["seki-button.cjs",[[257,"seki-button",{"variant":[1],"size":[1],"disabled":[4],"type":[1],"ariaLabel":[1,"aria-label"]}]]],["seki-input.cjs",[[257,"seki-input",{"type":[1],"value":[1537],"placeholder":[1],"disabled":[4],"readonly":[4],"required":[4],"name":[1],"autocomplete":[1],"min":[8],"max":[8],"step":[8],"pattern":[1],"minlength":[2],"maxlength":[2],"size":[1],"invalid":[4],"ariaLabel":[1,"aria-label"],"ariaDescribedby":[1,"aria-describedby"]}]]],["seki-skeleton.cjs",[[257,"seki-skeleton",{"ariaLabel":[1,"aria-label"]}]]],["seki-switch.cjs",[[257,"seki-switch",{"checked":[4],"defaultChecked":[4,"default-checked"],"disabled":[4],"required":[4],"name":[1],"value":[1],"ariaLabel":[1,"aria-label"],"internalChecked":[32]},[[0,"keydown","handleKeyDown"]]]]]], options);
|
|
10
10
|
};
|
|
11
11
|
|
|
12
12
|
exports.setNonce = index.setNonce;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-dzrwTIbP.js');
|
|
4
4
|
|
|
5
5
|
const sekiButtonCss = ":root{--seki-neutral-50:hsl(0, 0%, 98%);--seki-neutral-100:hsl(0, 0%, 96.1%);--seki-neutral-200:hsl(0, 0%, 89.8%);--seki-neutral-300:hsl(0, 0%, 83.1%);--seki-neutral-400:hsl(0, 0%, 63.9%);--seki-neutral-500:hsl(0, 0%, 45.1%);--seki-neutral-600:hsl(0, 0%, 32.2%);--seki-neutral-700:hsl(0, 0%, 25.1%);--seki-neutral-800:hsl(0, 0%, 14.9%);--seki-neutral-900:hsl(0, 0%, 9%);--seki-neutral-950:hsl(0, 0%, 3.9%);--seki-primary-50:hsl(210, 100%, 97%);--seki-primary-100:hsl(210, 95%, 93%);--seki-primary-200:hsl(210, 95%, 85%);--seki-primary-300:hsl(210, 90%, 73%);--seki-primary-400:hsl(210, 85%, 58%);--seki-primary-500:hsl(210, 80%, 48%);--seki-primary-600:hsl(210, 75%, 40%);--seki-primary-700:hsl(210, 70%, 32%);--seki-primary-800:hsl(210, 65%, 25%);--seki-primary-900:hsl(210, 60%, 18%);--seki-primary-950:hsl(210, 55%, 10%);--seki-success-500:hsl(142, 71%, 45%);--seki-success-600:hsl(142, 71%, 35%);--seki-warning-500:hsl(38, 92%, 50%);--seki-warning-600:hsl(38, 92%, 40%);--seki-destructive-500:hsl(0, 84.2%, 60.2%);--seki-destructive-600:hsl(0, 72%, 41%)}:root{--seki-background:hsl(0, 0%, 100%);--seki-foreground:hsl(0, 0%, 3.9%);--seki-muted:hsl(0, 0%, 96.1%);--seki-muted-foreground:hsl(0, 0%, 45.1%);--seki-card:hsl(0, 0%, 100%);--seki-card-foreground:hsl(0, 0%, 3.9%);--seki-popover:hsl(0, 0%, 100%);--seki-popover-foreground:hsl(0, 0%, 3.9%);--seki-border:hsl(0, 0%, 89.8%);--seki-input:hsl(0, 0%, 89.8%);--seki-primary:hsl(0, 0%, 9%);--seki-primary-foreground:hsl(0, 0%, 98%);--seki-secondary:hsl(0, 0%, 96.1%);--seki-secondary-foreground:hsl(0, 0%, 9%);--seki-accent:hsl(0, 0%, 96.1%);--seki-accent-foreground:hsl(0, 0%, 9%);--seki-destructive:hsl(0, 84.2%, 60.2%);--seki-destructive-foreground:hsl(0, 0%, 98%);--seki-ring:hsl(0, 0%, 3.9%);--seki-bg-primary:var(--seki-background);--seki-bg-secondary:var(--seki-muted);--seki-bg-tertiary:var(--seki-accent);--seki-text-primary:var(--seki-foreground);--seki-text-secondary:var(--seki-muted-foreground);--seki-text-tertiary:var(--seki-neutral-400);--seki-border-default:var(--seki-border);--seki-border-emphasis:var(--seki-neutral-300)}:root[data-theme='dark']{--seki-background:hsl(0, 0%, 3.9%);--seki-foreground:hsl(0, 0%, 98%);--seki-muted:hsl(0, 0%, 14.9%);--seki-muted-foreground:hsl(0, 0%, 63.9%);--seki-card:hsl(0, 0%, 3.9%);--seki-card-foreground:hsl(0, 0%, 98%);--seki-popover:hsl(0, 0%, 3.9%);--seki-popover-foreground:hsl(0, 0%, 98%);--seki-border:hsl(0, 0%, 14.9%);--seki-input:hsl(0, 0%, 14.9%);--seki-primary:hsl(0, 0%, 98%);--seki-primary-foreground:hsl(0, 0%, 9%);--seki-secondary:hsl(0, 0%, 14.9%);--seki-secondary-foreground:hsl(0, 0%, 98%);--seki-accent:hsl(0, 0%, 14.9%);--seki-accent-foreground:hsl(0, 0%, 98%);--seki-destructive:hsl(0, 62.8%, 30.6%);--seki-destructive-foreground:hsl(0, 0%, 98%);--seki-ring:hsl(0, 0%, 83.1%);--seki-bg-primary:var(--seki-background);--seki-bg-secondary:var(--seki-muted);--seki-bg-tertiary:var(--seki-accent);--seki-text-primary:var(--seki-foreground);--seki-text-secondary:var(--seki-muted-foreground);--seki-text-tertiary:var(--seki-neutral-600);--seki-border-default:var(--seki-border);--seki-border-emphasis:var(--seki-neutral-700);--seki-button-primary-hover-bg:hsl(0, 0%, 98%, 0.9);--seki-button-secondary-hover-bg:hsl(0, 0%, 14.9%, 0.8)}:root{--seki-button-primary-bg:var(--seki-primary);--seki-button-primary-text:var(--seki-primary-foreground);--seki-button-primary-border:transparent;--seki-button-primary-hover-bg:hsl(0, 0%, 9%, 0.9);--seki-button-primary-hover-text:var(--seki-primary-foreground);--seki-button-primary-hover-border:transparent;--seki-button-secondary-bg:var(--seki-secondary);--seki-button-secondary-text:var(--seki-secondary-foreground);--seki-button-secondary-border:transparent;--seki-button-secondary-hover-bg:hsl(0, 0%, 96.1%, 0.8);--seki-button-secondary-hover-text:var(--seki-secondary-foreground);--seki-button-secondary-hover-border:transparent;--seki-button-outline-bg:transparent;--seki-button-outline-text:var(--seki-foreground);--seki-button-outline-border:var(--seki-input);--seki-button-outline-hover-bg:var(--seki-accent);--seki-button-outline-hover-text:var(--seki-accent-foreground);--seki-button-outline-hover-border:var(--seki-input);--seki-button-ghost-bg:transparent;--seki-button-ghost-text:var(--seki-foreground);--seki-button-ghost-border:transparent;--seki-button-ghost-hover-bg:var(--seki-accent);--seki-button-ghost-hover-text:var(--seki-accent-foreground);--seki-button-ghost-hover-border:transparent;--seki-button-destructive-bg:var(--seki-destructive);--seki-button-destructive-text:var(--seki-destructive-foreground);--seki-button-destructive-border:transparent;--seki-button-destructive-hover-bg:hsl(0, 84.2%, 60.2%, 0.9);--seki-button-destructive-hover-border:transparent;--seki-button-sm-padding-x:var(--seki-spacing-3, 0.75rem);--seki-button-sm-padding-y:0.375rem;--seki-button-sm-font-size:var(--seki-text-sm, 0.875rem);--seki-button-sm-height:2.25rem;--seki-button-md-padding-x:var(--seki-spacing-4, 1rem);--seki-button-md-padding-y:var(--seki-spacing-2, 0.5rem);--seki-button-md-font-size:var(--seki-text-base, 1rem);--seki-button-md-height:2.5rem;--seki-button-lg-padding-x:2rem;--seki-button-lg-padding-y:0.5rem;--seki-button-lg-font-size:1rem;--seki-button-lg-height:2.75rem;--seki-button-icon-sm-size:2rem;--seki-button-icon-size:2.5rem;--seki-button-icon-lg-size:3rem;--seki-button-icon-gap:0.5rem;--seki-button-link-bg:transparent;--seki-button-link-text:var(--seki-primary);--seki-button-link-border:transparent;--seki-button-link-hover-bg:transparent;--seki-button-link-hover-text:var(--seki-primary);--seki-button-link-hover-border:transparent;--seki-button-radius:var(--seki-radius-md, 0.375rem);--seki-button-font-weight:var(--seki-font-medium, 500);--seki-button-transition-duration:150ms;--seki-button-transition-timing:ease-in-out;--seki-button-shadow:var(--seki-shadow-sm, 0 1px 2px 0 rgb(0 0 0 / 0.05));--seki-button-shadow-hover:var(--seki-shadow-md, 0 4px 6px -1px rgb(0 0 0 / 0.1));--seki-button-disabled-opacity:0.5;--seki-input-bg:var(--seki-background);--seki-input-border:var(--seki-border);--seki-input-text:var(--seki-foreground);--seki-input-placeholder:var(--seki-muted-foreground);--seki-input-ring:var(--seki-ring);--seki-input-invalid-border:var(--seki-destructive);--seki-input-invalid-ring:var(--seki-destructive);--seki-input-disabled-opacity:0.5;--seki-input-radius:var(--seki-radius-md)}:root{--seki-spacing-0:0;--seki-spacing-0-5:0.125rem;--seki-spacing-1:0.25rem;--seki-spacing-1-5:0.375rem;--seki-spacing-2:0.5rem;--seki-spacing-2-5:0.625rem;--seki-spacing-3:0.75rem;--seki-spacing-3-5:0.875rem;--seki-spacing-4:1rem;--seki-spacing-5:1.25rem;--seki-spacing-6:1.5rem;--seki-spacing-8:2rem;--seki-spacing-10:2.5rem;--seki-spacing-12:3rem;--seki-spacing-16:4rem;--seki-spacing-20:5rem;--seki-spacing-24:6rem;--seki-input-height-sm:2rem;--seki-input-height-md:2.5rem;--seki-input-height-lg:3rem;--seki-input-padding-x:0.75rem;--seki-input-padding-y:0.5rem;--seki-input-font-size:0.875rem;--seki-input-ring-offset:2px}:root{--seki-shadow-sm:0 1px 2px 0 rgb(0 0 0 / 0.05);--seki-shadow-md:0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);--seki-shadow-lg:0 10px 15px -3px rgb(0 0 0 / 0.15), 0 4px 6px -4px rgb(0 0 0 / 0.1)}:root{--seki-font-sans:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue',\n Arial, sans-serif;--seki-font-mono:ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;--seki-text-xs:0.75rem;--seki-text-sm:0.875rem;--seki-text-base:1rem;--seki-text-lg:1.125rem;--seki-text-xl:1.25rem;--seki-text-2xl:1.5rem;--seki-text-3xl:1.875rem;--seki-text-4xl:2.25rem;--seki-font-normal:400;--seki-font-medium:500;--seki-font-semibold:600;--seki-font-bold:700;--seki-leading-tight:1.25;--seki-leading-normal:1.5;--seki-leading-relaxed:1.75}:root{--seki-radius-sm:0.25rem;--seki-radius-md:0.375rem;--seki-radius-lg:0.5rem;--seki-radius-xl:1rem;}:host{display:inline-block}.button{box-sizing:border-box;font-family:var(--seki-font-sans);font-weight:var(--seki-button-font-weight);border-radius:var(--seki-button-radius);cursor:pointer;border:1px solid;transition:background-color var(--seki-button-transition-duration) var(--seki-button-transition-timing),\n border-color var(--seki-button-transition-duration) var(--seki-button-transition-timing),\n color var(--seki-button-transition-duration) var(--seki-button-transition-timing),\n box-shadow var(--seki-button-transition-duration) var(--seki-button-transition-timing),\n text-decoration var(--seki-button-transition-duration) var(--seki-button-transition-timing);box-shadow:var(--seki-button-shadow);display:inline-flex;align-items:center;justify-content:center;gap:var(--seki-button-icon-gap)}.button:hover:not(:disabled){box-shadow:var(--seki-button-shadow-hover)}.button:focus-visible{outline:2px solid var(--seki-accent);outline-offset:2px}.button:disabled{opacity:var(--seki-button-disabled-opacity);cursor:not-allowed}.button--primary{background:var(--seki-button-primary-bg);color:var(--seki-button-primary-text);border-color:var(--seki-button-primary-border)}.button--primary:hover:not(:disabled){background:var(--seki-button-primary-hover-bg);color:var(--seki-button-primary-hover-text, var(--seki-button-primary-text));border-color:var(--seki-button-primary-hover-border)}.button--secondary{background:var(--seki-button-secondary-bg);color:var(--seki-button-secondary-text);border-color:var(--seki-button-secondary-border)}.button--secondary:hover:not(:disabled){background:var(--seki-button-secondary-hover-bg);color:var(--seki-button-secondary-hover-text, var(--seki-button-secondary-text));border-color:var(--seki-button-secondary-hover-border)}.button--outline{background:var(--seki-button-outline-bg);color:var(--seki-button-outline-text);border-color:var(--seki-button-outline-border)}.button--outline:hover:not(:disabled){background:var(--seki-button-outline-hover-bg);color:var(--seki-button-outline-hover-text);border-color:var(--seki-button-outline-hover-border)}.button--ghost{background:var(--seki-button-ghost-bg);color:var(--seki-button-ghost-text);border-color:var(--seki-button-ghost-border)}.button--ghost:hover:not(:disabled){background:var(--seki-button-ghost-hover-bg);color:var(--seki-button-ghost-hover-text);border-color:var(--seki-button-ghost-hover-border)}.button--destructive{background:var(--seki-button-destructive-bg);color:var(--seki-button-destructive-text);border-color:var(--seki-button-destructive-border)}.button--destructive:hover:not(:disabled){background:var(--seki-button-destructive-hover-bg);color:var(--seki-button-destructive-text);border-color:var(--seki-button-destructive-hover-border)}.button--link{background:var(--seki-button-link-bg);color:var(--seki-button-link-text);border-color:var(--seki-button-link-border);text-decoration:none}.button--link:hover:not(:disabled){background:var(--seki-button-link-hover-bg);color:var(--seki-button-link-hover-text);border-color:var(--seki-button-link-hover-border);text-decoration:underline}.button--sm{padding:var(--seki-button-sm-padding-y) var(--seki-button-sm-padding-x);font-size:var(--seki-button-sm-font-size);height:var(--seki-button-sm-height)}.button--md{padding:var(--seki-button-md-padding-y) var(--seki-button-md-padding-x);font-size:var(--seki-button-md-font-size);height:var(--seki-button-md-height)}.button--lg{padding:var(--seki-button-lg-padding-y) var(--seki-button-lg-padding-x);font-size:var(--seki-button-lg-font-size);height:var(--seki-button-lg-height)}.button--icon-sm{width:var(--seki-button-icon-sm-size);height:var(--seki-button-icon-sm-size);padding:0}.button--icon{width:var(--seki-button-icon-size);height:var(--seki-button-icon-size);padding:0}.button--icon-lg{width:var(--seki-button-icon-lg-size);height:var(--seki-button-icon-lg-size);padding:0}@media (prefers-reduced-motion: reduce){.button{transition:none}}";
|
|
6
6
|
|
|
@@ -33,7 +33,7 @@ const SekiButton = class {
|
|
|
33
33
|
}
|
|
34
34
|
}
|
|
35
35
|
render() {
|
|
36
|
-
return (index.h("button", { key: '
|
|
36
|
+
return (index.h("button", { key: '3cc4cf0af6075fbe012388fa5adb953b64a2b1ca', class: `button button--${this.variant} button--${this.size}`, type: this.type, disabled: this.disabled, "aria-disabled": this.disabled ? 'true' : null, "aria-label": this.ariaLabel }, index.h("slot", { key: '7c90c49539e6721b6580a07c3f97e20148734b05' })));
|
|
37
37
|
}
|
|
38
38
|
};
|
|
39
39
|
SekiButton.style = sekiButtonCss;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-dzrwTIbP.js');
|
|
4
4
|
|
|
5
5
|
const sekiInputCss = ":root{--seki-neutral-50:hsl(0, 0%, 98%);--seki-neutral-100:hsl(0, 0%, 96.1%);--seki-neutral-200:hsl(0, 0%, 89.8%);--seki-neutral-300:hsl(0, 0%, 83.1%);--seki-neutral-400:hsl(0, 0%, 63.9%);--seki-neutral-500:hsl(0, 0%, 45.1%);--seki-neutral-600:hsl(0, 0%, 32.2%);--seki-neutral-700:hsl(0, 0%, 25.1%);--seki-neutral-800:hsl(0, 0%, 14.9%);--seki-neutral-900:hsl(0, 0%, 9%);--seki-neutral-950:hsl(0, 0%, 3.9%);--seki-primary-50:hsl(210, 100%, 97%);--seki-primary-100:hsl(210, 95%, 93%);--seki-primary-200:hsl(210, 95%, 85%);--seki-primary-300:hsl(210, 90%, 73%);--seki-primary-400:hsl(210, 85%, 58%);--seki-primary-500:hsl(210, 80%, 48%);--seki-primary-600:hsl(210, 75%, 40%);--seki-primary-700:hsl(210, 70%, 32%);--seki-primary-800:hsl(210, 65%, 25%);--seki-primary-900:hsl(210, 60%, 18%);--seki-primary-950:hsl(210, 55%, 10%);--seki-success-500:hsl(142, 71%, 45%);--seki-success-600:hsl(142, 71%, 35%);--seki-warning-500:hsl(38, 92%, 50%);--seki-warning-600:hsl(38, 92%, 40%);--seki-destructive-500:hsl(0, 84.2%, 60.2%);--seki-destructive-600:hsl(0, 72%, 41%)}:root{--seki-background:hsl(0, 0%, 100%);--seki-foreground:hsl(0, 0%, 3.9%);--seki-muted:hsl(0, 0%, 96.1%);--seki-muted-foreground:hsl(0, 0%, 45.1%);--seki-card:hsl(0, 0%, 100%);--seki-card-foreground:hsl(0, 0%, 3.9%);--seki-popover:hsl(0, 0%, 100%);--seki-popover-foreground:hsl(0, 0%, 3.9%);--seki-border:hsl(0, 0%, 89.8%);--seki-input:hsl(0, 0%, 89.8%);--seki-primary:hsl(0, 0%, 9%);--seki-primary-foreground:hsl(0, 0%, 98%);--seki-secondary:hsl(0, 0%, 96.1%);--seki-secondary-foreground:hsl(0, 0%, 9%);--seki-accent:hsl(0, 0%, 96.1%);--seki-accent-foreground:hsl(0, 0%, 9%);--seki-destructive:hsl(0, 84.2%, 60.2%);--seki-destructive-foreground:hsl(0, 0%, 98%);--seki-ring:hsl(0, 0%, 3.9%);--seki-bg-primary:var(--seki-background);--seki-bg-secondary:var(--seki-muted);--seki-bg-tertiary:var(--seki-accent);--seki-text-primary:var(--seki-foreground);--seki-text-secondary:var(--seki-muted-foreground);--seki-text-tertiary:var(--seki-neutral-400);--seki-border-default:var(--seki-border);--seki-border-emphasis:var(--seki-neutral-300)}:root[data-theme='dark']{--seki-background:hsl(0, 0%, 3.9%);--seki-foreground:hsl(0, 0%, 98%);--seki-muted:hsl(0, 0%, 14.9%);--seki-muted-foreground:hsl(0, 0%, 63.9%);--seki-card:hsl(0, 0%, 3.9%);--seki-card-foreground:hsl(0, 0%, 98%);--seki-popover:hsl(0, 0%, 3.9%);--seki-popover-foreground:hsl(0, 0%, 98%);--seki-border:hsl(0, 0%, 14.9%);--seki-input:hsl(0, 0%, 14.9%);--seki-primary:hsl(0, 0%, 98%);--seki-primary-foreground:hsl(0, 0%, 9%);--seki-secondary:hsl(0, 0%, 14.9%);--seki-secondary-foreground:hsl(0, 0%, 98%);--seki-accent:hsl(0, 0%, 14.9%);--seki-accent-foreground:hsl(0, 0%, 98%);--seki-destructive:hsl(0, 62.8%, 30.6%);--seki-destructive-foreground:hsl(0, 0%, 98%);--seki-ring:hsl(0, 0%, 83.1%);--seki-bg-primary:var(--seki-background);--seki-bg-secondary:var(--seki-muted);--seki-bg-tertiary:var(--seki-accent);--seki-text-primary:var(--seki-foreground);--seki-text-secondary:var(--seki-muted-foreground);--seki-text-tertiary:var(--seki-neutral-600);--seki-border-default:var(--seki-border);--seki-border-emphasis:var(--seki-neutral-700);--seki-button-primary-hover-bg:hsl(0, 0%, 98%, 0.9);--seki-button-secondary-hover-bg:hsl(0, 0%, 14.9%, 0.8)}:root{--seki-button-primary-bg:var(--seki-primary);--seki-button-primary-text:var(--seki-primary-foreground);--seki-button-primary-border:transparent;--seki-button-primary-hover-bg:hsl(0, 0%, 9%, 0.9);--seki-button-primary-hover-text:var(--seki-primary-foreground);--seki-button-primary-hover-border:transparent;--seki-button-secondary-bg:var(--seki-secondary);--seki-button-secondary-text:var(--seki-secondary-foreground);--seki-button-secondary-border:transparent;--seki-button-secondary-hover-bg:hsl(0, 0%, 96.1%, 0.8);--seki-button-secondary-hover-text:var(--seki-secondary-foreground);--seki-button-secondary-hover-border:transparent;--seki-button-outline-bg:transparent;--seki-button-outline-text:var(--seki-foreground);--seki-button-outline-border:var(--seki-input);--seki-button-outline-hover-bg:var(--seki-accent);--seki-button-outline-hover-text:var(--seki-accent-foreground);--seki-button-outline-hover-border:var(--seki-input);--seki-button-ghost-bg:transparent;--seki-button-ghost-text:var(--seki-foreground);--seki-button-ghost-border:transparent;--seki-button-ghost-hover-bg:var(--seki-accent);--seki-button-ghost-hover-text:var(--seki-accent-foreground);--seki-button-ghost-hover-border:transparent;--seki-button-destructive-bg:var(--seki-destructive);--seki-button-destructive-text:var(--seki-destructive-foreground);--seki-button-destructive-border:transparent;--seki-button-destructive-hover-bg:hsl(0, 84.2%, 60.2%, 0.9);--seki-button-destructive-hover-border:transparent;--seki-button-sm-padding-x:var(--seki-spacing-3, 0.75rem);--seki-button-sm-padding-y:0.375rem;--seki-button-sm-font-size:var(--seki-text-sm, 0.875rem);--seki-button-sm-height:2.25rem;--seki-button-md-padding-x:var(--seki-spacing-4, 1rem);--seki-button-md-padding-y:var(--seki-spacing-2, 0.5rem);--seki-button-md-font-size:var(--seki-text-base, 1rem);--seki-button-md-height:2.5rem;--seki-button-lg-padding-x:2rem;--seki-button-lg-padding-y:0.5rem;--seki-button-lg-font-size:1rem;--seki-button-lg-height:2.75rem;--seki-button-icon-sm-size:2rem;--seki-button-icon-size:2.5rem;--seki-button-icon-lg-size:3rem;--seki-button-icon-gap:0.5rem;--seki-button-link-bg:transparent;--seki-button-link-text:var(--seki-primary);--seki-button-link-border:transparent;--seki-button-link-hover-bg:transparent;--seki-button-link-hover-text:var(--seki-primary);--seki-button-link-hover-border:transparent;--seki-button-radius:var(--seki-radius-md, 0.375rem);--seki-button-font-weight:var(--seki-font-medium, 500);--seki-button-transition-duration:150ms;--seki-button-transition-timing:ease-in-out;--seki-button-shadow:var(--seki-shadow-sm, 0 1px 2px 0 rgb(0 0 0 / 0.05));--seki-button-shadow-hover:var(--seki-shadow-md, 0 4px 6px -1px rgb(0 0 0 / 0.1));--seki-button-disabled-opacity:0.5;--seki-input-bg:var(--seki-background);--seki-input-border:var(--seki-border);--seki-input-text:var(--seki-foreground);--seki-input-placeholder:var(--seki-muted-foreground);--seki-input-ring:var(--seki-ring);--seki-input-invalid-border:var(--seki-destructive);--seki-input-invalid-ring:var(--seki-destructive);--seki-input-disabled-opacity:0.5;--seki-input-radius:var(--seki-radius-md)}:root{--seki-spacing-0:0;--seki-spacing-0-5:0.125rem;--seki-spacing-1:0.25rem;--seki-spacing-1-5:0.375rem;--seki-spacing-2:0.5rem;--seki-spacing-2-5:0.625rem;--seki-spacing-3:0.75rem;--seki-spacing-3-5:0.875rem;--seki-spacing-4:1rem;--seki-spacing-5:1.25rem;--seki-spacing-6:1.5rem;--seki-spacing-8:2rem;--seki-spacing-10:2.5rem;--seki-spacing-12:3rem;--seki-spacing-16:4rem;--seki-spacing-20:5rem;--seki-spacing-24:6rem;--seki-input-height-sm:2rem;--seki-input-height-md:2.5rem;--seki-input-height-lg:3rem;--seki-input-padding-x:0.75rem;--seki-input-padding-y:0.5rem;--seki-input-font-size:0.875rem;--seki-input-ring-offset:2px}:root{--seki-shadow-sm:0 1px 2px 0 rgb(0 0 0 / 0.05);--seki-shadow-md:0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);--seki-shadow-lg:0 10px 15px -3px rgb(0 0 0 / 0.15), 0 4px 6px -4px rgb(0 0 0 / 0.1)}:root{--seki-font-sans:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue',\n Arial, sans-serif;--seki-font-mono:ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;--seki-text-xs:0.75rem;--seki-text-sm:0.875rem;--seki-text-base:1rem;--seki-text-lg:1.125rem;--seki-text-xl:1.25rem;--seki-text-2xl:1.5rem;--seki-text-3xl:1.875rem;--seki-text-4xl:2.25rem;--seki-font-normal:400;--seki-font-medium:500;--seki-font-semibold:600;--seki-font-bold:700;--seki-leading-tight:1.25;--seki-leading-normal:1.5;--seki-leading-relaxed:1.75}:root{--seki-radius-sm:0.25rem;--seki-radius-md:0.375rem;--seki-radius-lg:0.5rem;--seki-radius-xl:1rem;}:host{display:inline-block;width:100%}.input{box-sizing:border-box;width:100%;font-family:var(--seki-font-sans);font-size:var(--seki-input-font-size);border-radius:var(--seki-input-radius);border:1px solid var(--seki-input-border);background:var(--seki-input-bg);color:var(--seki-input-text);padding:var(--seki-input-padding-y) var(--seki-input-padding-x);transition:border-color 0.2s ease, box-shadow 0.2s ease}.input::placeholder{color:var(--seki-input-placeholder)}.input:focus-visible{outline:2px solid var(--seki-input-ring);outline-offset:var(--seki-input-ring-offset);border-color:var(--seki-input-ring)}.input:disabled{cursor:not-allowed;opacity:var(--seki-input-disabled-opacity)}.input:read-only{background:var(--seki-muted)}.input--invalid{border-color:var(--seki-input-invalid-border)}.input--invalid:focus-visible{outline-color:var(--seki-input-invalid-ring);border-color:var(--seki-input-invalid-border)}.input--sm{height:var(--seki-input-height-sm);font-size:calc(var(--seki-input-font-size) * 0.875);padding:calc(var(--seki-input-padding-y) * 0.75) calc(var(--seki-input-padding-x) * 0.875)}.input--md{height:var(--seki-input-height-md)}.input--lg{height:var(--seki-input-height-lg);font-size:calc(var(--seki-input-font-size) * 1.125);padding:calc(var(--seki-input-padding-y) * 1.25) calc(var(--seki-input-padding-x) * 1.125)}.input[type=\"file\"]::file-selector-button{border:0;background:transparent;font-size:var(--seki-input-font-size);font-weight:500;margin-right:0.75rem;cursor:pointer;color:var(--seki-input-text)}.input[type=\"file\"]::file-selector-button:hover{text-decoration:underline}@media (prefers-reduced-motion: reduce){.input{transition:none}}";
|
|
6
6
|
|
|
@@ -58,7 +58,7 @@ const SekiInput = class {
|
|
|
58
58
|
};
|
|
59
59
|
}
|
|
60
60
|
render() {
|
|
61
|
-
return (index.h("input", { key: '
|
|
61
|
+
return (index.h("input", { key: 'cd99fbb418e453c5af869e9ec6d1f8abd2e17483', type: this.type, value: this.value, placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, name: this.name, autocomplete: this.autocomplete, min: this.min, max: this.max, step: this.step, pattern: this.pattern, minlength: this.minlength, maxlength: this.maxlength, class: `input input--${this.size}${this.invalid ? ' input--invalid' : ''}`, "aria-label": this.ariaLabel, "aria-describedby": this.ariaDescribedby, "aria-invalid": this.invalid ? 'true' : null, "aria-disabled": this.disabled ? 'true' : null, onInput: this.handleInput, onChange: this.handleChange, onFocus: this.handleFocus, onBlur: this.handleBlur }));
|
|
62
62
|
}
|
|
63
63
|
};
|
|
64
64
|
SekiInput.style = sekiInputCss;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-dzrwTIbP.js');
|
|
4
4
|
|
|
5
|
-
const sekiSkeletonCss = ":root{--seki-neutral-50:hsl(0, 0%, 98%);--seki-neutral-100:hsl(0, 0%, 96.1%);--seki-neutral-200:hsl(0, 0%, 89.8%);--seki-neutral-300:hsl(0, 0%, 83.1%);--seki-neutral-400:hsl(0, 0%, 63.9%);--seki-neutral-500:hsl(0, 0%, 45.1%);--seki-neutral-600:hsl(0, 0%, 32.2%);--seki-neutral-700:hsl(0, 0%, 25.1%);--seki-neutral-800:hsl(0, 0%, 14.9%);--seki-neutral-900:hsl(0, 0%, 9%);--seki-neutral-950:hsl(0, 0%, 3.9%);--seki-primary-50:hsl(210, 100%, 97%);--seki-primary-100:hsl(210, 95%, 93%);--seki-primary-200:hsl(210, 95%, 85%);--seki-primary-300:hsl(210, 90%, 73%);--seki-primary-400:hsl(210, 85%, 58%);--seki-primary-500:hsl(210, 80%, 48%);--seki-primary-600:hsl(210, 75%, 40%);--seki-primary-700:hsl(210, 70%, 32%);--seki-primary-800:hsl(210, 65%, 25%);--seki-primary-900:hsl(210, 60%, 18%);--seki-primary-950:hsl(210, 55%, 10%);--seki-success-500:hsl(142, 71%, 45%);--seki-success-600:hsl(142, 71%, 35%);--seki-warning-500:hsl(38, 92%, 50%);--seki-warning-600:hsl(38, 92%, 40%);--seki-destructive-500:hsl(0, 84.2%, 60.2%);--seki-destructive-600:hsl(0, 72%, 41%)}:root{--seki-background:hsl(0, 0%, 100%);--seki-foreground:hsl(0, 0%, 3.9%);--seki-muted:hsl(0, 0%, 96.1%);--seki-muted-foreground:hsl(0, 0%, 45.1%);--seki-card:hsl(0, 0%, 100%);--seki-card-foreground:hsl(0, 0%, 3.9%);--seki-popover:hsl(0, 0%, 100%);--seki-popover-foreground:hsl(0, 0%, 3.9%);--seki-border:hsl(0, 0%, 89.8%);--seki-input:hsl(0, 0%, 89.8%);--seki-primary:hsl(0, 0%, 9%);--seki-primary-foreground:hsl(0, 0%, 98%);--seki-secondary:hsl(0, 0%, 96.1%);--seki-secondary-foreground:hsl(0, 0%, 9%);--seki-accent:hsl(0, 0%, 96.1%);--seki-accent-foreground:hsl(0, 0%, 9%);--seki-destructive:hsl(0, 84.2%, 60.2%);--seki-destructive-foreground:hsl(0, 0%, 98%);--seki-ring:hsl(0, 0%, 3.9%);--seki-bg-primary:var(--seki-background);--seki-bg-secondary:var(--seki-muted);--seki-bg-tertiary:var(--seki-accent);--seki-text-primary:var(--seki-foreground);--seki-text-secondary:var(--seki-muted-foreground);--seki-text-tertiary:var(--seki-neutral-400);--seki-border-default:var(--seki-border);--seki-border-emphasis:var(--seki-neutral-300)}:root[data-theme='dark']{--seki-background:hsl(0, 0%, 3.9%);--seki-foreground:hsl(0, 0%, 98%);--seki-muted:hsl(0, 0%, 14.9%);--seki-muted-foreground:hsl(0, 0%, 63.9%);--seki-card:hsl(0, 0%, 3.9%);--seki-card-foreground:hsl(0, 0%, 98%);--seki-popover:hsl(0, 0%, 3.9%);--seki-popover-foreground:hsl(0, 0%, 98%);--seki-border:hsl(0, 0%, 14.9%);--seki-input:hsl(0, 0%, 14.9%);--seki-primary:hsl(0, 0%, 98%);--seki-primary-foreground:hsl(0, 0%, 9%);--seki-secondary:hsl(0, 0%, 14.9%);--seki-secondary-foreground:hsl(0, 0%, 98%);--seki-accent:hsl(0, 0%, 14.9%);--seki-accent-foreground:hsl(0, 0%, 98%);--seki-destructive:hsl(0, 62.8%, 30.6%);--seki-destructive-foreground:hsl(0, 0%, 98%);--seki-ring:hsl(0, 0%, 83.1%);--seki-bg-primary:var(--seki-background);--seki-bg-secondary:var(--seki-muted);--seki-bg-tertiary:var(--seki-accent);--seki-text-primary:var(--seki-foreground);--seki-text-secondary:var(--seki-muted-foreground);--seki-text-tertiary:var(--seki-neutral-600);--seki-border-default:var(--seki-border);--seki-border-emphasis:var(--seki-neutral-700);--seki-button-primary-hover-bg:hsl(0, 0%, 98%, 0.9);--seki-button-secondary-hover-bg:hsl(0, 0%, 14.9%, 0.8)}:root{--seki-button-primary-bg:var(--seki-primary);--seki-button-primary-text:var(--seki-primary-foreground);--seki-button-primary-border:transparent;--seki-button-primary-hover-bg:hsl(0, 0%, 9%, 0.9);--seki-button-primary-hover-text:var(--seki-primary-foreground);--seki-button-primary-hover-border:transparent;--seki-button-secondary-bg:var(--seki-secondary);--seki-button-secondary-text:var(--seki-secondary-foreground);--seki-button-secondary-border:transparent;--seki-button-secondary-hover-bg:hsl(0, 0%, 96.1%, 0.8);--seki-button-secondary-hover-text:var(--seki-secondary-foreground);--seki-button-secondary-hover-border:transparent;--seki-button-outline-bg:transparent;--seki-button-outline-text:var(--seki-foreground);--seki-button-outline-border:var(--seki-input);--seki-button-outline-hover-bg:var(--seki-accent);--seki-button-outline-hover-text:var(--seki-accent-foreground);--seki-button-outline-hover-border:var(--seki-input);--seki-button-ghost-bg:transparent;--seki-button-ghost-text:var(--seki-foreground);--seki-button-ghost-border:transparent;--seki-button-ghost-hover-bg:var(--seki-accent);--seki-button-ghost-hover-text:var(--seki-accent-foreground);--seki-button-ghost-hover-border:transparent;--seki-button-destructive-bg:var(--seki-destructive);--seki-button-destructive-text:var(--seki-destructive-foreground);--seki-button-destructive-border:transparent;--seki-button-destructive-hover-bg:hsl(0, 84.2%, 60.2%, 0.9);--seki-button-destructive-hover-border:transparent;--seki-button-sm-padding-x:var(--seki-spacing-3, 0.75rem);--seki-button-sm-padding-y:0.375rem;--seki-button-sm-font-size:var(--seki-text-sm, 0.875rem);--seki-button-sm-height:2.25rem;--seki-button-md-padding-x:var(--seki-spacing-4, 1rem);--seki-button-md-padding-y:var(--seki-spacing-2, 0.5rem);--seki-button-md-font-size:var(--seki-text-base, 1rem);--seki-button-md-height:2.5rem;--seki-button-lg-padding-x:2rem;--seki-button-lg-padding-y:0.5rem;--seki-button-lg-font-size:1rem;--seki-button-lg-height:2.75rem;--seki-button-icon-sm-size:2rem;--seki-button-icon-size:2.5rem;--seki-button-icon-lg-size:3rem;--seki-button-icon-gap:0.5rem;--seki-button-link-bg:transparent;--seki-button-link-text:var(--seki-primary);--seki-button-link-border:transparent;--seki-button-link-hover-bg:transparent;--seki-button-link-hover-text:var(--seki-primary);--seki-button-link-hover-border:transparent;--seki-button-radius:var(--seki-radius-md, 0.375rem);--seki-button-font-weight:var(--seki-font-medium, 500);--seki-button-transition-duration:150ms;--seki-button-transition-timing:ease-in-out;--seki-button-shadow:var(--seki-shadow-sm, 0 1px 2px 0 rgb(0 0 0 / 0.05));--seki-button-shadow-hover:var(--seki-shadow-md, 0 4px 6px -1px rgb(0 0 0 / 0.1));--seki-button-disabled-opacity:0.5;--seki-input-bg:var(--seki-background);--seki-input-border:var(--seki-border);--seki-input-text:var(--seki-foreground);--seki-input-placeholder:var(--seki-muted-foreground);--seki-input-ring:var(--seki-ring);--seki-input-invalid-border:var(--seki-destructive);--seki-input-invalid-ring:var(--seki-destructive);--seki-input-disabled-opacity:0.5;--seki-input-radius:var(--seki-radius-md)}:root{--seki-spacing-0:0;--seki-spacing-0-5:0.125rem;--seki-spacing-1:0.25rem;--seki-spacing-1-5:0.375rem;--seki-spacing-2:0.5rem;--seki-spacing-2-5:0.625rem;--seki-spacing-3:0.75rem;--seki-spacing-3-5:0.875rem;--seki-spacing-4:1rem;--seki-spacing-5:1.25rem;--seki-spacing-6:1.5rem;--seki-spacing-8:2rem;--seki-spacing-10:2.5rem;--seki-spacing-12:3rem;--seki-spacing-16:4rem;--seki-spacing-20:5rem;--seki-spacing-24:6rem;--seki-input-height-sm:2rem;--seki-input-height-md:2.5rem;--seki-input-height-lg:3rem;--seki-input-padding-x:0.75rem;--seki-input-padding-y:0.5rem;--seki-input-font-size:0.875rem;--seki-input-ring-offset:2px}:root{--seki-shadow-sm:0 1px 2px 0 rgb(0 0 0 / 0.05);--seki-shadow-md:0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);--seki-shadow-lg:0 10px 15px -3px rgb(0 0 0 / 0.15), 0 4px 6px -4px rgb(0 0 0 / 0.1)}:root{--seki-font-sans:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue',\n Arial, sans-serif;--seki-font-mono:ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;--seki-text-xs:0.75rem;--seki-text-sm:0.875rem;--seki-text-base:1rem;--seki-text-lg:1.125rem;--seki-text-xl:1.25rem;--seki-text-2xl:1.5rem;--seki-text-3xl:1.875rem;--seki-text-4xl:2.25rem;--seki-font-normal:400;--seki-font-medium:500;--seki-font-semibold:600;--seki-font-bold:700;--seki-leading-tight:1.25;--seki-leading-normal:1.5;--seki-leading-relaxed:1.75}:root{--seki-radius-sm:0.25rem;--seki-radius-md:0.375rem;--seki-radius-lg:0.5rem;--seki-radius-xl:1rem;}:host{display:inline-block}.skeleton{background-color:var(--seki-muted);border-radius:var(--seki-radius-md, 0.375rem);width:100%;height:100%;animation:skeleton-pulse 2s ease-in-out infinite}@keyframes skeleton-pulse{0%,100%{opacity:1}50%{opacity:0.5}}@media (prefers-reduced-motion: reduce){.skeleton{animation:none}}";
|
|
5
|
+
const sekiSkeletonCss = ":root{--seki-neutral-50:hsl(0, 0%, 98%);--seki-neutral-100:hsl(0, 0%, 96.1%);--seki-neutral-200:hsl(0, 0%, 89.8%);--seki-neutral-300:hsl(0, 0%, 83.1%);--seki-neutral-400:hsl(0, 0%, 63.9%);--seki-neutral-500:hsl(0, 0%, 45.1%);--seki-neutral-600:hsl(0, 0%, 32.2%);--seki-neutral-700:hsl(0, 0%, 25.1%);--seki-neutral-800:hsl(0, 0%, 14.9%);--seki-neutral-900:hsl(0, 0%, 9%);--seki-neutral-950:hsl(0, 0%, 3.9%);--seki-primary-50:hsl(210, 100%, 97%);--seki-primary-100:hsl(210, 95%, 93%);--seki-primary-200:hsl(210, 95%, 85%);--seki-primary-300:hsl(210, 90%, 73%);--seki-primary-400:hsl(210, 85%, 58%);--seki-primary-500:hsl(210, 80%, 48%);--seki-primary-600:hsl(210, 75%, 40%);--seki-primary-700:hsl(210, 70%, 32%);--seki-primary-800:hsl(210, 65%, 25%);--seki-primary-900:hsl(210, 60%, 18%);--seki-primary-950:hsl(210, 55%, 10%);--seki-success-500:hsl(142, 71%, 45%);--seki-success-600:hsl(142, 71%, 35%);--seki-warning-500:hsl(38, 92%, 50%);--seki-warning-600:hsl(38, 92%, 40%);--seki-destructive-500:hsl(0, 84.2%, 60.2%);--seki-destructive-600:hsl(0, 72%, 41%)}:root{--seki-background:hsl(0, 0%, 100%);--seki-foreground:hsl(0, 0%, 3.9%);--seki-muted:hsl(0, 0%, 96.1%);--seki-muted-foreground:hsl(0, 0%, 45.1%);--seki-card:hsl(0, 0%, 100%);--seki-card-foreground:hsl(0, 0%, 3.9%);--seki-popover:hsl(0, 0%, 100%);--seki-popover-foreground:hsl(0, 0%, 3.9%);--seki-border:hsl(0, 0%, 89.8%);--seki-input:hsl(0, 0%, 89.8%);--seki-primary:hsl(0, 0%, 9%);--seki-primary-foreground:hsl(0, 0%, 98%);--seki-secondary:hsl(0, 0%, 96.1%);--seki-secondary-foreground:hsl(0, 0%, 9%);--seki-accent:hsl(0, 0%, 96.1%);--seki-accent-foreground:hsl(0, 0%, 9%);--seki-destructive:hsl(0, 84.2%, 60.2%);--seki-destructive-foreground:hsl(0, 0%, 98%);--seki-ring:hsl(0, 0%, 3.9%);--seki-bg-primary:var(--seki-background);--seki-bg-secondary:var(--seki-muted);--seki-bg-tertiary:var(--seki-accent);--seki-text-primary:var(--seki-foreground);--seki-text-secondary:var(--seki-muted-foreground);--seki-text-tertiary:var(--seki-neutral-400);--seki-border-default:var(--seki-border);--seki-border-emphasis:var(--seki-neutral-300)}:root[data-theme='dark']{--seki-background:hsl(0, 0%, 3.9%);--seki-foreground:hsl(0, 0%, 98%);--seki-muted:hsl(0, 0%, 14.9%);--seki-muted-foreground:hsl(0, 0%, 63.9%);--seki-card:hsl(0, 0%, 3.9%);--seki-card-foreground:hsl(0, 0%, 98%);--seki-popover:hsl(0, 0%, 3.9%);--seki-popover-foreground:hsl(0, 0%, 98%);--seki-border:hsl(0, 0%, 14.9%);--seki-input:hsl(0, 0%, 14.9%);--seki-primary:hsl(0, 0%, 98%);--seki-primary-foreground:hsl(0, 0%, 9%);--seki-secondary:hsl(0, 0%, 14.9%);--seki-secondary-foreground:hsl(0, 0%, 98%);--seki-accent:hsl(0, 0%, 14.9%);--seki-accent-foreground:hsl(0, 0%, 98%);--seki-destructive:hsl(0, 62.8%, 30.6%);--seki-destructive-foreground:hsl(0, 0%, 98%);--seki-ring:hsl(0, 0%, 83.1%);--seki-bg-primary:var(--seki-background);--seki-bg-secondary:var(--seki-muted);--seki-bg-tertiary:var(--seki-accent);--seki-text-primary:var(--seki-foreground);--seki-text-secondary:var(--seki-muted-foreground);--seki-text-tertiary:var(--seki-neutral-600);--seki-border-default:var(--seki-border);--seki-border-emphasis:var(--seki-neutral-700);--seki-button-primary-hover-bg:hsl(0, 0%, 98%, 0.9);--seki-button-secondary-hover-bg:hsl(0, 0%, 14.9%, 0.8)}:root{--seki-button-primary-bg:var(--seki-primary);--seki-button-primary-text:var(--seki-primary-foreground);--seki-button-primary-border:transparent;--seki-button-primary-hover-bg:hsl(0, 0%, 9%, 0.9);--seki-button-primary-hover-text:var(--seki-primary-foreground);--seki-button-primary-hover-border:transparent;--seki-button-secondary-bg:var(--seki-secondary);--seki-button-secondary-text:var(--seki-secondary-foreground);--seki-button-secondary-border:transparent;--seki-button-secondary-hover-bg:hsl(0, 0%, 96.1%, 0.8);--seki-button-secondary-hover-text:var(--seki-secondary-foreground);--seki-button-secondary-hover-border:transparent;--seki-button-outline-bg:transparent;--seki-button-outline-text:var(--seki-foreground);--seki-button-outline-border:var(--seki-input);--seki-button-outline-hover-bg:var(--seki-accent);--seki-button-outline-hover-text:var(--seki-accent-foreground);--seki-button-outline-hover-border:var(--seki-input);--seki-button-ghost-bg:transparent;--seki-button-ghost-text:var(--seki-foreground);--seki-button-ghost-border:transparent;--seki-button-ghost-hover-bg:var(--seki-accent);--seki-button-ghost-hover-text:var(--seki-accent-foreground);--seki-button-ghost-hover-border:transparent;--seki-button-destructive-bg:var(--seki-destructive);--seki-button-destructive-text:var(--seki-destructive-foreground);--seki-button-destructive-border:transparent;--seki-button-destructive-hover-bg:hsl(0, 84.2%, 60.2%, 0.9);--seki-button-destructive-hover-border:transparent;--seki-button-sm-padding-x:var(--seki-spacing-3, 0.75rem);--seki-button-sm-padding-y:0.375rem;--seki-button-sm-font-size:var(--seki-text-sm, 0.875rem);--seki-button-sm-height:2.25rem;--seki-button-md-padding-x:var(--seki-spacing-4, 1rem);--seki-button-md-padding-y:var(--seki-spacing-2, 0.5rem);--seki-button-md-font-size:var(--seki-text-base, 1rem);--seki-button-md-height:2.5rem;--seki-button-lg-padding-x:2rem;--seki-button-lg-padding-y:0.5rem;--seki-button-lg-font-size:1rem;--seki-button-lg-height:2.75rem;--seki-button-icon-sm-size:2rem;--seki-button-icon-size:2.5rem;--seki-button-icon-lg-size:3rem;--seki-button-icon-gap:0.5rem;--seki-button-link-bg:transparent;--seki-button-link-text:var(--seki-primary);--seki-button-link-border:transparent;--seki-button-link-hover-bg:transparent;--seki-button-link-hover-text:var(--seki-primary);--seki-button-link-hover-border:transparent;--seki-button-radius:var(--seki-radius-md, 0.375rem);--seki-button-font-weight:var(--seki-font-medium, 500);--seki-button-transition-duration:150ms;--seki-button-transition-timing:ease-in-out;--seki-button-shadow:var(--seki-shadow-sm, 0 1px 2px 0 rgb(0 0 0 / 0.05));--seki-button-shadow-hover:var(--seki-shadow-md, 0 4px 6px -1px rgb(0 0 0 / 0.1));--seki-button-disabled-opacity:0.5;--seki-input-bg:var(--seki-background);--seki-input-border:var(--seki-border);--seki-input-text:var(--seki-foreground);--seki-input-placeholder:var(--seki-muted-foreground);--seki-input-ring:var(--seki-ring);--seki-input-invalid-border:var(--seki-destructive);--seki-input-invalid-ring:var(--seki-destructive);--seki-input-disabled-opacity:0.5;--seki-input-radius:var(--seki-radius-md)}:root{--seki-spacing-0:0;--seki-spacing-0-5:0.125rem;--seki-spacing-1:0.25rem;--seki-spacing-1-5:0.375rem;--seki-spacing-2:0.5rem;--seki-spacing-2-5:0.625rem;--seki-spacing-3:0.75rem;--seki-spacing-3-5:0.875rem;--seki-spacing-4:1rem;--seki-spacing-5:1.25rem;--seki-spacing-6:1.5rem;--seki-spacing-8:2rem;--seki-spacing-10:2.5rem;--seki-spacing-12:3rem;--seki-spacing-16:4rem;--seki-spacing-20:5rem;--seki-spacing-24:6rem;--seki-input-height-sm:2rem;--seki-input-height-md:2.5rem;--seki-input-height-lg:3rem;--seki-input-padding-x:0.75rem;--seki-input-padding-y:0.5rem;--seki-input-font-size:0.875rem;--seki-input-ring-offset:2px}:root{--seki-shadow-sm:0 1px 2px 0 rgb(0 0 0 / 0.05);--seki-shadow-md:0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);--seki-shadow-lg:0 10px 15px -3px rgb(0 0 0 / 0.15), 0 4px 6px -4px rgb(0 0 0 / 0.1)}:root{--seki-font-sans:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue',\n Arial, sans-serif;--seki-font-mono:ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;--seki-text-xs:0.75rem;--seki-text-sm:0.875rem;--seki-text-base:1rem;--seki-text-lg:1.125rem;--seki-text-xl:1.25rem;--seki-text-2xl:1.5rem;--seki-text-3xl:1.875rem;--seki-text-4xl:2.25rem;--seki-font-normal:400;--seki-font-medium:500;--seki-font-semibold:600;--seki-font-bold:700;--seki-leading-tight:1.25;--seki-leading-normal:1.5;--seki-leading-relaxed:1.75}:root{--seki-radius-sm:0.25rem;--seki-radius-md:0.375rem;--seki-radius-lg:0.5rem;--seki-radius-xl:1rem;}:host{display:inline-block}.skeleton{background-color:var(--seki-muted);border-radius:var(--seki-skeleton-radius, var(--seki-radius-md, 0.375rem));width:100%;height:100%;animation:skeleton-pulse 2s ease-in-out infinite}@keyframes skeleton-pulse{0%,100%{opacity:1}50%{opacity:0.5}}@media (prefers-reduced-motion: reduce){.skeleton{animation:none}}";
|
|
6
6
|
|
|
7
7
|
const SekiSkeleton = class {
|
|
8
8
|
constructor(hostRef) {
|
|
@@ -17,7 +17,7 @@ const SekiSkeleton = class {
|
|
|
17
17
|
}
|
|
18
18
|
}
|
|
19
19
|
render() {
|
|
20
|
-
return (index.h("div", { key: '
|
|
20
|
+
return (index.h("div", { key: 'bec517952ab40cb8ff0eeca29511a2589e1d952a', class: "skeleton", part: "skeleton", role: "status", "aria-busy": "true", "aria-label": this.ariaLabel || undefined }));
|
|
21
21
|
}
|
|
22
22
|
};
|
|
23
23
|
SekiSkeleton.style = sekiSkeletonCss;
|
package/dist/cjs/sekiui.cjs.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-dzrwTIbP.js');
|
|
4
4
|
var appGlobals = require('./app-globals-V2Kpy_OQ.js');
|
|
5
5
|
|
|
6
6
|
var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
|
|
@@ -19,7 +19,7 @@ var patchBrowser = () => {
|
|
|
19
19
|
|
|
20
20
|
patchBrowser().then(async (options) => {
|
|
21
21
|
await appGlobals.globalScripts();
|
|
22
|
-
return index.bootstrapLazy([["seki-button.cjs",[[257,"seki-button",{"variant":[1],"size":[1],"disabled":[4],"type":[1],"ariaLabel":[1,"aria-label"]}]]],["seki-input.cjs",[[257,"seki-input",{"type":[1],"value":[1537],"placeholder":[1],"disabled":[4],"readonly":[4],"required":[4],"name":[1],"autocomplete":[1],"min":[8],"max":[8],"step":[8],"pattern":[1],"minlength":[2],"maxlength":[2],"size":[1],"invalid":[4],"ariaLabel":[1,"aria-label"],"ariaDescribedby":[1,"aria-describedby"]}]]],["seki-skeleton.cjs",[[257,"seki-skeleton",{"ariaLabel":[1,"aria-label"]}]]]], options);
|
|
22
|
+
return index.bootstrapLazy([["seki-button.cjs",[[257,"seki-button",{"variant":[1],"size":[1],"disabled":[4],"type":[1],"ariaLabel":[1,"aria-label"]}]]],["seki-input.cjs",[[257,"seki-input",{"type":[1],"value":[1537],"placeholder":[1],"disabled":[4],"readonly":[4],"required":[4],"name":[1],"autocomplete":[1],"min":[8],"max":[8],"step":[8],"pattern":[1],"minlength":[2],"maxlength":[2],"size":[1],"invalid":[4],"ariaLabel":[1,"aria-label"],"ariaDescribedby":[1,"aria-describedby"]}]]],["seki-skeleton.cjs",[[257,"seki-skeleton",{"ariaLabel":[1,"aria-label"]}]]],["seki-switch.cjs",[[257,"seki-switch",{"checked":[4],"defaultChecked":[4,"default-checked"],"disabled":[4],"required":[4],"name":[1],"value":[1],"ariaLabel":[1,"aria-label"],"internalChecked":[32]},[[0,"keydown","handleKeyDown"]]]]]], options);
|
|
23
23
|
});
|
|
24
24
|
|
|
25
25
|
exports.setNonce = index.setNonce;
|
|
@@ -27,7 +27,7 @@ export class SekiButton {
|
|
|
27
27
|
}
|
|
28
28
|
}
|
|
29
29
|
render() {
|
|
30
|
-
return (h("button", { key: '
|
|
30
|
+
return (h("button", { key: '3cc4cf0af6075fbe012388fa5adb953b64a2b1ca', class: `button button--${this.variant} button--${this.size}`, type: this.type, disabled: this.disabled, "aria-disabled": this.disabled ? 'true' : null, "aria-label": this.ariaLabel }, h("slot", { key: '7c90c49539e6721b6580a07c3f97e20148734b05' })));
|
|
31
31
|
}
|
|
32
32
|
static get is() { return "seki-button"; }
|
|
33
33
|
static get encapsulation() { return "shadow"; }
|
|
@@ -48,7 +48,7 @@ export class SekiInput {
|
|
|
48
48
|
};
|
|
49
49
|
}
|
|
50
50
|
render() {
|
|
51
|
-
return (h("input", { key: '
|
|
51
|
+
return (h("input", { key: 'cd99fbb418e453c5af869e9ec6d1f8abd2e17483', type: this.type, value: this.value, placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, name: this.name, autocomplete: this.autocomplete, min: this.min, max: this.max, step: this.step, pattern: this.pattern, minlength: this.minlength, maxlength: this.maxlength, class: `input input--${this.size}${this.invalid ? ' input--invalid' : ''}`, "aria-label": this.ariaLabel, "aria-describedby": this.ariaDescribedby, "aria-invalid": this.invalid ? 'true' : null, "aria-disabled": this.disabled ? 'true' : null, onInput: this.handleInput, onChange: this.handleChange, onFocus: this.handleFocus, onBlur: this.handleBlur }));
|
|
52
52
|
}
|
|
53
53
|
static get is() { return "seki-input"; }
|
|
54
54
|
static get encapsulation() { return "shadow"; }
|
|
@@ -360,7 +360,7 @@
|
|
|
360
360
|
|
|
361
361
|
.skeleton {
|
|
362
362
|
background-color: var(--seki-muted);
|
|
363
|
-
border-radius: var(--seki-radius-md, 0.375rem);
|
|
363
|
+
border-radius: var(--seki-skeleton-radius, var(--seki-radius-md, 0.375rem));
|
|
364
364
|
width: 100%;
|
|
365
365
|
height: 100%;
|
|
366
366
|
animation: skeleton-pulse 2s ease-in-out infinite;
|
|
@@ -15,7 +15,7 @@ export class SekiSkeleton {
|
|
|
15
15
|
}
|
|
16
16
|
}
|
|
17
17
|
render() {
|
|
18
|
-
return (h("div", { key: '
|
|
18
|
+
return (h("div", { key: 'bec517952ab40cb8ff0eeca29511a2589e1d952a', class: "skeleton", part: "skeleton", role: "status", "aria-busy": "true", "aria-label": this.ariaLabel || undefined }));
|
|
19
19
|
}
|
|
20
20
|
static get is() { return "seki-skeleton"; }
|
|
21
21
|
static get encapsulation() { return "shadow"; }
|
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
:host {
|
|
2
|
+
/* Ensure minimum touch target (WCAG 2.1 Level AAA) */
|
|
3
|
+
display: inline-flex;
|
|
4
|
+
align-items: center;
|
|
5
|
+
justify-content: center;
|
|
6
|
+
min-width: 44px;
|
|
7
|
+
min-height: 44px;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.switch {
|
|
11
|
+
/* Dimensions with CSS custom properties */
|
|
12
|
+
width: var(--seki-switch-width, 2.75rem);
|
|
13
|
+
height: var(--seki-switch-height, 1.5rem);
|
|
14
|
+
|
|
15
|
+
/* Layout */
|
|
16
|
+
position: relative;
|
|
17
|
+
display: inline-flex;
|
|
18
|
+
align-items: center;
|
|
19
|
+
flex-shrink: 0;
|
|
20
|
+
|
|
21
|
+
/* Background colors */
|
|
22
|
+
background-color: var(--seki-switch-bg-unchecked, hsl(var(--muted, 240 4.8% 95.9%)));
|
|
23
|
+
|
|
24
|
+
/* Border radius */
|
|
25
|
+
border-radius: 9999px;
|
|
26
|
+
|
|
27
|
+
/* Cursor */
|
|
28
|
+
cursor: pointer;
|
|
29
|
+
|
|
30
|
+
/* Transition */
|
|
31
|
+
transition: background-color var(--seki-switch-transition-duration, 150ms) ease-out;
|
|
32
|
+
|
|
33
|
+
/* Outline for focus */
|
|
34
|
+
outline: none;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
.switch:focus-visible {
|
|
38
|
+
outline: 2px solid var(--seki-switch-focus-ring, hsl(var(--ring, 240 5% 64.9%)));
|
|
39
|
+
outline-offset: 2px;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
/* Checked state */
|
|
43
|
+
:host([data-state="checked"]) .switch {
|
|
44
|
+
background-color: var(--seki-switch-bg-checked, hsl(var(--primary, 240 5.9% 10%)));
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
/* Disabled state */
|
|
48
|
+
:host([data-disabled]) .switch {
|
|
49
|
+
background-color: var(--seki-switch-bg-disabled, hsl(var(--muted, 240 4.8% 95.9%) / 0.5));
|
|
50
|
+
cursor: not-allowed;
|
|
51
|
+
opacity: 0.5;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
/* Thumb element */
|
|
55
|
+
.thumb {
|
|
56
|
+
/* Dimensions */
|
|
57
|
+
width: var(--seki-switch-thumb-size, 1.25rem);
|
|
58
|
+
height: var(--seki-switch-thumb-size, 1.25rem);
|
|
59
|
+
|
|
60
|
+
/* Background */
|
|
61
|
+
background-color: var(--seki-switch-thumb-bg, hsl(var(--background, 0 0% 100%)));
|
|
62
|
+
|
|
63
|
+
/* Position */
|
|
64
|
+
position: absolute;
|
|
65
|
+
left: 0.125rem;
|
|
66
|
+
|
|
67
|
+
/* Shape */
|
|
68
|
+
border-radius: 50%;
|
|
69
|
+
|
|
70
|
+
/* Shadow for depth */
|
|
71
|
+
box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
|
|
72
|
+
|
|
73
|
+
/* Transition */
|
|
74
|
+
transition: transform var(--seki-switch-transition-duration, 150ms) ease-out;
|
|
75
|
+
|
|
76
|
+
/* Pointer events */
|
|
77
|
+
pointer-events: none;
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
/* Thumb position when checked */
|
|
81
|
+
:host([data-state="checked"]) .thumb {
|
|
82
|
+
transform: translateX(calc(var(--seki-switch-width, 2.75rem) - var(--seki-switch-thumb-size, 1.25rem) - 0.25rem));
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
/* Dark mode support (optional, can be overridden by users) */
|
|
86
|
+
@media (prefers-color-scheme: dark) {
|
|
87
|
+
.switch {
|
|
88
|
+
--seki-switch-bg-unchecked: hsl(var(--muted, 240 3.7% 15.9%));
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
.thumb {
|
|
92
|
+
--seki-switch-thumb-bg: hsl(var(--background, 240 10% 3.9%));
|
|
93
|
+
}
|
|
94
|
+
}
|