diff --git a/.yarn/cache/@socket.io-base64-arraybuffer-npm-1.0.2-066f9f7d09-fa3e58c758.zip b/.yarn/cache/@socket.io-base64-arraybuffer-npm-1.0.2-066f9f7d09-fa3e58c758.zip new file mode 100644 index 000000000000..ea8a23b8e3a1 Binary files /dev/null and b/.yarn/cache/@socket.io-base64-arraybuffer-npm-1.0.2-066f9f7d09-fa3e58c758.zip differ diff --git a/.yarn/cache/@types-component-emitter-npm-1.2.11-581f0366a3-0e081c5f7a.zip b/.yarn/cache/@types-component-emitter-npm-1.2.11-581f0366a3-0e081c5f7a.zip new file mode 100644 index 000000000000..c9112cb118b6 Binary files /dev/null and b/.yarn/cache/@types-component-emitter-npm-1.2.11-581f0366a3-0e081c5f7a.zip differ diff --git a/.yarn/cache/@types-cookie-npm-0.4.1-274a704dc6-3275534ed6.zip b/.yarn/cache/@types-cookie-npm-0.4.1-274a704dc6-3275534ed6.zip new file mode 100644 index 000000000000..1c1769dcd05e Binary files /dev/null and b/.yarn/cache/@types-cookie-npm-0.4.1-274a704dc6-3275534ed6.zip differ diff --git a/.yarn/cache/@types-cors-npm-2.8.12-ff52e8e514-8c45f112c7.zip b/.yarn/cache/@types-cors-npm-2.8.12-ff52e8e514-8c45f112c7.zip new file mode 100644 index 000000000000..3a10db9f6d60 Binary files /dev/null and b/.yarn/cache/@types-cors-npm-2.8.12-ff52e8e514-8c45f112c7.zip differ diff --git a/.yarn/cache/@types-node-npm-17.0.18-a816928b08-6c4edfc2b3.zip b/.yarn/cache/@types-node-npm-17.0.18-a816928b08-6c4edfc2b3.zip new file mode 100644 index 000000000000..c154a46468a1 Binary files /dev/null and b/.yarn/cache/@types-node-npm-17.0.18-a816928b08-6c4edfc2b3.zip differ diff --git a/.yarn/cache/@typescript-eslint-scope-manager-npm-5.12.0-38120bd90e-87cc4e8ab3.zip b/.yarn/cache/@typescript-eslint-scope-manager-npm-5.12.0-38120bd90e-87cc4e8ab3.zip new file mode 100644 index 000000000000..b50c10957b48 Binary files /dev/null and b/.yarn/cache/@typescript-eslint-scope-manager-npm-5.12.0-38120bd90e-87cc4e8ab3.zip differ diff --git a/.yarn/cache/@typescript-eslint-types-npm-5.12.0-2400bd6388-f5e7f8270c.zip b/.yarn/cache/@typescript-eslint-types-npm-5.12.0-2400bd6388-f5e7f8270c.zip new file mode 100644 index 000000000000..9d22894347d6 Binary files /dev/null and b/.yarn/cache/@typescript-eslint-types-npm-5.12.0-2400bd6388-f5e7f8270c.zip differ diff --git a/.yarn/cache/@typescript-eslint-typescript-estree-npm-5.12.0-0f6b2decf1-6a8e852c21.zip b/.yarn/cache/@typescript-eslint-typescript-estree-npm-5.12.0-0f6b2decf1-6a8e852c21.zip new file mode 100644 index 000000000000..0f688ee5d956 Binary files /dev/null and b/.yarn/cache/@typescript-eslint-typescript-estree-npm-5.12.0-0f6b2decf1-6a8e852c21.zip differ diff --git a/.yarn/cache/@typescript-eslint-utils-npm-5.12.0-4a661f4ab8-34c394db05.zip b/.yarn/cache/@typescript-eslint-utils-npm-5.12.0-4a661f4ab8-34c394db05.zip new file mode 100644 index 000000000000..f409ebd4ae35 Binary files /dev/null and b/.yarn/cache/@typescript-eslint-utils-npm-5.12.0-4a661f4ab8-34c394db05.zip differ diff --git a/.yarn/cache/@typescript-eslint-visitor-keys-npm-5.12.0-e5aaacd6b9-c3774f542a.zip b/.yarn/cache/@typescript-eslint-visitor-keys-npm-5.12.0-e5aaacd6b9-c3774f542a.zip new file mode 100644 index 000000000000..ebbc2863fbc5 Binary files /dev/null and b/.yarn/cache/@typescript-eslint-visitor-keys-npm-5.12.0-e5aaacd6b9-c3774f542a.zip differ diff --git a/.yarn/cache/base64id-npm-2.0.0-ef4afeee0a-581b1d37e6.zip b/.yarn/cache/base64id-npm-2.0.0-ef4afeee0a-581b1d37e6.zip new file mode 100644 index 000000000000..e0bb981132ed Binary files /dev/null and b/.yarn/cache/base64id-npm-2.0.0-ef4afeee0a-581b1d37e6.zip differ diff --git a/.yarn/cache/body-parser-npm-1.19.1-ae102dea05-9197a300a6.zip b/.yarn/cache/body-parser-npm-1.19.1-ae102dea05-9197a300a6.zip new file mode 100644 index 000000000000..fc8da0b9137e Binary files /dev/null and b/.yarn/cache/body-parser-npm-1.19.1-ae102dea05-9197a300a6.zip differ diff --git a/.yarn/cache/buffer-alloc-npm-1.2.0-388beee0c7-560cd27f3c.zip b/.yarn/cache/buffer-alloc-npm-1.2.0-388beee0c7-560cd27f3c.zip deleted file mode 100644 index ef6f1d41c8ff..000000000000 Binary files a/.yarn/cache/buffer-alloc-npm-1.2.0-388beee0c7-560cd27f3c.zip and /dev/null differ diff --git a/.yarn/cache/buffer-alloc-unsafe-npm-1.1.0-b5d7ccb44c-c5e18bf51f.zip b/.yarn/cache/buffer-alloc-unsafe-npm-1.1.0-b5d7ccb44c-c5e18bf51f.zip deleted file mode 100644 index d5c8f1123591..000000000000 Binary files a/.yarn/cache/buffer-alloc-unsafe-npm-1.1.0-b5d7ccb44c-c5e18bf51f.zip and /dev/null differ diff --git a/.yarn/cache/buffer-fill-npm-1.0.0-915809118a-c29b4723dd.zip b/.yarn/cache/buffer-fill-npm-1.0.0-915809118a-c29b4723dd.zip deleted file mode 100644 index e4bc0cfb2585..000000000000 Binary files a/.yarn/cache/buffer-fill-npm-1.0.0-915809118a-c29b4723dd.zip and /dev/null differ diff --git a/.yarn/cache/bytes-npm-3.1.1-f2d0e8c583-949ab99a38.zip b/.yarn/cache/bytes-npm-3.1.1-f2d0e8c583-949ab99a38.zip new file mode 100644 index 000000000000..6306ab1d802f Binary files /dev/null and b/.yarn/cache/bytes-npm-3.1.1-f2d0e8c583-949ab99a38.zip differ diff --git a/.yarn/cache/chokidar-npm-3.5.2-6752340fec-d1fda32fcd.zip b/.yarn/cache/chokidar-npm-3.5.3-c5f9b0a56a-b49fcde401.zip similarity index 62% rename from .yarn/cache/chokidar-npm-3.5.2-6752340fec-d1fda32fcd.zip rename to .yarn/cache/chokidar-npm-3.5.3-c5f9b0a56a-b49fcde401.zip index 594bbeb37d85..f5261bc278dd 100644 Binary files a/.yarn/cache/chokidar-npm-3.5.2-6752340fec-d1fda32fcd.zip and b/.yarn/cache/chokidar-npm-3.5.3-c5f9b0a56a-b49fcde401.zip differ diff --git a/.yarn/cache/cookie-npm-0.4.2-7761894d5f-a00833c998.zip b/.yarn/cache/cookie-npm-0.4.2-7761894d5f-a00833c998.zip new file mode 100644 index 000000000000..2a478448c029 Binary files /dev/null and b/.yarn/cache/cookie-npm-0.4.2-7761894d5f-a00833c998.zip differ diff --git a/.yarn/cache/cors-npm-2.8.5-c9935a2d12-ced838404c.zip b/.yarn/cache/cors-npm-2.8.5-c9935a2d12-ced838404c.zip new file mode 100644 index 000000000000..b7ab2c53f9e1 Binary files /dev/null and b/.yarn/cache/cors-npm-2.8.5-c9935a2d12-ced838404c.zip differ diff --git a/.yarn/cache/date-format-npm-2.1.0-6d206457ad-ff2c80c760.zip b/.yarn/cache/date-format-npm-2.1.0-6d206457ad-ff2c80c760.zip deleted file mode 100644 index d54e1984aeae..000000000000 Binary files a/.yarn/cache/date-format-npm-2.1.0-6d206457ad-ff2c80c760.zip and /dev/null differ diff --git a/.yarn/cache/date-format-npm-4.0.3-ce15085cfe-8ae4d9de35.zip b/.yarn/cache/date-format-npm-4.0.3-ce15085cfe-8ae4d9de35.zip new file mode 100644 index 000000000000..ac01e7f184b6 Binary files /dev/null and b/.yarn/cache/date-format-npm-4.0.3-ce15085cfe-8ae4d9de35.zip differ diff --git a/.yarn/cache/engine.io-npm-6.1.2-733cb68993-bd98d6ce2b.zip b/.yarn/cache/engine.io-npm-6.1.2-733cb68993-bd98d6ce2b.zip new file mode 100644 index 000000000000..9e966d3a81b6 Binary files /dev/null and b/.yarn/cache/engine.io-npm-6.1.2-733cb68993-bd98d6ce2b.zip differ diff --git a/.yarn/cache/engine.io-parser-npm-5.0.3-55c5b3beef-88d664420a.zip b/.yarn/cache/engine.io-parser-npm-5.0.3-55c5b3beef-88d664420a.zip new file mode 100644 index 000000000000..7cc6566fc646 Binary files /dev/null and b/.yarn/cache/engine.io-parser-npm-5.0.3-55c5b3beef-88d664420a.zip differ diff --git a/.yarn/cache/eslint-plugin-jest-npm-26.1.1-c9913e9450-efed65bd6b.zip b/.yarn/cache/eslint-plugin-jest-npm-26.1.1-c9913e9450-efed65bd6b.zip new file mode 100644 index 000000000000..04244f91ac3c Binary files /dev/null and b/.yarn/cache/eslint-plugin-jest-npm-26.1.1-c9913e9450-efed65bd6b.zip differ diff --git a/.yarn/cache/fast-sass-loader-npm-1.5.0-f83ec63742-73ac3bba48.zip b/.yarn/cache/fast-sass-loader-npm-1.5.0-f83ec63742-73ac3bba48.zip new file mode 100644 index 000000000000..fd87cfbce3d9 Binary files /dev/null and b/.yarn/cache/fast-sass-loader-npm-1.5.0-f83ec63742-73ac3bba48.zip differ diff --git a/.yarn/cache/fast-sass-loader-npm-2.0.1-ba6d1d1880-808ad855f4.zip b/.yarn/cache/fast-sass-loader-npm-2.0.1-ba6d1d1880-808ad855f4.zip deleted file mode 100644 index 9e94394ce201..000000000000 Binary files a/.yarn/cache/fast-sass-loader-npm-2.0.1-ba6d1d1880-808ad855f4.zip and /dev/null differ diff --git a/.yarn/cache/flatted-npm-2.0.1-a100b7c783-251447389c.zip b/.yarn/cache/flatted-npm-2.0.1-a100b7c783-251447389c.zip deleted file mode 100644 index 47cf01e99991..000000000000 Binary files a/.yarn/cache/flatted-npm-2.0.1-a100b7c783-251447389c.zip and /dev/null differ diff --git a/.yarn/cache/flatted-npm-3.1.1-ffd80d62a2-508935e336.zip b/.yarn/cache/flatted-npm-3.2.5-0ee5a8875f-3c436e9695.zip similarity index 77% rename from .yarn/cache/flatted-npm-3.1.1-ffd80d62a2-508935e336.zip rename to .yarn/cache/flatted-npm-3.2.5-0ee5a8875f-3c436e9695.zip index ccc2a9e292bb..0a71b59ca50c 100644 Binary files a/.yarn/cache/flatted-npm-3.1.1-ffd80d62a2-508935e336.zip and b/.yarn/cache/flatted-npm-3.2.5-0ee5a8875f-3c436e9695.zip differ diff --git a/.yarn/cache/fs-extra-npm-7.0.1-b33a5e53e9-141b9dccb2.zip b/.yarn/cache/fs-extra-npm-7.0.1-b33a5e53e9-141b9dccb2.zip deleted file mode 100644 index 2d57183ec247..000000000000 Binary files a/.yarn/cache/fs-extra-npm-7.0.1-b33a5e53e9-141b9dccb2.zip and /dev/null differ diff --git a/.yarn/cache/glob-npm-7.2.0-bb4644d239-78a8ea9423.zip b/.yarn/cache/glob-npm-7.2.0-bb4644d239-78a8ea9423.zip new file mode 100644 index 000000000000..0ef1638a62ae Binary files /dev/null and b/.yarn/cache/glob-npm-7.2.0-bb4644d239-78a8ea9423.zip differ diff --git a/.yarn/cache/gulp-postcss-npm-8.0.0-39b615c41c-2d6ca84ec0.zip b/.yarn/cache/gulp-postcss-npm-8.0.0-39b615c41c-2d6ca84ec0.zip deleted file mode 100644 index c245846b6e1b..000000000000 Binary files a/.yarn/cache/gulp-postcss-npm-8.0.0-39b615c41c-2d6ca84ec0.zip and /dev/null differ diff --git a/.yarn/cache/gulp-postcss-npm-9.0.1-bb3337d1e9-f27a7ebdb7.zip b/.yarn/cache/gulp-postcss-npm-9.0.1-bb3337d1e9-f27a7ebdb7.zip new file mode 100644 index 000000000000..65dce43570c1 Binary files /dev/null and b/.yarn/cache/gulp-postcss-npm-9.0.1-bb3337d1e9-f27a7ebdb7.zip differ diff --git a/.yarn/cache/gulp-rename-npm-1.4.0-a2f63eb5e4-d0c965d07d.zip b/.yarn/cache/gulp-rename-npm-1.4.0-a2f63eb5e4-d0c965d07d.zip deleted file mode 100644 index 5d91420e20e1..000000000000 Binary files a/.yarn/cache/gulp-rename-npm-1.4.0-a2f63eb5e4-d0c965d07d.zip and /dev/null differ diff --git a/.yarn/cache/gulp-rename-npm-2.0.0-2a2997d9ce-b9add0d130.zip b/.yarn/cache/gulp-rename-npm-2.0.0-2a2997d9ce-b9add0d130.zip new file mode 100644 index 000000000000..1a46bdf1bda6 Binary files /dev/null and b/.yarn/cache/gulp-rename-npm-2.0.0-2a2997d9ce-b9add0d130.zip differ diff --git a/.yarn/cache/gzip-size-npm-7.0.0-cc99ecf165-52d0bf5863.zip b/.yarn/cache/gzip-size-npm-7.0.0-cc99ecf165-52d0bf5863.zip new file mode 100644 index 000000000000..a6477d1df380 Binary files /dev/null and b/.yarn/cache/gzip-size-npm-7.0.0-cc99ecf165-52d0bf5863.zip differ diff --git a/.yarn/cache/http-errors-npm-1.8.1-fb60d9f6ae-d3c7e7e776.zip b/.yarn/cache/http-errors-npm-1.8.1-fb60d9f6ae-d3c7e7e776.zip new file mode 100644 index 000000000000..2fb70ddd0d49 Binary files /dev/null and b/.yarn/cache/http-errors-npm-1.8.1-fb60d9f6ae-d3c7e7e776.zip differ diff --git a/.yarn/cache/import-cwd-npm-3.0.0-2f801f964d-f2c4230e83.zip b/.yarn/cache/import-cwd-npm-3.0.0-2f801f964d-f2c4230e83.zip deleted file mode 100644 index 1d03ef64ec36..000000000000 Binary files a/.yarn/cache/import-cwd-npm-3.0.0-2f801f964d-f2c4230e83.zip and /dev/null differ diff --git a/.yarn/cache/import-from-npm-3.0.0-8656bfd330-5040a7400e.zip b/.yarn/cache/import-from-npm-3.0.0-8656bfd330-5040a7400e.zip deleted file mode 100644 index 0639d4be3016..000000000000 Binary files a/.yarn/cache/import-from-npm-3.0.0-8656bfd330-5040a7400e.zip and /dev/null differ diff --git a/.yarn/cache/isbinaryfile-npm-3.0.3-c33e7ec0eb-9a55578685.zip b/.yarn/cache/isbinaryfile-npm-3.0.3-c33e7ec0eb-9a55578685.zip deleted file mode 100644 index 9c4e8511bff1..000000000000 Binary files a/.yarn/cache/isbinaryfile-npm-3.0.3-c33e7ec0eb-9a55578685.zip and /dev/null differ diff --git a/.yarn/cache/isbinaryfile-npm-4.0.8-62c71dd57b-606e3bb648.zip b/.yarn/cache/isbinaryfile-npm-4.0.8-62c71dd57b-606e3bb648.zip new file mode 100644 index 000000000000..1108e943918b Binary files /dev/null and b/.yarn/cache/isbinaryfile-npm-4.0.8-62c71dd57b-606e3bb648.zip differ diff --git a/.yarn/cache/karma-npm-4.4.1-b01b29a723-44beb678d5.zip b/.yarn/cache/karma-npm-4.4.1-b01b29a723-44beb678d5.zip deleted file mode 100644 index fc6b057dda84..000000000000 Binary files a/.yarn/cache/karma-npm-4.4.1-b01b29a723-44beb678d5.zip and /dev/null differ diff --git a/.yarn/cache/karma-npm-6.3.16-cf78707de2-eb1703d490.zip b/.yarn/cache/karma-npm-6.3.16-cf78707de2-eb1703d490.zip new file mode 100644 index 000000000000..f160175dec07 Binary files /dev/null and b/.yarn/cache/karma-npm-6.3.16-cf78707de2-eb1703d490.zip differ diff --git a/.yarn/cache/log4js-npm-4.5.1-b9f6c1914a-ad6d7753f6.zip b/.yarn/cache/log4js-npm-4.5.1-b9f6c1914a-ad6d7753f6.zip deleted file mode 100644 index 3d3189028630..000000000000 Binary files a/.yarn/cache/log4js-npm-4.5.1-b9f6c1914a-ad6d7753f6.zip and /dev/null differ diff --git a/.yarn/cache/log4js-npm-6.4.1-b00dd7826e-0614949662.zip b/.yarn/cache/log4js-npm-6.4.1-b00dd7826e-0614949662.zip new file mode 100644 index 000000000000..0357fbcab77b Binary files /dev/null and b/.yarn/cache/log4js-npm-6.4.1-b00dd7826e-0614949662.zip differ diff --git a/.yarn/cache/mime-npm-2.4.4-b1c30f0777-a8dad06df1.zip b/.yarn/cache/mime-npm-2.4.4-b1c30f0777-a8dad06df1.zip deleted file mode 100644 index 0d0a6072b3ee..000000000000 Binary files a/.yarn/cache/mime-npm-2.4.4-b1c30f0777-a8dad06df1.zip and /dev/null differ diff --git a/.yarn/cache/mime-npm-2.6.0-88b89d8de0-1497ba7b9f.zip b/.yarn/cache/mime-npm-2.6.0-88b89d8de0-1497ba7b9f.zip new file mode 100644 index 000000000000..644ef2b53fb9 Binary files /dev/null and b/.yarn/cache/mime-npm-2.6.0-88b89d8de0-1497ba7b9f.zip differ diff --git a/.yarn/cache/minimist-npm-0.0.10-df9c22163e-f7b2cb17af.zip b/.yarn/cache/minimist-npm-0.0.10-df9c22163e-f7b2cb17af.zip deleted file mode 100644 index 44727d1afebb..000000000000 Binary files a/.yarn/cache/minimist-npm-0.0.10-df9c22163e-f7b2cb17af.zip and /dev/null differ diff --git a/.yarn/cache/optimist-npm-0.6.1-b1b5ef4c06-191ab2b119.zip b/.yarn/cache/optimist-npm-0.6.1-b1b5ef4c06-191ab2b119.zip deleted file mode 100644 index 8006939af249..000000000000 Binary files a/.yarn/cache/optimist-npm-0.6.1-b1b5ef4c06-191ab2b119.zip and /dev/null differ diff --git a/.yarn/cache/postcss-load-config-npm-3.1.0-9e1e33c439-7fd62064ea.zip b/.yarn/cache/postcss-load-config-npm-3.1.0-9e1e33c439-7fd62064ea.zip deleted file mode 100644 index 2190fa3239c9..000000000000 Binary files a/.yarn/cache/postcss-load-config-npm-3.1.0-9e1e33c439-7fd62064ea.zip and /dev/null differ diff --git a/.yarn/cache/postcss-load-config-npm-3.1.3-8923b58f68-7d187d339f.zip b/.yarn/cache/postcss-load-config-npm-3.1.3-8923b58f68-7d187d339f.zip new file mode 100644 index 000000000000..cd3a74fb2cff Binary files /dev/null and b/.yarn/cache/postcss-load-config-npm-3.1.3-8923b58f68-7d187d339f.zip differ diff --git a/.yarn/cache/qs-npm-6.9.6-fee5de1427-cb6df402bb.zip b/.yarn/cache/qs-npm-6.9.6-fee5de1427-cb6df402bb.zip new file mode 100644 index 000000000000..c4c5cd452fd0 Binary files /dev/null and b/.yarn/cache/qs-npm-6.9.6-fee5de1427-cb6df402bb.zip differ diff --git a/.yarn/cache/raw-body-npm-2.4.2-f70aad454d-c6f8d6a75c.zip b/.yarn/cache/raw-body-npm-2.4.2-f70aad454d-c6f8d6a75c.zip new file mode 100644 index 000000000000..998ef6dcad8f Binary files /dev/null and b/.yarn/cache/raw-body-npm-2.4.2-f70aad454d-c6f8d6a75c.zip differ diff --git a/.yarn/cache/rfdc-npm-1.1.4-3df7c90272-475a7936c4.zip b/.yarn/cache/rfdc-npm-1.1.4-3df7c90272-475a7936c4.zip deleted file mode 100644 index a29952af5c12..000000000000 Binary files a/.yarn/cache/rfdc-npm-1.1.4-3df7c90272-475a7936c4.zip and /dev/null differ diff --git a/.yarn/cache/rfdc-npm-1.3.0-272f288ad8-fb2ba8512e.zip b/.yarn/cache/rfdc-npm-1.3.0-272f288ad8-fb2ba8512e.zip new file mode 100644 index 000000000000..c6d5d0c94482 Binary files /dev/null and b/.yarn/cache/rfdc-npm-1.3.0-272f288ad8-fb2ba8512e.zip differ diff --git a/.yarn/cache/semver-npm-5.5.1-3560aa5fb6-ab920176f5.zip b/.yarn/cache/semver-npm-5.5.1-3560aa5fb6-ab920176f5.zip deleted file mode 100644 index 9b88d73054c7..000000000000 Binary files a/.yarn/cache/semver-npm-5.5.1-3560aa5fb6-ab920176f5.zip and /dev/null differ diff --git a/.yarn/cache/setprototypeof-npm-1.2.0-0fedbdcd3a-be18cbbf70.zip b/.yarn/cache/setprototypeof-npm-1.2.0-0fedbdcd3a-be18cbbf70.zip new file mode 100644 index 000000000000..f6bd1cbd7041 Binary files /dev/null and b/.yarn/cache/setprototypeof-npm-1.2.0-0fedbdcd3a-be18cbbf70.zip differ diff --git a/.yarn/cache/socket.io-adapter-npm-2.3.3-4fd6b5d0bd-73890e0a33.zip b/.yarn/cache/socket.io-adapter-npm-2.3.3-4fd6b5d0bd-73890e0a33.zip new file mode 100644 index 000000000000..fb09b6f5bc39 Binary files /dev/null and b/.yarn/cache/socket.io-adapter-npm-2.3.3-4fd6b5d0bd-73890e0a33.zip differ diff --git a/.yarn/cache/socket.io-npm-4.4.1-b2ec7c47a5-a559ae5235.zip b/.yarn/cache/socket.io-npm-4.4.1-b2ec7c47a5-a559ae5235.zip new file mode 100644 index 000000000000..f653ee32c939 Binary files /dev/null and b/.yarn/cache/socket.io-npm-4.4.1-b2ec7c47a5-a559ae5235.zip differ diff --git a/.yarn/cache/socket.io-parser-npm-4.0.4-1dfc284556-c173b4f374.zip b/.yarn/cache/socket.io-parser-npm-4.0.4-1dfc284556-c173b4f374.zip new file mode 100644 index 000000000000..bf0c96fa23c6 Binary files /dev/null and b/.yarn/cache/socket.io-parser-npm-4.0.4-1dfc284556-c173b4f374.zip differ diff --git a/.yarn/cache/streamroller-npm-1.0.6-a284c77230-14c6717c1a.zip b/.yarn/cache/streamroller-npm-1.0.6-a284c77230-14c6717c1a.zip deleted file mode 100644 index 00fd60cfdf90..000000000000 Binary files a/.yarn/cache/streamroller-npm-1.0.6-a284c77230-14c6717c1a.zip and /dev/null differ diff --git a/.yarn/cache/streamroller-npm-3.0.2-6d7ba8035a-1f323824f0.zip b/.yarn/cache/streamroller-npm-3.0.2-6d7ba8035a-1f323824f0.zip new file mode 100644 index 000000000000..7c63fe568c37 Binary files /dev/null and b/.yarn/cache/streamroller-npm-3.0.2-6d7ba8035a-1f323824f0.zip differ diff --git a/.yarn/cache/toidentifier-npm-1.0.1-f759712599-952c29e2a8.zip b/.yarn/cache/toidentifier-npm-1.0.1-f759712599-952c29e2a8.zip new file mode 100644 index 000000000000..595363e93b53 Binary files /dev/null and b/.yarn/cache/toidentifier-npm-1.0.1-f759712599-952c29e2a8.zip differ diff --git a/.yarn/cache/ua-parser-js-npm-0.7.31-aeb4c9aae9-e2f8324a83.zip b/.yarn/cache/ua-parser-js-npm-0.7.31-aeb4c9aae9-e2f8324a83.zip new file mode 100644 index 000000000000..935d44046ac3 Binary files /dev/null and b/.yarn/cache/ua-parser-js-npm-0.7.31-aeb4c9aae9-e2f8324a83.zip differ diff --git a/.yarn/cache/useragent-npm-2.3.0-5f6ac8e3af-966e418122.zip b/.yarn/cache/useragent-npm-2.3.0-5f6ac8e3af-966e418122.zip deleted file mode 100644 index b25e892f89d7..000000000000 Binary files a/.yarn/cache/useragent-npm-2.3.0-5f6ac8e3af-966e418122.zip and /dev/null differ diff --git a/.yarn/cache/wordwrap-npm-0.0.3-ab90803074-dfc2d3512e.zip b/.yarn/cache/wordwrap-npm-0.0.3-ab90803074-dfc2d3512e.zip deleted file mode 100644 index 01c2390672bb..000000000000 Binary files a/.yarn/cache/wordwrap-npm-0.0.3-ab90803074-dfc2d3512e.zip and /dev/null differ diff --git a/.yarn/cache/ws-npm-8.2.3-03a35b8ad7-c869296ccb.zip b/.yarn/cache/ws-npm-8.2.3-03a35b8ad7-c869296ccb.zip new file mode 100644 index 000000000000..407549e6d716 Binary files /dev/null and b/.yarn/cache/ws-npm-8.2.3-03a35b8ad7-c869296ccb.zip differ diff --git a/.yarn/cache/yamlparser-npm-0.0.2-2d1d3bf677-9f09b0af2b.zip b/.yarn/cache/yamlparser-npm-0.0.2-2d1d3bf677-9f09b0af2b.zip deleted file mode 100644 index 1d3e017bc2f5..000000000000 Binary files a/.yarn/cache/yamlparser-npm-0.0.2-2d1d3bf677-9f09b0af2b.zip and /dev/null differ diff --git a/config/eslint-config-carbon/package.json b/config/eslint-config-carbon/package.json index a8ebbb352dbd..2f09d805b030 100644 --- a/config/eslint-config-carbon/package.json +++ b/config/eslint-config-carbon/package.json @@ -1,7 +1,7 @@ { "name": "eslint-config-carbon", "description": "ESLint configuration for Carbon", - "version": "2.10.0", + "version": "2.11.0-rc.0", "license": "Apache-2.0", "main": "index.js", "repository": { @@ -38,7 +38,7 @@ "eslint-config-prettier": "^8.3.0", "eslint-plugin-cypress": "^2.11.3", "eslint-plugin-import": "^2.23.4", - "eslint-plugin-jest": "^25.3.0", + "eslint-plugin-jest": "^26.0.0", "eslint-plugin-jsdoc": "^36.0.3", "eslint-plugin-jsx-a11y": "^6.4.1", "eslint-plugin-prettier": "^3.4.0", diff --git a/config/stylelint-config-carbon/package.json b/config/stylelint-config-carbon/package.json index 0ae00ff176f0..f26798ea436d 100644 --- a/config/stylelint-config-carbon/package.json +++ b/config/stylelint-config-carbon/package.json @@ -1,7 +1,7 @@ { "name": "stylelint-config-carbon", "description": "Stylelint configuration for Carbon", - "version": "1.7.0", + "version": "1.8.0-rc.0", "license": "Apache-2.0", "main": "index.js", "repository": { diff --git a/docs/migration/11.x-color.md b/docs/migration/11.x-color.md deleted file mode 100644 index 3597b0d56392..000000000000 --- a/docs/migration/11.x-color.md +++ /dev/null @@ -1,132 +0,0 @@ -# Color - -> **Note:** The Carbon v11 release is currently in beta release. Be on the -> lookout for the public preview release available in the coming months. - -## Color tokens - -**Status key:** - -- **No change:** Token name has no change between versions. -- **Updated:** From v10 to V11 the number suffix has been replaced with an - adjective that reflects it's usage. This is just a name change, the role - remains the same between v10 and v11. -- **Split:** V10 token has been split into multiple new v11 tokens for more - specific usage. -- **New:** A net new color token to the system in v11. It has no v10 - counterpart. -- **Deprecated:** v10 token was removed in v11. - -| V10 token name | V11 token name | V11 Contextual token | Status | -| ------------------ | ------------------------- | ---------------------- | ---------- | -| active-danger | button-danger-active | — | Updated | -| active-light-ui | layer-active-02 | layer-active | Updated | -| active-primary | button-primary-active | — | Updated | -| active-secondary | button-secondary-active | — | Updated | -| active-tertiary | button-tertiary-active | — | Updated | -| active-ui | layer-active-01 | layer-active | Split | -| active-ui | background-active | — | Split | -| active-ui | layer-accent-active-01 | layer-accent-active | Split | -| active-ui | border-subtle-selected-01 | border-sublte-selected | Split | -| button-separator | button-separator | — | No change | -| danger | button-danger-primary | — | Deprecated | -| danger-01 | button-danger-primary | — | Updated | -| danger-02 | button-danger-secondary | — | Updated | -| decorative-01 | border-subtle-02 | border-subtle | Updated | -| disabled-01 | — | — | Deprecated | -| disabled-02 | text-disabled | — | Split | -| disabled-02 | icon-disabled | — | Split | -| disabled-02 | button-disabled | — | Split | -| disabled-02 | border-disabled | border-disabled | Split | -| disabled-03 | icon-on-color-disabled | — | Split | -| disabled-03 | layer-selected-disabled | — | Split | -| disabled-03 | text-on-color-disabled | — | Split | -| field-01 | field-01 | field | No change | -| field-02 | field-02 | field | No change | -| focus | focus | — | No change | -| highlight | highlight | — | No change | -| hover-danger | button-danger-hover | — | Updated | -| hover-light-ui | layer-hover-02 | — | Updated | -| hover-primary | button-primary-hover | — | Updated | -| hover-primary-text | link-primary-hover | — | Updated | -| hover-secondary | button-secondary-hover | — | Updated | -| hover-selected-ui | background-selected-hover | — | Split | -| hover-selected-ui | layer-accent-hover-01 | layer-accent-hover | Split | -| hover-selected-ui | layer-selected-hover-01 | layer-selected-hover | Split | -| hover-tertiary | button-tertiary-hover | — | Updated | -| hover-ui | background-hover | — | Updated | -| hover-ui | layer-hover-01 | layer-hover | Split | -| hover-ui | field-hover-01 | field-hover | Split | -| hover-ui | field-hover-02 | field-hover | Split | -| icon-01 | icon-primary | — | Updated | -| icon-02 | icon-secondary | — | Updated | -| icon-03 | icon-on-color | — | Updated | -| interactive-01 | button-primary | — | Updated | -| interactive-01 | background-brand | — | Updated | -| interactive-02 | button-secondary | — | Updated | -| interactive-03 | button-tertiary | — | Updated | -| interactive-04 | border-interactive | — | Split | -| interactive-04 | interactive | — | Split | -| inverse-01 | icon-inverse | — | Split | -| inverse-01 | focus-inset | — | Split | -| inverse-01 | text-inverse | — | Split | -| inverse-02 | "background-inverse " | — | Updated | -| inverse-focus-ui | focus-inverse | — | Updated | -| inverse-hover-ui | background-inverse-hover | — | Updated | -| inverse-link | link-inverse | — | Updated | -| inverse-support-01 | support-error-inverse | — | Updated | -| inverse-support-02 | support-success-inverse | — | Updated | -| inverse-support-03 | support-warning-inverse | — | Updated | -| inverse-support-04 | support-info-inverse | — | Updated | -| link-01 | link-primary | — | Updated | -| link-02 | link-secondary | — | Updated | -| overlay-01 | overlay | — | Updated | -| selected-light-ui | layer-selected-02 | — | Updated | -| selected-ui | layer-selected-01 | layer-selected | Split | -| selected-ui | background-selected | — | Split | -| skeleton-01 | skeleton-background | — | Updated | -| skeleton-02 | skeleton-element | — | Updated | -| support-01 | support-error | — | Updated | -| support-02 | support-success | — | Updated | -| support-03 | support-warning | — | Updated | -| support-04 | support-info | — | Updated | -| text-01 | text-primary | — | Updated | -| text-02 | text-secondary | — | Updated | -| text-03 | text-placeholder | — | Updated | -| text-04 | text-on-color | — | Updated | -| text-05 | text-helper | — | Updated | -| text-error | text-error | — | Updated | -| hover-row | layer-hover-01 | layer-hover | Deprecated | -| ui-01 | layer-01 | layer | Updated | -| ui-02 | layer-02 | layer | Updated | -| ui-03 | layer-accent-01 | layer-accent | Split | -| ui-03 | border-subtle-01 | border-subtle | Split | -| ui-04 | toggle-off | — | Split | -| ui-04 | border-strong-01 | border-strong | Split | -| ui-05 | border-inverse | — | Updated | -| ui-05 | layer-selected-inverse | — | Updated | -| ui-background | background | — | Updated | -| visited-link | link-visited | — | Updated | -| brand-01 | — | — | Deprecated | -| brand-02 | — | — | Deprecated | -| brand-03 | — | — | Deprecated | -| — | border-strong-02 | border-strong | New | -| — | border-strong-03 | border-strong | New | -| — | border-subtle-00 | border-subtle | New | -| — | border-subtle-03 | border-subtle | New | -| — | border-subtle-selected-02 | border-subtle-selected | New | -| — | border-subtle-selected-03 | border-subtle-selected | New | -| — | field-03 | field | New | -| — | field-hover-03 | field-hover | New | -| — | layer-03 | layer | New | -| — | layer-active-03 | layer-active | New | -| — | layer-hover-03 | layer-hover | New | -| — | layer-selected-03 | layer-selected | New | -| — | layer-selected-hover-02 | layer-selected-hover | New | -| — | layer-selected-hover-03 | layer-selected-hover | New | -| — | layer-accent-02 | layer-accent | New | -| — | layer-accent-03 | layer-accent | New | -| — | layer-accent-active-02 | layer-accent-active | New | -| — | layer-accent-active-03 | layer-accent-active | New | -| — | layer-accent-hover-02 | layer-accent-hover | New | -| — | layer-accent-hover-03 | layer-accent-hover | New | diff --git a/docs/migration/11.x-type.md b/docs/migration/11.x-type.md new file mode 100644 index 000000000000..0abf11273395 --- /dev/null +++ b/docs/migration/11.x-type.md @@ -0,0 +1,55 @@ +# Type + +> **Note:** The Carbon v11 release is currently in beta release. Be on the +> lookout for the public preview release available in the coming months. + +## Type tokens + +**Status key:** + +- **No change:** Token name has no change between versions. +- **Updated:** This is just a name change, the role remains the same between v10 + and v11. +- **New:** A net new type token to the system in v11. It has no v10 counterpart. +- **Deprecated:** v10 token was removed in v11. + +| Category | V10 token name | V11 token name | Status | +| -------------------- | ----------------------- | ------------------ | ---------- | +| Utility styles | code-01 | code-01 | No change | +| | code-02 | code-02 | No change | +| | label-01 | label-01 | No change | +| | label-02 | label-02 | No change | +| | helper-text-01 | helper-text-01 | No change | +| | helper-text-02 | helper-text-02 | No change | +| | | legal-01 | New | +| | | legal-02 | New | +| | caption-01 | | Deprecated | +| | caption-02 | | Deprecated | +| Body styles | | | | +| | body-short-01 | body-compact-01 | Updated | +| | body-short-02 | body-compact-02 | Updated | +| | body-long-01 | body-01 | Updated | +| | body-long-02 | body-02 | Updated | +| Fixed heading styles | | | | +| | productive-heading-01 | heading-compact-01 | Updated | +| | productive-heading-02 | heading-compact-02 | Updated | +| | expressive-heading-01 | heading-01 | Updated | +| | expressive-heading-02 | heading-02 | Updated | +| | productive-heading-03 | heading-03 | Updated | +| | productive-heading-04 | heading-04 | Updated | +| | productive-heading-05 | heading-05 | Updated | +| | productive-heading-06 | heading-06 | Updated | +| | productive-heading-07 | heading-07 | Updated | +| Fluid heading styles | | | | +| | expressive-heading-03 | fluid-heading-03 | Updated | +| | expressive-heading-04 | fluid-heading-04 | Updated | +| | expressive-heading-05 | fluid-heading-05 | Updated | +| | expressive-heading-06 | fluid-heading-06 | Updated | +| Fluid display styles | | | | +| | expressive-paragraph-01 | fluid-paragraph-01 | Updated | +| | quotation-01 | fluid-quotation-01 | Updated | +| | quotation-02 | fluid-quotation-02 | Updated | +| | display-01 | fluid-display-01 | Updated | +| | display-02 | fluid-display-02 | Updated | +| | display-03 | fluid-display-03 | Updated | +| | display-04 | fluid-display-04 | Updated | diff --git a/docs/migration/v11.md b/docs/migration/v11.md index 945f54ca142b..6c4ed7c3bf5c 100644 --- a/docs/migration/v11.md +++ b/docs/migration/v11.md @@ -55,6 +55,7 @@ of packages below. - [@carbon/grid](#carbongrid) - [@carbon/layout](#carbonlayout) - [@carbon/motion](#carbonmotion) + - [@carbon/pictograms](#carbonpictograms) - [@carbon/pictograms-react](#carbonpictograms-react) - [@carbon/themes](#carbonthemes) @@ -1219,14 +1220,7 @@ const iconTypes = { ## @carbon/colors -| v10 | v11 | -| :-------------------------------------- | :----------------------------------- | -| `@import '@carbon/colors/scss/index';` | `@use '@carbon/colors';` | -| `@import '@carbon/colors/scss/colors';` | `@use '@carbon/colors';` | -| (alias) | `@use '@carbon/styles/scss/colors';` | -| (alias) | `@use '@carbon/react/scss/colors';` | - -**Changes** +**Breaking changes** - This package now requires Dart Sass and uses Sass Modules - The `scss` folder is no longer needed, you can import `@carbon/colors` @@ -1234,6 +1228,19 @@ const iconTypes = { - Variables and mixins with the `ibm--` prefix have been removed - Variables and mixins with the `carbon--` prefix have been removed +**Imports** + +| v10 | v11 | +| :-------------------------------------- | :----------------------------------- | +| `@import '@carbon/colors/scss/index';` | `@use '@carbon/colors';` | +| | `@use '@carbon/react/scss/colors';` | +| | `@use '@carbon/styles/scss/colors';` | +| `@import '@carbon/colors/scss/colors';` | `@use '@carbon/colors';` | +| | `@use '@carbon/react/scss/colors';` | +| | `@use '@carbon/styles/scss/colors';` | + +**Sass API** + | v10 | v11 | | :------------------------------------------------------ | :---------------------------------------- | | `$-`, for example `$blue-50` | No changes | @@ -1246,10 +1253,39 @@ const iconTypes = { | `@mixin carbon--colors` | Removed | For full Sass API documentation, visit the -[Sass Documentation](../../packages/colors/docs/sass.md) for the package. +[Sass Documentation](../../packages/colors/docs/sass.md) for this package. ## @carbon/elements +**Breaking changes** + +- This package now requires Dart Sass and uses Sass Modules +- The `scss` folder is no longer needed, you can import `@carbon/elements` + directly in Sass + +**Imports** + +| v10 | v11 | +| :------------------------------------------ | :------------------------- | +| `@import '@carbon/elements/scss/index';` | `@use '@carbon/elements';` | +| `@import '@carbon/elements/scss/elements';` | `@use '@carbon/elements';` | + +**Sass API** + +This package re-exports from other packages that make up the IBM Design +Language. For more information about exports, refer to the individual package +documentation to see what has changed. These packages include: + +- [@carbon/colors](#carboncolors) +- [@carbon/grid](#carbongrid) +- [@carbon/layout](#carbonlayout) +- [@carbon/motion](#carbonmotion) +- [@carbon/themes](#carbonthemes) +- [@carbon/type](#carbontype) + +For full Sass API documentation, visit the +[Sass Documentation](../../packages/elements/docs/sass.md) for this package. + ## @carbon/grid | v10 | v11 | @@ -1277,102 +1313,113 @@ For full Sass API documentation, visit the ## @carbon/layout +**Breaking changes** + +- This package now requires Dart Sass and uses Sass Modules +- Variables, mixins, and functions using the `carbon--` prefix has been renamed +- The layout scale has been replaced with steps in the spacing scale +- Breaking and grid functions, mixins, and variables have been moved to the + `@carbon/grid` package + +**Imports** + | v10 | v11 | | :-------------------------------------- | :------------------------------------ | | `@import '@carbon/layout/scss/layout';` | `@use '@carbon/layout';` | +| | `@use '@carbon/styles/scss/spacing';` | +| | `@use '@carbon/react/scss/spacing';` | | `@import '@carbon/layout/scss/index';` | `@use '@carbon/layout';` | -| (alias) | `@use '@carbon/styles/scss/spacing';` | -| (alias) | `@use '@carbon/react/scss/spacing';` | +| | `@use '@carbon/styles/scss/spacing';` | +| | `@use '@carbon/react/scss/spacing';` | **Changes** -| Filename | v10 | v11 | -| :---------------------- | :------------------------------------------ | :--------------------------------- | -| `scss/_breakpoint.scss` | `$carbon--grid-gutter` | | -| | `$carbon--grid-gutter--condensed` | | -| | `$carbon--grid-breakpoints` | | -| | `@function carbon--breakpoint-next` | | -| | `@function carbon--breakpoint-prev` | | -| | `@function carbon--is-smallest-breakpoint` | | -| | `@function carbon--largest-breakpoint-name` | | -| | `@function carbon--breakpoint-infix` | | -| | `@function carbon--breakpoint-up` | | -| | `@function carbon--breakpoint-down` | | -| | `@function carbon--breakpoint-between` | | -| | `@function carbon--largest-breakpoint` | | -| | `@function carbon--breakpoint` | | -| `scss/_convert.scss` | `$carbon--base-font-size` | | -| | `carbon--rem` | | -| | `carbon--em` | | -| `scss/_key-height.scss` | `@function carbon--get-column-width` | | -| | `$carbon--key-height-scales` | | -| | `@function carbon--key-height` | | -| `scss/_mini-unit.scss` | `$carbon--mini-unit-size` | | -| | `@function carbon--mini-units` | | -| `scss/_spacing.scss` | `$carbon--spacing-01` | | -| | `$carbon--spacing-02` | | -| | `$carbon--spacing-03` | | -| | `$carbon--spacing-04` | | -| | `$carbon--spacing-05` | | -| | `$carbon--spacing-06` | | -| | `$carbon--spacing-07` | | -| | `$carbon--spacing-08` | | -| | `$carbon--spacing-09` | | -| | `$carbon--spacing-10` | | -| | `$carbon--spacing-11` | | -| | `$carbon--spacing-12` | | -| | `$carbon--spacing-13` | | -| | `$carbon--spacing` | | -| | `$spacing-01` | | -| | `$spacing-02` | | -| | `$spacing-03` | | -| | `$spacing-04` | | -| | `$spacing-05` | | -| | `$spacing-06` | | -| | `$spacing-07` | | -| | `$spacing-08` | | -| | `$spacing-09` | | -| | `$spacing-10` | | -| | `$spacing-11` | | -| | `$spacing-12` | | -| | `$spacing-13` | | -| | `$carbon--layout-01` | Removed, use `$spacing-05` instead | -| | `$carbon--layout-02` | Removed, use `$spacing-06` instead | -| | `$carbon--layout-03` | Removed, use `$spacing-07` instead | -| | `$carbon--layout-04` | Removed, use `$spacing-09` instead | -| | `$carbon--layout-05` | Removed, use `$spacing-10` instead | -| | `$carbon--layout-06` | Removed, use `$spacing-12` instead | -| | `$carbon--layout-07` | Removed, use `$spacing-13` instead | -| | `$carbon--layout` | Removed | -| | `$layout-01` | Removed, use `$spacing-05` instead | -| | `$layout-02` | Removed, use `$spacing-06` instead | -| | `$layout-03` | Removed, use `$spacing-07` instead | -| | `$layout-04` | Removed, use `$spacing-09` instead | -| | `$layout-05` | Removed, use `$spacing-10` instead | -| | `$layout-06` | Removed, use `$spacing-12` instead | -| | `$layout-07` | Removed, use `$spacing-13` instead | -| | `$carbon--fluid-spacing-01` | | -| | `$carbon--fluid-spacing-02` | | -| | `$carbon--fluid-spacing-03` | | -| | `$carbon--fluid-spacing-04` | | -| | `$carbon--fluid-spacing` | | -| | `$fluid-spacing-01` | | -| | `$fluid-spacing-02` | | -| | `$fluid-spacing-03` | | -| | `$fluid-spacing-04` | | +| Filename | v10 | v11 | +| :---------------------- | :----------------------------------- | :------------------------------------------------------------------------------------------------------------------------ | +| `scss/_breakpoint.scss` | | Removed, use `@carbon/styles/scss/breakpoint`, `@carbon/react/scss/breakpoint`, or `@carbon/grid/scss/breakpoint` instead | +| `scss/_convert.scss` | `$carbon--base-font-size` | Renamed to `$base-font-size` | +| | `@function carbon--rem` | Renamed to `@function rem` | +| | `@function carbon--em` | Renamed to `@function em` | +| `scss/_key-height.scss` | `@function carbon--get-column-width` | Removed | +| | `$carbon--key-height-scales` | Removed | +| | `@function carbon--key-height` | Removed | +| `scss/_mini-unit.scss` | `$carbon--mini-unit-size` | Removed | +| | `@function carbon--mini-units` | Removed | +| `scss/_spacing.scss` | `$carbon--spacing-01` | Removed, use `$spacing-01` instead | +| | `$carbon--spacing-02` | Removed, use `$spacing-02` instead | +| | `$carbon--spacing-03` | Removed, use `$spacing-03` instead | +| | `$carbon--spacing-04` | Removed, use `$spacing-04` instead | +| | `$carbon--spacing-05` | Removed, use `$spacing-05` instead | +| | `$carbon--spacing-06` | Removed, use `$spacing-06` instead | +| | `$carbon--spacing-07` | Removed, use `$spacing-07` instead | +| | `$carbon--spacing-08` | Removed, use `$spacing-08` instead | +| | `$carbon--spacing-09` | Removed, use `$spacing-09` instead | +| | `$carbon--spacing-10` | Removed, use `$spacing-10` instead | +| | `$carbon--spacing-11` | Removed, use `$spacing-11` instead | +| | `$carbon--spacing-12` | Removed, use `$spacing-12` instead | +| | `$carbon--spacing-13` | Removed, use `$spacing-13` instead | +| | `$carbon--spacing` | Removed, use `$spacing` instead | +| | `$spacing-01` | No changes | +| | `$spacing-02` | No changes | +| | `$spacing-03` | No changes | +| | `$spacing-04` | No changes | +| | `$spacing-05` | No changes | +| | `$spacing-06` | No changes | +| | `$spacing-07` | No changes | +| | `$spacing-08` | No changes | +| | `$spacing-09` | No changes | +| | `$spacing-10` | No changes | +| | `$spacing-11` | No changes | +| | `$spacing-12` | No changes | +| | `$spacing-13` | No changes | +| | `$carbon--layout-01` | Removed, use `$spacing-05` instead | +| | `$carbon--layout-02` | Removed, use `$spacing-06` instead | +| | `$carbon--layout-03` | Removed, use `$spacing-07` instead | +| | `$carbon--layout-04` | Removed, use `$spacing-09` instead | +| | `$carbon--layout-05` | Removed, use `$spacing-10` instead | +| | `$carbon--layout-06` | Removed, use `$spacing-12` instead | +| | `$carbon--layout-07` | Removed, use `$spacing-13` instead | +| | `$carbon--layout` | Removed | +| | `$layout-01` | Removed, use `$spacing-05` instead | +| | `$layout-02` | Removed, use `$spacing-06` instead | +| | `$layout-03` | Removed, use `$spacing-07` instead | +| | `$layout-04` | Removed, use `$spacing-09` instead | +| | `$layout-05` | Removed, use `$spacing-10` instead | +| | `$layout-06` | Removed, use `$spacing-12` instead | +| | `$layout-07` | Removed, use `$spacing-13` instead | +| | `$carbon--fluid-spacing-01` | Removed, use `$fluid-spacing-01` instead | +| | `$carbon--fluid-spacing-02` | Removed, use `$fluid-spacing-02` instead | +| | `$carbon--fluid-spacing-03` | Removed, use `$fluid-spacing-03` instead | +| | `$carbon--fluid-spacing-04` | Removed, use `$fluid-spacing-04` instead | +| | `$carbon--fluid-spacing` | Removed, use `$fluid-spacing` instead | +| | `$fluid-spacing-01` | No changes | +| | `$fluid-spacing-02` | No changes | +| | `$fluid-spacing-03` | No changes | +| | `$fluid-spacing-04` | No changes | +| | `$fluid-spacing` | No changes | ## @carbon/motion +**Breaking changes** + +- This package now requires Dart Sass and uses Sass Modules +- The `scss` folder is no longer needed, you can import `@carbon/motion` + directly in Sass +- Variables, mixins, and functions using the `carbon--` prefix has been renamed +- Duration variables now have a `duration-` prefix + +**Imports** + | v10 | v11 | | :-------------------------------------- | :----------------------------------- | | `@import '@carbon/motion/scss/motion';` | `@use '@carbon/motion';` | +| | `@use '@carbon/styles/scss/motion';` | +| | `@use '@carbon/react/scss/motion';` | | `@import '@carbon/motion/scss/index';` | `@use '@carbon/motion';` | -| (alias) | `@use '@carbon/styles/scss/motion';` | -| (alias) | `@use '@carbon/react/scss/motion';` | +| | `@use '@carbon/styles/scss/motion';` | +| | `@use '@carbon/react/scss/motion';` | -**Changes** - -- This package now requires Dart Sass and uses Sass Modules +**Sass API** | v10 | v11 | | -------------------------- | ---------------------------------- | @@ -1505,33 +1552,46 @@ For full documentation, visit the ## @carbon/themes -| v10 | v11 | -| :------------------------------------- | :---------------------------------- | -| `@import '@carbon/theme/scss/themes';` | `@use '@carbon/themes';` | -| `@import '@carbon/theme/scss/index';` | `@use '@carbon/themes';` | -| (alias) | `@use '@carbon/styles/scss/theme';` | -| (alias) | `@use '@carbon/react/scss/theme';` | - -**Changes** +**Breaking changes** - This package now requires Dart Sass and uses Sass Modules - Variables, mixins, and functions with the `carbon--` prefix have been renamed +- Design Tokens have been changed, however you can use the + [compatability guide](#todo) to use v10 tokens along with v11 tokens +- The `theme` mixin now emits CSS Custom Properties by default for the given + theme, `$emit-custom-properties` and `$emit-difference` are no longer needed + +**Imports** + +| v10 | v11 | +| :------------------------------------------ | :----------------------------------- | +| `@import '@carbon/themes/scss/themes';` | `@use '@carbon/themes';` | +| | `@use '@carbon/styles';` | +| | `@use '@carbon/react/scss/themes';` | +| `@import '@carbon/themes/scss/index';` | `@use '@carbon/themes';` | +| | `@use '@carbon/styles/scss/theme';` | +| | `@use '@carbon/react/scss/theme';` | +| `@import '@carbon/themes/scss/theme-maps';` | `@use '@carbon/themes/scss/themes';` | +| | `@use '@carbon/styles/scss/themes';` | +| | `@use '@carbon/react/scss/themes';` | + +**Sass API** | Filename | v10 | v11 | | ----------------------- | ----------------------- | -------------------------------------------------------------------------------------------------- | -| `scss/_mixins.scss` | | Removed, use `_theme.scss` instead | +| `scss/_mixins.scss` | | Moved to `scss/theme` | | | `@mixin carbon--theme` | Renamed to `@mixin theme` | -| `scss/_theme-maps.scss` | | Removed, use `scss/_themes.scss` instead | -| | `$carbon--theme--white` | `$white` | -| | `$carbon--theme--g10` | `$g10` | -| | `$carbon--theme--g90` | `$g90` | -| | `$carbon--theme--g100` | `$g100` | +| `scss/_theme-maps.scss` | | Moved to `scss/themes` | +| | `$carbon--theme--white` | Renamed to `$white` | +| | `$carbon--theme--g10` | Renamed to `$g10` | +| | `$carbon--theme--g90` | Renamed to`$g90` | +| | `$carbon--theme--g100` | Renamed `$g100` | | `scss/_tokens.scss` | | Tokens have been changed, use the compatability theme or switch to the [new tokens](#designtokens) | -| `scss/_config.scss` | | New | -| `scss/_theme.scss` | | New | -| `scss/_themes.scss` | | New | -| `scss/themes.scss` | | Moved to `index.scss` | -| `scss/index.scss` | | Moved to `index.scss` | +| `scss/themes.scss` | | Moved to `@carbon/themes` | +| `scss/index.scss` | | Moved to `@carbon/themes` | + +For full Sass API documentation, visit the +[Sass Documentation](../../packages/themes/docs/sass.md) for this package. ### Design Tokens @@ -1547,148 +1607,241 @@ For full documentation, visit the counterpart. - **Deprecated:** v10 token was removed in v11. -| v10 token name | v11 token name | v11 contextual token | Status | -| :----------------- | :------------------------ | :--------------------- | :-------- | -| visited-link | link-visited | | Updated | -| ui-background | background | | Updated | -| ui-05 | layer-selected-inverse | | Split | -| ui-05 | border-inverse | | Split | -| ui-04 | border-strong-01 | border-strong | Split | -| ui-04 | toggle-off | | Split | -| ui-03 | layer-accent-01 | layer-accent | Split | -| ui-03 | border-subtle-01 | border-sublte | Split | -| ui-02 | layer-02 | layer | Updated | -| ui-01 | layer-01 | layer | Updated | -| text-error | text-error | | Updated | -| text-05 | text-helper | | Updated | -| text-04 | text-on-color | | Updated | -| text-03 | text-placeholder | | Updated | -| text-02 | text-secondary | | Updated | -| text-01 | text-primary | | Updated | -| support-04 | support-info | | Updated | -| support-03 | support-warning | | Updated | -| support-02 | support-success | | Updated | -| support-01 | support-error | | Updated | -| skeleton-02 | skeleton-element | | Updated | -| skeleton-01 | skeleton-background | | Updated | -| selected-ui | background-selected | | Split | -| selected-ui | layer-selected-01 | layer-selected | Split | -| selected-light-ui | layer-selected-02 | layer-selected | Updated | -| overlay-01 | overlay | | Updated | -| link-02 | link-secondary | | Updated | -| link-01 | link-primary | | Updated | -| inverse-support-04 | support-info-inverse | | Updated | -| inverse-support-03 | support-warning-inverse | | Updated | -| inverse-support-02 | support-success-inverse | | Updated | -| inverse-support-01 | support-error-inverse | | Updated | -| inverse-link | link-inverse | | Updated | -| inverse-hover-ui | background-inverse-hover | | Updated | -| inverse-focus-ui | focus-inverse | | Updated | -| inverse-02 | background-inverse | | Updated | -| inverse-01 | text-inverse | | Split | -| inverse-01 | icon-inverse | | Split | -| inverse-01 | focus-inset | | Split | -| interactive-04 | interactive | | Updated | -| interactive-04 | border-interactive | | Updated | -| interactive-03 | button-tertiary | | Updated | -| interactive-02 | button-secondary | | Updated | -| interactive-01 | background-brand | | Updated | -| interactive-01 | button-primary | | Updated | -| icon-03 | icon-on-color | | Updated | -| icon-02 | icon-secondary | | Updated | -| icon-01 | icon-primary | | Updated | -| hover-ui | background-hover | | Updated | -| hover-ui | layer-hover-01 | layer-hover | Split | -| hover-ui | field-hover-01 | field-hover | Split | -| hover-ui | field-hover-02 | field-hover | Split | -| hover-tertiary | button-tertiary-hover | | Updated | -| hover-selected-ui | background-selected-hover | | Split | -| hover-selected-ui | layer-selected-hover-01 | layer-selected-hover | Split | -| hover-selected-ui | layer-accent-hover-01 | layer-accent-hover | Split | -| hover-secondary | button-secondary-hover | | Updated | -| hover-row | background-hover | | Split | -| hover-row | layer-hover-01 | | Split | -| hover-primary-text | link-primary-hover | | Updated | -| hover-primary | button-primary-hover | | Updated | -| hover-light-ui | layer-hover-02 | layer-hover | Updated | -| hover-danger | button-danger-hover | | Updated | -| highlight | highlight | | No change | -| focus | focus | | No change | -| field-02 | field-02 | field | No change | -| field-01 | field-01 | field | No change | -| disabled-03 | layer-selected-disabled | | Split | -| disabled-03 | text-on-color-disabled | | Split | -| disabled-03 | icon-on-color-disabled | | Split | -| disabled-02 | text-disabled | | Split | -| disabled-02 | icon-disabled | | Split | -| disabled-02 | button-disabled | | Split | -| disabled-01 | border-disabled-01 | | Split | -| disabled-01 | border-disabled-03 | | Split | -| decorative-01 | border-subtle-02 | border-subtle | Updated | -| danger-02 | button-danger-secondary | | Updated | -| danger / danger-01 | button-danger-primary | | Updated | -| button-separator | button-separator | | No change | -| active-ui | background-active | | Split | -| active-ui | layer-active-01 | layer-active | Split | -| active-ui | layer-accent-active-01 | layer-accent-active | Split | -| active-ui | border-subtle-selected-01 | border-subtle-selected | Split | -| active-tertiary | button-tertiary-active | | Updated | -| active-secondary | button-secondary-active | | Updated | -| active-primary | button-primary-active | | Updated | -| active-light-ui | layer-active-02 | layer-active | Updated | -| active-danger | button-danger-active | | Updated | -| | border-subtle-00 | border-subtle | New | -| | layer-selected-hover-02 | layer-selected-hover | New | -| | layer-accent-02 | layer-accent | New | -| | layer-accent-hover-02 | layer-accent-hover | New | -| | layer-accent-active-02 | layer-accent-active | New | -| | border-strong-02 | border-strong | New | -| | border-subtle-selected-02 | border-subtle-selected | New | -| | layer-03 | layer | New | -| | layer-hover-03 | layer-hover | New | -| | layer-active-03 | layer-active | New | -| | layer-selected-03 | layer-selected | New | -| | layer-selected-hover-03 | layer-selected-hover | New | -| | layer-accent-03 | layer-accent | New | -| | layer-accent-hover-03 | layer-accent-hover | New | -| | layer-accent-active-03 | layer-accent-active | New | -| | field-03 | field | New | -| | field-hover-03 | field-hover | New | -| | border-strong-03 | border-strong | New | -| | border-subtle-03 | border-subtle | New | -| | border-subtle-selected-03 | border-subtle-selected | New | +| V10 token name | V11 token name | V11 Contextual token | Status | +| ------------------ | ------------------------- | ---------------------- | ---------- | +| active-danger | button-danger-active | — | Updated | +| active-light-ui | layer-active-02 | layer-active | Updated | +| active-primary | button-primary-active | — | Updated | +| active-secondary | button-secondary-active | — | Updated | +| active-tertiary | button-tertiary-active | — | Updated | +| active-ui | layer-active-01 | layer-active | Split | +| active-ui | background-active | — | Split | +| active-ui | layer-accent-active-01 | layer-accent-active | Split | +| active-ui | border-subtle-selected-01 | border-sublte-selected | Split | +| button-separator | button-separator | — | No change | +| danger | button-danger-primary | — | Deprecated | +| danger-01 | button-danger-primary | — | Updated | +| danger-02 | button-danger-secondary | — | Updated | +| decorative-01 | border-subtle-02 | border-subtle | Updated | +| disabled-01 | — | — | Deprecated | +| disabled-02 | text-disabled | — | Split | +| disabled-02 | icon-disabled | — | Split | +| disabled-02 | button-disabled | — | Split | +| disabled-02 | border-disabled | border-disabled | Split | +| disabled-03 | icon-on-color-disabled | — | Split | +| disabled-03 | layer-selected-disabled | — | Split | +| disabled-03 | text-on-color-disabled | — | Split | +| field-01 | field-01 | field | No change | +| field-02 | field-02 | field | No change | +| focus | focus | — | No change | +| highlight | highlight | — | No change | +| hover-danger | button-danger-hover | — | Updated | +| hover-light-ui | layer-hover-02 | — | Updated | +| hover-primary | button-primary-hover | — | Updated | +| hover-primary-text | link-primary-hover | — | Updated | +| hover-secondary | button-secondary-hover | — | Updated | +| hover-selected-ui | background-selected-hover | — | Split | +| hover-selected-ui | layer-accent-hover-01 | layer-accent-hover | Split | +| hover-selected-ui | layer-selected-hover-01 | layer-selected-hover | Split | +| hover-tertiary | button-tertiary-hover | — | Updated | +| hover-ui | background-hover | — | Updated | +| hover-ui | layer-hover-01 | layer-hover | Split | +| hover-ui | field-hover-01 | field-hover | Split | +| hover-ui | field-hover-02 | field-hover | Split | +| icon-01 | icon-primary | — | Updated | +| icon-02 | icon-secondary | — | Updated | +| icon-03 | icon-on-color | — | Updated | +| interactive-01 | button-primary | — | Updated | +| interactive-01 | background-brand | — | Updated | +| interactive-02 | button-secondary | — | Updated | +| interactive-03 | button-tertiary | — | Updated | +| interactive-04 | border-interactive | — | Split | +| interactive-04 | interactive | — | Split | +| inverse-01 | icon-inverse | — | Split | +| inverse-01 | focus-inset | — | Split | +| inverse-01 | text-inverse | — | Split | +| inverse-02 | "background-inverse " | — | Updated | +| inverse-focus-ui | focus-inverse | — | Updated | +| inverse-hover-ui | background-inverse-hover | — | Updated | +| inverse-link | link-inverse | — | Updated | +| inverse-support-01 | support-error-inverse | — | Updated | +| inverse-support-02 | support-success-inverse | — | Updated | +| inverse-support-03 | support-warning-inverse | — | Updated | +| inverse-support-04 | support-info-inverse | — | Updated | +| link-01 | link-primary | — | Updated | +| link-02 | link-secondary | — | Updated | +| overlay-01 | overlay | — | Updated | +| selected-light-ui | layer-selected-02 | — | Updated | +| selected-ui | layer-selected-01 | layer-selected | Split | +| selected-ui | background-selected | — | Split | +| skeleton-01 | skeleton-background | — | Updated | +| skeleton-02 | skeleton-element | — | Updated | +| support-01 | support-error | — | Updated | +| support-02 | support-success | — | Updated | +| support-03 | support-warning | — | Updated | +| support-04 | support-info | — | Updated | +| text-01 | text-primary | — | Updated | +| text-02 | text-secondary | — | Updated | +| text-03 | text-placeholder | — | Updated | +| text-04 | text-on-color | — | Updated | +| text-05 | text-helper | — | Updated | +| text-error | text-error | — | Updated | +| hover-row | layer-hover-01 | layer-hover | Deprecated | +| ui-01 | layer-01 | layer | Updated | +| ui-02 | layer-02 | layer | Updated | +| ui-03 | layer-accent-01 | layer-accent | Split | +| ui-03 | border-subtle-01 | border-subtle | Split | +| ui-04 | toggle-off | — | Split | +| ui-04 | border-strong-01 | border-strong | Split | +| ui-05 | border-inverse | — | Updated | +| ui-05 | layer-selected-inverse | — | Updated | +| ui-background | background | — | Updated | +| visited-link | link-visited | — | Updated | +| brand-01 | — | — | Deprecated | +| brand-02 | — | — | Deprecated | +| brand-03 | — | — | Deprecated | +| — | border-strong-02 | border-strong | New | +| — | border-strong-03 | border-strong | New | +| — | border-subtle-00 | border-subtle | New | +| — | border-subtle-03 | border-subtle | New | +| — | border-subtle-selected-02 | border-subtle-selected | New | +| — | border-subtle-selected-03 | border-subtle-selected | New | +| — | field-03 | field | New | +| — | field-hover-03 | field-hover | New | +| — | layer-03 | layer | New | +| — | layer-active-03 | layer-active | New | +| — | layer-hover-03 | layer-hover | New | +| — | layer-selected-03 | layer-selected | New | +| — | layer-selected-hover-02 | layer-selected-hover | New | +| — | layer-selected-hover-03 | layer-selected-hover | New | +| — | layer-accent-02 | layer-accent | New | +| — | layer-accent-03 | layer-accent | New | +| — | layer-accent-active-02 | layer-accent-active | New | +| — | layer-accent-active-03 | layer-accent-active | New | +| — | layer-accent-hover-02 | layer-accent-hover | New | +| — | layer-accent-hover-03 | layer-accent-hover | New | + +### Compatability + +To make it easier to move between v10 and v11 of Carbon, we've introduced a +compatability theme that includes the tokens from v10 and v11 so that you can +incrementally update your project. + +You can use a "compatability theme" by setting the `$fallback` to a value from +`scss/compat/themes`. For example: -## @carbon/type +```scss +@use '@carbon/themes/scss/compat/themes' as compat; +@use '@carbon/themes/scss/themes'; +@use '@carbon/themes/scss/theme' with ( + $fallback: compat.$g100, + $theme: themes.$g100, +); +``` -| v10 | v11 | -| :------------------------------------ | :--------------------------------- | -| `@import '@carbon/type/scss/styles';` | `@use '@carbon/type';` | -| (alias) | `@use '@carbon/styles/scss/type';` | -| (alias) | `@use '@carbon/react/scss/type';` | +In this code snippet, we set the current theme to `$g100` and include the +compatability theme for `$g100` as the `$fallback. -**Changes** +## @carbon/type + +**Breaking changes** - This package now requires Dart Sass and uses Sass Modules +- The `scss` folder is no longer needed, you can import `@carbon/type` directly + in Sass - Variables, mixins, and functions with the `carbon--` prefix have been renamed -| Filename | v10 | v11 | -| ------------------------ | --------------------------------- | --------------------------------- | -| `index.scss` | | New | -| `scss/_scale.scss` | `@function carbon--get-type-size` | Removed, use `type-scale` instead | -| | `$carbon--type-scale` | `$type-scale` | -| | `@function carbon--type-scale` | `@function type-scale` | -| | `@mixin carbon--type-scale` | `@mixin type-scale` | -| | `@mixin carbon--font-size` | `@mixin font-size` | -| `scss/_font-family.scss` | `$carbon--font-families` | `$font-families` | -| | `@function carbon--font-family` | `font-family` | -| | `@mixin carbon--font-family` | `font-family` | -| | `$carbon--font-weights` | `$font-weights` | -| | `@function carbon--font-weight` | `font-weight` | -| | `@mixin carbon--font-weight` | `font-weight` | -| `scss/_prefix.scss` | | No Changes | -| `scss/_styles.scss` | `@mixin carbon--type-style` | `@mixin type-style` | -| `scss/_reset.scss` | `@mixin carbon--default-type` | `@mixin default-type` | -| | `@mixin carbon--type-reset` | `@mixin type-reset` | -| `scss/_classes.scss` | `@mixin carbon--type-classes` | `@mixin type-classes` | +**Imports** + +All imports in v11 have been replaced by `@carbon/type`. For example, if you +were importing `@carbon/type/scss/styles` in v10 you would now only import +`@carbon/type` and use exports from that module directly. + +| v10 | v11 | +| :------------------------------- | :--------------------------------- | +| `@import '@carbon/type/scss/*';` | `@use '@carbon/type';` | +| | `@use '@carbon/styles/scss/type';` | +| | `@use '@carbon/react/scss/type';` | + +**Sass API** + +| Filename | v10 | v11 | +| ------------------------------------- | ------------------------------------ | ------------------------------------ | +| `scss/index.scss` | | Removed, use `@carbon/type` directly | +| `scss/type.scss` | | Removed, use `@carbon/type` directly | +| `scss/_classes.scss` | `@mixin carbon--type-classes` | Renamed to `@mixin type-classes` | +| `scss/font-face/_mono.scss` | `@mixin carbon--font-face-mono` | TODO | +| `scss/font-face/_sans-condensed.scss` | `@mixin carbon--font-face-condensed` | TODO | +| `scss/font-face/_sans.scss` | `@mixin carbon--font-face-sans` | TODO | +| `scss/font-face/_serif.scss` | `@mixin carbon--font-face-serif` | TODO | +| `scss/font-face/_settings.scss` | `$carbon--font-display` | TODO | +| `scss/_font-family.scss` | `$carbon--font-families` | Renamed to `$font-families` | +| | `@function carbon--font-family` | Renamed to `@function font-family` | +| | `@mixin carbon--font-family` | Renamed to `@mixin font-family` | +| | `$carbon--font-weights` | Renamed to `$font-weights` | +| | `@function carbon--font-weight` | Renamed to `@function font-weight` | +| | `@mixin carbon--font-weight` | Renamed to `@mixin font-weight` | +| `scss/_prefix.scss` | | No Changes | +| `scss/_reset.scss` | `@mixin carbon--default-type` | Renamed to `@mixin default-type` | +| | `@mixin carbon--type-reset` | Renamed to `@mixin type-reset` | +| `scss/_scale.scss` | `@function carbon--get-type-size` | Removed, use `type-scale` instead | +| | `$carbon--type-scale` | Renamed to `$type-scale` | +| | `@function carbon--type-scale` | Renamed to `@function type-scale` | +| | `@mixin carbon--type-scale` | Renamed to `@mixin type-scale` | +| | `@mixin carbon--font-size` | Renamed to `@mixin font-size` | +| `scss/_styles.scss` | `@mixin carbon--type-style` | Renamed to `@mixin type-style` | +| `scss/_styles.scss` | `$caption-01` | Removed | +| | `$caption-02` | Removed | + +## Type tokens + +**Status key:** + +- **No change:** Token name has no change between versions. +- **Updated:** This is just a name change, the role remains the same between v10 + and v11. +- **New:** A net new type token to the system in v11. It has no v10 counterpart. +- **Deprecated:** v10 token was removed in v11. + +| Category | V10 token name | V11 token name | Status | +| -------------------- | ----------------------- | ------------------ | ---------- | +| Utility styles | code-01 | code-01 | No change | +| | code-02 | code-02 | No change | +| | label-01 | label-01 | No change | +| | label-02 | label-02 | No change | +| | helper-text-01 | helper-text-01 | No change | +| | helper-text-02 | helper-text-02 | No change | +| | | legal-01 | New | +| | | legal-02 | New | +| | caption-01 | | Deprecated | +| | caption-02 | | Deprecated | +| Body styles | | | | +| | body-short-01 | body-compact-01 | Updated | +| | body-short-02 | body-compact-02 | Updated | +| | body-long-01 | body-01 | Updated | +| | body-long-02 | body-02 | Updated | +| Fixed heading styles | | | | +| | productive-heading-01 | heading-compact-01 | Updated | +| | productive-heading-02 | heading-compact-02 | Updated | +| | expressive-heading-01 | heading-01 | Updated | +| | expressive-heading-02 | heading-02 | Updated | +| | productive-heading-03 | heading-03 | Updated | +| | productive-heading-04 | heading-04 | Updated | +| | productive-heading-05 | heading-05 | Updated | +| | productive-heading-06 | heading-06 | Updated | +| | productive-heading-07 | heading-07 | Updated | +| Fluid heading styles | | | | +| | expressive-heading-03 | fluid-heading-03 | Updated | +| | expressive-heading-04 | fluid-heading-04 | Updated | +| | expressive-heading-05 | fluid-heading-05 | Updated | +| | expressive-heading-06 | fluid-heading-06 | Updated | +| Fluid display styles | | | | +| | expressive-paragraph-01 | fluid-paragraph-01 | Updated | +| | quotation-01 | fluid-quotation-01 | Updated | +| | quotation-02 | fluid-quotation-02 | Updated | +| | display-01 | fluid-display-01 | Updated | +| | display-02 | fluid-display-02 | Updated | +| | display-03 | fluid-display-03 | Updated | +| | display-04 | fluid-display-04 | Updated | ## FAQ diff --git a/examples/codesandbox-styles/package.json b/examples/codesandbox-styles/package.json index 310c5a91a666..241edb18883c 100644 --- a/examples/codesandbox-styles/package.json +++ b/examples/codesandbox-styles/package.json @@ -1,7 +1,7 @@ { "name": "codesandbox-styles", "private": true, - "version": "0.0.0", + "version": "0.1.0-rc.0", "scripts": { "develop": "vite" }, @@ -9,7 +9,7 @@ "vite": "^2.8.0" }, "dependencies": { - "@carbon/styles": "0.14.0", + "@carbon/styles": "^0.15.0-rc.0", "sass": "^1.49.7" } } diff --git a/examples/codesandbox/package.json b/examples/codesandbox/package.json index 3280ec40e4a9..a2023aa16475 100644 --- a/examples/codesandbox/package.json +++ b/examples/codesandbox/package.json @@ -1,12 +1,12 @@ { "name": "codesandbox", "private": true, - "version": "0.0.0", + "version": "0.1.0-rc.0", "scripts": { "develop": "vite" }, "dependencies": { - "@carbon/react": "0.14.0", + "@carbon/react": "^0.15.0-rc.0", "react": "^17.0.2", "react-dom": "^17.0.2" }, diff --git a/packages/carbon-react/package.json b/packages/carbon-react/package.json index 9e5c1c24e3c0..2f7127af5402 100644 --- a/packages/carbon-react/package.json +++ b/packages/carbon-react/package.json @@ -1,7 +1,7 @@ { "name": "@carbon/react", "description": "React components for the Carbon Design System", - "version": "0.14.0", + "version": "0.15.0-rc.0", "license": "Apache-2.0", "main": "lib/index.js", "module": "es/index.js", @@ -43,11 +43,11 @@ }, "dependencies": { "@carbon/feature-flags": "^0.7.0", - "@carbon/icons-react": "^10.46.0", - "@carbon/styles": "^0.14.0", + "@carbon/icons-react": "^10.47.0-rc.0", + "@carbon/styles": "^0.15.0-rc.0", "@carbon/telemetry": "0.0.0-alpha.6", - "carbon-components": "^10.53.0", - "carbon-components-react": "^7.53.0", + "carbon-components": "^10.54.0-rc.0", + "carbon-components-react": "^7.54.0-rc.0", "carbon-icons": "^7.0.7" }, "devDependencies": { @@ -58,7 +58,7 @@ "@babel/plugin-transform-react-constant-elements": "^7.16.7", "@babel/preset-env": "^7.16.7", "@babel/preset-react": "^7.16.7", - "@carbon/themes": "^10.51.0", + "@carbon/themes": "^10.52.0-rc.0", "@rollup/plugin-babel": "^5.3.0", "@rollup/plugin-commonjs": "^21.0.0", "@rollup/plugin-node-resolve": "^13.0.0", diff --git a/packages/cli/package.json b/packages/cli/package.json index a5bcd7b5c668..f7d77f06637e 100644 --- a/packages/cli/package.json +++ b/packages/cli/package.json @@ -1,7 +1,7 @@ { "name": "@carbon/cli", "description": "Task automation for working with the Carbon Design System", - "version": "10.33.0", + "version": "10.34.0-rc.0", "license": "Apache-2.0", "bin": { "carbon-cli": "./bin/carbon-cli.js" diff --git a/packages/colors/docs/sass.md b/packages/colors/docs/sass.md index 8e3f76190226..828b2aa8d5e3 100644 --- a/packages/colors/docs/sass.md +++ b/packages/colors/docs/sass.md @@ -32,11 +32,28 @@ the IBM Design Language using the `$colors` variable. } ``` -Each key in the `$colors` map is the name of a swatch. The value of each entry -is a `Map` where the keys are the grade and the values are the color values for -the swatch at that grade. +Each key in the `$colors` map is the name of a group of colors, also known as a +swatch. The value of each entry is a `Map` where the keys are the color grade +and the values are the hex codes for the color at that grade. For example: -## Exports +```scss +$colors: ( + blue: ( + 10: #edf5ff, + 20: #d0e2ff, + 30: #a6c8ff, + 40: #78a9ff, + 50: #4589ff, + 60: #0f62fe, + 70: #0043ce, + 80: #002d9c, + 90: #001d6c, + 100: #001141, + ), +); +``` + +## API | Name | Type | | :--------------------- | :---- | diff --git a/packages/colors/package.json b/packages/colors/package.json index 68cca3821203..579cc3d5d812 100644 --- a/packages/colors/package.json +++ b/packages/colors/package.json @@ -1,7 +1,7 @@ { "name": "@carbon/colors", "description": "Colors for digital and software products using the Carbon Design System", - "version": "10.36.0", + "version": "10.37.0-rc.0", "license": "Apache-2.0", "main": "lib/index.js", "module": "es/index.js", @@ -36,7 +36,7 @@ "clean": "rimraf css es lib umd scss index.scss" }, "devDependencies": { - "@carbon/cli": "^10.33.0", + "@carbon/cli": "^10.34.0-rc.0", "@carbon/cli-reporter": "^10.5.0", "@carbon/scss-generator": "^10.13.0", "@carbon/test-utils": "^10.21.0", diff --git a/packages/components/package.json b/packages/components/package.json index 0700e104a4df..6929e7798c5a 100644 --- a/packages/components/package.json +++ b/packages/components/package.json @@ -1,7 +1,7 @@ { "name": "carbon-components", "description": "The Carbon Design System is IBM’s open-source design system for products and experiences.", - "version": "10.53.0", + "version": "10.54.0-rc.0", "license": "Apache-2.0", "main": "umd/index.js", "module": "es/index.js", @@ -77,10 +77,10 @@ "@babel/preset-env": "^7.16.7", "@babel/preset-react": "^7.16.7", "@babel/runtime": "^7.16.7", - "@carbon/cli": "^10.33.0", - "@carbon/elements": "^10.52.0", - "@carbon/icons-handlebars": "^10.46.0", - "@carbon/icons-react": "^10.46.0", + "@carbon/cli": "^10.34.0-rc.0", + "@carbon/elements": "^10.53.0-rc.0", + "@carbon/icons-handlebars": "^10.47.0-rc.0", + "@carbon/icons-react": "^10.47.0-rc.0", "@carbon/test-utils": "^10.21.0", "@frctl/fractal": "^1.1.0", "@rollup/plugin-babel": "^5.3.0", @@ -117,8 +117,8 @@ "gulp-header": "^2.0.0", "gulp-jsdoc3": "^2.0.0", "gulp-nodemon": "^2.4.2", - "gulp-postcss": "^8.0.0", - "gulp-rename": "^1.4.0", + "gulp-postcss": "^9.0.0", + "gulp-rename": "^2.0.0", "gulp-sass": "^4.1.0", "gulp-sass-lint": "^1.4.0", "gulp-sourcemaps": "^2.6.0", @@ -127,7 +127,7 @@ "handlebars-helpers": "^0.10.0", "html-loader": "^0.5.0", "jasmine-core": "^3.0.0", - "karma": "^4.0.0", + "karma": "^6.0.0", "karma-chrome-launcher": "^2.2.0", "karma-coverage": "^2.0.3", "karma-firefox-launcher": "^2.1.0", diff --git a/packages/components/src/components/content-switcher/_content-switcher.scss b/packages/components/src/components/content-switcher/_content-switcher.scss index e64c5723f3c1..024e346833cf 100644 --- a/packages/components/src/components/content-switcher/_content-switcher.scss +++ b/packages/components/src/components/content-switcher/_content-switcher.scss @@ -66,6 +66,10 @@ transform: scaleY(0); transform-origin: bottom; transition: all $duration--moderate-01 motion(standard, productive); + + @media (prefers-reduced-motion: reduce) { + transition: none; + } } &:disabled::after { diff --git a/packages/components/src/components/pagination/_pagination.scss b/packages/components/src/components/pagination/_pagination.scss index f6e6283ab7d1..68fec49a6b00 100644 --- a/packages/components/src/components/pagination/_pagination.scss +++ b/packages/components/src/components/pagination/_pagination.scss @@ -105,6 +105,20 @@ $css--helpers: true; background: $hover-ui; } + .#{$prefix}--pagination + .#{$prefix}--select--inline + .#{$prefix}--select-input:focus, + .#{$prefix}--pagination + .#{$prefix}--select--inline + .#{$prefix}--select-input:focus + option, + .#{$prefix}--pagination + .#{$prefix}--select--inline + .#{$prefix}--select-input:focus + optgroup { + background-color: $layer; + } + .#{$prefix}--pagination .#{$prefix}--select__arrow { top: 50%; transform: translate(-0.5rem, -50%); diff --git a/packages/components/src/components/progress-bar/_progress-bar.scss b/packages/components/src/components/progress-bar/_progress-bar.scss index 59f9c1764c34..e21c7ef79541 100644 --- a/packages/components/src/components/progress-bar/_progress-bar.scss +++ b/packages/components/src/components/progress-bar/_progress-bar.scss @@ -28,6 +28,14 @@ background-color: $layer; } + .#{$prefix}--progress-bar--big .#{$prefix}--progress-bar__track { + height: rem(8px); + } + + .#{$prefix}--progress-bar--small .#{$prefix}--progress-bar__track { + height: rem(4px); + } + .#{$prefix}--progress-bar__bar { display: block; width: 100%; diff --git a/packages/components/src/components/select/_select.scss b/packages/components/src/components/select/_select.scss index ebc21d7bb7a1..ca42a3852bbd 100644 --- a/packages/components/src/components/select/_select.scss +++ b/packages/components/src/components/select/_select.scss @@ -52,6 +52,7 @@ border-radius: 0; color: $text-01; cursor: pointer; + font-family: inherit; // reset disabled ` */ diff --git a/packages/react/src/components/Search/next/Search.stories.js b/packages/react/src/components/Search/next/Search.stories.js index 981d6b725133..c384e00c652a 100644 --- a/packages/react/src/components/Search/next/Search.stories.js +++ b/packages/react/src/components/Search/next/Search.stories.js @@ -5,19 +5,26 @@ * LICENSE file in the root directory of this source tree. */ -import { Search, ExpandableSearch } from 'carbon-components-react'; +import { ExpandableSearch } from 'carbon-components-react'; +import Search from '../'; import React from 'react'; import { Layer } from '../../Layer'; export default { title: 'Components/Search', component: Search, + argTypes: { + size: { + options: ['sm', 'md', 'lg'], + control: { type: 'select' }, + }, + }, subcomponents: { ExpandableSearch, }, }; -export const Default = () => ( +export const Default = (args) => ( ( id="search-1" onChange={() => {}} onKeyDown={() => {}} + {...args} /> ); -export const Disabled = () => ( +export const Disabled = (args) => ( ( id="search-1" onChange={() => {}} onKeyDown={() => {}} + {...args} /> ); -export const Expandable = () => ( +export const Expandable = (args) => ( ( id="search-expandable-1" onChange={() => {}} onKeyDown={() => {}} + {...args} /> ); -export const WithLayer = () => { +export const WithLayer = (args) => { return ( <> { id="search-1" onChange={() => {}} onKeyDown={() => {}} + {...args} /> { id="search-1" onChange={() => {}} onKeyDown={() => {}} + {...args} /> { id="search-1" onChange={() => {}} onKeyDown={() => {}} + {...args} /> @@ -91,7 +104,7 @@ export const WithLayer = () => { ); }; -export const ExpandableWithLayer = () => { +export const ExpandableWithLayer = (args) => { return ( <> { id="search-expandable-1" onChange={() => {}} onKeyDown={() => {}} + {...args} /> { id="search-expandable-1" onChange={() => {}} onKeyDown={() => {}} + {...args} /> { id="search-expandable-1" onChange={() => {}} onKeyDown={() => {}} + {...args} /> diff --git a/packages/react/src/components/Select/next/Select.stories.js b/packages/react/src/components/Select/next/Select.stories.js index 3050aeaeca66..6846eeceacd6 100644 --- a/packages/react/src/components/Select/next/Select.stories.js +++ b/packages/react/src/components/Select/next/Select.stories.js @@ -56,7 +56,7 @@ export const Inline = () => { inline id="select-1" defaultValue="placeholder-item" - labelText="" + labelText="Select" helperText="Optional helper text"> p { - @include type-style('body-long-01'); + @include type-style('body-01'); } } diff --git a/packages/styles/scss/components/breadcrumb/_breadcrumb.scss b/packages/styles/scss/components/breadcrumb/_breadcrumb.scss index 3a743fcd3b46..156fd5905069 100644 --- a/packages/styles/scss/components/breadcrumb/_breadcrumb.scss +++ b/packages/styles/scss/components/breadcrumb/_breadcrumb.scss @@ -17,7 +17,7 @@ @mixin breadcrumb { .#{$prefix}--breadcrumb { @include reset; - @include type-style('body-short-01'); + @include type-style('body-compact-01'); display: inline; diff --git a/packages/styles/scss/components/checkbox/_checkbox.scss b/packages/styles/scss/components/checkbox/_checkbox.scss index c6c3e60dbdf1..3a97ed9127d6 100644 --- a/packages/styles/scss/components/checkbox/_checkbox.scss +++ b/packages/styles/scss/components/checkbox/_checkbox.scss @@ -51,7 +51,7 @@ // accommodate the spacing needed for the checkbox. .#{$prefix}--checkbox-label { @include reset; - @include type-style('body-short-01'); + @include type-style('body-compact-01'); position: relative; display: flex; diff --git a/packages/styles/scss/components/code-snippet/_code-snippet.scss b/packages/styles/scss/components/code-snippet/_code-snippet.scss index 5ed39975fab4..86877a2ce3c2 100644 --- a/packages/styles/scss/components/code-snippet/_code-snippet.scss +++ b/packages/styles/scss/components/code-snippet/_code-snippet.scss @@ -298,7 +298,7 @@ $copy-btn-feedback: $background-inverse !default; } .#{$prefix}--btn--copy__feedback { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); @include font-family('sans'); z-index: z('overlay'); @@ -328,7 +328,7 @@ $copy-btn-feedback: $background-inverse !default; // Show more / less button .#{$prefix}--snippet-btn--expand { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); @include font-family('sans'); position: absolute; @@ -379,7 +379,7 @@ $copy-btn-feedback: $background-inverse !default; .#{$prefix}--snippet-btn--expand .#{$prefix}--icon-chevron--down { transform: rotate(180deg); - transition: transform $transition--expansion; + transition: transform $transition-expansion; } // Light version diff --git a/packages/styles/scss/components/content-switcher/_content-switcher.scss b/packages/styles/scss/components/content-switcher/_content-switcher.scss index 87ccc4a0858d..b509563f1bd5 100644 --- a/packages/styles/scss/components/content-switcher/_content-switcher.scss +++ b/packages/styles/scss/components/content-switcher/_content-switcher.scss @@ -36,7 +36,7 @@ @include reset; @include font-family('sans'); @include focus-outline('reset'); - @include type-style('body-short-01'); + @include type-style('body-compact-01'); position: relative; display: inline-flex; @@ -67,6 +67,10 @@ transform: scaleY(0); transform-origin: bottom; transition: all $duration-moderate-01 motion(standard, productive); + + @media (prefers-reduced-motion: reduce) { + transition: none; + } } &:disabled::after { diff --git a/packages/styles/scss/components/copy-button/_copy-button.scss b/packages/styles/scss/components/copy-button/_copy-button.scss index 3715d6c6d57b..081ba6482e88 100644 --- a/packages/styles/scss/components/copy-button/_copy-button.scss +++ b/packages/styles/scss/components/copy-button/_copy-button.scss @@ -35,7 +35,7 @@ &::before { @include box-shadow; - @include type-style('body-short-01'); + @include type-style('body-compact-01'); z-index: 2; top: 1.1rem; diff --git a/packages/styles/scss/components/data-table/_data-table.scss b/packages/styles/scss/components/data-table/_data-table.scss index be47444d01e6..adcf84802e49 100644 --- a/packages/styles/scss/components/data-table/_data-table.scss +++ b/packages/styles/scss/components/data-table/_data-table.scss @@ -43,13 +43,13 @@ } .#{$prefix}--data-table-header__title { - @include type-style('productive-heading-03'); + @include type-style('heading-03'); color: $text-primary; } .#{$prefix}--data-table-header__description { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); color: $text-secondary; } @@ -64,13 +64,13 @@ } .#{$prefix}--data-table thead { - @include type-style('productive-heading-01'); + @include type-style('heading-compact-01'); background-color: $layer-accent; } .#{$prefix}--data-table tbody { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); width: 100%; background-color: $layer; diff --git a/packages/styles/scss/components/data-table/action/_data-table-action.scss b/packages/styles/scss/components/data-table/action/_data-table-action.scss index dfe8bc015a37..ee62f2038a19 100644 --- a/packages/styles/scss/components/data-table/action/_data-table-action.scss +++ b/packages/styles/scss/components/data-table/action/_data-table-action.scss @@ -77,7 +77,7 @@ height: $spacing-09; box-shadow: none; cursor: pointer; - transition: width $transition--expansion $standard-easing, + transition: width $transition-expansion $standard-easing, background-color $duration-fast-02 motion(entrance, productive); &:hover { @@ -476,7 +476,7 @@ .#{$prefix}--btn--primary.#{$prefix}--batch-summary__cancel:hover::before { opacity: 0; - transition: opacity $transition--base $standard-easing; + transition: opacity $transition-base $standard-easing; } // cancel btn @@ -496,7 +496,7 @@ } .#{$prefix}--batch-summary__para { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); } //------------------------------------------------- diff --git a/packages/styles/scss/components/data-table/sort/_data-table-sort.scss b/packages/styles/scss/components/data-table/sort/_data-table-sort.scss index 76c888b920a2..8f5773bd7fde 100644 --- a/packages/styles/scss/components/data-table/sort/_data-table-sort.scss +++ b/packages/styles/scss/components/data-table/sort/_data-table-sort.scss @@ -181,7 +181,7 @@ fill: $icon-primary; opacity: 1; transform: rotate(0); - transition: transform $transition--base $standard-easing; + transition: transform $transition-base $standard-easing; } //---------------------------------------------------------------------------- diff --git a/packages/styles/scss/components/date-picker/_flatpickr.scss b/packages/styles/scss/components/date-picker/_flatpickr.scss index 7b5c68ac63a8..05488461eaf8 100644 --- a/packages/styles/scss/components/date-picker/_flatpickr.scss +++ b/packages/styles/scss/components/date-picker/_flatpickr.scss @@ -200,7 +200,7 @@ } .flatpickr-month { - @include type-style('productive-heading-01'); + @include type-style('heading-compact-01'); display: flex; height: rem(40px); @@ -247,7 +247,7 @@ } .flatpickr-current-month { - @include type-style('productive-heading-01'); + @include type-style('heading-compact-01'); display: flex; height: rem(28px); @@ -387,7 +387,7 @@ } .flatpickr-weekday { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); flex: 1; color: $text-primary; @@ -425,7 +425,7 @@ } .flatpickr-day { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); display: flex; width: rem(40px); diff --git a/packages/styles/scss/components/dropdown/_dropdown.scss b/packages/styles/scss/components/dropdown/_dropdown.scss index b1697a954e29..6ff7b6356000 100644 --- a/packages/styles/scss/components/dropdown/_dropdown.scss +++ b/packages/styles/scss/components/dropdown/_dropdown.scss @@ -29,7 +29,7 @@ grid-template: auto auto / auto min-content; .#{$prefix}--label { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); } .#{$prefix}--label, @@ -167,7 +167,7 @@ } .#{$prefix}--dropdown-text { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); display: block; overflow: hidden; @@ -184,7 +184,7 @@ @include reset; @include focus-outline('reset'); @include box-shadow; - @include type-style('body-short-01'); + @include type-style('body-compact-01'); position: absolute; z-index: z('dropdown'); diff --git a/packages/styles/scss/components/file-uploader/_file-uploader.scss b/packages/styles/scss/components/file-uploader/_file-uploader.scss index d093294b83df..972b5342afd8 100644 --- a/packages/styles/scss/components/file-uploader/_file-uploader.scss +++ b/packages/styles/scss/components/file-uploader/_file-uploader.scss @@ -35,7 +35,7 @@ // TODO: sync with type .#{$prefix}--file--label { @include reset; - @include type-style('productive-heading-01'); + @include type-style('heading-compact-01'); margin-bottom: $spacing-03; color: $text-primary; @@ -108,7 +108,7 @@ .#{$prefix}--label-description { @include reset; - @include type-style('body-short-01'); + @include type-style('body-compact-01'); margin-bottom: $spacing-05; color: $text-secondary; @@ -161,7 +161,7 @@ } .#{$prefix}--file-filename { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); overflow: hidden; margin-left: $spacing-05; @@ -247,7 +247,7 @@ // TODO: deprecate .#{$prefix}--file__selected-file--invalid + .#{$prefix}--form-requirement { - @include type-style('caption-01'); + @include type-style('label-01'); display: block; overflow: visible; diff --git a/packages/styles/scss/components/form/_form.scss b/packages/styles/scss/components/form/_form.scss index 528fd2af9db6..827f75fd3990 100644 --- a/packages/styles/scss/components/form/_form.scss +++ b/packages/styles/scss/components/form/_form.scss @@ -34,7 +34,7 @@ $input-label-weight: 400 !default; } .#{$prefix}--form-item { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); display: flex; // We specify `auto` as the default value so that the form item does @@ -161,7 +161,7 @@ $input-label-weight: 400 !default; .#{$prefix}--form-requirement { @include reset; - @include type-style('caption-01'); + @include type-style('label-01'); display: none; overflow: hidden; diff --git a/packages/styles/scss/components/link/_link.scss b/packages/styles/scss/components/link/_link.scss index 508998d83be2..0fe22431a15a 100644 --- a/packages/styles/scss/components/link/_link.scss +++ b/packages/styles/scss/components/link/_link.scss @@ -30,7 +30,7 @@ $link-focus-text-color: custom-property.get-var( @mixin link { .#{$prefix}--link { @include component-reset.reset; - @include type.type-style('body-short-01'); + @include type.type-style('body-compact-01'); display: inline-flex; color: $link-text-color; @@ -68,7 +68,7 @@ $link-focus-text-color: custom-property.get-var( .#{$prefix}--link--disabled, .#{$prefix}--link--disabled:hover { @include component-reset.reset; - @include type.type-style('body-short-01'); + @include type.type-style('body-compact-01'); color: $text-disabled; cursor: not-allowed; @@ -102,7 +102,7 @@ $link-focus-text-color: custom-property.get-var( } .#{$prefix}--link--lg { - @include type.type-style('body-short-02'); + @include type.type-style('body-compact-02'); } .#{$prefix}--link__icon { diff --git a/packages/styles/scss/components/list-box/_list-box.scss b/packages/styles/scss/components/list-box/_list-box.scss index 108f083f6f81..5443f43bc87f 100644 --- a/packages/styles/scss/components/list-box/_list-box.scss +++ b/packages/styles/scss/components/list-box/_list-box.scss @@ -55,7 +55,7 @@ $list-box-menu-width: rem(300px); grid-template: auto auto / auto auto; .#{$prefix}--label { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); } .#{$prefix}--label, @@ -371,7 +371,7 @@ $list-box-menu-width: rem(300px); // Label for a `list-box__field` .#{$prefix}--list-box__label { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); overflow: hidden; color: $text-primary; @@ -536,7 +536,7 @@ $list-box-menu-width: rem(300px); // Descendant of a `list-box__menu` that represents a selection for a control .#{$prefix}--list-box__menu-item { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); position: relative; height: rem(40px); diff --git a/packages/styles/scss/components/list/_list.scss b/packages/styles/scss/components/list/_list.scss index 0bccf02aeae2..8bde5d64643e 100644 --- a/packages/styles/scss/components/list/_list.scss +++ b/packages/styles/scss/components/list/_list.scss @@ -25,14 +25,14 @@ .#{$prefix}--list--ordered, .#{$prefix}--list--ordered--native { @include component-reset.reset; - @include type.type-style('body-long-01'); + @include type.type-style('body-01'); list-style: none; } .#{$prefix}--list--expressive, .#{$prefix}--list--expressive .#{$prefix}--list--nested { - @include type.type-style('body-long-02'); + @include type.type-style('body-02'); } .#{$prefix}--list--ordered--native { diff --git a/packages/styles/scss/components/menu/_menu.scss b/packages/styles/scss/components/menu/_menu.scss index 528cf618a1a4..5bf324290495 100644 --- a/packages/styles/scss/components/menu/_menu.scss +++ b/packages/styles/scss/components/menu/_menu.scss @@ -98,7 +98,7 @@ } .#{$prefix}--menu-option__label { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); overflow: hidden; flex-grow: 1; diff --git a/packages/styles/scss/components/modal/_modal.scss b/packages/styles/scss/components/modal/_modal.scss index 0ed643484fc1..567f1a07ce60 100644 --- a/packages/styles/scss/components/modal/_modal.scss +++ b/packages/styles/scss/components/modal/_modal.scss @@ -110,7 +110,7 @@ // Modal content // ----------------------------- .#{$prefix}--modal-content { - @include type-style('body-long-01'); + @include type-style('body-01'); position: relative; // Required to accommodate focus outline's negative offset: @@ -135,7 +135,7 @@ .#{$prefix}--modal-content p, .#{$prefix}--modal-content__regular-content { padding-right: 20%; - @include type-style('body-long-01'); + @include type-style('body-01'); } //TO-DO: remove .#{$prefix}--modal-content--with-form in v11 since hasForm has been deprecated\ @@ -164,7 +164,7 @@ } .#{$prefix}--modal-header__heading { - @include type-style('productive-heading-03'); + @include type-style('heading-03'); color: $text-primary; } diff --git a/packages/styles/scss/components/notification/_actionable-notification.scss b/packages/styles/scss/components/notification/_actionable-notification.scss index f0044817472e..829f562e9c5f 100644 --- a/packages/styles/scss/components/notification/_actionable-notification.scss +++ b/packages/styles/scss/components/notification/_actionable-notification.scss @@ -221,7 +221,7 @@ } .#{$prefix}--actionable-notification__content { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); word-break: break-word; } diff --git a/packages/styles/scss/components/notification/_inline-notification.scss b/packages/styles/scss/components/notification/_inline-notification.scss index 62bd4c20b149..de43fed7e077 100644 --- a/packages/styles/scss/components/notification/_inline-notification.scss +++ b/packages/styles/scss/components/notification/_inline-notification.scss @@ -202,19 +202,19 @@ @if feature-flags.enabled('enable-v11-release') { .#{$prefix}--inline-notification__content { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); word-break: break-word; } } @else { .#{$prefix}--inline-notification__title { - @include type-style('productive-heading-01'); + @include type-style('heading-compact-01'); margin: 0 $spacing-02 0 0; } .#{$prefix}--inline-notification__subtitle { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); word-break: break-word; } diff --git a/packages/styles/scss/components/notification/_toast-notification.scss b/packages/styles/scss/components/notification/_toast-notification.scss index bd872e2d5576..e85634017b68 100644 --- a/packages/styles/scss/components/notification/_toast-notification.scss +++ b/packages/styles/scss/components/notification/_toast-notification.scss @@ -153,7 +153,7 @@ @if feature-flags.enabled('enable-v11-release') { .#{$prefix}--toast-notification__content { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); margin-top: $spacing-05; margin-right: $spacing-05; @@ -187,7 +187,7 @@ margin-left: auto; background-color: transparent; cursor: pointer; - transition: outline $transition--base, background-color $transition--base; + transition: outline $transition-base, background-color $transition-base; &:focus { outline: 2px solid $focus-inverse; @@ -212,7 +212,7 @@ @if not feature-flags.enabled('enable-v11-release') { .#{$prefix}--toast-notification__title { - @include type-style('productive-heading-01'); + @include type-style('heading-compact-01'); margin-top: $spacing-05; font-weight: 600; @@ -220,7 +220,7 @@ } .#{$prefix}--toast-notification__subtitle { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); margin-top: 0; margin-bottom: $spacing-05; @@ -234,7 +234,7 @@ } .#{$prefix}--toast-notification__caption { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); padding-top: $spacing-03; margin-bottom: $spacing-05; diff --git a/packages/styles/scss/components/overflow-menu/_overflow-menu.scss b/packages/styles/scss/components/overflow-menu/_overflow-menu.scss index 8037b5380ff9..48518ead038f 100644 --- a/packages/styles/scss/components/overflow-menu/_overflow-menu.scss +++ b/packages/styles/scss/components/overflow-menu/_overflow-menu.scss @@ -245,7 +245,7 @@ } .#{$prefix}--overflow-menu-options__btn { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); @include focus-outline('reset'); display: inline-flex; diff --git a/packages/styles/scss/components/pagination-nav/_pagination-nav.scss b/packages/styles/scss/components/pagination-nav/_pagination-nav.scss index 25848a169c2e..2c3c1524ba79 100644 --- a/packages/styles/scss/components/pagination-nav/_pagination-nav.scss +++ b/packages/styles/scss/components/pagination-nav/_pagination-nav.scss @@ -46,7 +46,7 @@ ) { .#{$prefix}--pagination-nav { @include reset; - @include type-style('body-short-01'); + @include type-style('body-compact-01'); line-height: 0; } @@ -70,7 +70,7 @@ } .#{$prefix}--pagination-nav__page { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); @include button-reset.reset($width: false); position: relative; diff --git a/packages/styles/scss/components/pagination/_index.scss b/packages/styles/scss/components/pagination/_index.scss index 41247596149c..58aabd3bb7f5 100644 --- a/packages/styles/scss/components/pagination/_index.scss +++ b/packages/styles/scss/components/pagination/_index.scss @@ -6,6 +6,9 @@ // @forward 'pagination'; +@forward 'unstable_pagination'; @use 'pagination'; +@use 'unstable_pagination'; @include pagination.pagination; +@include unstable_pagination.unstable_pagination; diff --git a/packages/styles/scss/components/pagination/_pagination.scss b/packages/styles/scss/components/pagination/_pagination.scss index 824f09fca470..07787d091e81 100644 --- a/packages/styles/scss/components/pagination/_pagination.scss +++ b/packages/styles/scss/components/pagination/_pagination.scss @@ -15,6 +15,7 @@ @use '../../utilities/convert' as *; @use '../../utilities/focus-outline' as *; @use '../../utilities/high-contrast-mode' as *; +@use '../select'; /// Pagination styles /// @access public diff --git a/packages/styles/scss/components/pagination/_unstable_pagination.scss b/packages/styles/scss/components/pagination/_unstable_pagination.scss new file mode 100644 index 000000000000..e4b7d598a341 --- /dev/null +++ b/packages/styles/scss/components/pagination/_unstable_pagination.scss @@ -0,0 +1,173 @@ +// +// Copyright IBM Corp. 2016, 2020 +// +// This source code is licensed under the Apache-2.0 license found in the +// LICENSE file in the root directory of this source tree. +// + +@use '../../breakpoint' as *; +@use '../../config' as *; +@use '../../motion' as *; +@use '../../spacing' as *; +@use '../../theme' as *; +@use '../../type' as *; +@use '../../utilities/component-reset'; +@use '../../utilities/convert' as *; +@use '../../utilities/focus-outline' as *; +@use '../select'; + +/// Unstable pagination styles +/// @access private +/// @group pagination +@mixin unstable_pagination { + .#{$prefix}--unstable-pagination { + @include component-reset.reset; + @include type-style('body-compact-01'); + + display: flex; + width: 100%; + min-height: rem(40px); + align-items: center; + justify-content: space-between; + border-top: 1px solid $border-subtle; + border-bottom: 1px solid transparent; + background-color: $layer; + } + + .#{$prefix}--unstable-pagination__text { + @include breakpoint('md') { + display: inline-block; + } + + margin: 0 $spacing-05; + color: $text-secondary; + } + + .#{$prefix}--unstable-pagination__left, + .#{$prefix}--unstable-pagination__right { + display: flex; + height: 100%; + align-items: center; + } + + .#{$prefix}--unstable-pagination__left { + padding: 0 $spacing-05 0 0; + } + + .#{$prefix}--unstable-pagination__left > .#{$prefix}--form-item, + .#{$prefix}--unstable-pagination__right > .#{$prefix}--form-item { + height: 100%; + } + + .#{$prefix}--unstable-pagination__left + .#{$prefix}--unstable-pagination__text { + margin-right: rem(1px); + } + + .#{$prefix}--unstable-pagination__right + .#{$prefix}--unstable-pagination__text { + margin-right: $spacing-05; + margin-left: rem(1px); + } + + .#{$prefix}--unstable-pagination__button { + @include component-reset.reset; + + display: flex; + width: rem(40px); + height: rem(40px); + min-height: rem(32px); + align-items: center; + justify-content: center; + border: none; + border-left: 1px solid $border-subtle; + margin: 0; + background: none; + color: $icon-primary; + cursor: pointer; + fill: $icon-primary; + transition: outline $duration-fast-02 motion(standard, productive), + background-color $duration-fast-02 motion(standard, productive); + } + + // Unset height/width set by icon-only button: + .#{$prefix}--unstable-pagination__button .#{$prefix}--btn__icon { + width: initial; + height: initial; + } + + .#{$prefix}--unstable-pagination__button.#{$prefix}--btn--icon-only.#{$prefix}--tooltip__trigger:focus { + @include focus-outline('outline'); + } + + .#{$prefix}--unstable-pagination__button:hover { + background: $layer-hover; + color: $icon-primary; + } + + .#{$prefix}--unstable-pagination__button--no-index { + cursor: not-allowed; + fill: $icon-disabled; + } + + .#{$prefix}--unstable-pagination__button.#{$prefix}--btn:disabled { + border-color: $border-subtle; + background: transparent; + } + + .#{$prefix}--unstable-pagination__button:disabled:hover, + .#{$prefix}--unstable-pagination__button--no-index:hover { + background: transparent; + cursor: not-allowed; + fill: $icon-disabled; + } + + .#{$prefix}--unstable-pagination__page-selector, + .#{$prefix}--unstable-pagination__page-sizer { + height: 100%; + align-items: center; + } + + .#{$prefix}--unstable-pagination__page-selector + .#{$prefix}--select-input--inline__wrapper, + .#{$prefix}--unstable-pagination__page-sizer + .#{$prefix}--select-input--inline__wrapper { + display: flex; + height: 100%; + } + + .#{$prefix}--unstable-pagination__page-selector .#{$prefix}--select-input, + .#{$prefix}--unstable-pagination__page-sizer .#{$prefix}--select-input { + @include type-style('body-short-01'); + + width: auto; + min-width: auto; + height: 100%; + padding: 0 2.25rem 0 $spacing-05; + line-height: rem(40px); + } + + .#{$prefix}--unstable-pagination__page-selector + .#{$prefix}--select-input:hover, + .#{$prefix}--unstable-pagination__page-sizer .#{$prefix}--select-input:hover { + background: $layer-hover; + } + + .#{$prefix}--unstable-pagination__page-selector .#{$prefix}--select__arrow, + .#{$prefix}--unstable-pagination__page-sizer .#{$prefix}--select__arrow { + top: 50%; + transform: translateY(-50%); + + @include breakpoint('md') { + right: $spacing-05; + } + } + + .#{$prefix}--unstable-pagination__page-selector { + border-left: 1px solid $border-subtle; + } + + .#{$prefix}--unstable-pagination__page-sizer { + border-right: 1px solid $border-subtle; + } +} diff --git a/packages/styles/scss/components/progress-bar/_progress-bar.scss b/packages/styles/scss/components/progress-bar/_progress-bar.scss index 2e11cdbd5e28..60094bfacb41 100644 --- a/packages/styles/scss/components/progress-bar/_progress-bar.scss +++ b/packages/styles/scss/components/progress-bar/_progress-bar.scss @@ -17,7 +17,7 @@ /// @group progress-bar @mixin progress-bar { .#{$prefix}--progress-bar__label { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); display: block; margin-bottom: $spacing-03; @@ -31,6 +31,14 @@ background-color: $layer; } + .#{$prefix}--progress-bar--big .#{$prefix}--progress-bar__track { + height: rem(8px); + } + + .#{$prefix}--progress-bar--small .#{$prefix}--progress-bar__track { + height: rem(4px); + } + .#{$prefix}--progress-bar__bar { display: block; width: 100%; diff --git a/packages/styles/scss/components/progress-indicator/_progress-indicator.scss b/packages/styles/scss/components/progress-indicator/_progress-indicator.scss index fac3f3abc210..3f7ce38db770 100644 --- a/packages/styles/scss/components/progress-indicator/_progress-indicator.scss +++ b/packages/styles/scss/components/progress-indicator/_progress-indicator.scss @@ -137,7 +137,7 @@ $progress-indicator-bar-width: 1px inset transparent !default; //single line tooltip .#{$prefix}--progress-step .#{$prefix}--tooltip { - @include type-style('body-long-01'); + @include type-style('body-01'); display: block; width: rem(125px); @@ -153,7 +153,7 @@ $progress-indicator-bar-width: 1px inset transparent !default; //multiline tooltip .#{$prefix}--progress-step .#{$prefix}--tooltip_multi { - @include type-style('body-long-01'); + @include type-style('body-01'); width: rem(150px); height: auto; diff --git a/packages/styles/scss/components/search/_search.scss b/packages/styles/scss/components/search/_search.scss index 5e5b92cf9a25..68318538d6a8 100644 --- a/packages/styles/scss/components/search/_search.scss +++ b/packages/styles/scss/components/search/_search.scss @@ -40,7 +40,7 @@ .#{$prefix}--search-input { @include reset; - @include type.type-style('body-short-01'); + @include type.type-style('body-compact-01'); @include focus-outline('reset'); width: 100%; @@ -99,24 +99,21 @@ left: rem(8px); } - // Large styles - // V11: change lg to md - .#{$prefix}--search--lg .#{$prefix}--search-input, - .#{$prefix}--search--lg.#{$prefix}--search--expandable.#{$prefix}--search--expanded + // Medium styles + .#{$prefix}--search--md .#{$prefix}--search-input, + .#{$prefix}--search--md.#{$prefix}--search--expandable.#{$prefix}--search--expanded .#{$prefix}--search-input { height: rem(40px); // 12px padding on either side of icon + 16px icon (40px) padding: 0 $spacing-08; } - - // V11: change lg to md - .#{$prefix}--search--lg .#{$prefix}--search-magnifier-icon { + .#{$prefix}--search--md .#{$prefix}--search-magnifier-icon { left: rem(12px); } - // V11: change xl to lg - .#{$prefix}--search--xl .#{$prefix}--search-input, - .#{$prefix}--search--xl.#{$prefix}--search--expandable.#{$prefix}--search--expanded + // Large styles + .#{$prefix}--search--lg .#{$prefix}--search-input, + .#{$prefix}--search--lg.#{$prefix}--search--expandable.#{$prefix}--search--expanded .#{$prefix}--search-input { height: rem(48px); // 16px padding on either side of icon + 16px icon (48px) @@ -245,6 +242,7 @@ @include focus-outline('outline'); } + // Small .#{$prefix}--search--sm { .#{$prefix}--search-close, ~ .#{$prefix}--search-button, @@ -259,8 +257,8 @@ } } - // V11: change lg to md - .#{$prefix}--search--lg { + // Medium + .#{$prefix}--search--md { .#{$prefix}--search-close, ~ .#{$prefix}--search-button, &.#{$prefix}--search--expandable, @@ -274,8 +272,8 @@ } } - // V11: change xl to lg - .#{$prefix}--search--xl { + // Large + .#{$prefix}--search--lg { .#{$prefix}--search-close, ~ .#{$prefix}--search-button, &.#{$prefix}--search--expandable, @@ -294,9 +292,8 @@ visibility: hidden; } - // V11: change xl to lg, lg to md - .#{$prefix}--search--xl.#{$prefix}--skeleton .#{$prefix}--search-input, .#{$prefix}--search--lg.#{$prefix}--skeleton .#{$prefix}--search-input, + .#{$prefix}--search--md.#{$prefix}--skeleton .#{$prefix}--search-input, .#{$prefix}--search--sm.#{$prefix}--skeleton .#{$prefix}--search-input { @include skeleton; diff --git a/packages/styles/scss/components/select/_select.scss b/packages/styles/scss/components/select/_select.scss index 7c4b53e543fb..588e80304805 100644 --- a/packages/styles/scss/components/select/_select.scss +++ b/packages/styles/scss/components/select/_select.scss @@ -40,7 +40,7 @@ } .#{$prefix}--select-input { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); @include focus-outline('reset'); display: block; @@ -175,10 +175,15 @@ opacity: 1; } - .#{$prefix}--select-optgroup, + optgroup.#{$prefix}--select-optgroup, .#{$prefix}--select-option { // For the options to show in IE11 + background-color: $background-hover; color: $text-primary; + + &:disabled { + color: $text-disabled; + } } .#{$prefix}--select--inline { @@ -214,6 +219,7 @@ color: $text-primary; } + .#{$prefix}--select--inline .#{$prefix}--select-input:focus, .#{$prefix}--select--inline .#{$prefix}--select-input:focus option, .#{$prefix}--select--inline .#{$prefix}--select-input:focus optgroup { background-color: $background; diff --git a/packages/styles/scss/components/slider/_slider.scss b/packages/styles/scss/components/slider/_slider.scss index 8099ff52b81a..2450e0a242c9 100644 --- a/packages/styles/scss/components/slider/_slider.scss +++ b/packages/styles/scss/components/slider/_slider.scss @@ -38,7 +38,9 @@ width: 100%; min-width: rem(200px); max-width: rem(640px); + padding: $spacing-05 0; margin: 0 $spacing-05; + cursor: pointer; } .#{$prefix}--slider__range-label { @@ -57,7 +59,6 @@ width: 100%; height: rem(2px); background: $border-subtle; - cursor: pointer; transform: translate(0%, -50%); } @@ -87,13 +88,11 @@ .#{$prefix}--slider__thumb { position: absolute; z-index: 3; - top: 0; width: rem(14px); height: rem(14px); background: $layer-selected-inverse; border-radius: 50%; box-shadow: inset 0 0 0 1px transparent, inset 0 0 0 2px transparent; - cursor: pointer; outline: none; transform: translate(-50%, -50%); transition: transform $duration-fast-02 motion(standard, productive), @@ -150,6 +149,10 @@ color: $text-disabled; } + .#{$prefix}--slider--disabled.#{$prefix}--slider { + cursor: not-allowed; + } + .#{$prefix}--slider--disabled .#{$prefix}--slider__thumb { background-color: $border-subtle; @@ -177,7 +180,6 @@ .#{$prefix}--slider__thumb:focus ~ .#{$prefix}--slider__filled-track { background-color: $border-subtle; - cursor: not-allowed; } .#{$prefix}--slider--disabled diff --git a/packages/styles/scss/components/structured-list/_structured-list.scss b/packages/styles/scss/components/structured-list/_structured-list.scss index 49ebc18ff96b..dfeb546c8a8e 100644 --- a/packages/styles/scss/components/structured-list/_structured-list.scss +++ b/packages/styles/scss/components/structured-list/_structured-list.scss @@ -44,7 +44,6 @@ border-collapse: collapse; border-spacing: 0; overflow-x: auto; - overflow-y: hidden; // Condensed list &.#{$prefix}--structured-list--condensed .#{$prefix}--structured-list-td, @@ -134,7 +133,7 @@ .#{$prefix}--structured-list-th { @include reset; @include padding-th; - @include type-style('productive-heading-01'); + @include type-style('heading-compact-01'); display: table-cell; height: rem(40px); @@ -152,7 +151,7 @@ .#{$prefix}--structured-list-td { @include reset; - @include type-style('body-long-01'); + @include type-style('body-01'); @include padding-td; position: relative; diff --git a/packages/styles/scss/components/tabs/_tabs.scss b/packages/styles/scss/components/tabs/_tabs.scss index b57a1555c3d4..dd61e3d1ed0f 100644 --- a/packages/styles/scss/components/tabs/_tabs.scss +++ b/packages/styles/scss/components/tabs/_tabs.scss @@ -38,7 +38,7 @@ $icon-tab-size: custom-property.get-var('icon-tab-size', rem(40px)); @mixin tabs { .#{$prefix}--tabs { @include reset; - @include type-style('body-short-01'); + @include type-style('body-compact-01'); display: flex; width: 100%; @@ -215,7 +215,7 @@ $icon-tab-size: custom-property.get-var('icon-tab-size', rem(40px)); .#{$prefix}--tabs__nav-link { @include button-reset.reset($width: false); @include focus-outline('reset'); - @include type-style('body-short-01'); + @include type-style('body-compact-01'); @if not feature-flag-enabled('enable-v11-release') { width: rem(160px); @@ -298,7 +298,7 @@ $icon-tab-size: custom-property.get-var('icon-tab-size', rem(40px)); .#{$prefix}--tabs__nav-link:focus, .#{$prefix}--tabs__nav-item--selected:active .#{$prefix}--tabs__nav-link:active { - @include type-style('productive-heading-01'); + @include type-style('heading-compact-01'); color: $text-primary; } diff --git a/packages/styles/scss/components/text-area/_text-area.scss b/packages/styles/scss/components/text-area/_text-area.scss index e31939db45b4..cdaf07e091dd 100644 --- a/packages/styles/scss/components/text-area/_text-area.scss +++ b/packages/styles/scss/components/text-area/_text-area.scss @@ -22,7 +22,7 @@ @mixin text-area { .#{$prefix}--text-area { @include reset; - @include type-style('body-long-01'); + @include type-style('body-01'); @include focus-outline('reset'); width: 100%; @@ -47,7 +47,7 @@ .#{$prefix}--text-area::placeholder { @include placeholder-colors; - @include type-style('body-long-01'); + @include type-style('body-01'); } // V11: Possibly deprecate diff --git a/packages/styles/scss/components/text-input/_text-input.scss b/packages/styles/scss/components/text-input/_text-input.scss index a2144eb1bb5f..995935a1ae32 100644 --- a/packages/styles/scss/components/text-input/_text-input.scss +++ b/packages/styles/scss/components/text-input/_text-input.scss @@ -32,7 +32,7 @@ @mixin text-input { .#{$prefix}--text-input { @include reset; - @include type-style('body-short-01'); + @include type-style('body-compact-01'); @include focus-outline('reset'); width: 100%; diff --git a/packages/styles/scss/components/tile/_tile.scss b/packages/styles/scss/components/tile/_tile.scss index fabe035cd57b..b5b735173b55 100644 --- a/packages/styles/scss/components/tile/_tile.scss +++ b/packages/styles/scss/components/tile/_tile.scss @@ -40,7 +40,7 @@ // V11: Possibly deprecate .#{$prefix}--tile--light { - background-color: $layer-02; + background-color: $layer; } .#{$prefix}--tile--clickable, @@ -75,7 +75,7 @@ .#{$prefix}--tile--clickable { @include reset; - @include type-style('body-short-01'); + @include type-style('body-compact-01'); color: $text-primary; text-decoration: none; diff --git a/packages/styles/scss/components/toggle/_toggle.scss b/packages/styles/scss/components/toggle/_toggle.scss index 4f115a833c67..61490376ad73 100644 --- a/packages/styles/scss/components/toggle/_toggle.scss +++ b/packages/styles/scss/components/toggle/_toggle.scss @@ -85,7 +85,7 @@ } .#{$prefix}--toggle__text { - @include type-style('body-long-01'); + @include type-style('body-01'); color: $text-primary; } @@ -232,7 +232,7 @@ .#{$prefix}--toggle__text--left, .#{$prefix}--toggle__text--right { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); position: relative; margin-left: $spacing-03; @@ -456,7 +456,7 @@ .#{$prefix}--toggle__text--off, .#{$prefix}--toggle__text--on { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); position: absolute; // top offset needed to vertically center absolutely positioned flex child in IE11 diff --git a/packages/styles/scss/components/toggletip/_toggletip.scss b/packages/styles/scss/components/toggletip/_toggletip.scss index ee31f6c0bdba..75af4c5a8092 100644 --- a/packages/styles/scss/components/toggletip/_toggletip.scss +++ b/packages/styles/scss/components/toggletip/_toggletip.scss @@ -64,7 +64,7 @@ 'link-focus-text-color', theme.$focus-inverse ); - @include type.type-style('body-short-01'); + @include type.type-style('body-compact-01'); display: grid; max-width: 18rem; diff --git a/packages/styles/scss/components/tooltip/_tooltip.scss b/packages/styles/scss/components/tooltip/_tooltip.scss index 2986026106cd..a169c50514f5 100644 --- a/packages/styles/scss/components/tooltip/_tooltip.scss +++ b/packages/styles/scss/components/tooltip/_tooltip.scss @@ -30,7 +30,7 @@ $tooltip-padding-inline: custom-property.get-var( } .#{$prefix}--tooltip-content { - @include type.type-style('body-long-01'); + @include type.type-style('body-01'); max-width: convert.rem(288px); padding: $tooltip-padding-block $tooltip-padding-inline; @@ -60,7 +60,7 @@ $tooltip-padding-inline: custom-property.get-var( } .#{$prefix}--definition-tooltip { - @include type.type-style('body-long-01'); + @include type.type-style('body-01'); max-width: convert.rem(176px); padding: convert.rem(8px) convert.rem(16px); @@ -85,6 +85,6 @@ $tooltip-padding-inline: custom-property.get-var( } .#{$prefix}--icon-tooltip .#{$prefix}--tooltip-content { - @include type.type-style('body-short-01'); + @include type.type-style('body-compact-01'); } } diff --git a/packages/styles/scss/components/treeview/_treeview.scss b/packages/styles/scss/components/treeview/_treeview.scss index e9a84fb5b8f7..25c6557eb9cd 100644 --- a/packages/styles/scss/components/treeview/_treeview.scss +++ b/packages/styles/scss/components/treeview/_treeview.scss @@ -66,7 +66,7 @@ } .#{$prefix}--tree-node__label { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); display: flex; min-height: rem(32px); diff --git a/packages/styles/scss/components/ui-shell/header/_header.scss b/packages/styles/scss/components/ui-shell/header/_header.scss index 63f2ed56244f..0c4c95b8759f 100644 --- a/packages/styles/scss/components/ui-shell/header/_header.scss +++ b/packages/styles/scss/components/ui-shell/header/_header.scss @@ -39,7 +39,7 @@ display: inline-flex; width: mini-units(6); height: mini-units(6); - border: rem(2px) solid transparent; + border: rem(1px) solid transparent; transition: background-color $duration-fast-02, border-color $duration-fast-02; } @@ -124,7 +124,7 @@ // Header - Name //-------------------------------------------------------------------------- a.#{$prefix}--header__name { - @include type-style('body-short-01'); + @include type-style('body-compact-01'); display: flex; height: 100%; diff --git a/packages/styles/scss/components/ui-shell/side-nav/_side-nav.scss b/packages/styles/scss/components/ui-shell/side-nav/_side-nav.scss index 66ea5d54e634..56b87ec6bf55 100644 --- a/packages/styles/scss/components/ui-shell/side-nav/_side-nav.scss +++ b/packages/styles/scss/components/ui-shell/side-nav/_side-nav.scss @@ -81,8 +81,8 @@ height: 0; background-color: transparent; opacity: 0; - transition: opacity $transition--expansion $standard-easing, - background-color $transition--expansion $standard-easing; + transition: opacity $transition-expansion $standard-easing, + background-color $transition-expansion $standard-easing; } .#{$prefix}--side-nav__overlay-active { @@ -91,8 +91,8 @@ height: 100vh; background-color: $overlay; opacity: 1; - transition: opacity $transition--expansion $standard-easing, - background-color $transition--expansion $standard-easing; + transition: opacity $transition-expansion $standard-easing, + background-color $transition-expansion $standard-easing; } } @@ -192,7 +192,7 @@ //---------------------------------------------------------------------------- .#{$prefix}--side-nav__submenu { @include button-reset.reset($width: true); - @include type-style('productive-heading-01'); + @include type-style('heading-compact-01'); @include focus-outline('reset'); display: flex; @@ -318,7 +318,7 @@ .#{$prefix}--header__menu-title[aria-expanded='true'] + .#{$prefix}--header__menu { @include focus-outline('reset'); - @include type-style('productive-heading-01'); + @include type-style('heading-compact-01'); position: relative; display: flex; diff --git a/packages/styles/scss/components/ui-shell/switcher/_switcher.scss b/packages/styles/scss/components/ui-shell/switcher/_switcher.scss index 7d7cdc6424a9..a8da4ccbb9d5 100644 --- a/packages/styles/scss/components/ui-shell/switcher/_switcher.scss +++ b/packages/styles/scss/components/ui-shell/switcher/_switcher.scss @@ -45,7 +45,7 @@ } .#{$prefix}--switcher__item-link { - @include type-style('productive-heading-01'); + @include type-style('heading-compact-01'); display: block; height: $spacing-07; diff --git a/packages/styles/scss/utilities/_tooltip.scss b/packages/styles/scss/utilities/_tooltip.scss index f8abf99c4751..e3bb23989cec 100644 --- a/packages/styles/scss/utilities/_tooltip.scss +++ b/packages/styles/scss/utilities/_tooltip.scss @@ -51,7 +51,7 @@ font-weight: 400; text-align: left; transform: translateX(-50%); - @include type.type-style('body-short-01'); + @include type.type-style('body-compact-01'); // IE media query @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { diff --git a/packages/themes/docs/sass.md b/packages/themes/docs/sass.md index 55616e2ac421..cf168754a7a3 100644 --- a/packages/themes/docs/sass.md +++ b/packages/themes/docs/sass.md @@ -1,21 +1,11 @@ # `@carbon/themes` +> Sass documentation for `@carbon/themes` + _Note: this documentation is used with the next version of `@carbon/themes` which uses Sass Modules. It will not work in the current stable version of this package_ - - - -## Table of Contents - -- [Usage](#usage) -- [FAQ](#faq) - - [Why are the themes not exported in `@carbon/themes`?](#why-are-the-themes-not-exported-in-carbonthemes) - - - - ## Usage There are several entrypoints that you can use with `@carbon/themes`, including: @@ -74,9 +64,114 @@ You can also extend the theme with your own custom tokens: ); ``` -## Tokens - -TODO +## API + +| Import | Export | Description | !default | +| :--------------------------- | :--------------------------- | :------------------------------------------------------------------------------------ | :------- | +| `@carbon/themes/scss/themes` | | | | +| | `$white` | | ✅ | +| | `$g10` | | ✅ | +| | `$g90` | | ✅ | +| | `$g100` | | ✅ | +| `@carbon/themes` | | The default entrypoint which re-exports values from all other modules in this package | | +| | `$fallback` | | ✅ | +| | `$theme` | | ✅ | +| | `$background` | | ✅ | +| | `$background-active` | | ✅ | +| | `$background-selected` | | ✅ | +| | `$background-selected-hover` | | ✅ | +| | `$background-hover` | | ✅ | +| | `$background-brand` | | ✅ | +| | `$background-inverse` | | ✅ | +| | `$background-inverse-hover` | | ✅ | +| | `$layer-01` | | ✅ | +| | `$layer-active-01` | | ✅ | +| | `$layer-hover-01` | | ✅ | +| | `$layer-selected-01` | | ✅ | +| | `$layer-selected-hover-01` | | ✅ | +| | `$layer-02` | | ✅ | +| | `$layer-active-02` | | ✅ | +| | `$layer-hover-02` | | ✅ | +| | `$layer-selected-02` | | ✅ | +| | `$layer-selected-hover-02` | | ✅ | +| | `$layer-03` | | ✅ | +| | `$layer-active-03` | | ✅ | +| | `$layer-hover-03` | | ✅ | +| | `$layer-selected-03` | | ✅ | +| | `$layer-selected-hover-03` | | ✅ | +| | `$layer-selected-inverse` | | ✅ | +| | `$layer-selected-disabled` | | ✅ | +| | `$layer-accent-01` | | ✅ | +| | `$layer-accent-active-01` | | ✅ | +| | `$layer-accent-hover-01` | | ✅ | +| | `$layer-accent-02` | | ✅ | +| | `$layer-accent-active-02` | | ✅ | +| | `$layer-accent-hover-02` | | ✅ | +| | `$layer-accent-03` | | ✅ | +| | `$layer-accent-active-03` | | ✅ | +| | `$layer-accent-hover-03` | | ✅ | +| | `$field-01` | | ✅ | +| | `$field-hover-01` | | ✅ | +| | `$field-02` | | ✅ | +| | `$field-hover-02` | | ✅ | +| | `$field-03` | | ✅ | +| | `$field-hover-03` | | ✅ | +| | `$interactive` | | ✅ | +| | `$border-subtle-00` | | ✅ | +| | `$border-subtle-01` | | ✅ | +| | `$border-subtle-selected-01` | | ✅ | +| | `$border-subtle-02` | | ✅ | +| | `$border-subtle-selected-02` | | ✅ | +| | `$border-subtle-03` | | ✅ | +| | `$border-subtle-selected-03` | | ✅ | +| | `$border-strong-01` | | ✅ | +| | `$border-strong-02` | | ✅ | +| | `$border-strong-03` | | ✅ | +| | `$border-inverse` | | ✅ | +| | `$border-interactive` | | ✅ | +| | `$border-disabled` | | ✅ | +| | `$text-primary` | | ✅ | +| | `$text-secondary` | | ✅ | +| | `$text-placeholder` | | ✅ | +| | `$text-helper` | | ✅ | +| | `$text-error` | | ✅ | +| | `$text-inverse` | | ✅ | +| | `$text-on-color` | | ✅ | +| | `$text-on-color-disabled` | | ✅ | +| | `$text-disabled` | | ✅ | +| | `$link-primary` | | ✅ | +| | `$link-primary-hover` | | ✅ | +| | `$link-secondary` | | ✅ | +| | `$link-inverse` | | ✅ | +| | `$link-visited` | | ✅ | +| | `$icon-primary` | | ✅ | +| | `$icon-secondary` | | ✅ | +| | `$icon-inverse` | | ✅ | +| | `$icon-on-color` | | ✅ | +| | `$icon-on-color-disabled` | | ✅ | +| | `$icon-disabled` | | ✅ | +| | `$support-error` | | ✅ | +| | `$support-success` | | ✅ | +| | `$support-warning` | | ✅ | +| | `$support-info` | | ✅ | +| | `$support-error-inverse` | | ✅ | +| | `$support-success-inverse` | | ✅ | +| | `$support-warning-inverse` | | ✅ | +| | `$support-info-inverse` | | ✅ | +| | `$support-caution-major` | | ✅ | +| | `$support-caution-minor` | | ✅ | +| | `$support-caution-undefined` | | ✅ | +| | `$highlight` | | ✅ | +| | `$overlay` | | ✅ | +| | `$toggle-off` | | ✅ | +| | `$shadow` | | ✅ | +| | `$focus` | | ✅ | +| | `$focus-inset` | | ✅ | +| | `$focus-inverse` | | ✅ | +| | `$skeleton-background` | | ✅ | +| | `$skeleton-element` | | ✅ | + +### Configuration ## FAQ diff --git a/packages/themes/package.json b/packages/themes/package.json index 7cde363d3529..ce58a133391a 100644 --- a/packages/themes/package.json +++ b/packages/themes/package.json @@ -1,7 +1,7 @@ { "name": "@carbon/themes", "description": "Themes for applying color in the Carbon Design System", - "version": "10.51.0", + "version": "10.52.0-rc.0", "license": "Apache-2.0", "main": "lib/index.js", "module": "es/index.js", @@ -29,15 +29,15 @@ "build": "yarn clean && carbon-cli bundle src/index.js --name CarbonThemes && babel-node --presets '@babel/preset-env' tasks/build.js && carbon-cli check \"scss/*.scss\"" }, "dependencies": { - "@carbon/colors": "^10.36.0", - "@carbon/layout": "^10.36.0", - "@carbon/type": "^10.41.0", + "@carbon/colors": "^10.37.0-rc.0", + "@carbon/layout": "^10.37.0-rc.0", + "@carbon/type": "^10.42.0-rc.0", "color": "^3.1.2" }, "devDependencies": { "@babel/node": "^7.16.7", "@babel/preset-env": "^7.16.7", - "@carbon/cli": "^10.33.0", + "@carbon/cli": "^10.34.0-rc.0", "@carbon/cli-reporter": "^10.5.0", "@carbon/scss-generator": "^10.13.0", "@carbon/test-utils": "^10.21.0", diff --git a/packages/type/docs/sass.md b/packages/type/docs/sass.md new file mode 100644 index 000000000000..e2a40f12a51b --- /dev/null +++ b/packages/type/docs/sass.md @@ -0,0 +1,123 @@ +# Sass + +> Sass documentation for `@carbon/type` + +## Usage + +The `@carbon/type` package enables you to use typography from the IBM Design +Language, including the type scale and fonts, along with typography design +tokens from the Carbon Design System. It also comes with opinionated defaults +for type styles on common elements like `h1`, `h2`, `p`, etc. + +You can use this package by writing the following: + +```scss +@use '@carbon/type'; + +// Include type reset +@include type.reset(); + +// Include default type styles, targets h1, h2, h3, etc +@include type.default-type(); + +// Include utility classes for type-related properties +@include type.type-classes(); + +.selector { + // Include a type style + @include type.style('productive-heading-01'); +} +``` + +### Type classes + +The `type-classes` mixin will output a collection of utility CSS that you can +use to style a given HTML element with type-related styles. + +In particular, you can use the following classes: + +| Class | Description | +| :------------------------- | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| `.cds--type-{font-family}` | Set the `font-family` property for the given font. This can include `mono`, `sans`, `sans-condensed`, `sans-arabic`, `sans-devanagari`, `sans-hebrew`, `sans-jp`, `sans-kr`, `sans-thai-looped`, `sans-thai`, `serif` | +| `.cds--type-{font-weight}` | Set the `font-weight` property | +| `.cds--type-italic` | Set the `font-style` property to `italic` | +| `.cds--type-{token}` | Style the HTML element with the given type token | + +## API + +| Export | Description | Link | !default | +| :------------------------- | :---------------------------------------------------------------- | :--- | :------- | +| `@mixin type-classes` | A mixin used to emit utility type classes in CSS | | | +| `@mixin reset` | A mixin used to emit base styles for the Carbon Design System | | | +| `@mixin default-type` | A mixin used to emit default styles for typographic HTML elements | | | +| `@mixin type-style` | A mixin used to emit all declarations for a type token | | | +| `$label-01` | | | ✅ | +| `$legal-02` | | | ✅ | +| `$helper-text-01` | | | ✅ | +| `$body-short-01` | | | ✅ | +| `$body-compact-01` | | | ✅ | +| `$body-long-01` | | | ✅ | +| `$body-01` | | | ✅ | +| `$body-short-02` | | | ✅ | +| `$body-compact-02` | | | ✅ | +| `$body-long-02` | | | ✅ | +| `$body-02` | | | ✅ | +| `$code-01` | | | ✅ | +| `$code-02` | | | ✅ | +| `$heading-01` | | | ✅ | +| `$productive-heading-01` | | | ✅ | +| `$heading-compact-01` | | | ✅ | +| `$heading-02` | | | ✅ | +| `$productive-heading-02` | | | ✅ | +| `$heading-compact-02` | | | ✅ | +| `$productive-heading-03` | | | ✅ | +| `$heading-03` | | | ✅ | +| `$productive-heading-04` | | | ✅ | +| `$heading-04` | | | ✅ | +| `$productive-heading-05` | | | ✅ | +| `$heading-05` | | | ✅ | +| `$productive-heading-06` | | | ✅ | +| `$heading-06` | | | ✅ | +| `$productive-heading-07` | | | ✅ | +| `$heading-07` | | | ✅ | +| `$expressive-heading-01` | | | ✅ | +| `$expressive-heading-02` | | | ✅ | +| `$expressive-heading-03` | | | ✅ | +| `$fluid-heading-03` | | | ✅ | +| `$expressive-heading-04` | | | ✅ | +| `$fluid-heading-04` | | | ✅ | +| `$expressive-heading-05` | | | ✅ | +| `$fluid-heading-05` | | | ✅ | +| `$expressive-heading-06` | | | ✅ | +| `$fluid-heading-06` | | | ✅ | +| `$expressive-paragraph-01` | | | ✅ | +| `$fluid-paragraph-01` | | | ✅ | +| `$quotation-01` | | | ✅ | +| `$fluid-quotation-01` | | | ✅ | +| `$quotation-02` | | | ✅ | +| `$fluid-quotation-02` | | | ✅ | +| `$display-01` | | | ✅ | +| `$fluid-display-01` | | | ✅ | +| `$display-02` | | | ✅ | +| `$fluid-display-02` | | | ✅ | +| `$display-03` | | | ✅ | +| `$fluid-display-03` | | | ✅ | +| `$display-04` | | | ✅ | +| `$fluid-display-04` | | | ✅ | + +### Configuration + +You can configure parts of the `@carbon/type` package with Sass Modules. For +example, you can change the `$prefix` used by writing the following: + +```scss +@use '@carbon/type' with ( + $prefix: 'custom-prefix', +); +``` + +For a full list of options that you can configure, check out the table below. + +| Option | Description | Default | +| :-------- | :---------------------------------------------------------------- | :------ | +| `$prefix` | The prefix that is used in selectors, CSS Custom Properties, etc. | `'cds'` | diff --git a/packages/type/package.json b/packages/type/package.json index 58767bd1f276..51a2fd4d6a26 100644 --- a/packages/type/package.json +++ b/packages/type/package.json @@ -1,7 +1,7 @@ { "name": "@carbon/type", "description": "Typography for digital and software products using the Carbon Design System", - "version": "10.41.0", + "version": "10.42.0-rc.0", "license": "Apache-2.0", "main": "lib/index.js", "module": "es/index.js", @@ -37,11 +37,11 @@ "clean": "rimraf css es lib umd scss/_inlined scss/vendor" }, "dependencies": { - "@carbon/import-once": "^10.6.0", - "@carbon/layout": "^10.36.0" + "@carbon/grid": "^10.42.0-rc.0", + "@carbon/import-once": "^10.7.0-rc.0" }, "devDependencies": { - "@carbon/cli": "^10.33.0", + "@carbon/cli": "^10.34.0-rc.0", "@carbon/test-utils": "^10.21.0", "change-case": "^4.1.1", "rimraf": "^3.0.0" diff --git a/packages/type/scss/modules/_styles.scss b/packages/type/scss/modules/_styles.scss index 874e6d61d612..b3ca5c41b248 100644 --- a/packages/type/scss/modules/_styles.scss +++ b/packages/type/scss/modules/_styles.scss @@ -9,7 +9,7 @@ @use 'sass:map'; @use 'sass:math'; -@use '@carbon/layout'; +@use '@carbon/grid/scss/modules/breakpoint' as grid; @use 'font-family'; @use 'scale'; @@ -716,7 +716,7 @@ $tokens: ( /// @param {Map} $breakpoints [$grid-breakpoints] - Custom breakpoints to use /// @access public /// @group @carbon/type -@mixin fluid-type($type-styles, $breakpoints: layout.$grid-breakpoints) { +@mixin fluid-type($type-styles, $breakpoints: grid.$grid-breakpoints) { // Include the initial styles for the given token by default without any // media query guard. This includes `font-size` as a fallback in the case // that a browser does not support `calc()` @@ -729,7 +729,7 @@ $tokens: ( // token and apply the properties and fluid type size for that given // breakpoint @each $name, $values in map.get($type-styles, breakpoints) { - @include layout.breakpoint($name) { + @include grid.breakpoint($name) { @include properties($values); @include fluid-type-size($type-styles, $name, $breakpoints); } @@ -745,7 +745,7 @@ $tokens: ( @mixin fluid-type-size( $type-styles, $name, - $breakpoints: layout.$grid-breakpoints + $breakpoints: grid.$grid-breakpoints ) { // Get the information about the breakpoint we're currently working in. Useful // for getting initial width information @@ -776,7 +776,7 @@ $tokens: ( // We can use `breakpoint-next` to see if there is another breakpoint we can // use to update `max-font-size` and `max-vw` with larger values - $next-breakpoint-available: layout.breakpoint-next($name, $breakpoints); + $next-breakpoint-available: grid.breakpoint-next($name, $breakpoints); $next-fluid-breakpoint-name: null; // We need to figure out what the next available fluid breakpoint is for our @@ -788,7 +788,7 @@ $tokens: ( $next-fluid-breakpoint-name: $next-breakpoint-available; $next-breakpoint-available: null; } @else { - $next-breakpoint-available: layout.breakpoint-next( + $next-breakpoint-available: grid.breakpoint-next( $next-breakpoint-available, $breakpoints ); @@ -846,11 +846,7 @@ $custom-property-prefix: 'cds' !default; /// @param {Map} $breakpoints [$grid-breakpoints] - Provide a custom breakpoint map to use /// @access public /// @group @carbon/type -@mixin type-style( - $name, - $fluid: false, - $breakpoints: layout.$grid-breakpoints -) { +@mixin type-style($name, $fluid: false, $breakpoints: grid.$grid-breakpoints) { @if not map.has-key($tokens, $name) { @error 'Unable to find a token with the name: `#{$name}`'; } diff --git a/www/package.json b/www/package.json index 8b06c3a5d12b..2dd98a3ed354 100644 --- a/www/package.json +++ b/www/package.json @@ -1,7 +1,7 @@ { "name": "www", "private": true, - "version": "0.5.0", + "version": "0.6.0-rc.0", "license": "Apache-2.0", "repository": { "type": "git", @@ -22,7 +22,7 @@ "start": "next start" }, "dependencies": { - "@carbon/react": "^0.14.0", + "@carbon/react": "^0.15.0-rc.0", "@octokit/core": "^3.5.1", "@octokit/plugin-retry": "^3.0.9", "@octokit/plugin-throttling": "^3.5.2", diff --git a/yarn.lock b/yarn.lock index fc31e1753661..1e1878b06815 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1821,7 +1821,7 @@ __metadata: languageName: unknown linkType: soft -"@carbon/cli@^10.33.0, @carbon/cli@workspace:packages/cli": +"@carbon/cli@^10.34.0-rc.0, @carbon/cli@workspace:packages/cli": version: 0.0.0-use.local resolution: "@carbon/cli@workspace:packages/cli" dependencies: @@ -1858,11 +1858,11 @@ __metadata: languageName: unknown linkType: soft -"@carbon/colors@^10.36.0, @carbon/colors@workspace:packages/colors": +"@carbon/colors@^10.37.0-rc.0, @carbon/colors@workspace:packages/colors": version: 0.0.0-use.local resolution: "@carbon/colors@workspace:packages/colors" dependencies: - "@carbon/cli": ^10.33.0 + "@carbon/cli": ^10.34.0-rc.0 "@carbon/cli-reporter": ^10.5.0 "@carbon/scss-generator": ^10.13.0 "@carbon/test-utils": ^10.21.0 @@ -1873,19 +1873,19 @@ __metadata: languageName: unknown linkType: soft -"@carbon/elements@^10.52.0, @carbon/elements@workspace:packages/elements": +"@carbon/elements@^10.53.0-rc.0, @carbon/elements@workspace:packages/elements": version: 0.0.0-use.local resolution: "@carbon/elements@workspace:packages/elements" dependencies: - "@carbon/cli": ^10.33.0 - "@carbon/colors": ^10.36.0 - "@carbon/grid": ^10.41.0 - "@carbon/icons": ^10.46.0 - "@carbon/import-once": ^10.6.0 - "@carbon/layout": ^10.36.0 - "@carbon/motion": ^10.28.0 - "@carbon/themes": ^10.51.0 - "@carbon/type": ^10.41.0 + "@carbon/cli": ^10.34.0-rc.0 + "@carbon/colors": ^10.37.0-rc.0 + "@carbon/grid": ^10.42.0-rc.0 + "@carbon/icons": ^10.47.0-rc.0 + "@carbon/import-once": ^10.7.0-rc.0 + "@carbon/layout": ^10.37.0-rc.0 + "@carbon/motion": ^10.29.0-rc.0 + "@carbon/themes": ^10.52.0-rc.0 + "@carbon/type": ^10.42.0-rc.0 fs-extra: ^10.0.0 klaw-sync: ^6.0.0 replace-in-file: ^3.4.2 @@ -1914,18 +1914,18 @@ __metadata: languageName: unknown linkType: soft -"@carbon/grid@^10.41.0, @carbon/grid@workspace:packages/grid": +"@carbon/grid@^10.42.0-rc.0, @carbon/grid@workspace:packages/grid": version: 0.0.0-use.local resolution: "@carbon/grid@workspace:packages/grid" dependencies: - "@carbon/cli": ^10.33.0 - "@carbon/import-once": ^10.6.0 - "@carbon/layout": ^10.36.0 + "@carbon/cli": ^10.34.0-rc.0 + "@carbon/import-once": ^10.7.0-rc.0 + "@carbon/layout": ^10.37.0-rc.0 rimraf: ^3.0.0 languageName: unknown linkType: soft -"@carbon/icon-build-helpers@^0.32.0, @carbon/icon-build-helpers@workspace:packages/icon-build-helpers": +"@carbon/icon-build-helpers@^0.33.0-rc.0, @carbon/icon-build-helpers@workspace:packages/icon-build-helpers": version: 0.0.0-use.local resolution: "@carbon/icon-build-helpers@workspace:packages/icon-build-helpers" dependencies: @@ -1936,7 +1936,7 @@ __metadata: "@babel/template": ^7.16.7 "@babel/types": ^7.16.7 "@carbon/cli-reporter": ^10.5.0 - "@carbon/icon-helpers": ^10.27.0 + "@carbon/icon-helpers": ^10.28.0-rc.0 "@rollup/plugin-babel": ^5.3.0 "@rollup/plugin-replace": ^3.0.0 browserslist-config-carbon: ^10.6.1 @@ -1956,14 +1956,15 @@ __metadata: rollup-plugin-strip-banner: ^2.0.0 svg-parser: ^2.0.4 svgo: ^1.1.1 + svgson: ^5.2.1 languageName: unknown linkType: soft -"@carbon/icon-helpers@^10.27.0, @carbon/icon-helpers@workspace:packages/icon-helpers": +"@carbon/icon-helpers@^10.28.0-rc.0, @carbon/icon-helpers@workspace:packages/icon-helpers": version: 0.0.0-use.local resolution: "@carbon/icon-helpers@workspace:packages/icon-helpers" dependencies: - "@carbon/cli": ^10.33.0 + "@carbon/cli": ^10.34.0-rc.0 rimraf: ^3.0.0 languageName: unknown linkType: soft @@ -1975,25 +1976,25 @@ __metadata: languageName: node linkType: hard -"@carbon/icons-handlebars@^10.46.0, @carbon/icons-handlebars@workspace:packages/icons-handlebars": +"@carbon/icons-handlebars@^10.47.0-rc.0, @carbon/icons-handlebars@workspace:packages/icons-handlebars": version: 0.0.0-use.local resolution: "@carbon/icons-handlebars@workspace:packages/icons-handlebars" dependencies: - "@carbon/icon-helpers": ^10.27.0 - "@carbon/icons": ^10.46.0 + "@carbon/icon-helpers": ^10.28.0-rc.0 + "@carbon/icons": ^10.47.0-rc.0 handlebars: ^4.0.12 peerDependencies: handlebars: ^4.0.12 languageName: unknown linkType: soft -"@carbon/icons-react@^10.46.0, @carbon/icons-react@workspace:packages/icons-react": +"@carbon/icons-react@^10.47.0-rc.0, @carbon/icons-react@workspace:packages/icons-react": version: 0.0.0-use.local resolution: "@carbon/icons-react@workspace:packages/icons-react" dependencies: - "@carbon/icon-build-helpers": ^0.32.0 - "@carbon/icon-helpers": ^10.27.0 - "@carbon/icons": ^10.46.0 + "@carbon/icon-build-helpers": ^0.33.0-rc.0 + "@carbon/icon-helpers": ^10.28.0-rc.0 + "@carbon/icons": ^10.47.0-rc.0 "@carbon/telemetry": 0.0.0-alpha.6 prop-types: ^15.7.2 rimraf: ^3.0.2 @@ -2017,8 +2018,8 @@ __metadata: resolution: "@carbon/icons-vue@workspace:packages/icons-vue" dependencies: "@carbon/cli-reporter": ^10.5.0 - "@carbon/icon-helpers": ^10.27.0 - "@carbon/icons": ^10.46.0 + "@carbon/icon-helpers": ^10.28.0-rc.0 + "@carbon/icons": ^10.47.0-rc.0 fs-extra: ^10.0.0 prettier: ^2.2.1 rimraf: ^3.0.0 @@ -2027,28 +2028,27 @@ __metadata: languageName: unknown linkType: soft -"@carbon/icons@^10.46.0, @carbon/icons@workspace:packages/icons": +"@carbon/icons@^10.47.0-rc.0, @carbon/icons@workspace:packages/icons": version: 0.0.0-use.local resolution: "@carbon/icons@workspace:packages/icons" dependencies: - "@carbon/cli": ^10.33.0 - "@carbon/icon-build-helpers": ^0.32.0 + "@carbon/cli": ^10.34.0-rc.0 + "@carbon/icon-build-helpers": ^0.33.0-rc.0 rimraf: ^3.0.2 - svgson: ^5.2.1 languageName: unknown linkType: soft -"@carbon/import-once@^10.6.0, @carbon/import-once@workspace:packages/import-once": +"@carbon/import-once@^10.7.0-rc.0, @carbon/import-once@workspace:packages/import-once": version: 0.0.0-use.local resolution: "@carbon/import-once@workspace:packages/import-once" languageName: unknown linkType: soft -"@carbon/layout@^10.36.0, @carbon/layout@workspace:packages/layout": +"@carbon/layout@^10.37.0-rc.0, @carbon/layout@workspace:packages/layout": version: 0.0.0-use.local resolution: "@carbon/layout@workspace:packages/layout" dependencies: - "@carbon/cli": ^10.33.0 + "@carbon/cli": ^10.34.0-rc.0 "@carbon/cli-reporter": ^10.5.0 "@carbon/scss-generator": ^10.13.0 "@carbon/test-utils": ^10.21.0 @@ -2057,11 +2057,11 @@ __metadata: languageName: unknown linkType: soft -"@carbon/motion@^10.28.0, @carbon/motion@workspace:packages/motion": +"@carbon/motion@^10.29.0-rc.0, @carbon/motion@workspace:packages/motion": version: 0.0.0-use.local resolution: "@carbon/motion@workspace:packages/motion" dependencies: - "@carbon/cli": ^10.33.0 + "@carbon/cli": ^10.34.0-rc.0 rimraf: ^3.0.0 languageName: unknown linkType: soft @@ -2070,9 +2070,9 @@ __metadata: version: 0.0.0-use.local resolution: "@carbon/pictograms-react@workspace:packages/pictograms-react" dependencies: - "@carbon/icon-build-helpers": ^0.32.0 - "@carbon/icon-helpers": ^10.27.0 - "@carbon/pictograms": ^11.22.0 + "@carbon/icon-build-helpers": ^0.33.0-rc.0 + "@carbon/icon-helpers": ^10.28.0-rc.0 + "@carbon/pictograms": ^11.23.0-rc.0 "@carbon/telemetry": 0.0.0-alpha.6 prop-types: ^15.7.2 peerDependencies: @@ -2080,16 +2080,16 @@ __metadata: languageName: unknown linkType: soft -"@carbon/pictograms@^11.22.0, @carbon/pictograms@workspace:packages/pictograms": +"@carbon/pictograms@^11.23.0-rc.0, @carbon/pictograms@workspace:packages/pictograms": version: 0.0.0-use.local resolution: "@carbon/pictograms@workspace:packages/pictograms" dependencies: - "@carbon/icon-build-helpers": ^0.32.0 + "@carbon/icon-build-helpers": ^0.33.0-rc.0 rimraf: ^3.0.0 languageName: unknown linkType: soft -"@carbon/react@0.14.0, @carbon/react@^0.14.0, @carbon/react@workspace:packages/carbon-react": +"@carbon/react@^0.15.0-rc.0, @carbon/react@workspace:packages/carbon-react": version: 0.0.0-use.local resolution: "@carbon/react@workspace:packages/carbon-react" dependencies: @@ -2101,10 +2101,10 @@ __metadata: "@babel/preset-env": ^7.16.7 "@babel/preset-react": ^7.16.7 "@carbon/feature-flags": ^0.7.0 - "@carbon/icons-react": ^10.46.0 - "@carbon/styles": ^0.14.0 + "@carbon/icons-react": ^10.47.0-rc.0 + "@carbon/styles": ^0.15.0-rc.0 "@carbon/telemetry": 0.0.0-alpha.6 - "@carbon/themes": ^10.51.0 + "@carbon/themes": ^10.52.0-rc.0 "@rollup/plugin-babel": ^5.3.0 "@rollup/plugin-commonjs": ^21.0.0 "@rollup/plugin-node-resolve": ^13.0.0 @@ -2122,8 +2122,8 @@ __metadata: babel-plugin-dev-expression: ^0.2.3 babel-preset-carbon: ^0.2.0 browserslist-config-carbon: ^10.6.1 - carbon-components: ^10.53.0 - carbon-components-react: ^7.53.0 + carbon-components: ^10.54.0-rc.0 + carbon-components-react: ^7.54.0-rc.0 carbon-icons: ^7.0.7 css-loader: ^6.5.1 fast-glob: ^3.2.7 @@ -2161,11 +2161,11 @@ __metadata: version: 0.0.0-use.local resolution: "@carbon/sketch@workspace:packages/sketch" dependencies: - "@carbon/colors": ^10.36.0 - "@carbon/icon-helpers": ^10.27.0 - "@carbon/icons": ^10.46.0 - "@carbon/themes": ^10.51.0 - "@carbon/type": ^10.41.0 + "@carbon/colors": ^10.37.0-rc.0 + "@carbon/icon-helpers": ^10.28.0-rc.0 + "@carbon/icons": ^10.47.0-rc.0 + "@carbon/themes": ^10.52.0-rc.0 + "@carbon/type": ^10.42.0-rc.0 "@skpm/builder": ^0.8.0 color-string: ^1.5.3 core-js: ^3.16.0 @@ -2176,18 +2176,18 @@ __metadata: languageName: unknown linkType: soft -"@carbon/styles@0.14.0, @carbon/styles@^0.14.0, @carbon/styles@workspace:packages/styles": +"@carbon/styles@^0.15.0-rc.0, @carbon/styles@workspace:packages/styles": version: 0.0.0-use.local resolution: "@carbon/styles@workspace:packages/styles" dependencies: - "@carbon/colors": ^10.36.0 + "@carbon/colors": ^10.37.0-rc.0 "@carbon/feature-flags": ^0.7.0 - "@carbon/grid": ^10.41.0 - "@carbon/layout": ^10.36.0 - "@carbon/motion": ^10.28.0 + "@carbon/grid": ^10.42.0-rc.0 + "@carbon/layout": ^10.37.0-rc.0 + "@carbon/motion": ^10.29.0-rc.0 "@carbon/test-utils": ^10.21.0 - "@carbon/themes": ^10.51.0 - "@carbon/type": ^10.41.0 + "@carbon/themes": ^10.52.0-rc.0 + "@carbon/type": ^10.42.0-rc.0 "@ibm/plex": 6.0.0-next.6 css: ^3.0.0 languageName: unknown @@ -2230,19 +2230,19 @@ __metadata: languageName: unknown linkType: soft -"@carbon/themes@^10.51.0, @carbon/themes@workspace:packages/themes": +"@carbon/themes@^10.52.0-rc.0, @carbon/themes@workspace:packages/themes": version: 0.0.0-use.local resolution: "@carbon/themes@workspace:packages/themes" dependencies: "@babel/node": ^7.16.7 "@babel/preset-env": ^7.16.7 - "@carbon/cli": ^10.33.0 + "@carbon/cli": ^10.34.0-rc.0 "@carbon/cli-reporter": ^10.5.0 - "@carbon/colors": ^10.36.0 - "@carbon/layout": ^10.36.0 + "@carbon/colors": ^10.37.0-rc.0 + "@carbon/layout": ^10.37.0-rc.0 "@carbon/scss-generator": ^10.13.0 "@carbon/test-utils": ^10.21.0 - "@carbon/type": ^10.41.0 + "@carbon/type": ^10.42.0-rc.0 change-case: ^4.1.1 color: ^3.1.2 core-js: ^3.16.0 @@ -2253,13 +2253,13 @@ __metadata: languageName: unknown linkType: soft -"@carbon/type@^10.41.0, @carbon/type@workspace:packages/type": +"@carbon/type@^10.42.0-rc.0, @carbon/type@workspace:packages/type": version: 0.0.0-use.local resolution: "@carbon/type@workspace:packages/type" dependencies: - "@carbon/cli": ^10.33.0 - "@carbon/import-once": ^10.6.0 - "@carbon/layout": ^10.36.0 + "@carbon/cli": ^10.34.0-rc.0 + "@carbon/grid": ^10.42.0-rc.0 + "@carbon/import-once": ^10.7.0-rc.0 "@carbon/test-utils": ^10.21.0 change-case: ^4.1.1 rimraf: ^3.0.0 @@ -5430,6 +5430,13 @@ __metadata: languageName: node linkType: hard +"@socket.io/base64-arraybuffer@npm:~1.0.2": + version: 1.0.2 + resolution: "@socket.io/base64-arraybuffer@npm:1.0.2" + checksum: fa3e58c7581643d0557969cd3bece20e198596df77968ff29ede6be329d488e65104bef900e68a67f39d8855abfa59baa2b08d96fb856504bd01cbdd8f52249c + languageName: node + linkType: hard + "@storybook/addon-a11y@npm:^6.4.9": version: 6.4.9 resolution: "@storybook/addon-a11y@npm:6.4.9" @@ -7370,6 +7377,27 @@ __metadata: languageName: node linkType: hard +"@types/component-emitter@npm:^1.2.10": + version: 1.2.11 + resolution: "@types/component-emitter@npm:1.2.11" + checksum: 0e081c5f7a4b113af3732f67ad9ebb487d5c239d440d96938ff9a679d18bb9337a513638e12b5b02a7a921494eef18c5a4d78f1188bc43a12290edd74c42a9c7 + languageName: node + linkType: hard + +"@types/cookie@npm:^0.4.1": + version: 0.4.1 + resolution: "@types/cookie@npm:0.4.1" + checksum: 3275534ed69a76c68eb1a77d547d75f99fedc80befb75a3d1d03662fb08d697e6f8b1274e12af1a74c6896071b11510631ba891f64d30c78528d0ec45a9c1a18 + languageName: node + linkType: hard + +"@types/cors@npm:^2.8.12": + version: 2.8.12 + resolution: "@types/cors@npm:2.8.12" + checksum: 8c45f112c7d1d2d831b4b266f2e6ed33a1887a35dcbfe2a18b28370751fababb7cd045e745ef84a523c33a25932678097bf79afaa367c6cb3fa0daa7a6438257 + languageName: node + linkType: hard + "@types/cssnano@npm:^4.0.1": version: 4.0.1 resolution: "@types/cssnano@npm:4.0.1" @@ -7600,7 +7628,14 @@ __metadata: languageName: node linkType: hard -"@types/node@npm:*, @types/node@npm:>= 8, @types/node@npm:^14.0.10, @types/node@npm:^14.14.31": +"@types/node@npm:*, @types/node@npm:>= 8, @types/node@npm:>=10.0.0": + version: 17.0.18 + resolution: "@types/node@npm:17.0.18" + checksum: 6c4edfc2b3ba2342a9c3d56e934c5245948ab752f4dc04bd6790b9603e6ebc53bc4f5befc3662e207f7dba2ddd17ccf657f915e319ea7cdd4f77b851079d1611 + languageName: node + linkType: hard + +"@types/node@npm:^14.0.10, @types/node@npm:^14.14.31": version: 14.14.45 resolution: "@types/node@npm:14.14.45" checksum: 3870a0128011b01c6fb6655e0f682b1b660e141f84d76c70fe503f5c7cf38bd06fc7b9a7d3c760601bce0598421f552695de40f095863ede29a6e22a13213b3e @@ -8006,6 +8041,16 @@ __metadata: languageName: node linkType: hard +"@typescript-eslint/scope-manager@npm:5.12.0": + version: 5.12.0 + resolution: "@typescript-eslint/scope-manager@npm:5.12.0" + dependencies: + "@typescript-eslint/types": 5.12.0 + "@typescript-eslint/visitor-keys": 5.12.0 + checksum: 87cc4e8ab3b495293e51685566cafca6f217c7328fc1210e4a9c3a89e864c5e3a04ddde11708e07820185fd158cb448980607a93fd658fa2089c152f27a847d0 + languageName: node + linkType: hard + "@typescript-eslint/scope-manager@npm:5.7.0": version: 5.7.0 resolution: "@typescript-eslint/scope-manager@npm:5.7.0" @@ -8026,6 +8071,13 @@ __metadata: languageName: node linkType: hard +"@typescript-eslint/types@npm:5.12.0": + version: 5.12.0 + resolution: "@typescript-eslint/types@npm:5.12.0" + checksum: f5e7f8270cb0f9f18886bf00f8f1fd589b793f4c05dc2de53cc826beb969161e19ffc10f51237402fb9f3d24f5aaf3bb41b1d8da70e115ec3ff11e79b3471988 + languageName: node + linkType: hard + "@typescript-eslint/types@npm:5.7.0": version: 5.7.0 resolution: "@typescript-eslint/types@npm:5.7.0" @@ -8040,6 +8092,24 @@ __metadata: languageName: node linkType: hard +"@typescript-eslint/typescript-estree@npm:5.12.0": + version: 5.12.0 + resolution: "@typescript-eslint/typescript-estree@npm:5.12.0" + dependencies: + "@typescript-eslint/types": 5.12.0 + "@typescript-eslint/visitor-keys": 5.12.0 + debug: ^4.3.2 + globby: ^11.0.4 + is-glob: ^4.0.3 + semver: ^7.3.5 + tsutils: ^3.21.0 + peerDependenciesMeta: + typescript: + optional: true + checksum: 6a8e852c210b20370eb564f3beb245c425e65a4de3e78a1e2f278a241b6acf72ba43b10767df18fc1654b529453529f721fa673569406ace4011712c9c837900 + languageName: node + linkType: hard + "@typescript-eslint/typescript-estree@npm:5.7.0": version: 5.7.0 resolution: "@typescript-eslint/typescript-estree@npm:5.7.0" @@ -8076,6 +8146,32 @@ __metadata: languageName: node linkType: hard +"@typescript-eslint/utils@npm:^5.10.0": + version: 5.12.0 + resolution: "@typescript-eslint/utils@npm:5.12.0" + dependencies: + "@types/json-schema": ^7.0.9 + "@typescript-eslint/scope-manager": 5.12.0 + "@typescript-eslint/types": 5.12.0 + "@typescript-eslint/typescript-estree": 5.12.0 + eslint-scope: ^5.1.1 + eslint-utils: ^3.0.0 + peerDependencies: + eslint: ^6.0.0 || ^7.0.0 || ^8.0.0 + checksum: 34c394db0510be78c5cbb8928c9eb81405a117dd9e5903a149e4f3c20218dcda89a29e5012984d07c8ce9e5c7f5d7c38f5c3061558028f3f518ac98bbeb9a006 + languageName: node + linkType: hard + +"@typescript-eslint/visitor-keys@npm:5.12.0": + version: 5.12.0 + resolution: "@typescript-eslint/visitor-keys@npm:5.12.0" + dependencies: + "@typescript-eslint/types": 5.12.0 + eslint-visitor-keys: ^3.0.0 + checksum: c3774f542aae801926edf86fe6cab534c4cdac914b035730912443ed53fcc701b0f0e7b1a0d5fc959484637c55f63409fc43df5508c334e202d66d4654484d11 + languageName: node + linkType: hard + "@typescript-eslint/visitor-keys@npm:5.7.0": version: 5.7.0 resolution: "@typescript-eslint/visitor-keys@npm:5.7.0" @@ -10571,6 +10667,13 @@ __metadata: languageName: node linkType: hard +"base64id@npm:2.0.0, base64id@npm:~2.0.0": + version: 2.0.0 + resolution: "base64id@npm:2.0.0" + checksum: 581b1d37e6cf3738b7ccdd4d14fe2bfc5c238e696e2720ee6c44c183b838655842e22034e53ffd783f872a539915c51b0d4728a49c7cc678ac5a758e00d62168 + languageName: node + linkType: hard + "base@npm:^0.11.1": version: 0.11.2 resolution: "base@npm:0.11.2" @@ -10722,7 +10825,7 @@ __metadata: languageName: node linkType: hard -"bluebird@npm:3.7.2, bluebird@npm:^3.0.5, bluebird@npm:^3.1.1, bluebird@npm:^3.3.0, bluebird@npm:^3.3.5, bluebird@npm:^3.4.1, bluebird@npm:^3.5.1, bluebird@npm:^3.5.2, bluebird@npm:^3.5.3, bluebird@npm:^3.5.4, bluebird@npm:^3.5.5, bluebird@npm:~3.7.0": +"bluebird@npm:3.7.2, bluebird@npm:^3.0.5, bluebird@npm:^3.1.1, bluebird@npm:^3.3.5, bluebird@npm:^3.4.1, bluebird@npm:^3.5.1, bluebird@npm:^3.5.2, bluebird@npm:^3.5.3, bluebird@npm:^3.5.4, bluebird@npm:^3.5.5, bluebird@npm:~3.7.0": version: 3.7.2 resolution: "bluebird@npm:3.7.2" checksum: 869417503c722e7dc54ca46715f70e15f4d9c602a423a02c825570862d12935be59ed9c7ba34a9b31f186c017c23cac6b54e35446f8353059c101da73eac22ef @@ -10736,7 +10839,7 @@ __metadata: languageName: node linkType: hard -"body-parser@npm:1.19.0, body-parser@npm:^1.16.1": +"body-parser@npm:1.19.0": version: 1.19.0 resolution: "body-parser@npm:1.19.0" dependencies: @@ -10754,6 +10857,24 @@ __metadata: languageName: node linkType: hard +"body-parser@npm:^1.19.0": + version: 1.19.1 + resolution: "body-parser@npm:1.19.1" + dependencies: + bytes: 3.1.1 + content-type: ~1.0.4 + debug: 2.6.9 + depd: ~1.1.2 + http-errors: 1.8.1 + iconv-lite: 0.4.24 + on-finished: ~2.3.0 + qs: 6.9.6 + raw-body: 2.4.2 + type-is: ~1.6.18 + checksum: 9197a300a6580b8723c7b6b1e22cebd5ba47cd4a6fd45c153350efcde79293869ddee8d17d95fb52724812d649d89d62775faab072608d3243a0cbb00582234e + languageName: node + linkType: hard + "bonjour@npm:^3.5.0": version: 3.5.0 resolution: "bonjour@npm:3.5.0" @@ -11148,23 +11269,6 @@ __metadata: languageName: node linkType: hard -"buffer-alloc-unsafe@npm:^1.1.0": - version: 1.1.0 - resolution: "buffer-alloc-unsafe@npm:1.1.0" - checksum: c5e18bf51f67754ec843c9af3d4c005051aac5008a3992938dda1344e5cfec77c4b02b4ca303644d1e9a6e281765155ce6356d85c6f5ccc5cd21afc868def396 - languageName: node - linkType: hard - -"buffer-alloc@npm:^1.2.0": - version: 1.2.0 - resolution: "buffer-alloc@npm:1.2.0" - dependencies: - buffer-alloc-unsafe: ^1.1.0 - buffer-fill: ^1.0.0 - checksum: 560cd27f3cbe73c614867da373407d4506309c62fe18de45a1ce191f3785ec6ca2488d802ff82065798542422980ca25f903db078c57822218182c37c3576df5 - languageName: node - linkType: hard - "buffer-crc32@npm:~0.2.3": version: 0.2.13 resolution: "buffer-crc32@npm:0.2.13" @@ -11179,13 +11283,6 @@ __metadata: languageName: node linkType: hard -"buffer-fill@npm:^1.0.0": - version: 1.0.0 - resolution: "buffer-fill@npm:1.0.0" - checksum: c29b4723ddeab01e74b5d3b982a0c6828f2ded49cef049ddca3dac661c874ecdbcecb5dd8380cf0f4adbeb8cff90a7de724126750a1f1e5ebd4eb6c59a1315b1 - languageName: node - linkType: hard - "buffer-from@npm:^1.0.0": version: 1.1.1 resolution: "buffer-from@npm:1.1.1" @@ -11312,6 +11409,13 @@ __metadata: languageName: node linkType: hard +"bytes@npm:3.1.1": + version: 3.1.1 + resolution: "bytes@npm:3.1.1" + checksum: 949ab99a385d6acf4d2c69f1afc618615dc905936e0b0b9aa94a9e94d722baaba44d6a0851536585a0892ae4d462b5a270ccb1b04c774640742cbde5538ca328 + languageName: node + linkType: hard + "cacache@npm:^12.0.0, cacache@npm:^12.0.2, cacache@npm:^12.0.3": version: 12.0.3 resolution: "cacache@npm:12.0.3" @@ -11675,7 +11779,7 @@ __metadata: languageName: node linkType: hard -"carbon-components-react@^7.53.0, carbon-components-react@workspace:packages/react": +"carbon-components-react@^7.54.0-rc.0, carbon-components-react@workspace:packages/react": version: 0.0.0-use.local resolution: "carbon-components-react@workspace:packages/react" dependencies: @@ -11692,8 +11796,8 @@ __metadata: "@babel/preset-react": ^7.16.7 "@babel/runtime": ^7.16.7 "@carbon/feature-flags": ^0.7.0 - "@carbon/icons-react": ^10.46.0 - "@carbon/layout": ^10.36.0 + "@carbon/icons-react": ^10.47.0-rc.0 + "@carbon/layout": ^10.37.0-rc.0 "@carbon/telemetry": 0.0.0-alpha.6 "@carbon/test-utils": ^10.21.0 "@cypress/react": ^5.11.0 @@ -11724,7 +11828,7 @@ __metadata: babel-plugin-react-docgen: ^4.2.1 babel-plugin-transform-inline-environment-variables: ^0.4.3 browserslist-config-carbon: ^10.6.1 - carbon-components: ^10.53.0 + carbon-components: ^10.54.0-rc.0 carbon-icons: ^7.0.5 chalk: ^4.1.1 classnames: 2.3.1 @@ -11737,9 +11841,9 @@ __metadata: cypress-real-events: ^1.6.0 downshift: 5.2.1 fast-glob: ^3.2.7 - fast-sass-loader: ^2.0.0 + fast-sass-loader: ^1.5.0 flatpickr: 4.6.9 - gzip-size: ^6.0.0 + gzip-size: ^7.0.0 invariant: ^2.2.3 lcov2badge: ^0.1.0 lodash.debounce: ^4.0.8 @@ -11811,7 +11915,7 @@ __metadata: languageName: node linkType: hard -"carbon-components@^10.53.0, carbon-components@workspace:packages/components": +"carbon-components@^10.54.0-rc.0, carbon-components@workspace:packages/components": version: 0.0.0-use.local resolution: "carbon-components@workspace:packages/components" dependencies: @@ -11823,10 +11927,10 @@ __metadata: "@babel/preset-env": ^7.16.7 "@babel/preset-react": ^7.16.7 "@babel/runtime": ^7.16.7 - "@carbon/cli": ^10.33.0 - "@carbon/elements": ^10.52.0 - "@carbon/icons-handlebars": ^10.46.0 - "@carbon/icons-react": ^10.46.0 + "@carbon/cli": ^10.34.0-rc.0 + "@carbon/elements": ^10.53.0-rc.0 + "@carbon/icons-handlebars": ^10.47.0-rc.0 + "@carbon/icons-react": ^10.47.0-rc.0 "@carbon/telemetry": 0.0.0-alpha.6 "@carbon/test-utils": ^10.21.0 "@frctl/fractal": ^1.1.0 @@ -11865,8 +11969,8 @@ __metadata: gulp-header: ^2.0.0 gulp-jsdoc3: ^2.0.0 gulp-nodemon: ^2.4.2 - gulp-postcss: ^8.0.0 - gulp-rename: ^1.4.0 + gulp-postcss: ^9.0.0 + gulp-rename: ^2.0.0 gulp-sass: ^4.1.0 gulp-sass-lint: ^1.4.0 gulp-sourcemaps: ^2.6.0 @@ -11875,7 +11979,7 @@ __metadata: handlebars-helpers: ^0.10.0 html-loader: ^0.5.0 jasmine-core: ^3.0.0 - karma: ^4.0.0 + karma: ^6.0.0 karma-chrome-launcher: ^2.2.0 karma-coverage: ^2.0.3 karma-firefox-launcher: ^2.1.0 @@ -12205,9 +12309,9 @@ __metadata: languageName: node linkType: hard -"chokidar@npm:>=3.0.0 <4.0.0, chokidar@npm:^3.0.0, chokidar@npm:^3.4.0, chokidar@npm:^3.4.1, chokidar@npm:^3.4.2, chokidar@npm:^3.5.2": - version: 3.5.2 - resolution: "chokidar@npm:3.5.2" +"chokidar@npm:>=3.0.0 <4.0.0, chokidar@npm:^3.0.0, chokidar@npm:^3.4.0, chokidar@npm:^3.4.1, chokidar@npm:^3.4.2, chokidar@npm:^3.5.1, chokidar@npm:^3.5.2": + version: 3.5.3 + resolution: "chokidar@npm:3.5.3" dependencies: anymatch: ~3.1.2 braces: ~3.0.2 @@ -12220,7 +12324,7 @@ __metadata: dependenciesMeta: fsevents: optional: true - checksum: d1fda32fcd67d9f6170a8468ad2630a3c6194949c9db3f6a91b16478c328b2800f433fb5d2592511b6cb145a47c013ea1cce60b432b1a001ae3ee978a8bffc2d + checksum: b49fcde40176ba007ff361b198a2d35df60d9bb2a5aab228279eb810feae9294a6b4649ab15981304447afe1e6ffbf4788ad5db77235dc770ab777c6e771980c languageName: node linkType: hard @@ -12779,7 +12883,7 @@ __metadata: version: 0.0.0-use.local resolution: "codesandbox-styles@workspace:examples/codesandbox-styles" dependencies: - "@carbon/styles": 0.14.0 + "@carbon/styles": ^0.15.0-rc.0 sass: ^1.49.7 vite: ^2.8.0 languageName: unknown @@ -12789,7 +12893,7 @@ __metadata: version: 0.0.0-use.local resolution: "codesandbox@workspace:examples/codesandbox" dependencies: - "@carbon/react": 0.14.0 + "@carbon/react": ^0.15.0-rc.0 "@vitejs/plugin-react": ^1.0.7 react: ^17.0.2 react-dom: ^17.0.2 @@ -12935,7 +13039,7 @@ __metadata: languageName: node linkType: hard -"colors@npm:1.4.0, colors@npm:^1.1.0, colors@npm:^1.1.2, colors@npm:^1.2.1, colors@npm:^1.4.0": +"colors@npm:1.4.0, colors@npm:^1.1.2, colors@npm:^1.2.1, colors@npm:^1.4.0": version: 1.4.0 resolution: "colors@npm:1.4.0" checksum: 98aa2c2418ad87dedf25d781be69dc5fc5908e279d9d30c34d8b702e586a0474605b3a189511482b9d5ed0d20c867515d22749537f7bc546256c6014f3ebdcec @@ -13117,7 +13221,7 @@ __metadata: languageName: node linkType: hard -"component-emitter@npm:^1.2.1": +"component-emitter@npm:^1.2.1, component-emitter@npm:~1.3.0": version: 1.3.0 resolution: "component-emitter@npm:1.3.0" checksum: b3c46de38ffd35c57d1c02488355be9f218e582aec72d72d1b8bbec95a3ac1b38c96cd6e03ff015577e68f550fbb361a3bfdbd9bb248be9390b7b3745691be6b @@ -13283,7 +13387,7 @@ __metadata: languageName: node linkType: hard -"connect@npm:^3.6.0": +"connect@npm:^3.7.0": version: 3.7.0 resolution: "connect@npm:3.7.0" dependencies: @@ -13493,6 +13597,13 @@ __metadata: languageName: node linkType: hard +"cookie@npm:~0.4.1": + version: 0.4.2 + resolution: "cookie@npm:0.4.2" + checksum: a00833c998bedf8e787b4c342defe5fa419abd96b32f4464f718b91022586b8f1bafbddd499288e75c037642493c83083da426c6a9080d309e3bd90fd11baa9b + languageName: node + linkType: hard + "copy-concurrently@npm:^1.0.0": version: 1.0.5 resolution: "copy-concurrently@npm:1.0.5" @@ -13571,6 +13682,16 @@ __metadata: languageName: node linkType: hard +"cors@npm:~2.8.5": + version: 2.8.5 + resolution: "cors@npm:2.8.5" + dependencies: + object-assign: ^4 + vary: ^1 + checksum: ced838404ccd184f61ab4fdc5847035b681c90db7ac17e428f3d81d69e2989d2b680cc254da0e2554f5ed4f8a341820a1ce3d1c16b499f6e2f47a1b9b07b5006 + languageName: node + linkType: hard + "cosmiconfig-typescript-loader@npm:^1.0.0": version: 1.0.3 resolution: "cosmiconfig-typescript-loader@npm:1.0.3" @@ -14419,10 +14540,10 @@ __metadata: languageName: node linkType: hard -"date-format@npm:^2.0.0": - version: 2.1.0 - resolution: "date-format@npm:2.1.0" - checksum: ff2c80c76021a315409b6ce2f08997f6e4a61ae68042dbf2cefda450207712a804aa30ac52e235f3de495dc915842507249c74e4668659835cc4870892042394 +"date-format@npm:^4.0.3": + version: 4.0.3 + resolution: "date-format@npm:4.0.3" + checksum: 8ae4d9de3532010169a89bc7b079342051ba3ec88552636aa677bfb53e8eb15113af8394679aea7d41367dc8bb6e9865da17f21ac2802202180b09d6e3f2339e languageName: node linkType: hard @@ -14487,7 +14608,7 @@ __metadata: languageName: node linkType: hard -"debug@npm:4, debug@npm:^4.0.1, debug@npm:^4.1.0, debug@npm:^4.1.1, debug@npm:^4.3.1, debug@npm:^4.3.2, debug@npm:^4.3.3": +"debug@npm:4, debug@npm:^4.0.1, debug@npm:^4.1.0, debug@npm:^4.1.1, debug@npm:^4.3.1, debug@npm:^4.3.2, debug@npm:^4.3.3, debug@npm:~4.3.1, debug@npm:~4.3.2": version: 4.3.3 resolution: "debug@npm:4.3.3" dependencies: @@ -15201,7 +15322,7 @@ __metadata: languageName: node linkType: hard -"dom-serialize@npm:^2.2.0": +"dom-serialize@npm:^2.2.1": version: 2.2.1 resolution: "dom-serialize@npm:2.2.1" dependencies: @@ -15853,6 +15974,15 @@ __metadata: languageName: node linkType: hard +"engine.io-parser@npm:~5.0.0": + version: 5.0.3 + resolution: "engine.io-parser@npm:5.0.3" + dependencies: + "@socket.io/base64-arraybuffer": ~1.0.2 + checksum: 88d664420a441dd02db17d110f7bbbd9efe971747918150bf666b82ee138df596a2f5038f461c8a01864c83af67cb202548364e4174543f8c0bf5f4776ca6e0d + languageName: node + linkType: hard + "engine.io@npm:~3.2.0": version: 3.2.1 resolution: "engine.io@npm:3.2.1" @@ -15867,6 +15997,24 @@ __metadata: languageName: node linkType: hard +"engine.io@npm:~6.1.0": + version: 6.1.2 + resolution: "engine.io@npm:6.1.2" + dependencies: + "@types/cookie": ^0.4.1 + "@types/cors": ^2.8.12 + "@types/node": ">=10.0.0" + accepts: ~1.3.4 + base64id: 2.0.0 + cookie: ~0.4.1 + cors: ~2.8.5 + debug: ~4.3.1 + engine.io-parser: ~5.0.0 + ws: ~8.2.3 + checksum: bd98d6ce2b1e868e8ff0f65d7667a885b90bce62065d851ea0394a00c86686925be824ab91237151222d6a5acfd5610634f36966fa9b4c502e7cf362fbdf974a + languageName: node + linkType: hard + "enhanced-resolve@npm:^4.5.0": version: 4.5.0 resolution: "enhanced-resolve@npm:4.5.0" @@ -16588,7 +16736,7 @@ __metadata: eslint-config-prettier: ^8.3.0 eslint-plugin-cypress: ^2.11.3 eslint-plugin-import: ^2.23.4 - eslint-plugin-jest: ^25.3.0 + eslint-plugin-jest: ^26.0.0 eslint-plugin-jsdoc: ^36.0.3 eslint-plugin-jsx-a11y: ^6.4.1 eslint-plugin-prettier: ^3.4.0 @@ -16723,6 +16871,23 @@ __metadata: languageName: node linkType: hard +"eslint-plugin-jest@npm:^26.0.0": + version: 26.1.1 + resolution: "eslint-plugin-jest@npm:26.1.1" + dependencies: + "@typescript-eslint/utils": ^5.10.0 + peerDependencies: + "@typescript-eslint/eslint-plugin": ^5.0.0 + eslint: ^6.0.0 || ^7.0.0 || ^8.0.0 + peerDependenciesMeta: + "@typescript-eslint/eslint-plugin": + optional: true + jest: + optional: true + checksum: efed65bd6b83f15f38e3d8447d0dbbac18c10d6e4c4853c8d0539f5bc8e898cca8136b1e706899b756ea995ed189445b7f15d0fffeb983890608c33e752670d7 + languageName: node + linkType: hard + "eslint-plugin-jsdoc@npm:^36.0.3": version: 36.0.3 resolution: "eslint-plugin-jsdoc@npm:36.0.3" @@ -17613,7 +17778,7 @@ __metadata: languageName: node linkType: hard -"fancy-log@npm:^1.3.2": +"fancy-log@npm:^1.3.2, fancy-log@npm:^1.3.3": version: 1.3.3 resolution: "fancy-log@npm:1.3.3" dependencies: @@ -17710,9 +17875,9 @@ __metadata: languageName: node linkType: hard -"fast-sass-loader@npm:^2.0.0": - version: 2.0.1 - resolution: "fast-sass-loader@npm:2.0.1" +"fast-sass-loader@npm:^1.5.0": + version: 1.5.0 + resolution: "fast-sass-loader@npm:1.5.0" dependencies: async: ^2.0.1 cli-source-preview: ^1.0.0 @@ -17720,9 +17885,9 @@ __metadata: fs-extra: 3.x loader-utils: ^1.1.0 peerDependencies: - sass: 1.x - webpack: 1.x || 2.x || 3.x || 4.x || 5.x - checksum: 808ad855f4eaa23be2f98812383c3a7c06d3247e725b759168bcfac235f6935236fae332fbfd34795cca2481835377951ebc3dc062e34be632fcdceee399ee91 + node-sass: 4.x || 3.x + webpack: 1.x || 2.x || 3.x || 4.x + checksum: 73ac3bba48b03179e89c4b94ddfad02c209e2cd7e5a50fe95bda8517b07c3b5d0d9b2c3b4efa6668aa86d07106bfffa6924f66c4e31754278307e74dddb14785 languageName: node linkType: hard @@ -18206,17 +18371,10 @@ __metadata: languageName: node linkType: hard -"flatted@npm:^2.0.0": - version: 2.0.1 - resolution: "flatted@npm:2.0.1" - checksum: 251447389c2544aa44da1f025e98cdff728bc9cc0ccef8d92256568a3f7b868b895122d77dad138c788cd6917ba80236ddb723111fb688f30b298ad56bb2ce01 - languageName: node - linkType: hard - -"flatted@npm:^3.1.0": - version: 3.1.1 - resolution: "flatted@npm:3.1.1" - checksum: 508935e3366d95444131f0aaa801a4301f24ea5bcb900d12764e7335b46b910730cc1b5bcfcfb8eccb7c8db261ba0671c6a7ca30d10870ff7a7756dc7e731a7a +"flatted@npm:^3.1.0, flatted@npm:^3.2.4": + version: 3.2.5 + resolution: "flatted@npm:3.2.5" + checksum: 3c436e9695ccca29620b4be5671dd72e5dd0a7500e0856611b7ca9bd8169f177f408c3b9abfa78dfe1493ee2d873e2c119080a8a9bee4e1a186a9e60ca6c89f1 languageName: node linkType: hard @@ -18555,17 +18713,6 @@ __metadata: languageName: node linkType: hard -"fs-extra@npm:^7.0.1": - version: 7.0.1 - resolution: "fs-extra@npm:7.0.1" - dependencies: - graceful-fs: ^4.1.2 - jsonfile: ^4.0.0 - universalify: ^0.1.0 - checksum: 141b9dccb23b66a66cefdd81f4cda959ff89282b1d721b98cea19ba08db3dcbe6f862f28841f3cf24bb299e0b7e6c42303908f65093cb7e201708e86ea5a8dcf - languageName: node - linkType: hard - "fs-extra@npm:^8.1, fs-extra@npm:^8.1.0": version: 8.1.0 resolution: "fs-extra@npm:8.1.0" @@ -19219,7 +19366,21 @@ __metadata: languageName: node linkType: hard -"glob@npm:^7.0.0, glob@npm:^7.0.3, glob@npm:^7.1.1, glob@npm:^7.1.2, glob@npm:^7.1.3, glob@npm:^7.1.4, glob@npm:^7.1.6, glob@npm:~7.1.1": +"glob@npm:^7.0.0, glob@npm:^7.0.3, glob@npm:^7.1.1, glob@npm:^7.1.2, glob@npm:^7.1.3, glob@npm:^7.1.4, glob@npm:^7.1.6, glob@npm:^7.1.7": + version: 7.2.0 + resolution: "glob@npm:7.2.0" + dependencies: + fs.realpath: ^1.0.0 + inflight: ^1.0.4 + inherits: 2 + minimatch: ^3.0.4 + once: ^1.3.0 + path-is-absolute: ^1.0.0 + checksum: 78a8ea942331f08ed2e055cb5b9e40fe6f46f579d7fd3d694f3412fe5db23223d29b7fee1575440202e9a7ff9a72ab106a39fee39934c7bedafe5e5f8ae20134 + languageName: node + linkType: hard + +"glob@npm:~7.1.1": version: 7.1.6 resolution: "glob@npm:7.1.6" dependencies: @@ -19680,23 +19841,24 @@ __metadata: languageName: node linkType: hard -"gulp-postcss@npm:^8.0.0": - version: 8.0.0 - resolution: "gulp-postcss@npm:8.0.0" +"gulp-postcss@npm:^9.0.0": + version: 9.0.1 + resolution: "gulp-postcss@npm:9.0.1" dependencies: - fancy-log: ^1.3.2 + fancy-log: ^1.3.3 plugin-error: ^1.0.1 - postcss: ^7.0.2 - postcss-load-config: ^2.0.0 + postcss-load-config: ^3.0.0 vinyl-sourcemaps-apply: ^0.2.1 - checksum: 2d6ca84ec03887a6fbacb1fad9ffc543c34f238e805e59e38410edf69050c01b2adb13e9b8124c8a59d26fe6dadf9a54481b8d70405d7c9be308c3dc4921930c + peerDependencies: + postcss: ^8.0.0 + checksum: f27a7ebdb71b2bcd59ac5fbbc15ab877b22585a9352884a81395ffb8fe6230dfc8106cdf93075e54685c7bf249a0bd1ad2f6fbeb452bdf81a01c3adcc3c6fff4 languageName: node linkType: hard -"gulp-rename@npm:^1.4.0": - version: 1.4.0 - resolution: "gulp-rename@npm:1.4.0" - checksum: d0c965d07df9a4f7e856e514357451f4863dcad2cea8d59a5c109e911bfb9807edfa8d35415be174dd9bab12b4b6306bb1e2550e44b9231276549fe084b69ab6 +"gulp-rename@npm:^2.0.0": + version: 2.0.0 + resolution: "gulp-rename@npm:2.0.0" + checksum: b9add0d130487dee6067206eebfc3867e4e254117edef154e8c270e3111b112335439ac1cac1519d6a32541343e04bd299484253a333b4e34c7d430039953e99 languageName: node linkType: hard @@ -19800,6 +19962,15 @@ __metadata: languageName: node linkType: hard +"gzip-size@npm:^7.0.0": + version: 7.0.0 + resolution: "gzip-size@npm:7.0.0" + dependencies: + duplexer: ^0.1.2 + checksum: 52d0bf586307082428b99f7b04d56d756d640e1f84d4a56debf9fb8c972d9db679143b067dd4024ebef42e9f6787e9dc8b9dcad344372b9dc87e55d942276f49 + languageName: node + linkType: hard + "handle-thing@npm:^2.0.0": version: 2.0.1 resolution: "handle-thing@npm:2.0.1" @@ -20577,6 +20748,19 @@ __metadata: languageName: node linkType: hard +"http-errors@npm:1.8.1": + version: 1.8.1 + resolution: "http-errors@npm:1.8.1" + dependencies: + depd: ~1.1.2 + inherits: 2.0.4 + setprototypeof: 1.2.0 + statuses: ">= 1.5.0 < 2" + toidentifier: 1.0.1 + checksum: d3c7e7e776fd51c0a812baff570bdf06fe49a5dc448b700ab6171b1250e4cf7db8b8f4c0b133e4bfe2451022a5790c1ca6c2cae4094dedd6ac8304a1267f91d2 + languageName: node + linkType: hard + "http-errors@npm:~1.6.2": version: 1.6.3 resolution: "http-errors@npm:1.6.3" @@ -20640,7 +20824,7 @@ __metadata: languageName: node linkType: hard -"http-proxy@npm:^1.13.0, http-proxy@npm:^1.18.1": +"http-proxy@npm:^1.18.1": version: 1.18.1 resolution: "http-proxy@npm:1.18.1" dependencies: @@ -20927,15 +21111,6 @@ __metadata: languageName: node linkType: hard -"import-cwd@npm:^3.0.0": - version: 3.0.0 - resolution: "import-cwd@npm:3.0.0" - dependencies: - import-from: ^3.0.0 - checksum: f2c4230e8389605154a390124381f9136811306ae4ba1c8017398c3c6926bc5cf75cf89350372b4938f79792ea373776b4efabd27506440ec301ce34c4e867eb - languageName: node - linkType: hard - "import-fresh@npm:^2.0.0": version: 2.0.0 resolution: "import-fresh@npm:2.0.0" @@ -20965,15 +21140,6 @@ __metadata: languageName: node linkType: hard -"import-from@npm:^3.0.0": - version: 3.0.0 - resolution: "import-from@npm:3.0.0" - dependencies: - resolve-from: ^5.0.0 - checksum: 5040a7400e77e41e2c3bb6b1b123b52a15a284de1ffc03d605879942c00e3a87428499d8d031d554646108a0f77652549411167f6a7788e4fc7027eefccf3356 - languageName: node - linkType: hard - "import-lazy@npm:^2.1.0": version: 2.1.0 resolution: "import-lazy@npm:2.1.0" @@ -22372,12 +22538,10 @@ __metadata: languageName: node linkType: hard -"isbinaryfile@npm:^3.0.0": - version: 3.0.3 - resolution: "isbinaryfile@npm:3.0.3" - dependencies: - buffer-alloc: ^1.2.0 - checksum: 9a555786857c66fe36024d15a54e0ca371c02275622b007356d6afca2b3bca179cb0bd97e1adf5d3922b3325c0fe22813645c7f7eafb4c4bdab1da9d635133c2 +"isbinaryfile@npm:^4.0.8": + version: 4.0.8 + resolution: "isbinaryfile@npm:4.0.8" + checksum: 606e3bb648d1a0dee23459d1d937bb2560e66a5281ec7c9ff50e585402d73321ac268d0f34cb7393125b3ebc4c7962d39e50a01cdb8904b52fce08b7ccd2bf9f languageName: node linkType: hard @@ -23823,39 +23987,37 @@ __metadata: languageName: node linkType: hard -"karma@npm:^4.0.0": - version: 4.4.1 - resolution: "karma@npm:4.4.1" +"karma@npm:^6.0.0": + version: 6.3.16 + resolution: "karma@npm:6.3.16" dependencies: - bluebird: ^3.3.0 - body-parser: ^1.16.1 + body-parser: ^1.19.0 braces: ^3.0.2 - chokidar: ^3.0.0 - colors: ^1.1.0 - connect: ^3.6.0 + chokidar: ^3.5.1 + colors: 1.4.0 + connect: ^3.7.0 di: ^0.0.1 - dom-serialize: ^2.2.0 - flatted: ^2.0.0 - glob: ^7.1.1 - graceful-fs: ^4.1.2 - http-proxy: ^1.13.0 - isbinaryfile: ^3.0.0 - lodash: ^4.17.14 - log4js: ^4.0.0 - mime: ^2.3.1 - minimatch: ^3.0.2 - optimist: ^0.6.1 - qjobs: ^1.1.4 - range-parser: ^1.2.0 - rimraf: ^2.6.0 - safe-buffer: ^5.0.1 - socket.io: 2.1.1 + dom-serialize: ^2.2.1 + glob: ^7.1.7 + graceful-fs: ^4.2.6 + http-proxy: ^1.18.1 + isbinaryfile: ^4.0.8 + lodash: ^4.17.21 + log4js: ^6.4.1 + mime: ^2.5.2 + minimatch: ^3.0.4 + mkdirp: ^0.5.5 + qjobs: ^1.2.0 + range-parser: ^1.2.1 + rimraf: ^3.0.2 + socket.io: ^4.2.0 source-map: ^0.6.1 - tmp: 0.0.33 - useragent: 2.3.0 + tmp: ^0.2.1 + ua-parser-js: ^0.7.30 + yargs: ^16.1.1 bin: - karma: ./bin/karma - checksum: 44beb678d59e19d6dc6c31a6ef6e8429dba81e45255b66371110c1f103112a4a005464b5299c96d20e8c0b3b0315e9b5a226b869656355e59212d3471270b2a9 + karma: bin/karma + checksum: eb1703d4907ac31a47019e2b6b5f69e1ecd7870dabee1ed8f284d9730f665e02ae9ef1a75733b5d4b6a27fe68069536d0845b9e41747c43507128b3ac645c87f languageName: node linkType: hard @@ -24220,7 +24382,7 @@ __metadata: languageName: node linkType: hard -"lilconfig@npm:^2.0.3": +"lilconfig@npm:^2.0.3, lilconfig@npm:^2.0.4": version: 2.0.4 resolution: "lilconfig@npm:2.0.4" checksum: 02ae530aa49218d782eb79e92c600ea5220828987f85aa3403fa512cadc7efe38c0ac7d0cd2edf600ad3fae1f6c1752f5b4bb78c0d9950435b044d53d507c9e1 @@ -24954,16 +25116,16 @@ __metadata: languageName: node linkType: hard -"log4js@npm:^4.0.0": - version: 4.5.1 - resolution: "log4js@npm:4.5.1" +"log4js@npm:^6.4.1": + version: 6.4.1 + resolution: "log4js@npm:6.4.1" dependencies: - date-format: ^2.0.0 - debug: ^4.1.1 - flatted: ^2.0.0 - rfdc: ^1.1.4 - streamroller: ^1.0.6 - checksum: ad6d7753f6709363c02172cf017398d1c725a077ce9a7d2967df61528c5d186f9343fe0fb0cffa8808e2b3e6f92b47623e0f8b4dc3de0c50d42c05db11ee63c5 + date-format: ^4.0.3 + debug: ^4.3.3 + flatted: ^3.2.4 + rfdc: ^1.3.0 + streamroller: ^3.0.2 + checksum: 0614949662314573ec7dcd841769a4d23d8cb8268685458a40fcd94f2ae6ec628234cfb9a6bc17821fb6ea6ce3765e779b4966ba1cf918f393dc37155a3615cb languageName: node linkType: hard @@ -25101,16 +25263,6 @@ __metadata: languageName: node linkType: hard -"lru-cache@npm:4.1.x, lru-cache@npm:^4.0.0, lru-cache@npm:^4.0.1, lru-cache@npm:^4.1.5": - version: 4.1.5 - resolution: "lru-cache@npm:4.1.5" - dependencies: - pseudomap: ^1.0.2 - yallist: ^2.1.2 - checksum: 4bb4b58a36cd7dc4dcec74cbe6a8f766a38b7426f1ff59d4cf7d82a2aa9b9565cd1cb98f6ff60ce5cd174524868d7bc9b7b1c294371851356066ca9ac4cf135a - languageName: node - linkType: hard - "lru-cache@npm:^3.2.0": version: 3.2.0 resolution: "lru-cache@npm:3.2.0" @@ -25120,6 +25272,16 @@ __metadata: languageName: node linkType: hard +"lru-cache@npm:^4.0.0, lru-cache@npm:^4.0.1, lru-cache@npm:^4.1.5": + version: 4.1.5 + resolution: "lru-cache@npm:4.1.5" + dependencies: + pseudomap: ^1.0.2 + yallist: ^2.1.2 + checksum: 4bb4b58a36cd7dc4dcec74cbe6a8f766a38b7426f1ff59d4cf7d82a2aa9b9565cd1cb98f6ff60ce5cd174524868d7bc9b7b1c294371851356066ca9ac4cf135a + languageName: node + linkType: hard + "lru-cache@npm:^5.1.1": version: 5.1.1 resolution: "lru-cache@npm:5.1.1" @@ -25898,12 +26060,12 @@ __metadata: languageName: node linkType: hard -"mime@npm:^2.1.0, mime@npm:^2.3.1, mime@npm:^2.4.4": - version: 2.4.4 - resolution: "mime@npm:2.4.4" +"mime@npm:^2.1.0, mime@npm:^2.4.4, mime@npm:^2.5.2": + version: 2.6.0 + resolution: "mime@npm:2.6.0" bin: mime: cli.js - checksum: a8dad06df1a55f56241789ed0bd0b8b42042bf9575b35ba4bbe3051352569511d191a882168f990b2d845ce41a77b0f48347f085344494874e86ed7969f3973b + checksum: 1497ba7b9f6960694268a557eae24b743fd2923da46ec392b042469f4b901721ba0adcf8b0d3c2677839d0e243b209d76e5edcbd09cfdeffa2dfb6bb4df4b862 languageName: node linkType: hard @@ -26034,13 +26196,6 @@ __metadata: languageName: node linkType: hard -"minimist@npm:~0.0.1": - version: 0.0.10 - resolution: "minimist@npm:0.0.10" - checksum: f7b2cb17af165d042bb3d2803f5e6c38d137f0c36a62230fdb643058c25b56749d2c335b17d4de0b0f08f19cb868cac40df207ff7a4c59fd0771e8762e9b783c - languageName: node - linkType: hard - "minipass-collect@npm:^1.0.2": version: 1.0.2 resolution: "minipass-collect@npm:1.0.2" @@ -27370,7 +27525,7 @@ __metadata: languageName: node linkType: hard -"object-assign@npm:*, object-assign@npm:4.X, object-assign@npm:^4.0.1, object-assign@npm:^4.1.0, object-assign@npm:^4.1.1": +"object-assign@npm:*, object-assign@npm:4.X, object-assign@npm:^4, object-assign@npm:^4.0.1, object-assign@npm:^4.1.0, object-assign@npm:^4.1.1": version: 4.1.1 resolution: "object-assign@npm:4.1.1" checksum: fcc6e4ea8c7fe48abfbb552578b1c53e0d194086e2e6bbbf59e0a536381a292f39943c6e9628af05b5528aa5e3318bb30d6b2e53cadaf5b8fe9e12c4b69af23f @@ -27708,16 +27863,6 @@ __metadata: languageName: node linkType: hard -"optimist@npm:^0.6.1": - version: 0.6.1 - resolution: "optimist@npm:0.6.1" - dependencies: - minimist: ~0.0.1 - wordwrap: ~0.0.2 - checksum: 191ab2b119b2908a229065119349d9cbd295217a8777febd2812fc7b95c5f31f5f6ecb4fd0222351466cb33af8410299373229e78dd96713ed5348fcebfb96f4 - languageName: node - linkType: hard - "optionator@npm:^0.8.1": version: 0.8.3 resolution: "optionator@npm:0.8.3" @@ -29203,19 +29348,18 @@ __metadata: languageName: node linkType: hard -"postcss-load-config@npm:^3.1.0": - version: 3.1.0 - resolution: "postcss-load-config@npm:3.1.0" +"postcss-load-config@npm:^3.0.0, postcss-load-config@npm:^3.1.0": + version: 3.1.3 + resolution: "postcss-load-config@npm:3.1.3" dependencies: - import-cwd: ^3.0.0 - lilconfig: ^2.0.3 + lilconfig: ^2.0.4 yaml: ^1.10.2 peerDependencies: ts-node: ">=9.0.0" peerDependenciesMeta: ts-node: optional: true - checksum: 7fd62064eab1e0e77ba315d9a782f09f4c62e1025630b53d38a936d5a2730bb632a3f259143115fc639e70d22f14744a75c7a6f471343ebdb03f6a3ef72d2f08 + checksum: 7d187d339f259265bf1de9efff39223b94cb2cabe4610516896a16ec96f713b9b6505b4247d870f134842f8441b442a0fdc33a782b78ae3bec6db2aed4aeafec languageName: node linkType: hard @@ -29834,7 +29978,7 @@ __metadata: languageName: node linkType: hard -"postcss@npm:5 - 7, postcss@npm:^7.0.0, postcss@npm:^7.0.14, postcss@npm:^7.0.16, postcss@npm:^7.0.17, postcss@npm:^7.0.2, postcss@npm:^7.0.26, postcss@npm:^7.0.32, postcss@npm:^7.0.35, postcss@npm:^7.0.36, postcss@npm:^7.0.5, postcss@npm:^7.0.6": +"postcss@npm:5 - 7, postcss@npm:^7.0.0, postcss@npm:^7.0.14, postcss@npm:^7.0.16, postcss@npm:^7.0.17, postcss@npm:^7.0.26, postcss@npm:^7.0.32, postcss@npm:^7.0.35, postcss@npm:^7.0.36, postcss@npm:^7.0.5, postcss@npm:^7.0.6": version: 7.0.39 resolution: "postcss@npm:7.0.39" dependencies: @@ -30411,7 +30555,7 @@ __metadata: languageName: node linkType: hard -"qjobs@npm:^1.1.4": +"qjobs@npm:^1.2.0": version: 1.2.0 resolution: "qjobs@npm:1.2.0" checksum: eb64c00724d2fecaf9246383b4eebc3a4c34845b25d41921dd57f41b30a4310cef661543facac27ceb6911aab64a1acdf45b5d8f1d5e2838554d0c010ee56852 @@ -30432,6 +30576,13 @@ __metadata: languageName: node linkType: hard +"qs@npm:6.9.6": + version: 6.9.6 + resolution: "qs@npm:6.9.6" + checksum: cb6df402bb8a3dbefa4bd46eba0dfca427079baca923e6b8d28a03e6bfb16a5c1dcdb96e69388f9c5813ac8ff17bb8bbca22f2ecd31fe1e344a55cb531b5fabf + languageName: node + linkType: hard + "qs@npm:^6.10.0, qs@npm:^6.10.1, qs@npm:^6.6.0": version: 6.10.2 resolution: "qs@npm:6.10.2" @@ -30569,7 +30720,7 @@ __metadata: languageName: node linkType: hard -"range-parser@npm:^1.0.3, range-parser@npm:^1.2.0, range-parser@npm:^1.2.1, range-parser@npm:~1.2.0, range-parser@npm:~1.2.1": +"range-parser@npm:^1.0.3, range-parser@npm:^1.2.1, range-parser@npm:~1.2.0, range-parser@npm:~1.2.1": version: 1.2.1 resolution: "range-parser@npm:1.2.1" checksum: 0a268d4fea508661cf5743dfe3d5f47ce214fd6b7dec1de0da4d669dd4ef3d2144468ebe4179049eff253d9d27e719c88dae55be64f954e80135a0cada804ec9 @@ -30588,7 +30739,7 @@ __metadata: languageName: node linkType: hard -"raw-body@npm:2.4.1, raw-body@npm:^2.2.0, raw-body@npm:^2.3.2": +"raw-body@npm:2.4.1": version: 2.4.1 resolution: "raw-body@npm:2.4.1" dependencies: @@ -30600,6 +30751,18 @@ __metadata: languageName: node linkType: hard +"raw-body@npm:2.4.2, raw-body@npm:^2.2.0, raw-body@npm:^2.3.2": + version: 2.4.2 + resolution: "raw-body@npm:2.4.2" + dependencies: + bytes: 3.1.1 + http-errors: 1.8.1 + iconv-lite: 0.4.24 + unpipe: 1.0.0 + checksum: c6f8d6a75c65c0a047f888cb29efc97f60fb36e950ba2cb31fefce694f98186e844a03367920faa7dc5bffaf33df08aee0b9dd935280e366439fa6492a5b163e + languageName: node + linkType: hard + "raw-loader@npm:^4.0.2": version: 4.0.2 resolution: "raw-loader@npm:4.0.2" @@ -32418,14 +32581,14 @@ resolve@^2.0.0-next.3: languageName: node linkType: hard -"rfdc@npm:^1.1.4": - version: 1.1.4 - resolution: "rfdc@npm:1.1.4" - checksum: 475a7936c469cbd3c6104ace8f883fa39c7f1bbdeb3c8ba9f1504bc289135245c9ce0021f209899213605d67d6baea38ef070f73308be225bdf51840bbbec21e +"rfdc@npm:^1.3.0": + version: 1.3.0 + resolution: "rfdc@npm:1.3.0" + checksum: fb2ba8512e43519983b4c61bd3fa77c0f410eff6bae68b08614437bc3f35f91362215f7b4a73cbda6f67330b5746ce07db5dd9850ad3edc91271ad6deea0df32 languageName: node linkType: hard -"rimraf@npm:2.*, rimraf@npm:^2.2.8, rimraf@npm:^2.5.4, rimraf@npm:^2.6.0, rimraf@npm:^2.6.2, rimraf@npm:^2.6.3, rimraf@npm:^2.7.1": +"rimraf@npm:2.*, rimraf@npm:^2.2.8, rimraf@npm:^2.5.4, rimraf@npm:^2.6.2, rimraf@npm:^2.6.3, rimraf@npm:^2.7.1": version: 2.7.1 resolution: "rimraf@npm:2.7.1" dependencies: @@ -33130,15 +33293,6 @@ resolve@^2.0.0-next.3: languageName: node linkType: hard -"semver@npm:5.5.x": - version: 5.5.1 - resolution: "semver@npm:5.5.1" - bin: - semver: ./bin/semver - checksum: ab920176f5324376c683a2f1bdb5f8d5ccdcc3f5c0a4547bddae7958a457f0813cf9f32ef3cdc77a40c1066d9c3a7599a986d47abae628d37bc637a0f6e6bbc5 - languageName: node - linkType: hard - "semver@npm:7.0.0": version: 7.0.0 resolution: "semver@npm:7.0.0" @@ -33386,6 +33540,13 @@ resolve@^2.0.0-next.3: languageName: node linkType: hard +"setprototypeof@npm:1.2.0": + version: 1.2.0 + resolution: "setprototypeof@npm:1.2.0" + checksum: be18cbbf70e7d8097c97f713a2e76edf84e87299b40d085c6bf8b65314e994cc15e2e317727342fa6996e38e1f52c59720b53fe621e2eb593a6847bf0356db89 + languageName: node + linkType: hard + "sha.js@npm:^2.4.0, sha.js@npm:^2.4.8": version: 2.4.11 resolution: "sha.js@npm:2.4.11" @@ -34023,6 +34184,13 @@ resolve@^2.0.0-next.3: languageName: node linkType: hard +"socket.io-adapter@npm:~2.3.3": + version: 2.3.3 + resolution: "socket.io-adapter@npm:2.3.3" + checksum: 73890e0a33e48a9e4be83e5fa2b8ea9728d2a35ae2fed373cad4d6744c6512c0e1c735e7820df9821e58c4738dc355bdaec5aae30bc56f4d6a41d999596d0c82 + languageName: node + linkType: hard + "socket.io-client@npm:2.1.1": version: 2.1.1 resolution: "socket.io-client@npm:2.1.1" @@ -34089,6 +34257,17 @@ resolve@^2.0.0-next.3: languageName: node linkType: hard +"socket.io-parser@npm:~4.0.4": + version: 4.0.4 + resolution: "socket.io-parser@npm:4.0.4" + dependencies: + "@types/component-emitter": ^1.2.10 + component-emitter: ~1.3.0 + debug: ~4.3.1 + checksum: c173b4f3747c51e2af802eca35212f4dcfa8fe55d7fdc07b9a01da1ecc956791c1bf6591e307952548eab69e6500bcfe27cea8aff1386b860d9bb51f98e4fafb + languageName: node + linkType: hard + "socket.io@npm:2.1.1": version: 2.1.1 resolution: "socket.io@npm:2.1.1" @@ -34103,6 +34282,20 @@ resolve@^2.0.0-next.3: languageName: node linkType: hard +"socket.io@npm:^4.2.0": + version: 4.4.1 + resolution: "socket.io@npm:4.4.1" + dependencies: + accepts: ~1.3.4 + base64id: ~2.0.0 + debug: ~4.3.2 + engine.io: ~6.1.0 + socket.io-adapter: ~2.3.3 + socket.io-parser: ~4.0.4 + checksum: a559ae52359f1ca3ce5a347368cf985c72259e1ab1bf2bf769ca0add5db34e2a86f4e183a58f37f32676ec482c71fedb7b08d873dc31cf581f5ba0797a8382fe + languageName: node + linkType: hard + "sockjs@npm:^0.3.21": version: 0.3.24 resolution: "sockjs@npm:0.3.24" @@ -34692,16 +34885,14 @@ resolve@^2.0.0-next.3: languageName: node linkType: hard -"streamroller@npm:^1.0.6": - version: 1.0.6 - resolution: "streamroller@npm:1.0.6" +"streamroller@npm:^3.0.2": + version: 3.0.2 + resolution: "streamroller@npm:3.0.2" dependencies: - async: ^2.6.2 - date-format: ^2.0.0 - debug: ^3.2.6 - fs-extra: ^7.0.1 - lodash: ^4.17.14 - checksum: 14c6717c1af1086ba10095b8c3f2dc0ff8c1d40e0e8a0eb069b9613d74899462ce64eb39f605db4ed531b1aa519a3b4134d24616effa4fad9bc67027328c3af9 + date-format: ^4.0.3 + debug: ^4.1.1 + fs-extra: ^10.0.0 + checksum: 1f323824f0e81cc085c24f33addfd8ef00d0c15aafee520a8cf207ca6e2dc674fd852528c7b4450cc87f4335d1269ed18b3f0188853d45d7f0912c9a205d1fc1 languageName: node linkType: hard @@ -36273,7 +36464,7 @@ resolve@^2.0.0-next.3: languageName: node linkType: hard -"tmp@npm:0.0.33, tmp@npm:0.0.x, tmp@npm:^0.0.33": +"tmp@npm:0.0.33, tmp@npm:^0.0.33": version: 0.0.33 resolution: "tmp@npm:0.0.33" dependencies: @@ -36424,6 +36615,13 @@ resolve@^2.0.0-next.3: languageName: node linkType: hard +"toidentifier@npm:1.0.1": + version: 1.0.1 + resolution: "toidentifier@npm:1.0.1" + checksum: 952c29e2a85d7123239b5cfdd889a0dde47ab0497f0913d70588f19c53f7e0b5327c95f4651e413c74b785147f9637b17410ac8c846d5d4a20a5a33eb6dc3a45 + languageName: node + linkType: hard + "toml@npm:^2.3.2": version: 2.3.6 resolution: "toml@npm:2.3.6" @@ -36897,6 +37095,13 @@ resolve@^2.0.0-next.3: languageName: node linkType: hard +"ua-parser-js@npm:^0.7.30": + version: 0.7.31 + resolution: "ua-parser-js@npm:0.7.31" + checksum: e2f8324a83d1715601576af85b2b6c03890699aaa7272950fc77ea925c70c5e4f75060ae147dc92124e49f7f0e3d6dd2b0a91e7f40d267e92df8894be967ba8b + languageName: node + linkType: hard + "uc.micro@npm:^1.0.1, uc.micro@npm:^1.0.5": version: 1.0.6 resolution: "uc.micro@npm:1.0.6" @@ -37662,16 +37867,6 @@ resolve@^2.0.0-next.3: languageName: node linkType: hard -"useragent@npm:2.3.0": - version: 2.3.0 - resolution: "useragent@npm:2.3.0" - dependencies: - lru-cache: 4.1.x - tmp: 0.0.x - checksum: 966e418122ca87cf54266360f4cb13b61dea36a8dcc7a34bad0eb447ab7b3b3fbbeda64135eb5bfb015e0d97924364bd2196b819f485cfe883a0dd57064573c4 - languageName: node - linkType: hard - "util-deprecate@npm:^1.0.1, util-deprecate@npm:^1.0.2, util-deprecate@npm:~1.0.1": version: 1.0.2 resolution: "util-deprecate@npm:1.0.2" @@ -37850,7 +38045,7 @@ resolve@^2.0.0-next.3: languageName: node linkType: hard -"vary@npm:~1.1.2": +"vary@npm:^1, vary@npm:~1.1.2": version: 1.1.2 resolution: "vary@npm:1.1.2" checksum: ae0123222c6df65b437669d63dfa8c36cee20a504101b2fcd97b8bf76f91259c17f9f2b4d70a1e3c6bbcee7f51b28392833adb6b2770b23b01abec84e369660b @@ -38822,13 +39017,6 @@ resolve@^2.0.0-next.3: languageName: node linkType: hard -"wordwrap@npm:~0.0.2": - version: 0.0.3 - resolution: "wordwrap@npm:0.0.3" - checksum: dfc2d3512e857ae4b3bc2e8d4e5d2c285c28a4b87cd1d81c977ce9a1a99152d355807e046851a3d61148f39d877fbb889352e07b65a9cbdd2256aa928e159026 - languageName: node - linkType: hard - "workbox-background-sync@npm:6.4.2": version: 6.4.2 resolution: "workbox-background-sync@npm:6.4.2" @@ -39275,11 +39463,26 @@ resolve@^2.0.0-next.3: languageName: node linkType: hard +"ws@npm:~8.2.3": + version: 8.2.3 + resolution: "ws@npm:8.2.3" + peerDependencies: + bufferutil: ^4.0.1 + utf-8-validate: ^5.0.2 + peerDependenciesMeta: + bufferutil: + optional: true + utf-8-validate: + optional: true + checksum: c869296ccb45f218ac6d32f8f614cd85b50a21fd434caf11646008eef92173be53490810c5c23aea31bc527902261fbfd7b062197eea341b26128d4be56a85e4 + languageName: node + linkType: hard + "www@workspace:www": version: 0.0.0-use.local resolution: "www@workspace:www" dependencies: - "@carbon/react": ^0.14.0 + "@carbon/react": ^0.15.0-rc.0 "@octokit/core": ^3.5.1 "@octokit/plugin-retry": ^3.0.9 "@octokit/plugin-throttling": ^3.5.2 @@ -39480,13 +39683,6 @@ resolve@^2.0.0-next.3: languageName: node linkType: hard -"yamlparser@npm:0.0.x": - version: 0.0.2 - resolution: "yamlparser@npm:0.0.2" - checksum: 9f09b0af2bc24f22153250b0eac88b491d59c38449fbfec665d13e746941e3a089f47c592a9ca8d9f0aab8b7014fe813642f955de93d23a179f05fe1e29e6f3e - languageName: node - linkType: hard - "yargs-parser@npm:5.0.0-security.0": version: 5.0.0-security.0 resolution: "yargs-parser@npm:5.0.0-security.0"