diff --git a/package-lock.json b/package-lock.json index cfcc2abc..314c41e6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,20 +1,21 @@ { - "name": "design-system", + "name": "cbp-design-system", "version": "1.0.0", "lockfileVersion": 3, "requires": true, "packages": { "": { - "name": "design-system", + "name": "cbp-design-system", "version": "1.0.0", "license": "CC0-1.0", "workspaces": [ "packages/vanilla", "packages/ux-guidelines", - "packages/react-components", - "packages/web-components" + "packages/web-components", + "packages/react-components" ], "devDependencies": { + "@types/node": "^20.9.0", "eslint": "^8.33.0", "eslint-config-prettier": "^8.6.0", "eslint-plugin-react": "^7.33.2", @@ -25,7 +26,8 @@ "stylelint": "^14.16.1", "stylelint-config-prettier": "^9.0.4", "stylelint-config-recommended": "^9.0.0", - "stylelint-scss": "^4.3.0" + "stylelint-scss": "^4.3.0", + "typescript": "^5.2.2" }, "engines": { "node": ">=18.0.0", @@ -1802,36 +1804,6 @@ "@babel/core": "^7.0.0-0" } }, - "node_modules/@babel/plugin-transform-react-jsx-self": { - "version": "7.22.5", - "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-self/-/plugin-transform-react-jsx-self-7.22.5.tgz", - "integrity": "sha512-nTh2ogNUtxbiSbxaT4Ds6aXnXEipHweN9YRgOX/oNXdf0cCrGn/+2LozFa3lnPV5D90MkjhgckCPBrsoSc1a7g==", - "dev": true, - "dependencies": { - "@babel/helper-plugin-utils": "^7.22.5" - }, - "engines": { - "node": ">=6.9.0" - }, - "peerDependencies": { - "@babel/core": "^7.0.0-0" - } - }, - "node_modules/@babel/plugin-transform-react-jsx-source": { - "version": "7.22.5", - "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-source/-/plugin-transform-react-jsx-source-7.22.5.tgz", - "integrity": "sha512-yIiRO6yobeEIaI0RTbIr8iAK9FcBHLtZq0S89ZPjDLQXBA4xvghaKqI0etp/tF3htTM0sazJKKLz9oEiGRtu7w==", - "dev": true, - "dependencies": { - "@babel/helper-plugin-utils": "^7.22.5" - }, - "engines": { - "node": ">=6.9.0" - }, - "peerDependencies": { - "@babel/core": "^7.0.0-0" - } - }, "node_modules/@babel/plugin-transform-regenerator": { "version": "7.22.10", "resolved": "https://registry.npmjs.org/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.22.10.tgz", @@ -2377,12 +2349,6 @@ "node": ">=6.9.0" } }, - "node_modules/@base2/pretty-print-object": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/@base2/pretty-print-object/-/pretty-print-object-1.0.1.tgz", - "integrity": "sha512-4iri8i1AqYHJE2DstZYkyEprg6Pq6sKx3xn5FpySk9sNhH7qN2LLlHJCfDTZRILNwQNPD7mATWM0TBui7uC1pA==", - "dev": true - }, "node_modules/@bcoe/v8-coverage": { "version": "0.2.3", "resolved": "https://registry.npmjs.org/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz", @@ -2397,6 +2363,10 @@ "resolved": "packages/vanilla", "link": true }, + "node_modules/@cbpds/web-components": { + "resolved": "packages/web-components", + "link": true + }, "node_modules/@colors/colors": { "version": "1.5.0", "resolved": "https://registry.npmjs.org/@colors/colors/-/colors-1.5.0.tgz", @@ -3867,39 +3837,6 @@ "node": "^14.15.0 || ^16.10.0 || >=18.0.0" } }, - "node_modules/@joshwooding/vite-plugin-react-docgen-typescript": { - "version": "0.3.0", - "resolved": "https://registry.npmjs.org/@joshwooding/vite-plugin-react-docgen-typescript/-/vite-plugin-react-docgen-typescript-0.3.0.tgz", - "integrity": "sha512-2D6y7fNvFmsLmRt6UCOFJPvFoPMJGT0Uh1Wg0RaigUp7kdQPs6yYn8Dmx6GZkOH/NW0yMTwRz/p0SRMMRo50vA==", - "dev": true, - "dependencies": { - "glob": "^7.2.0", - "glob-promise": "^4.2.0", - "magic-string": "^0.27.0", - "react-docgen-typescript": "^2.2.2" - }, - "peerDependencies": { - "typescript": ">= 4.3.x", - "vite": "^3.0.0 || ^4.0.0 || ^5.0.0" - }, - "peerDependenciesMeta": { - "typescript": { - "optional": true - } - } - }, - "node_modules/@joshwooding/vite-plugin-react-docgen-typescript/node_modules/magic-string": { - "version": "0.27.0", - "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.27.0.tgz", - "integrity": "sha512-8UnnX2PeRAPZuN12svgR9j7M1uWMovg/CEnIwIG0LFkXSJJe4PdfUGiTGl8V9bsBHFUtfVINcSyYxd7q+kx9fA==", - "dev": true, - "dependencies": { - "@jridgewell/sourcemap-codec": "^1.4.13" - }, - "engines": { - "node": ">=12" - } - }, "node_modules/@jridgewell/gen-mapping": { "version": "0.3.3", "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz", @@ -3971,116 +3908,6 @@ "react": ">=16" } }, - "node_modules/@microsoft/api-extractor": { - "version": "7.38.0", - "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-7.38.0.tgz", - "integrity": "sha512-e1LhZYnfw+JEebuY2bzhw0imDCl1nwjSThTrQqBXl40hrVo6xm3j/1EpUr89QyzgjqmAwek2ZkIVZbrhaR+cqg==", - "dev": true, - "dependencies": { - "@microsoft/api-extractor-model": "7.28.2", - "@microsoft/tsdoc": "0.14.2", - "@microsoft/tsdoc-config": "~0.16.1", - "@rushstack/node-core-library": "3.61.0", - "@rushstack/rig-package": "0.5.1", - "@rushstack/ts-command-line": "4.16.1", - "colors": "~1.2.1", - "lodash": "~4.17.15", - "resolve": "~1.22.1", - "semver": "~7.5.4", - "source-map": "~0.6.1", - "typescript": "~5.0.4" - }, - "bin": { - "api-extractor": "bin/api-extractor" - } - }, - "node_modules/@microsoft/api-extractor-model": { - "version": "7.28.2", - "resolved": "https://registry.npmjs.org/@microsoft/api-extractor-model/-/api-extractor-model-7.28.2.tgz", - "integrity": "sha512-vkojrM2fo3q4n4oPh4uUZdjJ2DxQ2+RnDQL/xhTWSRUNPF6P4QyrvY357HBxbnltKcYu+nNNolVqc6TIGQ73Ig==", - "dev": true, - "dependencies": { - "@microsoft/tsdoc": "0.14.2", - "@microsoft/tsdoc-config": "~0.16.1", - "@rushstack/node-core-library": "3.61.0" - } - }, - "node_modules/@microsoft/api-extractor/node_modules/resolve": { - "version": "1.22.8", - "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.8.tgz", - "integrity": "sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==", - "dev": true, - "dependencies": { - "is-core-module": "^2.13.0", - "path-parse": "^1.0.7", - "supports-preserve-symlinks-flag": "^1.0.0" - }, - "bin": { - "resolve": "bin/resolve" - }, - "funding": { - "url": "https://github.com/sponsors/ljharb" - } - }, - "node_modules/@microsoft/api-extractor/node_modules/semver": { - "version": "7.5.4", - "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz", - "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==", - "dev": true, - "dependencies": { - "lru-cache": "^6.0.0" - }, - "bin": { - "semver": "bin/semver.js" - }, - "engines": { - "node": ">=10" - } - }, - "node_modules/@microsoft/api-extractor/node_modules/typescript": { - "version": "5.0.4", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.0.4.tgz", - "integrity": "sha512-cW9T5W9xY37cc+jfEnaUvX91foxtHkza3Nw3wkoF4sSlKn0MONdkdEndig/qPBWXNkmplh3NzayQzCiHM4/hqw==", - "dev": true, - "bin": { - "tsc": "bin/tsc", - "tsserver": "bin/tsserver" - }, - "engines": { - "node": ">=12.20" - } - }, - "node_modules/@microsoft/tsdoc": { - "version": "0.14.2", - "resolved": "https://registry.npmjs.org/@microsoft/tsdoc/-/tsdoc-0.14.2.tgz", - "integrity": "sha512-9b8mPpKrfeGRuhFH5iO1iwCLeIIsV6+H1sRfxbkoGXIyQE2BTsPd9zqSqQJ+pv5sJ/hT5M1zvOFL02MnEezFug==", - "dev": true - }, - "node_modules/@microsoft/tsdoc-config": { - "version": "0.16.2", - "resolved": "https://registry.npmjs.org/@microsoft/tsdoc-config/-/tsdoc-config-0.16.2.tgz", - "integrity": "sha512-OGiIzzoBLgWWR0UdRJX98oYO+XKGf7tiK4Zk6tQ/E4IJqGCe7dvkTvgDZV5cFJUzLGDOjeAXrnZoA6QkVySuxw==", - "dev": true, - "dependencies": { - "@microsoft/tsdoc": "0.14.2", - "ajv": "~6.12.6", - "jju": "~1.4.0", - "resolve": "~1.19.0" - } - }, - "node_modules/@microsoft/tsdoc-config/node_modules/resolve": { - "version": "1.19.0", - "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.19.0.tgz", - "integrity": "sha512-rArEXAgsBG4UgRGcynxWIWKFvh/XZCcS8UJdHhwy91zwAvCZIbcs+vAbflgBnNjYMs/i/i+/Ux6IZhML1yPvxg==", - "dev": true, - "dependencies": { - "is-core-module": "^2.1.0", - "path-parse": "^1.0.6" - }, - "funding": { - "url": "https://github.com/sponsors/ljharb" - } - }, "node_modules/@ndelangen/get-tarball": { "version": "3.0.9", "resolved": "https://registry.npmjs.org/@ndelangen/get-tarball/-/get-tarball-3.0.9.tgz", @@ -4896,169 +4723,6 @@ "@babel/runtime": "^7.13.10" } }, - "node_modules/@rollup/pluginutils": { - "version": "5.0.5", - "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-5.0.5.tgz", - "integrity": "sha512-6aEYR910NyP73oHiJglti74iRyOwgFU4x3meH/H8OJx6Ry0j6cOVZ5X/wTvub7G7Ao6qaHBEaNsV3GLJkSsF+Q==", - "dev": true, - "dependencies": { - "@types/estree": "^1.0.0", - "estree-walker": "^2.0.2", - "picomatch": "^2.3.1" - }, - "engines": { - "node": ">=14.0.0" - }, - "peerDependencies": { - "rollup": "^1.20.0||^2.0.0||^3.0.0||^4.0.0" - }, - "peerDependenciesMeta": { - "rollup": { - "optional": true - } - } - }, - "node_modules/@rollup/pluginutils/node_modules/@types/estree": { - "version": "1.0.3", - "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.3.tgz", - "integrity": "sha512-CS2rOaoQ/eAgAfcTfq6amKG7bsN+EMcgGY4FAFQdvSj2y1ixvOZTUA9mOtCai7E1SYu283XNw7urKK30nP3wkQ==", - "dev": true - }, - "node_modules/@rushstack/node-core-library": { - "version": "3.61.0", - "resolved": "https://registry.npmjs.org/@rushstack/node-core-library/-/node-core-library-3.61.0.tgz", - "integrity": "sha512-tdOjdErme+/YOu4gPed3sFS72GhtWCgNV9oDsHDnoLY5oDfwjKUc9Z+JOZZ37uAxcm/OCahDHfuu2ugqrfWAVQ==", - "dev": true, - "dependencies": { - "colors": "~1.2.1", - "fs-extra": "~7.0.1", - "import-lazy": "~4.0.0", - "jju": "~1.4.0", - "resolve": "~1.22.1", - "semver": "~7.5.4", - "z-schema": "~5.0.2" - }, - "peerDependencies": { - "@types/node": "*" - }, - "peerDependenciesMeta": { - "@types/node": { - "optional": true - } - } - }, - "node_modules/@rushstack/node-core-library/node_modules/fs-extra": { - "version": "7.0.1", - "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-7.0.1.tgz", - "integrity": "sha512-YJDaCJZEnBmcbw13fvdAM9AwNOJwOzrE4pqMqBq5nFiEqXUqHwlK4B+3pUw6JNvfSPtX05xFHtYy/1ni01eGCw==", - "dev": true, - "dependencies": { - "graceful-fs": "^4.1.2", - "jsonfile": "^4.0.0", - "universalify": "^0.1.0" - }, - "engines": { - "node": ">=6 <7 || >=8" - } - }, - "node_modules/@rushstack/node-core-library/node_modules/jsonfile": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-4.0.0.tgz", - "integrity": "sha512-m6F1R3z8jjlf2imQHS2Qez5sjKWQzbuuhuJ/FKYFRZvPE3PuHcSMVZzfsLhGVOkfd20obL5SWEBew5ShlquNxg==", - "dev": true, - "optionalDependencies": { - "graceful-fs": "^4.1.6" - } - }, - "node_modules/@rushstack/node-core-library/node_modules/resolve": { - "version": "1.22.8", - "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.8.tgz", - "integrity": "sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==", - "dev": true, - "dependencies": { - "is-core-module": "^2.13.0", - "path-parse": "^1.0.7", - "supports-preserve-symlinks-flag": "^1.0.0" - }, - "bin": { - "resolve": "bin/resolve" - }, - "funding": { - "url": "https://github.com/sponsors/ljharb" - } - }, - "node_modules/@rushstack/node-core-library/node_modules/semver": { - "version": "7.5.4", - "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz", - "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==", - "dev": true, - "dependencies": { - "lru-cache": "^6.0.0" - }, - "bin": { - "semver": "bin/semver.js" - }, - "engines": { - "node": ">=10" - } - }, - "node_modules/@rushstack/node-core-library/node_modules/universalify": { - "version": "0.1.2", - "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.2.tgz", - "integrity": "sha512-rBJeI5CXAlmy1pV+617WB9J63U6XcazHHF2f2dbJix4XzpUF0RS3Zbj0FGIOCAva5P/d/GBOYaACQ1w+0azUkg==", - "dev": true, - "engines": { - "node": ">= 4.0.0" - } - }, - "node_modules/@rushstack/rig-package": { - "version": "0.5.1", - "resolved": "https://registry.npmjs.org/@rushstack/rig-package/-/rig-package-0.5.1.tgz", - "integrity": "sha512-pXRYSe29TjRw7rqxD4WS3HN/sRSbfr+tJs4a9uuaSIBAITbUggygdhuG0VrO0EO+QqH91GhYMN4S6KRtOEmGVA==", - "dev": true, - "dependencies": { - "resolve": "~1.22.1", - "strip-json-comments": "~3.1.1" - } - }, - "node_modules/@rushstack/rig-package/node_modules/resolve": { - "version": "1.22.8", - "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.8.tgz", - "integrity": "sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==", - "dev": true, - "dependencies": { - "is-core-module": "^2.13.0", - "path-parse": "^1.0.7", - "supports-preserve-symlinks-flag": "^1.0.0" - }, - "bin": { - "resolve": "bin/resolve" - }, - "funding": { - "url": "https://github.com/sponsors/ljharb" - } - }, - "node_modules/@rushstack/ts-command-line": { - "version": "4.16.1", - "resolved": "https://registry.npmjs.org/@rushstack/ts-command-line/-/ts-command-line-4.16.1.tgz", - "integrity": "sha512-+OCsD553GYVLEmz12yiFjMOzuPeCiZ3f8wTiFHL30ZVXexTyPmgjwXEhg2K2P0a2lVf+8YBy7WtPoflB2Fp8/A==", - "dev": true, - "dependencies": { - "@types/argparse": "1.0.38", - "argparse": "~1.0.9", - "colors": "~1.2.1", - "string-argv": "~0.3.1" - } - }, - "node_modules/@rushstack/ts-command-line/node_modules/argparse": { - "version": "1.0.10", - "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz", - "integrity": "sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==", - "dev": true, - "dependencies": { - "sprintf-js": "~1.0.2" - } - }, "node_modules/@sinclair/typebox": { "version": "0.27.8", "resolved": "https://registry.npmjs.org/@sinclair/typebox/-/typebox-0.27.8.tgz", @@ -5136,6 +4800,15 @@ "npm": ">=7.10.0" } }, + "node_modules/@stencil/react-output-target": { + "version": "0.5.3", + "resolved": "https://registry.npmjs.org/@stencil/react-output-target/-/react-output-target-0.5.3.tgz", + "integrity": "sha512-68jwRp35CjAcwhTJ9yFD/3n+jrHOqvEH2jreVuPVvZK+4tkhPlYlwz0d1E1RlF3jyifUSfdkWUGgXIEy8Fo3yw==", + "dev": true, + "peerDependencies": { + "@stencil/core": ">=2.0.0 || >=3 || >= 4.0.0-beta.0 || >= 4.0.0" + } + }, "node_modules/@stencil/sass": { "version": "3.0.7", "resolved": "https://registry.npmjs.org/@stencil/sass/-/sass-3.0.7.tgz", @@ -5479,20 +5152,6 @@ } } }, - "node_modules/@storybook/addon-onboarding": { - "version": "1.0.8", - "resolved": "https://registry.npmjs.org/@storybook/addon-onboarding/-/addon-onboarding-1.0.8.tgz", - "integrity": "sha512-3WwCocUuTibHWO89uzAbeONEn6x9NkmxA0mOU4rYPhEsMQ4NDNDD1GXcievZmpwt5VviFgw5FRx8+BxPn54YmQ==", - "dev": true, - "dependencies": { - "@storybook/telemetry": "^7.1.0-alpha.32", - "react-confetti": "^6.1.0" - }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" - } - }, "node_modules/@storybook/addon-outline": { "version": "7.5.1", "resolved": "https://registry.npmjs.org/@storybook/addon-outline/-/addon-outline-7.5.1.tgz", @@ -5525,59 +5184,6 @@ } } }, - "node_modules/@storybook/addon-styling": { - "version": "1.3.7", - "resolved": "https://registry.npmjs.org/@storybook/addon-styling/-/addon-styling-1.3.7.tgz", - "integrity": "sha512-JSBZMOrSw/3rlq5YoEI7Qyq703KSNP0Jd+gxTWu3/tP6245mpjn2dXnR8FvqVxCi+FG4lt2kQyPzgsuwEw1SSA==", - "dev": true, - "dependencies": { - "@babel/template": "^7.20.7", - "@babel/types": "^7.21.5", - "@storybook/api": "^7.0.12", - "@storybook/components": "^7.0.12", - "@storybook/core-common": "^7.0.12", - "@storybook/core-events": "^7.0.12", - "@storybook/manager-api": "^7.0.12", - "@storybook/node-logger": "^7.0.12", - "@storybook/preview-api": "^7.0.12", - "@storybook/theming": "^7.0.12", - "@storybook/types": "^7.0.12", - "css-loader": "^6.7.3", - "less-loader": "^11.1.0", - "postcss-loader": "^7.2.4", - "prettier": "^2.8.0", - "resolve-url-loader": "^5.0.0", - "sass-loader": "^13.2.2", - "style-loader": "^3.3.2" - }, - "bin": { - "addon-styling-setup": "postinstall.js" - }, - "peerDependencies": { - "less": "^3.5.0 || ^4.0.0", - "postcss": "^7.0.0 || ^8.0.1", - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0", - "webpack": "^5.0.0" - }, - "peerDependenciesMeta": { - "less": { - "optional": true - }, - "postcss": { - "optional": true - }, - "react": { - "optional": true - }, - "react-dom": { - "optional": true - }, - "webpack": { - "optional": true - } - } - }, "node_modules/@storybook/addon-themes": { "version": "7.5.1", "resolved": "https://registry.npmjs.org/@storybook/addon-themes/-/addon-themes-7.5.1.tgz", @@ -5691,32 +5297,6 @@ "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" } }, - "node_modules/@storybook/api": { - "version": "7.5.1", - "resolved": "https://registry.npmjs.org/@storybook/api/-/api-7.5.1.tgz", - "integrity": "sha512-z5HrwXnBdfr8q5CO3E9oL0H+joixyuQ2nod+UPqd5QYE/GzpyWHTzpW6CxSCDX2wL60KEsfc/7T0CE12Gx4XMA==", - "dev": true, - "dependencies": { - "@storybook/client-logger": "7.5.1", - "@storybook/manager-api": "7.5.1" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/storybook" - }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, - "peerDependenciesMeta": { - "react": { - "optional": true - }, - "react-dom": { - "optional": true - } - } - }, "node_modules/@storybook/blocks": { "version": "7.5.1", "resolved": "https://registry.npmjs.org/@storybook/blocks/-/blocks-7.5.1.tgz", @@ -6593,169 +6173,32 @@ "url": "https://opencollective.com/storybook" } }, - "node_modules/@storybook/preview-web": { - "version": "7.5.1", - "resolved": "https://registry.npmjs.org/@storybook/preview-web/-/preview-web-7.5.1.tgz", - "integrity": "sha512-Nsx+OGT3SIi2uLiCUkgqEJxXY/1Di3192A+gSCFp7kdiJ9PtTwc0C1PT/tpmWUHf90OUuEe2a0lgieYiHhEeJw==", - "dev": true, - "dependencies": { - "@storybook/client-logger": "7.5.1", - "@storybook/preview-api": "7.5.1" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/storybook" - } - }, - "node_modules/@storybook/react": { - "version": "7.5.1", - "resolved": "https://registry.npmjs.org/@storybook/react/-/react-7.5.1.tgz", - "integrity": "sha512-IG97c30fFSmPyGpJ1awHC/+9XnCTqleeOQwROXjroMHSm8m/JTWpHMVLyM1x7b6VAnBhNHWJ+oXLZe/hXkXfpA==", - "dev": true, - "dependencies": { - "@storybook/client-logger": "7.5.1", - "@storybook/core-client": "7.5.1", - "@storybook/docs-tools": "7.5.1", - "@storybook/global": "^5.0.0", - "@storybook/preview-api": "7.5.1", - "@storybook/react-dom-shim": "7.5.1", - "@storybook/types": "7.5.1", - "@types/escodegen": "^0.0.6", - "@types/estree": "^0.0.51", - "@types/node": "^18.0.0", - "acorn": "^7.4.1", - "acorn-jsx": "^5.3.1", - "acorn-walk": "^7.2.0", - "escodegen": "^2.1.0", - "html-tags": "^3.1.0", - "lodash": "^4.17.21", - "prop-types": "^15.7.2", - "react-element-to-jsx-string": "^15.0.0", - "ts-dedent": "^2.0.0", - "type-fest": "~2.19", - "util-deprecate": "^1.0.2" - }, - "engines": { - "node": ">=16.0.0" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/storybook" - }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0", - "typescript": "*" - }, - "peerDependenciesMeta": { - "typescript": { - "optional": true - } - } - }, - "node_modules/@storybook/react-dom-shim": { - "version": "7.5.1", - "resolved": "https://registry.npmjs.org/@storybook/react-dom-shim/-/react-dom-shim-7.5.1.tgz", - "integrity": "sha512-bzTIfLm91O9h3rPYJLtRbmsPARerY3z7MoyvadGp8TikvIvf+WyT/vHujw+20SxnqiZVq5Jv65FFlxc46GGB1Q==", - "dev": true, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/storybook" - }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" - } - }, - "node_modules/@storybook/react-vite": { + "node_modules/@storybook/preview-web": { "version": "7.5.1", - "resolved": "https://registry.npmjs.org/@storybook/react-vite/-/react-vite-7.5.1.tgz", - "integrity": "sha512-996/CtOqTjDWMKBGcHG8pwIVlORnoknLD+OTkPXl+aAl9oM9jUtc7psVKLJKGHSHTlVElM2wMTwIHnJ4yeP7bw==", + "resolved": "https://registry.npmjs.org/@storybook/preview-web/-/preview-web-7.5.1.tgz", + "integrity": "sha512-Nsx+OGT3SIi2uLiCUkgqEJxXY/1Di3192A+gSCFp7kdiJ9PtTwc0C1PT/tpmWUHf90OUuEe2a0lgieYiHhEeJw==", "dev": true, "dependencies": { - "@joshwooding/vite-plugin-react-docgen-typescript": "0.3.0", - "@rollup/pluginutils": "^5.0.2", - "@storybook/builder-vite": "7.5.1", - "@storybook/react": "7.5.1", - "@vitejs/plugin-react": "^3.0.1", - "magic-string": "^0.30.0", - "react-docgen": "^6.0.2" - }, - "engines": { - "node": ">=16" + "@storybook/client-logger": "7.5.1", + "@storybook/preview-api": "7.5.1" }, "funding": { "type": "opencollective", "url": "https://opencollective.com/storybook" - }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0", - "vite": "^3.0.0 || ^4.0.0 || ^5.0.0" } }, - "node_modules/@storybook/react-vite/node_modules/@vitejs/plugin-react": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-3.1.0.tgz", - "integrity": "sha512-AfgcRL8ZBhAlc3BFdigClmTUMISmmzHn7sB2h9U1odvc5U/MjWXsAaz18b/WoppUTDBzxOJwo2VdClfUcItu9g==", + "node_modules/@storybook/react-dom-shim": { + "version": "7.5.1", + "resolved": "https://registry.npmjs.org/@storybook/react-dom-shim/-/react-dom-shim-7.5.1.tgz", + "integrity": "sha512-bzTIfLm91O9h3rPYJLtRbmsPARerY3z7MoyvadGp8TikvIvf+WyT/vHujw+20SxnqiZVq5Jv65FFlxc46GGB1Q==", "dev": true, - "dependencies": { - "@babel/core": "^7.20.12", - "@babel/plugin-transform-react-jsx-self": "^7.18.6", - "@babel/plugin-transform-react-jsx-source": "^7.19.6", - "magic-string": "^0.27.0", - "react-refresh": "^0.14.0" - }, - "engines": { - "node": "^14.18.0 || >=16.0.0" + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/storybook" }, "peerDependencies": { - "vite": "^4.1.0-beta.0" - } - }, - "node_modules/@storybook/react-vite/node_modules/@vitejs/plugin-react/node_modules/magic-string": { - "version": "0.27.0", - "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.27.0.tgz", - "integrity": "sha512-8UnnX2PeRAPZuN12svgR9j7M1uWMovg/CEnIwIG0LFkXSJJe4PdfUGiTGl8V9bsBHFUtfVINcSyYxd7q+kx9fA==", - "dev": true, - "dependencies": { - "@jridgewell/sourcemap-codec": "^1.4.13" - }, - "engines": { - "node": ">=12" - } - }, - "node_modules/@storybook/react/node_modules/@types/node": { - "version": "18.18.7", - "resolved": "https://registry.npmjs.org/@types/node/-/node-18.18.7.tgz", - "integrity": "sha512-bw+lEsxis6eqJYW8Ql6+yTqkE6RuFtsQPSe5JxXbqYRFQEER5aJA9a5UH9igqDWm3X4iLHIKOHlnAXLM4mi7uQ==", - "dev": true, - "dependencies": { - "undici-types": "~5.26.4" - } - }, - "node_modules/@storybook/react/node_modules/acorn": { - "version": "7.4.1", - "resolved": "https://registry.npmjs.org/acorn/-/acorn-7.4.1.tgz", - "integrity": "sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==", - "dev": true, - "bin": { - "acorn": "bin/acorn" - }, - "engines": { - "node": ">=0.4.0" - } - }, - "node_modules/@storybook/react/node_modules/type-fest": { - "version": "2.19.0", - "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-2.19.0.tgz", - "integrity": "sha512-RAH822pAdBgcNMAfWnCBU3CFZcfZ/i1eZjwFU/dsLKumyuuP3niueg2UAukXYF0E2AAoc82ZSSf9J0WQBinzHA==", - "dev": true, - "engines": { - "node": ">=12.20" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" + "react": "^16.8.0 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" } }, "node_modules/@storybook/router": { @@ -6891,12 +6334,6 @@ "integrity": "sha512-C5Mc6rdnsaJDjO3UpGW/CQTHtCKaYlScZTly4JIu97Jxo/odCiH0ITnDXSJPTOrEKk/ycSZ0AOgTmkDtkOsvIA==", "dev": true }, - "node_modules/@types/argparse": { - "version": "1.0.38", - "resolved": "https://registry.npmjs.org/@types/argparse/-/argparse-1.0.38.tgz", - "integrity": "sha512-ebDJ9b0e702Yr7pWgB0jzm+CX4Srzz8RcXtLJDJB+BSccqMa36uyH/zUsSYao5+BD1ytv3k3rPYCq4mAE1hsXA==", - "dev": true - }, "node_modules/@types/aria-query": { "version": "5.0.3", "resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.3.tgz", @@ -6996,18 +6433,6 @@ "integrity": "sha512-ILdWj4XYtNOqxJaW22NEQx2gJsLfV5ncxYhhGX1a1H1lXl2Ta0gUz7QOnOoF1xQbJwWDjImi8gXN9mKdIf6n9g==", "dev": true }, - "node_modules/@types/escodegen": { - "version": "0.0.6", - "resolved": "https://registry.npmjs.org/@types/escodegen/-/escodegen-0.0.6.tgz", - "integrity": "sha512-AjwI4MvWx3HAOaZqYsjKWyEObT9lcVV0Y0V8nXo6cXzN8ZiMxVhf6F3d/UNvXVGKrEzL/Dluc5p+y9GkzlTWig==", - "dev": true - }, - "node_modules/@types/estree": { - "version": "0.0.51", - "resolved": "https://registry.npmjs.org/@types/estree/-/estree-0.0.51.tgz", - "integrity": "sha512-CuPgU6f3eT/XgKKPqKd/gLZV1Xmvf1a2R5POBOGQa6uv82xpls89HU5zKeVoyR8XzHd1RGNOlQlvUe3CFkjWNQ==", - "dev": true - }, "node_modules/@types/express": { "version": "4.17.20", "resolved": "https://registry.npmjs.org/@types/express/-/express-4.17.20.tgz", @@ -7038,16 +6463,6 @@ "integrity": "sha512-frsJrz2t/CeGifcu/6uRo4b+SzAwT4NYCVPu1GN8IB9XTzrpPkGuV0tmh9mN+/L0PklAlsC3u5Fxt0ju00LXIw==", "dev": true }, - "node_modules/@types/glob": { - "version": "7.2.0", - "resolved": "https://registry.npmjs.org/@types/glob/-/glob-7.2.0.tgz", - "integrity": "sha512-ZUxbzKl0IfJILTS6t7ip5fQQM/J3TJYubDm3nMbgubNNYS62eXeUpoLUC8/7fJNiFYHTrGPQn7hspDUzIHX3UA==", - "dev": true, - "dependencies": { - "@types/minimatch": "*", - "@types/node": "*" - } - }, "node_modules/@types/graceful-fs": { "version": "4.1.8", "resolved": "https://registry.npmjs.org/@types/graceful-fs/-/graceful-fs-4.1.8.tgz", @@ -7136,12 +6551,6 @@ "integrity": "sha512-bvxCbHeeS7quxS7uOJShyoOQj/BfLabhF6mk9Rmr+2MRfW8W1yxyyL/0GTxLFTHen41GrIw4K3D4DrLouhb8vg==", "dev": true }, - "node_modules/@types/minimatch": { - "version": "5.1.2", - "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-5.1.2.tgz", - "integrity": "sha512-K0VQKziLUWkVKiRVrx4a40iPaxTUefQmjtkQofBkYRcoaaL/8rhwDWww9qWbrgicNOgnpIsMxyNIUM4+n6dUIA==", - "dev": true - }, "node_modules/@types/minimist": { "version": "1.2.4", "resolved": "https://registry.npmjs.org/@types/minimist/-/minimist-1.2.4.tgz", @@ -7149,10 +6558,13 @@ "dev": true }, "node_modules/@types/node": { - "version": "16.18.59", - "resolved": "https://registry.npmjs.org/@types/node/-/node-16.18.59.tgz", - "integrity": "sha512-PJ1w2cNeKUEdey4LiPra0ZuxZFOGvetswE8qHRriV/sUkL5Al4tTmPV9D2+Y/TPIxTHHgxTfRjZVKWhPw/ORhQ==", - "dev": true + "version": "20.9.0", + "resolved": "https://registry.npmjs.org/@types/node/-/node-20.9.0.tgz", + "integrity": "sha512-nekiGu2NDb1BcVofVcEKMIwzlx4NjHlcjhoxxKBNLtz15Y1z7MYf549DFvkHSId02Ax6kGwWntIBPC3l/JZcmw==", + "dev": true, + "dependencies": { + "undici-types": "~5.26.4" + } }, "node_modules/@types/node-fetch": { "version": "2.6.7", @@ -7207,9 +6619,9 @@ "dev": true }, "node_modules/@types/react": { - "version": "18.2.33", - "resolved": "https://registry.npmjs.org/@types/react/-/react-18.2.33.tgz", - "integrity": "sha512-v+I7S+hu3PIBoVkKGpSYYpiBT1ijqEzWpzQD62/jm4K74hPpSP7FF9BnKG6+fg2+62weJYkkBWDJlZt5JO/9hg==", + "version": "18.2.37", + "resolved": "https://registry.npmjs.org/@types/react/-/react-18.2.37.tgz", + "integrity": "sha512-RGAYMi2bhRgEXT3f4B92WTohopH6bIXw05FuGlmJEnv/omEn190+QYEIYxIAuIBdKgboYYdVved2p1AxZVQnaw==", "dev": true, "dependencies": { "@types/prop-types": "*", @@ -7217,21 +6629,6 @@ "csstype": "^3.0.2" } }, - "node_modules/@types/react-dom": { - "version": "18.2.14", - "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.2.14.tgz", - "integrity": "sha512-V835xgdSVmyQmI1KLV2BEIUgqEuinxp9O4G6g3FqO/SqLac049E53aysv0oEFD2kHfejeKU+ZqL2bcFWj9gLAQ==", - "dev": true, - "dependencies": { - "@types/react": "*" - } - }, - "node_modules/@types/resolve": { - "version": "1.20.4", - "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-1.20.4.tgz", - "integrity": "sha512-BKGK0T1VgB1zD+PwQR4RRf0ais3NyvH1qjLUrHI5SEiccYaJrhLstLuoXFWJ+2Op9whGizSPUMGPJY/Qtb/A2w==", - "dev": true - }, "node_modules/@types/scheduler": { "version": "0.16.5", "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.5.tgz", @@ -7308,128 +6705,6 @@ "integrity": "sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ==", "dev": true }, - "node_modules/@vitejs/plugin-react": { - "version": "4.1.0", - "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-4.1.0.tgz", - "integrity": "sha512-rM0SqazU9iqPUraQ2JlIvReeaxOoRj6n+PzB1C0cBzIbd8qP336nC39/R9yPi3wVcah7E7j/kdU1uCUqMEU4OQ==", - "dev": true, - "dependencies": { - "@babel/core": "^7.22.20", - "@babel/plugin-transform-react-jsx-self": "^7.22.5", - "@babel/plugin-transform-react-jsx-source": "^7.22.5", - "@types/babel__core": "^7.20.2", - "react-refresh": "^0.14.0" - }, - "engines": { - "node": "^14.18.0 || >=16.0.0" - }, - "peerDependencies": { - "vite": "^4.2.0" - } - }, - "node_modules/@volar/language-core": { - "version": "1.10.5", - "resolved": "https://registry.npmjs.org/@volar/language-core/-/language-core-1.10.5.tgz", - "integrity": "sha512-xD71j4Ee0Ycq8WsiAE6H/aCThGdTobiZZeD+jFD+bvmbopa1Az296pqJysr3Ck8c7n5+GGF+xlKCS3WxRFYgSQ==", - "dev": true, - "dependencies": { - "@volar/source-map": "1.10.5" - } - }, - "node_modules/@volar/source-map": { - "version": "1.10.5", - "resolved": "https://registry.npmjs.org/@volar/source-map/-/source-map-1.10.5.tgz", - "integrity": "sha512-s4kgo66SA1kMzYvF9HFE6Vc1rxtXLUmcLrT2WKnchPDvLne+97Kw+xoR2NxJFmsvHoL18vmu/YGXYcN+Q5re1g==", - "dev": true, - "dependencies": { - "muggle-string": "^0.3.1" - } - }, - "node_modules/@volar/typescript": { - "version": "1.10.5", - "resolved": "https://registry.npmjs.org/@volar/typescript/-/typescript-1.10.5.tgz", - "integrity": "sha512-kfDehpeLJku9i1BgsFOYIczPmFFH4herl+GZrLGdvX5urTqeCKsKYlF36iNmFaADzjMb9WlENcUZzPjK8MxNrQ==", - "dev": true, - "dependencies": { - "@volar/language-core": "1.10.5" - } - }, - "node_modules/@vue/compiler-core": { - "version": "3.3.7", - "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.3.7.tgz", - "integrity": "sha512-pACdY6YnTNVLXsB86YD8OF9ihwpolzhhtdLVHhBL6do/ykr6kKXNYABRtNMGrsQXpEXXyAdwvWWkuTbs4MFtPQ==", - "dev": true, - "dependencies": { - "@babel/parser": "^7.23.0", - "@vue/shared": "3.3.7", - "estree-walker": "^2.0.2", - "source-map-js": "^1.0.2" - } - }, - "node_modules/@vue/compiler-dom": { - "version": "3.3.7", - "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.3.7.tgz", - "integrity": "sha512-0LwkyJjnUPssXv/d1vNJ0PKfBlDoQs7n81CbO6Q0zdL7H1EzqYRrTVXDqdBVqro0aJjo/FOa1qBAPVI4PGSHBw==", - "dev": true, - "dependencies": { - "@vue/compiler-core": "3.3.7", - "@vue/shared": "3.3.7" - } - }, - "node_modules/@vue/language-core": { - "version": "1.8.22", - "resolved": "https://registry.npmjs.org/@vue/language-core/-/language-core-1.8.22.tgz", - "integrity": "sha512-bsMoJzCrXZqGsxawtUea1cLjUT9dZnDsy5TuZ+l1fxRMzUGQUG9+Ypq4w//CqpWmrx7nIAJpw2JVF/t258miRw==", - "dev": true, - "dependencies": { - "@volar/language-core": "~1.10.5", - "@volar/source-map": "~1.10.5", - "@vue/compiler-dom": "^3.3.0", - "@vue/shared": "^3.3.0", - "computeds": "^0.0.1", - "minimatch": "^9.0.3", - "muggle-string": "^0.3.1", - "vue-template-compiler": "^2.7.14" - }, - "peerDependencies": { - "typescript": "*" - }, - "peerDependenciesMeta": { - "typescript": { - "optional": true - } - } - }, - "node_modules/@vue/language-core/node_modules/brace-expansion": { - "version": "2.0.1", - "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz", - "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==", - "dev": true, - "dependencies": { - "balanced-match": "^1.0.0" - } - }, - "node_modules/@vue/language-core/node_modules/minimatch": { - "version": "9.0.3", - "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.3.tgz", - "integrity": "sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==", - "dev": true, - "dependencies": { - "brace-expansion": "^2.0.1" - }, - "engines": { - "node": ">=16 || 14 >=14.17" - }, - "funding": { - "url": "https://github.com/sponsors/isaacs" - } - }, - "node_modules/@vue/shared": { - "version": "3.3.7", - "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.3.7.tgz", - "integrity": "sha512-N/tbkINRUDExgcPTBvxNkvHGu504k8lzlNQRITVnm6YjOjwa4r0nnbd4Jb01sNpur5hAllyRJzSK5PvB9PPwRg==", - "dev": true - }, "node_modules/@whitespace/storybook-addon-html": { "version": "5.1.6", "resolved": "https://registry.npmjs.org/@whitespace/storybook-addon-html/-/storybook-addon-html-5.1.6.tgz", @@ -9022,15 +8297,6 @@ "integrity": "sha512-IfEDxwoWIjkeXL1eXcDiow4UbKjhLdq6/EuSVR9GMN7KVH3r9gQ83e73hsz1Nd1T3ijd5xv1wcWRYO+D6kCI2w==", "dev": true }, - "node_modules/colors": { - "version": "1.2.5", - "resolved": "https://registry.npmjs.org/colors/-/colors-1.2.5.tgz", - "integrity": "sha512-erNRLao/Y3Fv54qUa0LBB+//Uf3YwMUmdJinN20yMXm9zdKKqH9wt7R9IIVZ+K7ShzfpLV/Zg8+VyrBJYB4lpg==", - "dev": true, - "engines": { - "node": ">=0.1.90" - } - }, "node_modules/combined-stream": { "version": "1.0.8", "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz", @@ -9113,12 +8379,6 @@ "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==", "dev": true }, - "node_modules/computeds": { - "version": "0.0.1", - "resolved": "https://registry.npmjs.org/computeds/-/computeds-0.0.1.tgz", - "integrity": "sha512-7CEBgcMjVmitjYo5q8JTJVra6X5mQ20uTThdK+0kR7UEaDrAWEQcRiBtWJzga4eRpP6afNwwLsX2SET2JhVB1Q==", - "dev": true - }, "node_modules/concat-map": { "version": "0.0.1", "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", @@ -9329,47 +8589,6 @@ "node": ">=12 || >=16" } }, - "node_modules/css-loader": { - "version": "6.8.1", - "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-6.8.1.tgz", - "integrity": "sha512-xDAXtEVGlD0gJ07iclwWVkLoZOpEvAWaSyf6W18S2pOC//K8+qUDIx8IIT3D+HjnmkJPQeesOPv5aiUaJsCM2g==", - "dev": true, - "dependencies": { - "icss-utils": "^5.1.0", - "postcss": "^8.4.21", - "postcss-modules-extract-imports": "^3.0.0", - "postcss-modules-local-by-default": "^4.0.3", - "postcss-modules-scope": "^3.0.0", - "postcss-modules-values": "^4.0.0", - "postcss-value-parser": "^4.2.0", - "semver": "^7.3.8" - }, - "engines": { - "node": ">= 12.13.0" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/webpack" - }, - "peerDependencies": { - "webpack": "^5.0.0" - } - }, - "node_modules/css-loader/node_modules/semver": { - "version": "7.5.4", - "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz", - "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==", - "dev": true, - "dependencies": { - "lru-cache": "^6.0.0" - }, - "bin": { - "semver": "bin/semver.js" - }, - "engines": { - "node": ">=10" - } - }, "node_modules/cssesc": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz", @@ -9435,12 +8654,6 @@ "node": ">=10" } }, - "node_modules/de-indent": { - "version": "1.0.2", - "resolved": "https://registry.npmjs.org/de-indent/-/de-indent-1.0.2.tgz", - "integrity": "sha512-e/1zu3xH5MQryN2zdVaF0OrdNLUbvWxzMbi+iNA6Bky7l1RoP8a2fIbRocyHclXt/arDrrR6lL3TqFD9pMQTsg==", - "dev": true - }, "node_modules/debug": { "version": "4.3.4", "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz", @@ -10563,12 +9776,6 @@ "node": ">=4.0" } }, - "node_modules/estree-walker": { - "version": "2.0.2", - "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz", - "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==", - "dev": true - }, "node_modules/esutils": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz", @@ -11534,25 +10741,6 @@ "node": ">=10.13.0" } }, - "node_modules/glob-promise": { - "version": "4.2.2", - "resolved": "https://registry.npmjs.org/glob-promise/-/glob-promise-4.2.2.tgz", - "integrity": "sha512-xcUzJ8NWN5bktoTIX7eOclO1Npxd/dyVqUJxlLIDasT4C7KZyqlPIwkdJ0Ypiy3p2ZKahTjK4M9uC3sNSfNMzw==", - "dev": true, - "dependencies": { - "@types/glob": "^7.1.3" - }, - "engines": { - "node": ">=12" - }, - "funding": { - "type": "individual", - "url": "https://github.com/sponsors/ahmadnassri" - }, - "peerDependencies": { - "glob": "^7.1.6" - } - }, "node_modules/glob-to-regexp": { "version": "0.4.1", "resolved": "https://registry.npmjs.org/glob-to-regexp/-/glob-to-regexp-0.4.1.tgz", @@ -11875,15 +11063,6 @@ "url": "https://opencollective.com/unified" } }, - "node_modules/he": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/he/-/he-1.2.0.tgz", - "integrity": "sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==", - "dev": true, - "bin": { - "he": "bin/he" - } - }, "node_modules/header-case": { "version": "2.0.4", "resolved": "https://registry.npmjs.org/header-case/-/header-case-2.0.4.tgz", @@ -12037,18 +11216,6 @@ "node": ">=0.10.0" } }, - "node_modules/icss-utils": { - "version": "5.1.0", - "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-5.1.0.tgz", - "integrity": "sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==", - "dev": true, - "engines": { - "node": "^10 || ^12 || >= 14" - }, - "peerDependencies": { - "postcss": "^8.1.0" - } - }, "node_modules/ieee754": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.2.1.tgz", @@ -14630,21 +13797,6 @@ "url": "https://github.com/chalk/supports-color?sponsor=1" } }, - "node_modules/jiti": { - "version": "1.20.0", - "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.20.0.tgz", - "integrity": "sha512-3TV69ZbrvV6U5DfQimop50jE9Dl6J8O1ja1dvBbMba/sZ3YBEQqJ2VZRoQPVnhlzjNtU1vaXRZVrVjU4qtm8yA==", - "dev": true, - "bin": { - "jiti": "bin/jiti.js" - } - }, - "node_modules/jju": { - "version": "1.4.0", - "resolved": "https://registry.npmjs.org/jju/-/jju-1.4.0.tgz", - "integrity": "sha512-8wb9Yw966OSxApiCt0K3yNJL8pnNeIv+OEq2YMidz4FKP6nonSRoOXc80iXY4JaN2FC11B9qsNmDsm+ZOfMROA==", - "dev": true - }, "node_modules/js-stringify": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/js-stringify/-/js-stringify-1.0.2.tgz", @@ -14654,7 +13806,8 @@ "node_modules/js-tokens": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", - "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==" + "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==", + "dev": true }, "node_modules/js-yaml": { "version": "4.1.0", @@ -14953,12 +14106,6 @@ "integrity": "sha512-5FZRzrZzNTBruuurWpvZnvP9pum+fe0HcK8z/ooo+U+Hmp4vtbyp1/QDsqmufirXy4egGzbaH/y2uCZf+6W5Kg==", "dev": true }, - "node_modules/kolorist": { - "version": "1.8.0", - "resolved": "https://registry.npmjs.org/kolorist/-/kolorist-1.8.0.tgz", - "integrity": "sha512-Y+60/zizpJ3HRH8DCss+q95yr6145JXZo46OTpFvDZWLfRCE4qChOyk1b26nMaNpfHHgxagk9dXT5OP0Tfe+dQ==", - "dev": true - }, "node_modules/lazy-universal-dotenv": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/lazy-universal-dotenv/-/lazy-universal-dotenv-4.0.0.tgz", @@ -14969,25 +14116,8 @@ "dotenv": "^16.0.0", "dotenv-expand": "^10.0.0" }, - "engines": { - "node": ">=14.0.0" - } - }, - "node_modules/less-loader": { - "version": "11.1.3", - "resolved": "https://registry.npmjs.org/less-loader/-/less-loader-11.1.3.tgz", - "integrity": "sha512-A5b7O8dH9xpxvkosNrP0dFp2i/dISOJa9WwGF3WJflfqIERE2ybxh1BFDj5CovC2+jCE4M354mk90hN6ziXlVw==", - "dev": true, - "engines": { - "node": ">= 14.15.0" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/webpack" - }, - "peerDependencies": { - "less": "^3.5.0 || ^4.0.0", - "webpack": "^5.0.0" + "engines": { + "node": ">=14.0.0" } }, "node_modules/leven": { @@ -15100,18 +14230,6 @@ "integrity": "sha512-m/M1U1f3ddMCs6Hq2tAsYThTBDaAKFDX3dwDo97GEYzamXi9SqUpjWi/Rrj/gf3X2n8ktwgZrlP1z6E3v/IExQ==", "dev": true }, - "node_modules/lodash.get": { - "version": "4.4.2", - "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz", - "integrity": "sha512-z+Uw/vLuy6gQe8cfaFWD7p0wVv8fJl3mbzXh33RS+0oW2wvUqiRXiQ69gLWSLpgB5/6sU+r6BlQR0MBILadqTQ==", - "dev": true - }, - "node_modules/lodash.isequal": { - "version": "4.5.0", - "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz", - "integrity": "sha512-pDo3lu8Jhfjqls6GkMgpahsF9kCyayhgykjyLMNFTKWrpVdAQtYyB4muAMWozBB4ig/dtWAmsMxLEI8wuz+DYQ==", - "dev": true - }, "node_modules/lodash.merge": { "version": "4.6.2", "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz", @@ -15144,6 +14262,7 @@ "version": "1.4.0", "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==", + "dev": true, "dependencies": { "js-tokens": "^3.0.0 || ^4.0.0" }, @@ -15622,12 +14741,6 @@ "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==", "dev": true }, - "node_modules/muggle-string": { - "version": "0.3.1", - "resolved": "https://registry.npmjs.org/muggle-string/-/muggle-string-0.3.1.tgz", - "integrity": "sha512-ckmWDJjphvd/FvZawgygcUeQCxzvohjFO5RxTjj4eq8kw359gFF3E1brjfI+viLMxss5JrHTDRHZvu2/tuy0Qg==", - "dev": true - }, "node_modules/multimatch": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/multimatch/-/multimatch-5.0.0.tgz", @@ -19621,134 +18734,12 @@ "node": "^10 || ^12 || >=14" } }, - "node_modules/postcss-loader": { - "version": "7.3.3", - "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-7.3.3.tgz", - "integrity": "sha512-YgO/yhtevGO/vJePCQmTxiaEwER94LABZN0ZMT4A0vsak9TpO+RvKRs7EmJ8peIlB9xfXCsS7M8LjqncsUZ5HA==", - "dev": true, - "dependencies": { - "cosmiconfig": "^8.2.0", - "jiti": "^1.18.2", - "semver": "^7.3.8" - }, - "engines": { - "node": ">= 14.15.0" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/webpack" - }, - "peerDependencies": { - "postcss": "^7.0.0 || ^8.0.1", - "webpack": "^5.0.0" - } - }, - "node_modules/postcss-loader/node_modules/cosmiconfig": { - "version": "8.3.6", - "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-8.3.6.tgz", - "integrity": "sha512-kcZ6+W5QzcJ3P1Mt+83OUv/oHFqZHIx8DuxG6eZ5RGMERoLqp4BuGjhHLYGK+Kf5XVkQvqBSmAy/nGWN3qDgEA==", - "dev": true, - "dependencies": { - "import-fresh": "^3.3.0", - "js-yaml": "^4.1.0", - "parse-json": "^5.2.0", - "path-type": "^4.0.0" - }, - "engines": { - "node": ">=14" - }, - "funding": { - "url": "https://github.com/sponsors/d-fischer" - }, - "peerDependencies": { - "typescript": ">=4.9.5" - }, - "peerDependenciesMeta": { - "typescript": { - "optional": true - } - } - }, - "node_modules/postcss-loader/node_modules/semver": { - "version": "7.5.4", - "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz", - "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==", - "dev": true, - "dependencies": { - "lru-cache": "^6.0.0" - }, - "bin": { - "semver": "bin/semver.js" - }, - "engines": { - "node": ">=10" - } - }, "node_modules/postcss-media-query-parser": { "version": "0.2.3", "resolved": "https://registry.npmjs.org/postcss-media-query-parser/-/postcss-media-query-parser-0.2.3.tgz", "integrity": "sha512-3sOlxmbKcSHMjlUXQZKQ06jOswE7oVkXPxmZdoB1r5l0q6gTFTQSHxNxOrCccElbW7dxNytifNEo8qidX2Vsig==", "dev": true }, - "node_modules/postcss-modules-extract-imports": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.0.0.tgz", - "integrity": "sha512-bdHleFnP3kZ4NYDhuGlVK+CMrQ/pqUm8bx/oGL93K6gVwiclvX5x0n76fYMKuIGKzlABOy13zsvqjb0f92TEXw==", - "dev": true, - "engines": { - "node": "^10 || ^12 || >= 14" - }, - "peerDependencies": { - "postcss": "^8.1.0" - } - }, - "node_modules/postcss-modules-local-by-default": { - "version": "4.0.3", - "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-4.0.3.tgz", - "integrity": "sha512-2/u2zraspoACtrbFRnTijMiQtb4GW4BvatjaG/bCjYQo8kLTdevCUlwuBHx2sCnSyrI3x3qj4ZK1j5LQBgzmwA==", - "dev": true, - "dependencies": { - "icss-utils": "^5.0.0", - "postcss-selector-parser": "^6.0.2", - "postcss-value-parser": "^4.1.0" - }, - "engines": { - "node": "^10 || ^12 || >= 14" - }, - "peerDependencies": { - "postcss": "^8.1.0" - } - }, - "node_modules/postcss-modules-scope": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-3.0.0.tgz", - "integrity": "sha512-hncihwFA2yPath8oZ15PZqvWGkWf+XUfQgUGamS4LqoP1anQLOsOJw0vr7J7IwLpoY9fatA2qiGUGmuZL0Iqlg==", - "dev": true, - "dependencies": { - "postcss-selector-parser": "^6.0.4" - }, - "engines": { - "node": "^10 || ^12 || >= 14" - }, - "peerDependencies": { - "postcss": "^8.1.0" - } - }, - "node_modules/postcss-modules-values": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/postcss-modules-values/-/postcss-modules-values-4.0.0.tgz", - "integrity": "sha512-RDxHkAiEGI78gS2ofyvCsu7iycRv7oqw5xMWn9iMoR0N/7mf9D50ecQqUo5BZ9Zh2vH4bCUR/ktCqbB9m8vJjQ==", - "dev": true, - "dependencies": { - "icss-utils": "^5.0.0" - }, - "engines": { - "node": "^10 || ^12 || >= 14" - }, - "peerDependencies": { - "postcss": "^8.1.0" - } - }, "node_modules/postcss-resolve-nested-selector": { "version": "0.1.1", "resolved": "https://registry.npmjs.org/postcss-resolve-nested-selector/-/postcss-resolve-nested-selector-0.1.1.tgz", @@ -20482,6 +19473,7 @@ "version": "18.2.0", "resolved": "https://registry.npmjs.org/react/-/react-18.2.0.tgz", "integrity": "sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==", + "dev": true, "dependencies": { "loose-envify": "^1.1.0" }, @@ -20499,93 +19491,11 @@ "react-dom": ">=16.8.0" } }, - "node_modules/react-confetti": { - "version": "6.1.0", - "resolved": "https://registry.npmjs.org/react-confetti/-/react-confetti-6.1.0.tgz", - "integrity": "sha512-7Ypx4vz0+g8ECVxr88W9zhcQpbeujJAVqL14ZnXJ3I23mOI9/oBVTQ3dkJhUmB0D6XOtCZEM6N0Gm9PMngkORw==", - "dev": true, - "dependencies": { - "tween-functions": "^1.2.0" - }, - "engines": { - "node": ">=10.18" - }, - "peerDependencies": { - "react": "^16.3.0 || ^17.0.1 || ^18.0.0" - } - }, - "node_modules/react-docgen": { - "version": "6.0.4", - "resolved": "https://registry.npmjs.org/react-docgen/-/react-docgen-6.0.4.tgz", - "integrity": "sha512-gF+p+1ZwC2eO66bt763Tepmh5q9kDiFIrqW3YjUV/a+L96h0m5+/wSFQoOHL2cffyrPMZMxP03IgbggJ11QbOw==", - "dev": true, - "dependencies": { - "@babel/core": "^7.18.9", - "@babel/traverse": "^7.18.9", - "@babel/types": "^7.18.9", - "@types/babel__core": "^7.18.0", - "@types/babel__traverse": "^7.18.0", - "@types/doctrine": "^0.0.6", - "@types/resolve": "^1.20.2", - "doctrine": "^3.0.0", - "resolve": "^1.22.1", - "strip-indent": "^4.0.0" - }, - "engines": { - "node": ">=14.18.0" - } - }, - "node_modules/react-docgen-typescript": { - "version": "2.2.2", - "resolved": "https://registry.npmjs.org/react-docgen-typescript/-/react-docgen-typescript-2.2.2.tgz", - "integrity": "sha512-tvg2ZtOpOi6QDwsb3GZhOjDkkX0h8Z2gipvTg6OVMUyoYoURhEiRNePT8NZItTVCDh39JJHnLdfCOkzoLbFnTg==", - "dev": true, - "peerDependencies": { - "typescript": ">= 4.3.x" - } - }, - "node_modules/react-docgen/node_modules/@types/doctrine": { - "version": "0.0.6", - "resolved": "https://registry.npmjs.org/@types/doctrine/-/doctrine-0.0.6.tgz", - "integrity": "sha512-KlEqPtaNBHBJ2/fVA4yLdD0Tc8zw34pKU4K5SHBIEwtLJ8xxumIC1xeG+4S+/9qhVj2MqC7O3Ld8WvDG4HqlgA==", - "dev": true - }, - "node_modules/react-docgen/node_modules/resolve": { - "version": "1.22.8", - "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.8.tgz", - "integrity": "sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==", - "dev": true, - "dependencies": { - "is-core-module": "^2.13.0", - "path-parse": "^1.0.7", - "supports-preserve-symlinks-flag": "^1.0.0" - }, - "bin": { - "resolve": "bin/resolve" - }, - "funding": { - "url": "https://github.com/sponsors/ljharb" - } - }, - "node_modules/react-docgen/node_modules/strip-indent": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-4.0.0.tgz", - "integrity": "sha512-mnVSV2l+Zv6BLpSD/8V87CW/y9EmmbYzGCIavsnsI6/nwn26DwffM/yztm30Z/I2DY9wdS3vXVCMnHDgZaVNoA==", - "dev": true, - "dependencies": { - "min-indent": "^1.0.1" - }, - "engines": { - "node": ">=12" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, "node_modules/react-dom": { "version": "18.2.0", "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.2.0.tgz", "integrity": "sha512-6IMTriUmvsjHUjNtEDudZfuDQUoWXVxKHhlEGSk81n4YFS+r/Kl99wXiwlVXtPBtJenozv2P+hxDsw9eA7Xo6g==", + "dev": true, "dependencies": { "loose-envify": "^1.1.0", "scheduler": "^0.23.0" @@ -20594,27 +19504,6 @@ "react": "^18.2.0" } }, - "node_modules/react-element-to-jsx-string": { - "version": "15.0.0", - "resolved": "https://registry.npmjs.org/react-element-to-jsx-string/-/react-element-to-jsx-string-15.0.0.tgz", - "integrity": "sha512-UDg4lXB6BzlobN60P8fHWVPX3Kyw8ORrTeBtClmIlGdkOOE+GYQSFvmEU5iLLpwp/6v42DINwNcwOhOLfQ//FQ==", - "dev": true, - "dependencies": { - "@base2/pretty-print-object": "1.0.1", - "is-plain-object": "5.0.0", - "react-is": "18.1.0" - }, - "peerDependencies": { - "react": "^0.14.8 || ^15.0.1 || ^16.0.0 || ^17.0.1 || ^18.0.0", - "react-dom": "^0.14.8 || ^15.0.1 || ^16.0.0 || ^17.0.1 || ^18.0.0" - } - }, - "node_modules/react-element-to-jsx-string/node_modules/react-is": { - "version": "18.1.0", - "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.1.0.tgz", - "integrity": "sha512-Fl7FuabXsJnV5Q1qIOQwx/sagGF18kogb4gpfcG4gjLBWO0WDiiz1ko/ExayuxE7InyQkBLkxRFG5oxY6Uu3Kg==", - "dev": true - }, "node_modules/react-inspector": { "version": "6.0.2", "resolved": "https://registry.npmjs.org/react-inspector/-/react-inspector-6.0.2.tgz", @@ -20630,15 +19519,6 @@ "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==", "dev": true }, - "node_modules/react-refresh": { - "version": "0.14.0", - "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.14.0.tgz", - "integrity": "sha512-wViHqhAd8OHeLS/IRMJjTSDHF3U9eWi62F/MledQGPdJGDhodXJ9PBLNGr6WWL7qlH12Mt3TyTpbS+hGXMjCzQ==", - "dev": true, - "engines": { - "node": ">=0.10.0" - } - }, "node_modules/react-remove-scroll": { "version": "2.5.5", "resolved": "https://registry.npmjs.org/react-remove-scroll/-/react-remove-scroll-2.5.5.tgz", @@ -21452,6 +20332,7 @@ "version": "0.23.0", "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.0.tgz", "integrity": "sha512-CtuThmgHNg7zIZWAXi3AsyIzA3n4xx7aNyjwC2VJldO2LMVDhFK+63xGqq6CsJH4rTAt6/M+N4GhZiDYPx9eUw==", + "dev": true, "dependencies": { "loose-envify": "^1.1.0" } @@ -21999,15 +20880,6 @@ } ] }, - "node_modules/string-argv": { - "version": "0.3.2", - "resolved": "https://registry.npmjs.org/string-argv/-/string-argv-0.3.2.tgz", - "integrity": "sha512-aqD2Q0144Z+/RqG52NeHEkZauTAUWJO8c6yTftGJKO3Tja5tUgIfmIl6kExvhtxSDP7fXB6DvzkfMpCd/F3G+Q==", - "dev": true, - "engines": { - "node": ">=0.6.19" - } - }, "node_modules/string-length": { "version": "4.0.2", "resolved": "https://registry.npmjs.org/string-length/-/string-length-4.0.2.tgz", @@ -22804,12 +21676,6 @@ "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==", "dev": true }, - "node_modules/tween-functions": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/tween-functions/-/tween-functions-1.2.0.tgz", - "integrity": "sha512-PZBtLYcCLtEcjL14Fzb1gSxPBeL7nWvGhO5ZFPGqziCcr8uvHp0NDmdjBchp6KHL+tExcg0m3NISmKxhU394dA==", - "dev": true - }, "node_modules/type-check": { "version": "0.4.0", "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz", @@ -23342,15 +22208,6 @@ "spdx-expression-parse": "^3.0.0" } }, - "node_modules/validator": { - "version": "13.11.0", - "resolved": "https://registry.npmjs.org/validator/-/validator-13.11.0.tgz", - "integrity": "sha512-Ii+sehpSfZy+At5nPdnyMhx78fEoPDkR2XW/zimHEL3MyGJQOCQ7WeP20jPYRz7ZCpcKLB21NxuXHF3bxjStBQ==", - "dev": true, - "engines": { - "node": ">= 0.10" - } - }, "node_modules/vary": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz", @@ -23415,32 +22272,6 @@ } } }, - "node_modules/vite-plugin-dts": { - "version": "3.6.1", - "resolved": "https://registry.npmjs.org/vite-plugin-dts/-/vite-plugin-dts-3.6.1.tgz", - "integrity": "sha512-Juy5qsDVxag9p0seSjkcdXnAkTfI9WtYcP9ccJbxZlavtK5nGY17ViqjuKpj0+qk+003PPcC6j/CIV/KIorlAg==", - "dev": true, - "dependencies": { - "@microsoft/api-extractor": "^7.38.0", - "@rollup/pluginutils": "^5.0.5", - "@vue/language-core": "^1.8.20", - "debug": "^4.3.4", - "kolorist": "^1.8.0", - "vue-tsc": "^1.8.20" - }, - "engines": { - "node": "^14.18.0 || >=16.0.0" - }, - "peerDependencies": { - "typescript": "*", - "vite": "*" - }, - "peerDependenciesMeta": { - "vite": { - "optional": true - } - } - }, "node_modules/vite-plugin-static-copy": { "version": "0.14.0", "resolved": "https://registry.npmjs.org/vite-plugin-static-copy/-/vite-plugin-static-copy-0.14.0.tgz", @@ -23468,48 +22299,6 @@ "node": ">=0.10.0" } }, - "node_modules/vue-template-compiler": { - "version": "2.7.15", - "resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.7.15.tgz", - "integrity": "sha512-yQxjxMptBL7UAog00O8sANud99C6wJF+7kgbcwqkvA38vCGF7HWE66w0ZFnS/kX5gSoJr/PQ4/oS3Ne2pW37Og==", - "dev": true, - "dependencies": { - "de-indent": "^1.0.2", - "he": "^1.2.0" - } - }, - "node_modules/vue-tsc": { - "version": "1.8.22", - "resolved": "https://registry.npmjs.org/vue-tsc/-/vue-tsc-1.8.22.tgz", - "integrity": "sha512-j9P4kHtW6eEE08aS5McFZE/ivmipXy0JzrnTgbomfABMaVKx37kNBw//irL3+LlE3kOo63XpnRigyPC3w7+z+A==", - "dev": true, - "dependencies": { - "@volar/typescript": "~1.10.5", - "@vue/language-core": "1.8.22", - "semver": "^7.5.4" - }, - "bin": { - "vue-tsc": "bin/vue-tsc.js" - }, - "peerDependencies": { - "typescript": "*" - } - }, - "node_modules/vue-tsc/node_modules/semver": { - "version": "7.5.4", - "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz", - "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==", - "dev": true, - "dependencies": { - "lru-cache": "^6.0.0" - }, - "bin": { - "semver": "bin/semver.js" - }, - "engines": { - "node": ">=10" - } - }, "node_modules/w3c-hr-time": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/w3c-hr-time/-/w3c-hr-time-1.0.2.tgz", @@ -23563,10 +22352,6 @@ "defaults": "^1.0.3" } }, - "node_modules/web-components": { - "resolved": "packages/web-components", - "link": true - }, "node_modules/webidl-conversions": { "version": "6.1.0", "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-6.1.0.tgz", @@ -23901,60 +22686,15 @@ "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/z-schema": { - "version": "5.0.5", - "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-5.0.5.tgz", - "integrity": "sha512-D7eujBWkLa3p2sIpJA0d1pr7es+a7m0vFAnZLlCEKq/Ij2k0MLi9Br2UPxoxdYystm5K1yeBGzub0FlYUEWj2Q==", - "dev": true, - "dependencies": { - "lodash.get": "^4.4.2", - "lodash.isequal": "^4.5.0", - "validator": "^13.7.0" - }, - "bin": { - "z-schema": "bin/z-schema" - }, - "engines": { - "node": ">=8.0.0" - }, - "optionalDependencies": { - "commander": "^9.4.1" - } - }, - "node_modules/z-schema/node_modules/commander": { - "version": "9.5.0", - "resolved": "https://registry.npmjs.org/commander/-/commander-9.5.0.tgz", - "integrity": "sha512-KRs7WVDKg86PWiuAqhDrAQnTXZKraVcCc6vFdL14qrZ/DcWwuRo7VoiYXalXO7S5GKpqYiVEwCbgFDfxNHKJBQ==", - "dev": true, - "optional": true, - "engines": { - "node": "^12.20.0 || >=14" - } - }, "packages/react-components": { "name": "@cbpds/react-components", "version": "0.1.0", - "dependencies": { - "react": "^18.2.0", - "react-dom": "^18.2.0" - }, + "license": "ISC", "devDependencies": { - "@storybook/addon-essentials": "^7.2.0", - "@storybook/addon-interactions": "^7.2.0", - "@storybook/addon-links": "^7.2.0", - "@storybook/addon-onboarding": "^1.0.8", - "@storybook/addon-styling": "^1.3.5", - "@storybook/blocks": "^7.2.0", - "@storybook/react": "^7.2.0", - "@storybook/react-vite": "^7.2.0", - "@storybook/testing-library": "^0.2.0", - "@types/react": "^18.2.15", - "@types/react-dom": "^18.2.7", - "@vitejs/plugin-react": "^4.0.3", - "storybook": "^7.2.0", - "typescript": "^5.2.2", - "vite": "^4.4.5", - "vite-plugin-dts": "^3.6.0" + "@types/react": "^18.2.37", + "react": "^18.2.0", + "react-dom": "^18.2.0", + "typescript": "^5.2.2" } }, "packages/ux-guidelines": { @@ -23996,6 +22736,7 @@ } }, "packages/web-components": { + "name": "@cbpds/web-components", "version": "0.0.1", "license": "MIT", "dependencies": { @@ -24003,6 +22744,7 @@ "npm": "^10.2.1" }, "devDependencies": { + "@stencil/react-output-target": "^0.5.3", "@stencil/sass": "^3.0.7", "@storybook/addon-essentials": "^7.5.1", "@storybook/addon-interactions": "^7.5.1", @@ -24020,6 +22762,24 @@ "react-dom": "^18.2.0", "storybook": "^7.5.1" } + }, + "packages/web-components-react": { + "name": "@cbpds/react-components", + "version": "0.1.0", + "extraneous": true, + "license": "ISC", + "devDependencies": { + "@types/react": "^18.2.37", + "react": "^18.2.0", + "react-dom": "^18.2.0", + "typescript": "^5.2.2" + } + }, + "packages/web-components/node_modules/@types/node": { + "version": "16.18.61", + "resolved": "https://registry.npmjs.org/@types/node/-/node-16.18.61.tgz", + "integrity": "sha512-k0N7BqGhJoJzdh6MuQg1V1ragJiXTh8VUBAZTWjJ9cUq23SG0F0xavOwZbhiP4J3y20xd6jxKx+xNUhkMAi76Q==", + "dev": true } } } diff --git a/package.json b/package.json index e1760bee..cb395f98 100644 --- a/package.json +++ b/package.json @@ -1,5 +1,5 @@ { - "name": "design-system", + "name": "cbp-design-system", "version": "1.0.0", "description": "A design system for the U.S. Customs & Border Protection that provides components, patterns and guidelines to create consistent and cohesive user interfaces.", "main": "index.js", @@ -12,7 +12,6 @@ "vanilla-sb": "npm run storybook -w packages/vanilla", "ux-dev": "npm run dev -w packages/ux-guidelines", "ux-build": "npm run build -w packages/ux-guidelines", - "react-sb": "npm run storybook -w packages/react-components", "react-build": "npm run build -w packages/react-components", "stencil-build": "npm run build -w packages/web-components", "stencil-start": "npm run start -w packages/web-components", @@ -43,10 +42,11 @@ "workspaces": [ "packages/vanilla", "packages/ux-guidelines", - "packages/react-components", - "packages/web-components" + "packages/web-components", + "packages/react-components" ], "devDependencies": { + "@types/node": "^20.9.0", "eslint": "^8.33.0", "eslint-config-prettier": "^8.6.0", "eslint-plugin-react": "^7.33.2", @@ -57,7 +57,8 @@ "stylelint": "^14.16.1", "stylelint-config-prettier": "^9.0.4", "stylelint-config-recommended": "^9.0.0", - "stylelint-scss": "^4.3.0" + "stylelint-scss": "^4.3.0", + "typescript": "^5.2.2" }, "eslintConfig": { "env": { @@ -76,15 +77,23 @@ "plugin:react-hooks/recommended", "plugin:react/jsx-runtime" ], - "ignorePatterns": ["dist"], + "ignorePatterns": [ + "dist" + ], "parserOptions": { "ecmaVersion": "latest", "sourceType": "module" - }, + }, "overrides": [], "rules": { - "semi": ["error", "always"], - "quotes": ["error", "single"], + "semi": [ + "error", + "always" + ], + "quotes": [ + "error", + "single" + ], "react-refresh/only-export-components": "warn" } }, diff --git a/packages/react-components/.gitignore b/packages/react-components/.gitignore deleted file mode 100644 index a547bf36..00000000 --- a/packages/react-components/.gitignore +++ /dev/null @@ -1,24 +0,0 @@ -# Logs -logs -*.log -npm-debug.log* -yarn-debug.log* -yarn-error.log* -pnpm-debug.log* -lerna-debug.log* - -node_modules -dist -dist-ssr -*.local - -# Editor directories and files -.vscode/* -!.vscode/extensions.json -.idea -.DS_Store -*.suo -*.ntvs* -*.njsproj -*.sln -*.sw? diff --git a/packages/react-components/.storybook/main.js b/packages/react-components/.storybook/main.js deleted file mode 100644 index 28ec034b..00000000 --- a/packages/react-components/.storybook/main.js +++ /dev/null @@ -1,40 +0,0 @@ -import { join, dirname } from 'path'; - -/** - * This function is used to resolve the absolute path of a package. - * It is needed in projects that use Yarn PnP or are set up within a monorepo. - */ -function getAbsolutePath(value) { - return dirname(require.resolve(join(value, 'package.json'))); -} - -/** @type { import('@storybook/react-vite').StorybookConfig } */ -const config = { - stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'], - addons: [ - getAbsolutePath('@storybook/addon-links'), - { - name: '@storybook/addon-essentials', - options: { - backgrounds: false, - measure: false, - outline: false, - }, - }, - getAbsolutePath('@storybook/addon-onboarding'), - getAbsolutePath('@storybook/addon-interactions'), - getAbsolutePath('@storybook/addon-styling'), - ], - framework: { - name: getAbsolutePath('@storybook/react-vite'), - options: {}, - }, - staticDirs: ['../assets'], - docs: { - autodocs: false, - }, - core: { - disableTelemetry: true, // 👈 Disables telemetry - } -}; -export default config; diff --git a/packages/react-components/.storybook/manager.js b/packages/react-components/.storybook/manager.js deleted file mode 100644 index 65693948..00000000 --- a/packages/react-components/.storybook/manager.js +++ /dev/null @@ -1,19 +0,0 @@ -import { addons } from '@storybook/addons'; -import { create } from '@storybook/theming' - -import cbpLogo from '@cbpds/vanilla/dist/assets/images/CBP_SEAL.svg' - -const theme = create({ - base: 'light', - // Brand assets - brandTitle: 'CBP Design System | React', - brandImage: cbpLogo, - brandTarget: '_self', -}); - -addons.setConfig({ - theme, - toolbar: { - zoom: { hidden: true }, - }, -}); \ No newline at end of file diff --git a/packages/react-components/.storybook/preview.js b/packages/react-components/.storybook/preview.js deleted file mode 100644 index 2fcb72b2..00000000 --- a/packages/react-components/.storybook/preview.js +++ /dev/null @@ -1,70 +0,0 @@ -import { withThemeByDataAttribute } from '@storybook/addon-styling'; - -import '@cbpds/vanilla/dist/style.css'; - -const CUSTOM_VIEWPORTS = { - mobile: { - name: 'Mobile', - styles: { - width: '360px', - height: '100%', - }, - type: 'desktop', - }, - medium: { - name: 'Medium Breakpoint', - styles: { - width: '600px', - height: '100%', - }, - type: 'desktop', - }, - large: { - name: 'Large Breakpoint', - styles: { - width: '1024px', - height: '100%', - }, - type: 'desktop', - }, - xl: { - name: 'Extra-Large Breakpoint', - styles: { - width: '1440px', - height: '100%', - }, - type: 'desktop', - }, -}; - -/** @type { import('@storybook/react').Preview } */ -export const preview = { - parameters: { - actions: { argTypesRegex: '^on[A-Z].*' }, - controls: { - matchers: { - color: /(background|color)$/i, - date: /Date$/, - }, - }, - backgrounds: { - grid: { - disable: true, - }, - }, - viewport: { - viewports: CUSTOM_VIEWPORTS - } - }, -}; - -export const decorators = [ - withThemeByDataAttribute({ - themes: { - light: 'light', - dark: 'dark', - }, - defaultTheme: 'light', - attributeName: 'data-cbp-theme', - }), -]; diff --git a/packages/react-components/LICENSE b/packages/react-components/LICENSE deleted file mode 100644 index 72ecf6ba..00000000 --- a/packages/react-components/LICENSE +++ /dev/null @@ -1,32 +0,0 @@ -As a work of the United States Government, this project is in the -public domain within the United States. - -Additionally, we waive copyright and related rights in the work -worldwide through the CC0 1.0 Universal public domain dedication. - -## CC0 1.0 Universal Summary - -This is a human-readable summary of the -[Legal Code (read the full text)](https://creativecommons.org/publicdomain/zero/1.0/legalcode). - -### No Copyright - -The person who associated a work with this deed has dedicated the work to -the public domain by waiving all of his or her rights to the work worldwide -under copyright law, including all related and neighboring rights, to the -extent allowed by law. - -You can copy, modify, distribute and perform the work, even for commercial -purposes, all without asking permission. - -### Other Information - -In no way are the patent or trademark rights of any person affected by CC0, -nor are the rights that other persons may have in the work or in how the -work is used, such as publicity or privacy rights. - -Unless expressly stated otherwise, the person who associated a work with -this deed makes no warranties about the work, and disclaims liability for -all uses of the work, to the fullest extent permitted by applicable law. -When using or citing the work, you should not imply endorsement by the -author or the affirmer. diff --git a/packages/react-components/README.md b/packages/react-components/README.md deleted file mode 100644 index 23290845..00000000 --- a/packages/react-components/README.md +++ /dev/null @@ -1,18 +0,0 @@ -# @cbpds/react-components - -[![License: CC0-1.0](https://img.shields.io/badge/License-CC0_1.0-lightgrey.svg)](/LICENSE) - -> React components library for the U.S. Customs & Border Protection - -## Contributing - -We welcome contributions, please see our [Contribution Policy](https://github.com/US-CBP/open-source-policy/blob/master/CONTRIBUTING.md) - -Read and follow the steps in the [Project Setup Wiki](https://github.com/US-CBP/design-system/wiki/Project-Setup) to fork the repo and start contributing! - -
- React Vite Information - - - [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh - - [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh -
\ No newline at end of file diff --git a/packages/react-components/assets/react-icon.svg b/packages/react-components/assets/react-icon.svg deleted file mode 100644 index ea77a618..00000000 --- a/packages/react-components/assets/react-icon.svg +++ /dev/null @@ -1,9 +0,0 @@ - - React Logo - - - - - - - diff --git a/packages/react-components/components/stencil-generated/index.ts b/packages/react-components/components/stencil-generated/index.ts new file mode 100644 index 00000000..2059c42c --- /dev/null +++ b/packages/react-components/components/stencil-generated/index.ts @@ -0,0 +1,12 @@ +/* eslint-disable */ +/* tslint:disable */ +/* auto-generated react proxies */ +import { createReactComponent } from './react-component-lib'; + +import type { JSX } from '@cbpds/web-components'; + + + +export const CbpApp = /*@__PURE__*/createReactComponent('cbp-app'); +export const CbpButton = /*@__PURE__*/createReactComponent('cbp-button'); +export const CbpCard = /*@__PURE__*/createReactComponent('cbp-card'); diff --git a/packages/react-components/components/stencil-generated/react-component-lib/createComponent.tsx b/packages/react-components/components/stencil-generated/react-component-lib/createComponent.tsx new file mode 100644 index 00000000..7c7415a2 --- /dev/null +++ b/packages/react-components/components/stencil-generated/react-component-lib/createComponent.tsx @@ -0,0 +1,106 @@ +import React, { createElement } from 'react'; + +import { attachProps, camelToDashCase, createForwardRef, dashToPascalCase, isCoveredByReact, mergeRefs } from './utils'; + +export interface HTMLStencilElement extends HTMLElement { + componentOnReady(): Promise; +} + +interface StencilReactInternalProps extends React.HTMLAttributes { + forwardedRef: React.RefObject; + ref?: React.Ref; +} + +export const createReactComponent = < + PropType, + ElementType extends HTMLStencilElement, + ContextStateType = {}, + ExpandedPropsTypes = {} +>( + tagName: string, + ReactComponentContext?: React.Context, + manipulatePropsFunction?: ( + originalProps: StencilReactInternalProps, + propsToPass: any + ) => ExpandedPropsTypes, + defineCustomElement?: () => void +) => { + if (defineCustomElement !== undefined) { + defineCustomElement(); + } + + const displayName = dashToPascalCase(tagName); + const ReactComponent = class extends React.Component> { + componentEl!: ElementType; + + setComponentElRef = (element: ElementType) => { + this.componentEl = element; + }; + + constructor(props: StencilReactInternalProps) { + super(props); + } + + componentDidMount() { + this.componentDidUpdate(this.props); + } + + componentDidUpdate(prevProps: StencilReactInternalProps) { + attachProps(this.componentEl, this.props, prevProps); + } + + render() { + const { children, forwardedRef, style, className, ref, ...cProps } = this.props; + + let propsToPass = Object.keys(cProps).reduce((acc: any, name) => { + const value = (cProps as any)[name]; + + if (name.indexOf('on') === 0 && name[2] === name[2].toUpperCase()) { + const eventName = name.substring(2).toLowerCase(); + if (typeof document !== 'undefined' && isCoveredByReact(eventName)) { + acc[name] = value; + } + } else { + // we should only render strings, booleans, and numbers as attrs in html. + // objects, functions, arrays etc get synced via properties on mount. + const type = typeof value; + + if (type === 'string' || type === 'boolean' || type === 'number') { + acc[camelToDashCase(name)] = value; + } + } + return acc; + }, {} as ExpandedPropsTypes); + + if (manipulatePropsFunction) { + propsToPass = manipulatePropsFunction(this.props, propsToPass); + } + + const newProps: Omit, 'forwardedRef'> = { + ...propsToPass, + ref: mergeRefs(forwardedRef, this.setComponentElRef), + style, + }; + + /** + * We use createElement here instead of + * React.createElement to work around a + * bug in Vite (https://github.com/vitejs/vite/issues/6104). + * React.createElement causes all elements to be rendered + * as instead of the actual Web Component. + */ + return createElement(tagName, newProps, children); + } + + static get displayName() { + return displayName; + } + }; + + // If context was passed to createReactComponent then conditionally add it to the Component Class + if (ReactComponentContext) { + ReactComponent.contextType = ReactComponentContext; + } + + return createForwardRef(ReactComponent, displayName); +}; diff --git a/packages/react-components/components/stencil-generated/react-component-lib/createOverlayComponent.tsx b/packages/react-components/components/stencil-generated/react-component-lib/createOverlayComponent.tsx new file mode 100644 index 00000000..288c38dd --- /dev/null +++ b/packages/react-components/components/stencil-generated/react-component-lib/createOverlayComponent.tsx @@ -0,0 +1,142 @@ +import React from 'react'; +import ReactDOM from 'react-dom'; + +import { OverlayEventDetail } from './interfaces'; +import { StencilReactForwardedRef, attachProps, dashToPascalCase, defineCustomElement, setRef } from './utils'; + +interface OverlayElement extends HTMLElement { + present: () => Promise; + dismiss: (data?: any, role?: string | undefined) => Promise; +} + +export interface ReactOverlayProps { + children?: React.ReactNode; + isOpen: boolean; + onDidDismiss?: (event: CustomEvent) => void; + onDidPresent?: (event: CustomEvent) => void; + onWillDismiss?: (event: CustomEvent) => void; + onWillPresent?: (event: CustomEvent) => void; +} + +export const createOverlayComponent = ( + tagName: string, + controller: { create: (options: any) => Promise }, + customElement?: any +) => { + defineCustomElement(tagName, customElement); + + const displayName = dashToPascalCase(tagName); + const didDismissEventName = `on${displayName}DidDismiss`; + const didPresentEventName = `on${displayName}DidPresent`; + const willDismissEventName = `on${displayName}WillDismiss`; + const willPresentEventName = `on${displayName}WillPresent`; + + type Props = OverlayComponent & + ReactOverlayProps & { + forwardedRef?: StencilReactForwardedRef; + }; + + let isDismissing = false; + + class Overlay extends React.Component { + overlay?: OverlayType; + el!: HTMLDivElement; + + constructor(props: Props) { + super(props); + if (typeof document !== 'undefined') { + this.el = document.createElement('div'); + } + this.handleDismiss = this.handleDismiss.bind(this); + } + + static get displayName() { + return displayName; + } + + componentDidMount() { + if (this.props.isOpen) { + this.present(); + } + } + + componentWillUnmount() { + if (this.overlay) { + this.overlay.dismiss(); + } + } + + handleDismiss(event: CustomEvent>) { + if (this.props.onDidDismiss) { + this.props.onDidDismiss(event); + } + setRef(this.props.forwardedRef, null); + } + + shouldComponentUpdate(nextProps: Props) { + // Check if the overlay component is about to dismiss + if (this.overlay && nextProps.isOpen !== this.props.isOpen && nextProps.isOpen === false) { + isDismissing = true; + } + + return true; + } + + async componentDidUpdate(prevProps: Props) { + if (this.overlay) { + attachProps(this.overlay, this.props, prevProps); + } + + if (prevProps.isOpen !== this.props.isOpen && this.props.isOpen === true) { + this.present(prevProps); + } + if (this.overlay && prevProps.isOpen !== this.props.isOpen && this.props.isOpen === false) { + await this.overlay.dismiss(); + isDismissing = false; + + /** + * Now that the overlay is dismissed + * we need to render again so that any + * inner components will be unmounted + */ + this.forceUpdate(); + } + } + + async present(prevProps?: Props) { + const { children, isOpen, onDidDismiss, onDidPresent, onWillDismiss, onWillPresent, ...cProps } = this.props; + const elementProps = { + ...cProps, + ref: this.props.forwardedRef, + [didDismissEventName]: this.handleDismiss, + [didPresentEventName]: (e: CustomEvent) => this.props.onDidPresent && this.props.onDidPresent(e), + [willDismissEventName]: (e: CustomEvent) => this.props.onWillDismiss && this.props.onWillDismiss(e), + [willPresentEventName]: (e: CustomEvent) => this.props.onWillPresent && this.props.onWillPresent(e), + }; + + this.overlay = await controller.create({ + ...elementProps, + component: this.el, + componentProps: {}, + }); + + setRef(this.props.forwardedRef, this.overlay); + attachProps(this.overlay, elementProps, prevProps); + + await this.overlay.present(); + } + + render() { + /** + * Continue to render the component even when + * overlay is dismissing otherwise component + * will be hidden before animation is done. + */ + return ReactDOM.createPortal(this.props.isOpen || isDismissing ? this.props.children : null, this.el); + } + } + + return React.forwardRef((props, ref) => { + return ; + }); +}; diff --git a/packages/react-components/components/stencil-generated/react-component-lib/index.ts b/packages/react-components/components/stencil-generated/react-component-lib/index.ts new file mode 100644 index 00000000..85e81ad1 --- /dev/null +++ b/packages/react-components/components/stencil-generated/react-component-lib/index.ts @@ -0,0 +1,2 @@ +export { createReactComponent } from './createComponent'; +export { createOverlayComponent } from './createOverlayComponent'; diff --git a/packages/react-components/components/stencil-generated/react-component-lib/interfaces.ts b/packages/react-components/components/stencil-generated/react-component-lib/interfaces.ts new file mode 100644 index 00000000..92e5389c --- /dev/null +++ b/packages/react-components/components/stencil-generated/react-component-lib/interfaces.ts @@ -0,0 +1,34 @@ +// General types important to applications using stencil built components +export interface EventEmitter { + emit: (data?: T) => CustomEvent; +} + +export interface StyleReactProps { + class?: string; + className?: string; + style?: { [key: string]: any }; +} + +export interface OverlayEventDetail { + data?: T; + role?: string; +} + +export interface OverlayInterface { + el: HTMLElement; + animated: boolean; + keyboardClose: boolean; + overlayIndex: number; + presented: boolean; + + enterAnimation?: any; + leaveAnimation?: any; + + didPresent: EventEmitter; + willPresent: EventEmitter; + willDismiss: EventEmitter; + didDismiss: EventEmitter; + + present(): Promise; + dismiss(data?: any, role?: string): Promise; +} diff --git a/packages/react-components/components/stencil-generated/react-component-lib/utils/attachProps.ts b/packages/react-components/components/stencil-generated/react-component-lib/utils/attachProps.ts new file mode 100644 index 00000000..9a1825f5 --- /dev/null +++ b/packages/react-components/components/stencil-generated/react-component-lib/utils/attachProps.ts @@ -0,0 +1,125 @@ +import { camelToDashCase } from './case'; + +export const attachProps = (node: HTMLElement, newProps: any, oldProps: any = {}) => { + // some test frameworks don't render DOM elements, so we test here to make sure we are dealing with DOM first + if (node instanceof Element) { + // add any classes in className to the class list + const className = getClassName(node.classList, newProps, oldProps); + if (className !== '') { + node.className = className; + } + + Object.keys(newProps).forEach((name) => { + if ( + name === 'children' || + name === 'style' || + name === 'ref' || + name === 'class' || + name === 'className' || + name === 'forwardedRef' + ) { + return; + } + if (name.indexOf('on') === 0 && name[2] === name[2].toUpperCase()) { + const eventName = name.substring(2); + const eventNameLc = eventName[0].toLowerCase() + eventName.substring(1); + + if (!isCoveredByReact(eventNameLc)) { + syncEvent(node, eventNameLc, newProps[name]); + } + } else { + (node as any)[name] = newProps[name]; + const propType = typeof newProps[name]; + if (propType === 'string') { + node.setAttribute(camelToDashCase(name), newProps[name]); + } + } + }); + } +}; + +export const getClassName = (classList: DOMTokenList, newProps: any, oldProps: any) => { + const newClassProp: string = newProps.className || newProps.class; + const oldClassProp: string = oldProps.className || oldProps.class; + // map the classes to Maps for performance + const currentClasses = arrayToMap(classList); + const incomingPropClasses = arrayToMap(newClassProp ? newClassProp.split(' ') : []); + const oldPropClasses = arrayToMap(oldClassProp ? oldClassProp.split(' ') : []); + const finalClassNames: string[] = []; + // loop through each of the current classes on the component + // to see if it should be a part of the classNames added + currentClasses.forEach((currentClass) => { + if (incomingPropClasses.has(currentClass)) { + // add it as its already included in classnames coming in from newProps + finalClassNames.push(currentClass); + incomingPropClasses.delete(currentClass); + } else if (!oldPropClasses.has(currentClass)) { + // add it as it has NOT been removed by user + finalClassNames.push(currentClass); + } + }); + incomingPropClasses.forEach((s) => finalClassNames.push(s)); + return finalClassNames.join(' '); +}; + +/** + * Transforms a React event name to a browser event name. + */ +export const transformReactEventName = (eventNameSuffix: string) => { + switch (eventNameSuffix) { + case 'doubleclick': + return 'dblclick'; + } + return eventNameSuffix; +}; + +/** + * Checks if an event is supported in the current execution environment. + * @license Modernizr 3.0.0pre (Custom Build) | MIT + */ +export const isCoveredByReact = (eventNameSuffix: string) => { + if (typeof document === 'undefined') { + return true; + } else { + const eventName = 'on' + transformReactEventName(eventNameSuffix); + let isSupported = eventName in document; + + if (!isSupported) { + const element = document.createElement('div'); + element.setAttribute(eventName, 'return;'); + isSupported = typeof (element as any)[eventName] === 'function'; + } + + return isSupported; + } +}; + +export const syncEvent = ( + node: Element & { __events?: { [key: string]: ((e: Event) => any) | undefined } }, + eventName: string, + newEventHandler?: (e: Event) => any +) => { + const eventStore = node.__events || (node.__events = {}); + const oldEventHandler = eventStore[eventName]; + + // Remove old listener so they don't double up. + if (oldEventHandler) { + node.removeEventListener(eventName, oldEventHandler); + } + + // Bind new listener. + node.addEventListener( + eventName, + (eventStore[eventName] = function handler(e: Event) { + if (newEventHandler) { + newEventHandler.call(this, e); + } + }) + ); +}; + +const arrayToMap = (arr: string[] | DOMTokenList) => { + const map = new Map(); + (arr as string[]).forEach((s: string) => map.set(s, s)); + return map; +}; diff --git a/packages/react-components/components/stencil-generated/react-component-lib/utils/case.ts b/packages/react-components/components/stencil-generated/react-component-lib/utils/case.ts new file mode 100644 index 00000000..786689dc --- /dev/null +++ b/packages/react-components/components/stencil-generated/react-component-lib/utils/case.ts @@ -0,0 +1,7 @@ +export const dashToPascalCase = (str: string) => + str + .toLowerCase() + .split('-') + .map((segment) => segment.charAt(0).toUpperCase() + segment.slice(1)) + .join(''); +export const camelToDashCase = (str: string) => str.replace(/([A-Z])/g, (m: string) => `-${m[0].toLowerCase()}`); diff --git a/packages/react-components/components/stencil-generated/react-component-lib/utils/dev.ts b/packages/react-components/components/stencil-generated/react-component-lib/utils/dev.ts new file mode 100644 index 00000000..cc6f9ed0 --- /dev/null +++ b/packages/react-components/components/stencil-generated/react-component-lib/utils/dev.ts @@ -0,0 +1,14 @@ +export const isDevMode = () => { + return process && process.env && process.env.NODE_ENV === 'development'; +}; + +const warnings: { [key: string]: boolean } = {}; + +export const deprecationWarning = (key: string, message: string) => { + if (isDevMode()) { + if (!warnings[key]) { + console.warn(message); + warnings[key] = true; + } + } +}; diff --git a/packages/react-components/components/stencil-generated/react-component-lib/utils/index.tsx b/packages/react-components/components/stencil-generated/react-component-lib/utils/index.tsx new file mode 100644 index 00000000..a66bd02d --- /dev/null +++ b/packages/react-components/components/stencil-generated/react-component-lib/utils/index.tsx @@ -0,0 +1,50 @@ +import React from 'react'; + +import type { StyleReactProps } from '../interfaces'; + +export type StencilReactExternalProps = PropType & + Omit, 'style'> & + StyleReactProps; + +// This will be replaced with React.ForwardedRef when react-output-target is upgraded to React v17 +export type StencilReactForwardedRef = ((instance: T | null) => void) | React.MutableRefObject | null; + +export const setRef = (ref: StencilReactForwardedRef | React.Ref | undefined, value: any) => { + if (typeof ref === 'function') { + ref(value); + } else if (ref != null) { + // Cast as a MutableRef so we can assign current + (ref as React.MutableRefObject).current = value; + } +}; + +export const mergeRefs = ( + ...refs: (StencilReactForwardedRef | React.Ref | undefined)[] +): React.RefCallback => { + return (value: any) => { + refs.forEach((ref) => { + setRef(ref, value); + }); + }; +}; + +export const createForwardRef = (ReactComponent: any, displayName: string) => { + const forwardRef = ( + props: StencilReactExternalProps, + ref: StencilReactForwardedRef + ) => { + return ; + }; + forwardRef.displayName = displayName; + + return React.forwardRef(forwardRef); +}; + +export const defineCustomElement = (tagName: string, customElement: any) => { + if (customElement !== undefined && typeof customElements !== 'undefined' && !customElements.get(tagName)) { + customElements.define(tagName, customElement); + } +}; + +export * from './attachProps'; +export * from './case'; diff --git a/packages/react-components/lib/index.ts b/packages/react-components/lib/index.ts new file mode 100644 index 00000000..363a8884 --- /dev/null +++ b/packages/react-components/lib/index.ts @@ -0,0 +1,2 @@ +export * from "../components/stencil-generated"; +export { defineCustomElements } from "@cbpds/web-components/dist/loader"; \ No newline at end of file diff --git a/packages/react-components/package.json b/packages/react-components/package.json index 5dd199b6..87dec05f 100644 --- a/packages/react-components/package.json +++ b/packages/react-components/package.json @@ -1,52 +1,25 @@ { "name": "@cbpds/react-components", "version": "0.1.0", - "type": "module", - "files": [ - "dist" - ], - "main": "./dist/index.umd.cjs", - "module": "./dist/index.js", - "exports": { - ".": { - "import": "./dist/index.js", - "require": "./dist/index.umd.cjs", - "types": "./dist/main.d.ts" - }, - "./dist/": { - "import": "./dist/", - "require": "./dist/" - } + "description": "React components encapsulating the CBP Design System web components.", + "main": "dist/lib/index.js", + "module": "dist/lib/index.js", + "types": "dist/types/lib/index.d.ts", + "devDependencies": { + "@types/react": "^18.2.37", + "react": "^18.2.0", + "react-dom": "^18.2.0", + "typescript": "^5.2.2" }, "scripts": { - "dev": "vite", - "build": "tsc && vite build", - "lint": "eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0", - "preview": "vite preview", - "storybook": "storybook dev -p 6007", - "build-storybook": "storybook build", - "build-pages": "storybook build -o ../../.public/react-sb" + "test": "echo \"Error: no test specified\" && exit 1", + "build": "npm run tsc", + "tsc": "tsc -p . --outDir ./dist" }, - "dependencies": { - "react": "^18.2.0", - "react-dom": "^18.2.0" + "files": ["dist"], + "publishConfig": { + "access": "public" }, - "devDependencies": { - "@storybook/addon-essentials": "^7.2.0", - "@storybook/addon-interactions": "^7.2.0", - "@storybook/addon-links": "^7.2.0", - "@storybook/addon-onboarding": "^1.0.8", - "@storybook/addon-styling": "^1.3.5", - "@storybook/blocks": "^7.2.0", - "@storybook/react": "^7.2.0", - "@storybook/react-vite": "^7.2.0", - "@storybook/testing-library": "^0.2.0", - "@types/react": "^18.2.15", - "@types/react-dom": "^18.2.7", - "@vitejs/plugin-react": "^4.0.3", - "storybook": "^7.2.0", - "typescript": "^5.2.2", - "vite": "^4.4.5", - "vite-plugin-dts": "^3.6.0" - } + "author": "", + "license": "ISC" } diff --git a/packages/react-components/readme.md b/packages/react-components/readme.md new file mode 100644 index 00000000..18749296 --- /dev/null +++ b/packages/react-components/readme.md @@ -0,0 +1,22 @@ +# CBP Design System - React Components + +## Example + +```javascript +import { CbpApp, CbpButton, defineCustomElements } from '@cbpds/react-components'; + +defineCustomElements(); + +function App() { + + return ( + <> + + Hello + + + ) +} + +export default App +``` \ No newline at end of file diff --git a/packages/react-components/src/components/Badge.tsx b/packages/react-components/src/components/Badge.tsx deleted file mode 100644 index 176d283c..00000000 --- a/packages/react-components/src/components/Badge.tsx +++ /dev/null @@ -1,5 +0,0 @@ -interface BadgeProps { - label: string | number -}; - -export const Badge = ({ label }: BadgeProps) =>
{label}
; diff --git a/packages/react-components/src/components/Button.tsx b/packages/react-components/src/components/Button.tsx deleted file mode 100644 index f748ccd8..00000000 --- a/packages/react-components/src/components/Button.tsx +++ /dev/null @@ -1,21 +0,0 @@ -import { ReactNode } from "react"; - -interface ButtonProps { - attributes?: object, - 'aria-label'?: string, - children: ReactNode, - disabled?: boolean, -}; - -export const Button = ({ attributes, children, 'aria-label': ariaLabel, disabled, }: ButtonProps) => { - return ( - - ); -}; diff --git a/packages/react-components/src/main.ts b/packages/react-components/src/main.ts deleted file mode 100644 index bb0aab1a..00000000 --- a/packages/react-components/src/main.ts +++ /dev/null @@ -1,4 +0,0 @@ -import '@cbpds/vanilla/dist/style.css'; - -export { Badge } from './components/Badge'; -export { Button } from './components/Button'; \ No newline at end of file diff --git a/packages/react-components/src/stories/Badge.stories.js b/packages/react-components/src/stories/Badge.stories.js deleted file mode 100644 index 729900b7..00000000 --- a/packages/react-components/src/stories/Badge.stories.js +++ /dev/null @@ -1,15 +0,0 @@ -import { Badge as BadgeComponent } from '../components/Badge'; - -export default { - title: 'Components/Badges, Chips, and Tags', - component: BadgeComponent, - parameters: { - layout: 'centered' - } -}; - -export const Badge = { - args: { - label: '5' - } -} \ No newline at end of file diff --git a/packages/react-components/src/stories/Button.stories.js b/packages/react-components/src/stories/Button.stories.js deleted file mode 100644 index 38ea9656..00000000 --- a/packages/react-components/src/stories/Button.stories.js +++ /dev/null @@ -1,15 +0,0 @@ -import { Button } from "../components/Button"; - -export default { - title: 'Components/Button', - component: Button, - parameters: { - layout: 'centered' - } -} - -export const Default = { - args: { - children: 'Default' - } -} \ No newline at end of file diff --git a/packages/react-components/src/stories/Introduction.mdx b/packages/react-components/src/stories/Introduction.mdx deleted file mode 100644 index b25c4472..00000000 --- a/packages/react-components/src/stories/Introduction.mdx +++ /dev/null @@ -1,16 +0,0 @@ -import { Meta } from '@storybook/blocks' -import cbpSeal from '@cbpds/vanilla/dist/assets/images/CBP_SEAL.svg' -import reactIcon from '/assets/react-icon.svg' - - - -
- - + - -
-

CBP Design System - React Components

- -## Work in Progress - -The CBP Design System (1.0) is still in a stage of **very active development**. As such, much of the code base is still somewhat fragile and may break at any time. While we encourage you to explore our offerings, please do so with the knowledge that the codebase in these repositories will change rapidly and with little warning. Use at your own risk. We will communicate when a stable release will be made available. diff --git a/packages/react-components/tsconfig.json b/packages/react-components/tsconfig.json index 8083d903..5f369b79 100644 --- a/packages/react-components/tsconfig.json +++ b/packages/react-components/tsconfig.json @@ -1,29 +1,16 @@ { + "extends": "../../tsconfig.json", "compilerOptions": { - "target": "ES2020", - "useDefineForClassFields": true, - "lib": ["ES2020", "DOM", "DOM.Iterable"], - "module": "ESNext", + "outDir": "./dist", + "lib": ["dom", "es2015"], + "module": "es2015", + "moduleResolution": "node", + "target": "es2015", "skipLibCheck": true, - - /* Bundler mode */ - "moduleResolution": "bundler", - "allowImportingTsExtensions": true, - "resolveJsonModule": true, - "isolatedModules": true, - "declaration": true, - "declarationDir": "./dist/types", - "emitDeclarationOnly": true, - "outDir": "./dist/types", - "jsx": "react-jsx", - - /* Linting */ - "strict": true, - "noUnusedLocals": true, - "noUnusedParameters": true, - "noFallthroughCasesInSwitch": true + "jsx": "react", + "allowSyntheticDefaultImports": true, + "declarationDir": "./dist/types" }, - "include": ["src"], - "exclude": ["src/stories/**/*"], - "references": [{ "path": "./tsconfig.node.json" }] -} + "include": ["lib"], + "exclude": ["node_modules"] +} \ No newline at end of file diff --git a/packages/react-components/tsconfig.node.json b/packages/react-components/tsconfig.node.json deleted file mode 100644 index 42872c59..00000000 --- a/packages/react-components/tsconfig.node.json +++ /dev/null @@ -1,10 +0,0 @@ -{ - "compilerOptions": { - "composite": true, - "skipLibCheck": true, - "module": "ESNext", - "moduleResolution": "bundler", - "allowSyntheticDefaultImports": true - }, - "include": ["vite.config.ts"] -} diff --git a/packages/react-components/vite.config.ts b/packages/react-components/vite.config.ts deleted file mode 100644 index 65de6fa7..00000000 --- a/packages/react-components/vite.config.ts +++ /dev/null @@ -1,33 +0,0 @@ -import { resolve } from 'path'; -import { defineConfig } from 'vite'; -import react from '@vitejs/plugin-react'; -import dts from 'vite-plugin-dts' - -// https://vitejs.dev/config/ -export default defineConfig({ - plugins: [ - react(), - dts({rollupTypes: true}) - ], - build: { - lib: { - // Could also be a dictionary or array of multiple entry points - entry: resolve(__dirname, 'src/main.ts'), - name: 'MyLib', - // the proper extensions will be added - fileName: 'index', - }, - rollupOptions: { - // make sure to externalize deps that shouldn't be bundled - // into your library - external: ['react'], - output: { - // Provide global variables to use in the UMD build - // for externalized deps - globals: { - react: 'React', - }, - }, - }, - }, -}); diff --git a/packages/web-components/package.json b/packages/web-components/package.json index 8c91fdb9..844da128 100644 --- a/packages/web-components/package.json +++ b/packages/web-components/package.json @@ -1,5 +1,5 @@ { - "name": "web-components", + "name": "@cbpds/web-components", "version": "0.0.1", "description": "Stencil Component Starter", "main": "dist/index.cjs.js", @@ -31,6 +31,7 @@ "npm": "^10.2.1" }, "devDependencies": { + "@stencil/react-output-target": "^0.5.3", "@stencil/sass": "^3.0.7", "@storybook/addon-essentials": "^7.5.1", "@storybook/addon-interactions": "^7.5.1", diff --git a/packages/web-components/stencil.config.ts b/packages/web-components/stencil.config.ts index 36cbfc37..06a9841c 100644 --- a/packages/web-components/stencil.config.ts +++ b/packages/web-components/stencil.config.ts @@ -1,9 +1,15 @@ import { Config } from '@stencil/core'; import { sass } from '@stencil/sass'; +import { reactOutputTarget } from '@stencil/react-output-target'; export const config: Config = { namespace: 'cbp-web-components', outputTargets: [ + reactOutputTarget({ + componentCorePackage: '@cbpds/web-components', + //proxiesFile: '../cbp-web-components-react/src/components.ts', + proxiesFile: '../react-components/components/stencil-generated/index.ts', + }), { type: 'dist', esmLoaderPath: 'loader', diff --git a/tsconfig.json b/tsconfig.json new file mode 100644 index 00000000..62ab5da8 --- /dev/null +++ b/tsconfig.json @@ -0,0 +1,15 @@ +{ + "compilerOptions": { + "module": "commonjs", + "declaration": true, + "noImplicitAny": false, + "removeComments": true, + "noLib": false, + "emitDecoratorMetadata": true, + "experimentalDecorators": true, + "target": "es6", + "sourceMap": true, + "lib": ["es6"] + }, + "exclude": ["node_modules", "**/*.spec.ts", "**/__tests__/**"] +} \ No newline at end of file