From 011f073efe3c88a78f4b388d2d3927ed0b40f1ff Mon Sep 17 00:00:00 2001 From: Gao Sun Date: Fri, 18 Feb 2022 07:25:54 +0800 Subject: [PATCH] feat(ui): init `ui-new` package (#245) --- packages/console/src/index.html | 1 + packages/ui-new/README.md | 3 + packages/ui-new/package.json | 43 +++++++++++++ packages/ui-new/src/App.module.scss | 3 + packages/ui-new/src/App.tsx | 7 +++ packages/ui-new/src/include.d/react-app.d.ts | 65 ++++++++++++++++++++ packages/ui-new/src/index.html | 15 +++++ packages/ui-new/src/index.tsx | 7 +++ packages/ui-new/tsconfig.json | 6 ++ pnpm-lock.yaml | 39 ++++++++++++ 10 files changed, 189 insertions(+) create mode 100644 packages/ui-new/README.md create mode 100644 packages/ui-new/package.json create mode 100644 packages/ui-new/src/App.module.scss create mode 100644 packages/ui-new/src/App.tsx create mode 100644 packages/ui-new/src/include.d/react-app.d.ts create mode 100644 packages/ui-new/src/index.html create mode 100644 packages/ui-new/src/index.tsx create mode 100644 packages/ui-new/tsconfig.json diff --git a/packages/console/src/index.html b/packages/console/src/index.html index a68b24306..8b26f078a 100644 --- a/packages/console/src/index.html +++ b/packages/console/src/index.html @@ -7,6 +7,7 @@ +
diff --git a/packages/ui-new/README.md b/packages/ui-new/README.md new file mode 100644 index 000000000..6e3cbb442 --- /dev/null +++ b/packages/ui-new/README.md @@ -0,0 +1,3 @@ +# @logto/ui + +The register / sign-in experience for end-users. diff --git a/packages/ui-new/package.json b/packages/ui-new/package.json new file mode 100644 index 000000000..db993c54c --- /dev/null +++ b/packages/ui-new/package.json @@ -0,0 +1,43 @@ +{ + "name": "@logto/ui-new", + "version": "0.1.0", + "license": "MPL-2.0", + "private": true, + "scripts": { + "preinstall": "npx only-allow pnpm", + "precommit": "lint-staged", + "start": "parcel src/index.html", + "check": "tsc --noEmit", + "build": "pnpm check && rm -rf dist && parcel build src/index.html --no-autoinstall", + "lint": "eslint --ext .ts --ext .tsx src", + "stylelint": "stylelint \"src/**/*.scss\"" + }, + "dependencies": { + "react": "^17.0.2", + "react-dom": "^17.0.2" + }, + "devDependencies": { + "@parcel/core": "^2.3.1", + "@parcel/transformer-sass": "^2.3.1", + "@silverhand/eslint-config": "^0.8.1", + "@silverhand/eslint-config-react": "^0.8.1", + "@silverhand/ts-config": "^0.8.1", + "@silverhand/ts-config-react": "^0.8.1", + "@types/react": "^17.0.14", + "@types/react-dom": "^17.0.9", + "eslint": "^8.1.0", + "lint-staged": "^11.1.1", + "parcel": "^2.3.1", + "postcss": "^8.4.6", + "postcss-modules": "^4.3.0", + "prettier": "^2.3.2", + "stylelint": "^13.13.1" + }, + "eslintConfig": { + "extends": "@silverhand/react" + }, + "stylelint": { + "extends": "@silverhand/eslint-config-react/.stylelintrc" + }, + "prettier": "@silverhand/eslint-config/.prettierrc" +} diff --git a/packages/ui-new/src/App.module.scss b/packages/ui-new/src/App.module.scss new file mode 100644 index 000000000..79f828507 --- /dev/null +++ b/packages/ui-new/src/App.module.scss @@ -0,0 +1,3 @@ +.app { + color: #aaa; +} diff --git a/packages/ui-new/src/App.tsx b/packages/ui-new/src/App.tsx new file mode 100644 index 000000000..e60dbd8bd --- /dev/null +++ b/packages/ui-new/src/App.tsx @@ -0,0 +1,7 @@ +import React from 'react'; + +import * as styles from './App.module.scss'; + +export const App = () => { + return

Hello world!

; +}; diff --git a/packages/ui-new/src/include.d/react-app.d.ts b/packages/ui-new/src/include.d/react-app.d.ts new file mode 100644 index 000000000..777943041 --- /dev/null +++ b/packages/ui-new/src/include.d/react-app.d.ts @@ -0,0 +1,65 @@ +// Copied from react-scripts/lib/react-app.d.ts + +declare module '*.avif' { + const src: string; + export default src; +} + +declare module '*.bmp' { + const src: string; + export default src; +} + +declare module '*.gif' { + const src: string; + export default src; +} + +declare module '*.jpg' { + const src: string; + export default src; +} + +declare module '*.jpeg' { + const src: string; + export default src; +} + +declare module '*.png' { + const src: string; + export default src; +} + +declare module '*.webp' { + const src: string; + export default src; +} + +declare module '*.svg' { + import * as React from 'react'; + + export const ReactComponent: React.FunctionComponent< + React.SVGProps & { title?: string } + >; + + const src: string; + export default src; +} + +declare module '*.module.css' { + const classes: Readonly>; + export default classes; + export = classes; +} + +declare module '*.module.scss' { + const classes: Readonly>; + export default classes; + export = classes; +} + +declare module '*.module.sass' { + const classes: Readonly>; + export default classes; + export = classes; +} diff --git a/packages/ui-new/src/index.html b/packages/ui-new/src/index.html new file mode 100644 index 000000000..67f86e2d9 --- /dev/null +++ b/packages/ui-new/src/index.html @@ -0,0 +1,15 @@ + + + + + + Logto + + + + +
+ + + + diff --git a/packages/ui-new/src/index.tsx b/packages/ui-new/src/index.tsx new file mode 100644 index 000000000..c4b18d95f --- /dev/null +++ b/packages/ui-new/src/index.tsx @@ -0,0 +1,7 @@ +import React from 'react'; +import ReactDOM from 'react-dom'; + +import { App } from './App'; + +const app = document.querySelector('#app'); +ReactDOM.render(, app); diff --git a/packages/ui-new/tsconfig.json b/packages/ui-new/tsconfig.json new file mode 100644 index 000000000..f2cc02dc3 --- /dev/null +++ b/packages/ui-new/tsconfig.json @@ -0,0 +1,6 @@ +{ + "extends": "@silverhand/ts-config-react/tsconfig.base", + "include": [ + "src" + ] +} diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 2ee207a99..b752b4447 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -307,6 +307,45 @@ importers: webpack: 5.65.0 webpack-dev-server: 3.11.3_webpack@5.65.0 + packages/ui-new: + specifiers: + '@parcel/core': ^2.3.1 + '@parcel/transformer-sass': ^2.3.1 + '@silverhand/eslint-config': ^0.8.1 + '@silverhand/eslint-config-react': ^0.8.1 + '@silverhand/ts-config': ^0.8.1 + '@silverhand/ts-config-react': ^0.8.1 + '@types/react': ^17.0.14 + '@types/react-dom': ^17.0.9 + eslint: ^8.1.0 + lint-staged: ^11.1.1 + parcel: ^2.3.1 + postcss: ^8.4.6 + postcss-modules: ^4.3.0 + prettier: ^2.3.2 + react: ^17.0.2 + react-dom: ^17.0.2 + stylelint: ^13.13.1 + dependencies: + react: 17.0.2 + react-dom: 17.0.2_react@17.0.2 + devDependencies: + '@parcel/core': 2.3.1 + '@parcel/transformer-sass': 2.3.1_@parcel+core@2.3.1 + '@silverhand/eslint-config': 0.8.1_b07be603d0ceb19daeedad1772e0f2c4 + '@silverhand/eslint-config-react': 0.8.1_bde439a4d13c321a6cb4f974de44a545 + '@silverhand/ts-config': 0.8.1_typescript@4.5.5 + '@silverhand/ts-config-react': 0.8.1_typescript@4.5.5 + '@types/react': 17.0.37 + '@types/react-dom': 17.0.11 + eslint: 8.4.1 + lint-staged: 11.2.6 + parcel: 2.3.1_postcss@8.4.6 + postcss: 8.4.6 + postcss-modules: 4.3.0_postcss@8.4.6 + prettier: 2.5.1 + stylelint: 13.13.1 + packages: /@babel/code-frame/7.10.4: