@vc-shell/create-vc-app 1.2.4-beta.8 → 2.0.0-alpha.0

package/dist/templates/{base/src/router/routes.ts → standalone/src/router/routes.ts.ejs}

@@ -1,28 +1,53 @@
 import { RouteRecordRaw } from "vue-router";
 import App from "../pages/App.vue";
+<% if (dashboard) { %>
 import Dashboard from "../pages/Dashboard.vue";
+<% } %>
 import { Invite, Login, ResetPassword, ForgotPassword, ChangePasswordPage } from "@vc-shell/framework";
 // eslint-disable-next-line import/no-unresolved
 import whiteLogoImage from "/assets/logo-white.svg";
 // eslint-disable-next-line import/no-unresolved
 import bgImage from "/assets/background.jpg";
 
+<% if (tenantRoutes) { %>
+const tenantIdRegex = "[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{12}";
+<% } %>
+
 export const routes: RouteRecordRaw[] = [
   {
+<% if (tenantRoutes) { %>
+    path: `/:tenantId(${tenantIdRegex})?`,
+<% } else { %>
     path: "/",
+<% } %>
     component: App,
     name: "App",
     meta: {
       root: true,
     },
     children: [
+<% if (dashboard) { %>
       {
         name: "Dashboard",
         path: "",
-        alias: `/`,
+<% if (tenantRoutes) { %>
+        alias: `/:tenantId(${tenantIdRegex})?`,
+<% } else { %>
+        alias: "/",
+<% } %>
         component: Dashboard,
       },
+<% } %>
     ],
+<% if (tenantRoutes) { %>
+    beforeEnter: (to) => {
+      const { tenantId } = to.params;
+      if (!tenantId || new RegExp(tenantIdRegex).test(tenantId as string)) {
+        return true;
+      }
+      return { path: "/" };
+    },
+<% } %>
   },
   {
     name: "Login",
@@ -30,8 +55,7 @@ export const routes: RouteRecordRaw[] = [
     component: Login,
     props: () => ({
       logo: whiteLogoImage,
-      // background: bgImage,
-      title: "{{AppNameSentenceCase}}",
+      title: "<%- AppNameSentenceCase %>",
     }),
   },
   {
@@ -43,7 +67,6 @@ export const routes: RouteRecordRaw[] = [
       token: _route.query.token,
       userName: _route.query.userName,
       logo: whiteLogoImage,
-      // background: bgImage,
     }),
   },
   {
@@ -55,7 +78,6 @@ export const routes: RouteRecordRaw[] = [
       token: _route.query.token,
       userName: _route.query.userName,
       logo: whiteLogoImage,
-      // background: bgImage,
     }),
   },
   {
@@ -64,7 +86,6 @@ export const routes: RouteRecordRaw[] = [
     component: ForgotPassword,
     props: () => ({
       logo: whiteLogoImage,
-      // background: bgImage,
     }),
   },
   {
@@ -77,7 +98,6 @@ export const routes: RouteRecordRaw[] = [
     props: (_route) => ({
       forced: _route.meta.forced,
       logo: whiteLogoImage,
-      // background: bgImage,
     }),
   },
 ];

package/dist/templates/standalone/src/shims-vue.d.ts

@@ -0,0 +1,27 @@
+/* eslint-disable */
+
+import { CoreBladeAdditionalSettings } from "@vc-shell/framework";
+import type { Ref } from "vue";
+import type { Composer } from "vue-i18n";
+
+declare module "*.vue" {
+  import type { DefineComponent } from "vue";
+  const component: DefineComponent<{}, {}, any>;
+  export default component;
+}
+
+declare module "@vue/runtime-core" {
+  interface ComponentCustomProperties extends _ComponentCustomProperties {
+    $mergeLocaleMessage: Composer<{}, {}, {}, string, never, string>["mergeLocaleMessage"];
+    $hasAccess: (permissions: string | string[] | undefined) => boolean;
+    $isPhone: Ref<boolean>;
+    $isTablet: Ref<boolean>;
+    $isMobile: Ref<boolean>;
+    $isDesktop: Ref<boolean>;
+    $isTouch: boolean;
+  }
+
+  interface ComponentOptionsBase extends CoreBladeAdditionalSettings {}
+}
+
+export {};

package/dist/templates/standalone/src/styles/custom.scss

@@ -0,0 +1,116 @@
+/* Custom styles.
+*/
+
+/* Apply color scheme example
+You also need to register color theme in startApp() using the 'register(['my-theme'])' method of the useTheme composable. */
+/* :root[data-theme="your-theme-key"] {
+  // Primary
+  --primary-50: #1F2D3A;
+  --primary-100: #2B3D4A;
+  --primary-200: #3A4E5D;
+  --primary-300: #4A5F70;
+  --primary-400: #5B6F82;
+  --primary-500: #6C7F94;
+  --primary-600: #7A8F9E;
+  --primary-700: #8A9FA8;
+  --primary-800: #9AAEB2;
+  --primary-900: #AABFC0;
+  --primary-950: #BCCDD0;
+
+  // Secondary
+  --secondary-50: #1F2D3A;
+  --secondary-100: #2B3D4A;
+  --secondary-200: #3A4E5D;
+  --secondary-300: #4A5F70;
+  --secondary-400: #5B6F82;
+  --secondary-500: #6C7F94;
+  --secondary-600: #7A8F9E;
+  --secondary-700: #8A9FA8;
+  --secondary-800: #9AAEB2;
+  --secondary-900: #AABFC0;
+  --secondary-950: #BCCDD0;
+
+  // Accent
+  --accent-50: #1F2D3A;
+  --accent-100: #2B3D4A;
+  --accent-200: #3A4E5D;
+  --accent-300: #4A5F70;
+  --accent-400: #5B6F82;
+  --accent-500: #6C7F94;
+  --accent-600: #7A8F9E;
+  --accent-700: #8A9FA8;
+  --accent-800: #9AAEB2;
+  --accent-900: #AABFC0;
+  --accent-950: #BCCDD0;
+
+  // Neutrals
+  --neutrals-50: #2E2E2E;
+  --neutrals-100: #3D3D3D;
+  --neutrals-200: #4D4D4D;
+  --neutrals-300: #6D6D6D;
+  --neutrals-400: #8A8A8A;
+  --neutrals-500: #B3B3B3;
+  --neutrals-600: #D4D4D4;
+  --neutrals-700: #E4E4E4;
+  --neutrals-800: #F4F4F4;
+  --neutrals-900: #FAFAFA;
+  --neutrals-950: #FFFFFF;
+
+  // Additional
+  --additional-50: #2E2E2E;
+  --additional-950: #FFFFFF;
+
+  // States
+
+  // Warning
+  --warning-50: #3A2D00;
+  --warning-100: #5A4D00;
+  --warning-200: #7A6D00;
+  --warning-300: #9A8D00;
+  --warning-400: #B9AB00;
+  --warning-500: #D8C600;
+  --warning-600: #D8D100;
+  --warning-700: #B8A800;
+  --warning-800: #9A8B00;
+  --warning-900: #7A6E00;
+  --warning-950: #5A5000;
+
+  // Danger
+  --danger-50: #3F0D0D;
+  --danger-100: #5E1E1E;
+  --danger-200: #7E2F2F;
+  --danger-300: #9E3F3F;
+  --danger-400: #BF4F4F;
+  --danger-500: #DF5F5F;
+  --danger-600: #DF4D4D;
+  --danger-700: #BF3D3D;
+  --danger-800: #9E2D2D;
+  --danger-900: #7E1D1D;
+  --danger-950: #5E0D0D;
+
+  // Success
+  --success-50: #1D3A1D;
+  --success-100: #2D5A2D;
+  --success-200: #3A7A3A;
+  --success-300: #4A9A4A;
+  --success-400: #5AB05A;
+  --success-500: #6AC56A;
+  --success-600: #5A9A5A;
+  --success-700: #4A7F4A;
+  --success-800: #3A664A;
+  --success-900: #1D4C1D;
+  --success-950: #0A3A0A;
+
+  // Info
+  --info-50: #1F2D3A;
+  --info-100: #2B3D4A;
+  --info-200: #3A4E5D;
+  --info-300: #4A5F70;
+  --info-400: #5B6F82;
+  --info-500: #6C7F94;
+  --info-600: #7A8F9E;
+  --info-700: #8A9FA8;
+  --info-800: #9AAEB2;
+  --info-900: #AABFC0;
+  --info-950: #BCCDD0;
+} */

package/dist/templates/standalone/src/styles/index.scss

@@ -0,0 +1,8 @@
+@use 'custom';
+
+@tailwind base;
+
+@tailwind components;
+
+
+@tailwind utilities;

package/dist/templates/standalone/src/vue-i18n.d.ts

@@ -0,0 +1,10 @@
+import type { ComponentCustomProperties } from '@vue/runtime-core';
+
+declare module "@vue/runtime-core" {
+  interface ComponentCustomProperties {
+    $t: (key: string, ...args: any[]) => string;
+    $d: (key: string, ...args: any[]) => string;
+    $tm: (key: string, ...args: any[]) => string;
+    $rt: (key: string, ...args: any[]) => string;
+  }
+}

package/dist/templates/standalone/tailwind.config.ts

@@ -0,0 +1,7 @@
+import defaultConfig, { content } from "@vc-shell/framework/tailwind.config";
+
+export default {
+  prefix: "tw-",
+  content: [...content, "./src/**/*.{vue,js,ts,jsx,tsx}"],
+  theme: defaultConfig.theme,
+};

package/dist/templates/standalone/tsconfig.json

@@ -0,0 +1,16 @@
+{
+  "extends": "@vc-shell/ts-config/tsconfig.json",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "outDir": "dist",
+    "rootDir": "src",
+    "types": [
+      "vite/client",
+      ]
+  },
+  "include": [
+    "./src/**/*.ts",
+    "./src/**/*.vue",
+    "./src/**/*.json"
+  ]
+}

package/dist/types.d.ts

@@ -0,0 +1,23 @@
+export type ProjectType = "standalone" | "dynamic-module" | "host-app";
+export interface ProjectOptions {
+    projectName: string;
+    packageName: string;
+    projectType: ProjectType;
+    moduleName: string;
+    basePath: string;
+    tenantRoutes: boolean;
+    aiAgent: boolean;
+    dashboard: boolean;
+    mocks: boolean;
+}
+export interface ModuleOptions {
+    moduleName: string;
+    targetDir: string;
+}
+export interface GeneratorContext {
+    targetDir: string;
+    options: ProjectOptions;
+    renderTemplate: (templatePath: string, outputPath: string, data?: Record<string, unknown>) => void;
+    renderDir: (templateDir: string, outputDir: string, data?: Record<string, unknown>) => void;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,WAAW,GAAG,YAAY,GAAG,gBAAgB,GAAG,UAAU,CAAC;AAEvE,MAAM,WAAW,cAAc;IAC7B,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,WAAW,CAAC;IACzB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,YAAY,EAAE,OAAO,CAAC;IACtB,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,OAAO,CAAC;CAChB;AAED,MAAM,WAAW,aAAa;IAC5B,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,gBAAgB;IAC/B,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,cAAc,CAAC;IACxB,cAAc,EAAE,CAAC,YAAY,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAC;IACnG,SAAS,EAAE,CAAC,WAAW,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAC;CAC7F"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@vc-shell/create-vc-app",
   "description": "Application scaffolding",
-  "version": "1.2.4-beta.8",
+  "version": "2.0.0-alpha.0",
   "type": "module",
   "bin": "./dist/index.js",
   "files": [
@@ -13,16 +13,19 @@
     "postbuild": "shx cp -R src/templates dist/"
   },
   "devDependencies": {
+    "@types/ejs": "^3.1.5",
     "@types/prompts": "^2.4.4",
-    "@vc-shell/ts-config": "1.2.4-beta.8",
+    "@vc-shell/ts-config": "2.0.0-alpha.0",
     "copyfiles": "^2.4.1",
     "cross-env": "^7.0.3",
     "shx": "^0.3.4",
     "typescript": "^5.8.3"
   },
   "dependencies": {
-    "chalk": "^2.4.2",
+    "ejs": "^3.1.10",
+    "magicast": "^0.3.5",
     "mri": "^1.2.0",
+    "picocolors": "^1.1.1",
     "prompts": "^2.4.2",
     "tslib": "^2.5.3",
     "vite": "^6.3.3",
@@ -32,5 +35,5 @@
     "access": "public",
     "registry": "https://registry.npmjs.org/"
   },
-  "gitHead": "25aa3246d45b375af4fffcc256a447d05dfda64c"
+  "gitHead": "f028d9e1fe410a18fec4e127a65860cfb2309e36"
 }

package/dist/templates/modules/classic-module/composables/index.ts

@@ -1,2 +0,0 @@
-export { default as use{{ModuleNamePascalCase}}List } from "./use{{ModuleNamePascalCase}}List";
-export { default as use{{ModuleNamePascalCase}}Details } from "./use{{ModuleNamePascalCase}}Details";

package/dist/templates/modules/classic-module/composables/use{{ModuleNamePascalCase}}Details/index.ts

@@ -1,24 +0,0 @@
-import { computed, ref } from "vue";
-import { useAsync, useLoading, useModificationTracker } from "@vc-shell/framework";
-
-export default () => {
-  const item = ref({});
-
-  const { isModified, currentValue, resetModificationState } = useModificationTracker(item);
-
-  // Implement your own load function
-  const { loading: itemLoading, action: getItem } = useAsync<{ id: string }>(async (payload) => {
-    item.value = {};
-
-    resetModificationState();
-  });
-
-  const loading = useLoading(itemLoading);
-
-  return {
-    item: currentValue,
-    loading: computed(() => loading.value),
-    getItem,
-    isModified,
-  };
-};

package/dist/templates/modules/classic-module/composables/use{{ModuleNamePascalCase}}List/index.ts

@@ -1,47 +0,0 @@
-import { computed, ref } from "vue";
-import { useAsync, useLoading } from "@vc-shell/framework";
-
-// Replace with the actual search query interface from the API client
-interface SearchQuery {
-  take?: number;
-  skip?: number;
-  sort?: string;
-  keyword?: string;
-}
-
-export default (options?: { pageSize?: number, sort?: string }) => {
-  const pageSize = options?.pageSize || 20;
-  const searchResult = ref();
-  const searchQuery = ref<SearchQuery>({
-    take: pageSize,
-    skip: 0,
-    sort: options?.sort || "createdDate:DESC",
-  });
-
-  // Implement your own load function
-  const { loading: itemLoading, action: getItems } = useAsync<SearchQuery>(async (payload) => {
-    searchQuery.value = { ...searchQuery.value, ...payload };
-    searchResult.value = {
-      totalCount: 0,
-      items: [],
-    };
-  });
-
-  // Implement your own remove function
-  const { loading: removeLoading, action: removeItems } = useAsync<{ ids: string[] }>(async (payload) => {
-    return;
-  });
-
-  const loading = useLoading(itemLoading, removeLoading);
-
-  return {
-    data: computed(() => searchResult.value?.items),
-    loading: computed(() => loading.value),
-    totalCount: computed(() => searchResult.value?.totalCount || 0),
-    pages: computed(() => Math.ceil((searchResult.value?.totalCount || 1) / pageSize)),
-    currentPage: computed(() => Math.ceil((searchQuery.value?.skip || 0) / Math.max(1, pageSize) + 1)),
-    getItems,
-    removeItems,
-    searchQuery,
-  };
-};

package/dist/templates/modules/classic-module/locales/en.json

@@ -1,37 +0,0 @@
-{
-  "{{ModuleNameUppercaseSnakeCase}}": {
-    "MENU": {
-      "TITLE": "{{ModuleNameSentenceCase}}"
-    },
-    "PAGES": {
-      "LIST": {
-        "TITLE": "{{ModuleNameSentenceCase}} list",
-        "TOOLBAR": {
-          "REFRESH": "Refresh",
-          "ADD": "Add"
-        },
-        "SEARCH": {
-          "PLACEHOLDER": "Search keywords"
-        },
-        "TABLE": {
-          "TOTALS": "Count:",
-          "HEADER": {}
-        },
-        "EMPTY": {
-          "NO_ITEMS": "No items found",
-          "ADD": "Add items"
-        },
-        "NOT_FOUND": {
-          "EMPTY": "No items found",
-          "RESET": "Reset"
-        }
-      },
-      "DETAILS": {
-        "TITLE": "{{ModuleNameSentenceCase}} details"
-      },
-      "ALERTS": {
-        "CLOSE_CONFIRMATION": "You have unsaved changes. Close anyway?"
-      }
-    }
-  }
-}

package/dist/templates/modules/classic-module/pages/details.vue

@@ -1,87 +0,0 @@
-<template>
-  <VcBlade
-    :loading="loading"
-    :title="title"
-    :expanded="expanded"
-    :closable="closable"
-    width="70%"
-    :toolbar-items="bladeToolbar"
-    @close="$emit('close:blade')"
-    @expand="$emit('expand:blade')"
-    @collapse="$emit('collapse:blade')"
-  >
-    <VcContainer class="tw-p-2">
-      <VcForm>
-        <!-- You can add form fields here -->
-      </VcForm>
-    </VcContainer>
-  </VcBlade>
-</template>
-
-<script lang="ts" setup>
-import { IBladeToolbar, IParentCallArgs, useBladeNavigation, usePopup, useBeforeUnload } from "@vc-shell/framework";
-import { use{{ModuleNamePascalCase}}Details } from "./../composables";
-import { computed, onMounted, ref } from "vue";
-import { useI18n } from "vue-i18n";
-import { useForm } from "vee-validate";
-
-export interface Props {
-  expanded?: boolean;
-  closable?: boolean;
-  param?: string;
-}
-
-export interface Emits {
-  (event: "parent:call", args: IParentCallArgs): void;
-  (event: "collapse:blade"): void;
-  (event: "expand:blade"): void;
-  (event: "close:blade"): void;
-}
-
-defineOptions({
-  url: "/{{ModuleName}}-details",
-  name: "{{ModuleNamePascalCase}}Details",
-});
-
-const props = withDefaults(defineProps<Props>(), {
-  expanded: true,
-  closable: true,
-  param: undefined,
-});
-
-defineEmits<Emits>();
-
-const { loading, getItem, isModified } = use{{ModuleNamePascalCase}}Details();
-const { onBeforeClose } = useBladeNavigation();
-const { showConfirmation } = usePopup();
-const { t } = useI18n({ useScope: "global" });
-
-const { meta } = useForm({
-  validateOnMount: false,
-});
-
-const isDisabled = computed(() => {
-  return !meta.value.dirty || !meta.value.valid;
-});
-
-const bladeToolbar = ref<IBladeToolbar[]>([]);
-const title = computed(() => t("{{ModuleNameUppercaseSnakeCase}}.PAGES.DETAILS.TITLE"));
-
-onMounted(async () => {
-  if (props.param) {
-    await getItem({ id: props.param });
-  }
-});
-
-onBeforeClose(async () => {
-  if (!isDisabled.value && isModified.value) {
-    return await showConfirmation(t("SAMPLE_APP.PAGES.ALERTS.CLOSE_CONFIRMATION"));
-  }
-});
-
-useBeforeUnload(computed(() => !isDisabled.value && isModified.value));
-
-defineExpose({
-  title,
-});
-</script>