keep-vue
Version:
Keep Vue is an open-source component library built on top of Vue3 and Tailwind CSS. It offers a collection of pre-designed UI components and styles that you can easily integrate into your web applications.
81 lines (80 loc) • 2.85 kB
JavaScript
/// <reference types=".vue-global-types/vue_3.5_false.d.ts" />
import { computed, watch } from "vue";
import * as Dropzone from "vue3-dropzone";
import { cn } from "../../utils/cn";
import { useUpload } from "./useUpload";
const { defineProps, defineSlots, defineEmits, defineExpose, defineModel, defineOptions, withDefaults, } = await import('vue');
let __VLS_typeProps;
const props = defineProps();
const emit = defineEmits(["update:isDragActive"]);
const restProps = computed(() => {
const { class: _, ...rest } = props;
return rest;
});
const { options, horizontal } = useUpload();
const { getRootProps, getInputProps, isDragActive } = Dropzone.useDropzone(options);
watch(isDragActive, (newValue) => {
emit("update:isDragActive", newValue);
});
const __VLS_exposed = { isDragActive };
defineExpose({ isDragActive });
const __VLS_fnComponent = (await import('vue')).defineComponent({
emits: {},
});
;
let __VLS_functionalComponentProps;
function __VLS_template() {
const __VLS_ctx = {};
const __VLS_localComponents = {
...{},
...{},
...__VLS_ctx,
};
let __VLS_components;
const __VLS_localDirectives = {
...{},
...__VLS_ctx,
};
let __VLS_directives;
let __VLS_styleScopedClasses;
let __VLS_resolvedLocalAndGlobalComponents;
__VLS_elementAsFunction(__VLS_intrinsicElements.div, __VLS_intrinsicElements.div)({ ...({ ...__VLS_ctx.restProps, ...__VLS_ctx.getRootProps() }), ...{ class: ((__VLS_ctx.cn(__VLS_ctx.horizontal
? 'flex cursor-pointer items-center gap-x-4 rounded-xl border border-dashed border-metal-300 bg-white p-4 transition-all duration-300 hover:bg-metal-25 dark:border-metal-700 dark:bg-metal-900 dark:hover:bg-metal-900'
: 'flex cursor-pointer flex-col items-center rounded-xl border border-dashed border-metal-300 bg-white p-6 text-center transition-all duration-300 hover:bg-metal-25 dark:border-metal-700 dark:bg-metal-900 dark:hover:bg-metal-900', props.class))) }, });
__VLS_elementAsFunction(__VLS_intrinsicElements.input)({ ...({ ...__VLS_ctx.getInputProps() }), });
var __VLS_0 = {};
var __VLS_slots;
var __VLS_inheritedAttrs;
const __VLS_refs = {};
var $refs;
return {
slots: __VLS_slots,
refs: $refs,
attrs: {},
};
}
;
const __VLS_self = (await import('vue')).defineComponent({
setup() {
return {
cn: cn,
restProps: restProps,
horizontal: horizontal,
getRootProps: getRootProps,
getInputProps: getInputProps,
};
},
emits: {},
__typeProps: {},
});
const __VLS_component = (await import('vue')).defineComponent({
setup() {
return {
...__VLS_exposed,
};
},
emits: {},
__typeProps: {},
});
export default {};
;