diff --git a/package-lock.json b/package-lock.json index e5c15397d..e1f51cbb1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,6 +10,9 @@ "packages/*", "examples/*" ], + "dependencies": { + "lodash": "^4.17.21" + }, "devDependencies": { "@babel/core": "^7.18.10", "@ory/client": "^1.1.0", @@ -27,17 +30,17 @@ "@storybook/core-common": "^6.5.10", "@storybook/node-logger": "^6.5.10", "@storybook/react": "^6.5.10", - "@types/express": "^4.17.13", - "@types/node": "^16.11.7", + "@types/express": "^4.17.15", + "@types/node": "^18.11.15", "@types/react": "^17.0.2", "@types/react-dom": "^17.0.2", "@typescript-eslint/eslint-plugin": "^5.33.1", "@typescript-eslint/parser": "^5.33.1", - "@vanilla-extract/css": "^1.7.3", - "@vanilla-extract/dynamic": "^2.0.2", - "@vanilla-extract/recipes": "^0.2.5", - "@vanilla-extract/sprinkles": "^1.4.1", - "@vanilla-extract/vite-plugin": "^3.3.1", + "@vanilla-extract/css": "^1.9.2", + "@vanilla-extract/dynamic": "^2.0.3", + "@vanilla-extract/recipes": "^0.3.0", + "@vanilla-extract/sprinkles": "^1.5.1", + "@vanilla-extract/vite-plugin": "^3.7.0", "@vitejs/plugin-react": "^2.0.1", "classnames": "^2.3.1", "eslint": "^8.22.0", @@ -48,7 +51,7 @@ "license-checker": "^25.0.1", "nx": "14.5.10", "ory-prettier-styles": "^1.3.0", - "prettier": "^2.7.1", + "prettier": "^2.8.1", "react": "^17.0.2", "react-dom": "^17.0.2", "require-from-string": "^2.0.2", @@ -2795,9 +2798,9 @@ } }, "node_modules/@emotion/hash": { - "version": "0.8.0", - "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz", - "integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==", + "version": "0.9.0", + "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.0.tgz", + "integrity": "sha512-14FtKiHhy2QoPIzdTcvh//8OyBlknNs2nXRwIhG904opCby3l+9Xaf/wuPvICBF0rc1ZCNBd3nKe9cd2mecVkQ==", "dev": true }, "node_modules/@esbuild/linux-loong64": { @@ -8977,6 +8980,12 @@ } } }, + "node_modules/@storybook/builder-webpack4/node_modules/@types/node": { + "version": "16.18.9", + "resolved": "https://registry.npmjs.org/@types/node/-/node-16.18.9.tgz", + "integrity": "sha512-nhrqXYxiQ+5B/tPorWum37VgAiefi/wmfJ1QZKGKKecC8/3HqcTTJD0O+VABSPwtseMMF7NCPVT9uGgwn0YqsQ==", + "dev": true + }, "node_modules/@storybook/builder-webpack4/node_modules/braces": { "version": "2.3.2", "resolved": "https://registry.npmjs.org/braces/-/braces-2.3.2.tgz", @@ -9443,6 +9452,12 @@ "@babel/core": "^7.4.0-0" } }, + "node_modules/@storybook/core-common/node_modules/@types/node": { + "version": "16.18.9", + "resolved": "https://registry.npmjs.org/@types/node/-/node-16.18.9.tgz", + "integrity": "sha512-nhrqXYxiQ+5B/tPorWum37VgAiefi/wmfJ1QZKGKKecC8/3HqcTTJD0O+VABSPwtseMMF7NCPVT9uGgwn0YqsQ==", + "dev": true + }, "node_modules/@storybook/core-common/node_modules/ansi-styles": { "version": "4.3.0", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", @@ -9611,6 +9626,12 @@ } } }, + "node_modules/@storybook/core-server/node_modules/@types/node": { + "version": "16.18.9", + "resolved": "https://registry.npmjs.org/@types/node/-/node-16.18.9.tgz", + "integrity": "sha512-nhrqXYxiQ+5B/tPorWum37VgAiefi/wmfJ1QZKGKKecC8/3HqcTTJD0O+VABSPwtseMMF7NCPVT9uGgwn0YqsQ==", + "dev": true + }, "node_modules/@storybook/core-server/node_modules/ansi-styles": { "version": "4.3.0", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", @@ -9816,6 +9837,12 @@ } } }, + "node_modules/@storybook/manager-webpack4/node_modules/@types/node": { + "version": "16.18.9", + "resolved": "https://registry.npmjs.org/@types/node/-/node-16.18.9.tgz", + "integrity": "sha512-nhrqXYxiQ+5B/tPorWum37VgAiefi/wmfJ1QZKGKKecC8/3HqcTTJD0O+VABSPwtseMMF7NCPVT9uGgwn0YqsQ==", + "dev": true + }, "node_modules/@storybook/manager-webpack4/node_modules/ansi-styles": { "version": "4.3.0", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", @@ -10245,6 +10272,12 @@ "node": ">=8" } }, + "node_modules/@storybook/react/node_modules/@types/node": { + "version": "16.18.9", + "resolved": "https://registry.npmjs.org/@types/node/-/node-16.18.9.tgz", + "integrity": "sha512-nhrqXYxiQ+5B/tPorWum37VgAiefi/wmfJ1QZKGKKecC8/3HqcTTJD0O+VABSPwtseMMF7NCPVT9uGgwn0YqsQ==", + "dev": true + }, "node_modules/@storybook/router": { "version": "6.5.10", "resolved": "https://registry.npmjs.org/@storybook/router/-/router-6.5.10.tgz", @@ -10630,21 +10663,21 @@ "dev": true }, "node_modules/@types/express": { - "version": "4.17.13", - "resolved": "https://registry.npmjs.org/@types/express/-/express-4.17.13.tgz", - "integrity": "sha512-6bSZTPaTIACxn48l50SR+axgrqm6qXFIxrdAKaG6PaJk3+zuUr35hBlgT7vOmJcum+OEaIBLtHV/qloEAFITeA==", + "version": "4.17.15", + "resolved": "https://registry.npmjs.org/@types/express/-/express-4.17.15.tgz", + "integrity": "sha512-Yv0k4bXGOH+8a+7bELd2PqHQsuiANB+A8a4gnQrkRWzrkKlb6KHaVvyXhqs04sVW/OWlbPyYxRgYlIXLfrufMQ==", "dev": true, "dependencies": { "@types/body-parser": "*", - "@types/express-serve-static-core": "^4.17.18", + "@types/express-serve-static-core": "^4.17.31", "@types/qs": "*", "@types/serve-static": "*" } }, "node_modules/@types/express-serve-static-core": { - "version": "4.17.30", - "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.17.30.tgz", - "integrity": "sha512-gstzbTWro2/nFed1WXtf+TtrpwxH7Ggs4RLYTLbeVgIkUQOI3WG/JKjgeOU1zXDvezllupjrf8OPIdvTbIaVOQ==", + "version": "4.17.31", + "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.17.31.tgz", + "integrity": "sha512-DxMhY+NAsTwMMFHBTtJFNp5qiHKJ7TeqOo23zVEM9alT1Ml27Q3xcTH0xwxn7Q0BbMcVEJOs/7aQtUWupUQN3Q==", "dev": true, "dependencies": { "@types/node": "*", @@ -10762,9 +10795,9 @@ "dev": true }, "node_modules/@types/node": { - "version": "16.11.56", - "resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.56.tgz", - "integrity": "sha512-aFcUkv7EddxxOa/9f74DINReQ/celqH8DiB3fRYgVDM2Xm5QJL8sl80QKuAnGvwAsMn+H3IFA6WCrQh1CY7m1A==", + "version": "18.11.15", + "resolved": "https://registry.npmjs.org/@types/node/-/node-18.11.15.tgz", + "integrity": "sha512-VkhBbVo2+2oozlkdHXLrb3zjsRkpdnaU2bXmX8Wgle3PUi569eLRaHGlgETQHR7lLL1w7GiG3h9SnePhxNDecw==", "dev": true }, "node_modules/@types/node-fetch": { @@ -11212,21 +11245,30 @@ "url": "https://opencollective.com/typescript-eslint" } }, + "node_modules/@vanilla-extract/babel-plugin-debug-ids": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/@vanilla-extract/babel-plugin-debug-ids/-/babel-plugin-debug-ids-1.0.0.tgz", + "integrity": "sha512-Q2Nh/0FEAENfcphAv+fvcMoKfl3bhPWO/2x3MPviNAhsTsvuvYPuRtLjcXwoe4aJ8MxxI46JLY33j8NBEzpTIg==", + "dev": true, + "dependencies": { + "@babel/core": "^7.13.10" + } + }, "node_modules/@vanilla-extract/css": { - "version": "1.7.3", - "resolved": "https://registry.npmjs.org/@vanilla-extract/css/-/css-1.7.3.tgz", - "integrity": "sha512-ZwfNvk9LjVdsHON4bNAGXBu0dPo4e1RlgghnW1A4lcQruvFU7zdq+wEqodrX3O0D2qRkupOGgjAbTSddwqKoQA==", + "version": "1.9.2", + "resolved": "https://registry.npmjs.org/@vanilla-extract/css/-/css-1.9.2.tgz", + "integrity": "sha512-CE5+R89LOl9XG5dRwEIvVyl/YcS2GkqjdE/XnGJ+p7Fp6Exu08fifv7tY87XxFeCIRAbc9psM+h4lF+wC3Y0fg==", "dev": true, "dependencies": { - "@emotion/hash": "^0.8.0", + "@emotion/hash": "^0.9.0", "@vanilla-extract/private": "^1.0.3", + "ahocorasick": "1.0.2", "chalk": "^4.1.1", "css-what": "^5.0.1", "cssesc": "^3.0.0", "csstype": "^3.0.7", "deep-object-diff": "^1.1.0", "deepmerge": "^4.2.2", - "escape-string-regexp": "^4.0.0", "media-query-parser": "^2.0.2", "outdent": "^0.8.0" } @@ -11302,21 +11344,24 @@ } }, "node_modules/@vanilla-extract/dynamic": { - "version": "2.0.2", - "resolved": "https://registry.npmjs.org/@vanilla-extract/dynamic/-/dynamic-2.0.2.tgz", - "integrity": "sha512-U4nKaEQ8Kuz+exXEr51DUpyaOuzo24/S/k1YbDPQR06cYcNjQqvwFRnwWtZ+9ImocqM1wTKtzrdUgSTtLGIwAg==", + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/@vanilla-extract/dynamic/-/dynamic-2.0.3.tgz", + "integrity": "sha512-Rglfw2gXAYiBzAQ4jgUG7rBgE2c88e/zcG27ZVoIqMHVq56wf2C1katGMm1yFMNBgzqM7oBNYzz4YOMzznydkg==", "dev": true, "dependencies": { "@vanilla-extract/private": "^1.0.3" } }, "node_modules/@vanilla-extract/integration": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/@vanilla-extract/integration/-/integration-5.0.0.tgz", - "integrity": "sha512-HwglsIxGYtV4IXFfyQ6GzZLFoaWaW+QkNx8UhXbgsCWUoPqpSbioukCOA+SuSuzsIcEZ3hkD0Y5ixITQNtnzjQ==", + "version": "6.0.1", + "resolved": "https://registry.npmjs.org/@vanilla-extract/integration/-/integration-6.0.1.tgz", + "integrity": "sha512-8D2JdBTH6UEao5Tm50m1qtY63JP4hDxiv/sNvgj2+ix/9M5RML9sa0diS80u0hW/r26+/ZsdzoA5YIbg6ghOMw==", "dev": true, "dependencies": { - "@vanilla-extract/css": "^1.7.2", + "@babel/core": "^7.13.10", + "@babel/plugin-syntax-typescript": "^7.18.6", + "@vanilla-extract/babel-plugin-debug-ids": "^1.0.0", + "@vanilla-extract/css": "^1.9.2", "esbuild": "^0.11.16", "eval": "0.1.6", "find-up": "^5.0.0", @@ -11332,36 +11377,36 @@ "dev": true }, "node_modules/@vanilla-extract/recipes": { - "version": "0.2.5", - "resolved": "https://registry.npmjs.org/@vanilla-extract/recipes/-/recipes-0.2.5.tgz", - "integrity": "sha512-OWXUUiFJdswD3+Xg8f8avuw/vAHZRFS4oHqFeoV1TcO8cfbDQ0zmkreBHvyspoJU+qsyWK48yPHKSptqNRPy9Q==", + "version": "0.3.0", + "resolved": "https://registry.npmjs.org/@vanilla-extract/recipes/-/recipes-0.3.0.tgz", + "integrity": "sha512-7wXrgfq1oldKdBfCKen4XmSlDmQR+4o0CQ3WnnLfhQaEtI65xJ774yyQF6dD2CC+hHdW2LFKVXgH5NZRbMQ8Sg==", "dev": true, "peerDependencies": { "@vanilla-extract/css": "^1.0.0" } }, "node_modules/@vanilla-extract/sprinkles": { - "version": "1.4.1", - "resolved": "https://registry.npmjs.org/@vanilla-extract/sprinkles/-/sprinkles-1.4.1.tgz", - "integrity": "sha512-aW6CfMMToX4a+baLuVxwcT0FSACjX3xrNt8wdi/3LLRlLAfhyue8OK7kJxhcYNZfydBeWTP59aRy8p5FUTIeew==", + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/@vanilla-extract/sprinkles/-/sprinkles-1.5.1.tgz", + "integrity": "sha512-xPYpeEZEC1mhiPqWCBPGdIHkpFaaQIbaAfG9W2JyIW0byqTP7CoaxdYNMPjhZuoV5lkTI14SJg8Bt+fZqmV5yQ==", "dev": true, "peerDependencies": { "@vanilla-extract/css": "^1.0.0" } }, "node_modules/@vanilla-extract/vite-plugin": { - "version": "3.3.1", - "resolved": "https://registry.npmjs.org/@vanilla-extract/vite-plugin/-/vite-plugin-3.3.1.tgz", - "integrity": "sha512-x5tl1s7uELTKU5HDMrZB9zDW7z+rcTuiT+sGPJ5/OOb+DHS4Y5S8caXOEytk/lhGegBS2gib4fN7yaJ0azuJlQ==", + "version": "3.7.0", + "resolved": "https://registry.npmjs.org/@vanilla-extract/vite-plugin/-/vite-plugin-3.7.0.tgz", + "integrity": "sha512-Sq54d1f+Bww09e9Q5acFsNKjlSYMQ4GewJthdb3CVwUeGVzV10rJBChw6zufs7ndmJVCzQ4I2IcNMy2OiAlkmA==", "dev": true, "dependencies": { - "@vanilla-extract/integration": "^5.0.0", + "@vanilla-extract/integration": "^6.0.1", "outdent": "^0.8.0", "postcss": "^8.3.6", "postcss-load-config": "^3.1.0" }, "peerDependencies": { - "vite": "^2.2.3" + "vite": "^2.2.3 || ^3.0.0" } }, "node_modules/@vanilla-extract/vite-plugin/node_modules/picocolors": { @@ -11752,6 +11797,12 @@ "node": ">=8" } }, + "node_modules/ahocorasick": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/ahocorasick/-/ahocorasick-1.0.2.tgz", + "integrity": "sha512-hCOfMzbFx5IDutmWLAt6MZwOUjIfSM9G9FyVxytmE4Rs/5YDPWQrD/+IR1w+FweD9H2oOZEnv36TmkjhNURBVA==", + "dev": true + }, "node_modules/airbnb-js-shims": { "version": "2.2.1", "resolved": "https://registry.npmjs.org/airbnb-js-shims/-/airbnb-js-shims-2.2.1.tgz", @@ -21989,8 +22040,7 @@ "node_modules/lodash": { "version": "4.17.21", "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz", - "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==", - "dev": true + "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==" }, "node_modules/lodash.debounce": { "version": "4.0.8", @@ -25460,9 +25510,9 @@ } }, "node_modules/prettier": { - "version": "2.7.1", - "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.7.1.tgz", - "integrity": "sha512-ujppO+MkdPqoVINuDFDRLClm7D78qbDt0/NR+wp5FqEZOoTNAjPHWj17QRhu7geIHJfcNhRk1XVQmF8Bp3ye+g==", + "version": "2.8.1", + "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.8.1.tgz", + "integrity": "sha512-lqGoSJBQNJidqCHE80vqZJHWHRFoNYsSpP9AjFhlhi9ODCJA541svILes/+/1GM3VaL/abZi7cpFzOpdR9UPKg==", "dev": true, "bin": { "prettier": "bin-prettier.js" @@ -33846,9 +33896,9 @@ "dev": true }, "@emotion/hash": { - "version": "0.8.0", - "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz", - "integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==", + "version": "0.9.0", + "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.0.tgz", + "integrity": "sha512-14FtKiHhy2QoPIzdTcvh//8OyBlknNs2nXRwIhG904opCby3l+9Xaf/wuPvICBF0rc1ZCNBd3nKe9cd2mecVkQ==", "dev": true }, "@esbuild/linux-loong64": { @@ -38556,6 +38606,12 @@ "webpack-virtual-modules": "^0.2.2" }, "dependencies": { + "@types/node": { + "version": "16.18.9", + "resolved": "https://registry.npmjs.org/@types/node/-/node-16.18.9.tgz", + "integrity": "sha512-nhrqXYxiQ+5B/tPorWum37VgAiefi/wmfJ1QZKGKKecC8/3HqcTTJD0O+VABSPwtseMMF7NCPVT9uGgwn0YqsQ==", + "dev": true + }, "braces": { "version": "2.3.2", "resolved": "https://registry.npmjs.org/braces/-/braces-2.3.2.tgz", @@ -38908,6 +38964,12 @@ "semver": "^6.1.2" } }, + "@types/node": { + "version": "16.18.9", + "resolved": "https://registry.npmjs.org/@types/node/-/node-16.18.9.tgz", + "integrity": "sha512-nhrqXYxiQ+5B/tPorWum37VgAiefi/wmfJ1QZKGKKecC8/3HqcTTJD0O+VABSPwtseMMF7NCPVT9uGgwn0YqsQ==", + "dev": true + }, "ansi-styles": { "version": "4.3.0", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", @@ -39031,6 +39093,12 @@ "x-default-browser": "^0.4.0" }, "dependencies": { + "@types/node": { + "version": "16.18.9", + "resolved": "https://registry.npmjs.org/@types/node/-/node-16.18.9.tgz", + "integrity": "sha512-nhrqXYxiQ+5B/tPorWum37VgAiefi/wmfJ1QZKGKKecC8/3HqcTTJD0O+VABSPwtseMMF7NCPVT9uGgwn0YqsQ==", + "dev": true + }, "ansi-styles": { "version": "4.3.0", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", @@ -39184,6 +39252,12 @@ "webpack-virtual-modules": "^0.2.2" }, "dependencies": { + "@types/node": { + "version": "16.18.9", + "resolved": "https://registry.npmjs.org/@types/node/-/node-16.18.9.tgz", + "integrity": "sha512-nhrqXYxiQ+5B/tPorWum37VgAiefi/wmfJ1QZKGKKecC8/3HqcTTJD0O+VABSPwtseMMF7NCPVT9uGgwn0YqsQ==", + "dev": true + }, "ansi-styles": { "version": "4.3.0", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", @@ -39400,6 +39474,14 @@ "ts-dedent": "^2.0.0", "util-deprecate": "^1.0.2", "webpack": ">=4.43.0 <6.0.0" + }, + "dependencies": { + "@types/node": { + "version": "16.18.9", + "resolved": "https://registry.npmjs.org/@types/node/-/node-16.18.9.tgz", + "integrity": "sha512-nhrqXYxiQ+5B/tPorWum37VgAiefi/wmfJ1QZKGKKecC8/3HqcTTJD0O+VABSPwtseMMF7NCPVT9uGgwn0YqsQ==", + "dev": true + } } }, "@storybook/react-docgen-typescript-plugin": { @@ -39780,21 +39862,21 @@ "dev": true }, "@types/express": { - "version": "4.17.13", - "resolved": "https://registry.npmjs.org/@types/express/-/express-4.17.13.tgz", - "integrity": "sha512-6bSZTPaTIACxn48l50SR+axgrqm6qXFIxrdAKaG6PaJk3+zuUr35hBlgT7vOmJcum+OEaIBLtHV/qloEAFITeA==", + "version": "4.17.15", + "resolved": "https://registry.npmjs.org/@types/express/-/express-4.17.15.tgz", + "integrity": "sha512-Yv0k4bXGOH+8a+7bELd2PqHQsuiANB+A8a4gnQrkRWzrkKlb6KHaVvyXhqs04sVW/OWlbPyYxRgYlIXLfrufMQ==", "dev": true, "requires": { "@types/body-parser": "*", - "@types/express-serve-static-core": "^4.17.18", + "@types/express-serve-static-core": "^4.17.31", "@types/qs": "*", "@types/serve-static": "*" } }, "@types/express-serve-static-core": { - "version": "4.17.30", - "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.17.30.tgz", - "integrity": "sha512-gstzbTWro2/nFed1WXtf+TtrpwxH7Ggs4RLYTLbeVgIkUQOI3WG/JKjgeOU1zXDvezllupjrf8OPIdvTbIaVOQ==", + "version": "4.17.31", + "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.17.31.tgz", + "integrity": "sha512-DxMhY+NAsTwMMFHBTtJFNp5qiHKJ7TeqOo23zVEM9alT1Ml27Q3xcTH0xwxn7Q0BbMcVEJOs/7aQtUWupUQN3Q==", "dev": true, "requires": { "@types/node": "*", @@ -39912,9 +39994,9 @@ "dev": true }, "@types/node": { - "version": "16.11.56", - "resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.56.tgz", - "integrity": "sha512-aFcUkv7EddxxOa/9f74DINReQ/celqH8DiB3fRYgVDM2Xm5QJL8sl80QKuAnGvwAsMn+H3IFA6WCrQh1CY7m1A==", + "version": "18.11.15", + "resolved": "https://registry.npmjs.org/@types/node/-/node-18.11.15.tgz", + "integrity": "sha512-VkhBbVo2+2oozlkdHXLrb3zjsRkpdnaU2bXmX8Wgle3PUi569eLRaHGlgETQHR7lLL1w7GiG3h9SnePhxNDecw==", "dev": true }, "@types/node-fetch": { @@ -40248,21 +40330,30 @@ "eslint-visitor-keys": "^3.3.0" } }, + "@vanilla-extract/babel-plugin-debug-ids": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/@vanilla-extract/babel-plugin-debug-ids/-/babel-plugin-debug-ids-1.0.0.tgz", + "integrity": "sha512-Q2Nh/0FEAENfcphAv+fvcMoKfl3bhPWO/2x3MPviNAhsTsvuvYPuRtLjcXwoe4aJ8MxxI46JLY33j8NBEzpTIg==", + "dev": true, + "requires": { + "@babel/core": "^7.13.10" + } + }, "@vanilla-extract/css": { - "version": "1.7.3", - "resolved": "https://registry.npmjs.org/@vanilla-extract/css/-/css-1.7.3.tgz", - "integrity": "sha512-ZwfNvk9LjVdsHON4bNAGXBu0dPo4e1RlgghnW1A4lcQruvFU7zdq+wEqodrX3O0D2qRkupOGgjAbTSddwqKoQA==", + "version": "1.9.2", + "resolved": "https://registry.npmjs.org/@vanilla-extract/css/-/css-1.9.2.tgz", + "integrity": "sha512-CE5+R89LOl9XG5dRwEIvVyl/YcS2GkqjdE/XnGJ+p7Fp6Exu08fifv7tY87XxFeCIRAbc9psM+h4lF+wC3Y0fg==", "dev": true, "requires": { - "@emotion/hash": "^0.8.0", + "@emotion/hash": "^0.9.0", "@vanilla-extract/private": "^1.0.3", + "ahocorasick": "1.0.2", "chalk": "^4.1.1", "css-what": "^5.0.1", "cssesc": "^3.0.0", "csstype": "^3.0.7", "deep-object-diff": "^1.1.0", "deepmerge": "^4.2.2", - "escape-string-regexp": "^4.0.0", "media-query-parser": "^2.0.2", "outdent": "^0.8.0" }, @@ -40319,21 +40410,24 @@ } }, "@vanilla-extract/dynamic": { - "version": "2.0.2", - "resolved": "https://registry.npmjs.org/@vanilla-extract/dynamic/-/dynamic-2.0.2.tgz", - "integrity": "sha512-U4nKaEQ8Kuz+exXEr51DUpyaOuzo24/S/k1YbDPQR06cYcNjQqvwFRnwWtZ+9ImocqM1wTKtzrdUgSTtLGIwAg==", + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/@vanilla-extract/dynamic/-/dynamic-2.0.3.tgz", + "integrity": "sha512-Rglfw2gXAYiBzAQ4jgUG7rBgE2c88e/zcG27ZVoIqMHVq56wf2C1katGMm1yFMNBgzqM7oBNYzz4YOMzznydkg==", "dev": true, "requires": { "@vanilla-extract/private": "^1.0.3" } }, "@vanilla-extract/integration": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/@vanilla-extract/integration/-/integration-5.0.0.tgz", - "integrity": "sha512-HwglsIxGYtV4IXFfyQ6GzZLFoaWaW+QkNx8UhXbgsCWUoPqpSbioukCOA+SuSuzsIcEZ3hkD0Y5ixITQNtnzjQ==", + "version": "6.0.1", + "resolved": "https://registry.npmjs.org/@vanilla-extract/integration/-/integration-6.0.1.tgz", + "integrity": "sha512-8D2JdBTH6UEao5Tm50m1qtY63JP4hDxiv/sNvgj2+ix/9M5RML9sa0diS80u0hW/r26+/ZsdzoA5YIbg6ghOMw==", "dev": true, "requires": { - "@vanilla-extract/css": "^1.7.2", + "@babel/core": "^7.13.10", + "@babel/plugin-syntax-typescript": "^7.18.6", + "@vanilla-extract/babel-plugin-debug-ids": "^1.0.0", + "@vanilla-extract/css": "^1.9.2", "esbuild": "^0.11.16", "eval": "0.1.6", "find-up": "^5.0.0", @@ -40349,26 +40443,26 @@ "dev": true }, "@vanilla-extract/recipes": { - "version": "0.2.5", - "resolved": "https://registry.npmjs.org/@vanilla-extract/recipes/-/recipes-0.2.5.tgz", - "integrity": "sha512-OWXUUiFJdswD3+Xg8f8avuw/vAHZRFS4oHqFeoV1TcO8cfbDQ0zmkreBHvyspoJU+qsyWK48yPHKSptqNRPy9Q==", + "version": "0.3.0", + "resolved": "https://registry.npmjs.org/@vanilla-extract/recipes/-/recipes-0.3.0.tgz", + "integrity": "sha512-7wXrgfq1oldKdBfCKen4XmSlDmQR+4o0CQ3WnnLfhQaEtI65xJ774yyQF6dD2CC+hHdW2LFKVXgH5NZRbMQ8Sg==", "dev": true, "requires": {} }, "@vanilla-extract/sprinkles": { - "version": "1.4.1", - "resolved": "https://registry.npmjs.org/@vanilla-extract/sprinkles/-/sprinkles-1.4.1.tgz", - "integrity": "sha512-aW6CfMMToX4a+baLuVxwcT0FSACjX3xrNt8wdi/3LLRlLAfhyue8OK7kJxhcYNZfydBeWTP59aRy8p5FUTIeew==", + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/@vanilla-extract/sprinkles/-/sprinkles-1.5.1.tgz", + "integrity": "sha512-xPYpeEZEC1mhiPqWCBPGdIHkpFaaQIbaAfG9W2JyIW0byqTP7CoaxdYNMPjhZuoV5lkTI14SJg8Bt+fZqmV5yQ==", "dev": true, "requires": {} }, "@vanilla-extract/vite-plugin": { - "version": "3.3.1", - "resolved": "https://registry.npmjs.org/@vanilla-extract/vite-plugin/-/vite-plugin-3.3.1.tgz", - "integrity": "sha512-x5tl1s7uELTKU5HDMrZB9zDW7z+rcTuiT+sGPJ5/OOb+DHS4Y5S8caXOEytk/lhGegBS2gib4fN7yaJ0azuJlQ==", + "version": "3.7.0", + "resolved": "https://registry.npmjs.org/@vanilla-extract/vite-plugin/-/vite-plugin-3.7.0.tgz", + "integrity": "sha512-Sq54d1f+Bww09e9Q5acFsNKjlSYMQ4GewJthdb3CVwUeGVzV10rJBChw6zufs7ndmJVCzQ4I2IcNMy2OiAlkmA==", "dev": true, "requires": { - "@vanilla-extract/integration": "^5.0.0", + "@vanilla-extract/integration": "^6.0.1", "outdent": "^0.8.0", "postcss": "^8.3.6", "postcss-load-config": "^3.1.0" @@ -40698,6 +40792,12 @@ "indent-string": "^4.0.0" } }, + "ahocorasick": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/ahocorasick/-/ahocorasick-1.0.2.tgz", + "integrity": "sha512-hCOfMzbFx5IDutmWLAt6MZwOUjIfSM9G9FyVxytmE4Rs/5YDPWQrD/+IR1w+FweD9H2oOZEnv36TmkjhNURBVA==", + "dev": true + }, "airbnb-js-shims": { "version": "2.2.1", "resolved": "https://registry.npmjs.org/airbnb-js-shims/-/airbnb-js-shims-2.2.1.tgz", @@ -48515,8 +48615,7 @@ "lodash": { "version": "4.17.21", "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz", - "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==", - "dev": true + "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==" }, "lodash.debounce": { "version": "4.0.8", @@ -51258,9 +51357,9 @@ "dev": true }, "prettier": { - "version": "2.7.1", - "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.7.1.tgz", - "integrity": "sha512-ujppO+MkdPqoVINuDFDRLClm7D78qbDt0/NR+wp5FqEZOoTNAjPHWj17QRhu7geIHJfcNhRk1XVQmF8Bp3ye+g==", + "version": "2.8.1", + "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.8.1.tgz", + "integrity": "sha512-lqGoSJBQNJidqCHE80vqZJHWHRFoNYsSpP9AjFhlhi9ODCJA541svILes/+/1GM3VaL/abZi7cpFzOpdR9UPKg==", "dev": true }, "pretty-error": { diff --git a/package.json b/package.json index 39632f182..83edb65ad 100644 --- a/package.json +++ b/package.json @@ -49,17 +49,17 @@ "@storybook/core-common": "^6.5.10", "@storybook/node-logger": "^6.5.10", "@storybook/react": "^6.5.10", - "@types/express": "^4.17.13", - "@types/node": "^16.11.7", + "@types/express": "^4.17.15", + "@types/node": "^18.11.15", "@types/react": "^17.0.2", "@types/react-dom": "^17.0.2", "@typescript-eslint/eslint-plugin": "^5.33.1", "@typescript-eslint/parser": "^5.33.1", - "@vanilla-extract/css": "^1.7.3", - "@vanilla-extract/dynamic": "^2.0.2", - "@vanilla-extract/recipes": "^0.2.5", - "@vanilla-extract/sprinkles": "^1.4.1", - "@vanilla-extract/vite-plugin": "^3.3.1", + "@vanilla-extract/css": "^1.9.2", + "@vanilla-extract/dynamic": "^2.0.3", + "@vanilla-extract/recipes": "^0.3.0", + "@vanilla-extract/sprinkles": "^1.5.1", + "@vanilla-extract/vite-plugin": "^3.7.0", "@vitejs/plugin-react": "^2.0.1", "classnames": "^2.3.1", "eslint": "^8.22.0", @@ -70,7 +70,7 @@ "license-checker": "^25.0.1", "nx": "14.5.10", "ory-prettier-styles": "^1.3.0", - "prettier": "^2.7.1", + "prettier": "^2.8.1", "react": "^17.0.2", "react-dom": "^17.0.2", "require-from-string": "^2.0.2", @@ -90,5 +90,8 @@ "workspaces": [ "packages/*", "examples/*" - ] + ], + "dependencies": { + "lodash": "^4.17.21" + } } diff --git a/src/markup-components/components.ts b/src/markup-components/components.ts index 6df705fe2..8218d659e 100644 --- a/src/markup-components/components.ts +++ b/src/markup-components/components.ts @@ -45,16 +45,16 @@ import { UserAuthCardProps, UserAuthForm as userAuthForm, UserAuthFormProps, + UserConsentCard as userConsentCard, + UserConsentCardProps, UserErrorCard as userErrorCard, UserErrorCardProps, UserSettingsCard as userSettingsCard, UserSettingsCardProps, WebAuthnSettingsProps, WebAuthnSettingsSection as webAuthnSettingsSection, - UserConsentCard as userConsentCard, } from "../react-components" import { CodeBoxProps } from "../react-components/codebox" -import { ComponentProps } from "react" import { ComponentWrapper } from "./component-wrapper" export const ButtonLink = (props: ButtonLinkProps) => { @@ -159,9 +159,8 @@ export const LookupSecretSettingsSection = ( return ComponentWrapper(lookupSecretSettingsSection(props)) } -export const UserConsentCard = ( - props: ComponentProps, -) => ComponentWrapper(userConsentCard(props)) +export const UserConsentCard = (props: UserConsentCardProps) => + ComponentWrapper(userConsentCard(props)) export type { ButtonLinkProps, @@ -187,6 +186,7 @@ export type { TypographyProps, UserAuthCardProps, UserAuthFormProps, + UserConsentCardProps, UserErrorCardProps, UserSettingsCardProps, UserSettingsFlowType, diff --git a/src/markup-components/express.ts b/src/markup-components/express.ts index a7334fd1a..c46458397 100644 --- a/src/markup-components/express.ts +++ b/src/markup-components/express.ts @@ -3,20 +3,38 @@ import { assignInlineVars } from "@vanilla-extract/dynamic" import express, { Application, Request, Response } from "express" +import { cloneDeep, merge } from "lodash" import { oryTheme, Theme } from "../theme" -export const RegisterOryElementsExpress = ( +type CreateHelpers = ( + req: Request, + res: Response, +) => { + theme?: Theme +} + +type OryEelementsExpressRoute = ( + app: Application, + defaultTheme: Theme, + createHelpers: CreateHelpers, +) => void + +export const RegisterOryElementsExpress: OryEelementsExpressRoute = ( app: Application, defaultTheme: Theme, + createHelpers: CreateHelpers, ) => { app.use("/theme.css", (req: Request, res: Response) => { + const { theme } = createHelpers(req, res) res.header("Content-Type", "text/css") - res.send( - `body {${assignInlineVars(oryTheme, { - ...defaultTheme, - ...(req.theme && req.theme), - }).toString()}}`, - ) + let inlineTheme = cloneDeep(defaultTheme) // we don't want to pollute the default theme + if (theme) { + // merge with the default theme to make sure all variables are present + // this includes nested keys like `accent.def` + // merge also creates a new object ensuring that we don't pollute the default or request theme + inlineTheme = merge({}, inlineTheme, theme) + } + res.send(`body {${assignInlineVars(oryTheme, inlineTheme).toString()}}`) }) app.use("/", express.static("node_modules/@ory/elements/dist")) } diff --git a/src/react-components/ory/user-consent-card.tsx b/src/react-components/ory/user-consent-card.tsx index 49b864b35..2dffaa7bc 100644 --- a/src/react-components/ory/user-consent-card.tsx +++ b/src/react-components/ory/user-consent-card.tsx @@ -1,15 +1,12 @@ -import { gridStyle, typographyStyle } from "../../theme" +import { gridStyle } from "../../theme" import { Button } from "../button" -import { ButtonLink } from "../button-link" import { Card } from "../card" import { Typography } from "../typography" -import "../../assets/fontawesome.min.css" +import { OAuth2Client, OAuth2ConsentRequest } from "@ory/client" import "../../assets/fa-solid.min.css" +import "../../assets/fontawesome.min.css" import { Checkbox } from "../checkbox" -import { OAuth2Client, OAuth2ConsentRequest } from "@ory/client" -import { style } from "@vanilla-extract/css" -import { recipe } from "@vanilla-extract/recipes" import { Divider } from "../divider" export type UserConsentCardProps = {