update input props schema

This commit is contained in:
vasu
2023-06-21 21:30:47 +05:30
parent 836ecffc85
commit 9c83640b66
3 changed files with 24 additions and 24 deletions

View File

@@ -25,9 +25,12 @@ On this page you will find all of the input types based on multiple variants, st
```vue ```vue
<script setup> <script setup>
import { Input } from 'flowbite-vue' import { Input } from 'flowbite-vue'
import { ref } from 'vue'
const name = ref('')
</script> </script>
<template> <template>
<Input placeholder="enter your first name" label="First name" /> <Input v-modal="name" placeholder="enter your first name" label="First name" />
</template> </template>
``` ```

View File

@@ -1,6 +1,11 @@
<template> <template>
<Input placeholder="enter your first name" label="First name" /> <div>
<Input v-model="name" placeholder="enter your first name" label="First name" />
</div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { Input } from '../../../../src/index' import { Input } from '../../../../src/index'
import { ref } from 'vue'
const name = ref('')
</script> </script>

View File

@@ -23,33 +23,25 @@
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import type { PropType } from 'vue'
import type { InputSize } from '@/components/Input/types' import type { InputSize } from '@/components/Input/types'
import { useInputClasses } from '@/components/Input/composables/useInputClasses' import { useInputClasses } from '@/components/Input/composables/useInputClasses'
import { toRefs } from 'vue' import { toRefs } from 'vue'
import { useVModel } from '@vueuse/core' import { useVModel } from '@vueuse/core'
const props = defineProps({ interface InputProps {
label: { label?: string;
type: String, disabled?: boolean;
default: '', type?: 'button' | 'checkbox' | 'color' | 'date' | 'datetime-local' | 'email' | 'file' | 'hidden' | 'image' | 'month' | 'number' | 'password' | 'radio' | 'range' | 'reset' | 'search' | 'submit' | 'tel' | 'text' | 'time' | 'url' | 'week';
}, size?: InputSize;
disabled: { modelValue: string;
type: Boolean, }
default: false,
}, const props = withDefaults(defineProps<InputProps>(), {
type: { label: '',
type: String as PropType<'button' | 'checkbox' | 'color' | 'date' | 'datetime-local' | 'email' | 'file' | 'hidden' | 'image' | 'month' | 'number' | 'password' | 'radio' | 'range' | 'reset' | 'search' | 'submit' | 'tel' | 'text' | 'time' | 'url' | 'week'>, disabled: false,
default: 'text', type: 'text',
}, size: 'md',
size: { modelValue: '',
type: String as PropType<InputSize>,
default: 'md',
},
modelValue: {
type: String,
default: '',
},
}) })
const model = useVModel(props, 'modelValue') const model = useVModel(props, 'modelValue')