V13-FE-011: finalize search list layout slice

2026-08-09 02:57:26 +09:00
parent 9efd202e76
commit 6422cb2b13
984 changed files with 120811 additions and 1498 deletions
@@ -0,0 +1,33 @@
+<script setup lang="ts">
+import { useUiAdapter } from '../adapter/useUiAdapter'
+import FieldShell from './FieldShell.vue'
+const props = withDefaults(defineProps<{ modelValue: number | null; label: string; currency?: string; inputId?: string; disabled?: boolean; required?: boolean; error?: string; help?: string; min?: number; max?: number }>(), { currency: 'KRW' })
+const emit = defineEmits<{ 'update:modelValue': [value: number | null]; blur: [event: FocusEvent] }>()
+const adapter = useUiAdapter()
+</script>
+<template>
+  <FieldShell :label="label" :input-id="inputId" :required="required" :error="error" :help="help" v-slot="field">
+    <span class="ks-money-field">
+      <component
+        :is="adapter.components.NumberField"
+        :input-id="field.inputId"
+        :model-value="modelValue"
+        :disabled="disabled"
+        :invalid="field.invalid"
+        :min="min"
+        :max="max"
+        :min-fraction-digits="0"
+        :max-fraction-digits="0"
+        :aria-describedby="field.describedBy"
+        :aria-required="field.required || undefined"
+        @update:model-value="emit('update:modelValue', $event)"
+        @blur="emit('blur', $event)"
+      />
+      <span class="ks-money-field__currency" aria-hidden="true">{{ props.currency }}</span>
+    </span>
+  </FieldShell>
+</template>
+<style scoped>
+.ks-money-field { display: inline-flex; align-items: center; gap: var(--ks-space-2); }
+.ks-money-field__currency { color: var(--ks-color-text-muted); font-size: var(--ks-font-caption); font-weight: 600; }
+</style>