@iyulab/components 1.18.0 → 1.20.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/CHANGELOG.md +190 -0
- package/dist/_virtual/_glob-assets_raw/dark.css.e8ac080d.js +1 -1
- package/dist/_virtual/_glob-assets_raw/light.css.637cb2f8.js +1 -1
- package/dist/components/UElement.styles.js +8 -3
- package/dist/components/alert/UAlert.styles.js +3 -1
- package/dist/components/badge/UBadge.d.ts +2 -1
- package/dist/components/badge/UBadge.styles.js +25 -1
- package/dist/components/button/UButton.d.ts +22 -3
- package/dist/components/button/UButton.styles.js +97 -8
- package/dist/components/card/UCard.styles.js +2 -2
- package/dist/components/carousel/UCarousel.styles.js +2 -2
- package/dist/components/checkbox/UCheckbox.d.ts +2 -1
- package/dist/components/checkbox/UCheckbox.styles.js +37 -4
- package/dist/components/dialog/UDialog.styles.js +1 -1
- package/dist/components/drawer/UDrawer.styles.js +1 -1
- package/dist/components/input/UInput.styles.js +7 -7
- package/dist/components/menu-item/UMenuItem.styles.js +1 -1
- package/dist/components/progress-bar/UProgressBar.styles.js +5 -5
- package/dist/components/progress-ring/UProgressRing.styles.js +5 -5
- package/dist/components/rating/URating.styles.js +2 -2
- package/dist/components/select/USelect.styles.js +9 -7
- package/dist/components/slider/USlider.styles.js +10 -2
- package/dist/components/spinner/USpinner.d.ts +2 -1
- package/dist/components/spinner/USpinner.styles.js +8 -0
- package/dist/components/split-panel/USplitPanel.styles.js +1 -1
- package/dist/components/switch/USwitch.styles.js +3 -3
- package/dist/components/tab-panel/UTabPanel.styles.js +1 -1
- package/dist/components/tag/UTag.d.ts +6 -1
- package/dist/components/tag/UTag.styles.js +54 -1
- package/dist/components/textarea/UTextarea.styles.js +6 -6
- package/dist/components/tooltip/UTooltip.styles.js +1 -1
- package/dist/styles/dark.css +12 -2
- package/dist/styles/light.css +27 -2
- package/package.json +4 -3
package/dist/styles/light.css
CHANGED
|
@@ -259,10 +259,14 @@
|
|
|
259
259
|
--u-border-color-strong: var(--u-neutral-400);
|
|
260
260
|
--u-border-color-hover: var(--u-neutral-400);
|
|
261
261
|
|
|
262
|
+
/* ★상태 테두리는 `-strong` 단이다 — 면이 아니라 **면 위에 그리는 선**이기 때문이다.
|
|
263
|
+
1.16.0 이 가른 용도(`-color` = 면 / `-strong` = 면·바탕 위)에 이 자리가 맞춰지지
|
|
264
|
+
않아 다크에서 미달이었다: focus 2.74 · invalid 2.44 (WCAG 1.4.11 기준 3.0).
|
|
265
|
+
`-strong` 으로 옮기면 다크 4.74 / 4.34, 라이트 5.75 / 5.62 — 두 테마 모두 단조 상승. */
|
|
262
266
|
--u-input-border-color: var(--u-neutral-300);
|
|
263
267
|
--u-input-border-color-hover: var(--u-neutral-400);
|
|
264
|
-
--u-input-border-color-focus: var(--u-primary-color);
|
|
265
|
-
--u-input-border-color-invalid: var(--u-danger-color);
|
|
268
|
+
--u-input-border-color-focus: var(--u-primary-color-strong);
|
|
269
|
+
--u-input-border-color-invalid: var(--u-danger-color-strong);
|
|
266
270
|
|
|
267
271
|
/* Background Colors */
|
|
268
272
|
--u-bg-color: var(--u-neutral-0);
|
|
@@ -311,6 +315,27 @@
|
|
|
311
315
|
--u-shadow-color-strong: rgba(0, 0, 0, 0.16);
|
|
312
316
|
--u-shadow-color-stronger: rgba(0, 0, 0, 0.24);
|
|
313
317
|
|
|
318
|
+
/* ==========================================================================
|
|
319
|
+
Elevation Scale — 높이(그림자)
|
|
320
|
+
|
|
321
|
+
★색 축은 있었지만 **높이 축이 없었다.** 그 결과 컴포넌트가 그림자를 리터럴로
|
|
322
|
+
썼고, 같은 리듬을 의도한 자리에 서로 다른 값 11가지가 생겼다(카드 .1 vs 캐러셀
|
|
323
|
+
.15 — 둘 다 "표면에 얹힌 카드"인데 알파가 다르다).
|
|
324
|
+
|
|
325
|
+
⚠**그리고 그 리터럴들은 테마를 몰랐다** — `rgba(0,0,0,.1)` 은 다크 바탕에서
|
|
326
|
+
거의 보이지 않는다. 이 축을 경유하면 다크의 진한 알파(.25~.60)를 자동으로 받는다.
|
|
327
|
+
|
|
328
|
+
⚠**알파를 `--u-shadow-color-*` 로 중첩하지 않고 인라인한다.** use-site 폴백
|
|
329
|
+
생성기는 합성 값을 리터럴로 다루므로, 중첩하면 `var(--u-shadow-md, 0 2px 8px
|
|
330
|
+
var(--u-shadow-color-normal))` 처럼 **폴백 안에 또 토큰이 들어간다** — 시트가
|
|
331
|
+
없을 때 그 폴백도 함께 무효가 되어 그림자가 통째로 사라진다.
|
|
332
|
+
두 축의 알파가 어긋나지 않는지는 `tests/build/elevation-scale.test.ts` 가 지킨다.
|
|
333
|
+
========================================================================== */
|
|
334
|
+
--u-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08); /* = shadow-color-weak — 표면에 얹힌 작은 컨트롤(탭·손잡이) */
|
|
335
|
+
--u-shadow-md: 0 2px 8px rgba(0, 0, 0, 0.12); /* = shadow-color-normal — 카드·표면 */
|
|
336
|
+
--u-shadow-lg: 0 4px 12px rgba(0, 0, 0, 0.16); /* = shadow-color-strong — 떠 있는 레이어(드롭다운·알림) */
|
|
337
|
+
--u-shadow-xl: 0 6px 18px rgba(0, 0, 0, 0.24); /* = shadow-color-stronger — 모달·최상위(대화상자·툴팁) */
|
|
338
|
+
|
|
314
339
|
/* Scrollbar Colors */
|
|
315
340
|
--u-scrollbar-color: var(--u-neutral-400);
|
|
316
341
|
--u-scrollbar-color-hover: var(--u-neutral-500);
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@iyulab/components",
|
|
3
3
|
"description": "web-components library based on lit-element made by iyulab",
|
|
4
|
-
"version": "1.
|
|
4
|
+
"version": "1.20.0",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"iyulab",
|
|
7
7
|
"components",
|
|
@@ -53,7 +53,9 @@
|
|
|
53
53
|
"dependencies": {
|
|
54
54
|
"@floating-ui/dom": "^1.8.0",
|
|
55
55
|
"focus-trap": "^8.2.2",
|
|
56
|
-
"
|
|
56
|
+
"glob": "^13.0.6",
|
|
57
|
+
"lit": "^3.3.3",
|
|
58
|
+
"tabbable": "^6.5.0"
|
|
57
59
|
},
|
|
58
60
|
"peerDependencies": {
|
|
59
61
|
"@lit/react": ">=1.0.8",
|
|
@@ -74,7 +76,6 @@
|
|
|
74
76
|
"@vitest/browser-playwright": "^4.1.10",
|
|
75
77
|
"eslint": "^9.39.4",
|
|
76
78
|
"eslint-plugin-lit": "^2.3.1",
|
|
77
|
-
"glob": "^13.0.6",
|
|
78
79
|
"globals": "^17.7.0",
|
|
79
80
|
"react": "^19.2.7",
|
|
80
81
|
"typescript": "^5.9.3",
|