diff --git a/.storybook/main.js b/.storybook/main.js index 3443047d7..6d3a8b83b 100644 --- a/.storybook/main.js +++ b/.storybook/main.js @@ -1,5 +1,11 @@ module.exports = { framework: '@storybook/angular', - addons: ['@storybook/addon-controls'], + addons: [ + '@storybook/addon-controls', + '@storybook/addon-viewport', + 'storybook-addon-designs', + 'storybook-addon-rtl-direction', + 'storybook-dark-mode', + ], stories: ['../src/**/*.stories.ts'], } diff --git a/.storybook/preview.js b/.storybook/preview.js index 4db753bc8..c3b705822 100644 --- a/.storybook/preview.js +++ b/.storybook/preview.js @@ -3,4 +3,9 @@ import '!style-loader!css-loader!sass-loader!./styles.scss'; export const parameters = { layout: 'centered', + darkMode: { + darkClass: 'dark', + classTarget: 'html', + stylePreview: true, + }, }; diff --git a/.storybook/styles.scss b/.storybook/styles.scss index 88ff7d26e..8be75bade 100644 --- a/.storybook/styles.scss +++ b/.storybook/styles.scss @@ -1,3 +1,7 @@ +storybook-dynamic-app-root { + color: var(--ion-text-color); +} + .core-error-info { max-width: 300px; } diff --git a/package-lock.json b/package-lock.json index 3fa03dfcd..c1753405c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4,6 +4,12 @@ "lockfileVersion": 1, "requires": true, "dependencies": { + "@aashutoshrathi/word-wrap": { + "version": "1.2.6", + "resolved": "https://registry.npmjs.org/@aashutoshrathi/word-wrap/-/word-wrap-1.2.6.tgz", + "integrity": "sha512-1Yjs2SvM8TflER/OD3cOjhWWOZb58A2t7wpE2S9XfBYTiIl+XFhQG2bjy4Pu1I+EAlCNUzRDYDdFwFYUKvXcIA==", + "dev": true + }, "@ampproject/remapping": { "version": "2.2.1", "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.2.1.tgz", @@ -3385,6 +3391,12 @@ "integrity": "sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==", "dev": true }, + "@emotion/use-insertion-effect-with-fallbacks": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/@emotion/use-insertion-effect-with-fallbacks/-/use-insertion-effect-with-fallbacks-1.0.1.tgz", + "integrity": "sha512-jT/qyKZ9rzLErtrjGgdkMBn2OP8wl0G3sQlBb3YPryvKHsjvINUhVaPFfP+fpBcOkmrVOVEEHQFJ7nbj2TH2gw==", + "dev": true + }, "@emotion/utils": { "version": "0.11.3", "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-0.11.3.tgz", @@ -3469,6 +3481,26 @@ } } }, + "@figspec/components": { + "version": "0.1.10", + "resolved": "https://registry.npmjs.org/@figspec/components/-/components-0.1.10.tgz", + "integrity": "sha512-1Iy87RbTwwoxpXYLNkYRWpIYc/Ao02+56WVzp7TC9k52h3dv9+TJDvzqFpTmA9v1uaCQqnH4hq4LrJjciYpUoA==", + "dev": true, + "requires": { + "copy-to-clipboard": "^3.0.0", + "lit-element": "^2.4.0", + "lit-html": "^1.1.1" + } + }, + "@figspec/react": { + "version": "0.1.6", + "resolved": "https://registry.npmjs.org/@figspec/react/-/react-0.1.6.tgz", + "integrity": "sha512-oi0JL8uIXgJ+PWRl4LDxJ7WWa80E3jdYmi6wsHAFDq1vT0rKuyhqimEJzCezIrHHz4fXKpNRO98TO7ccma6hjw==", + "dev": true, + "requires": { + "@figspec/components": "^0.1.1" + } + }, "@gar/promisify": { "version": "1.1.3", "resolved": "https://registry.npmjs.org/@gar/promisify/-/promisify-1.1.3.tgz", @@ -4762,6 +4794,12 @@ } } }, + "@juggle/resize-observer": { + "version": "3.4.0", + "resolved": "https://registry.npmjs.org/@juggle/resize-observer/-/resize-observer-3.4.0.tgz", + "integrity": "sha512-dfLbk+PwWvFzSxwk3n5ySL0hfBog779o8h68wK/7/APo/7cgyWp5jcXockbxdk5kFRkbeXWm4Fbi9FrdN381sA==", + "dev": true + }, "@moodlehq/cordova-plugin-camera": { "version": "6.0.0-moodle.2", "resolved": "https://registry.npmjs.org/@moodlehq/cordova-plugin-camera/-/cordova-plugin-camera-6.0.0-moodle.2.tgz", @@ -5611,6 +5649,25 @@ "ts-dedent": "^2.0.0" } }, + "@storybook/addon-viewport": { + "version": "6.1.21", + "resolved": "https://registry.npmjs.org/@storybook/addon-viewport/-/addon-viewport-6.1.21.tgz", + "integrity": "sha512-FrQk0BXCI4HdbBn9+8b+Cp2HvsweZkgW/joKfcF2vVLoasUBB4bl+9uU3HV/3a08glgjPl24caDMPgoRKS90WQ==", + "dev": true, + "requires": { + "@storybook/addons": "6.1.21", + "@storybook/api": "6.1.21", + "@storybook/client-logger": "6.1.21", + "@storybook/components": "6.1.21", + "@storybook/core-events": "6.1.21", + "@storybook/theming": "6.1.21", + "core-js": "^3.0.1", + "global": "^4.3.2", + "memoizerific": "^1.11.3", + "prop-types": "^15.7.2", + "regenerator-runtime": "^0.13.7" + } + }, "@storybook/addons": { "version": "6.1.21", "resolved": "https://registry.npmjs.org/@storybook/addons/-/addons-6.1.21.tgz", @@ -7151,6 +7208,114 @@ "lodash": "^4.17.15" } }, + "@storybook/global": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/@storybook/global/-/global-5.0.0.tgz", + "integrity": "sha512-FcOqPAXACP0I3oJ/ws6/rrPT9WGhu915Cg8D02a9YxLo0DE9zI+a9A5gRGvmQ09fiWPukqI8ZAEoQEdWUKMQdQ==", + "dev": true + }, + "@storybook/manager-api": { + "version": "7.0.24", + "resolved": "https://registry.npmjs.org/@storybook/manager-api/-/manager-api-7.0.24.tgz", + "integrity": "sha512-cBpgDWq8reFgyrv4fBZlZJQyWYb9cDW0LDe476rWn/29uXNvYMNsHRwveLNgSA8Oy1NdyQCgf4ZgcYvY3wpvMA==", + "dev": true, + "requires": { + "@storybook/channels": "7.0.24", + "@storybook/client-logger": "7.0.24", + "@storybook/core-events": "7.0.24", + "@storybook/csf": "^0.1.0", + "@storybook/global": "^5.0.0", + "@storybook/router": "7.0.24", + "@storybook/theming": "7.0.24", + "@storybook/types": "7.0.24", + "dequal": "^2.0.2", + "lodash": "^4.17.21", + "memoizerific": "^1.11.3", + "semver": "^7.3.7", + "store2": "^2.14.2", + "telejson": "^7.0.3", + "ts-dedent": "^2.0.0" + }, + "dependencies": { + "@storybook/channels": { + "version": "7.0.24", + "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-7.0.24.tgz", + "integrity": "sha512-NZVLwMhtzy6cZrNRjshFvMAD9mQTmJDNwhohodSkM/YFCDVFhmxQk9tgizVGh9MwY3CYGJ1SI96RUejGosb49Q==", + "dev": true + }, + "@storybook/client-logger": { + "version": "7.0.24", + "resolved": "https://registry.npmjs.org/@storybook/client-logger/-/client-logger-7.0.24.tgz", + "integrity": "sha512-4zRTb+QQ1hWaRqad/UufZNRfi2d/cf5a40My72Ct97VwjhJFE6aQ3K+hl1Xt6hh8dncDL2JK3cgziw6ElqjT0w==", + "dev": true, + "requires": { + "@storybook/global": "^5.0.0" + } + }, + "@storybook/core-events": { + "version": "7.0.24", + "resolved": "https://registry.npmjs.org/@storybook/core-events/-/core-events-7.0.24.tgz", + "integrity": "sha512-xkf/rihCkhqMeh5EA8lVp90/mzbb2gcg6I3oeFWw2hognVcTnPXg6llhWdU4Spqd0cals7GEFmQugIILCmH8GA==", + "dev": true + }, + "@storybook/csf": { + "version": "0.1.1", + "resolved": "https://registry.npmjs.org/@storybook/csf/-/csf-0.1.1.tgz", + "integrity": "sha512-4hE3AlNVxR60Wc5KSC68ASYzUobjPqtSKyhV6G+ge0FIXU55N5nTY7dXGRZHQGDBPq+XqchMkIdlkHPRs8nTHg==", + "dev": true, + "requires": { + "type-fest": "^2.19.0" + } + }, + "@storybook/router": { + "version": "7.0.24", + "resolved": "https://registry.npmjs.org/@storybook/router/-/router-7.0.24.tgz", + "integrity": "sha512-SRCV+srCZUbko/V0phVN8jY8ilrxQWWAY/gegwNlIYaNqLJSyYqIj739VDmX+deXl6rOEpFLZreClVXWiDU9+w==", + "dev": true, + "requires": { + "@storybook/client-logger": "7.0.24", + "memoizerific": "^1.11.3", + "qs": "^6.10.0" + } + }, + "@storybook/theming": { + "version": "7.0.24", + "resolved": "https://registry.npmjs.org/@storybook/theming/-/theming-7.0.24.tgz", + "integrity": "sha512-CMeCCfqffJ/D5rBl1HpAM/e5Vw0h7ucT+CLzP0ALtLrguz9ZzOiIZYgMj17KpfvWqje7HT+DwEtNkSrnJ01FNQ==", + "dev": true, + "requires": { + "@emotion/use-insertion-effect-with-fallbacks": "^1.0.0", + "@storybook/client-logger": "7.0.24", + "@storybook/global": "^5.0.0", + "memoizerific": "^1.11.3" + } + }, + "qs": { + "version": "6.11.2", + "resolved": "https://registry.npmjs.org/qs/-/qs-6.11.2.tgz", + "integrity": "sha512-tDNIz22aBzCDxLtVH++VnTfzxlfeK5CbqohpSqpJgj1Wg/cQbStNAz3NuqCs5vV+pjBsK4x4pN9HlVh7rcYRiA==", + "dev": true, + "requires": { + "side-channel": "^1.0.4" + } + }, + "telejson": { + "version": "7.1.0", + "resolved": "https://registry.npmjs.org/telejson/-/telejson-7.1.0.tgz", + "integrity": "sha512-jFJO4P5gPebZAERPkJsqMAQ0IMA1Hi0AoSfxpnUaV6j6R2SZqlpkbS20U6dEUtA3RUYt2Ak/mTlkQzHH9Rv/hA==", + "dev": true, + "requires": { + "memoizerific": "^1.11.3" + } + }, + "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 + } + } + }, "@storybook/node-logger": { "version": "6.1.21", "resolved": "https://registry.npmjs.org/@storybook/node-logger/-/node-logger-6.1.21.tgz", @@ -7176,6 +7341,99 @@ } } }, + "@storybook/preview-api": { + "version": "7.0.24", + "resolved": "https://registry.npmjs.org/@storybook/preview-api/-/preview-api-7.0.24.tgz", + "integrity": "sha512-psycU07tuB5nyJvfAJiDN/9e8cjOdJ+5lrCSYC3vPzH86LxADDIN0/8xFb1CaQWcXZsADEFJGpHKWbRhjym5ew==", + "dev": true, + "requires": { + "@storybook/channel-postmessage": "7.0.24", + "@storybook/channels": "7.0.24", + "@storybook/client-logger": "7.0.24", + "@storybook/core-events": "7.0.24", + "@storybook/csf": "^0.1.0", + "@storybook/global": "^5.0.0", + "@storybook/types": "7.0.24", + "@types/qs": "^6.9.5", + "dequal": "^2.0.2", + "lodash": "^4.17.21", + "memoizerific": "^1.11.3", + "qs": "^6.10.0", + "synchronous-promise": "^2.0.15", + "ts-dedent": "^2.0.0", + "util-deprecate": "^1.0.2" + }, + "dependencies": { + "@storybook/channel-postmessage": { + "version": "7.0.24", + "resolved": "https://registry.npmjs.org/@storybook/channel-postmessage/-/channel-postmessage-7.0.24.tgz", + "integrity": "sha512-QLtLXjEeTEwBN/7pB888mBaykmRU9Jy2BitvZuLJWyHHygTYm3vYZOaGR37DT+q/6Ob5GaZ0tURZmCSNDe8IIA==", + "dev": true, + "requires": { + "@storybook/channels": "7.0.24", + "@storybook/client-logger": "7.0.24", + "@storybook/core-events": "7.0.24", + "@storybook/global": "^5.0.0", + "qs": "^6.10.0", + "telejson": "^7.0.3" + } + }, + "@storybook/channels": { + "version": "7.0.24", + "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-7.0.24.tgz", + "integrity": "sha512-NZVLwMhtzy6cZrNRjshFvMAD9mQTmJDNwhohodSkM/YFCDVFhmxQk9tgizVGh9MwY3CYGJ1SI96RUejGosb49Q==", + "dev": true + }, + "@storybook/client-logger": { + "version": "7.0.24", + "resolved": "https://registry.npmjs.org/@storybook/client-logger/-/client-logger-7.0.24.tgz", + "integrity": "sha512-4zRTb+QQ1hWaRqad/UufZNRfi2d/cf5a40My72Ct97VwjhJFE6aQ3K+hl1Xt6hh8dncDL2JK3cgziw6ElqjT0w==", + "dev": true, + "requires": { + "@storybook/global": "^5.0.0" + } + }, + "@storybook/core-events": { + "version": "7.0.24", + "resolved": "https://registry.npmjs.org/@storybook/core-events/-/core-events-7.0.24.tgz", + "integrity": "sha512-xkf/rihCkhqMeh5EA8lVp90/mzbb2gcg6I3oeFWw2hognVcTnPXg6llhWdU4Spqd0cals7GEFmQugIILCmH8GA==", + "dev": true + }, + "@storybook/csf": { + "version": "0.1.1", + "resolved": "https://registry.npmjs.org/@storybook/csf/-/csf-0.1.1.tgz", + "integrity": "sha512-4hE3AlNVxR60Wc5KSC68ASYzUobjPqtSKyhV6G+ge0FIXU55N5nTY7dXGRZHQGDBPq+XqchMkIdlkHPRs8nTHg==", + "dev": true, + "requires": { + "type-fest": "^2.19.0" + } + }, + "qs": { + "version": "6.11.2", + "resolved": "https://registry.npmjs.org/qs/-/qs-6.11.2.tgz", + "integrity": "sha512-tDNIz22aBzCDxLtVH++VnTfzxlfeK5CbqohpSqpJgj1Wg/cQbStNAz3NuqCs5vV+pjBsK4x4pN9HlVh7rcYRiA==", + "dev": true, + "requires": { + "side-channel": "^1.0.4" + } + }, + "telejson": { + "version": "7.1.0", + "resolved": "https://registry.npmjs.org/telejson/-/telejson-7.1.0.tgz", + "integrity": "sha512-jFJO4P5gPebZAERPkJsqMAQ0IMA1Hi0AoSfxpnUaV6j6R2SZqlpkbS20U6dEUtA3RUYt2Ak/mTlkQzHH9Rv/hA==", + "dev": true, + "requires": { + "memoizerific": "^1.11.3" + } + }, + "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 + } + } + }, "@storybook/router": { "version": "6.1.21", "resolved": "https://registry.npmjs.org/@storybook/router/-/router-6.1.21.tgz", @@ -7229,6 +7487,53 @@ } } }, + "@storybook/types": { + "version": "7.0.24", + "resolved": "https://registry.npmjs.org/@storybook/types/-/types-7.0.24.tgz", + "integrity": "sha512-SZh/XBHP1TT5bmEk0W52nT0v6fUnYwmZVls3da5noutdgOAiwL7TANtl41XrNjG+UDr8x0OE3PVVJi+LhwUaNA==", + "dev": true, + "requires": { + "@storybook/channels": "7.0.24", + "@types/babel__core": "^7.0.0", + "@types/express": "^4.7.0", + "file-system-cache": "2.3.0" + }, + "dependencies": { + "@storybook/channels": { + "version": "7.0.24", + "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-7.0.24.tgz", + "integrity": "sha512-NZVLwMhtzy6cZrNRjshFvMAD9mQTmJDNwhohodSkM/YFCDVFhmxQk9tgizVGh9MwY3CYGJ1SI96RUejGosb49Q==", + "dev": true + }, + "file-system-cache": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/file-system-cache/-/file-system-cache-2.3.0.tgz", + "integrity": "sha512-l4DMNdsIPsVnKrgEXbJwDJsA5mB8rGwHYERMgqQx/xAUtChPJMre1bXBzDEqqVbWv9AIbFezXMxeEkZDSrXUOQ==", + "dev": true, + "requires": { + "fs-extra": "11.1.1", + "ramda": "0.29.0" + } + }, + "fs-extra": { + "version": "11.1.1", + "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.1.1.tgz", + "integrity": "sha512-MGIE4HOvQCeUCzmlHs0vXpih4ysz4wg9qiSAu6cd42lVwPbTM1TjV7RusoyQqMmk/95gdQZX72u+YW+c3eEpFQ==", + "dev": true, + "requires": { + "graceful-fs": "^4.2.0", + "jsonfile": "^6.0.1", + "universalify": "^2.0.0" + } + }, + "ramda": { + "version": "0.29.0", + "resolved": "https://registry.npmjs.org/ramda/-/ramda-0.29.0.tgz", + "integrity": "sha512-BBea6L67bYLtdbOqfp8f58fPMqEwx0doL+pAi8TZyp2YWz8R9G8z9x75CZI8W+ftqhFHCpEX2cRnUUXK130iKA==", + "dev": true + } + } + }, "@storybook/ui": { "version": "6.1.21", "resolved": "https://registry.npmjs.org/@storybook/ui/-/ui-6.1.21.tgz", @@ -7382,6 +7687,16 @@ "@babel/types": "^7.20.7" } }, + "@types/body-parser": { + "version": "1.19.2", + "resolved": "https://registry.npmjs.org/@types/body-parser/-/body-parser-1.19.2.tgz", + "integrity": "sha512-ALYone6pm6QmwZoAgeyNksccT9Q4AWZQ6PvfwR37GT6r6FWUPguq6sUmNGSMV2Wr761oQoBxwGGa6DR5o1DC9g==", + "dev": true, + "requires": { + "@types/connect": "*", + "@types/node": "*" + } + }, "@types/braces": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/@types/braces/-/braces-3.0.1.tgz", @@ -7396,6 +7711,15 @@ "moment": "^2.10.2" } }, + "@types/connect": { + "version": "3.4.35", + "resolved": "https://registry.npmjs.org/@types/connect/-/connect-3.4.35.tgz", + "integrity": "sha512-cdeYyv4KWoEgpBISTxWvqYsVy444DOqehiF3fM3ne10AmJ62RSyNkUnxMJXHQWRQQX2eR94m5y1IZyDwBjV9FQ==", + "dev": true, + "requires": { + "@types/node": "*" + } + }, "@types/cordova": { "version": "0.0.34", "resolved": "https://registry.npmjs.org/@types/cordova/-/cordova-0.0.34.tgz", @@ -7406,6 +7730,30 @@ "resolved": "https://registry.npmjs.org/@types/dom-mediacapture-record/-/dom-mediacapture-record-1.0.7.tgz", "integrity": "sha512-ddDIRTO1ajtbxaNo2o7fPJggpN54PZf1ZUJKOjto2ENMJE/9GKUvaw3ZRuQzlS/p0E+PnIcssxfoqYJ4yiXSBw==" }, + "@types/express": { + "version": "4.17.17", + "resolved": "https://registry.npmjs.org/@types/express/-/express-4.17.17.tgz", + "integrity": "sha512-Q4FmmuLGBG58btUnfS1c1r/NQdlp3DMfGDGig8WhfpA2YRUtEkxAjkZb0yvplJGYdF1fsQ81iMDcH24sSCNC/Q==", + "dev": true, + "requires": { + "@types/body-parser": "*", + "@types/express-serve-static-core": "^4.17.33", + "@types/qs": "*", + "@types/serve-static": "*" + } + }, + "@types/express-serve-static-core": { + "version": "4.17.35", + "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.17.35.tgz", + "integrity": "sha512-wALWQwrgiB2AWTT91CB62b6Yt0sNHpznUXeZEcnPU3DRdlDIz74x8Qg1UUYKSVFi+va5vKOLYRBI1bRKiLLKIg==", + "dev": true, + "requires": { + "@types/node": "*", + "@types/qs": "*", + "@types/range-parser": "*", + "@types/send": "*" + } + }, "@types/faker": { "version": "5.5.9", "resolved": "https://registry.npmjs.org/@types/faker/-/faker-5.5.9.tgz", @@ -7461,6 +7809,12 @@ "integrity": "sha512-h4lTMgMJctJybDp8CQrxTUiiYmedihHWkjnF/8Pxseu2S6Nlfcy8kwboQ8yejh456rP2yWoEVm1sS/FVsfM48w==", "dev": true }, + "@types/http-errors": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/@types/http-errors/-/http-errors-2.0.1.tgz", + "integrity": "sha512-/K3ds8TRAfBvi5vfjuz8y6+GiAYBZ0x4tXv1Av6CWBWn0IlADc+ZX9pMq7oU0fNQPnBwIZl3rmeLp6SBApbxSQ==", + "dev": true + }, "@types/is-function": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/@types/is-function/-/is-function-1.0.1.tgz", @@ -7522,6 +7876,12 @@ "@types/react": "*" } }, + "@types/marked": { + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/@types/marked/-/marked-4.3.1.tgz", + "integrity": "sha512-vSSbKZFbNktrQ15v7o1EaH78EbWV+sPQbPjHG+Cp8CaNcPFUEfjZ0Iml/V0bFDwsTlYe8o6XC5Hfdp91cqPV2g==", + "dev": true + }, "@types/micromatch": { "version": "4.0.2", "resolved": "https://registry.npmjs.org/@types/micromatch/-/micromatch-4.0.2.tgz", @@ -7531,6 +7891,12 @@ "@types/braces": "*" } }, + "@types/mime": { + "version": "1.3.2", + "resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.2.tgz", + "integrity": "sha512-YATxVxgRqNH6nHEIsvg6k2Boc1JHI9ZbH5iWFFv/MTkchz3b1ieGDa5T0a9RznNdI0KhVbdbWSN+KWWrQZRxTw==", + "dev": true + }, "@types/minimatch": { "version": "5.1.2", "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-5.1.2.tgz", @@ -7614,6 +7980,12 @@ "integrity": "sha512-FGa1F62FT09qcrueBA6qYTrJPVDzah9a+493+o2PCXsesWHIn27G98TsSMs3WPNbZIEj4+VJf6saSFpvD+3Zsw==", "dev": true }, + "@types/range-parser": { + "version": "1.2.4", + "resolved": "https://registry.npmjs.org/@types/range-parser/-/range-parser-1.2.4.tgz", + "integrity": "sha512-EEhsLsD6UsDM1yFhAvy0Cjr6VwmpMWqFBCb9w07wVugF7w9nfajxLuVmngTIpgS6svCnm6Vaw+MZhoDCKnOfsw==", + "dev": true + }, "@types/reach__router": { "version": "1.3.11", "resolved": "https://registry.npmjs.org/@types/reach__router/-/reach__router-1.3.11.tgz", @@ -7624,9 +7996,9 @@ } }, "@types/react": { - "version": "18.2.11", - "resolved": "https://registry.npmjs.org/@types/react/-/react-18.2.11.tgz", - "integrity": "sha512-+hsJr9hmwyDecSMQAmX7drgbDpyE+EgSF6t7+5QEBAn1tQK7kl1vWZ4iRf6SjQ8lk7dyEULxUmZOIpN0W5baZA==", + "version": "18.2.14", + "resolved": "https://registry.npmjs.org/@types/react/-/react-18.2.14.tgz", + "integrity": "sha512-A0zjq+QN/O0Kpe30hA1GidzyFjatVvrpIvWLxD+xv67Vt91TWWgco9IvrJBkeyHm1trGaFS/FSGqPlhyeZRm0g==", "dev": true, "requires": { "@types/prop-types": "*", @@ -7674,6 +8046,27 @@ "integrity": "sha512-5cJ8CB4yAx7BH1oMvdU0Jh9lrEXyPkar6F9G/ERswkCuvP4KQZfZkSjcMbAICCpQTN4OuZn8tz0HiKv9TGZgrQ==", "dev": true }, + "@types/send": { + "version": "0.17.1", + "resolved": "https://registry.npmjs.org/@types/send/-/send-0.17.1.tgz", + "integrity": "sha512-Cwo8LE/0rnvX7kIIa3QHCkcuF21c05Ayb0ZfxPiv0W8VRiZiNW/WuRupHKpqqGVGf7SUA44QSOUKaEd9lIrd/Q==", + "dev": true, + "requires": { + "@types/mime": "^1", + "@types/node": "*" + } + }, + "@types/serve-static": { + "version": "1.15.2", + "resolved": "https://registry.npmjs.org/@types/serve-static/-/serve-static-1.15.2.tgz", + "integrity": "sha512-J2LqtvFYCzaj8pVYKw8klQXrLLk7TBZmQ4ShlcdkELFKGwGMfevMLneMMRkMgZxotOD9wg497LpC7O8PcvAmfw==", + "dev": true, + "requires": { + "@types/http-errors": "*", + "@types/mime": "*", + "@types/node": "*" + } + }, "@types/slice-ansi": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/@types/slice-ansi/-/slice-ansi-4.0.0.tgz", @@ -8474,18 +8867,11 @@ "dev": true }, "android-versions": { - "version": "1.8.1", - "resolved": "https://registry.npmjs.org/android-versions/-/android-versions-1.8.1.tgz", - "integrity": "sha512-5a0YyylAk6pPM2Ezi0vWaPPNbS6tSNRs+micbgk5NpHEN5YW1ez+T94G5orysfwBEBDMHoxm5GNc5ZDUPgRrhw==", + "version": "1.8.2", + "resolved": "https://registry.npmjs.org/android-versions/-/android-versions-1.8.2.tgz", + "integrity": "sha512-2MT/Y/mR3BLSbR9E3ugwvE/aA4k84XtjG2Iusu4pRKt4FwfpEvIEAHzm7ZBhL3/aTVNdx3PzZ+sAiK+Dbc4r9A==", "requires": { - "semver": "^5.7.1" - }, - "dependencies": { - "semver": { - "version": "5.7.1", - "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz", - "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==" - } + "semver": "^7.5.2" } }, "ansi": { @@ -9804,25 +10190,6 @@ "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==", "dev": true }, - "bindings": { - "version": "1.5.0", - "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz", - "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==", - "dev": true, - "optional": true, - "requires": { - "file-uri-to-path": "1.0.0" - }, - "dependencies": { - "file-uri-to-path": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz", - "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==", - "dev": true, - "optional": true - } - } - }, "bl": { "version": "4.1.0", "resolved": "https://registry.npmjs.org/bl/-/bl-4.1.0.tgz", @@ -10134,13 +10501,13 @@ } }, "browserslist": { - "version": "4.21.7", - "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.21.7.tgz", - "integrity": "sha512-BauCXrQ7I2ftSqd2mvKHGo85XR0u7Ru3C/Hxsy/0TkfCtjrmAbPdzLGasmoiBxplpDXlPvdjX9u7srIMfgasNA==", + "version": "4.21.9", + "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.21.9.tgz", + "integrity": "sha512-M0MFoZzbUrRU4KNfCrDLnvyE7gub+peetoTid3TBIqtunaDJyXlwhakT+/VkvSXcfIzFfK/nkCs4nmyTmxdNSg==", "dev": true, "requires": { - "caniuse-lite": "^1.0.30001489", - "electron-to-chromium": "^1.4.411", + "caniuse-lite": "^1.0.30001503", + "electron-to-chromium": "^1.4.431", "node-releases": "^2.0.12", "update-browserslist-db": "^1.0.11" } @@ -10372,9 +10739,9 @@ } }, "caniuse-lite": { - "version": "1.0.30001502", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001502.tgz", - "integrity": "sha512-AZ+9tFXw1sS0o0jcpJQIXvFTOB/xGiQ4OQ2t98QX3NDn2EZTSRBC801gxrsGgViuq2ak/NLkNgSNEPtCr5lfKg==", + "version": "1.0.30001509", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001509.tgz", + "integrity": "sha512-2uDDk+TRiTX5hMcUYT/7CSyzMZxjfGu0vAUjS2g0LSD8UoXOv0LtpH4LxGMemsiPq6LCVIUjNwVM0erkOkGCDA==", "dev": true }, "canonical-path": { @@ -13991,6 +14358,12 @@ "integrity": "sha512-KqtH4/EZdtdfWX0p6MGP9jljvxSY6msy/pRUD4jgNwVpv3v1QmNLlsB3LDSSUg79BRVSn7jI1QPRtArGABovAQ==", "dev": true }, + "dequal": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/dequal/-/dequal-2.0.3.tgz", + "integrity": "sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==", + "dev": true + }, "des.js": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/des.js/-/des.js-1.1.0.tgz", @@ -14355,9 +14728,9 @@ } }, "electron-to-chromium": { - "version": "1.4.427", - "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.427.tgz", - "integrity": "sha512-HK3r9l+Jm8dYAm1ctXEWIC+hV60zfcjS9UA5BDlYvnI5S7PU/yytjpvSrTNrSSRRkuu3tDyZhdkwIczh+0DWaw==", + "version": "1.4.442", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.442.tgz", + "integrity": "sha512-RkrZF//Ya+0aJq2NM3OdisNh5ZodZq1rdXOS96G8DdDgpDKqKE81yTbbQ3F/4CKm1JBPsGu1Lp/akkna2xO06Q==", "dev": true }, "element-resize-detector": { @@ -14930,17 +15303,17 @@ } }, "optionator": { - "version": "0.9.1", - "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.1.tgz", - "integrity": "sha512-74RlY5FCnhq4jRxVUPKDaRwrVNXMqsGsiW6AJw4XK8hmtm10wC0ypZBLw5IIp85NZMr91+qd1RvvENwg7jjRFw==", + "version": "0.9.3", + "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.3.tgz", + "integrity": "sha512-JjCoypp+jKn1ttEFExxhetCKeJt9zhAgAve5FXHixTvFDW/5aEktX9bufBKLRRMdU7bNtpLfcGu94B3cdEJgjg==", "dev": true, "requires": { + "@aashutoshrathi/word-wrap": "^1.2.3", "deep-is": "^0.1.3", "fast-levenshtein": "^2.0.6", "levn": "^0.4.1", "prelude-ls": "^1.2.1", - "type-check": "^0.4.0", - "word-wrap": "^1.2.3" + "type-check": "^0.4.0" } }, "prelude-ls": { @@ -16895,11 +17268,7 @@ "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz", "integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==", "dev": true, - "optional": true, - "requires": { - "bindings": "^1.5.0", - "nan": "^2.12.1" - } + "optional": true }, "glob-parent": { "version": "3.1.0", @@ -20339,9 +20708,9 @@ }, "dependencies": { "acorn": { - "version": "8.8.2", - "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.8.2.tgz", - "integrity": "sha512-xjIYgE8HBrkpd/sJqOGNspf8uHG+NOHGOw6a/Urj8taM2EXfdNAH2oFcPeIFfsv3+kz/mJrS5VuMqbNLjCa2vw==", + "version": "8.9.0", + "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.9.0.tgz", + "integrity": "sha512-jaVNAFBHNLXspO543WnNNPZFRtavh3skAkITqD0/2aeMkKZTN+254PyhwxFYrk3vQ1xfY+2wbesJMs/JC8/PwQ==", "dev": true }, "escodegen": { @@ -20814,6 +21183,21 @@ "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==", "dev": true }, + "lit-element": { + "version": "2.5.1", + "resolved": "https://registry.npmjs.org/lit-element/-/lit-element-2.5.1.tgz", + "integrity": "sha512-ogu7PiJTA33bEK0xGu1dmaX5vhcRjBXCFexPja0e7P7jqLhTpNKYRPmE+GmiCaRVAbiQKGkUgkh/i6+bh++dPQ==", + "dev": true, + "requires": { + "lit-html": "^1.1.1" + } + }, + "lit-html": { + "version": "1.4.1", + "resolved": "https://registry.npmjs.org/lit-html/-/lit-html-1.4.1.tgz", + "integrity": "sha512-B9btcSgPYb1q4oSOb/PrOT6Z/H+r6xuNzfH4lFli/AWhYwdtrgQkQWBbIc6mdnf6E2IL3gDXdkkqNktpU0OZQA==", + "dev": true + }, "load-json-file": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz", @@ -21229,6 +21613,12 @@ "unquote": "^1.1.0" } }, + "marked": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/marked/-/marked-4.3.0.tgz", + "integrity": "sha512-PRsaiG84bK+AMvxziE/lCFss8juXjNaWzVbN5tXAm4XjeaS9NAHhop+PjQxz2A9h8Q4M/xGmzP8vqNwy6JeK0A==", + "dev": true + }, "matchdep": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/matchdep/-/matchdep-2.0.0.tgz", @@ -21889,13 +22279,6 @@ "global": "^4.4.0" } }, - "nan": { - "version": "2.17.0", - "resolved": "https://registry.npmjs.org/nan/-/nan-2.17.0.tgz", - "integrity": "sha512-2ZTgtl0nJsO0KQCjEpxcIr5D+Yv90plTitZt9JBfQvVJDS5seMl3FOvsh3+9CoYWXf/1l5OaZzzF6nDm4cagaQ==", - "dev": true, - "optional": true - }, "nanomatch": { "version": "1.2.13", "resolved": "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.13.tgz", @@ -23330,9 +23713,9 @@ } }, "pirates": { - "version": "4.0.5", - "resolved": "https://registry.npmjs.org/pirates/-/pirates-4.0.5.tgz", - "integrity": "sha512-8V9+HQPupnaXMA23c5hvl69zXvTwTzyAYasnkb0Tts4XvO4CliqONMOnvlq26rkhLC3nWDFBJf73LU1e1VZLaQ==", + "version": "4.0.6", + "resolved": "https://registry.npmjs.org/pirates/-/pirates-4.0.6.tgz", + "integrity": "sha512-saLsH7WeYYPiD25LDuLRRY/i+6HaPYr6G1OUlN39otzkSTxKnubR9RTxS3/Kk50s1g2JTgFwWQDQyplC5/SHZg==", "dev": true }, "pkcs7": { @@ -24988,9 +25371,9 @@ } }, "react-textarea-autosize": { - "version": "8.4.1", - "resolved": "https://registry.npmjs.org/react-textarea-autosize/-/react-textarea-autosize-8.4.1.tgz", - "integrity": "sha512-aD2C+qK6QypknC+lCMzteOdIjoMbNlgSFmJjCV+DrfTPwp59i/it9mMNf2HDzvRjQgKAyBDPyLJhcrzElf2U4Q==", + "version": "8.5.0", + "resolved": "https://registry.npmjs.org/react-textarea-autosize/-/react-textarea-autosize-8.5.0.tgz", + "integrity": "sha512-cp488su3U9RygmHmGpJp0KEt0i/+57KCK33XVPH+50swVRBhIZYh0fGduz2YLKXwl9vSKBZ9HUXcg9PQXUXqIw==", "dev": true, "requires": { "@babel/runtime": "^7.20.13", @@ -26382,9 +26765,9 @@ } }, "semver": { - "version": "7.5.1", - "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.1.tgz", - "integrity": "sha512-Wvss5ivl8TMRZXXESstBA4uR5iXgEN/VC5/sOcuXdVLzcdkz4HWetIoRfG5gb5X+ij/G9rw9YoGn3QoQ8OCSpw==", + "version": "7.5.3", + "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.3.tgz", + "integrity": "sha512-QBlUtyVk/5EeHbi7X0fw6liDZc7BBmEaSYn01fMU1OUYbf6GPsbTtd8WmnqbI20SeycoHSeiybkE/q1Q+qlThQ==", "requires": { "lru-cache": "^6.0.0" } @@ -27377,6 +27760,118 @@ "integrity": "sha512-siT1RiqlfQnGqgT/YzXVUNsom9S0H1OX+dpdGN1xkyYATo4I6sep5NmsRD/40s3IIOvlCq6akxkqG82urIZW1w==", "dev": true }, + "storybook-addon-designs": { + "version": "6.1.0", + "resolved": "https://registry.npmjs.org/storybook-addon-designs/-/storybook-addon-designs-6.1.0.tgz", + "integrity": "sha512-S7Av7MACRP3XtUeD4gHF/g3Ov+3WQ0KyJPqsjv4KFAZlP7CQXu2DkC/w9532OqTJV2C7ksCbi5XBrm5tbwMx3g==", + "dev": true, + "requires": { + "@figspec/react": "^0.1.6" + } + }, + "storybook-addon-rtl-direction": { + "version": "0.0.19", + "resolved": "https://registry.npmjs.org/storybook-addon-rtl-direction/-/storybook-addon-rtl-direction-0.0.19.tgz", + "integrity": "sha512-0WPyRF0p+zlSqUj9f3HrTzTprSdmNvAmIaKeuH41B/lXP1zezMtxPa23pDepKe0y3+gV4PfsVo4wy07z0odGug==", + "dev": true + }, + "storybook-dark-mode": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/storybook-dark-mode/-/storybook-dark-mode-3.0.0.tgz", + "integrity": "sha512-aeAvqP/mmdccEiCsvx6aw3M0i7mZSiXROsrAsEQN8vl1lAg3FZN+y3Xu/f+ye59wLMRuKJC/JBp7E3/H7vLBRQ==", + "dev": true, + "requires": { + "@storybook/addons": "^7.0.0", + "@storybook/api": "^7.0.0", + "@storybook/components": "^7.0.0", + "@storybook/core-events": "^7.0.0", + "@storybook/global": "^5.0.0", + "@storybook/theming": "^7.0.0", + "fast-deep-equal": "^3.1.3", + "memoizerific": "^1.11.3" + }, + "dependencies": { + "@storybook/addons": { + "version": "7.0.24", + "resolved": "https://registry.npmjs.org/@storybook/addons/-/addons-7.0.24.tgz", + "integrity": "sha512-e15hORnOD0ugvOVOTyZyLJhbDTWa4G1OHVUlboazy8O4TSvAXNBdLV1wOdY5RGoGD6Z5A4iR/gZXM0qc6Fh9xg==", + "dev": true, + "requires": { + "@storybook/manager-api": "7.0.24", + "@storybook/preview-api": "7.0.24", + "@storybook/types": "7.0.24" + } + }, + "@storybook/api": { + "version": "7.0.24", + "resolved": "https://registry.npmjs.org/@storybook/api/-/api-7.0.24.tgz", + "integrity": "sha512-rjWZgBbt43Ma5Vg2RwK9FtiF9ZkLRT+vOfDFtRL1PQkOIUlYlm33dOdPTh+HrW5QMO9cj/cchqmzU2AtgEZCyw==", + "dev": true, + "requires": { + "@storybook/client-logger": "7.0.24", + "@storybook/manager-api": "7.0.24" + } + }, + "@storybook/client-logger": { + "version": "7.0.24", + "resolved": "https://registry.npmjs.org/@storybook/client-logger/-/client-logger-7.0.24.tgz", + "integrity": "sha512-4zRTb+QQ1hWaRqad/UufZNRfi2d/cf5a40My72Ct97VwjhJFE6aQ3K+hl1Xt6hh8dncDL2JK3cgziw6ElqjT0w==", + "dev": true, + "requires": { + "@storybook/global": "^5.0.0" + } + }, + "@storybook/components": { + "version": "7.0.24", + "resolved": "https://registry.npmjs.org/@storybook/components/-/components-7.0.24.tgz", + "integrity": "sha512-Pu7zGurCyWyiuFl2Pb5gybHA0f4blmHuVqccbMqnUw4Ew80BRu8AqfhNqN2hNdxFCx0mmy0baRGVftx76rNZ0w==", + "dev": true, + "requires": { + "@storybook/client-logger": "7.0.24", + "@storybook/csf": "^0.1.0", + "@storybook/global": "^5.0.0", + "@storybook/theming": "7.0.24", + "@storybook/types": "7.0.24", + "memoizerific": "^1.11.3", + "use-resize-observer": "^9.1.0", + "util-deprecate": "^1.0.2" + } + }, + "@storybook/core-events": { + "version": "7.0.24", + "resolved": "https://registry.npmjs.org/@storybook/core-events/-/core-events-7.0.24.tgz", + "integrity": "sha512-xkf/rihCkhqMeh5EA8lVp90/mzbb2gcg6I3oeFWw2hognVcTnPXg6llhWdU4Spqd0cals7GEFmQugIILCmH8GA==", + "dev": true + }, + "@storybook/csf": { + "version": "0.1.1", + "resolved": "https://registry.npmjs.org/@storybook/csf/-/csf-0.1.1.tgz", + "integrity": "sha512-4hE3AlNVxR60Wc5KSC68ASYzUobjPqtSKyhV6G+ge0FIXU55N5nTY7dXGRZHQGDBPq+XqchMkIdlkHPRs8nTHg==", + "dev": true, + "requires": { + "type-fest": "^2.19.0" + } + }, + "@storybook/theming": { + "version": "7.0.24", + "resolved": "https://registry.npmjs.org/@storybook/theming/-/theming-7.0.24.tgz", + "integrity": "sha512-CMeCCfqffJ/D5rBl1HpAM/e5Vw0h7ucT+CLzP0ALtLrguz9ZzOiIZYgMj17KpfvWqje7HT+DwEtNkSrnJ01FNQ==", + "dev": true, + "requires": { + "@emotion/use-insertion-effect-with-fallbacks": "^1.0.0", + "@storybook/client-logger": "7.0.24", + "@storybook/global": "^5.0.0", + "memoizerific": "^1.11.3" + } + }, + "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 + } + } + }, "stream-browserify": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.2.tgz", @@ -27917,10 +28412,16 @@ "object.getownpropertydescriptors": "^2.1.2" } }, + "synchronous-promise": { + "version": "2.0.17", + "resolved": "https://registry.npmjs.org/synchronous-promise/-/synchronous-promise-2.0.17.tgz", + "integrity": "sha512-AsS729u2RHUfEra9xJrE39peJcc2stq2+poBXX8bcM08Y6g9j/i/PUzwNQqkaJde7Ntg1TO7bSREbR5sdosQ+g==", + "dev": true + }, "systeminformation": { - "version": "5.18.3", - "resolved": "https://registry.npmjs.org/systeminformation/-/systeminformation-5.18.3.tgz", - "integrity": "sha512-k+gk7zSi0hI/m3Mgu1OzR8j9BfXMDYa2HUMBdEQZUVCVAO326kDrzrvtVMljiSoDs6T6ojI0AHneDn8AMa0Y6A==" + "version": "5.18.5", + "resolved": "https://registry.npmjs.org/systeminformation/-/systeminformation-5.18.5.tgz", + "integrity": "sha512-es2jgMdpjNv9B/sQc0afGlnS2ip7/Nzlo9hAgkaq22NZftQuqHTnf/CuBadzOwl/DZB2aCTLDtzw83nAnT2owg==" }, "table": { "version": "5.4.6", @@ -28163,9 +28664,9 @@ }, "dependencies": { "acorn": { - "version": "8.8.2", - "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.8.2.tgz", - "integrity": "sha512-xjIYgE8HBrkpd/sJqOGNspf8uHG+NOHGOw6a/Urj8taM2EXfdNAH2oFcPeIFfsv3+kz/mJrS5VuMqbNLjCa2vw==", + "version": "8.9.0", + "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.9.0.tgz", + "integrity": "sha512-jaVNAFBHNLXspO543WnNNPZFRtavh3skAkITqD0/2aeMkKZTN+254PyhwxFYrk3vQ1xfY+2wbesJMs/JC8/PwQ==", "dev": true }, "jest-worker": { @@ -28189,9 +28690,9 @@ } }, "schema-utils": { - "version": "3.2.0", - "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.2.0.tgz", - "integrity": "sha512-0zTyLGyDJYd/MBxG1AhJkKa6fpEBds4OQO2ut0w7OYG+ZGhGea09lijvzsqegYSik88zc7cUtIlnnO+/BvD6gQ==", + "version": "3.3.0", + "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.3.0.tgz", + "integrity": "sha512-pN/yOAvcC+5rQ5nERGuwrjLlYvLTbCibnZ1I7B1LaiAz9BRBlE9GMgE/eqV30P7aJQUf7Ddimy/RsbYO/GrVGg==", "dev": true, "requires": { "@types/json-schema": "^7.0.8", @@ -28225,9 +28726,9 @@ } }, "terser": { - "version": "5.17.7", - "resolved": "https://registry.npmjs.org/terser/-/terser-5.17.7.tgz", - "integrity": "sha512-/bi0Zm2C6VAexlGgLlVxA0P2lru/sdLyfCVaRMfKVo9nWxbmz7f/sD8VPybPeSUJaJcwmCJis9pBIhcVcG1QcQ==", + "version": "5.18.2", + "resolved": "https://registry.npmjs.org/terser/-/terser-5.18.2.tgz", + "integrity": "sha512-Ah19JS86ypbJzTzvUCX7KOsEIhDaRONungA4aYBjEP3JZRf4ocuDzTg4QWZnPn9DEMiMYGJPiSOy7aykoCc70w==", "dev": true, "requires": { "@jridgewell/source-map": "^0.3.3", @@ -28644,9 +29145,9 @@ } }, "enhanced-resolve": { - "version": "5.14.1", - "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.14.1.tgz", - "integrity": "sha512-Vklwq2vDKtl0y/vtwjSesgJ5MYS7Etuk5txS8VdKL4AOS1aUlD96zqIfsOSLQsdv3xgMRbtkWM8eG9XDfKUPow==", + "version": "5.15.0", + "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.15.0.tgz", + "integrity": "sha512-LXYT42KJ7lpIKECr2mAXIaMldcNCh/7E0KBKOu4KSfkHmP+mZmSs+8V5gBAqisWBy0OO4W5Oyys0GO1Y8KtdKg==", "dev": true, "requires": { "graceful-fs": "^4.2.4", @@ -28662,9 +29163,9 @@ } }, "tslib": { - "version": "2.5.3", - "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.3.tgz", - "integrity": "sha512-mSxlJJwl3BMEQCUNnxXBU9jP4JBktcEGhURcPR6VQVlnP0FdDEsIaz0C35dXNGLyRfrATNofF0F5p2KPxQgB+w==" + "version": "2.6.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.0.tgz", + "integrity": "sha512-7At1WUettjcSRHXCyYtTselblcHl9PJFFVKiCAy/bY97+BPZXSQ2wbq0P9s8tK2G7dFQfNnlJnPAiArVBVBsfA==" }, "tsutils": { "version": "3.21.0", @@ -29140,9 +29641,9 @@ }, "dependencies": { "schema-utils": { - "version": "3.2.0", - "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.2.0.tgz", - "integrity": "sha512-0zTyLGyDJYd/MBxG1AhJkKa6fpEBds4OQO2ut0w7OYG+ZGhGea09lijvzsqegYSik88zc7cUtIlnnO+/BvD6gQ==", + "version": "3.3.0", + "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.3.0.tgz", + "integrity": "sha512-pN/yOAvcC+5rQ5nERGuwrjLlYvLTbCibnZ1I7B1LaiAz9BRBlE9GMgE/eqV30P7aJQUf7Ddimy/RsbYO/GrVGg==", "dev": true, "requires": { "@types/json-schema": "^7.0.8", @@ -29201,6 +29702,15 @@ "use-isomorphic-layout-effect": "^1.1.1" } }, + "use-resize-observer": { + "version": "9.1.0", + "resolved": "https://registry.npmjs.org/use-resize-observer/-/use-resize-observer-9.1.0.tgz", + "integrity": "sha512-R25VqO9Wb3asSD4eqtcxk8sJalvIOYBqS8MNZlpDSQ4l4xMQxC/J7Id9HoTqPq8FwULIn0PVW+OAqF2dyYbjow==", + "dev": true, + "requires": { + "@juggle/resize-observer": "^3.3.1" + } + }, "util": { "version": "0.10.3", "resolved": "https://registry.npmjs.org/util/-/util-0.10.3.tgz", @@ -29457,9 +29967,9 @@ }, "dependencies": { "acorn": { - "version": "8.8.2", - "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.8.2.tgz", - "integrity": "sha512-xjIYgE8HBrkpd/sJqOGNspf8uHG+NOHGOw6a/Urj8taM2EXfdNAH2oFcPeIFfsv3+kz/mJrS5VuMqbNLjCa2vw==", + "version": "8.9.0", + "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.9.0.tgz", + "integrity": "sha512-jaVNAFBHNLXspO543WnNNPZFRtavh3skAkITqD0/2aeMkKZTN+254PyhwxFYrk3vQ1xfY+2wbesJMs/JC8/PwQ==", "dev": true } } @@ -29639,11 +30149,7 @@ "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz", "integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==", "dev": true, - "optional": true, - "requires": { - "bindings": "^1.5.0", - "nan": "^2.12.1" - } + "optional": true }, "glob-parent": { "version": "3.1.0", @@ -30273,11 +30779,7 @@ "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz", "integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==", "dev": true, - "optional": true, - "requires": { - "bindings": "^1.5.0", - "nan": "^2.12.1" - } + "optional": true }, "glob-parent": { "version": "3.1.0", @@ -30430,9 +30932,9 @@ "dev": true }, "webpack-hot-middleware": { - "version": "2.25.3", - "resolved": "https://registry.npmjs.org/webpack-hot-middleware/-/webpack-hot-middleware-2.25.3.tgz", - "integrity": "sha512-IK/0WAHs7MTu1tzLTjio73LjS3Ov+VvBKQmE8WPlJutgG5zT6Urgq/BbAdRrHTRpyzK0dvAvFh1Qg98akxgZpA==", + "version": "2.25.4", + "resolved": "https://registry.npmjs.org/webpack-hot-middleware/-/webpack-hot-middleware-2.25.4.tgz", + "integrity": "sha512-IRmTspuHM06aZh98OhBJtqLpeWFM8FXJS5UYpKYxCJzyFoyWj1w6VGFfomZU7OPA55dMLrQK0pRT1eQ3PACr4w==", "dev": true, "requires": { "ansi-html-community": "0.0.8", @@ -30453,9 +30955,9 @@ "dev": true }, "html-entities": { - "version": "2.3.5", - "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-2.3.5.tgz", - "integrity": "sha512-72TJlcMkYsEJASa/3HnX7VT59htM7iSHbH59NSZbtc+22Ap0Txnlx91sfeB+/A7wNZg7UxtZdhAW4y+/jimrdg==", + "version": "2.4.0", + "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-2.4.0.tgz", + "integrity": "sha512-igBTJcNNNhvZFRtm8uA6xMY6xYleeDwn3PeBCkDz7tHttv4F2hsDI2aPgNERWzvRcNYHNT3ymRaQzllmXj4YsQ==", "dev": true }, "strip-ansi": { diff --git a/package.json b/package.json index 0b62e4e83..643db22fe 100644 --- a/package.json +++ b/package.json @@ -149,9 +149,11 @@ "@ionic/angular-toolkit": "^2.3.3", "@ionic/cli": "^6.19.0", "@storybook/addon-controls": "~6.1.21", + "@storybook/addon-viewport": "~6.1.21", "@storybook/angular": "~6.1.21", "@types/faker": "^5.1.3", "@types/jest": "^26.0.24", + "@types/marked": "^4.3.1", "@types/node": "^12.12.64", "@types/resize-observer-browser": "^0.1.5", "@types/webpack-env": "^1.16.0", @@ -183,9 +185,13 @@ "jest-preset-angular": "^8.3.1", "jest-raw-loader": "^1.0.1", "jsonc-parser": "^2.3.1", + "marked": "^4.3.0", "minimatch": "^5.1.0", "native-run": "^1.4.0", "patch-package": "^6.5.0", + "storybook-addon-designs": "~6.1.0", + "storybook-addon-rtl-direction": "0.0.19", + "storybook-dark-mode": "^3.0.0", "terser-webpack-plugin": "^4.2.3", "ts-jest": "^26.4.1", "ts-node": "~8.3.0", diff --git a/src/core/components/empty-box/empty-box.scss b/src/core/components/empty-box/empty-box.scss index 5f333fb36..86fe96d48 100644 --- a/src/core/components/empty-box/empty-box.scss +++ b/src/core/components/empty-box/empty-box.scss @@ -1,22 +1,23 @@ @import "~theme/globals"; :host { + --image-size: 120px; + --icon-color: var(--text-color); + display: flex; flex-direction: column; align-items: center; justify-content: center; flex-grow: 1; - color: var(--text-color); margin: 0 auto; text-align: center; padding: 16px; - --image-size: 120px; - height: 100%; ion-icon { font-size: var(--image-size); + color: var(--icon-color); } img { height: var(--image-size); @@ -28,6 +29,20 @@ &.core-empty-box-clickable { z-index: 0; } + + &.dimmed { + --icon-color: var(--gray-400); + --text-color: var(--gray-700); + } + +} + +:host-context(html.dark) { + + &.dimmed { + --text-color: var(--gray-300); + } + } @include media-breakpoint-down(sm) { diff --git a/src/core/components/empty-box/empty-box.ts b/src/core/components/empty-box/empty-box.ts index efbec5b2d..255ebad47 100644 --- a/src/core/components/empty-box/empty-box.ts +++ b/src/core/components/empty-box/empty-box.ts @@ -12,7 +12,7 @@ // See the License for the specific language governing permissions and // limitations under the License. -import { Component, Input } from '@angular/core'; +import { Component, HostBinding, Input } from '@angular/core'; /** * Component to show an empty box message. It will show an optional icon or image and a text centered on page. @@ -30,6 +30,7 @@ import { Component, Input } from '@angular/core'; export class CoreEmptyBoxComponent { @Input() message = ''; // Message to display. + @Input() dimmed = false; // Wether the box is dimmed or not. @Input() icon?: string; // Name of the icon to use. @Input() image?: string; // Image source. If an icon is provided, image won't be used. @Input() flipIconRtl = false; // Whether to flip the icon in RTL. Defaults to false. @@ -39,4 +40,9 @@ export class CoreEmptyBoxComponent { */ @Input() inline = false; + @HostBinding('class.dimmed') + get isDimmed(): boolean { + return this.dimmed; + } + } diff --git a/src/core/components/stories/components/components.module.ts b/src/core/components/stories/components/components.module.ts new file mode 100644 index 000000000..af6de43cb --- /dev/null +++ b/src/core/components/stories/components/components.module.ts @@ -0,0 +1,35 @@ +// (C) Copyright 2015 Moodle Pty Ltd. +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. + +import { NgModule } from '@angular/core'; +import { CoreEmptyBoxPageComponent } from './empty-box-page/empty-box-page'; +import { CoreEmptyBoxWrapperComponent } from './empty-box-wrapper/empty-box-wrapper'; +import { StorybookModule } from '@/storybook/storybook.module'; +import { CoreSearchComponentsModule } from '@features/search/components/components.module'; +import { CoreComponentsModule } from '@components/components.module'; +import { CommonModule } from '@angular/common'; + +@NgModule({ + declarations: [ + CoreEmptyBoxPageComponent, + CoreEmptyBoxWrapperComponent, + ], + imports: [ + CommonModule, + StorybookModule, + CoreComponentsModule, + CoreSearchComponentsModule, + ], +}) +export class CoreComponentsStorybookModule {} diff --git a/src/core/components/stories/components/empty-box-page/empty-box-page.html b/src/core/components/stories/components/empty-box-page/empty-box-page.html new file mode 100644 index 000000000..9246d8bf6 --- /dev/null +++ b/src/core/components/stories/components/empty-box-page/empty-box-page.html @@ -0,0 +1,16 @@ + + + + +

Search

+ + + + +
+ + + +
+ + diff --git a/src/core/components/stories/components/empty-box-page/empty-box-page.ts b/src/core/components/stories/components/empty-box-page/empty-box-page.ts new file mode 100644 index 000000000..a290850b8 --- /dev/null +++ b/src/core/components/stories/components/empty-box-page/empty-box-page.ts @@ -0,0 +1,27 @@ +// (C) Copyright 2015 Moodle Pty Ltd. +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. + +import { Component, Input } from '@angular/core'; + +@Component({ + selector: 'core-empty-box-page', + templateUrl: 'empty-box-page.html', +}) +export class CoreEmptyBoxPageComponent { + + @Input() icon!: string; + @Input() content!: string; + @Input() dimmed!: boolean; + +} diff --git a/src/core/components/stories/components/empty-box-wrapper/empty-box-wrapper.html b/src/core/components/stories/components/empty-box-wrapper/empty-box-wrapper.html new file mode 100644 index 000000000..10dc9fa5f --- /dev/null +++ b/src/core/components/stories/components/empty-box-wrapper/empty-box-wrapper.html @@ -0,0 +1,3 @@ + +
+ diff --git a/src/core/components/stories/components/empty-box-wrapper/empty-box-wrapper.ts b/src/core/components/stories/components/empty-box-wrapper/empty-box-wrapper.ts new file mode 100644 index 000000000..6b99f2a47 --- /dev/null +++ b/src/core/components/stories/components/empty-box-wrapper/empty-box-wrapper.ts @@ -0,0 +1,38 @@ +// (C) Copyright 2015 Moodle Pty Ltd. +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. + +import { Component, Input, OnChanges } from '@angular/core'; +import { DomSanitizer } from '@singletons'; +import { SafeHtml } from '@angular/platform-browser'; + +@Component({ + selector: 'core-empty-box-wrapper', + templateUrl: 'empty-box-wrapper.html', +}) +export class CoreEmptyBoxWrapperComponent implements OnChanges { + + @Input() icon!: string; + @Input() content!: string; + @Input() dimmed!: boolean; + + html?: SafeHtml; + + /** + * @inheritdoc + */ + ngOnChanges(): void { + this.html = DomSanitizer.bypassSecurityTrustHtml(this.content); + } + +} diff --git a/src/core/components/stories/empty-box.stories.ts b/src/core/components/stories/empty-box.stories.ts new file mode 100644 index 000000000..8b2922fa6 --- /dev/null +++ b/src/core/components/stories/empty-box.stories.ts @@ -0,0 +1,79 @@ +// (C) Copyright 2015 Moodle Pty Ltd. +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. + +import { Meta, moduleMetadata } from '@storybook/angular'; +import { marked } from 'marked'; + +import { story } from '@/storybook/utils/helpers'; + +import { CoreEmptyBoxComponent } from '@components/empty-box/empty-box'; +import { CoreEmptyBoxWrapperComponent } from './components/empty-box-wrapper/empty-box-wrapper'; +import { CoreEmptyBoxPageComponent } from './components/empty-box-page/empty-box-page'; +import { CoreComponentsStorybookModule } from './components/components.module'; + +interface Args { + icon: string; + content: string; + dimmed: boolean; +} + +export default > { + title: 'Core/Empty Box', + component: CoreEmptyBoxComponent, + decorators: [ + moduleMetadata({ imports: [CoreComponentsStorybookModule] }), + ], + argTypes: { + icon: { + control: { + type: 'select', + options: ['fas-magnifying-glass', 'fas-user', 'fas-check'], + }, + }, + }, + args: { + icon: 'fas-user', + content: 'No users', + dimmed: false, + }, +}; + +const WrapperTemplate = story((args) => ({ + component: CoreEmptyBoxWrapperComponent, + props: { + ...args, + content: marked(args.content), + }, +})); + +const PageTemplate = story((args) => ({ + component: CoreEmptyBoxPageComponent, + props: { + ...args, + content: marked(args.content), + }, +})); + +export const Primary = story(WrapperTemplate); + +export const Example = story(PageTemplate, { + icon: 'fas-magnifying-glass', + content: '**No results for "Test Search"**\n\nCheck for typos or try using different keywords', +}); + +export const DimmedExample = story(PageTemplate, { + icon: 'fas-magnifying-glass', + content: 'What are you searching for?', + dimmed: true, +});