@vc-shell/framework 1.0.56 → 1.0.57

package/ui/components/atoms/vc-button/index.ts

@@ -1,9 +1,10 @@
 import { VNode } from "vue";
-import Button from "./vc-button.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
+import _Button from "./vc-button.vue";
 
-export type VcButtonSlots = {
-  default?: () => VNode[];
+export const VcButton = _Button as typeof _Button & {
+  new (): {
+    $slots: {
+      default: () => VNode[];
+    };
+  };
 };
-
-export const VcButton: GlobalComponentConstructor<typeof Button, VcButtonSlots> = Button;

package/ui/components/atoms/vc-card/index.ts

@@ -1,10 +1,11 @@
 import { VNode } from "vue";
-import Card from "./vc-card.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
+import _Card from "./vc-card.vue";
 
-export type VcCardSlots = {
-  default?: () => VNode[];
-  actions?: () => VNode[];
+export const VcCard = _Card as typeof _Card & {
+  new (): {
+    $slots: {
+      default: () => VNode[];
+      actions: () => VNode[];
+    };
+  };
 };
-
-export const VcCard: GlobalComponentConstructor<typeof Card, VcCardSlots> = Card;

package/ui/components/atoms/vc-checkbox/index.ts

@@ -1,10 +1,11 @@
 import { VNode } from "vue";
-import Checkbox from "./vc-checkbox.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
+import _Checkbox from "./vc-checkbox.vue";
 
-export type VcCheckboxSlots = {
-  default?: () => VNode[];
-  error?: () => VNode[];
+export const VcCheckbox = _Checkbox as typeof _Checkbox & {
+  new (): {
+    $slots: {
+      default: () => VNode[];
+      error: () => VNode[];
+    };
+  };
 };
-
-export const VcCheckbox: GlobalComponentConstructor<typeof Checkbox, VcCheckboxSlots> = Checkbox;

package/ui/components/atoms/vc-col/index.ts

@@ -1,9 +1,10 @@
 import { VNode } from "vue";
-import Col from "./vc-col.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
+import _Col from "./vc-col.vue";
 
-export type VcColSlots = {
-  default?: () => VNode[];
+export const VcCol = _Col as typeof _Col & {
+  new (): {
+    $slots: {
+      default: () => VNode[];
+    };
+  };
 };
-
-export const VcCol: GlobalComponentConstructor<typeof Col, VcColSlots> = Col;

package/ui/components/atoms/vc-container/index.ts

@@ -1,9 +1,10 @@
 import { VNode } from "vue";
-import Container from "./vc-container.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
+import _Container from "./vc-container.vue";
 
-export type VcContainerSlots = {
-  default?: () => VNode[];
+export const VcContainer = _Container as typeof _Container & {
+  new (): {
+    $slots: {
+      default: () => VNode[];
+    };
+  };
 };
-
-export const VcContainer: GlobalComponentConstructor<typeof Container, VcContainerSlots> = Container;

package/ui/components/atoms/vc-hint/index.ts

@@ -1,9 +1,10 @@
-import Hint from "./vc-hint.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
+import _Hint from "./vc-hint.vue";
 import { VNode } from "vue";
 
-export type VcHintSlots = {
-  default?: () => VNode[];
+export const VcHint = _Hint as typeof _Hint & {
+  new (): {
+    $slots: {
+      default: () => VNode[];
+    };
+  };
 };
-
-export const VcHint: GlobalComponentConstructor<typeof Hint, VcHintSlots> = Hint;

package/ui/components/atoms/vc-icon/index.ts

@@ -1,9 +1,3 @@
-import { VNode } from "vue";
-import Icon from "./vc-icon.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
+import _Icon from "./vc-icon.vue";
 
-export type VcIconSlots = {
-  default?: () => VNode[];
-};
-
-export const VcIcon: GlobalComponentConstructor<typeof Icon, VcIconSlots> = Icon;
+export const VcIcon = _Icon as typeof _Icon;

package/ui/components/atoms/vc-image/index.ts

@@ -1,9 +1,3 @@
-import { VNode } from "vue";
-import Image from "./vc-image.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
+import _Image from "./vc-image.vue";
 
-export type VcImageSlots = {
-  default?: () => VNode[];
-};
-
-export const VcImage: GlobalComponentConstructor<typeof Image, VcImageSlots> = Image;
+export const VcImage = _Image as typeof _Image;

package/ui/components/atoms/vc-info-row/index.ts

@@ -1,9 +1,3 @@
-import InfoRow from "./vc-info-row.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
-import { VNode } from "vue";
+import _InfoRow from "./vc-info-row.vue";
 
-export type VcInfoRowSlots = {
-  default?: () => VNode[];
-};
-
-export const VcInfoRow: GlobalComponentConstructor<typeof InfoRow, VcInfoRowSlots> = InfoRow;
+export const VcInfoRow = _InfoRow as typeof _InfoRow;

package/ui/components/atoms/vc-label/index.ts

@@ -1,10 +1,11 @@
-import Label from "./vc-label.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
+import _Label from "./vc-label.vue";
 import { VNode } from "vue";
 
-export type VcLabelSlots = {
-  default?: () => VNode[];
-  tooltip?: () => VNode[];
+export const VcLabel = _Label as typeof _Label & {
+  new (): {
+    $slots: {
+      default: () => VNode[];
+      tooltip: () => VNode[];
+    };
+  };
 };
-
-export const VcLabel: GlobalComponentConstructor<typeof Label, VcLabelSlots> = Label;

package/ui/components/atoms/vc-link/index.ts

@@ -1,9 +1,10 @@
 import { VNode } from "vue";
-import Link from "./vc-link.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
+import _Link from "./vc-link.vue";
 
-export type VcLinkSlots = {
-  default?: () => VNode[];
+export const VcLink = _Link as typeof _Link & {
+  new (): {
+    $slots: {
+      default: () => VNode[];
+    };
+  };
 };
-
-export const VcLink: GlobalComponentConstructor<typeof Link, VcLinkSlots> = Link;

package/ui/components/atoms/vc-loading/index.ts

@@ -1,9 +1,3 @@
-import { VNode } from "vue";
-import Loading from "./vc-loading.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
+import _Loading from "./vc-loading.vue";
 
-export type VcLoadingSlots = {
-  default?: () => VNode[];
-};
-
-export const VcLoading: GlobalComponentConstructor<typeof Loading, VcLoadingSlots> = Loading;
+export const VcLoading = _Loading as typeof _Loading;

package/ui/components/atoms/vc-progress/index.ts

@@ -1,9 +1,10 @@
 import { VNode } from "vue";
-import Progress from "./vc-progress.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
+import _Progress from "./vc-progress.vue";
 
-export type VcProgressSlots = {
-  default?: () => VNode[];
+export const VcProgress = _Progress as typeof _Progress & {
+  new (): {
+    $slots: {
+      default: () => VNode[];
+    };
+  };
 };
-
-export const VcProgress: GlobalComponentConstructor<typeof Progress, VcProgressSlots> = Progress;

package/ui/components/atoms/vc-row/index.ts

@@ -1,9 +1,10 @@
 import { VNode } from "vue";
-import Row from "./vc-row.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
+import _Row from "./vc-row.vue";
 
-export type VcRowSlots = {
-  default?: () => VNode[];
+export const VcRow = _Row as typeof _Row & {
+  new (): {
+    $slots: {
+      default: () => VNode[];
+    };
+  };
 };
-
-export const VcRow: GlobalComponentConstructor<typeof Row, VcRowSlots> = Row;

package/ui/components/atoms/vc-status/index.ts

@@ -1,9 +1,10 @@
 import { VNode } from "vue";
-import Status from "./vc-status.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
+import _Status from "./vc-status.vue";
 
-export type VcStatusSlots = {
-  default?: () => VNode[];
+export const VcStatus = _Status as typeof _Status & {
+  new (): {
+    $slots: {
+      default: () => VNode[];
+    };
+  };
 };
-
-export const VcStatus: GlobalComponentConstructor<typeof Status, VcStatusSlots> = Status;

package/ui/components/atoms/vc-status-icon/index.ts

@@ -1,9 +1,3 @@
-import { VNode } from "vue";
-import StatusIcon from "./vc-status-icon.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
+import _StatusIcon from "./vc-status-icon.vue";
 
-export type VcStatusIconSlots = {
-  default?: () => VNode[];
-};
-
-export const VcStatusIcon: GlobalComponentConstructor<typeof StatusIcon, VcStatusIconSlots> = StatusIcon;
+export const VcStatusIcon = _StatusIcon as typeof _StatusIcon;

package/ui/components/atoms/vc-switch/index.ts

@@ -1,9 +1,3 @@
-import { VNode } from "vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
-import Switch from "./vc-switch.vue";
+import _Switch from "./vc-switch.vue";
 
-export type VcSwitchSlots = {
-  default?: () => VNode[];
-};
-
-export const VcSwitch: GlobalComponentConstructor<typeof Switch, VcSwitchSlots> = Switch;
+export const VcSwitch = _Switch as typeof _Switch;

package/ui/components/atoms/vc-widget/index.ts

@@ -1,9 +1,3 @@
-import { VNode } from "vue";
-import Widget from "./vc-widget.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
+import _Widget from "./vc-widget.vue";
 
-export type VcWidgetSlots = {
-  default?: () => VNode[];
-}
-
-export const VcWidget: GlobalComponentConstructor<typeof Widget, VcWidgetSlots> = Widget;
+export const VcWidget = _Widget as typeof _Widget;

package/ui/components/index.ts

@@ -1,44 +1,44 @@
 /* Atoms */
-export * from "./atoms/vc-badge";
-export * from "./atoms/vc-button";
-export * from "./atoms/vc-card";
-export * from "./atoms/vc-checkbox";
-export * from "./atoms/vc-col";
-export * from "./atoms/vc-container";
-export * from "./atoms/vc-hint";
-export * from "./atoms/vc-icon";
-export * from "./atoms/vc-info-row";
-export * from "./atoms/vc-image";
-export * from "./atoms/vc-label";
-export * from "./atoms/vc-link";
-export * from "./atoms/vc-loading";
-export * from "./atoms/vc-progress";
-export * from "./atoms/vc-row";
-export * from "./atoms/vc-status";
-export * from "./atoms/vc-status-icon";
-export * from "./atoms/vc-switch";
-export * from "./atoms/vc-widget";
+export { VcBadge } from "./atoms/vc-badge";
+export { VcButton } from "./atoms/vc-button";
+export { VcCard } from "./atoms/vc-card";
+export { VcCheckbox } from "./atoms/vc-checkbox";
+export { VcCol } from "./atoms/vc-col";
+export { VcContainer } from "./atoms/vc-container";
+export { VcHint } from "./atoms/vc-hint";
+export { VcIcon } from "./atoms/vc-icon";
+export { VcInfoRow } from "./atoms/vc-info-row";
+export { VcImage } from "./atoms/vc-image";
+export { VcLabel } from "./atoms/vc-label";
+export { VcLink } from "./atoms/vc-link";
+export { VcLoading } from "./atoms/vc-loading";
+export { VcProgress } from "./atoms/vc-progress";
+export { VcRow } from "./atoms/vc-row";
+export { VcStatus } from "./atoms/vc-status";
+export { VcStatusIcon } from "./atoms/vc-status-icon";
+export { VcSwitch } from "./atoms/vc-switch";
+export { VcWidget } from "./atoms/vc-widget";
 
 /* Molecules */
-export * from "./molecules/vc-breadcrumbs";
-export * from "./molecules/vc-code-editor";
-export * from "./molecules/vc-editor";
-export * from "./molecules/vc-form";
-export * from "./molecules/vc-file-upload";
-export * from "./molecules/vc-input";
-export * from "./molecules/vc-input-currency";
-export * from "./molecules/vc-notification";
-export * from "./molecules/vc-pagination";
-export * from "./molecules/vc-rating";
-export * from "./molecules/vc-select";
-export * from "./molecules/vc-slider";
-export * from "./molecules/vc-textarea";
+export { VcBreadcrumbs } from "./molecules/vc-breadcrumbs";
+export { VcCodeEditor } from "./molecules/vc-code-editor";
+export { VcEditor } from "./molecules/vc-editor";
+export { VcForm } from "./molecules/vc-form";
+export { VcFileUpload } from "./molecules/vc-file-upload";
+export { VcInput } from "./molecules/vc-input";
+export { VcInputCurrency } from "./molecules/vc-input-currency";
+export { VcNotification } from "./molecules/vc-notification";
+export { VcPagination } from "./molecules/vc-pagination";
+export { VcRating } from "./molecules/vc-rating";
+export { VcSelect } from "./molecules/vc-select";
+export { VcSlider } from "./molecules/vc-slider";
+export { VcTextarea } from "./molecules/vc-textarea";
 
 /* Organisms */
-export * from "./organisms/vc-app";
-export * from "./organisms/vc-blade";
-export * from "./organisms/vc-dynamic-property";
-export * from "./organisms/vc-gallery";
-export * from "./organisms/vc-login-form";
-export * from "./organisms/vc-popup";
-export * from "./organisms/vc-table";
+export { VcApp } from "./organisms/vc-app";
+export { VcBlade } from "./organisms/vc-blade";
+export { VcDynamicProperty } from "./organisms/vc-dynamic-property";
+export { VcGallery } from "./organisms/vc-gallery";
+export { VcLoginForm } from "./organisms/vc-login-form";
+export { VcPopup } from "./organisms/vc-popup";
+export { VcTable } from "./organisms/vc-table";

package/ui/components/molecules/vc-breadcrumbs/index.ts

@@ -1,9 +1,3 @@
-import { VNode } from "vue";
-import Breadcrumbs from "./vc-breadcrumbs.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
+import _Breadcrumbs from "./vc-breadcrumbs.vue";
 
-export type VcBreadcrumbsSlots = {
-  default?: () => VNode[];
-};
-
-export const VcBreadcrumbs: GlobalComponentConstructor<typeof Breadcrumbs, VcBreadcrumbsSlots> = Breadcrumbs;
+export const VcBreadcrumbs = _Breadcrumbs as typeof _Breadcrumbs;

package/ui/components/molecules/vc-code-editor/index.ts

@@ -1,9 +1,10 @@
 import { VNode } from "vue";
-import CodeEditor from "./vc-code-editor.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
+import _CodeEditor from "./vc-code-editor.vue";
 
-export type VcCodeEditorSlots = {
-  error?: () => VNode[];
+export const VcCodeEditor = _CodeEditor as typeof _CodeEditor & {
+  new (): {
+    $slots: {
+      error: () => VNode[];
+    };
+  };
 };
-
-export const VcCodeEditor: GlobalComponentConstructor<typeof CodeEditor, VcCodeEditorSlots> = CodeEditor;

package/ui/components/molecules/vc-editor/index.ts

@@ -1,9 +1,10 @@
 import { VNode } from "vue";
-import Editor from "./vc-editor.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
+import _Editor from "./vc-editor.vue";
 
-export type VcEditorSlots = {
-  error?: () => VNode[];
+export const VcEditor = _Editor as typeof _Editor & {
+  new (): {
+    $slots: {
+      error: () => VNode[];
+    };
+  };
 };
-
-export const VcEditor: GlobalComponentConstructor<typeof Editor, VcEditorSlots> = Editor;

package/ui/components/molecules/vc-file-upload/index.ts

@@ -1,9 +1,10 @@
 import { VNode } from "vue";
-import FileUpload from "./vc-file-upload.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
+import _FileUpload from "./vc-file-upload.vue";
 
-export type VcFileUploadSlots = {
-  error?: () => VNode[];
+export const VcFileUpload = _FileUpload as typeof _FileUpload & {
+  new (): {
+    $slots: {
+      error?: () => VNode[];
+    };
+  };
 };
-
-export const VcFileUpload: GlobalComponentConstructor<typeof FileUpload, VcFileUploadSlots> = FileUpload;

package/ui/components/molecules/vc-file-upload/vc-file-upload.vue

@@ -1,15 +1,20 @@
 <template>
   <div class="tw-flex tw-flex-col tw-flex-1">
     <div
-      class="vc-file-upload tw-relative tw-h-[155px] tw-box-border tw-border tw-border-dashed tw-border-[#c8dbea] tw-rounded-[6px] tw-p-2 tw-p-4 tw-flex tw-flex-col tw-items-center tw-justify-center"
-      :class="`vc-file-upload_${variant}`"
+      class="vc-file-upload tw-relative tw-h-[155px] tw-box-border tw-border tw-border-dashed tw-border-[#c8dbea] tw-rounded-[6px] tw-p-4 tw-flex tw-flex-col tw-items-center tw-justify-center"
+      :class="[
+        `vc-file-upload_${variant}`,
+        {
+          '!tw-bg-[#e8f1f9] !tw-border-solid tw-cursor-copy': isDragging,
+        },
+      ]"
       @drop.stop.prevent="onDrop"
       @drag.stop.prevent
       @dragstart.stop.prevent
       @dragend.stop.prevent
-      @dragover.stop.prevent
+      @dragover.stop.prevent="dragOver"
       @dragenter.stop.prevent
-      @dragleave.stop.prevent
+      @dragleave.stop.prevent="dragLeave"
     >
       <VcLoading :active="loading"></VcLoading>
       <VcIcon
@@ -73,6 +78,7 @@ const emit = defineEmits<Emits>();
 const instance = getCurrentInstance();
 // Prepare validation rules using required and rules props combination
 let internalRules = unref(props.rules) || "";
+const isDragging = ref(false);
 
 // Prepare field-level validation
 const { errorMessage, handleChange, validate } = useField(
@@ -109,6 +115,14 @@ function onDrop(event: DragEvent) {
     emit("upload", fileList);
   }
 }
+
+function dragOver() {
+  isDragging.value = true;
+}
+
+function dragLeave() {
+  isDragging.value = false;
+}
 </script>
 
 <style lang="scss">

package/ui/components/molecules/vc-form/index.ts

@@ -1,9 +1,10 @@
 import { VNode } from "vue";
-import Form from "./vc-form.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
+import _Form from "./vc-form.vue";
 
-export type VcFormSlots = {
-  default?: () => VNode[];
+export const VcForm = _Form as typeof _Form & {
+  new (): {
+    $slots: {
+      default: () => VNode[];
+    };
+  };
 };
-
-export const VcForm: GlobalComponentConstructor<typeof Form, VcFormSlots> = Form;

package/ui/components/molecules/vc-input/index.ts

@@ -1,59 +1,60 @@
 import { VNode } from "vue";
-import Input from "./vc-input.vue";
-import { GlobalComponentConstructor } from "./../../../services/types/ts-helpers";
+import _Input from "./vc-input.vue";
 
-export type VcInputSlots = {
-  /**
-   * Slot for controls
-   * @param scope
-   */
-  control?: (scope: {
-    /**
-     * Field is editable
-     */
-    editable: boolean;
-    /**
-     * Field has focus
-     */
-    focused: boolean;
-    /**
-     * Field's value
-     */
-    modelValue: string | number | Date | null;
-    /**
-     * Function that emits an @input event in the context of the field
-     * @param value Value to be emitted
-     */
-    emitValue: (value: string | number | Date | null) => void;
-    /**
-     * Field placeholder text
-     */
-    placeholder?: string | undefined;
-  }) => VNode[];
-  /**
-   * Prepend outer field
-   */
-  prepend?: () => VNode[];
-  /**
-   * Prepend inner field
-   */
-  "prepend-inner"?: () => VNode[];
-  /**
-   * Append to inner field
-   */
-  "append-inner"?: () => VNode[];
-  /**
-   * Append outer field
-   */
-  append?: () => VNode[];
-  /**
-   * Slot for errors
-   */
-  error?: () => VNode[];
-  /**
-   * Slot for hint text
-   */
-  hint?: () => VNode[];
+export const VcInput = _Input as typeof _Input & {
+  new (): {
+    $slots: {
+      /**
+       * Slot for controls
+       * @param scope
+       */
+      control: (scope: {
+        /**
+         * Field is editable
+         */
+        editable: boolean;
+        /**
+         * Field has focus
+         */
+        focused: boolean;
+        /**
+         * Field's value
+         */
+        modelValue: string | number | Date | null;
+        /**
+         * Function that emits an @input event in the context of the field
+         * @param value Value to be emitted
+         */
+        emitValue: (value: string | number | Date | null) => void;
+        /**
+         * Field placeholder text
+         */
+        placeholder: string | undefined;
+      }) => VNode[];
+      /**
+       * Prepend outer field
+       */
+      prepend: () => VNode[];
+      /**
+       * Prepend inner field
+       */
+      "prepend-inner": () => VNode[];
+      /**
+       * Append to inner field
+       */
+      "append-inner": () => VNode[];
+      /**
+       * Append outer field
+       */
+      append: () => VNode[];
+      /**
+       * Slot for errors
+       */
+      error: () => VNode[];
+      /**
+       * Slot for hint text
+       */
+      hint: () => VNode[];
+    };
+  };
 };
-
-export const VcInput: GlobalComponentConstructor<typeof Input, VcInputSlots> = Input;