feat(generator): handle all function for generate form and grid

packages/core/src/index.ts

@@ -1,2 +1,2 @@
 export * from './components/builder/builder';
-export * from './components/builder/builder.types';
+export type * from './components/builder/builder.types';

packages/generator/.babelrc

@@ -0,0 +1,12 @@
+{
+  "presets": [
+    [
+      "@nx/react/babel",
+      {
+        "runtime": "automatic",
+        "useBuiltIns": "usage"
+      }
+    ]
+  ],
+  "plugins": []
+}

packages/generator/.eslintrc.json

@@ -0,0 +1,18 @@
+{
+  "extends": ["plugin:@nx/react", "../../.eslintrc.json"],
+  "ignorePatterns": ["!**/*"],
+  "overrides": [
+    {
+      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
+      "rules": {}
+    },
+    {
+      "files": ["*.ts", "*.tsx"],
+      "rules": {}
+    },
+    {
+      "files": ["*.js", "*.jsx"],
+      "rules": {}
+    }
+  ]
+}

packages/generator/README.md

@@ -0,0 +1,7 @@
+# generator
+
+This library was generated with [Nx](https://nx.dev).
+
+## Running unit tests
+
+Run `nx test generator` to execute the unit tests via [Jest](https://jestjs.io).

packages/generator/package.json

@@ -0,0 +1,4 @@
+{
+  "name": "@mui-builder/generator",
+  "version": "0.0.1"
+}

packages/generator/project.json

@@ -0,0 +1,29 @@
+{
+  "name": "generator",
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "sourceRoot": "packages/generator/src",
+  "projectType": "library",
+  "tags": [],
+  "targets": {
+    "build": {
+      "executor": "@nx/rollup:rollup",
+      "outputs": ["{options.outputPath}"],
+      "options": {
+        "outputPath": "dist/packages/generator",
+        "tsConfig": "packages/generator/tsconfig.lib.json",
+        "project": "packages/generator/package.json",
+        "entryFile": "packages/generator/src/index.ts",
+        "external": ["react", "react-dom", "react/jsx-runtime"],
+        "rollupConfig": "@nx/react/plugins/bundle-rollup",
+        "compiler": "babel",
+        "assets": [
+          {
+            "glob": "packages/generator/README.md",
+            "input": ".",
+            "output": "."
+          }
+        ]
+      }
+    }
+  }
+}

packages/generator/src/index.ts

@@ -0,0 +1,11 @@
+import generateActionSubmit from './utils/actionSubmit/actionSubmit';
+import generateFieldText from './utils/fieldText/fieldText';
+import generateGridContainer from './utils/gridContainer/gridContainer';
+import generateGridItem from './utils/gridItem/gridItem';
+
+export {
+  generateGridContainer,
+  generateActionSubmit,
+  generateGridItem,
+  generateFieldText,
+};

packages/generator/src/types/public.types.ts

@@ -0,0 +1,11 @@
+import { FormBuilderProps } from '@mui-builder/core';
+import { Configs } from '@mui-builder/form';
+
+export type GeneratorProps<T, C = FormBuilderProps | FormBuilderProps[]> = {
+  children?: C;
+  props?: T;
+  configs?: Configs;
+};
+export type Generator<T, C = FormBuilderProps | FormBuilderProps[]> = (
+  props: GeneratorProps<T, C>
+) => FormBuilderProps;

packages/generator/src/utils/actionSubmit/actionSubmit.ts

@@ -0,0 +1,22 @@
+import { SubmitFieldProps } from 'packages/components/form/src/components/actions/submit/submit.types';
+
+import { Generator } from '../../types/public.types';
+
+import generateID from '../id/id';
+
+const generateActionSubmit: Generator<SubmitFieldProps, string> = ({
+  props,
+  configs,
+}) => {
+  return {
+    id: generateID(),
+    groupType: 'form',
+    type: 'action-submit',
+    props: {
+      ...(props as SubmitFieldProps),
+    },
+    configs,
+  };
+};
+
+export default generateActionSubmit;

packages/generator/src/utils/fieldText/fieldText.ts

@@ -0,0 +1,18 @@
+import { TextProps } from 'packages/components/form/src/components/fields/text/text.types';
+
+import { Generator } from '../../types/public.types';
+
+import generateID from '../id/id';
+
+const generateFieldText: Generator<TextProps> = ({ props }) => {
+  return {
+    id: generateID(),
+    groupType: 'form',
+    type: 'field-text',
+    props: {
+      ...props,
+    },
+  };
+};
+
+export default generateFieldText;

packages/generator/src/utils/gridContainer/gridContainer.ts

@@ -0,0 +1,21 @@
+import { GridProps } from '@mui-builder/grid';
+
+import { Generator } from '../../types/public.types';
+
+import generateID from '../id/id';
+
+const generateGridContainer: Generator<GridProps> = ({ children, props }) => {
+  return {
+    id: generateID(),
+    groupType: 'grid',
+    type: 'container',
+    props: {
+      rowSpacing: 20,
+      columnSpacing: 20,
+      children,
+      ...props,
+    },
+  };
+};
+
+export default generateGridContainer;

packages/generator/src/utils/gridItem/gridItem.ts

@@ -0,0 +1,21 @@
+import { GridProps } from '@mui-builder/grid';
+
+import { Generator } from '../../types/public.types';
+
+import generateID from '../id/id';
+
+const generateGridItem: Generator<GridProps> = ({ children, props }) => {
+  return {
+    id: generateID(),
+    groupType: 'grid',
+    type: 'container',
+    props: {
+      rowSpacing: 2,
+      columnSpacing: 2,
+      children,
+      ...props,
+    },
+  };
+};
+
+export default generateGridItem;

packages/generator/src/utils/id/id.ts

@@ -0,0 +1,12 @@
+function generateID(): string {
+  // Create a timestamp in milliseconds
+  const timestamp = new Date().getTime();
+
+  // Generate a random number based on the timestamp
+  const randomPart = Math.floor((Math.random() + 1) * timestamp);
+
+  // Convert to base-36 (numbers + letters), and get the substring to ensure a fixed length
+  return `${timestamp.toString(36)}-${randomPart.toString(36)}`;
+}
+
+export default generateID;

packages/generator/tsconfig.json

@@ -0,0 +1,17 @@
+{
+  "compilerOptions": {
+    "jsx": "react-jsx",
+    "allowJs": false,
+    "esModuleInterop": false,
+    "allowSyntheticDefaultImports": true,
+    "strict": true
+  },
+  "files": [],
+  "include": [],
+  "references": [
+    {
+      "path": "./tsconfig.lib.json"
+    }
+  ],
+  "extends": "../../tsconfig.base.json"
+}

packages/generator/tsconfig.lib.json

@@ -0,0 +1,24 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../dist/out-tsc",
+    "types": [
+      "node",
+
+      "@nx/react/typings/cssmodule.d.ts",
+      "@nx/react/typings/image.d.ts"
+    ]
+  },
+  "exclude": [
+    "jest.config.ts",
+    "src/**/*.spec.ts",
+    "src/**/*.test.ts",
+    "src/**/*.spec.tsx",
+    "src/**/*.test.tsx",
+    "src/**/*.spec.js",
+    "src/**/*.test.js",
+    "src/**/*.spec.jsx",
+    "src/**/*.test.jsx"
+  ],
+  "include": ["src/**/*.js", "src/**/*.jsx", "src/**/*.ts", "src/**/*.tsx"]
+}

tsconfig.base.json

@@ -17,6 +17,7 @@
     "paths": {
       "@mui-builder/core": ["packages/core/src/index.ts"],
       "@mui-builder/form": ["packages/components/form/src/index.ts"],
+      "@mui-builder/generator": ["packages/generator/src/index.ts"],
       "@mui-builder/grid": ["packages/components/grid/src/index.ts"],
       "@mui-builder/utils": ["packages/utils/src/index.ts"]
     }