removed tooltip from input

This commit is contained in:
Mamalizz
2024-12-13 23:46:46 +03:30
parent 77c39c30d2
commit bc920029ea
+18 -14
View File
@@ -1,21 +1,20 @@
<script setup lang="ts"> <script setup lang="ts">
// types // types
import Tooltip from "~/components/Tooltip.vue"; import Tooltip from "~/components/Tooltip.vue";
type Props = { type Props = {
variant?: "solid" | "outlined", variant?: "solid" | "outlined";
startIcon?: string; startIcon?: string;
endIcon?: string; endIcon?: string;
disabled?: boolean; disabled?: boolean;
error?: boolean; error?: boolean;
message?: string; message?: string;
placeholder?: string; placeholder?: string;
} };
// props // props
const props = withDefaults(defineProps<Props>(), { const props = withDefaults(defineProps<Props>(), {
variant: "solid" variant: "solid",
}); });
const { variant, message, error, disabled } = toRefs(props); const { variant, message, error, disabled } = toRefs(props);
@@ -30,19 +29,24 @@ const classes = computed(() => {
"input-solid": variant.value === "solid", "input-solid": variant.value === "solid",
"input-outlined": variant.value === "outlined", "input-outlined": variant.value === "outlined",
"input-effects": !error.value, "input-effects": !error.value,
[variant.value === "solid" ? "input-solid-error" : "input-outlined-error"]: error.value [variant.value === "solid"
} ? "input-solid-error"
: "input-outlined-error"]: error.value,
},
]; ];
}); });
</script> </script>
<template> <template>
<Tooltip :title="message"> <div v-bind="$attrs" :class="classes" @click="inputRef?.focus()">
<div v-bind="$attrs" :class="classes" @click="inputRef?.focus()"> <Icon v-if="startIcon" :name="startIcon" class="ms-0" size="24px" />
<Icon v-if="startIcon" :name="startIcon" class="ms-0" size="24px" /> <input
<input ref="inputRef" class="outline-none" :placeholder="placeholder" /> ref="inputRef"
<Icon v-if="endIcon" :name="endIcon" class="me-0" size="24px" /> class="outline-none w-max"
</div> :placeholder="placeholder"
</Tooltip> />
<Icon v-if="endIcon" :name="endIcon" class="me-0" size="24px" />
</div>
<!-- <Tooltip :title="message" class="w-full">
</Tooltip> -->
</template> </template>