@vc-shell/framework 1.0.39 → 1.0.40

package/dist/ui/components/molecules/vc-select/vc-select-model.d.ts

@@ -0,0 +1,207 @@
+import { VNode } from "vue";
+export type OptionProp = ((option: string | Record<string, unknown>) => string) | string | undefined;
+export interface VcSelectProps {
+    /**
+     * Name of select
+     */
+    name?: string | undefined;
+    /**
+     * Model of the component; Must be Array if using 'multiple' prop; Use this property with a listener for 'update:modelValue' event OR use v-model directive
+     */
+    modelValue: any;
+    /**
+     * Try to map labels of model from 'options' Array; If you are using emit-value you will probably need to use map-options to display the label text in the select field rather than the value;
+     * Default value: true
+     */
+    mapOptions?: boolean | undefined;
+    /**
+     * Does field have validation errors?
+     */
+    error?: boolean | undefined;
+    /**
+     * Validation error message (gets displayed only if 'error' is set to 'true')
+     */
+    errorMessage?: string | undefined;
+    /**
+     * Select label
+     */
+    label?: string | undefined;
+    /**
+     * Select description (hint) text below input component
+     */
+    hint?: string | undefined;
+    /**
+     * Prefix
+     */
+    prefix?: string | undefined;
+    /**
+     * Suffix
+     */
+    suffix?: string | undefined;
+    /**
+     * Signals the user a process is in progress by displaying a spinner
+     */
+    loading?: boolean | undefined;
+    /**
+     * Appends clearable icon when a value is set;
+     * When clicked, model becomes null
+     */
+    clearable?: boolean | undefined;
+    /**
+     * Put component in disabled mode
+     */
+    disabled?: boolean | undefined;
+    /**
+     * Allow multiple selection; Model must be Array
+     */
+    multiple?: boolean | undefined;
+    /**
+     * Available options that the user can select from.
+     * Default value: []
+     */
+    options?: ((keyword?: string, skip?: number, ids?: string[]) => Promise<{
+        results?: Record<string, unknown>[];
+        totalCount?: number;
+    }>) | any[] | undefined;
+    /**
+     * Property of option which holds the 'value'
+     * Default value: id
+     * @param option The current option being processed
+     * @returns Value of the current option
+     */
+    optionValue?: OptionProp;
+    /**
+     * Property of option which holds the 'label'
+     * Default value: title
+     * @param option The current option being processed
+     * @returns Label of the current option
+     */
+    optionLabel?: OptionProp;
+    /**
+     * Update model with the value of the selected option instead of the whole option
+     */
+    emitValue?: boolean | undefined;
+    /**
+     * Debounce the search input update with an amount of milliseconds
+     * Default value: 500
+     */
+    debounce?: number | string | undefined;
+    /**
+     * Input placeholder text
+     */
+    placeholder?: string | undefined;
+    /**
+     * Input tooltip information
+     */
+    tooltip?: string | undefined;
+    /**
+     * Input required state
+     */
+    required?: boolean | undefined;
+    /**
+     * Input search activation
+     */
+    searchable?: boolean | undefined;
+}
+export interface VcSelectEmits {
+    /**
+     * Emitted when the component needs to change the model; Is also used by v-model
+     * @param event Emitted event name
+     * @param value New model value
+     */
+    (event: "update:modelValue", value: any): void;
+    /**
+     * Emitted when user wants to filter a value
+     * @param event Emitted event name
+     * @param inputValue What the user typed
+     */
+    (event: "search", inputValue: string): void;
+    /**
+     * Emitted when the select options list is hidden
+     * @param event Emitted event name
+     */
+    (event: "close"): void;
+}
+export interface VcSelectSlots {
+    /**
+     * Custom select control
+     */
+    control: (scope: {
+        toggleHandler: () => void;
+    }) => VNode[];
+    /**
+     * Prepend inner field
+     */
+    "prepend-inner": () => VNode[];
+    /**
+     * Append to inner field
+     */
+    "append-inner": () => VNode[];
+    /**
+     * Prepend outer field
+     */
+    prepend: () => VNode[];
+    /**
+     * Append outer field
+     */
+    append: () => VNode[];
+    /**
+     * What should the menu display after filtering options and none are left to be displayed
+     * @param scope
+     */
+    "no-option": () => VNode[];
+    /**
+     * Slot for errors
+     */
+    error: () => VNode[];
+    /**
+     * Slot for hint text
+     */
+    hint: () => VNode[];
+    /**
+     * Override default selection slot
+     * @param scope
+     */
+    "selected-item": (scope: {
+        /**
+         * Selection index
+         */
+        index: number;
+        /**
+         * Selected option -- its value is taken from model
+         */
+        opt: any;
+        /**
+         * Always true -- passed as prop
+         */
+        selected: boolean;
+        /**
+         * Remove selected option located at specific index
+         * @param index Index at which to remove selection
+         */
+        removeAtIndex: (index: number) => void;
+    }) => VNode[];
+    /**
+     * Override default selection slot;
+     */
+    option: (scope: {
+        /**
+         * Option index
+         */
+        index: number;
+        /**
+         * Option -- its value is taken from 'options' prop
+         */
+        opt: any;
+        /**
+         * Is option selected?
+         */
+        selected: boolean;
+        /**
+         * Add/remove option from model
+         * @param opt Option to add to model
+         */
+        toggleOption: (opt: any) => void;
+    }) => VNode[];
+}
+//# sourceMappingURL=vc-select-model.d.ts.map

package/dist/ui/components/molecules/vc-select/vc-select-model.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"vc-select-model.d.ts","sourceRoot":"","sources":["../../../../../ui/components/molecules/vc-select/vc-select-model.ts"],"names":[],"mappings":"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"}

package/dist/ui/components/molecules/vc-textarea/vc-textarea.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"vc-textarea.stories.d.ts","sourceRoot":"","sources":["../../../../../ui/components/molecules/vc-textarea/vc-textarea.stories.ts"],"names":[],"mappings":";;;;AAOA,wBAGE;AAUF,eAAO,MAAM,QAAQ,KAAoB,CAAC"}

package/dist/ui/components/organisms/vc-app/vc-app.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"vc-app.stories.d.ts","sourceRoot":"","sources":["../../../../../ui/components/organisms/vc-app/vc-app.stories.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAOA,wBAeE;AAUF,eAAO,MAAM,GAAG,KAAoB,CAAC"}

package/dist/ui/components/organisms/vc-blade/vc-blade.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"vc-blade.stories.d.ts","sourceRoot":"","sources":["../../../../../ui/components/organisms/vc-blade/vc-blade.stories.ts"],"names":[],"mappings":";;;;;;;;;;;;;;AAOA,wBAOE;AAWF,eAAO,MAAM,KAAK,KAAoB,CAAC"}

package/dist/ui/components/organisms/vc-login-form/vc-login-form.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"vc-login-form.stories.d.ts","sourceRoot":"","sources":["../../../../../ui/components/organisms/vc-login-form/vc-login-form.stories.ts"],"names":[],"mappings":";;;;AASA,wBAGE;AAqCF,eAAO,MAAM,SAAS,KAAoB,CAAC"}

package/dist/ui/components/organisms/vc-popup/vc-popup.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"vc-popup.stories.d.ts","sourceRoot":"","sources":["../../../../../ui/components/organisms/vc-popup/vc-popup.stories.ts"],"names":[],"mappings":";;;;AAOA,wBAGE;AAUF,eAAO,MAAM,KAAK,KAAoB,CAAC"}

package/dist/ui/components/organisms/vc-table/vc-table.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"vc-table.stories.d.ts","sourceRoot":"","sources":["../../../../../ui/components/organisms/vc-table/vc-table.stories.ts"],"names":[],"mappings":";;;;AASA,wBAGE;AAwBF,eAAO,MAAM,KAAK,KAAoB,CAAC"}

package/dist/ui/types/index.d.ts

@@ -0,0 +1,13 @@
+import { GlobalComponentConstructor } from "./ts-helpers";
+import { VcInputEmits, VcInputProps, VcInputSlots } from "../components/molecules/vc-input/vc-input-model";
+import { VcSelectEmits, VcSelectProps, VcSelectSlots } from "../components/molecules/vc-select/vc-select-model";
+import { VcInputCurrencyProps, VcInputCurrencyEmits, VcInputCurrencySlots } from "@/ui/components/molecules/vc-input-currency/vc-input-currency-model";
+declare module "@vue/runtime-core" {
+    interface GlobalComponents {
+        VcInput: GlobalComponentConstructor<VcInputProps, VcInputSlots, VcInputEmits>;
+        VcInputCurrency: GlobalComponentConstructor<VcInputCurrencyProps, VcInputCurrencySlots, VcInputCurrencyEmits>;
+        VcSelect: GlobalComponentConstructor<VcSelectProps, VcSelectSlots, VcSelectEmits>;
+    }
+}
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/ui/types/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../ui/types/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,0BAA0B,EAAE,MAAM,cAAc,CAAC;AAC1D,OAAO,EACL,YAAY,EACZ,YAAY,EACZ,YAAY,EACb,MAAM,iDAAiD,CAAC;AACzD,OAAO,EACL,aAAa,EACb,aAAa,EACb,aAAa,EACd,MAAM,mDAAmD,CAAC;AAC3D,OAAO,EACL,oBAAoB,EACpB,oBAAoB,EACpB,oBAAoB,EACrB,MAAM,qEAAqE,CAAC;AAE7E,OAAO,QAAQ,mBAAmB,CAAC;IACjC,UAAU,gBAAgB;QACxB,OAAO,EAAE,0BAA0B,CACjC,YAAY,EACZ,YAAY,EACZ,YAAY,CACb,CAAC;QACF,eAAe,EAAE,0BAA0B,CACzC,oBAAoB,EACpB,oBAAoB,EACpB,oBAAoB,CACrB,CAAC;QACF,QAAQ,EAAE,0BAA0B,CAClC,aAAa,EACb,aAAa,EACb,aAAa,CACd,CAAC;KACH;CACF;AAED,OAAO,EAAE,CAAC"}

package/dist/ui/types/ts-helpers.d.ts

@@ -0,0 +1,13 @@
+import { ComponentOptions, ComponentPublicInstance, ComputedOptions, EmitsOptions, MethodOptions, VNodeProps } from "vue";
+export type PublicProps = VNodeProps;
+export type ComponentConstructor<Component extends ComponentPublicInstance<Props, RawBindings, D, C, M, E> = ComponentPublicInstance<any>, Props = any, RawBindings = any, D = any, C extends ComputedOptions = ComputedOptions, M extends MethodOptions = MethodOptions, E extends EmitsOptions = EmitsOptions> = {
+    new (): Component;
+} & ComponentOptions<Props, RawBindings, D, C, M, any, any, E>;
+export type GlobalComponentConstructor<Props = {}, Slots = {}, Emits = {}> = {
+    new (): {
+        $props: PublicProps & Props;
+        $slots: Slots;
+        $emit: EmitsOptions & Emits;
+    };
+};
+//# sourceMappingURL=ts-helpers.d.ts.map

package/dist/ui/types/ts-helpers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ts-helpers.d.ts","sourceRoot":"","sources":["../../../ui/types/ts-helpers.ts"],"names":[],"mappings":"AACA,OAAO,EACL,gBAAgB,EAChB,uBAAuB,EACvB,eAAe,EACf,YAAY,EACZ,aAAa,EACb,UAAU,EACX,MAAM,KAAK,CAAC;AAEb,MAAM,MAAM,WAAW,GAAG,UAAU,CAAC;AAErC,MAAM,MAAM,oBAAoB,CAC9B,SAAS,SAAS,uBAAuB,CACvC,KAAK,EACL,WAAW,EACX,CAAC,EACD,CAAC,EACD,CAAC,EACD,CAAC,CACF,GAAG,uBAAuB,CAAC,GAAG,CAAC,EAChC,KAAK,GAAG,GAAG,EACX,WAAW,GAAG,GAAG,EACjB,CAAC,GAAG,GAAG,EACP,CAAC,SAAS,eAAe,GAAG,eAAe,EAC3C,CAAC,SAAS,aAAa,GAAG,aAAa,EACvC,CAAC,SAAS,YAAY,GAAG,YAAY,IACnC;IAAE,QAAQ,SAAS,CAAA;CAAE,GAAG,gBAAgB,CAC1C,KAAK,EACL,WAAW,EACX,CAAC,EACD,CAAC,EACD,CAAC,EACD,GAAG,EACH,GAAG,EACH,CAAC,CACF,CAAC;AAGF,MAAM,MAAM,0BAA0B,CAAC,KAAK,GAAG,EAAE,EAAE,KAAK,GAAG,EAAE,EAAE,KAAK,GAAG,EAAE,IAAI;IAC3E,QAAQ;QACN,MAAM,EAAE,WAAW,GAAG,KAAK,CAAC;QAC5B,MAAM,EAAE,KAAK,CAAC;QACd,KAAK,EAAE,YAAY,GAAG,KAAK,CAAC;KAC7B,CAAC;CACH,CAAC"}

package/dist/vite.config.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"vite.config.d.ts","sourceRoot":"","sources":["../vite.config.ts"],"names":[],"mappings":";AAKA,wBA+BE"}
+{"version":3,"file":"vite.config.d.ts","sourceRoot":"","sources":["../vite.config.ts"],"names":[],"mappings":";AAKA,wBA2CE"}

package/package.json

@@ -1,25 +1,41 @@
 {
   "name": "@vc-shell/framework",
-  "version": "1.0.39",
+  "version": "1.0.40",
   "main": "./dist/framework.js",
+  "module": "./dist/framework.js",
   "types": "./dist/index.d.ts",
   "style": "./dist/style.css",
   "files": [
-    "dist/*",
+    "dist",
     "tailwind.config.js",
-    "components",
+    "ui",
     "core",
     "shared"
   ],
+  "exports": {
+    ".": {
+      "import": "./dist/framework.js",
+      "require": "./dist/framework.js",
+      "types": "./dist/index.d.ts"
+    },
+    "./client": {
+      "types": "./dist/ui/types/index.d.ts"
+    },
+    "./dist/style.css": "./dist/style.css",
+    "./tailwind.config": "./tailwind.config.js",
+    "./*": "./*"
+  },
   "scripts": {
     "build": "vite build",
+    "development": "vite build --watch -m development",
     "watch": "vite build --watch"
   },
   "dependencies": {
     "@popperjs/core": "^2.11.0",
     "@vee-validate/rules": "^4.5.5",
-    "@vueuse/core": "^6.0.0",
-    "@vueuse/integrations": "^6.0.0",
+    "@vueuse/components": "^9.9.0",
+    "@vueuse/core": "^9.9.0",
+    "@vueuse/integrations": "^9.9.0",
     "client-oauth2": "^4.3.3",
     "moment": "^2.29.1",
     "normalize.css": "^8.0.1",
@@ -34,21 +50,22 @@
   "devDependencies": {
     "@originjs/vite-plugin-commonjs": "^1.0.3",
     "@rollup/plugin-commonjs": "^21.0.2",
-    "@vc-shell/api-client-generator": "^1.0.39",
-    "@vc-shell/config-generator": "^1.0.39",
+    "@vc-shell/api-client-generator": "^1.0.40",
+    "@vc-shell/config-generator": "^1.0.40",
+    "@vue-macros/volar": "^0.5.7",
     "sass": "^1.49.0",
     "typescript": "^4.6.2",
+    "unplugin-vue-macros": "^1.1.1",
     "url-pattern": "^1.0.3"
   },
   "peerDependencies": {
     "vee-validate": "^4.7.3",
     "vue": "^3.0.0",
-    "vue-router": "^4.1.6",
-    "yup": "^0.32.11"
+    "vue-router": "^4.1.6"
   },
   "publishConfig": {
     "access": "public",
     "registry": "https://registry.npmjs.org/"
   },
-  "gitHead": "efe2745d6854e48ac60e18a7e571ab5bb0827a7f"
+  "gitHead": "826168937f288def939c0a249181bc3fcc87d7f2"
 }

package/shared/app-switcher/components/vc-app-switcher/vc-app-switcher.vue

@@ -1,36 +1,36 @@
 <template>
   <div
-    class="relative h-full flex items-center justify-center ml-2 mr-[15px] shrink-0"
+    class="tw-relative tw-h-full tw-flex tw-items-center tw-justify-center tw-ml-2 tw-mr-[15px] tw-shrink-0"
     v-click-outside="onClose"
   >
     <button
-      class="hover:[&>img] hover:[&_div]:bg-[color:var(--app-bar-button-color-hover)]"
+      class="hover:[&>img] hover:[&_div]:tw-bg-[color:var(--app-bar-button-color-hover)]"
       @click.stop="toggleAppSwitch"
     >
       <div
-        class="h-[22px] w-[22px] [mask:url(/assets/app-select.svg)] bg-[color:var(--app-bar-button-color)] duration-200"
+        class="tw-h-[22px] tw-w-[22px] [mask:url(/assets/app-select.svg)] tw-bg-[color:var(--app-bar-button-color)] tw-duration-200"
       />
     </button>
 
     <div
       v-if="isVisible && appsList && appsList.length"
-      class="px-4 py-3.5 bg-white drop-shadow-[4px_4px_20px_rgba(47,86,108,0.25)] absolute z-[10000] rounded top-[var(--app-bar-height)] left-0"
+      class="tw-px-4 tw-py-3.5 tw-bg-white tw-drop-shadow-[4px_4px_20px_rgba(47,86,108,0.25)] tw-absolute tw-z-[10000] tw-rounded tw-top-[var(--app-bar-height)] tw-left-0"
     >
-      <ul class="flex flex-col gap-3 overflow-hidden">
+      <ul class="tw-flex tw-flex-col tw-gap-3 tw-overflow-hidden">
         <li
           v-for="item in appsList"
           :key="item.id"
           @click="switchApp(item)"
-          class="flex flex-row items-center cursor-pointer group"
-          :class="{ '[&>p]:font-extrabold': locationHandler(item.relativeUrl) }"
+          class="tw-flex tw-flex-row tw-items-center tw-cursor-pointer tw-group"
+          :class="{ '[&>p]:tw-font-extrabold': locationHandler(item.relativeUrl) }"
         >
           <img
             :src="imageUrl(item.iconUrl)"
             :alt="`icon_${item.id}`"
-            class="w-5 h-5 mr-2 shrink-0"
+            class="tw-w-5 tw-h-5 tw-mr-2 tw-shrink-0"
           />
           <p
-            class="font-normal text-sm text-[#727C87] truncate group-hover:opacity-80"
+            class="tw-font-normal tw-text-sm tw-text-[#727C87] tw-truncate group-hover:tw-opacity-80"
           >
             {{ item.title }}
           </p>

package/shared/assets/components/assets-details/assets-details.vue

@@ -8,38 +8,38 @@
     @close="$emit('close:blade')"
   >
     <!-- Blade contents -->
-    <div class="flex grow-1 border-t border-solid border-t-[#eaedf3]">
-      <div class="assets-details__content grow basis-0">
+    <div class= "tw-flex tw-grow-1 tw-border-t tw-border-solid tw-border-t-[#eaedf3]">
+      <div class="assets-details__content tw-grow tw-basis-0">
         <VcContainer :no-padding="true">
-          <div class="p-4">
+          <div class="tw-p-4">
             <VcForm>
               <VcImage
-                class="mb-4"
+                class="tw-mb-4"
                 :src="localImage.url"
                 size="xl"
                 :bordered="true"
               ></VcImage>
               <VcInput
-                class="mb-4"
+                class="tw-mb-4"
                 :label="$t('ASSETS.PAGES.DETAILS.FIELDS.NAME.TITLE')"
                 v-model="localImage.name"
-                :clearable="true"
-                is-required
+                clearable
+                required
                 :placeholder="
                   $t('ASSETS.PAGES.DETAILS.FIELDS.NAME.PLACEHOLDER')
                 "
               ></VcInput>
               <VcInput
-                class="mb-4"
+                class="tw-mb-4"
                 :label="$t('ASSETS.PAGES.DETAILS.FIELDS.ALT.TITLE')"
                 v-model="localImage.altText"
-                :clearable="true"
+                clearable
                 :placeholder="$t('ASSETS.PAGES.DETAILS.FIELDS.ALT.PLACEHOLDER')"
                 :tooltip="$t('ASSETS.PAGES.DETAILS.FIELDS.ALT.TOOLTIP')"
-                is-required
+                required
               ></VcInput>
               <VcTextarea
-                class="mb-4"
+                class="tw-mb-4"
                 :label="$t('ASSETS.PAGES.DETAILS.FIELDS.DESCRIPTION.TITLE')"
                 v-model="localImage.description"
                 :placeholder="
@@ -66,7 +66,7 @@ import {
   VcImage,
   VcInput,
   VcTextarea,
-} from "@/components";
+} from "@/ui/components";
 
 interface ILocalImage {
   url: string;

package/shared/blade-navigation/composables/useBladeNavigation/index.ts

@@ -88,7 +88,9 @@ export default (): IUseBladeNavigation => {
           try {
             await navigationCb();
           } catch (e) {
-            throw "Navigation failure";
+            console.log(e);
+          } finally {
+            console.debug(`Navigated to: ${parent.url}`);
           }
         } else if (!navigationCb) {
           await router.push(parent.url);
@@ -175,9 +177,7 @@ export default (): IUseBladeNavigation => {
     );
 
     if (index >= 0) {
-      const currentParent = unref(
-        bladesRefs.value[bladesRefs.value.length - 2]
-      );
+      const currentParent = unref(bladesRefs.value[index]);
 
       if (currentParent) {
         if (args.method && typeof currentParent[args.method] === "function") {

package/shared/blade-navigation/types/index.ts

@@ -1,52 +1,52 @@
-import {Component, ComponentPublicInstance} from "vue";
-import {IMenuItems} from "@/core/types";
-import {NavigationFailure} from "vue-router";
+import { Component, ComponentPublicInstance } from "vue";
+import { IMenuItems } from "@/core/types";
+import { NavigationFailure } from "vue-router";
 
 /* onParentCall event interface */
 export interface IParentCallArgs {
-    method: string;
-    args?: unknown;
-    callback?: (args: unknown) => void;
+  method: string;
+  args?: unknown;
+  callback?: (args: unknown) => void;
 }
 
 /* extended component */
 export type ExtendedComponent = Component & {
-    url?: string;
-    permissions?: string | string[];
-    idx?: number;
+  url?: string;
+  permissions?: string | string[];
+  idx?: number;
 };
 
 /* blade interface for navigation */
-export interface IBladeContainer extends IBladeEvent{
-    idx?: number;
+export interface IBladeContainer extends IBladeEvent {
+  idx?: number;
 }
 
 /* blade exposed methods */
 export interface IBladeElement extends ComponentPublicInstance {
-    onBeforeClose?: () => Promise<boolean>;
-    title?: string;
-    reloadParent?: () => void;
-    openDashboard?: () => void;
+  onBeforeClose?: () => Promise<boolean>;
+  title?: string;
+  reloadParent?: () => void;
+  openDashboard?: () => void;
 }
 
 /* emitted blade event */
 export interface IBladeEvent {
-    parentBlade?: ExtendedComponent;
-    component?: ExtendedComponent;
-    bladeOptions?: Record<string, unknown>;
-    param?: string;
-    onOpen?: () => void;
-    onClose?: () => void;
+  parentBlade?: ExtendedComponent;
+  component?: ExtendedComponent;
+  bladeOptions?: Record<string, unknown>;
+  param?: string;
+  onOpen?: () => void;
+  onClose?: () => void;
 }
 
 /* menu item event */
 export interface IMenuClickEvent {
-    item: IMenuItems
-    navigationCb: () => Promise<void | NavigationFailure>
+  item: IMenuItems;
+  navigationCb: () => Promise<void | NavigationFailure>;
 }
 
 /* openBlade args interface */
 export interface IOpenBlade extends IBladeEvent {
-    id?: number
-    navigationCb?: () => Promise<void | NavigationFailure>
+  id?: number;
+  navigationCb?: () => Promise<void | NavigationFailure>;
 }

package/tailwind.config.js

@@ -1,6 +1,7 @@
 /** @type { import('tailwindcss').Config } */
 module.exports = {
-  content: ["./components/**/*.{vue,js,ts,jsx,tsx}"],
+  prefix: 'tw-',
+  content: ["./ui/components/**/*.{vue,js,ts,jsx,tsx}"],
     theme: {
         fontFamily: {
             roboto: ["Roboto", "sans-serif"],
@@ -37,12 +38,12 @@ module.exports = {
                     to: {
                         "background-position": '30px 0, left'
                     }
-                }
+                },
             },
             animation: {
                 loadingMarker: "loadingMarker 3s infinite",
                 loadingMarkers: "loadingMarkers 3s infinite",
-                loadingProgress: "loadingProgress 1s linear infinite"
+                loadingProgress: "loadingProgress 1s linear infinite",
             }
         },
     },

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

@@ -0,0 +1,7 @@
+import { ComponentPublicInstance } from "vue";
+import { VcBadgeProps } from "./vc-badge-model";
+import { ComponentConstructor } from "@/ui/types/ts-helpers";
+import Badge from "./vc-badge.vue";
+export const VcBadge: ComponentConstructor<
+  ComponentPublicInstance<VcBadgeProps>
+> = Badge;

package/ui/components/atoms/vc-badge/vc-badge-model.ts

@@ -0,0 +1,30 @@
+import { VNode } from "vue";
+
+export interface VcBadgeProps {
+  /**
+   * Badge active state
+   * */
+  active?: boolean | undefined;
+  /**
+   * Put component in disabled state
+   * */
+  disabled?: boolean | undefined;
+  /**
+   * Is badge clickable?
+   * */
+  clickable?: boolean | undefined;
+}
+
+export interface VcBadgeEmits {
+  /**
+   * Emitted when component is clicked
+   * */
+  (event: "click"): void;
+}
+
+export interface VcBadgeSlots {
+  /**
+   * Slot for component content
+   * */
+  default: () => VNode[];
+}