## PR description This PR: - Creates a TypeScript-based extractor that discovers all exported twenty-ui components by scanning barrel files, extracting props/slots/events via ts-morph type analysis, and generating the remote DOM bindings automatically. - Adds a new ESLint rule which enforces all *Props types in twenty-ui components to be exported, which is required for the extractor to discover component prop types. Existing twenty-ui components are updated to comply with this rule. - Extends the remote DOM generation to support slots, per-component events, forwardRef wrappers, and richer property types (array, object, function) ## Edge cases to fix in another PR - Icons cannot be rendered inside buttons - IconButtons throw an error when mounted - MenuItems are not displayed correctly - MenuItemNavigate throws on click ## Video Demo https://github.com/user-attachments/assets/c2ed67cf-6a15-4896-9fec-e83fac0e862b
164 lines
4.7 KiB
JSON
164 lines
4.7 KiB
JSON
{
|
|
"name": "twenty-sdk",
|
|
"$schema": "../../node_modules/nx/schemas/project-schema.json",
|
|
"sourceRoot": "packages/twenty-sdk/src",
|
|
"projectType": "library",
|
|
"tags": ["scope:sdk", "scope:shared"],
|
|
"targets": {
|
|
"build": {
|
|
"dependsOn": ["^build", "generate-remote-dom-elements"],
|
|
"outputs": ["{projectRoot}/dist"]
|
|
},
|
|
"dev": {
|
|
"executor": "nx:run-commands",
|
|
"dependsOn": ["^build"],
|
|
"options": {
|
|
"cwd": "packages/twenty-sdk",
|
|
"command": "npx rimraf dist && npx vite build --watch"
|
|
}
|
|
},
|
|
"start": {
|
|
"executor": "nx:run-commands",
|
|
"dependsOn": ["build"],
|
|
"options": {
|
|
"cwd": "packages/twenty-sdk",
|
|
"command": "node dist/cli.cjs"
|
|
}
|
|
},
|
|
"typecheck": {},
|
|
"lint": {
|
|
"options": {
|
|
"lintFilePatterns": ["{projectRoot}/src/**/*.{ts,json}"],
|
|
"maxWarnings": 0
|
|
},
|
|
"configurations": {
|
|
"ci": {
|
|
"lintFilePatterns": ["{projectRoot}/src/**/*.{ts,json}"],
|
|
"maxWarnings": 0
|
|
},
|
|
"fix": {}
|
|
}
|
|
},
|
|
"test": {
|
|
"executor": "@nx/vitest:test",
|
|
"outputs": ["{workspaceRoot}/coverage/{projectRoot}"],
|
|
"options": {
|
|
"config": "{projectRoot}/vitest.config.ts"
|
|
},
|
|
"configurations": {
|
|
"ci": {
|
|
"coverage": true,
|
|
"watch": false
|
|
}
|
|
}
|
|
},
|
|
"test:unit": {
|
|
"executor": "nx:run-commands",
|
|
"options": {
|
|
"cwd": "packages/twenty-sdk",
|
|
"command": "npx vitest run --config vitest.unit.config.ts"
|
|
}
|
|
},
|
|
"test:integration": {
|
|
"executor": "nx:run-commands",
|
|
"options": {
|
|
"cwd": "packages/twenty-sdk",
|
|
"command": "npx vitest run --config vitest.integration.config.ts"
|
|
}
|
|
},
|
|
"test:e2e": {
|
|
"executor": "nx:run-commands",
|
|
"options": {
|
|
"cwd": "packages/twenty-sdk",
|
|
"command": "npx wait-on http://localhost:3000/healthz --timeout 600000 --interval 1000 --log && NODE_ENV=test npx vitest run --config ./vitest.e2e.config.ts"
|
|
},
|
|
"parallel": false,
|
|
"dependsOn": [
|
|
"build",
|
|
{
|
|
"target": "database:reset",
|
|
"projects": "twenty-server"
|
|
},
|
|
{
|
|
"target": "start:ci-if-needed",
|
|
"projects": "twenty-server"
|
|
}
|
|
]
|
|
},
|
|
"generate-remote-dom-elements": {
|
|
"executor": "nx:run-commands",
|
|
"cache": true,
|
|
"dependsOn": ["^build"],
|
|
"inputs": [
|
|
"{projectRoot}/scripts/remote-dom/**/*",
|
|
"{projectRoot}/src/sdk/front-component-common/**/*",
|
|
"{workspaceRoot}/packages/twenty-ui/src/**/index.ts",
|
|
"{workspaceRoot}/packages/twenty-ui/src/**/*.tsx"
|
|
],
|
|
"outputs": [
|
|
"{projectRoot}/src/front-component/host/generated/*",
|
|
"{projectRoot}/src/front-component/remote/generated/*"
|
|
],
|
|
"options": {
|
|
"cwd": "packages/twenty-sdk",
|
|
"command": "tsx -r tsconfig-paths/register scripts/remote-dom/generate-remote-dom-elements.ts"
|
|
},
|
|
"configurations": {
|
|
"verbose": {
|
|
"command": "tsx -r tsconfig-paths/register scripts/remote-dom/generate-remote-dom-elements.ts --verbose"
|
|
}
|
|
}
|
|
},
|
|
"storybook:prebuild": {
|
|
"executor": "nx:run-commands",
|
|
"cache": true,
|
|
"dependsOn": ["generate-remote-dom-elements"],
|
|
"inputs": [
|
|
"{projectRoot}/src/front-component/__stories__/mocks/**/*",
|
|
"{projectRoot}/src/front-component/__stories__/utils/**/*",
|
|
"{projectRoot}/src/cli/utilities/build/common/front-component-build/**/*",
|
|
"{projectRoot}/src/front-component-constants/**/*",
|
|
"{projectRoot}/src/sdk/**/*"
|
|
],
|
|
"outputs": ["{projectRoot}/src/front-component/__stories__/built/*"],
|
|
"options": {
|
|
"command": "tsx {projectRoot}/src/front-component/__stories__/utils/buildMockComponents.ts"
|
|
}
|
|
},
|
|
"storybook:build": {
|
|
"dependsOn": ["storybook:prebuild"],
|
|
"configurations": {
|
|
"test": {}
|
|
}
|
|
},
|
|
"storybook:serve:dev": {
|
|
"dependsOn": ["storybook:prebuild"],
|
|
"options": {
|
|
"port": 6008
|
|
}
|
|
},
|
|
"storybook:serve:static": {
|
|
"options": {
|
|
"buildTarget": "twenty-sdk:storybook:build",
|
|
"port": 6008
|
|
},
|
|
"configurations": {
|
|
"test": {}
|
|
}
|
|
},
|
|
"storybook:test": {
|
|
"dependsOn": ["storybook:prebuild"],
|
|
"options": {
|
|
"command": "vitest run --coverage --config vitest.storybook.config.ts --shard={args.shard}"
|
|
}
|
|
},
|
|
"storybook:test:no-coverage": {
|
|
"dependsOn": ["storybook:prebuild"],
|
|
"options": {
|
|
"command": "vitest run --config vitest.storybook.config.ts --shard={args.shard}"
|
|
}
|
|
},
|
|
"storybook:coverage": {}
|
|
}
|
|
}
|