@uniai-fe/uds-primitives 0.3.55 → 0.3.57

package/dist/styles.css

@@ -428,8 +428,7 @@
   --input-text-disabled-color: var(--color-label-disabled);
   --input-placeholder-color: var(--color-label-alternative);
   --input-placeholder-disabled-color: var(--color-label-disabled);
-  /* 변경: readonly 입력은 placeholder를 숨겨 value 텍스트 대비를 고정한다. */
-  --input-placeholder-readonly-color: transparent;
+  --input-placeholder-readonly-color: var(--input-placeholder-color);
   --input-font-size: var(--input-text-medium-size);
   --input-line-height: var(--input-text-medium-line-height);
   --input-font-weight: var(--input-text-medium-weight);
@@ -590,7 +589,7 @@
   /* 변경: placeholder disabled/readonly 토큰을 분리해 상태별 제어 지점을 고정한다. */
   --select-primary-color-placeholder-disabled: var(--color-label-disabled);
   --select-primary-color-placeholder-readonly: var(
-  --select-primary-color-placeholder-disabled
+  --select-primary-color-placeholder
   );
   --select-primary-color-surface: var(--input-surface-color);
   --select-primary-color-text: var(--color-label-alternative);
@@ -618,7 +617,7 @@
   --select-secondary-color-placeholder: var(--color-label-alternative);
   --select-secondary-color-placeholder-disabled: var(--color-label-disabled);
   --select-secondary-color-placeholder-readonly: var(
-  --select-secondary-color-placeholder-disabled
+  --select-secondary-color-placeholder
   );
   --select-color-surface-secondary: transparent;
   --select-color-surface-secondary-hover: var(--color-surface-static-cool-gray);
@@ -2778,7 +2777,7 @@ figure.chip {
   box-shadow: none;
 }
 
-.input-field[data-has-value=true] .input-element {
+.input-field[data-has-value=true] .input-element:not(:disabled) {
   color: var(--input-text-color);
   caret-color: var(--input-text-color);
 }
@@ -4074,7 +4073,7 @@ figure.chip {
   color: var(--select-secondary-color-text-readonly);
 }
 
-.select-value[data-has-value=true] .select-input-label {
+.select-button:where(:not([data-state=disabled])) .select-value[data-has-value=true] .select-input-label {
   color: var(--select-color-text-value);
   caret-color: var(--select-color-text-value);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniai-fe/uds-primitives",
-  "version": "0.3.55",
+  "version": "0.3.57",
   "description": "UNIAI Design System; Primitives Components Package",
   "type": "module",
   "private": false,

package/src/components/input/markup/foundation/TextArea.tsx

@@ -192,6 +192,7 @@ const InputTextArea = forwardRef<HTMLTextAreaElement, InputTextAreaProps>(
             data-state={visualState}
             data-priority={priority}
             data-size={resolvedSize}
+            data-has-value={currentLength > 0 ? "true" : "false"}
             data-readonly={isReadOnly ? "true" : undefined}
             data-block={resolvedBlock ? "true" : undefined}
           >

package/src/components/input/styles/foundation.scss

@@ -279,7 +279,7 @@
   }
 }
 
-.input-field[data-has-value="true"] .input-element {
+.input-field[data-has-value="true"] .input-element:not(:disabled) {
   color: var(--input-text-color);
   caret-color: var(--input-text-color);
 }

package/src/components/input/styles/variables.scss

@@ -85,8 +85,7 @@
   --input-text-disabled-color: var(--color-label-disabled);
   --input-placeholder-color: var(--color-label-alternative);
   --input-placeholder-disabled-color: var(--color-label-disabled);
-  /* 변경: readonly 입력은 placeholder를 숨겨 value 텍스트 대비를 고정한다. */
-  --input-placeholder-readonly-color: transparent;
+  --input-placeholder-readonly-color: var(--input-placeholder-color);
   --input-font-size: var(--input-text-medium-size);
   --input-line-height: var(--input-text-medium-line-height);
   --input-font-weight: var(--input-text-medium-weight);

package/src/components/select/markup/Default.tsx

@@ -233,6 +233,22 @@ export function SelectDefault<OptionData = unknown>({
     onSelectOption?.(option, previousOption, event);
 
     if (hasChanged) {
+      const nextRegisterValue =
+        String(option.value) === SELECT_CUSTOM_OPTION_VALUE && !customRegister
+          ? ""
+          : option.value;
+
+      if (register?.name) {
+        // 변경 설명: hidden input value 변경만으로는 RHF context가 갱신되지 않으므로 source field change를 명시적으로 전파한다.
+        register.onChange?.({
+          target: {
+            name: register.name,
+            value: nextRegisterValue,
+          },
+          type: "change",
+        });
+      }
+
       setUncontrolledSelectedValue(option.value);
       onSelectChange?.(option, previousOption, event);
     }

package/src/components/select/markup/foundation/Selected.tsx

@@ -162,6 +162,16 @@ const SelectTriggerSelected = ({
           onChange={event => {
             // 6) RHF(customRegister) → 외부 inputProps → 내부 state 콜백 순으로 변경을 전파한다.
             customRegister?.onChange?.(event);
+            if (!customRegister && register?.name) {
+              // 변경 설명: customRegister가 없는 직접입력은 source field(register)에 현재 텍스트를 그대로 기록한다.
+              register.onChange?.({
+                target: {
+                  name: register.name,
+                  value: event.currentTarget.value,
+                },
+                type: "change",
+              });
+            }
             inputProps?.onChange?.(event);
             onLabelChange?.(event.currentTarget.value);
           }}

package/src/components/select/styles/select.scss

@@ -297,7 +297,9 @@
   }
 }
 
-.select-value[data-has-value="true"] .select-input-label {
+.select-button:where(:not([data-state="disabled"]))
+  .select-value[data-has-value="true"]
+  .select-input-label {
   color: var(--select-color-text-value);
   caret-color: var(--select-color-text-value);
 }

package/src/components/select/styles/variables.scss

@@ -95,7 +95,7 @@
   /* 변경: placeholder disabled/readonly 토큰을 분리해 상태별 제어 지점을 고정한다. */
   --select-primary-color-placeholder-disabled: var(--color-label-disabled);
   --select-primary-color-placeholder-readonly: var(
-    --select-primary-color-placeholder-disabled
+    --select-primary-color-placeholder
   );
   --select-primary-color-surface: var(--input-surface-color);
   --select-primary-color-text: var(--color-label-alternative);
@@ -123,7 +123,7 @@
   --select-secondary-color-placeholder: var(--color-label-alternative);
   --select-secondary-color-placeholder-disabled: var(--color-label-disabled);
   --select-secondary-color-placeholder-readonly: var(
-    --select-secondary-color-placeholder-disabled
+    --select-secondary-color-placeholder
   );
   --select-color-surface-secondary: transparent;
   --select-color-surface-secondary-hover: var(--color-surface-static-cool-gray);