refactor: split utils package & split hyperscript- & vue-components

Author: tada5hi

examples/utils/package.json

@@ -23,6 +23,7 @@
     },
     "homepage": "https://github.com/Tada5hi/vue-layout#readme",
     "dependencies": {
+        "@vue-layout/core": "^0.0.0",
         "@vue-layout/utils": "^2.0.0-alpha.11",
         "@vuelidate/core": "^2.0.0-alpha.44",
         "@vuelidate/validators": "^2.0.0-alpha.31",

examples/utils/src/main.ts

@@ -1,27 +1,25 @@
+/*
+ * Copyright (c) 2022.
+ * Author Peter Placzek (tada5hi)
+ * For the full copyright and license information,
+ * view the LICENSE file that was distributed with this source code.
+ */
+
+import { Preset } from '@vue-layout/core';
+import { setConfig } from '@vue-layout/utils';
 import { createApp } from 'vue';
-import Utils, { Config, Preset } from '@vue-layout/utils';
 
 import App from './App.vue';
 
 import 'bootstrap/dist/css/bootstrap.min.css';
 import 'font-awesome/css/font-awesome.min.css';
 
-const config : Partial<Config> = {
+setConfig({
     preset: {
         [Preset.BOOTSTRAP]: true,
         [Preset.FONT_AWESOME]: true,
     },
-    component: {
-        formInput: {
-            label: {
-                preset: {
-                    [Preset.BOOTSTRAP_V5]: false,
-                },
-            },
-        },
-    },
-};
+});
 
 createApp(App)
-    .use(Utils, config)
     .mount('#app');

examples/utils/tsconfig.json

@@ -5,6 +5,7 @@
         "module": "ESNext",
         "paths": {
             "@/*": ["./examples/utils/src/*"],
+            "@vue-layout/core": ["./packages/core/src"],
             "@vue-layout/utils": ["./packages/utils/src"]
         }
     },

package-lock.json

@@ -54,7 +54,7 @@
     },
     "scripts": {
         "bootstrap": "lerna bootstrap",
-        "clean": "lerna run clean",
+        "commit": "npx git-cz",
         "build": "lerna run build",
         "test": "lerna run test",
         "pub": "npm run build && lerna publish",

package.json

@@ -0,0 +1,8 @@
+const devPresets = ['@vue/babel-preset-app'];
+const buildPresets = [
+    '@babel/preset-env',
+    '@babel/preset-typescript',
+];
+module.exports = {
+    presets: (process.env.NODE_ENV === 'development' ? devPresets : buildPresets),
+};

packages/core/babel.config.js

@@ -0,0 +1,55 @@
+{
+    "name": "@vue-layout/core",
+    "version": "0.0.0",
+    "description": "",
+    "main": "dist/index.cjs.js",
+    "browser": "dist/index.browser.js",
+    "module": "dist/index.esm.js",
+    "unpkg": "dist/index.iife.js",
+    "types": "dist/types/index.d.ts",
+    "files": [
+        "dist/*"
+    ],
+    "keywords": [],
+    "author": {
+        "name": "Peter Placzek",
+        "email": "contact@tada5hi.net",
+        "url": "https://tada5hi.net"
+    },
+    "repository": {
+        "type": "git",
+        "url": "https://github.com/tada5hi/vue-layout.git",
+        "directory": "packages/core"
+    },
+    "sideEffects": false,
+    "scripts": {
+        "prebuild": "rimraf ./dist",
+        "build:types": "tsc --emitDeclarationOnly -p tsconfig.build.json",
+        "build:js": "rollup -c",
+        "build": "cross-env NODE_ENV=production npm run build:js && npm run build:types",
+        "lint": "eslint --ext .ts ./src/",
+        "lint:fix": "npm run lint -- --fix"
+    },
+    "devDependencies": {
+        "@babel/core": "^7.19.1",
+        "@babel/preset-env": "^7.19.1",
+        "@babel/preset-typescript": "^7.18.6",
+        "@rollup/plugin-alias": "^3.1.9",
+        "@rollup/plugin-babel": "^5.3.1",
+        "@rollup/plugin-commonjs": "^22.0.2",
+        "@rollup/plugin-node-resolve": "^14.1.0",
+        "@rollup/plugin-replace": "^4.0.0",
+        "rollup": "^2.79.1",
+        "rollup-plugin-terser": "^7.0.2",
+        "vue": "^3.2.39"
+    },
+    "peerDependencies": {
+        "vue": "^3.x"
+    },
+    "engines": {
+        "node": ">=16"
+    },
+    "publishConfig": {
+        "access": "public"
+    }
+}

packages/core/package.json

@@ -0,0 +1,104 @@
+/*
+ * Copyright (c) 2022-2022.
+ * Author Peter Placzek (tada5hi)
+ * For the full copyright and license information,
+ * view the LICENSE file that was distributed with this source code.
+ */
+
+import commonjs from '@rollup/plugin-commonjs';
+import resolve from '@rollup/plugin-node-resolve';
+import babel from '@rollup/plugin-babel';
+import { terser } from 'rollup-plugin-terser';
+import pkg from './package.json';
+
+const extensions = [
+    '.js', '.jsx', '.ts', '.tsx',
+];
+
+const name = 'Smob';
+
+export default [
+    {
+        input: './src/index.ts',
+
+        // Specify here external modules which you don't want to include in your bundle (for instance: 'lodash', 'moment' etc.)
+        // https://rollupjs.org/guide/en/#external
+        external: [],
+
+        plugins: [
+            // Allows node_modules resolution
+            resolve({ extensions }),
+
+            // Allow bundling cjs modules. Rollup doesn't understand cjs
+            commonjs(),
+
+            // Compile TypeScript/JavaScript files
+            babel({
+                extensions,
+                babelHelpers: 'bundled',
+                include: [
+                    'src/**/*',
+                ],
+            }),
+            terser({
+                output: {
+                    ecma: 5,
+                },
+            }),
+        ],
+        output: [
+            {
+                file: pkg.main,
+                format: 'cjs',
+            }, {
+                file: pkg.module,
+                format: 'esm',
+            },
+        ],
+    },
+    {
+        input: './src/index.ts',
+
+        // Specify here external modules which you don't want to include in your bundle (for instance: 'lodash', 'moment' etc.)
+        // https://rollupjs.org/guide/en/#external
+        external: [],
+
+        plugins: [
+            // Allows node_modules resolution
+            resolve({ extensions }),
+
+            // Allow bundling cjs modules. Rollup doesn't understand cjs
+            commonjs(),
+
+            // Compile TypeScript/JavaScript files
+            babel({
+                extensions,
+                babelHelpers: 'bundled',
+                include: [
+                    'src/**/*',
+                ],
+            }),
+            terser({
+                output: {
+                    ecma: 5,
+                },
+            }),
+        ],
+        output: [
+            {
+                file: pkg.browser,
+                format: 'esm',
+            },
+            {
+                file: pkg.unpkg,
+                format: 'iife',
+                name,
+
+                // https://rollupjs.org/guide/en/#outputglobals
+                globals: {
+
+                },
+            },
+        ],
+    },
+];

packages/core/rollup.config.js

@@ -0,0 +1,12 @@
+/*
+ * Copyright (c) 2022.
+ * Author Peter Placzek (tada5hi)
+ * For the full copyright and license information,
+ * view the LICENSE file that was distributed with this source code.
+ */
+
+export * from './constants';
+export * from './di';
+export * from './options';
+export * from './utils';
+export * from './type';

packages/utils/src/constants.ts packages/core/src/constants.ts

@@ -7,7 +7,11 @@
 
 import { VNodeProps, mergeProps } from 'vue';
 import {
-    isVNodeClassOption, isVNodeListenerOption, isVNodeOption, isVNodePropsOption, isVNodeStyleOption,
+    isVNodeClassOption,
+    isVNodeListenerOption,
+    isVNodeOption,
+    isVNodePropsOption,
+    isVNodeStyleOption,
 } from './utils';
 
 function isObject(item: any): item is Record<string, any> {

packages/utils/src/di.ts packages/core/src/di.ts

@@ -5,7 +5,16 @@
  * view the LICENSE file that was distributed with this source code.
  */
 
-import { MakeOptional } from '../type';
+import { MakeOptional, ToMaybeRef } from '../type';
+
+export type OptionsInput<T,
+    R extends keyof T = never,
+    P extends keyof T = never,
+    MR extends keyof T = never,
+    > = Pick<T, R> &
+    Partial<Pick<T, P>> &
+    ToMaybeRef<Pick<T, MR>> &
+    Partial<ToMaybeRef<Pick<T, Exclude<keyof T, R | P | MR>>>>;
 
 export type PresetOption<V> = {
     value: V,

packages/core/src/index.ts

@@ -0,0 +1,22 @@
+{
+    "extends": "../../tsconfig.build.json",
+
+    "compilerOptions": {
+        "outDir": "./dist",
+        "importHelpers": true,
+        "allowSyntheticDefaultImports": true,
+        "sourceMap": false,
+        "jsx": "preserve",
+
+        "declaration": true,
+        "declarationDir": "dist/types",
+        "skipLibCheck": true
+    },
+    "exclude": [
+        "node_modules",
+        "dist"
+    ],
+    "include": [
+        "src/**/*.ts"
+    ]
+}

packages/utils/src/options/check.ts packages/core/src/options/check.ts

@@ -0,0 +1,17 @@
+{
+    "extends": "../../tsconfig.json",
+    "compilerOptions": {
+        "lib": [
+            "ESNext"
+        ],
+        "strict": true,
+
+        "importHelpers": true,
+        "allowSyntheticDefaultImports": true,
+        "sourceMap": false,
+        "module": "ESNext",
+        "jsx": "preserve",
+
+        "skipLibCheck": true
+    }
+}