@iyulab/components 1.0.10 → 1.1.0

package/dist/components/UFormControlElement.d.ts

@@ -23,6 +23,8 @@ export declare abstract class UFormControlElement<T> extends UElement {
     description?: string;
     /** 커스텀 유효성 검증 메시지 */
     validationMessage?: string;
+    /** chrome 문자열(검증 메시지 등)에 사용할 로케일 태그 (예: 'ko-KR'). 미지정 시 전역 기본/문서 언어를 따른다. */
+    locale?: string;
     /** 폼 제출 시 사용되는 이름 */
     name?: string;
     /** 폼 제출 시 사용되는 값 */

package/dist/components/UFormControlElement.js

@@ -62,6 +62,7 @@ __decorate([property({ type: Boolean }), __decorateMetadata("design:type", Boole
 __decorate([property({ type: String }), __decorateMetadata("design:type", String)], UFormControlElement.prototype, "label", void 0);
 __decorate([property({ type: String }), __decorateMetadata("design:type", String)], UFormControlElement.prototype, "description", void 0);
 __decorate([property({ type: String }), __decorateMetadata("design:type", String)], UFormControlElement.prototype, "validationMessage", void 0);
+__decorate([property({ type: String }), __decorateMetadata("design:type", String)], UFormControlElement.prototype, "locale", void 0);
 __decorate([property({ type: String }), __decorateMetadata("design:type", String)], UFormControlElement.prototype, "name", void 0);
 __decorate([property({ type: Object }), __decorateMetadata("design:type", Object)], UFormControlElement.prototype, "value", void 0);
 //#endregion

package/dist/components/rating/URating.js

@@ -1,3 +1,4 @@
+import { formatTemplate, getLocaleStrings, resolveLocale } from "../../core/locale.js";
 import { __decorateMetadata } from "../../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/decorateMetadata.js";
 import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/decorate.js";
 import { UFormControlElement } from "../UFormControlElement.js";
@@ -153,23 +154,24 @@ var URating = class URating extends UFormControlElement {
 	}
 	getValidity() {
 		const v = this.value || 0;
+		const s = getLocaleStrings(resolveLocale(this.locale));
 		if (this.required && !v) return {
 			flags: { valueMissing: true },
-			message: "This field is required"
+			message: s.required
 		};
 		if (v && v < this.min) return {
 			flags: { rangeUnderflow: true },
-			message: `Value must be at least ${this.min}`
+			message: formatTemplate(s.minValue, { min: this.min })
 		};
 		if (v && v > this.max) return {
 			flags: { rangeOverflow: true },
-			message: `Value must be no more than ${this.max}`
+			message: formatTemplate(s.maxValue, { max: this.max })
 		};
 		if (v && this.precision < 1) {
 			const remainder = Math.abs(v % this.precision);
 			if (remainder > .001 && Math.abs(remainder - this.precision) > .001) return {
 				flags: { stepMismatch: true },
-				message: `Value must be a multiple of ${this.precision}`
+				message: formatTemplate(s.stepMismatch, { step: this.precision })
 			};
 		}
 		return {

package/dist/components/select/USelect.js

@@ -1,3 +1,4 @@
+import { formatTemplate, getLocaleStrings, resolveLocale } from "../../core/locale.js";
 import { __decorateMetadata } from "../../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/decorateMetadata.js";
 import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/decorate.js";
 import { UFormControlElement } from "../UFormControlElement.js";
@@ -261,17 +262,18 @@ var USelect = class USelect extends UFormControlElement {
 		}));
 	}
 	getValidity(values) {
+		const s = getLocaleStrings(resolveLocale(this.locale));
 		if (this.required && !values.length) return {
 			flags: { valueMissing: true },
-			message: "This field is required"
+			message: s.required
 		};
 		if (this.multiple && this.minCount != null && values.length > 0 && values.length < this.minCount) return {
 			flags: { rangeUnderflow: true },
-			message: `Please select at least ${this.minCount} items`
+			message: formatTemplate(s.minCount, { min: this.minCount })
 		};
 		if (this.multiple && this.maxCount != null && values.length > this.maxCount) return {
 			flags: { rangeOverflow: true },
-			message: `Please select no more than ${this.maxCount} items`
+			message: formatTemplate(s.maxCount, { max: this.maxCount })
 		};
 		return {
 			flags: {},

package/dist/components/slider/USlider.js

@@ -1,3 +1,4 @@
+import { formatTemplate, getLocaleStrings, resolveLocale } from "../../core/locale.js";
 import { __decorateMetadata } from "../../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/decorateMetadata.js";
 import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/decorate.js";
 import { UFormControlElement } from "../UFormControlElement.js";
@@ -194,17 +195,18 @@ var USlider = class USlider extends UFormControlElement {
 	}
 	getValidity() {
 		const v = this.valueAsNumber;
+		const s = getLocaleStrings(resolveLocale(this.locale));
 		if (this.required && !v) return {
 			flags: { valueMissing: true },
-			message: "This field is required"
+			message: s.required
 		};
 		if (v < this.min) return {
 			flags: { rangeUnderflow: true },
-			message: `Value must be at least ${this.min}`
+			message: formatTemplate(s.minValue, { min: this.min })
 		};
 		if (v > this.max) return {
 			flags: { rangeOverflow: true },
-			message: `Value must be at most ${this.max}`
+			message: formatTemplate(s.maxValue, { max: this.max })
 		};
 		return {
 			flags: {},

package/dist/core/locale.d.ts

@@ -0,0 +1,69 @@
+/**
+ * @iyulab/components 의 경량 로케일 레지스트리.
+ *
+ * 범위: 라이브러리가 스스로 생성하는 chrome 문자열(검증 메시지 등)만 대상.
+ * 일반 i18n 프레임워크가 아니다. 앱 콘텐츠 번역은 consumer 의 i18n 계층(예:
+ * modern-app 의 i18next)이 담당한다.
+ *
+ * 영어가 내장 기본값이며, 한국어 등 도메인 로케일은 consumer 가 등록한다:
+ *   registerLocale('ko', { required: '필수 항목입니다.', ... });
+ *   setDefaultLocale('ko');
+ *
+ * 모노레포 로케일 표준(packages/u-widgets/src/core/locale.ts)과 동일한 계약을 따른다.
+ */
+export interface UComponentsLocaleStrings {
+    required: string;
+    minValue: string;
+    maxValue: string;
+    stepMismatch: string;
+    minCount: string;
+    maxCount: string;
+}
+/**
+ * 로케일을 등록한다. 부분 등록은 영어 기본값에 병합된다.
+ */
+export declare function registerLocale(lang: string, strings: Partial<UComponentsLocaleStrings>): void;
+/**
+ * 주어진 언어 태그에 대한 로케일 문자열을 해석한다.
+ *
+ * 해석 순서:
+ *   1. 정확히 일치 (예: 'ko-KR')
+ *   2. 기반 언어 (예: 'ko')
+ *   3. 영어 폴백
+ */
+export declare function getLocaleStrings(lang?: string): UComponentsLocaleStrings;
+/**
+ * 템플릿 문자열의 {key} 플레이스홀더를 치환한다.
+ */
+export declare function formatTemplate(template: string, params: Record<string, string | number>): string;
+/**
+ * 영어 기본값을 반환한다 (테스트/참조용).
+ */
+export declare function getDefaultLocale(): UComponentsLocaleStrings;
+/**
+ * 모든 컴포넌트에 적용되는 전역 기본 로케일을 설정한다.
+ *
+ * 해석 순서(우선순위 높은 순):
+ *   1. 컴포넌트별 `locale` 속성/프로퍼티
+ *   2. setDefaultLocale() 값
+ *   3. document.documentElement.lang (브라우저)
+ *   4. 영어 폴백
+ *
+ * @example
+ * ```ts
+ * import { setDefaultLocale } from '@iyulab/components';
+ * setDefaultLocale('ko-KR');
+ * ```
+ */
+export declare function setDefaultLocale(lang: string | undefined): void;
+/**
+ * setDefaultLocale() 로 설정된 전역 기본 로케일을 반환한다.
+ * 설정되지 않았으면 undefined 를 반환한다.
+ */
+export declare function getEffectiveLocale(): string | undefined;
+/**
+ * 컴포넌트가 사용할 로케일을 해석한다.
+ *
+ * 우선순위: widgetLocale > setDefaultLocale() > document.lang > undefined
+ */
+export declare function resolveLocale(widgetLocale?: string | null): string | undefined;

package/dist/core/locale.js

@@ -0,0 +1,85 @@
+//#region src/core/locale.ts
+var EN = {
+	required: "This field is required",
+	minValue: "Value must be at least {min}",
+	maxValue: "Value must be at most {max}",
+	stepMismatch: "Value must be a multiple of {step}",
+	minCount: "Please select at least {min} items",
+	maxCount: "Please select no more than {max} items"
+};
+var registry = /* @__PURE__ */ new Map();
+/**
+* 로케일을 등록한다. 부분 등록은 영어 기본값에 병합된다.
+*/
+function registerLocale(lang, strings) {
+	registry.set(lang.toLowerCase(), {
+		...EN,
+		...strings
+	});
+}
+/**
+* 주어진 언어 태그에 대한 로케일 문자열을 해석한다.
+*
+* 해석 순서:
+*   1. 정확히 일치 (예: 'ko-KR')
+*   2. 기반 언어 (예: 'ko')
+*   3. 영어 폴백
+*/
+function getLocaleStrings(lang) {
+	if (!lang) return EN;
+	const key = lang.toLowerCase();
+	if (registry.has(key)) return registry.get(key);
+	const base = key.split("-")[0];
+	if (base !== key && registry.has(base)) return registry.get(base);
+	return EN;
+}
+/**
+* 템플릿 문자열의 {key} 플레이스홀더를 치환한다.
+*/
+function formatTemplate(template, params) {
+	return template.replace(/\{(\w+)\}/g, (_, key) => params[key] != null ? String(params[key]) : `{${key}}`);
+}
+/**
+* 영어 기본값을 반환한다 (테스트/참조용).
+*/
+function getDefaultLocale() {
+	return { ...EN };
+}
+var _defaultLocale;
+/**
+* 모든 컴포넌트에 적용되는 전역 기본 로케일을 설정한다.
+*
+* 해석 순서(우선순위 높은 순):
+*   1. 컴포넌트별 `locale` 속성/프로퍼티
+*   2. setDefaultLocale() 값
+*   3. document.documentElement.lang (브라우저)
+*   4. 영어 폴백
+*
+* @example
+* ```ts
+* import { setDefaultLocale } from '@iyulab/components';
+* setDefaultLocale('ko-KR');
+* ```
+*/
+function setDefaultLocale(lang) {
+	_defaultLocale = lang;
+}
+/**
+* setDefaultLocale() 로 설정된 전역 기본 로케일을 반환한다.
+* 설정되지 않았으면 undefined 를 반환한다.
+*/
+function getEffectiveLocale() {
+	return _defaultLocale;
+}
+/**
+* 컴포넌트가 사용할 로케일을 해석한다.
+*
+* 우선순위: widgetLocale > setDefaultLocale() > document.lang > undefined
+*/
+function resolveLocale(widgetLocale) {
+	if (widgetLocale) return widgetLocale;
+	if (_defaultLocale) return _defaultLocale;
+	if (typeof document !== "undefined" && document.documentElement?.lang) return document.documentElement.lang;
+}
+//#endregion
+export { formatTemplate, getDefaultLocale, getEffectiveLocale, getLocaleStrings, registerLocale, resolveLocale, setDefaultLocale };

package/dist/index.d.ts

@@ -1,3 +1,4 @@
+export * from './core/locale.js';
 export * from './components/UFormControlElement.js';
 export * from './components/UDataElement.js';
 export * from './components/UElement.js';

package/dist/index.js

@@ -1,3 +1,4 @@
+import { formatTemplate, getDefaultLocale, getEffectiveLocale, getLocaleStrings, registerLocale, resolveLocale, setDefaultLocale } from "./core/locale.js";
 import { UElement } from "./components/UElement.js";
 import { UFormControlElement } from "./components/UFormControlElement.js";
 import { IconCache, IconRegistry, getDefaultBaseUrl, setDefaultBaseUrl } from "./utilities/icons.js";
@@ -53,4 +54,4 @@ import { BrowserStorage } from "./utilities/BrowserStorage.js";
 import { Dialog } from "./utilities/Dialog.js";
 import { Theme } from "./utilities/Theme.js";
 import { Toast } from "./utilities/Toast.js";
-export { BrowserStorage, Dialog, IconCache, IconRegistry, OverlayManager, Theme, Toast, UAlert, UAvatar, UBadge, UBreadcrumb, UBreadcrumbItem, UButton, UButtonGroup, UCard, UCarousel, UCheckbox, UChip, UDataElement, UDialog, UDivider, UDrawer, UElement, UField, UFloatingElement, UForm, UFormControlElement, UIcon, UIconButton, UInput, UMenu, UMenuItem, UOption, UOverlayElement, UPanel, UPopover, UProgressBar, UProgressRing, URadio, URating, USelect, USkeleton, USlider, USpinner, USplitPanel, USwitch, UTab, UTabPanel, UTag, UTextarea, UTooltip, UTree, UTreeItem, arrayAttrConverter, booleanAttrConverter, buildElementHTML, dateAttrConverter, escapeHtmlAttr, escapeHtmlHref, escapeHtmlText, getDefaultBaseUrl, getParentElement, jsonAttrConverter, querySelectorAllWithin, querySelectorWithin, setDefaultBaseUrl, stripZeroWidth, urlAttrConverter };
+export { BrowserStorage, Dialog, IconCache, IconRegistry, OverlayManager, Theme, Toast, UAlert, UAvatar, UBadge, UBreadcrumb, UBreadcrumbItem, UButton, UButtonGroup, UCard, UCarousel, UCheckbox, UChip, UDataElement, UDialog, UDivider, UDrawer, UElement, UField, UFloatingElement, UForm, UFormControlElement, UIcon, UIconButton, UInput, UMenu, UMenuItem, UOption, UOverlayElement, UPanel, UPopover, UProgressBar, UProgressRing, URadio, URating, USelect, USkeleton, USlider, USpinner, USplitPanel, USwitch, UTab, UTabPanel, UTag, UTextarea, UTooltip, UTree, UTreeItem, arrayAttrConverter, booleanAttrConverter, buildElementHTML, dateAttrConverter, escapeHtmlAttr, escapeHtmlHref, escapeHtmlText, formatTemplate, getDefaultBaseUrl, getDefaultLocale, getEffectiveLocale, getLocaleStrings, getParentElement, jsonAttrConverter, querySelectorAllWithin, querySelectorWithin, registerLocale, resolveLocale, setDefaultBaseUrl, setDefaultLocale, stripZeroWidth, urlAttrConverter };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@iyulab/components",
   "description": "web-components library based on lit-element made by iyulab",
-  "version": "1.0.10",
+  "version": "1.1.0",
   "keywords": [
     "iyulab",
     "components",
@@ -39,7 +39,9 @@
     "./plugins/*": "./plugins/*"
   },
   "scripts": {
-    "test": "vite --force",
+    "dev": "vite --force",
+    "test": "vitest run",
+    "test:watch": "vitest",
     "build:plugins": "tsc -p plugins/tsconfig.json",
     "build": "eslint && vite build && npm run build:plugins"
   },
@@ -72,6 +74,7 @@
     "typescript-eslint": "^8.59.3",
     "vite": "^8.0.13",
     "vite-plugin-dts": "^5.0.0",
-    "vite-plugin-static-copy": "^4.1.0"
+    "vite-plugin-static-copy": "^4.1.0",
+    "vitest": "^4.1.8"
   }
 }