diff --git a/.yarn/cache/@next-swc-linux-arm64-gnu-npm-12.1.4-5ce5b29d4d-8.zip b/.yarn/cache/@next-swc-linux-arm64-gnu-npm-12.1.4-5ce5b29d4d-8.zip deleted file mode 100644 index b29a136eee29..000000000000 Binary files a/.yarn/cache/@next-swc-linux-arm64-gnu-npm-12.1.4-5ce5b29d4d-8.zip and /dev/null differ diff --git a/.yarn/cache/@rollup-plugin-typescript-npm-8.5.0-1107006ede-2f100a73cd.zip b/.yarn/cache/@rollup-plugin-typescript-npm-8.5.0-1107006ede-2f100a73cd.zip new file mode 100644 index 000000000000..1aa571f90063 Binary files /dev/null and b/.yarn/cache/@rollup-plugin-typescript-npm-8.5.0-1107006ede-2f100a73cd.zip differ diff --git a/.yarn/cache/@types-prop-types-npm-15.7.3-084e0015c6-41831d53c4.zip b/.yarn/cache/@types-prop-types-npm-15.7.3-084e0015c6-41831d53c4.zip deleted file mode 100644 index 8eea74bc0da2..000000000000 Binary files a/.yarn/cache/@types-prop-types-npm-15.7.3-084e0015c6-41831d53c4.zip and /dev/null differ diff --git a/.yarn/cache/@types-prop-types-npm-15.7.4-592896a9fe-ef6e1899e5.zip b/.yarn/cache/@types-prop-types-npm-15.7.4-592896a9fe-ef6e1899e5.zip new file mode 100644 index 000000000000..482f0927eec8 Binary files /dev/null and b/.yarn/cache/@types-prop-types-npm-15.7.4-592896a9fe-ef6e1899e5.zip differ diff --git a/.yarn/cache/@types-react-npm-17.0.50-14eafba020-b5629dff7c.zip b/.yarn/cache/@types-react-npm-17.0.50-14eafba020-b5629dff7c.zip new file mode 100644 index 000000000000..1014a2766808 Binary files /dev/null and b/.yarn/cache/@types-react-npm-17.0.50-14eafba020-b5629dff7c.zip differ diff --git a/.yarn/cache/@types-react-npm-18.0.6-dfd79650e5-368b40176f.zip b/.yarn/cache/@types-react-npm-18.0.6-dfd79650e5-368b40176f.zip deleted file mode 100644 index 54b4b9899a85..000000000000 Binary files a/.yarn/cache/@types-react-npm-18.0.6-dfd79650e5-368b40176f.zip and /dev/null differ diff --git a/.yarn/cache/@typescript-eslint-eslint-plugin-npm-5.18.0-113aeb2d78-e8f0e7cfa0.zip b/.yarn/cache/@typescript-eslint-eslint-plugin-npm-5.18.0-113aeb2d78-e8f0e7cfa0.zip deleted file mode 100644 index 98af403caa30..000000000000 Binary files a/.yarn/cache/@typescript-eslint-eslint-plugin-npm-5.18.0-113aeb2d78-e8f0e7cfa0.zip and /dev/null differ diff --git a/.yarn/cache/@typescript-eslint-eslint-plugin-npm-5.38.1-a0d314dce5-a889558802.zip b/.yarn/cache/@typescript-eslint-eslint-plugin-npm-5.38.1-a0d314dce5-a889558802.zip new file mode 100644 index 000000000000..e8ffa8b0cc66 Binary files /dev/null and b/.yarn/cache/@typescript-eslint-eslint-plugin-npm-5.38.1-a0d314dce5-a889558802.zip differ diff --git a/.yarn/cache/@typescript-eslint-parser-npm-5.18.0-bcccf7640a-8e007a4980.zip b/.yarn/cache/@typescript-eslint-parser-npm-5.18.0-bcccf7640a-8e007a4980.zip deleted file mode 100644 index 31567f181fcb..000000000000 Binary files a/.yarn/cache/@typescript-eslint-parser-npm-5.18.0-bcccf7640a-8e007a4980.zip and /dev/null differ diff --git a/.yarn/cache/@typescript-eslint-parser-npm-5.38.1-e2beb34fbe-3f84b33d59.zip b/.yarn/cache/@typescript-eslint-parser-npm-5.38.1-e2beb34fbe-3f84b33d59.zip new file mode 100644 index 000000000000..a4c299cc8633 Binary files /dev/null and b/.yarn/cache/@typescript-eslint-parser-npm-5.38.1-e2beb34fbe-3f84b33d59.zip differ diff --git a/.yarn/cache/@typescript-eslint-scope-manager-npm-5.38.1-24ac315081-c3b38ca007.zip b/.yarn/cache/@typescript-eslint-scope-manager-npm-5.38.1-24ac315081-c3b38ca007.zip new file mode 100644 index 000000000000..e1e67364a4bd Binary files /dev/null and b/.yarn/cache/@typescript-eslint-scope-manager-npm-5.38.1-24ac315081-c3b38ca007.zip differ diff --git a/.yarn/cache/@typescript-eslint-type-utils-npm-5.18.0-6faa08ca9b-a9722e1863.zip b/.yarn/cache/@typescript-eslint-type-utils-npm-5.38.1-c212f64f32-1e5fbb5cd2.zip similarity index 52% rename from .yarn/cache/@typescript-eslint-type-utils-npm-5.18.0-6faa08ca9b-a9722e1863.zip rename to .yarn/cache/@typescript-eslint-type-utils-npm-5.38.1-c212f64f32-1e5fbb5cd2.zip index efd7cc538529..a9a70c534f68 100644 Binary files a/.yarn/cache/@typescript-eslint-type-utils-npm-5.18.0-6faa08ca9b-a9722e1863.zip and b/.yarn/cache/@typescript-eslint-type-utils-npm-5.38.1-c212f64f32-1e5fbb5cd2.zip differ diff --git a/.yarn/cache/@typescript-eslint-types-npm-5.38.1-25ef03dead-384f7fe9a1.zip b/.yarn/cache/@typescript-eslint-types-npm-5.38.1-25ef03dead-384f7fe9a1.zip new file mode 100644 index 000000000000..07a0aa9b8fa7 Binary files /dev/null and b/.yarn/cache/@typescript-eslint-types-npm-5.38.1-25ef03dead-384f7fe9a1.zip differ diff --git a/.yarn/cache/@typescript-eslint-typescript-estree-npm-5.38.1-139af46521-ec73496f73.zip b/.yarn/cache/@typescript-eslint-typescript-estree-npm-5.38.1-139af46521-ec73496f73.zip new file mode 100644 index 000000000000..4e2d6444d096 Binary files /dev/null and b/.yarn/cache/@typescript-eslint-typescript-estree-npm-5.38.1-139af46521-ec73496f73.zip differ diff --git a/.yarn/cache/@typescript-eslint-utils-npm-5.38.1-f0191b30c9-06646ddeb6.zip b/.yarn/cache/@typescript-eslint-utils-npm-5.38.1-f0191b30c9-06646ddeb6.zip new file mode 100644 index 000000000000..569b4bef9ad1 Binary files /dev/null and b/.yarn/cache/@typescript-eslint-utils-npm-5.38.1-f0191b30c9-06646ddeb6.zip differ diff --git a/.yarn/cache/@typescript-eslint-visitor-keys-npm-5.38.1-94aa1a9778-01c83a4290.zip b/.yarn/cache/@typescript-eslint-visitor-keys-npm-5.38.1-94aa1a9778-01c83a4290.zip new file mode 100644 index 000000000000..c8e0dcac9604 Binary files /dev/null and b/.yarn/cache/@typescript-eslint-visitor-keys-npm-5.38.1-94aa1a9778-01c83a4290.zip differ diff --git a/.yarn/cache/esbuild-darwin-arm64-npm-0.14.38-b37de966bb-8.zip b/.yarn/cache/esbuild-darwin-arm64-npm-0.14.38-b37de966bb-8.zip deleted file mode 100644 index d991ac385800..000000000000 Binary files a/.yarn/cache/esbuild-darwin-arm64-npm-0.14.38-b37de966bb-8.zip and /dev/null differ diff --git a/.yarn/cache/esbuild-darwin-arm64-npm-0.15.3-3640e6bc55-8.zip b/.yarn/cache/esbuild-darwin-arm64-npm-0.15.3-3640e6bc55-8.zip deleted file mode 100644 index 86f29015e47d..000000000000 Binary files a/.yarn/cache/esbuild-darwin-arm64-npm-0.15.3-3640e6bc55-8.zip and /dev/null differ diff --git a/.yarn/cache/esbuild-linux-arm64-npm-0.14.38-cef31fba53-8.zip b/.yarn/cache/esbuild-linux-arm64-npm-0.14.38-cef31fba53-8.zip deleted file mode 100644 index 16e3d3396887..000000000000 Binary files a/.yarn/cache/esbuild-linux-arm64-npm-0.14.38-cef31fba53-8.zip and /dev/null differ diff --git a/.yarn/cache/esbuild-linux-arm64-npm-0.15.3-5ce6ddd928-8.zip b/.yarn/cache/esbuild-linux-arm64-npm-0.15.3-5ce6ddd928-8.zip deleted file mode 100644 index b7820748fab3..000000000000 Binary files a/.yarn/cache/esbuild-linux-arm64-npm-0.15.3-5ce6ddd928-8.zip and /dev/null differ diff --git a/.yarn/cache/esbuild-windows-arm64-npm-0.14.38-9693d16298-8.zip b/.yarn/cache/esbuild-windows-arm64-npm-0.14.38-9693d16298-8.zip deleted file mode 100644 index 9ad725f42e62..000000000000 Binary files a/.yarn/cache/esbuild-windows-arm64-npm-0.14.38-9693d16298-8.zip and /dev/null differ diff --git a/.yarn/cache/esbuild-windows-arm64-npm-0.15.3-6777f0a5aa-8.zip b/.yarn/cache/esbuild-windows-arm64-npm-0.15.3-6777f0a5aa-8.zip deleted file mode 100644 index 8bcc7deac358..000000000000 Binary files a/.yarn/cache/esbuild-windows-arm64-npm-0.15.3-6777f0a5aa-8.zip and /dev/null differ diff --git a/.yarn/cache/typescript-npm-4.7.2-82fa810e5c-5163585e6b.zip b/.yarn/cache/typescript-npm-4.7.2-82fa810e5c-5163585e6b.zip deleted file mode 100644 index 7dbcf0a5b0a8..000000000000 Binary files a/.yarn/cache/typescript-npm-4.7.2-82fa810e5c-5163585e6b.zip and /dev/null differ diff --git a/.yarn/cache/@next-swc-darwin-arm64-npm-12.1.4-8bc9a59090-8.zip b/.yarn/cache/typescript-npm-4.8.4-9c0a335511-3e4f061658.zip similarity index 54% rename from .yarn/cache/@next-swc-darwin-arm64-npm-12.1.4-8bc9a59090-8.zip rename to .yarn/cache/typescript-npm-4.8.4-9c0a335511-3e4f061658.zip index 87eb23228206..ffe3d5cfbf8e 100644 Binary files a/.yarn/cache/@next-swc-darwin-arm64-npm-12.1.4-8bc9a59090-8.zip and b/.yarn/cache/typescript-npm-4.8.4-9c0a335511-3e4f061658.zip differ diff --git a/.yarn/cache/typescript-patch-3de8d08a53-7e2b9a9f4a.zip b/.yarn/cache/typescript-patch-3de8d08a53-7e2b9a9f4a.zip deleted file mode 100644 index 851b1d55558e..000000000000 Binary files a/.yarn/cache/typescript-patch-3de8d08a53-7e2b9a9f4a.zip and /dev/null differ diff --git a/.yarn/cache/@next-swc-win32-arm64-msvc-npm-12.1.4-b5b707823d-8.zip b/.yarn/cache/typescript-patch-80bfdb5552-301459fc3e.zip similarity index 53% rename from .yarn/cache/@next-swc-win32-arm64-msvc-npm-12.1.4-b5b707823d-8.zip rename to .yarn/cache/typescript-patch-80bfdb5552-301459fc3e.zip index 90394d00bc2d..e060c9388625 100644 Binary files a/.yarn/cache/@next-swc-win32-arm64-msvc-npm-12.1.4-b5b707823d-8.zip and b/.yarn/cache/typescript-patch-80bfdb5552-301459fc3e.zip differ diff --git a/config/eslint-config-carbon/package.json b/config/eslint-config-carbon/package.json index a066a7fb441c..0d25d634b0d8 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.17.0", + "version": "2.18.0-rc.0", "license": "Apache-2.0", "main": "index.js", "repository": { diff --git a/config/eslint-config-carbon/plugins/react.js b/config/eslint-config-carbon/plugins/react.js index e3f8ccba5fb2..71ab2fc0e531 100644 --- a/config/eslint-config-carbon/plugins/react.js +++ b/config/eslint-config-carbon/plugins/react.js @@ -44,6 +44,25 @@ module.exports = { ], }, overrides: [ + { + files: ['*.ts', '*.tsx'], + plugins: ['@typescript-eslint'], + extends: ['plugin:@typescript-eslint/recommended'], + parser: '@typescript-eslint/parser', + rules: { + 'no-unused-vars': 'off', // Disabled in favor of @typescript-eslint/no-unused-vars + '@typescript-eslint/no-unused-vars': [ + 'error', + { + args: 'after-used', + argsIgnorePattern: '^_', + varsIgnorePattern: '^_', + }, + ], + '@typescript-eslint/no-empty-function': 'off', // Disabled to support default empty functions used in PropTypes + '@typescript-eslint/no-explicit-any': 'off', // TODO: Enable once stricter typings of internal utilities are supported + }, + }, // Sometimes we'll want to define a quick component in a story to use as a // wrapper for a component we're documenting. For example: // diff --git a/config/jest-config-carbon/index.js b/config/jest-config-carbon/index.js index 4fd131762415..4e69cf06f0ba 100644 --- a/config/jest-config-carbon/index.js +++ b/config/jest-config-carbon/index.js @@ -8,7 +8,7 @@ 'use strict'; module.exports = { - moduleFileExtensions: ['js', 'json', 'node'], + moduleFileExtensions: ['tsx', 'ts', 'js', 'json', 'node'], moduleNameMapper: { // This mapping is the result of updating to Jest 28. We currently require // this as the version of uuid that gets resolved is ESM but we would like @@ -27,9 +27,11 @@ module.exports = { '/**/*-(spec|test).js?(x)', ], transform: { - '^.+\\.(mjs|cjs|js|jsx)$': require.resolve('./transform/jsTransform.js'), + '^.+\\.(mjs|cjs|js|jsx|ts|tsx)$': require.resolve( + './transform/jsTransform.js' + ), '^.+\\.s?css$': require.resolve('./transform/cssTransform.js'), - '^(?!.*\\.(js|jsx|css|json)$)': require.resolve( + '^(?!.*\\.(js|jsx|ts|tsx|css|json)$)': require.resolve( './transform/fileTransform.js' ), }, diff --git a/config/jest-config-carbon/package.json b/config/jest-config-carbon/package.json index 06bdc5ba529f..c64b20d37c35 100644 --- a/config/jest-config-carbon/package.json +++ b/config/jest-config-carbon/package.json @@ -2,7 +2,7 @@ "name": "jest-config-carbon", "private": true, "description": "Jest configuration and preset for Carbon", - "version": "1.4.0", + "version": "1.5.0-rc.0", "license": "Apache-2.0", "main": "index.js", "repository": { diff --git a/config/jest-config-carbon/transform/jsTransform.js b/config/jest-config-carbon/transform/jsTransform.js index 4bc1afc12c25..c4664005fae1 100644 --- a/config/jest-config-carbon/transform/jsTransform.js +++ b/config/jest-config-carbon/transform/jsTransform.js @@ -21,6 +21,7 @@ const babelOptions = { }, ], '@babel/preset-react', + '@babel/preset-typescript', ], plugins: [ '@babel/plugin-proposal-class-properties', diff --git a/e2e/components/ComposedModal/ComposedModal-test.e2e.js b/e2e/components/ComposedModal/ComposedModal-test.e2e.js index 15c1742ba44f..62d9a0d7b05d 100644 --- a/e2e/components/ComposedModal/ComposedModal-test.e2e.js +++ b/e2e/components/ComposedModal/ComposedModal-test.e2e.js @@ -37,6 +37,13 @@ test.describe('ComposedModal', () => { theme, }); }); + test('full width modal @vrt', async ({ page }) => { + await snapshotStory(page, { + component: 'ComposedModal', + id: 'components-composedmodal--full-width', + theme, + }); + }); }); }); diff --git a/e2e/components/ContainedList/ContainedList-test.e2e.js b/e2e/components/ContainedList/ContainedList-test.e2e.js new file mode 100644 index 000000000000..2b34f1adee23 --- /dev/null +++ b/e2e/components/ContainedList/ContainedList-test.e2e.js @@ -0,0 +1,101 @@ +/** + * Copyright IBM Corp. 2016, 2018 + * + * 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 strict'; + +const { expect, test } = require('@playwright/test'); +const { themes } = require('../../test-utils/env'); +const { snapshotStory, visitStory } = require('../../test-utils/storybook'); + +test.describe('ContainedList', () => { + themes.forEach((theme) => { + test.describe(theme, () => { + test('default @vrt', async ({ page }) => { + await snapshotStory(page, { + component: 'ContainedList', + id: 'components-containedlist--default', + theme, + }); + }); + + test('disclosed @vrt', async ({ page }) => { + await snapshotStory(page, { + component: 'ContainedList', + id: 'components-containedlist--disclosed', + theme, + }); + }); + + test('with-actions @vrt', async ({ page }) => { + await snapshotStory(page, { + component: 'ContainedList', + id: 'components-containedlist--with-actions', + theme, + }); + }); + + test('with-icons @vrt', async ({ page }) => { + await snapshotStory(page, { + component: 'ContainedList', + id: 'components-containedlist--with-icons', + theme, + }); + }); + + test('with-interactive-items @vrt', async ({ page }) => { + await snapshotStory(page, { + component: 'ContainedList', + id: 'components-containedlist--with-interactive-items', + theme, + }); + }); + + test('with-interactive-items-and-actions @vrt', async ({ page }) => { + await snapshotStory(page, { + component: 'ContainedList', + id: 'components-containedlist--with-interactive-items-and-actions', + theme, + }); + }); + + test('with-layer @vrt', async ({ page }) => { + await snapshotStory(page, { + component: 'ContainedList', + id: 'components-containedlist--with-layer', + theme, + }); + }); + + test('with-list-title-decorators @vrt', async ({ page }) => { + await snapshotStory(page, { + component: 'ContainedList', + id: 'components-containedlist--with-list-title-decorators', + theme, + }); + }); + + test('playground @vrt', async ({ page }) => { + await snapshotStory(page, { + component: 'ContainedList', + id: 'components-containedlist--playground', + theme, + }); + }); + }); + }); + + test('accessibility-checker @avt', async ({ page }) => { + await visitStory(page, { + component: 'ContainedList', + id: 'components-containedlist--default', + globals: { + theme: 'white', + }, + }); + await expect(page).toHaveNoACViolations('ContainedList'); + }); +}); diff --git a/e2e/components/Modal/Modal-test.e2e.js b/e2e/components/Modal/Modal-test.e2e.js index 902c829147aa..a43b6c1ac21d 100644 --- a/e2e/components/Modal/Modal-test.e2e.js +++ b/e2e/components/Modal/Modal-test.e2e.js @@ -29,6 +29,14 @@ test.describe('Modal', () => { theme, }); }); + + test('full width modal @vrt', async ({ page }) => { + await snapshotStory(page, { + component: 'Modal', + id: 'components-modal--full-width', + theme, + }); + }); }); }); diff --git a/examples/codesandbox-styles/package.json b/examples/codesandbox-styles/package.json index 5248802762ca..5874dd497917 100644 --- a/examples/codesandbox-styles/package.json +++ b/examples/codesandbox-styles/package.json @@ -1,7 +1,7 @@ { "name": "codesandbox-styles", "private": true, - "version": "0.19.0", + "version": "0.20.0-rc.1", "scripts": { "develop": "vite" }, @@ -9,7 +9,7 @@ "vite": "^2.8.0" }, "dependencies": { - "@carbon/styles": "^1.16.0", + "@carbon/styles": "^1.17.0-rc.1", "sass": "^1.51.0" } } diff --git a/examples/codesandbox-with-sass-compilation/package.json b/examples/codesandbox-with-sass-compilation/package.json index 7803dd37c0ef..b3ad27d6bfa7 100644 --- a/examples/codesandbox-with-sass-compilation/package.json +++ b/examples/codesandbox-with-sass-compilation/package.json @@ -1,9 +1,9 @@ { "name": "codesandbox-with-sass-compilation", - "version": "0.17.0", + "version": "0.18.0-rc.1", "private": true, "dependencies": { - "@carbon/react": "^1.16.0", + "@carbon/react": "^1.17.0-rc.1", "react": "^17.0.0", "react-dom": "^17.0.0" }, diff --git a/examples/codesandbox/package.json b/examples/codesandbox/package.json index 991301817dbf..507f322f9d44 100644 --- a/examples/codesandbox/package.json +++ b/examples/codesandbox/package.json @@ -1,9 +1,9 @@ { "name": "codesandbox", - "version": "0.17.0", + "version": "0.18.0-rc.1", "private": true, "dependencies": { - "@carbon/react": "^1.16.0", + "@carbon/react": "^1.17.0-rc.1", "react": "^17.0.0", "react-dom": "^17.0.0" }, diff --git a/examples/custom-theme/package.json b/examples/custom-theme/package.json index 0a68c433dae7..a61a1db719a8 100644 --- a/examples/custom-theme/package.json +++ b/examples/custom-theme/package.json @@ -1,14 +1,14 @@ { "name": "custom-theme", "private": true, - "version": "0.14.0", + "version": "0.15.0-rc.1", "scripts": { "dev": "vite", "build": "vite build", "preview": "vite preview" }, "dependencies": { - "@carbon/react": "^1.16.0", + "@carbon/react": "^1.17.0-rc.1", "react": "^17.0.0", "react-dom": "^17.0.0" }, diff --git a/examples/incremental-migration/package.json b/examples/incremental-migration/package.json index 44388725d850..ed67f67e2a59 100644 --- a/examples/incremental-migration/package.json +++ b/examples/incremental-migration/package.json @@ -1,7 +1,7 @@ { "name": "incremental-migration", "private": true, - "version": "0.16.0", + "version": "0.17.0-rc.1", "scripts": { "build": "next build", "dev": "next dev", @@ -13,7 +13,7 @@ }, "dependencies": { "@carbon/icons-react": "^10.49.0", - "@carbon/react": "^1.16.0", + "@carbon/react": "^1.17.0-rc.1", "carbon-components": "^10.57.0", "carbon-components-react": "^7.57.0", "carbon-icons": "^7.0.7", diff --git a/examples/light-dark-mode/package.json b/examples/light-dark-mode/package.json index 44b49dabe398..00efffa95cc4 100644 --- a/examples/light-dark-mode/package.json +++ b/examples/light-dark-mode/package.json @@ -1,7 +1,7 @@ { "name": "examples-light-dark", "private": true, - "version": "0.14.0", + "version": "0.15.0-rc.1", "scripts": { "build": "next build", "dev": "next dev", @@ -9,7 +9,7 @@ "start": "next start" }, "dependencies": { - "@carbon/react": "^1.16.0", + "@carbon/react": "^1.17.0-rc.1", "next": "12.1.4", "react": "18.0.0", "react-dom": "18.0.0" diff --git a/examples/nextjs/package.json b/examples/nextjs/package.json index e426d20afc92..53f3f0739a20 100644 --- a/examples/nextjs/package.json +++ b/examples/nextjs/package.json @@ -1,7 +1,7 @@ { "name": "examples-nextjs", "private": true, - "version": "0.16.0", + "version": "0.17.0-rc.1", "scripts": { "build": "next build", "dev": "next dev", @@ -9,7 +9,7 @@ "start": "next start" }, "dependencies": { - "@carbon/react": "^1.16.0", + "@carbon/react": "^1.17.0-rc.1", "next": "12.1.4", "react": "18.0.0", "react-dom": "18.0.0" diff --git a/examples/vite/package.json b/examples/vite/package.json index 067401ac093b..55fd1ef5ef5f 100644 --- a/examples/vite/package.json +++ b/examples/vite/package.json @@ -1,14 +1,14 @@ { "name": "vite", "private": true, - "version": "0.14.0", + "version": "0.15.0-rc.1", "scripts": { "dev": "vite", "build": "vite build", "preview": "vite preview" }, "dependencies": { - "@carbon/react": "^1.16.0", + "@carbon/react": "^1.17.0-rc.1", "react": "^17.0.0", "react-dom": "^17.0.0" }, diff --git a/package.json b/package.json index cc7d1bfeb6a8..0a13e7bf479b 100644 --- a/package.json +++ b/package.json @@ -29,6 +29,8 @@ "postinstall": "husky install" }, "resolutions": { + "@types/react": "~17.0.2", + "@types/prop-types": "15.7.4", "ast-types": "^0.14.0", "node-sass": "^6.0.0", "react": "~17.0.2", diff --git a/packages/carbon-components-react/package.json b/packages/carbon-components-react/package.json index 057adabd9fe9..d00113a6dcd6 100644 --- a/packages/carbon-components-react/package.json +++ b/packages/carbon-components-react/package.json @@ -1,7 +1,7 @@ { "name": "carbon-components-react", "description": "The Carbon Design System is IBM’s open-source design system for products and experiences.", - "version": "8.16.0", + "version": "8.17.0-rc.1", "license": "Apache-2.0", "main": "lib/index.js", "module": "es/index.js", @@ -39,8 +39,8 @@ "sass": "^1.33.0" }, "dependencies": { - "@carbon/react": "^1.16.0", - "@carbon/styles": "^1.16.0", + "@carbon/react": "^1.17.0-rc.1", + "@carbon/styles": "^1.17.0-rc.1", "@carbon/telemetry": "0.1.0" }, "devDependencies": { diff --git a/packages/carbon-components/package.json b/packages/carbon-components/package.json index b620d1b06b00..72ff93c7330f 100644 --- a/packages/carbon-components/package.json +++ b/packages/carbon-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": "11.16.0", + "version": "11.17.0-rc.1", "license": "Apache-2.0", "repository": { "type": "git", @@ -40,7 +40,7 @@ "sass": "^1.33.0" }, "dependencies": { - "@carbon/styles": "^1.16.0", + "@carbon/styles": "^1.17.0-rc.1", "@carbon/telemetry": "0.1.0" }, "devDependencies": { diff --git a/packages/colors/package.json b/packages/colors/package.json index 74437da2cf76..6d3c0ede9f24 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": "11.7.0", + "version": "11.7.1-rc.0", "license": "Apache-2.0", "main": "lib/index.js", "module": "es/index.js", diff --git a/packages/colors/tasks/build.js b/packages/colors/tasks/build.js index 450a76439b20..2c0b3b87ccf5 100644 --- a/packages/colors/tasks/build.js +++ b/packages/colors/tasks/build.js @@ -117,7 +117,6 @@ async function build() { properties: Object.keys(colors).map((key) => { const swatch = paramCase(key); return t.SassMapProperty({ - quoted: true, key: t.Identifier(swatch), value: t.SassMap({ properties: Object.keys(colors[key]).map((grade) => { diff --git a/packages/elements/package.json b/packages/elements/package.json index 57e18a97f561..0e72cb9e766f 100644 --- a/packages/elements/package.json +++ b/packages/elements/package.json @@ -1,7 +1,7 @@ { "name": "@carbon/elements", "description": "A collection of design elements in code for the IBM Design Language", - "version": "11.13.0", + "version": "11.13.1-rc.0", "license": "Apache-2.0", "main": "lib/index.js", "module": "es/index.js", @@ -35,12 +35,12 @@ "clean": "rimraf es lib umd" }, "dependencies": { - "@carbon/colors": "^11.7.0", + "@carbon/colors": "^11.7.1-rc.0", "@carbon/grid": "^11.7.0", "@carbon/icons": "^11.10.0", "@carbon/layout": "^11.7.0", "@carbon/motion": "^11.5.0", - "@carbon/themes": "^11.11.0", + "@carbon/themes": "^11.11.1-rc.0", "@carbon/type": "^11.11.0" }, "devDependencies": { diff --git a/packages/react/.gitignore b/packages/react/.gitignore index 61673ca51308..2070de4c6ecd 100644 --- a/packages/react/.gitignore +++ b/packages/react/.gitignore @@ -6,4 +6,7 @@ react-docgen.json # Cypress artifacts cypress/videos -cypress/screenshots \ No newline at end of file +cypress/screenshots + +# Typescript +tsconfig.tsbuildinfo \ No newline at end of file diff --git a/packages/react/.storybook/.babelrc.js b/packages/react/.storybook/.babelrc.js index 70c43b3a13a2..7f4406c80147 100644 --- a/packages/react/.storybook/.babelrc.js +++ b/packages/react/.storybook/.babelrc.js @@ -8,5 +8,5 @@ 'use strict'; module.exports = { - presets: ['babel-preset-carbon'], + presets: ['babel-preset-carbon', '@babel/preset-typescript'], }; diff --git a/packages/react/.storybook/main.js b/packages/react/.storybook/main.js index 60d9945950f2..e3f5ee55e094 100644 --- a/packages/react/.storybook/main.js +++ b/packages/react/.storybook/main.js @@ -92,6 +92,9 @@ module.exports = { }, framework: '@storybook/react', stories, + typescript: { + reactDocgen: 'react-docgen', // Favor docgen from prop-types instead of TS interfaces + }, webpack(config) { const babelLoader = config.module.rules.find((rule) => { return rule.use.some(({ loader }) => { diff --git a/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap b/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap index 1858710f5454..f47914bc8d5c 100644 --- a/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap +++ b/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap @@ -1254,6 +1254,9 @@ Map { "danger": Object { "type": "bool", }, + "isFullWidth": Object { + "type": "bool", + }, "onClose": Object { "type": "func", }, @@ -1291,6 +1294,106 @@ Map { }, "render": [Function], }, + "ContainedList" => Object { + "ContainedListItem": Object { + "propTypes": Object { + "action": Object { + "type": "node", + }, + "children": Object { + "type": "node", + }, + "className": Object { + "type": "string", + }, + "disabled": Object { + "type": "bool", + }, + "onClick": Object { + "type": "func", + }, + "renderIcon": Object { + "args": Array [ + Array [ + Object { + "type": "func", + }, + Object { + "type": "object", + }, + ], + ], + "type": "oneOfType", + }, + }, + }, + "propTypes": Object { + "action": Object { + "type": "node", + }, + "children": Object { + "type": "node", + }, + "className": Object { + "type": "string", + }, + "kind": Object { + "args": Array [ + Array [ + "on-page", + "disclosed", + ], + ], + "type": "oneOf", + }, + "label": Object { + "args": Array [ + Array [ + Object { + "type": "string", + }, + Object { + "type": "node", + }, + ], + ], + "isRequired": true, + "type": "oneOfType", + }, + }, + }, + "ContainedListItem" => Object { + "propTypes": Object { + "action": Object { + "type": "node", + }, + "children": Object { + "type": "node", + }, + "className": Object { + "type": "string", + }, + "disabled": Object { + "type": "bool", + }, + "onClick": Object { + "type": "func", + }, + "renderIcon": Object { + "args": Array [ + Array [ + Object { + "type": "func", + }, + Object { + "type": "object", + }, + ], + ], + "type": "oneOfType", + }, + }, + }, "Content" => Object { "defaultProps": Object { "tagName": "main", @@ -4060,6 +4163,9 @@ Map { "id": Object { "type": "string", }, + "isFullWidth": Object { + "type": "bool", + }, "modalAriaLabel": Object { "type": "string", }, @@ -8702,106 +8808,6 @@ Map { "$$typeof": Symbol(react.forward_ref), "render": [Function], }, - "unstable_ContainedList" => Object { - "ContainedListItem": Object { - "propTypes": Object { - "action": Object { - "type": "node", - }, - "children": Object { - "type": "node", - }, - "className": Object { - "type": "string", - }, - "disabled": Object { - "type": "bool", - }, - "onClick": Object { - "type": "func", - }, - "renderIcon": Object { - "args": Array [ - Array [ - Object { - "type": "func", - }, - Object { - "type": "object", - }, - ], - ], - "type": "oneOfType", - }, - }, - }, - "propTypes": Object { - "action": Object { - "type": "node", - }, - "children": Object { - "type": "node", - }, - "className": Object { - "type": "string", - }, - "kind": Object { - "args": Array [ - Array [ - "on-page", - "disclosed", - ], - ], - "type": "oneOf", - }, - "label": Object { - "args": Array [ - Array [ - Object { - "type": "string", - }, - Object { - "type": "node", - }, - ], - ], - "isRequired": true, - "type": "oneOfType", - }, - }, - }, - "unstable_ContainedListItem" => Object { - "propTypes": Object { - "action": Object { - "type": "node", - }, - "children": Object { - "type": "node", - }, - "className": Object { - "type": "string", - }, - "disabled": Object { - "type": "bool", - }, - "onClick": Object { - "type": "func", - }, - "renderIcon": Object { - "args": Array [ - Array [ - Object { - "type": "func", - }, - Object { - "type": "object", - }, - ], - ], - "type": "oneOfType", - }, - }, - }, "unstable_FeatureFlags" => Object { "propTypes": Object { "children": Object { diff --git a/packages/react/carbon.yml b/packages/react/carbon.yml index c3b9db1c845c..84a04c0b47d3 100644 --- a/packages/react/carbon.yml +++ b/packages/react/carbon.yml @@ -51,7 +51,7 @@ assets: action: link url: https://react.carbondesignsystem.com/?path=/docs/components-aspectratio docs: - overviewPath: './src/components/AspectRatio/docs/overview.mdx' + overviewPath: './src/components/AspectRatio/docs/overview.mdx' breadcrumb: status: stable externalDocsUrl: https://www.carbondesignsystem.com/components/breadcrumb/usage @@ -134,6 +134,20 @@ assets: - input-control docs: overviewPath: ./src/components/ComposedModal/docs/overview.mdx + contained-list: + status: stable + externalDocsUrl: https://www.carbondesignsystem.com/components/contained-list/usage + framework: react + demoLinks: + - type: storybook + name: Storybook + action: link + url: https://react.carbondesignsystem.com/?path=/docs/components-containedlist + docs: + usagePath: https://github.com/carbon-design-system/carbon-website/blob/main/src/pages/components/contained-list/usage.mdx + stylePath: https://github.com/carbon-design-system/carbon-website/blob/main/src/pages/components/contained-list/style.mdx + accessibilityPath: https://github.com/carbon-design-system/carbon-website/blob/main/src/pages/components/contained-list/accessibility.mdx + overviewPath: ./src/components/ContainedList/docs/overview.mdx content-switcher: status: stable externalDocsUrl: https://www.carbondesignsystem.com/components/content-switcher/usage @@ -818,7 +832,7 @@ assets: usagePath: https://github.com/carbon-design-system/carbon-website/blob/main/src/pages/components/toggle/usage.mdx stylePath: https://github.com/carbon-design-system/carbon-website/blob/main/src/pages/components/toggle/style.mdx accessibilityPath: https://github.com/carbon-design-system/carbon-website/blob/main/src/pages/components/toggle/accessibility.mdx - overviewPath: ./src/components/Toggle/docs/overview.mdx + overviewPath: ./src/components/Toggle/docs/overview.mdx toggletip: status: stable externalDocsUrl: https://www.carbondesignsystem.com/components/toggletip/usage diff --git a/packages/react/package.json b/packages/react/package.json index d95bf3f71cc2..977629c998c4 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -1,7 +1,7 @@ { "name": "@carbon/react", "description": "React components for the Carbon Design System", - "version": "1.16.0", + "version": "1.17.0-rc.1", "license": "Apache-2.0", "main": "lib/index.js", "module": "es/index.js", @@ -46,7 +46,7 @@ "@carbon/feature-flags": "^0.9.0", "@carbon/icons-react": "^11.10.0", "@carbon/layout": "^11.7.0", - "@carbon/styles": "^1.16.0", + "@carbon/styles": "^1.17.0-rc.1", "@carbon/telemetry": "0.1.0", "classnames": "2.3.2", "copy-to-clipboard": "^3.3.1", @@ -73,10 +73,11 @@ "@babel/preset-env": "^7.18.2", "@babel/preset-react": "^7.17.12", "@carbon/test-utils": "^10.26.0", - "@carbon/themes": "^11.11.0", + "@carbon/themes": "^11.11.1-rc.0", "@rollup/plugin-babel": "^5.3.0", "@rollup/plugin-commonjs": "^21.0.0", "@rollup/plugin-node-resolve": "^13.0.0", + "@rollup/plugin-typescript": "^8.5.0", "@storybook/addon-a11y": "^6.5.6", "@storybook/addon-actions": "^6.5.6", "@storybook/addon-docs": "^6.5.6", @@ -88,6 +89,8 @@ "@storybook/manager-webpack5": "^6.5.6", "@storybook/react": "^6.5.6", "@storybook/theming": "^6.5.6", + "@typescript-eslint/eslint-plugin": "^5.38.1", + "@typescript-eslint/parser": "^5.38.1", "autoprefixer": "^10.4.0", "babel-loader": "^8.2.3", "babel-plugin-dev-expression": "^0.2.3", @@ -117,6 +120,7 @@ "storybook-readme": "^5.0.9", "stream-browserify": "^3.0.0", "style-loader": "^3.3.1", + "typescript": "^4.8.4", "webpack": "^5.65.0", "webpack-dev-server": "^4.7.4" }, diff --git a/packages/react/src/__tests__/index-test.js b/packages/react/src/__tests__/index-test.js index 2f7ee31c0b63..10ef4678fb5f 100644 --- a/packages/react/src/__tests__/index-test.js +++ b/packages/react/src/__tests__/index-test.js @@ -36,6 +36,8 @@ describe('Carbon Components React', () => { "ColumnHang", "ComboBox", "ComposedModal", + "ContainedList", + "ContainedListItem", "Content", "ContentSwitcher", "ControlledPasswordInput", @@ -214,8 +216,6 @@ describe('Carbon Components React', () => { "TreeView", "UnorderedList", "VStack", - "unstable_ContainedList", - "unstable_ContainedListItem", "unstable_FeatureFlags", "unstable_LayoutDirection", "unstable_Menu", diff --git a/packages/react/src/components/Checkbox/Checkbox.Skeleton.js b/packages/react/src/components/Checkbox/Checkbox.Skeleton.tsx similarity index 86% rename from packages/react/src/components/Checkbox/Checkbox.Skeleton.js rename to packages/react/src/components/Checkbox/Checkbox.Skeleton.tsx index bbb3980950fe..61aafcb8b24a 100644 --- a/packages/react/src/components/Checkbox/Checkbox.Skeleton.js +++ b/packages/react/src/components/Checkbox/Checkbox.Skeleton.tsx @@ -6,11 +6,14 @@ */ import PropTypes from 'prop-types'; -import React from 'react'; +import React, { HTMLAttributes } from 'react'; import cx from 'classnames'; import { usePrefix } from '../../internal/usePrefix'; -const CheckboxSkeleton = ({ className, ...rest }) => { +const CheckboxSkeleton = ({ + className, + ...rest +}: HTMLAttributes) => { const prefix = usePrefix(); return (
- { - onChange(evt, { checked: evt.target.checked, id }); - }} - className={`${prefix}--checkbox`} - id={id} - ref={(el) => { - if (el) { - el.indeterminate = indeterminate; - } - if (typeof ref === 'function') { - ref(el); - } else if (Object(ref) === ref) { - ref.current = el; - } - }} - /> - -
- ); -}); - -Checkbox.propTypes = { - /** - * Specify whether the underlying input should be checked - */ - checked: PropTypes.bool, - - /** - * Specify an optional className to be applied to the