@iyulab/components 1.27.0 → 1.27.2

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # Changelog
 
+## [1.27.2] - 2026-08-11
+
+### Fixed
+
+- **`u-input`'s form submission value now stays in sync with `value` across every change
+  path**, not just on blur. Previously, `ElementInternals.setFormValue()` was only called from
+  the blur handler, so submitting a form before a field lost focus (an initial `value`
+  attribute, a programmatic `.value =` assignment, or the clear button from 1.27.1) could send a
+  stale or missing value. Sync now happens reactively whenever `value` changes, matching
+  `u-select`'s existing contract.
+
+## [1.27.1] - 2026-08-11
+
+### Fixed
+
+- **`u-input[clearable]`'s built-in clear button now dispatches `change`**, matching the
+  existing contract on `u-select` and `u-date-picker`. Previously, clicking the clear icon
+  emptied the value visually but fired no event, so consumers binding to `change` (e.g. a
+  filter bound to `.value`/`@input`) never saw the reset.
+
 ## [1.27.0] - 2026-08-08
 
 ### Added

package/dist/components/input/UInput.d.ts

@@ -1,3 +1,4 @@
+import { PropertyValues } from 'lit';
 import { UFormControlElement } from '../UFormControlElement.js';
 import { UPopover } from '../popover/UPopover.js';
 export type InputType = 'text' | 'password' | 'email' | 'tel' | 'url' | 'search' | 'number' | 'date' | 'time' | 'datetime-local' | 'month' | 'week';
@@ -81,6 +82,12 @@ export declare class UInput extends UFormControlElement<string> {
     private options;
     disconnectedCallback(): void;
     render(): import('lit-html').TemplateResult<1>;
+    /** `value`가 바뀌는 모든 경로(초기 속성 설정 · 프로그램적 대입 · clear 버튼)에서
+     *  폼 제출값을 동기화한다 — 종전에는 `handleInputBlur`에서만 수동으로 호출해,
+     *  blur 전에 폼이 제출되면(다른 컨트롤의 Enter 등) `FormData`가 낡은 값을 돌려줬다.
+     *  형제 `USelect`의 `updated()`+`onChangeValue()` 패턴과 같은 경계 — `T`가 이미
+     *  `string`이라 `valueAsString` 같은 변환 없이 그대로 넘긴다. */
+    protected updated(changedProperties: PropertyValues): void;
     protected setValidity(): void;
     reset(): void;
     focus(options?: FocusOptions): void;

package/dist/components/input/UInput.js

@@ -53,7 +53,6 @@ var UInput = class UInput extends UFormControlElement {
 		};
 		this.handleInputBlur = (_) => {
 			this.value = this.inputEl?.value || "";
-			this.internals?.setFormValue(this.value);
 			if (!this.novalidate) this.validate();
 			this.dispatchEvent(new Event("change", {
 				bubbles: true,
@@ -81,6 +80,10 @@ var UInput = class UInput extends UFormControlElement {
 		this.handleClearButtonClick = (e) => {
 			e.stopImmediatePropagation();
 			this.reset();
+			this.dispatchEvent(new Event("change", {
+				bubbles: true,
+				composed: true
+			}));
 			this.focus();
 		};
 		this.handleOptionClick = (e) => {
@@ -209,6 +212,15 @@ var UInput = class UInput extends UFormControlElement {
       </u-popover>
     `;
 	}
+	/** `value`가 바뀌는 모든 경로(초기 속성 설정 · 프로그램적 대입 · clear 버튼)에서
+	*  폼 제출값을 동기화한다 — 종전에는 `handleInputBlur`에서만 수동으로 호출해,
+	*  blur 전에 폼이 제출되면(다른 컨트롤의 Enter 등) `FormData`가 낡은 값을 돌려줬다.
+	*  형제 `USelect`의 `updated()`+`onChangeValue()` 패턴과 같은 경계 — `T`가 이미
+	*  `string`이라 `valueAsString` 같은 변환 없이 그대로 넘긴다. */
+	updated(changedProperties) {
+		super.updated(changedProperties);
+		if (changedProperties.has("value")) this.internals?.setFormValue(this.value ?? "");
+	}
 	setValidity() {
 		const v = this.inputEl?.validity;
 		let flags = {};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@iyulab/components",
   "description": "web-components library based on lit-element made by iyulab",
-  "version": "1.27.0",
+  "version": "1.27.2",
   "keywords": [
     "iyulab",
     "components",