fix: typesとdisabledをpropsで受け取るように修正

lapras-inc · Oct 25, 2024 · 76562c3 · 76562c3
1 parent 201a17f
commit 76562c3
Show file tree

Hide file tree

Showing 3 changed files with 36 additions and 1 deletion.
diff --git a/src/components/TextInput/TextInput.stories.ts b/src/components/TextInput/TextInput.stories.ts
@@ -20,6 +20,13 @@ const meta: Meta<TextInputPropsAndCustomArgs> = {
     autoExpand: false,
     baseTextareaHeight: 56,
   },
+  argTypes: {
+    type: {
+      control: { type: 'select' },
+      options: ['text', 'password', 'email', 'number', 'tel', 'date'],
+      defaultValue: 'text',
+    },
+  },
   render: (args) => ({
     components: { TextInput },
     setup() {

diff --git a/src/components/TextInput/TextInput.vue b/src/components/TextInput/TextInput.vue
@@ -4,6 +4,7 @@
     :value="modelValue"
     class="text-input is-multi-line"
     :class="{ 'has-error': error }"
+    :disabled="disabled"
     v-if="multiline"
     @input="onInput"
     @focus="$emit('focus')"
@@ -15,7 +16,8 @@
     :value="modelValue"
     class="text-input is-single-line"
     :class="{ 'has-error': error }"
-    type="text"
+    :disabled="disabled"
+    :type="type"
     @input="onInput"
     @focus="$emit('focus')"
     @blur="$emit('blur')"
@@ -49,6 +51,14 @@ export default defineComponent({
       type: Number,
       default: 56,
     },
+    type: {
+      type: String,
+      default: 'text',
+    },
+    disabled: {
+      type: Boolean,
+      default: false,
+    },
   },
   emits: {
     'update:modelValue': null,

diff --git a/types/components/TextInput/TextInput.vue.d.ts b/types/components/TextInput/TextInput.vue.d.ts
@@ -19,6 +19,14 @@ declare const _default: import("vue").DefineComponent<{
         type: NumberConstructor;
         default: number;
     };
+    type: {
+        type: StringConstructor;
+        default: string;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }, {
     textarea: import("vue").Ref<HTMLElement | null>;
     onInput: (e: Event) => void;
@@ -47,12 +55,22 @@ declare const _default: import("vue").DefineComponent<{
         type: NumberConstructor;
         default: number;
     };
+    type: {
+        type: StringConstructor;
+        default: string;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & {
     onFocus?: ((...args: any[]) => any) | undefined;
     onBlur?: ((...args: any[]) => any) | undefined;
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
+    type: string;
     error: boolean;
+    disabled: boolean;
     multiline: boolean;
     modelValue: string;
     autoExpand: boolean;