@iyulab/components 1.13.0 → 1.14.1

package/dist/components/tag/UTag.styles.js

@@ -2,9 +2,9 @@ import { css } from "lit";
 //#region src/components/tag/UTag.styles.ts
 var styles = css`
   :host {
-    --tag-fill-color: var(--u-primary-color);
-    --tag-color: var(--u-neutral-800);
-    --tag-bg-color: var(--u-neutral-100);
+    --tag-fill-color: var(--u-primary-color, #1E88E5);
+    --tag-color: var(--u-neutral-800, #424242);
+    --tag-bg-color: var(--u-neutral-100, #F5F5F5);
     --tag-border-color: transparent;
   }
 
@@ -16,73 +16,73 @@ var styles = css`
      슬롯이 비면(color="neutral") variant 규칙의 폴백 = 브랜드 경로를 탄다.
      ========================================================================== */
   :host([color="blue"]) {
-    --tag-hue-solid: var(--u-blue-500);
-    --tag-hue-line: var(--u-blue-300);
-    --tag-hue-surface: var(--u-blue-100);
-    --tag-hue-text: var(--u-blue-800);
-    --tag-hue-text-outlined: var(--u-blue-600);
+    --tag-hue-solid: var(--u-blue-500, #2196F3);
+    --tag-hue-line: var(--u-blue-300, #64B5F6);
+    --tag-hue-surface: var(--u-blue-100, #BBDEFB);
+    --tag-hue-text: var(--u-blue-800, #1565C0);
+    --tag-hue-text-outlined: var(--u-blue-600, #1E88E5);
   }
   :host([color="green"]) {
-    --tag-hue-solid: var(--u-green-500);
-    --tag-hue-line: var(--u-green-300);
-    --tag-hue-surface: var(--u-green-100);
-    --tag-hue-text: var(--u-green-800);
-    --tag-hue-text-outlined: var(--u-green-600);
+    --tag-hue-solid: var(--u-green-500, #4CAF50);
+    --tag-hue-line: var(--u-green-300, #81C784);
+    --tag-hue-surface: var(--u-green-100, #C8E6C9);
+    --tag-hue-text: var(--u-green-800, #2E7D32);
+    --tag-hue-text-outlined: var(--u-green-600, #43A047);
   }
    /* yellow 는 명도가 높아 solid·outlined 텍스트를 한 단 진하게 쓴다 */
   :host([color="yellow"]) {
-    --tag-hue-solid: var(--u-yellow-600);
-    --tag-hue-line: var(--u-yellow-300);
-    --tag-hue-surface: var(--u-yellow-100);
-    --tag-hue-text: var(--u-yellow-800);
-    --tag-hue-text-outlined: var(--u-yellow-700);
+    --tag-hue-solid: var(--u-yellow-600, #FDD835);
+    --tag-hue-line: var(--u-yellow-300, #FFF176);
+    --tag-hue-surface: var(--u-yellow-100, #FFF9C4);
+    --tag-hue-text: var(--u-yellow-800, #F9A825);
+    --tag-hue-text-outlined: var(--u-yellow-700, #FBC02D);
   }
   :host([color="red"]) {
-    --tag-hue-solid: var(--u-red-500);
-    --tag-hue-line: var(--u-red-300);
-    --tag-hue-surface: var(--u-red-100);
-    --tag-hue-text: var(--u-red-800);
-    --tag-hue-text-outlined: var(--u-red-600);
+    --tag-hue-solid: var(--u-red-500, #F44336);
+    --tag-hue-line: var(--u-red-300, #E57373);
+    --tag-hue-surface: var(--u-red-100, #FFCDD2);
+    --tag-hue-text: var(--u-red-800, #C62828);
+    --tag-hue-text-outlined: var(--u-red-600, #E53935);
   }
   :host([color="orange"]) {
-    --tag-hue-solid: var(--u-orange-500);
-    --tag-hue-line: var(--u-orange-300);
-    --tag-hue-surface: var(--u-orange-100);
-    --tag-hue-text: var(--u-orange-800);
-    --tag-hue-text-outlined: var(--u-orange-600);
+    --tag-hue-solid: var(--u-orange-500, #FF9800);
+    --tag-hue-line: var(--u-orange-300, #FFB74D);
+    --tag-hue-surface: var(--u-orange-100, #FFE0B2);
+    --tag-hue-text: var(--u-orange-800, #EF6C00);
+    --tag-hue-text-outlined: var(--u-orange-600, #FB8C00);
   }
   :host([color="teal"]) {
-    --tag-hue-solid: var(--u-teal-500);
-    --tag-hue-line: var(--u-teal-300);
-    --tag-hue-surface: var(--u-teal-100);
-    --tag-hue-text: var(--u-teal-800);
-    --tag-hue-text-outlined: var(--u-teal-600);
+    --tag-hue-solid: var(--u-teal-500, #009688);
+    --tag-hue-line: var(--u-teal-300, #4DB6AC);
+    --tag-hue-surface: var(--u-teal-100, #B2DFDB);
+    --tag-hue-text: var(--u-teal-800, #00695C);
+    --tag-hue-text-outlined: var(--u-teal-600, #00897B);
   }
   :host([color="cyan"]) {
-    --tag-hue-solid: var(--u-cyan-500);
-    --tag-hue-line: var(--u-cyan-300);
-    --tag-hue-surface: var(--u-cyan-100);
-    --tag-hue-text: var(--u-cyan-800);
-    --tag-hue-text-outlined: var(--u-cyan-600);
+    --tag-hue-solid: var(--u-cyan-500, #00BCD4);
+    --tag-hue-line: var(--u-cyan-300, #4DD0E1);
+    --tag-hue-surface: var(--u-cyan-100, #B2EBF2);
+    --tag-hue-text: var(--u-cyan-800, #00838F);
+    --tag-hue-text-outlined: var(--u-cyan-600, #00ACC1);
   }
   :host([color="purple"]) {
-    --tag-hue-solid: var(--u-purple-500);
-    --tag-hue-line: var(--u-purple-300);
-    --tag-hue-surface: var(--u-purple-100);
-    --tag-hue-text: var(--u-purple-800);
-    --tag-hue-text-outlined: var(--u-purple-600);
+    --tag-hue-solid: var(--u-purple-500, #9C27B0);
+    --tag-hue-line: var(--u-purple-300, #BA68C8);
+    --tag-hue-surface: var(--u-purple-100, #E1BEE7);
+    --tag-hue-text: var(--u-purple-800, #6A1B9A);
+    --tag-hue-text-outlined: var(--u-purple-600, #8E24AA);
   }
   :host([color="pink"]) {
-    --tag-hue-solid: var(--u-pink-500);
-    --tag-hue-line: var(--u-pink-300);
-    --tag-hue-surface: var(--u-pink-100);
-    --tag-hue-text: var(--u-pink-800);
-    --tag-hue-text-outlined: var(--u-pink-600);
+    --tag-hue-solid: var(--u-pink-500, #E91E63);
+    --tag-hue-line: var(--u-pink-300, #F06292);
+    --tag-hue-surface: var(--u-pink-100, #F8BBD0);
+    --tag-hue-text: var(--u-pink-800, #AD1457);
+    --tag-hue-text-outlined: var(--u-pink-600, #D81B60);
   }
 
   /* Variant: solid (강한 채움, 색 미지정 시 --tag-fill-color = 브랜드) */
   :host([variant="solid"]) {
-    --tag-color: var(--u-neutral-0);
+    --tag-color: var(--u-neutral-0, #FFFFFF);
     --tag-bg-color: var(--tag-hue-solid, var(--tag-fill-color));
     --tag-border-color: var(--tag-hue-solid, var(--tag-fill-color));
   }
@@ -90,14 +90,14 @@ var styles = css`
   /* Variant: surface (채우기 + 테두리, 기본 색상은 --u-primary-color) */
   :host([variant="surface"]) {
     --tag-color: var(--tag-hue-text, color-mix(in srgb, var(--tag-fill-color) 70%, black));
-    --tag-bg-color: var(--tag-hue-surface, color-mix(in srgb, var(--tag-fill-color) 15%, var(--u-bg-color)));
-    --tag-border-color: var(--tag-hue-line, color-mix(in srgb, var(--tag-fill-color) 40%, var(--u-bg-color)));
+    --tag-bg-color: var(--tag-hue-surface, color-mix(in srgb, var(--tag-fill-color) 15%, var(--u-bg-color, #FFFFFF)));
+    --tag-border-color: var(--tag-hue-line, color-mix(in srgb, var(--tag-fill-color) 40%, var(--u-bg-color, #FFFFFF)));
   }
 
   /* Variant: filled (채우기만, 테두리 없음, 기본 색상은 --u-primary-color) */
   :host([variant="filled"]) {
     --tag-color: var(--tag-hue-text, color-mix(in srgb, var(--tag-fill-color) 70%, black));
-    --tag-bg-color: var(--tag-hue-surface, color-mix(in srgb, var(--tag-fill-color) 15%, var(--u-bg-color)));
+    --tag-bg-color: var(--tag-hue-surface, color-mix(in srgb, var(--tag-fill-color) 15%, var(--u-bg-color, #FFFFFF)));
     --tag-border-color: transparent;
   }
 
@@ -105,14 +105,14 @@ var styles = css`
   :host([variant="outlined"]) {
     --tag-color: var(--tag-hue-text-outlined, color-mix(in srgb, var(--tag-fill-color) 85%, black));
     --tag-bg-color: transparent;
-    --tag-border-color: var(--tag-hue-line, color-mix(in srgb, var(--tag-fill-color) 40%, var(--u-bg-color)));
+    --tag-border-color: var(--tag-hue-line, color-mix(in srgb, var(--tag-fill-color) 40%, var(--u-bg-color, #FFFFFF)));
   }
 
   :host {
     display: inline-flex;
     font-size: 12px;
     font-weight: 500;
-    border-radius: var(--u-radius-md);
+    border-radius: var(--u-radius-md, 4px);
 
     --tag-padding-block: 0.25em;
     --tag-padding-inline: 0.5em;
@@ -137,7 +137,7 @@ var styles = css`
     border-radius: inherit;
   }
   :host([rounded]) {
-    border-radius: var(--u-radius-pill);
+    border-radius: var(--u-radius-pill, 9999px);
   }
 
   /*

package/dist/components/textarea/UTextarea.styles.js

@@ -3,7 +3,7 @@ import { css } from "lit";
 var styles = css`
   :host {
     display: inline-block;
-    color: var(--u-txt-color);
+    color: var(--u-txt-color, #212121);
     font-size: inherit;
     font-family: var(--u-font-base);
   }
@@ -12,84 +12,84 @@ var styles = css`
   .container {
     display: flex;
     padding: 0.3em 0.6em;
-    border: 1px solid var(--u-input-border-color);
+    border: 1px solid var(--u-input-border-color, #E0E0E0);
     border-radius: 0.25em;
-    background-color: var(--u-input-bg-color);
+    background-color: var(--u-input-bg-color, #FFFFFF);
     transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
   }
   :host([readonly]) .container,
   :host([disabled]) .container {
-    border-color: var(--u-border-color-weak);
-    background-color: var(--u-bg-color-disabled);
+    border-color: var(--u-border-color-weak, #EEEEEE);
+    background-color: var(--u-bg-color-disabled, #FAFAFA);
   }
   :host(:not([readonly]):not([disabled])) .container:hover {
-    box-shadow: 0 0 0 1px var(--u-input-border-color-hover);
+    box-shadow: 0 0 0 1px var(--u-input-border-color-hover, #BDBDBD);
   }
   :host(:not([readonly]):not([disabled])) .container:focus-within {
-    box-shadow: 0 0 0 1px var(--u-input-border-color-focus);
+    box-shadow: 0 0 0 1px var(--u-input-border-color-focus, #1E88E5);
   }
   :host([invalid]:not([readonly]):not([disabled])) .container {
-    box-shadow: 0 0 0 1px var(--u-input-border-color-invalid);
+    box-shadow: 0 0 0 1px var(--u-input-border-color-invalid, #E53935);
   }
 
   /* ===== Variant: filled ===== */
   :host([variant="filled"]) .container {
     border-color: transparent;
-    background-color: var(--u-neutral-200);
+    background-color: var(--u-neutral-200, #EEEEEE);
     border-radius: 0.25em 0.25em 0 0;
-    border-bottom: 2px solid var(--u-input-border-color);
+    border-bottom: 2px solid var(--u-input-border-color, #E0E0E0);
   }
   :host([variant="filled"][readonly]) .container,
   :host([variant="filled"][disabled]) .container {
-    background-color: var(--u-bg-color-disabled);
-    border-bottom-color: var(--u-border-color-weak);
+    background-color: var(--u-bg-color-disabled, #FAFAFA);
+    border-bottom-color: var(--u-border-color-weak, #EEEEEE);
   }
   :host([variant="filled"]:not([readonly]):not([disabled])) .container:hover {
     box-shadow: none;
-    background-color: var(--u-neutral-300);
-    border-bottom-color: var(--u-input-border-color-hover);
+    background-color: var(--u-neutral-300, #E0E0E0);
+    border-bottom-color: var(--u-input-border-color-hover, #BDBDBD);
   }
   :host([variant="filled"]:not([readonly]):not([disabled])) .container:focus-within {
     box-shadow: none;
-    border-bottom-color: var(--u-input-border-color-focus);
+    border-bottom-color: var(--u-input-border-color-focus, #1E88E5);
   }
   :host([variant="filled"][invalid]:not([readonly]):not([disabled])) .container {
     box-shadow: none;
-    border-bottom-color: var(--u-input-border-color-invalid);
+    border-bottom-color: var(--u-input-border-color-invalid, #E53935);
   }
 
   /* ===== Variant: underlined ===== */
   :host([variant="underlined"]) .container {
     border: none;
-    border-radius: var(--u-radius-none);
+    border-radius: var(--u-radius-none, 0);
     background-color: transparent;
     padding-left: 0;
     padding-right: 0;
-    border-bottom: 1px solid var(--u-input-border-color);
+    border-bottom: 1px solid var(--u-input-border-color, #E0E0E0);
   }
   :host([variant="underlined"][readonly]) .container,
   :host([variant="underlined"][disabled]) .container {
     background-color: transparent;
-    border-bottom-color: var(--u-border-color-weak);
+    border-bottom-color: var(--u-border-color-weak, #EEEEEE);
   }
   :host([variant="underlined"]:not([readonly]):not([disabled])) .container:hover {
     box-shadow: none;
-    border-bottom-color: var(--u-input-border-color-hover);
+    border-bottom-color: var(--u-input-border-color-hover, #BDBDBD);
   }
   :host([variant="underlined"]:not([readonly]):not([disabled])) .container:focus-within {
     box-shadow: none;
-    border-bottom-color: var(--u-input-border-color-focus);
+    border-bottom-color: var(--u-input-border-color-focus, #1E88E5);
     border-bottom-width: 2px;
   }
   :host([variant="underlined"][invalid]:not([readonly]):not([disabled])) .container {
     box-shadow: none;
-    border-bottom-color: var(--u-input-border-color-invalid);
+    border-bottom-color: var(--u-input-border-color-invalid, #E53935);
   }
 
   /* ===== Variant: borderless ===== */
   :host([variant="borderless"]) .container {
     border: none;
-    border-radius: var(--u-radius-none);
+    border-radius: var(--u-radius-none, 0);
     background-color: transparent;
     padding: 0;
     box-shadow: none;
@@ -117,7 +117,7 @@ var styles = css`
     word-wrap: break-word;
   }
   textarea::placeholder {
-    color: var(--u-txt-color-weak);
+    color: var(--u-txt-color-weak, #9E9E9E);
   }
   textarea:disabled {
     cursor: not-allowed;
@@ -155,7 +155,7 @@ var styles = css`
   .counter {
     margin-top: 0.25em;
     text-align: right;
-    color: var(--u-txt-color-weak);
+    color: var(--u-txt-color-weak, #9E9E9E);
     font-size: 0.75em;
     line-height: 1.2;
   }

package/dist/components/tooltip/UTooltip.styles.js

@@ -6,12 +6,12 @@ var styles = css`
   }
 
   :host {
-    color: var(--u-tooltip-txt-color);
+    color: var(--u-tooltip-txt-color, #FFFFFF);
     font-family: var(--u-font-display, inherit);
     font-size: 12px;
     line-height: 1.25;
-    border-radius: var(--u-radius-md);
-    background-color: var(--u-tooltip-bg-color);
+    border-radius: var(--u-radius-md, 4px);
+    background-color: var(--u-tooltip-bg-color, rgba(0, 0, 0, 0.75));
     box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2);
     transform: scale(0.9);
     transition: opacity 0.2s ease, transform 0.2s ease, visibility 0s 0.2s;

package/dist/components/tree/UTree.d.ts

@@ -10,7 +10,7 @@ import { UTreeItem, TreeItemTrigger } from '../tree-item/UTreeItem.js';
  * @cssprop tree-indent-guide-offset - 들여쓰기 가이드 선의 좌측 간격 (기본값: 8px)
  * @cssprop tree-indent-guide-width - 들여쓰기 가이드 선의 두께 (기본값: 1px)
  * @cssprop tree-indent-guide-style - 들여쓰기 가이드 선의 스타일 (기본값: solid)
- * @cssprop tree-indent-guide-color - 들여쓰기 가이드 선의 색상 (기본값: var(--u-border-color-weak))
+ * @cssprop tree-indent-guide-color - 들여쓰기 가이드 선의 색상 (기본값: var(--u-border-color-weak, #EEEEEE))
  *
  * @event change - 선택된 아이템이 변경될 때 발생
  *

package/dist/components/tree/UTree.styles.js

@@ -6,13 +6,16 @@ var styles = css`
     --tree-indent-guide-offset: 8px;
     --tree-indent-guide-width: 1px;
     --tree-indent-guide-style: solid;
-    --tree-indent-guide-color: var(--u-border-color-weak);
+    --tree-indent-guide-color: var(--u-border-color-weak, #EEEEEE);
   }
 
   :host {
     display: block;
-    font-size: 0.875rem;
-    color: var(--u-txt-color);
+    /* rem 이 아니라 em 이다 — 루트 기준이면 소비자가 컨테이너 타이포를 키워도
+       트리만 따라오지 않는다. 기본 상황(루트 16px)에서는 두 단위가 같은 14px 이므로
+       시각은 바뀌지 않고, 상속 컨텍스트에서만 동작이 달라진다. */
+    font-size: 0.875em;
+    color: var(--u-txt-color, #212121);
   }
 `;
 //#endregion

package/dist/components/tree-item/UTreeItem.styles.js

@@ -3,7 +3,7 @@ import { css } from "lit";
 var styles = css`
   :host {
     --tree-item-depth: 0;
-    --tree-item-color: var(--u-primary-color);
+    --tree-item-color: var(--u-primary-color, #1E88E5);
   }
 
   :host {
@@ -33,12 +33,12 @@ var styles = css`
   }
   :host(:not([disabled])[trigger="item"]) .header:hover,
   :host(:not([disabled])[trigger="item"]:focus-visible) .header {
-    background-color: var(--u-bg-color-hover);
+    background-color: var(--u-bg-color-hover, #F5F5F5);
   }
   .header[selected] {
     color: color-mix(in srgb, var(--tree-item-color) 85%, black);
     font-weight: 600;
-    background-color: color-mix(in srgb, var(--tree-item-color) 15%, var(--u-bg-color));
+    background-color: color-mix(in srgb, var(--tree-item-color) 15%, var(--u-bg-color, #FFFFFF));
   }
 
   ::slotted([slot="prefix"]) {
@@ -67,14 +67,14 @@ var styles = css`
     justify-content: center;
     width: 18px;
     height: 18px;
-    border-radius: var(--u-radius-sm);
+    border-radius: var(--u-radius-sm, 3px);
   }
   .prefix-toggler u-icon {
     font-size: 12px;
   }
   :host(:not([disabled])[trigger="icon"]) .prefix-toggler:hover,
   :host(:not([disabled])[trigger="icon"]:focus-visible) .prefix-toggler {
-    background-color: var(--u-bg-color-hover);
+    background-color: var(--u-bg-color-hover, #F5F5F5);
   }
 
   /* ── checkbox ── */
@@ -86,8 +86,8 @@ var styles = css`
     justify-content: center;
     width: 16px;
     height: 16px;
-    border-radius: var(--u-radius-sm);
-    border: 1.5px solid var(--u-input-border-color);
+    border-radius: var(--u-radius-sm, 3px);
+    border: 1.5px solid var(--u-input-border-color, #E0E0E0);
     background-color: transparent;
     transition: background-color 0.15s ease, border-color 0.15s ease;
     cursor: pointer;

package/dist/plugins/vite-plugin-glob-resolve.d.ts

@@ -0,0 +1,12 @@
+import type { Plugin } from 'vite';
+/**
+ * Rolldown의 preserveModules 모드에서 import.meta.glob의 query 옵션 사용 시
+ * 빈 export가 생성되는 문제를 해결하는 플러그인.
+ *
+ * - `?raw`: 파일 내용을 문자열로 반환
+ * - `?inline`: 파일 내용을 문자열로 반환
+ * - `?url`: 파일을 asset으로 emit하고 URL을 반환
+ *
+ * 가상 모듈(\0 prefix)로 변환하여 파일명에 `?`가 포함되는 것을 방지합니다.
+ */
+export default function globResolve(): Plugin;

package/dist/plugins/vite-plugin-glob-resolve.js

@@ -0,0 +1,66 @@
+import { readFileSync } from 'fs';
+import { resolve, dirname, basename } from 'path';
+import { createHash } from 'crypto';
+const VIRTUAL_PREFIX = '\0glob-assets';
+const SUPPORTED_QUERIES = ['?raw', '?inline', '?url'];
+function shortHash(input) {
+    return createHash('md5').update(input).digest('hex').slice(0, 8);
+}
+/**
+ * Rolldown의 preserveModules 모드에서 import.meta.glob의 query 옵션 사용 시
+ * 빈 export가 생성되는 문제를 해결하는 플러그인.
+ *
+ * - `?raw`: 파일 내용을 문자열로 반환
+ * - `?inline`: 파일 내용을 문자열로 반환
+ * - `?url`: 파일을 asset으로 emit하고 URL을 반환
+ *
+ * 가상 모듈(\0 prefix)로 변환하여 파일명에 `?`가 포함되는 것을 방지합니다.
+ */
+export default function globResolve() {
+    const idToAbsPath = new Map();
+    return {
+        name: 'vite:glob-resolve',
+        enforce: 'pre',
+        resolveId(source, importer) {
+            for (const query of SUPPORTED_QUERIES) {
+                if (source.endsWith(query)) {
+                    const rawPath = source.slice(0, -query.length);
+                    const absPath = importer
+                        ? resolve(dirname(importer), rawPath)
+                        : rawPath;
+                    const name = basename(absPath);
+                    const hash = shortHash(absPath);
+                    const queryName = query.slice(1);
+                    const virtualId = `${VIRTUAL_PREFIX}_${queryName}/${name}.${hash}`;
+                    idToAbsPath.set(virtualId, absPath);
+                    return virtualId;
+                }
+            }
+            return null;
+        },
+        load(id) {
+            if (!id.startsWith(VIRTUAL_PREFIX))
+                return null;
+            const absPath = idToAbsPath.get(id);
+            if (!absPath)
+                return null;
+            // virtualId에서 queryName 추출: "\0glob-assets_{queryName}/..."
+            const queryName = id.slice(VIRTUAL_PREFIX.length + 1).split('/')[0];
+            if (queryName === 'raw' || queryName === 'inline') {
+                const content = readFileSync(absPath, 'utf-8');
+                return `export default ${JSON.stringify(content)};`;
+            }
+            if (queryName === 'url') {
+                const source = readFileSync(absPath);
+                const fileName = basename(absPath);
+                const ref = this.emitFile({
+                    type: 'asset',
+                    name: fileName,
+                    source,
+                });
+                return `export default import.meta.ROLLUP_FILE_URL_${ref};`;
+            }
+            return null;
+        }
+    };
+}

package/dist/plugins/vite-plugin-react-wrapper.d.ts

@@ -0,0 +1,54 @@
+import type { Plugin } from 'vite';
+interface ComponentEvent {
+    name: string;
+    reactName: string;
+    detailType: string;
+    /**
+     * detail 타입 모듈의 **절대 소스 경로** (없으면 '').
+     *
+     * 상대 경로가 아니라 절대 경로인 이유: 이벤트는 상속 체인의 어느 파일에서든 선언될 수
+     * 있고, 그 파일의 import 경로는 **선언한 파일 기준**이다. 예를 들어
+     * `src/components/UOverlayElement.ts` 는 `../events/ShowEvent.js`(= `src/events/`)를
+     * 가리키는데, 이것을 상속받는 `src/components/dialog/UDialog.ts` 기준으로 풀면
+     * `src/components/events/`(존재하지 않음)가 된다. 수집 시점에 선언 파일 기준으로
+     * 절대화해 이 어긋남을 원천 차단한다.
+     */
+    detailSource: string;
+}
+interface PluginOptions {
+    /** 컴포넌트 소스 디렉토리 경로 (기본값: 'src/components') */
+    input?: string;
+    /** React 래퍼 출력 폴더 - 빌드 outDir 기준 상대 경로 (기본값: 'react') */
+    output?: string;
+    /** 래퍼 생성에서 제외할 glob 패턴 목록 (cwd: 프로젝트 루트) */
+    exclude?: string[];
+}
+/**
+ * Lit Element 컴포넌트를 React 래퍼로 자동 생성하는 Vite 플러그인
+ */
+export default function reactWrapperPlugin(options: PluginOptions): Plugin;
+/**
+ * 이벤트가 **정적으로 수집되지 않는 형태**로 발화되는지 검사한다. 반환값이 비어 있지 않으면
+ * 빌드를 실패시킨다 — 누락된 이벤트는 React 소비자 쪽에서 에러도 경고도 없이 죽으므로
+ * 경고로 두면 아무도 알아채지 못한다.
+ *
+ * `content` 는 **leaf 파일 본문만**이다 — 베이스까지 훑으면 `UElement` 의 `fire`/`relay`
+ * 구현 자체가 걸려 전 컴포넌트가 위반이 된다. 베이스에서 발화하는 이벤트는 상속 수집
+ * ({@link collectComponentEvents})이 이미 채우므로 여기서 볼 필요가 없다.
+ */
+export declare function findEventDeclarationViolations(content: string, className: string, tagName: string, eventCount: number): string[];
+/**
+ * 컴포넌트가 노출하는 이벤트를 **상속 체인 전체**에서 수집한다.
+ *
+ * leaf 파일만 읽으면 베이스 클래스가 발화하는 이벤트를 놓친다 — 예를 들어 `UDialog`·
+ * `UDrawer` 는 `show`/`hide` 를 **`UOverlayElement` 가** 발화하므로, leaf 만 보면
+ * `events: {}` 가 생성되고 React 소비자는 그 이벤트를 **구독할 방법이 없다**(에러도 경고도
+ * 없이 조용히 실패한다).
+ *
+ * 수집 순서는 **베이스 → leaf**다. `@event` 는 이름만 주고(detail=unknown) 기존 항목을
+ * 덮지 않는 반면 `this.fire<T>('name')` 은 타입까지 주며 덮으므로, 이 순서에서
+ * ⑴베이스의 타입 정보가 leaf 의 `@event` 재선언에 지워지지 않고
+ * ⑵leaf 가 같은 이벤트를 더 구체적 타입으로 발화하면 그것이 이긴다.
+ */
+export declare function collectComponentEvents(filePath: string): ComponentEvent[];
+export {};