removed tooltip from input
This commit is contained in:
@@ -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>
|
||||||
Reference in New Issue
Block a user