diff --git a/.github/workflows/process-pr-review-data.yml b/.github/workflows/process-pr-review-data.yml index cf55028705..9ea2098416 100644 --- a/.github/workflows/process-pr-review-data.yml +++ b/.github/workflows/process-pr-review-data.yml @@ -25,4 +25,5 @@ jobs: - uses: ./actions/add-review-labels with: APP_ID: ${{ secrets.APP_ID }} - APP_PRIVATE_KEY: ${{ secrets.APP_PRIVATE_KEY }} \ No newline at end of file + APP_PRIVATE_KEY: ${{ secrets.APP_PRIVATE_KEY }} + APP_INSTALLATION_ID: ${{ secrets.APP_INSTALLATION_ID }} diff --git a/.github/workflows/update.yml b/.github/workflows/update.yml index db16d1f873..43ffc41207 100644 --- a/.github/workflows/update.yml +++ b/.github/workflows/update.yml @@ -74,6 +74,13 @@ jobs: env: YARN_ENABLE_IMMUTABLE_INSTALLS: false + - name: Generate token + uses: tibdex/github-app-token@3beb63f4bd073e61482598c45c71c1019b59b73a #v2.1.0 + id: generate_token + with: + app_id: ${{ secrets.APP_ID }} + private_key: ${{ secrets.APP_PRIVATE_KEY }} + - name: Create PR id: create-pr uses: peter-evans/create-pull-request@5e914681df9dc83aa4e4905692ca88beb2f9e91f # v7.0.5 diff --git a/.stylelintrc.js b/.stylelintrc.js index edfe291b21..c1d8b114ef 100644 --- a/.stylelintrc.js +++ b/.stylelintrc.js @@ -1,5 +1,6 @@ module.exports = { extends: ['stylelint-config-carbon'], + plugins: ['stylelint-plugin-carbon-tokens'], rules: { 'max-nesting-depth': null, 'scss/no-global-function-names': null, @@ -7,5 +8,11 @@ module.exports = { 'scss/load-no-partial-leading-underscore': null, 'scss/double-slash-comment-inline': null, 'no-duplicate-selectors': null, + + 'carbon/layout-use': true, + 'carbon/motion-duration-use': [true, { severity: 'warning' }], + 'carbon/motion-easing-use': true, + 'carbon/theme-use': true, + 'carbon/type-use': true, }, }; diff --git a/.vscode/carbon-snippets.code-snippets b/.vscode/carbon-snippets.code-snippets index 522e179aa9..bb5994df83 100644 --- a/.vscode/carbon-snippets.code-snippets +++ b/.vscode/carbon-snippets.code-snippets @@ -28,7 +28,7 @@ "prefix": [ "//la" ], - "body": "// stylelint-disable-next-line carbon/layout-token-use" + "body": "// stylelint-disable-next-line carbon/layout-use" }, "Stylelint disable next line Carbon Duraion": { "scope": "scss", @@ -49,14 +49,14 @@ "prefix": [ "//ty" ], - "body": "// stylelint-disable-next-line carbon/type-token-use" + "body": "// stylelint-disable-next-line carbon/type-use" }, "Stylelint disable next line Carbon Theme": { "scope": "scss", "prefix": [ "//th" ], - "body": "// stylelint-disable-next-line carbon/theme-token-use" + "body": "// stylelint-disable-next-line carbon/theme-use" }, // spacing tokens "spacing-01 (0.125rem 2px)": { "scope": "scss", "prefix": ["$sp", "$car"], "body": "$$spacing-01", "description": "Carbon spacing token" }, diff --git a/actions/add-review-labels/action.yml b/actions/add-review-labels/action.yml index 16469f10c3..4ce07fc763 100644 --- a/actions/add-review-labels/action.yml +++ b/actions/add-review-labels/action.yml @@ -7,6 +7,9 @@ inputs: APP_PRIVATE_KEY: description: GitHub app private key required: true + APP_INSTALLATION_ID: + description: Carbon automation GitHub app installation id + required: true runs: using: 'docker' image: 'Dockerfile' diff --git a/actions/add-review-labels/index.js b/actions/add-review-labels/index.js index 15be05ad56..a9ef6c3942 100644 --- a/actions/add-review-labels/index.js +++ b/actions/add-review-labels/index.js @@ -21,8 +21,11 @@ async function run() { const privateKey = core.getInput('APP_PRIVATE_KEY', { required: true, }); + const installId = core.getInput('APP_INSTALLATION_ID', { + required: true, + }); const app = new App({ appId, privateKey }); - const octokit = await app.getInstallationOctokit(52238220); + const octokit = await app.getInstallationOctokit(installId); const { workflow_run, repository, organization } = context.payload; const workflowRunId = workflow_run.id; @@ -98,7 +101,7 @@ async function run() { // Get reviewer team data const { data } = await octokit.request('GET /orgs/{org}/teams/{team_slug}', { org: organization.login, - team_slug: 'reviewing-team', // Should be only hardcoded value (outside of the labels) needed within this action. Replace with the appropriate reviewing team that is assigned to review PRs. + team_slug: 'carbon-for-ibm-products-reviewers', // Should be only hardcoded value (outside of the labels) needed within this action. headers: { 'X-GitHub-Api-Version': '2022-11-28', }, diff --git a/config/jest-config-ibm-cloud-cognitive/CHANGELOG.md b/config/jest-config-ibm-cloud-cognitive/CHANGELOG.md index 989a417d12..a092695914 100644 --- a/config/jest-config-ibm-cloud-cognitive/CHANGELOG.md +++ b/config/jest-config-ibm-cloud-cognitive/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [1.14.0](https://github.com/carbon-design-system/ibm-products/compare/jest-config-ibm-cloud-cognitive@1.14.0-rc.0...jest-config-ibm-cloud-cognitive@1.14.0) (2024-12-04) + +**Note:** Version bump only for package jest-config-ibm-cloud-cognitive + + + + + # [1.14.0-rc.0](https://github.com/carbon-design-system/ibm-products/compare/jest-config-ibm-cloud-cognitive@1.13.0-rc.0...jest-config-ibm-cloud-cognitive@1.14.0-rc.0) (2024-11-25) **Note:** Version bump only for package jest-config-ibm-cloud-cognitive diff --git a/config/jest-config-ibm-cloud-cognitive/package.json b/config/jest-config-ibm-cloud-cognitive/package.json index d5ac8dd27e..b8b6f2dc21 100644 --- a/config/jest-config-ibm-cloud-cognitive/package.json +++ b/config/jest-config-ibm-cloud-cognitive/package.json @@ -1,7 +1,7 @@ { "name": "jest-config-ibm-cloud-cognitive", "private": true, - "version": "1.14.0-rc.0", + "version": "1.14.0", "license": "Apache-2.0", "main": "index.js", "repository": { @@ -36,7 +36,7 @@ "@babel/preset-env": "^7.18.2", "@babel/preset-react": "^7.17.12", "@testing-library/jest-dom": "^6.3.0", - "accessibility-checker": "^3.1.65", + "accessibility-checker": "^3.1.78", "axe-core": "^4.8.3", "babel-jest": "^29.7.0", "babel-preset-ibm-cloud-cognitive": "^0.14.40", diff --git a/config/storybook-addon-carbon-theme/CHANGELOG.md b/config/storybook-addon-carbon-theme/CHANGELOG.md index 7b35d48aa6..5420c578cb 100644 --- a/config/storybook-addon-carbon-theme/CHANGELOG.md +++ b/config/storybook-addon-carbon-theme/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.4.0](https://github.com/carbon-design-system/ibm-products/compare/@carbon/storybook-addon-theme@2.4.0-rc.0...@carbon/storybook-addon-theme@2.4.0) (2024-12-04) + +**Note:** Version bump only for package @carbon/storybook-addon-theme + + + + + # [2.4.0-rc.0](https://github.com/carbon-design-system/ibm-products/compare/@carbon/storybook-addon-theme@2.3.0-rc.0...@carbon/storybook-addon-theme@2.4.0-rc.0) (2024-11-25) **Note:** Version bump only for package @carbon/storybook-addon-theme diff --git a/config/storybook-addon-carbon-theme/package.json b/config/storybook-addon-carbon-theme/package.json index 4f825a4a1d..72b2b16c73 100644 --- a/config/storybook-addon-carbon-theme/package.json +++ b/config/storybook-addon-carbon-theme/package.json @@ -1,7 +1,7 @@ { "name": "@carbon/storybook-addon-theme", "description": "Carbon theme switcher for Storybook", - "version": "2.4.0-rc.0", + "version": "2.4.0", "license": "Apache-2.0", "main": "dist/react.js", "repository": { diff --git a/e2e/components/ExpressiveCard/ExpressiveCard-test.avt.e2e.js b/e2e/components/ExpressiveCard/ExpressiveCard-test.avt.e2e.js index 786603cae7..aa58fde2b7 100644 --- a/e2e/components/ExpressiveCard/ExpressiveCard-test.avt.e2e.js +++ b/e2e/components/ExpressiveCard/ExpressiveCard-test.avt.e2e.js @@ -9,6 +9,7 @@ import { expect, test } from '@playwright/test'; import { visitStory } from '../../test-utils/storybook'; +import { pkg } from '../../../packages/ibm-products/src/settings'; test.describe('ExpressiveCard @avt', () => { test('@avt-default-state', async ({ page }) => { @@ -22,5 +23,137 @@ test.describe('ExpressiveCard @avt', () => { await expect(page).toHaveNoACViolations( 'ExpressiveCard @avt-default-state' ); + const buttonEle = page.getByText('Read more'); + // Pressing 'Tab' key to focus on the "Read more" button + await page.keyboard.press('Tab'); + await expect(buttonEle).toBeFocused(); + }); + + test('@avt-label-only-state', async ({ page }) => { + await visitStory(page, { + component: 'ExpressiveCard', + id: 'ibm-products-components-cards-expressivecard--label-only', + globals: { + carbonTheme: 'white', + }, + }); + await expect(page).toHaveNoACViolations( + 'ExpressiveCard @avt-label-only-state' + ); + }); + test('@avt-with-caption-state', async ({ page }) => { + await visitStory(page, { + component: 'ExpressiveCard', + id: 'ibm-products-components-cards-expressivecard--with-caption', + globals: { + carbonTheme: 'white', + }, + }); + await expect(page).toHaveNoACViolations( + 'ExpressiveCard @avt-with-caption-state' + ); + }); + test('@avt-with-media-state', async ({ page }) => { + await visitStory(page, { + component: 'ExpressiveCard', + id: 'ibm-products-components-cards-expressivecard--with-media', + globals: { + carbonTheme: 'white', + }, + }); + await expect(page).toHaveNoACViolations( + 'ExpressiveCard @avt-with-media-state' + ); + }); + test('@avt-with-action-icon-href-state', async ({ page }) => { + await visitStory(page, { + component: 'ExpressiveCard', + id: 'ibm-products-components-cards-expressivecard--with-action-icon-href', + globals: { + carbonTheme: 'white', + }, + }); + await expect(page).toHaveNoACViolations( + 'ExpressiveCard @avt-with-action-icon-href-state' + ); + + const hrefEle = page.locator('a[href="#"]'); + // Pressing 'Tab' key to focus on the '->' href button + await page.keyboard.press('Tab'); + await expect(hrefEle).toBeFocused(); + }); + test('@avt-with-pictogram-state', async ({ page }) => { + await visitStory(page, { + component: 'ExpressiveCard', + id: 'ibm-products-components-cards-expressivecard--with-pictogram', + globals: { + carbonTheme: 'white', + }, + }); + await expect(page).toHaveNoACViolations( + 'ExpressiveCard @avt-with-pictogram-state' + ); + }); + test('@avt-with-secondary-action-state', async ({ page }) => { + await visitStory(page, { + component: 'ExpressiveCard', + id: 'ibm-products-components-cards-expressivecard--with-secondary-action', + globals: { + carbonTheme: 'white', + }, + }); + await expect(page).toHaveNoACViolations( + 'ExpressiveCard @avt-with-secondary-action-state' + ); + const primaryButtonEle = page.getByText('Remove'); + const secondaryButtonEle = page.getByText('Read more'); + // Pressing 'Tab' key to focus on the "Remove" button + await page.keyboard.press('Tab'); + await expect(primaryButtonEle).toBeFocused(); + // Pressing 'Tab' key to focus on the "Read more" button + await page.keyboard.press('Tab'); + await expect(secondaryButtonEle).toBeFocused(); + }); + test('@avt-clickable-state', async ({ page }) => { + await visitStory(page, { + component: 'ExpressiveCard', + id: 'ibm-products-components-cards-expressivecard--clickable', + globals: { + carbonTheme: 'white', + }, + }); + await expect(page).toHaveNoACViolations( + 'ExpressiveCard @avt-clickable-state' + ); + const cardElement = page.locator( + `[data-carbon-devtools-id="${pkg.prefix}--ExpressiveCard"]` + ); + // Pressing 'Tab' key to focus on the clickable card + await page.keyboard.press('Tab'); + await expect(cardElement).toBeFocused(); + }); + test('@avt-with-button-href-state', async ({ page }) => { + await visitStory(page, { + component: 'ExpressiveCard', + id: 'ibm-products-components-cards-expressivecard--with-button-href', + globals: { + carbonTheme: 'white', + }, + }); + await expect(page).toHaveNoACViolations( + 'ExpressiveCard @avt-with-button-href-state' + ); + }); + test('@avt-with-button-icon-state', async ({ page }) => { + await visitStory(page, { + component: 'ExpressiveCard', + id: 'ibm-products-components-cards-expressivecard--with-button-icon', + globals: { + carbonTheme: 'white', + }, + }); + await expect(page).toHaveNoACViolations( + 'ExpressiveCard @avt-with-button-icon-state' + ); }); }); diff --git a/e2e/components/TagSet/TagSet-test.avt.e2e.js b/e2e/components/TagSet/TagSet-test.avt.e2e.js index d3d6b25324..3473581541 100644 --- a/e2e/components/TagSet/TagSet-test.avt.e2e.js +++ b/e2e/components/TagSet/TagSet-test.avt.e2e.js @@ -9,6 +9,8 @@ import { expect, test } from '@playwright/test'; import { visitStory } from '../../test-utils/storybook'; +import { carbon, pkg } from '../../../packages/ibm-products/src/settings'; +import { simulateKeyPress } from '../../test-utils/simulateKeyPress'; test.describe('TagSet @avt', () => { test('@avt-default-state', async ({ page }) => { @@ -21,4 +23,191 @@ test.describe('TagSet @avt', () => { }); await expect(page).toHaveNoACViolations('TagSet @avt-default-state'); }); + test('@avt-many-tags', async ({ page }) => { + await visitStory(page, { + component: 'TagSet', + id: 'ibm-products-components-tag-set-tagset--many-tags', + globals: { + carbonTheme: 'white', + }, + }); + await expect(page).toHaveNoACViolations('TagSet @avt-many-tags'); + }); + test('@avt-multiline-tags', async ({ page }) => { + await visitStory(page, { + component: 'TagSet', + id: 'ibm-products-components-tag-set-tagset--multiline-tags', + globals: { + carbonTheme: 'white', + }, + }); + await expect(page).toHaveNoACViolations('TagSet @avt-multiline-tags'); + }); + test('@avt-hundreds-of-tags', async ({ page }) => { + await visitStory(page, { + component: 'TagSet', + id: 'ibm-products-components-tag-set-tagset--hundreds-of-tags', + globals: { + carbonTheme: 'white', + }, + }); + await expect(page).toHaveNoACViolations('TagSet @avt-hundreds-of-tags'); + }); + test('@avt-with-close', async ({ page }) => { + await visitStory(page, { + component: 'TagSet', + id: 'ibm-products-components-tag-set-tagset--with-close', + globals: { + carbonTheme: 'white', + }, + }); + await expect(page).toHaveNoACViolations('TagSet @avt-with-close'); + }); + test('@avt-with-close-and-overflow-tags', async ({ page }) => { + await visitStory(page, { + component: 'TagSet', + id: 'ibm-products-components-tag-set-tagset--with-close-and-overflow-tags', + globals: { + carbonTheme: 'white', + }, + }); + await expect(page).toHaveNoACViolations( + 'TagSet @avt-with-close-and-overflow-tags' + ); + }); + + //open close popover + test('@avt-open-and-close-tags', async ({ page }) => { + await visitStory(page, { + component: 'TagSet', + id: 'ibm-products-components-tag-set-tagset--many-tags', + globals: { + carbonTheme: 'white', + }, + }); + const moreTagsButton = page.locator( + `.${pkg.prefix}--tag-set-overflow__popover-trigger` + ); + + moreTagsButton.click(); + await expect( + page.locator(`.${carbon.prefix}--popover--open`) + ).toBeVisible(); + + moreTagsButton.click(); + await expect(page.locator(`.${carbon.prefix}--popover--open`)).toBeHidden(); + }); + + //open close popover + test('@avt-open-and-close-all-tags-modal', async ({ page }) => { + await visitStory(page, { + component: 'TagSet', + id: 'ibm-products-components-tag-set-tagset--many-tags', + globals: { + carbonTheme: 'white', + }, + }); + const moreTagsButton = page.locator( + `.${pkg.prefix}--tag-set-overflow__popover-trigger` + ); + const modalElement = page.locator(`.${carbon.prefix}--modal.is-visible`); + + moreTagsButton.click(); + + await page + .locator(`.${pkg.prefix}--tag-set-overflow__show-all-tags-link`) + .click(); + + await modalElement.evaluate((element) => + Promise.all( + element.getAnimations().map((animation) => animation.finished) + ) + ); + + await expect(page.getByRole('heading', { name: 'All tags' })).toBeVisible(); + + //checking search funtionality + await expect(page.getByRole('searchbox')).toBeFocused(); + await expect(modalElement.getByText('Two')).toBeVisible(); + await page.getByRole('searchbox').fill('One'); + await expect(modalElement.getByText('Two')).toBeHidden(); + + await page.getByRole('button', { name: 'Close' }).click(); + await expect(page.locator(`.${carbon.prefix}--modal`)).toBeHidden(); + }); + + test('@avt-close-tags', async ({ page }) => { + await visitStory(page, { + component: 'TagSet', + id: 'ibm-products-components-tag-set-tagset--with-close-and-overflow-tags', + globals: { + carbonTheme: 'white', + }, + }); + + await expect( + page.locator(`.${pkg.prefix}--tag-set__displayed-tag`).getByText('One') + ).toBeVisible(); + await page.getByRole('button', { name: 'Dismiss' }).first().click(); + await expect( + page.locator(`.${pkg.prefix}--tag-set__displayed-tag`).getByText('One') + ).toBeHidden(); + }); + + test('@avt-keyboard', async ({ page }) => { + await visitStory(page, { + component: 'TagSet', + id: 'ibm-products-components-tag-set-tagset--with-close-and-overflow-tags', + globals: { + carbonTheme: 'white', + }, + }); + const modalElement = page.locator(`.${carbon.prefix}--modal.is-visible`); + + await simulateKeyPress(page, 'Tab'); + + await expect( + page.getByRole('button', { name: 'Dismiss' }).first() + ).toBeFocused(); + await simulateKeyPress(page, 'Tab', 6); + + const moreTagsButton = page.locator( + `.${pkg.prefix}--tag-set-overflow__popover-trigger` + ); + await expect(moreTagsButton).toBeFocused(); + await simulateKeyPress(page, 'Enter'); + + await expect( + page.locator(`.${carbon.prefix}--popover--open`) + ).toBeVisible(); + + await simulateKeyPress(page, 'Tab'); + //first tag inside popover is focussed + await expect( + page + .locator(`.${pkg.prefix}--tag-set-overflow__tag-list`) + .getByRole('button', { name: 'Dismiss' }) + .first() + ).toBeFocused(); + + await simulateKeyPress(page, 'Tab', 10); + + await expect( + page.locator(`.${pkg.prefix}--tag-set-overflow__show-all-tags-link`) + ).toBeFocused(); //view all tags modal link is focussed + + await simulateKeyPress(page, 'Enter'); + + await modalElement.evaluate((element) => + Promise.all( + element.getAnimations().map((animation) => animation.finished) + ) + ); + + await expect(page.getByRole('heading', { name: 'All tags' })).toBeVisible(); + await simulateKeyPress(page, 'Tab'); + + await simulateKeyPress(page, 'Enter'); + await expect(page.locator(`.${carbon.prefix}--modal`)).toBeHidden(); + }); }); diff --git a/e2e/test-utils/simulateKeyPress.ts b/e2e/test-utils/simulateKeyPress.ts new file mode 100644 index 0000000000..9ccf0eb6c4 --- /dev/null +++ b/e2e/test-utils/simulateKeyPress.ts @@ -0,0 +1,22 @@ +/** + * Copyright IBM Corp. 2024, 2024 + * + * This source code is licensed under the Apache-2.0 license found in the + * LICENSE file in the root directory of this source tree. + */ + +import { Page } from '@playwright/test'; + +export const simulateKeyPress = async ( + page: Page, + key: string, + count: number = 1, + waitDuration?: number +) => { + for (let i = 0; i < count; i++) { + await page.keyboard.press(key); + if (waitDuration && waitDuration > 0) { + await page.waitForTimeout(waitDuration); + } + } +}; diff --git a/examples/carbon-for-ibm-products/APIKeyModal/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/APIKeyModal/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/APIKeyModal/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/APIKeyModal/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/AboutModal/src/Example/Example.jsx b/examples/carbon-for-ibm-products/AboutModal/src/Example/Example.jsx index a63ec34158..644646d342 100644 --- a/examples/carbon-for-ibm-products/AboutModal/src/Example/Example.jsx +++ b/examples/carbon-for-ibm-products/AboutModal/src/Example/Example.jsx @@ -82,7 +82,7 @@ export const Example = () => { IBM{' '} diff --git a/examples/carbon-for-ibm-products/AboutModal/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/AboutModal/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/AboutModal/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/AboutModal/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/BigNumbers/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/BigNumbers/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/BigNumbers/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/BigNumbers/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/Cascade/src/Example/_example.scss b/examples/carbon-for-ibm-products/Cascade/src/Example/_example.scss index 900222bd2a..434fbf7cde 100644 --- a/examples/carbon-for-ibm-products/Cascade/src/Example/_example.scss +++ b/examples/carbon-for-ibm-products/Cascade/src/Example/_example.scss @@ -4,8 +4,8 @@ display: inline-block; width: 150px; height: 150px; - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use margin: 1rem; - // stylelint-disable-next-line carbon/theme-token-use + // stylelint-disable-next-line carbon/theme-use background-color: $background-inverse; } diff --git a/examples/carbon-for-ibm-products/Cascade/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/Cascade/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/Cascade/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/Cascade/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/Coachmark/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/Coachmark/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/Coachmark/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/Coachmark/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/CoachmarkBeacon/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/CoachmarkBeacon/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/CoachmarkBeacon/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/CoachmarkBeacon/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/CoachmarkButton/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/CoachmarkButton/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/CoachmarkButton/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/CoachmarkButton/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/CoachmarkFixed/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/CoachmarkFixed/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/CoachmarkFixed/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/CoachmarkFixed/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/CoachmarkOverlayElement/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/CoachmarkOverlayElement/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/CoachmarkOverlayElement/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/CoachmarkOverlayElement/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/CoachmarkOverlayElements/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/CoachmarkOverlayElements/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/CoachmarkOverlayElements/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/CoachmarkOverlayElements/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/CoachmarkStack/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/CoachmarkStack/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/CoachmarkStack/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/CoachmarkStack/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/ConditionBuilder/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/ConditionBuilder/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/ConditionBuilder/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/ConditionBuilder/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/CreateFullPage/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/CreateFullPage/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/CreateFullPage/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/CreateFullPage/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/CreateModal/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/CreateModal/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/CreateModal/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/CreateModal/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/CreateSidePanel/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/CreateSidePanel/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/CreateSidePanel/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/CreateSidePanel/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/CreateTearsheet/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/CreateTearsheet/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/CreateTearsheet/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/CreateTearsheet/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/CreateTearsheetNarrow/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/CreateTearsheetNarrow/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/CreateTearsheetNarrow/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/CreateTearsheetNarrow/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/DataSpreadsheet/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/DataSpreadsheet/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/DataSpreadsheet/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/DataSpreadsheet/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/Datagrid/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/Datagrid/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/Datagrid/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/Datagrid/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/Decorator/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/Decorator/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/Decorator/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/Decorator/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/DelimitedList/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/DelimitedList/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/DelimitedList/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/DelimitedList/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/DescriptionList/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/DescriptionList/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/DescriptionList/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/DescriptionList/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/EditInPlace/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/EditInPlace/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/EditInPlace/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/EditInPlace/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/EmptyStates/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/EmptyStates/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/EmptyStates/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/EmptyStates/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/ExportModal/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/ExportModal/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/ExportModal/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/ExportModal/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/ExpressiveCard/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/ExpressiveCard/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/ExpressiveCard/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/ExpressiveCard/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/FilterPanel/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/FilterPanel/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/FilterPanel/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/FilterPanel/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/FullPageError/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/FullPageError/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/FullPageError/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/FullPageError/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/GetStartedCard/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/GetStartedCard/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/GetStartedCard/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/GetStartedCard/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/HTTPErrors/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/HTTPErrors/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/HTTPErrors/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/HTTPErrors/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/ImportModal/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/ImportModal/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/ImportModal/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/ImportModal/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/InterstitialScreen/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/InterstitialScreen/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/InterstitialScreen/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/InterstitialScreen/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/InterstitialScreenView/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/InterstitialScreenView/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/InterstitialScreenView/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/InterstitialScreenView/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/InterstitialScreenViewModule/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/InterstitialScreenViewModule/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/InterstitialScreenViewModule/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/InterstitialScreenViewModule/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/Nav/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/Nav/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/Nav/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/Nav/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/NotificationsPanel/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/NotificationsPanel/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/NotificationsPanel/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/NotificationsPanel/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/OptionsTile/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/OptionsTile/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/OptionsTile/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/OptionsTile/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/PageHeader/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/PageHeader/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/PageHeader/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/PageHeader/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/ProductiveCard/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/ProductiveCard/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/ProductiveCard/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/ProductiveCard/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/RemoveModal/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/RemoveModal/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/RemoveModal/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/RemoveModal/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/Saving/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/Saving/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/Saving/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/Saving/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/ScrollGradient/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/ScrollGradient/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/ScrollGradient/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/ScrollGradient/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/SearchBar/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/SearchBar/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/SearchBar/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/SearchBar/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/SidePanel/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/SidePanel/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/SidePanel/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/SidePanel/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/StatusIcon/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/StatusIcon/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/StatusIcon/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/StatusIcon/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/StatusIndicator/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/StatusIndicator/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/StatusIndicator/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/StatusIndicator/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/StringFormatter/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/StringFormatter/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/StringFormatter/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/StringFormatter/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/TagOverflow/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/TagOverflow/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/TagOverflow/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/TagOverflow/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/TagSet/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/TagSet/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/TagSet/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/TagSet/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/Tearsheet/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/Tearsheet/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/Tearsheet/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/Tearsheet/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/TruncatedList/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/TruncatedList/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/TruncatedList/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/TruncatedList/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/UserAvatar/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/UserAvatar/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/UserAvatar/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/UserAvatar/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/UserProfileImage/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/UserProfileImage/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/UserProfileImage/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/UserProfileImage/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/WebTerminal/src/Example/_example.scss b/examples/carbon-for-ibm-products/WebTerminal/src/Example/_example.scss index 9adc9c59c5..194e623c9f 100644 --- a/examples/carbon-for-ibm-products/WebTerminal/src/Example/_example.scss +++ b/examples/carbon-for-ibm-products/WebTerminal/src/Example/_example.scss @@ -11,7 +11,7 @@ @include type-style('code-02'); padding: $spacing-05; - // stylelint-disable-next-line carbon/theme-token-use + // stylelint-disable-next-line carbon/theme-use color: $gray-10; } diff --git a/examples/carbon-for-ibm-products/WebTerminal/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/WebTerminal/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/WebTerminal/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/WebTerminal/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/example-gallery/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/example-gallery/src/ThemeSelector/_theme-dropdown.scss index 01378bd385..a9c6b9015c 100644 --- a/examples/carbon-for-ibm-products/example-gallery/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/example-gallery/src/ThemeSelector/_theme-dropdown.scss @@ -21,8 +21,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/prefix-example/src/Example/Example.jsx b/examples/carbon-for-ibm-products/prefix-example/src/Example/Example.jsx index c83ac5b35e..27c9005815 100644 --- a/examples/carbon-for-ibm-products/prefix-example/src/Example/Example.jsx +++ b/examples/carbon-for-ibm-products/prefix-example/src/Example/Example.jsx @@ -86,7 +86,7 @@ export const Example = () => { IBM{' '} diff --git a/examples/carbon-for-ibm-products/prefix-example/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/prefix-example/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/prefix-example/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/prefix-example/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/react-16-example/src/Example/Example.jsx b/examples/carbon-for-ibm-products/react-16-example/src/Example/Example.jsx index a63ec34158..644646d342 100644 --- a/examples/carbon-for-ibm-products/react-16-example/src/Example/Example.jsx +++ b/examples/carbon-for-ibm-products/react-16-example/src/Example/Example.jsx @@ -82,7 +82,7 @@ export const Example = () => { IBM{' '} diff --git a/examples/carbon-for-ibm-products/react-16-example/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/react-16-example/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/react-16-example/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/react-16-example/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/examples/carbon-for-ibm-products/react-17-example/src/Example/Example.jsx b/examples/carbon-for-ibm-products/react-17-example/src/Example/Example.jsx index a63ec34158..644646d342 100644 --- a/examples/carbon-for-ibm-products/react-17-example/src/Example/Example.jsx +++ b/examples/carbon-for-ibm-products/react-17-example/src/Example/Example.jsx @@ -82,7 +82,7 @@ export const Example = () => { IBM{' '} diff --git a/examples/carbon-for-ibm-products/react-17-example/src/ThemeSelector/_theme-dropdown.scss b/examples/carbon-for-ibm-products/react-17-example/src/ThemeSelector/_theme-dropdown.scss index dfffdea257..45eb4ab6e6 100644 --- a/examples/carbon-for-ibm-products/react-17-example/src/ThemeSelector/_theme-dropdown.scss +++ b/examples/carbon-for-ibm-products/react-17-example/src/ThemeSelector/_theme-dropdown.scss @@ -58,8 +58,8 @@ .carbon-theme-dropdown { position: fixed; - bottom: 1rem; // stylelint-disable-line carbon/layout-token-use - left: 1rem; // stylelint-disable-line carbon/layout-token-use + bottom: 1rem; // stylelint-disable-line carbon/layout-use + left: 1rem; // stylelint-disable-line carbon/layout-use min-width: 11.5rem; } diff --git a/package.json b/package.json index 3852c8a97e..336d892fc3 100644 --- a/package.json +++ b/package.json @@ -84,7 +84,7 @@ "@types/carbon__layout": "^0.0.3", "@typescript-eslint/eslint-plugin": "^6.21.0", "@typescript-eslint/parser": "^6.21.0", - "accessibility-checker": "^3.1.65", + "accessibility-checker": "^3.1.78", "cheerio": "^1.0.0-rc.12", "commander": "^12.0.0", "copyfiles": "^2.4.1", @@ -110,8 +110,8 @@ "react": "^18.2.0", "react-dom": "^18.2.0", "rimraf": "^5.0.5", - "stylelint": "^15.11.0", - "stylelint-config-carbon": "1.19.1", + "stylelint": "^16.10.0", + "stylelint-config-carbon": "^1.20.0", "webpack": "^5.96.1" }, "//resolutions:http-signature": "package 'request' deprecated but still used, asks for http-signature ~1.2.0 which indirectly has vulnerabilities", @@ -143,7 +143,7 @@ ] }, "dependencies": { - "stylelint-plugin-carbon-tokens": "2.8.0" + "stylelint-plugin-carbon-tokens": "^3.2.1" }, "packageManager": "yarn@4.0.2" } diff --git a/packages/core/.storybook/Annotation/_annotation.scss b/packages/core/.storybook/Annotation/_annotation.scss index 9302d93eca..fa26fd930b 100644 --- a/packages/core/.storybook/Annotation/_annotation.scss +++ b/packages/core/.storybook/Annotation/_annotation.scss @@ -58,18 +58,18 @@ $types: ( @each $type, $colors in $types { $border: map.get($colors, 'border'); $background: map.get($colors, 'background'); - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ $color: map.get($colors, 'color'); .#{$pkg-prefix}--annotation--#{$type} { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ border-color: $border; } .#{$pkg-prefix}--annotation--#{$type} > .#{$pkg-prefix}--annotation__label { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ background-color: $background; - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ color: $color; } } diff --git a/packages/core/.storybook/manager.js b/packages/core/.storybook/manager.js index 25ebffc23b..694116e77c 100644 --- a/packages/core/.storybook/manager.js +++ b/packages/core/.storybook/manager.js @@ -29,12 +29,12 @@ const renderComponentLabel = (label, dark, type = 'Canary') => {
{
@@ -119,7 +119,7 @@ const App = () => { key={card.topic.name} lg={4} style={{ - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use marginTop: '36px', }} > diff --git a/packages/core/src/component-playground/components/PageHeader/PageHeader.js b/packages/core/src/component-playground/components/PageHeader/PageHeader.js index 1bd8693e81..e5d694d044 100644 --- a/packages/core/src/component-playground/components/PageHeader/PageHeader.js +++ b/packages/core/src/component-playground/components/PageHeader/PageHeader.js @@ -16,7 +16,7 @@ const PageHeader = (props) => {

{ id="tss-ft1" labelText="Enter an important value here" style={{ - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use marginBottom: '1em', }} /> @@ -57,7 +57,7 @@ const TearsheetWide = (props) => { labelText="Here is a light entry field:" light style={{ - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use marginBottom: '1em', }} /> diff --git a/packages/core/src/welcome/_storybook-styles.scss b/packages/core/src/welcome/_storybook-styles.scss index c6f1184917..b45ddae6ac 100644 --- a/packages/core/src/welcome/_storybook-styles.scss +++ b/packages/core/src/welcome/_storybook-styles.scss @@ -25,7 +25,7 @@ body { width: 100%; height: 100vh; padding: $spacing-09; - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ background-color: colors.$purple-10; } @@ -33,7 +33,7 @@ body { display: flex; height: 100%; justify-content: space-between; - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ color: colors.$black; } @@ -83,7 +83,7 @@ body { .welcome__link.#{c4p-settings.$carbon-prefix}--link { margin-right: auto; margin-bottom: $spacing-03; - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ color: colors.$blue-60; } @@ -99,15 +99,15 @@ body { border: none; border-radius: 50%; margin: $spacing-05; - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ background-color: colors.$gray-80; - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ color: colors.$gray-100; opacity: 0.7; } .welcome__pause-button:focus { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ outline: 2px solid colors.$blue-60; } @@ -116,7 +116,7 @@ body { } .welcome__pause-button > svg { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ color: colors.$white; } diff --git a/packages/ibm-products-styles/CHANGELOG.md b/packages/ibm-products-styles/CHANGELOG.md index fa78ce2d2c..136af44d9e 100644 --- a/packages/ibm-products-styles/CHANGELOG.md +++ b/packages/ibm-products-styles/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.51.0](https://github.com/carbon-design-system/ibm-products/compare/@carbon/ibm-products-styles@2.51.0-rc.0...@carbon/ibm-products-styles@2.51.0) (2024-12-04) + +**Note:** Version bump only for package @carbon/ibm-products-styles + + + + + # [2.51.0-rc.0](https://github.com/carbon-design-system/ibm-products/compare/@carbon/ibm-products-styles@2.50.0-rc.0...@carbon/ibm-products-styles@2.51.0-rc.0) (2024-11-25) **Note:** Version bump only for package @carbon/ibm-products-styles diff --git a/packages/ibm-products-styles/package.json b/packages/ibm-products-styles/package.json index c626d26cec..487789f0ac 100644 --- a/packages/ibm-products-styles/package.json +++ b/packages/ibm-products-styles/package.json @@ -1,7 +1,7 @@ { "name": "@carbon/ibm-products-styles", "description": "Carbon for IBM Products styles", - "version": "2.51.0-rc.0", + "version": "2.51.0", "license": "Apache-2.0", "installConfig": { "hoistingLimits": "none" @@ -52,7 +52,7 @@ "cross-env": "^7.0.3", "glob": "^10.3.10", "jest": "^29.7.0", - "jest-config-ibm-cloud-cognitive": "^1.14.0-rc.0", + "jest-config-ibm-cloud-cognitive": "^1.14.0", "jest-environment-jsdom": "^29.7.0", "npm-check-updates": "^16.14.12", "npm-run-all": "^4.1.5", diff --git a/packages/ibm-products-styles/src/__tests__/__snapshots__/styles.test.js.snap b/packages/ibm-products-styles/src/__tests__/__snapshots__/styles.test.js.snap index 833bd073a3..58081841e0 100644 --- a/packages/ibm-products-styles/src/__tests__/__snapshots__/styles.test.js.snap +++ b/packages/ibm-products-styles/src/__tests__/__snapshots__/styles.test.js.snap @@ -2596,7 +2596,7 @@ p.c4p--about-modal__copyright-text:first-child { --c4p--side-panel--title-padding-bottom: 1rem; position: sticky; z-index: 4; - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ top: calc(-1px * var(--c4p--side-panel--scroll-animation-distance)); min-height: 2.5rem; padding: 1rem; @@ -2666,7 +2666,7 @@ p.c4p--about-modal__copyright-text:first-child { .c4p--side-panel .c4p--side-panel__title { position: sticky; z-index: 4; - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ top: var(--c4p--side-panel--title-stop); /* border-bottom used instead of padding which wrapped text shows through */ border-bottom: var(--c4p--side-panel--title-padding-bottom) solid transparent; @@ -2679,14 +2679,14 @@ p.c4p--about-modal__copyright-text:first-child { letter-spacing: var(--cds-heading-03-letter-spacing, 0); display: -webkit-box; overflow: hidden; - /* stylelint-disable-next-line carbon/layout-token-use -- custom css property set below */ + /* stylelint-disable-next-line carbon/layout-use -- custom css property set below */ padding-right: var(--c4p--side-panel--title-padding-right); -webkit-box-orient: vertical; -webkit-line-clamp: 2; opacity: calc(1 - var(--c4p--side-panel--scroll-animation-progress)); } .c4p--side-panel .c4p--side-panel__title--no-label .c4p--side-panel__title-text { - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ transform: translateY(calc(-1 * 1rem * var(--c4p--side-panel--scroll-animation-progress))); } .c4p--side-panel .c4p--side-panel__header--no-title-animation .c4p--side-panel__title-text { @@ -2710,17 +2710,16 @@ p.c4p--about-modal__copyright-text:first-child { letter-spacing: var(--cds-heading-compact-02-letter-spacing, 0); display: -webkit-box; overflow: hidden; - /* stylelint-disable-next-line carbon/layout-token-use -- custom css property set below */ + /* stylelint-disable-next-line carbon/layout-use -- custom css property set below */ padding-right: var(--c4p--side-panel--title-padding-right); -webkit-box-orient: vertical; -webkit-line-clamp: 2; position: absolute; - /* stylelint-disable-next-line carbon/layout-token-use */ top: 0; opacity: var(--c4p--side-panel--scroll-animation-progress); } .c4p--side-panel .c4p--side-panel__title--no-label .c4p--side-panel__collapsed-title-text { - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ transform: translateY(calc(1rem * (1 - var(--c4p--side-panel--scroll-animation-progress)))); } .c4p--side-panel .c4p--side-panel__subtitle-text { @@ -2898,7 +2897,6 @@ p.c4p--about-modal__copyright-text:first-child { .c4p--side-panel--has-slug + .c4p--side-panel__overlay, .c4p--side-panel--has-ai-label + .c4p--side-panel__overlay { - /* stylelint-disable-next-line carbon/theme-token-use */ background-color: var(--cds-ai-overlay, rgba(0, 17, 65, 0.5)); } @@ -3109,7 +3107,7 @@ p.c4p--about-modal__copyright-text:first-child { } .c4p--tearsheet.c4p--tearsheet--wide.c4p--tearsheet--has-slug .c4p--tearsheet__header.c4p--tearsheet__header--with-close-icon, .c4p--tearsheet.c4p--tearsheet--wide.c4p--tearsheet--has-ai-label .c4p--tearsheet__header.c4p--tearsheet__header--with-close-icon { /* spacing 11 plus additional space for slug/close */ - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ padding-inline-end: calc(8rem); } .c4p--tearsheet.c4p--tearsheet--narrow .c4p--tearsheet__header-description { @@ -3214,11 +3212,11 @@ p.c4p--about-modal__copyright-text:first-child { background: var(--cds-background, #ffffff); } .c4p--tearsheet.c4p--tearsheet--has-slug, .c4p--tearsheet.c4p--tearsheet--has-ai-label { - /* stylelint-disable-next-line carbon/theme-token-use */ --overlay-color: var(--cds-ai-overlay, rgba(0, 17, 65, 0.5)); } .c4p--tearsheet.c4p--tearsheet--has-slug:not(.c4p--tearsheet--has-close) .cds--slug, .c4p--tearsheet.c4p--tearsheet--has-ai-label:not(.c4p--tearsheet--has-close) .cds--slug { inset-inline-end: 0; + /* stylelint-disable-next-line carbon/layout-use */ margin-block: 6px; margin-inline-end: 1rem; } @@ -3420,7 +3418,7 @@ p.c4p--about-modal__copyright-text:first-child { } .c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center td.cds--table-column-checkbox, .c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center th.cds--table-column-checkbox { - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ padding-top: 0.6875rem; } .c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center td.cds--table-column-checkbox.c4p--datagrid__checkbox-cell, @@ -3485,7 +3483,6 @@ p.c4p--about-modal__copyright-text:first-child { /* This section to be removed after support for slug dropped - start */ .c4p--datagrid th.c4p--datagrid__with-slug { - /* stylelint-disable-next-line carbon/theme-token-use */ box-shadow: inset 0 1px var(--cds-ai-border-strong, #4589ff); } @@ -3501,7 +3498,7 @@ p.c4p--about-modal__copyright-text:first-child { } .c4p--datagrid .cds--data-table tbody tr.c4p--datagrid__slug--row { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ box-shadow: inset 1px 0 var(--cds-ai-border-strong, #4589ff); } @@ -3526,7 +3523,6 @@ p.c4p--about-modal__copyright-text:first-child { /* This section to be removed after support for slug dropped - end */ .c4p--datagrid th.c4p--datagrid__with-ai-label { - /* stylelint-disable-next-line carbon/theme-token-use */ box-shadow: inset 0 1px var(--cds-ai-border-strong, #4589ff); } @@ -3542,7 +3538,6 @@ p.c4p--about-modal__copyright-text:first-child { } .c4p--datagrid .cds--data-table tbody tr.c4p--datagrid__ai-label--row { - /* stylelint-disable-next-line carbon/theme-token-use */ box-shadow: inset 1px 0 var(--cds-ai-border-strong, #4589ff); } @@ -3878,9 +3873,9 @@ p.c4p--about-modal__copyright-text:first-child { .c4p--datagrid__carbon-row-expanded.c4p--datagrid__carbon-row-expanded-hover-active::before { position: absolute; z-index: 2; - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ top: var(--c4p--datagrid--row-height); - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ left: calc(var(--c4p--datagrid--indicator-offset-amount) + 1rem); width: 1px; height: var(--c4p--datagrid--indicator-height); @@ -4108,7 +4103,7 @@ p.c4p--about-modal__copyright-text:first-child { .c4p--datagrid .c4p--datagrid__col-resizer-range:focus + .c4p--datagrid__col-resize-indicator::after { position: absolute; - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ top: calc(var(--c4p--datagrid--row-height) - 20px); right: 0.25rem; width: 1px; @@ -4175,7 +4170,7 @@ p.c4p--about-modal__copyright-text:first-child { .c4p--datagrid tr.c4p--datagrid__carbon-nested-row + :not(tr.c4p--datagrid__carbon-nested-row)::after { position: absolute; - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ top: -1px; left: 0; width: 100%; @@ -4203,7 +4198,7 @@ p.c4p--about-modal__copyright-text:first-child { .cds--data-table .c4p--datagrid__carbon-nested-row:not(.c4p--datagrid__carbon-row-expandable):not(.c4p--datagrid__carbon-row-expandable--async) td.c4p--datagrid__cell:nth-of-type(2)::before, .cds--data-table .c4p--datagrid__carbon-nested-row td.c4p--datagrid__expandable-row-cell + td::before { position: absolute; - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ bottom: -1px; left: 0; width: 1rem; @@ -4325,7 +4320,7 @@ p.c4p--about-modal__copyright-text:first-child { .c4p--datagrid__right-align-cell-renderer { width: 100%; - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ padding-right: 23px; text-align: right; } @@ -4528,8 +4523,7 @@ p.c4p--about-modal__copyright-text:first-child { } .c4p--datagrid .cds--popover--bottom-right.c4p--datagrid__row-height-settings-popover .cds--popover-caret { - /* stylelint-disable-next-line carbon/layout-token-use */ - left: -4px; + left: -0.25rem; } .c4p--datagrid__row-size-toggle-tip-button.cds--toggletip-button { @@ -4688,7 +4682,7 @@ p.c4p--about-modal__copyright-text:first-child { position: relative; z-index: 0; overflow: auto; - padding: 0 1rem 4rem 1rem; + padding: 0 1rem 4rem; overscroll-behavior: contain; } @@ -4817,7 +4811,7 @@ th.c4p--datagrid__select-all-toggle-on.button { .c4p--datagrid .c4p--datagrid__expanded-row-content::before { position: absolute; - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ top: -1px; right: 0; width: calc(100% - 3rem); @@ -4898,7 +4892,7 @@ th.c4p--datagrid__select-all-toggle-on.button { width: 100%; height: 3rem; border: 2px dashed var(--cds-focus, #0f62fe); - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ background-color: #edf5ff; } @@ -4945,7 +4939,7 @@ th.c4p--datagrid__select-all-toggle-on.button { width: 100%; align-items: center; padding-left: 1rem; - /* stylelint-disable-next-line carbon/type-token-use */ + /* stylelint-disable-next-line carbon/type-use */ line-height: 1; transition-property: opacity; } @@ -5154,7 +5148,7 @@ th.c4p--datagrid__select-all-toggle-on.button { } .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button.c4p--datagrid__inline-edit-button--active { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ outline: 0.125rem solid var(--cds-focus, #0f62fe); outline-offset: calc(-1 * 0.125rem); } @@ -5941,7 +5935,7 @@ th.c4p--datagrid__select-all-toggle-on.button { } @media (min-width: 42rem) { .c4p--full-page-error__svg-container { - padding: auto 0.5rem 5rem 0.5rem; + padding: auto 0.5rem 5rem; } } @@ -6079,7 +6073,7 @@ th.c4p--datagrid__select-all-toggle-on.button { } } -/* stylelint-disable carbon/theme-token-use */ +/* stylelint-disable carbon/theme-use */ .c4p--http-errors-404__prefix-cls-1 { fill: none; } @@ -8858,6 +8852,7 @@ button.c4p--add-select__global-filter-toggle--open { } .c4p--breadcrumb-with-overflow__overflow-menu { + /* stylelint-disable-next-line carbon/type-use */ line-height: 0; } @@ -9018,25 +9013,25 @@ button.c4p--add-select__global-filter-toggle--open { @keyframes background-appear { from { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ background-color: var(--from-color); } to { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ background-color: var(--to-color); } } @keyframes background-and-shadow-appear { from { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ background-color: var(--from-color); - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ box-shadow: 0 1px 0 var(--from-color); } to { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ background-color: var(--to-color); - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ box-shadow: 0 1px 0 var(--to-color-shadow); } } @@ -9046,7 +9041,7 @@ button.c4p--add-select__global-filter-toggle--open { /* z-index used to raise above any position relative content as per Carbon header */ /* dropped 1 below Carbon header so as not to overlay the side panel */ z-index: 7999; - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ top: var(--c4p--page-header--header-top); display: inline-block; /* cause top/bottom margin to reserve space */ width: 100%; @@ -9357,7 +9352,7 @@ button.c4p--add-select__global-filter-toggle--open { } .c4p--page-header .c4p--page-header__title-icon { margin-right: 0.75rem; - transform: translateY(-2px); + transform: translateY(-0.125rem); vertical-align: middle; } .c4p--page-header .c4p--page-header__page-actions { diff --git a/packages/ibm-products-styles/src/components/BreadcrumbWithOverflow/_breadcrumb-with-overflow.scss b/packages/ibm-products-styles/src/components/BreadcrumbWithOverflow/_breadcrumb-with-overflow.scss index 1218c5edaa..f861452698 100644 --- a/packages/ibm-products-styles/src/components/BreadcrumbWithOverflow/_breadcrumb-with-overflow.scss +++ b/packages/ibm-products-styles/src/components/BreadcrumbWithOverflow/_breadcrumb-with-overflow.scss @@ -90,5 +90,6 @@ $_block-class: #{c4p-settings.$pkg-prefix}--breadcrumb-with-overflow; } } .#{$_block-class}__overflow-menu { + /* stylelint-disable-next-line carbon/type-use */ line-height: 0; } diff --git a/packages/ibm-products-styles/src/components/Card/_card.scss b/packages/ibm-products-styles/src/components/Card/_card.scss index d7d2c28ead..7be0074587 100644 --- a/packages/ibm-products-styles/src/components/Card/_card.scss +++ b/packages/ibm-products-styles/src/components/Card/_card.scss @@ -5,7 +5,7 @@ // LICENSE file in the root directory of this source tree. // -// NOTE: Please do not remove the duplicate `slug` and `ai-label` classes. We need both until slug is fully deprecated +// NOTE: Please do not remove the duplicate `slug` and `decorator` classes. We need both until slug is fully deprecated // Standard imports. @use '@carbon/styles/scss/theme' as *; @@ -144,25 +144,39 @@ $block-class: #{c4p-settings.$pkg-prefix}--card; position: relative; } -.#{$block-class} .#{c4p-settings.$carbon-prefix}--slug { +.#{$block-class} .#{c4p-settings.$carbon-prefix}--slug, +.#{$block-class} .#{c4p-settings.$carbon-prefix}--ai-label { position: absolute; top: $spacing-05; right: $spacing-05; } +.#{$block-class}__header__inner-wrapper--decorator { + position: absolute; + top: $spacing-05; + right: $spacing-05; + + .#{c4p-settings.$carbon-prefix}--slug, + .#{c4p-settings.$carbon-prefix}--ai-label { + position: relative; + top: unset; + right: unset; + } +} + .#{$block-class}__header-container--has-slug, -.#{$block-class}__header-container--has-ai-label { +.#{$block-class}__header-container--has-decorator { width: 100%; padding-right: $spacing-07; } .#{$block-class}__header-container--has-slug.#{$block-class}__header-container--has-actions, -.#{$block-class}__header-container--has-ai-label.#{$block-class}__header-container--has-actions { +.#{$block-class}__header-container--has-decorator.#{$block-class}__header-container--has-actions { padding-right: $spacing-08; } .#{$block-class}__header-container--has-slug.#{$block-class}__header-container--large-tile-or-label, -.#{$block-class}__header-container--has-ai-label.#{$block-class}__header-container--large-tile-or-label { +.#{$block-class}__header-container--has-decorator.#{$block-class}__header-container--large-tile-or-label { padding-right: $spacing-09; } diff --git a/packages/ibm-products-styles/src/components/Coachmark/_coachmark-overlay.scss b/packages/ibm-products-styles/src/components/Coachmark/_coachmark-overlay.scss index b6d51f79d3..d276980ebd 100644 --- a/packages/ibm-products-styles/src/components/Coachmark/_coachmark-overlay.scss +++ b/packages/ibm-products-styles/src/components/Coachmark/_coachmark-overlay.scss @@ -7,8 +7,8 @@ // LICENSE file in the root directory of this source tree. // -/* stylelint-disable carbon/layout-token-use */ -/* stylelint-disable carbon/theme-token-use */ +/* stylelint-disable carbon/layout-use */ +/* stylelint-disable carbon/theme-use */ /* stylelint-disable declaration-no-important */ // Standard imports. diff --git a/packages/ibm-products-styles/src/components/Coachmark/_coachmark-tagline.scss b/packages/ibm-products-styles/src/components/Coachmark/_coachmark-tagline.scss index 6b2f0892fd..ee0aac5b19 100644 --- a/packages/ibm-products-styles/src/components/Coachmark/_coachmark-tagline.scss +++ b/packages/ibm-products-styles/src/components/Coachmark/_coachmark-tagline.scss @@ -6,7 +6,7 @@ // /* stylelint-disable max-nesting-depth */ -/* stylelint-disable carbon/theme-token-use */ +/* stylelint-disable carbon/theme-use */ /* stylelint-disable declaration-no-important */ // Standard imports. diff --git a/packages/ibm-products-styles/src/components/CoachmarkBeacon/_coachmark-beacon.scss b/packages/ibm-products-styles/src/components/CoachmarkBeacon/_coachmark-beacon.scss index 764d6e4210..52f9ab0df9 100644 --- a/packages/ibm-products-styles/src/components/CoachmarkBeacon/_coachmark-beacon.scss +++ b/packages/ibm-products-styles/src/components/CoachmarkBeacon/_coachmark-beacon.scss @@ -1,4 +1,4 @@ -/* stylelint-disable carbon/layout-token-use */ +/* stylelint-disable carbon/layout-use */ /* stylelint-disable carbon/motion-easing-use */ /* stylelint-disable max-nesting-depth */ // @@ -44,7 +44,7 @@ $block-class: #{c4p-settings.$pkg-prefix}--coachmark-beacon; width: $spacing-04; height: $spacing-04; border-radius: 50%; - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ background-color: $blue-50; content: ''; } @@ -61,7 +61,7 @@ $block-class: #{c4p-settings.$pkg-prefix}--coachmark-beacon; height: 18px; border-radius: 100%; content: ''; - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ outline: $spacing-01 $focus solid; } } diff --git a/packages/ibm-products-styles/src/components/CoachmarkStack/_coachmark-stack.scss b/packages/ibm-products-styles/src/components/CoachmarkStack/_coachmark-stack.scss index 63dc01cef6..afc8c185eb 100644 --- a/packages/ibm-products-styles/src/components/CoachmarkStack/_coachmark-stack.scss +++ b/packages/ibm-products-styles/src/components/CoachmarkStack/_coachmark-stack.scss @@ -68,12 +68,12 @@ $stack-home-class: #{c4p-settings.$pkg-prefix}--coachmark-stacked-home; visibility: visible; &__light { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ background-color: $gray-90; } &__dark { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ background-color: $button-tertiary-active; } } diff --git a/packages/ibm-products-styles/src/components/ConditionBuilder/styles/_conditionBuilderItem.scss b/packages/ibm-products-styles/src/components/ConditionBuilder/styles/_conditionBuilderItem.scss index dd5a649325..bd3b95b762 100644 --- a/packages/ibm-products-styles/src/components/ConditionBuilder/styles/_conditionBuilderItem.scss +++ b/packages/ibm-products-styles/src/components/ConditionBuilder/styles/_conditionBuilderItem.scss @@ -26,7 +26,7 @@ $block-class: #{c4p-settings.$pkg-prefix}--condition-builder; z-index: -1; opacity: 0; pointer-events: none; - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ transform: translateX($translateValue); transition: all $duration-fast-02 motion(standard, productive); } @@ -204,24 +204,24 @@ $colors: ( //this is to select and add color to the new group preview .#{$block-class}__group-preview[data-color-index='#{($i%list.length($colors))}'] button { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ $next-group-color: list.nth($colors, (($i%list.length($colors)) + 1)); - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ box-shadow: inset 0 #{$spacing-01} 0 0 list.nth($next-group-color, 1); } //we need to select the group color from the $colors array and need to repeat the colors after $colors.length subgroups @for $el-index from 1 through 50 { $item-index: $el-index; - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ $item-index: ((($item-index - 1) % $group-colors-length) + 1); #{$selector} { @if $item-index != 1 { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ --#{$block-class}__condition-wrapper-color: #{list.nth( $group-colors, $item-index - )}; // stylelint-disable-line carbon/theme-token-use + )}; // stylelint-disable-line carbon/theme-use } } @@ -248,7 +248,7 @@ $colors: ( .#{$block-class}__add-button, .#{$block-class}__add-condition-sub-group ) { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ box-shadow: inset 0 #{$spacing-01} 0 0 var(--#{$block-class}__condition-wrapper-color); } } diff --git a/packages/ibm-products-styles/src/components/CreateInfluencer/_create-influencer.scss b/packages/ibm-products-styles/src/components/CreateInfluencer/_create-influencer.scss index e0dac708cd..4848180e0a 100644 --- a/packages/ibm-products-styles/src/components/CreateInfluencer/_create-influencer.scss +++ b/packages/ibm-products-styles/src/components/CreateInfluencer/_create-influencer.scss @@ -16,7 +16,7 @@ $influencerAnimationStart: calc(-1 * #{$spacing-05}); @keyframes influencer-menu-entrance { 0% { opacity: 0; - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use transform: translateX($influencerAnimationStart); } @@ -33,7 +33,7 @@ $influencerAnimationStart: calc(-1 * #{$spacing-05}); 100% { opacity: 0; - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use transform: translateX($influencerAnimationStart); } } diff --git a/packages/ibm-products-styles/src/components/CreateTearsheet/_create-tearsheet.scss b/packages/ibm-products-styles/src/components/CreateTearsheet/_create-tearsheet.scss index a0784c78c4..fcb5efe462 100644 --- a/packages/ibm-products-styles/src/components/CreateTearsheet/_create-tearsheet.scss +++ b/packages/ibm-products-styles/src/components/CreateTearsheet/_create-tearsheet.scss @@ -24,8 +24,7 @@ @keyframes step-content-entrance { 0% { opacity: 0; - // stylelint-disable-next-line carbon/layout-token-use - transform: translateY(-0.75rem); + transform: translateY(-$spacing-04); } 100% { diff --git a/packages/ibm-products-styles/src/components/DataSpreadsheet/_data-spreadsheet.scss b/packages/ibm-products-styles/src/components/DataSpreadsheet/_data-spreadsheet.scss index d92b7c77e2..56e51fd0cc 100644 --- a/packages/ibm-products-styles/src/components/DataSpreadsheet/_data-spreadsheet.scss +++ b/packages/ibm-products-styles/src/components/DataSpreadsheet/_data-spreadsheet.scss @@ -133,7 +133,7 @@ $header-cell-background: $layer-accent-01; overflow: hidden; min-width: initial; min-height: initial; - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ padding: 0 calc(#{$spacing-03} + 1px) 0 $spacing-03; margin: 0; background-color: $body-cell-background; @@ -158,7 +158,7 @@ $header-cell-background: $layer-accent-01; overflow: hidden; width: fit-content; max-width: var(--#{$block-class}--total-width); - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ padding: 0 calc(#{$spacing-03} + 1px) 0 $spacing-03; visibility: hidden; @@ -177,10 +177,10 @@ $header-cell-background: $layer-accent-01; overflow: hidden; // Could be fixed by using border-right but the fact that // this element is positioned absolute prevents that from working - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ padding-right: calc(#{$spacing-03} - 1px); padding-bottom: $spacing-01; - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ padding-left: calc(#{$spacing-03} - #{$spacing-01}); border: $spacing-01 solid $background-brand; background-color: $body-cell-background; diff --git a/packages/ibm-products-styles/src/components/Datagrid/styles/_datagrid.scss b/packages/ibm-products-styles/src/components/Datagrid/styles/_datagrid.scss index c95f880e1c..5361f14a25 100644 --- a/packages/ibm-products-styles/src/components/Datagrid/styles/_datagrid.scss +++ b/packages/ibm-products-styles/src/components/Datagrid/styles/_datagrid.scss @@ -57,7 +57,7 @@ td.#{c4p-settings.$carbon-prefix}--table-column-checkbox, th.#{c4p-settings.$carbon-prefix}--table-column-checkbox { - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ padding-top: 0.6875rem; &.#{$block-class}__checkbox-cell { @@ -158,7 +158,6 @@ /* This section to be removed after support for slug dropped - start */ .#{$block-class} th.#{$block-class}__with-slug { - /* stylelint-disable-next-line carbon/theme-token-use */ box-shadow: inset 0 1px $ai-border-strong; } @@ -185,7 +184,7 @@ .#{c4p-settings.$carbon-prefix}--data-table tbody tr.#{$block-class}__slug--row { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ box-shadow: inset 1px 0 $ai-border-strong; } @@ -232,7 +231,6 @@ /* This section to be removed after support for slug dropped - end */ .#{$block-class} th.#{$block-class}__with-ai-label { - /* stylelint-disable-next-line carbon/theme-token-use */ box-shadow: inset 0 1px $ai-border-strong; } @@ -259,7 +257,6 @@ .#{c4p-settings.$carbon-prefix}--data-table tbody tr.#{$block-class}__ai-label--row { - /* stylelint-disable-next-line carbon/theme-token-use */ box-shadow: inset 1px 0 $ai-border-strong; } @@ -677,9 +674,9 @@ &.#{$block-class}__carbon-row-expanded-hover-active::before { position: absolute; z-index: 2; - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ top: var(--#{$block-class}--row-height); - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ left: calc( var(--#{$block-class}--indicator-offset-amount) + #{$spacing-05} ); @@ -949,7 +946,7 @@ .#{$block-class}__col-resizer-range:focus + .#{$block-class}__col-resize-indicator::after { position: absolute; - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ top: calc(var(--#{$block-class}--row-height) - 20px); right: $spacing-02; width: 1px; diff --git a/packages/ibm-products-styles/src/components/Datagrid/styles/_draggableElement.scss b/packages/ibm-products-styles/src/components/Datagrid/styles/_draggableElement.scss index f6f0888ce4..c21f826a26 100644 --- a/packages/ibm-products-styles/src/components/Datagrid/styles/_draggableElement.scss +++ b/packages/ibm-products-styles/src/components/Datagrid/styles/_draggableElement.scss @@ -35,7 +35,7 @@ width: 100%; height: $spacing-09; border: 2px dashed $focus; - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ background-color: colors.$blue-10; // not good in dark mode } @@ -82,7 +82,7 @@ width: 100%; align-items: center; padding-left: $spacing-05; - /* stylelint-disable-next-line carbon/type-token-use */ + /* stylelint-disable-next-line carbon/type-use */ line-height: 1; // center align text within row transition-property: opacity; } diff --git a/packages/ibm-products-styles/src/components/Datagrid/styles/_useColumnRightAlign.scss b/packages/ibm-products-styles/src/components/Datagrid/styles/_useColumnRightAlign.scss index 502c71282c..dcd0608c1f 100644 --- a/packages/ibm-products-styles/src/components/Datagrid/styles/_useColumnRightAlign.scss +++ b/packages/ibm-products-styles/src/components/Datagrid/styles/_useColumnRightAlign.scss @@ -18,7 +18,7 @@ .#{variables.$block-class}__right-align-cell-renderer { width: 100%; - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ padding-right: 23px; text-align: right; } diff --git a/packages/ibm-products-styles/src/components/Datagrid/styles/_useExpandedRow.scss b/packages/ibm-products-styles/src/components/Datagrid/styles/_useExpandedRow.scss index c6224ea82a..cd7407f3f9 100644 --- a/packages/ibm-products-styles/src/components/Datagrid/styles/_useExpandedRow.scss +++ b/packages/ibm-products-styles/src/components/Datagrid/styles/_useExpandedRow.scss @@ -24,7 +24,7 @@ .#{variables.$block-class} .#{variables.$block-class}__expanded-row-content::before { position: absolute; - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ top: -1px; right: 0; width: calc(100% - #{$spacing-09}); diff --git a/packages/ibm-products-styles/src/components/Datagrid/styles/_useInlineEdit.scss b/packages/ibm-products-styles/src/components/Datagrid/styles/_useInlineEdit.scss index 129cd8fbf7..04c5a23263 100644 --- a/packages/ibm-products-styles/src/components/Datagrid/styles/_useInlineEdit.scss +++ b/packages/ibm-products-styles/src/components/Datagrid/styles/_useInlineEdit.scss @@ -54,7 +54,7 @@ $row-heights: ( } @mixin input-outline($color: $focus) { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ outline: $spacing-01 solid $color; outline-offset: calc(-1 * #{$spacing-01}); diff --git a/packages/ibm-products-styles/src/components/Datagrid/styles/_useNestedRows.scss b/packages/ibm-products-styles/src/components/Datagrid/styles/_useNestedRows.scss index d4e48ccd63..a30c98229c 100644 --- a/packages/ibm-products-styles/src/components/Datagrid/styles/_useNestedRows.scss +++ b/packages/ibm-products-styles/src/components/Datagrid/styles/_useNestedRows.scss @@ -42,7 +42,7 @@ tr.#{$block-class}__carbon-nested-row + :not(tr.#{$block-class}__carbon-nested-row)::after { position: absolute; - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ top: -1px; left: 0; width: 100%; @@ -91,7 +91,7 @@ td.#{$block-class}__expandable-row-cell + td::before { position: absolute; - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ bottom: -1px; left: 0; width: 1rem; diff --git a/packages/ibm-products-styles/src/components/Datagrid/styles/addons/_CustomizeColumnsTearsheet.scss b/packages/ibm-products-styles/src/components/Datagrid/styles/addons/_CustomizeColumnsTearsheet.scss index 86b5cf2ae6..2f0ef9024f 100644 --- a/packages/ibm-products-styles/src/components/Datagrid/styles/addons/_CustomizeColumnsTearsheet.scss +++ b/packages/ibm-products-styles/src/components/Datagrid/styles/addons/_CustomizeColumnsTearsheet.scss @@ -5,7 +5,7 @@ // LICENSE file in the root directory of this source tree. // -// stylelint-disable carbon/layout-token-use +// stylelint-disable carbon/layout-use @use '@carbon/styles/scss/theme' as *; @use '@carbon/styles/scss/spacing'; diff --git a/packages/ibm-products-styles/src/components/Datagrid/styles/addons/_FilterFlyout.scss b/packages/ibm-products-styles/src/components/Datagrid/styles/addons/_FilterFlyout.scss index 2ce0ae9033..db4e45fc90 100644 --- a/packages/ibm-products-styles/src/components/Datagrid/styles/addons/_FilterFlyout.scss +++ b/packages/ibm-products-styles/src/components/Datagrid/styles/addons/_FilterFlyout.scss @@ -5,7 +5,7 @@ // LICENSE file in the root directory of this source tree. // -// stylelint-disable carbon/layout-token-use +// stylelint-disable carbon/layout-use @use '@carbon/styles/scss/theme' as *; @use '@carbon/layout/scss/convert' as *; diff --git a/packages/ibm-products-styles/src/components/Datagrid/styles/addons/_FilterPanel.scss b/packages/ibm-products-styles/src/components/Datagrid/styles/addons/_FilterPanel.scss index fb2095ad16..5bcc4eaa82 100644 --- a/packages/ibm-products-styles/src/components/Datagrid/styles/addons/_FilterPanel.scss +++ b/packages/ibm-products-styles/src/components/Datagrid/styles/addons/_FilterPanel.scss @@ -41,7 +41,7 @@ position: relative; z-index: 0; overflow: auto; - padding: 0 $spacing-05 $spacing-10 $spacing-05; + padding: 0 $spacing-05 $spacing-10; overscroll-behavior: contain; } diff --git a/packages/ibm-products-styles/src/components/Datagrid/styles/addons/_RowSizeDropdown.scss b/packages/ibm-products-styles/src/components/Datagrid/styles/addons/_RowSizeDropdown.scss index e8828ca11a..5abd202a9f 100644 --- a/packages/ibm-products-styles/src/components/Datagrid/styles/addons/_RowSizeDropdown.scss +++ b/packages/ibm-products-styles/src/components/Datagrid/styles/addons/_RowSizeDropdown.scss @@ -32,8 +32,7 @@ .#{c4p-settings.$carbon-prefix}--popover--bottom-right.#{variables.$block-class}__row-height-settings-popover .#{c4p-settings.$carbon-prefix}--popover-caret { // Used to fix layout issue with IconButton caret inside of Popover component - /* stylelint-disable-next-line carbon/layout-token-use */ - left: -4px; + left: -$spacing-02; } .#{variables.$block-class}__row-size-toggle-tip-button.#{c4p-settings.$carbon-prefix}--toggletip-button { diff --git a/packages/ibm-products-styles/src/components/DecoratorBase/_decorator-base-mixins.scss b/packages/ibm-products-styles/src/components/DecoratorBase/_decorator-base-mixins.scss index a9910da1e7..a6b6764559 100644 --- a/packages/ibm-products-styles/src/components/DecoratorBase/_decorator-base-mixins.scss +++ b/packages/ibm-products-styles/src/components/DecoratorBase/_decorator-base-mixins.scss @@ -5,7 +5,7 @@ // LICENSE file in the root directory of this source tree. // -/* stylelint-disable carbon/layout-token-use */ +/* stylelint-disable carbon/layout-use */ @use '@carbon/styles/scss/theme' as *; diff --git a/packages/ibm-products-styles/src/components/DecoratorBase/_decorator-base.scss b/packages/ibm-products-styles/src/components/DecoratorBase/_decorator-base.scss index fd54e28f90..261d3a4c2b 100644 --- a/packages/ibm-products-styles/src/components/DecoratorBase/_decorator-base.scss +++ b/packages/ibm-products-styles/src/components/DecoratorBase/_decorator-base.scss @@ -1,6 +1,6 @@ -/* stylelint-disable carbon/theme-token-use */ -/* stylelint-disable carbon/type-token-use */ -/* stylelint-disable carbon/layout-token-use */ +/* stylelint-disable carbon/theme-use */ +/* stylelint-disable carbon/type-use */ +/* stylelint-disable carbon/layout-use */ /* stylelint-disable function-no-unknown */ // diff --git a/packages/ibm-products-styles/src/components/DecoratorDualButton/_decorator-dual-button.scss b/packages/ibm-products-styles/src/components/DecoratorDualButton/_decorator-dual-button.scss index fe623c9a4f..498fc60557 100644 --- a/packages/ibm-products-styles/src/components/DecoratorDualButton/_decorator-dual-button.scss +++ b/packages/ibm-products-styles/src/components/DecoratorDualButton/_decorator-dual-button.scss @@ -1,4 +1,4 @@ -/* stylelint-disable carbon/theme-token-use */ +/* stylelint-disable carbon/theme-use */ /* stylelint-disable function-no-unknown */ // diff --git a/packages/ibm-products-styles/src/components/DecoratorSingleButton/_decorator-single-button.scss b/packages/ibm-products-styles/src/components/DecoratorSingleButton/_decorator-single-button.scss index 89d2a80879..478d2aafec 100644 --- a/packages/ibm-products-styles/src/components/DecoratorSingleButton/_decorator-single-button.scss +++ b/packages/ibm-products-styles/src/components/DecoratorSingleButton/_decorator-single-button.scss @@ -1,5 +1,5 @@ /* stylelint-disable function-no-unknown */ -/* stylelint-disable carbon/theme-token-use */ +/* stylelint-disable carbon/theme-use */ // // Copyright IBM Corp. 2024, 2024 diff --git a/packages/ibm-products-styles/src/components/EditTearsheet/_edit-tearsheet.scss b/packages/ibm-products-styles/src/components/EditTearsheet/_edit-tearsheet.scss index 72a5a16db1..897161f761 100644 --- a/packages/ibm-products-styles/src/components/EditTearsheet/_edit-tearsheet.scss +++ b/packages/ibm-products-styles/src/components/EditTearsheet/_edit-tearsheet.scss @@ -29,8 +29,7 @@ @keyframes form-content-entrance { 0% { opacity: 0; - // stylelint-disable-next-line carbon/layout-token-use - transform: translateY(-0.75rem); + transform: translateY(-$spacing-04); } 100% { diff --git a/packages/ibm-products-styles/src/components/EditUpdateCards/_edit-update-cards.scss b/packages/ibm-products-styles/src/components/EditUpdateCards/_edit-update-cards.scss index 7e23d64e6c..734328ee22 100644 --- a/packages/ibm-products-styles/src/components/EditUpdateCards/_edit-update-cards.scss +++ b/packages/ibm-products-styles/src/components/EditUpdateCards/_edit-update-cards.scss @@ -31,11 +31,11 @@ $block-class: #{c4p-settings.$pkg-prefix}--edit-update-cards; .#{c4p-settings.$pkg-prefix}--card__header, .#{c4p-settings.$pkg-prefix}--card__footer { button { - // stylelint-disable-next-line carbon/theme-token-use + // stylelint-disable-next-line carbon/theme-use color: $white-0; &:hover { - // stylelint-disable-next-line carbon/theme-token-use + // stylelint-disable-next-line carbon/theme-use background-color: $blue-60-hover; } @@ -45,7 +45,7 @@ $block-class: #{c4p-settings.$pkg-prefix}--edit-update-cards; svg { path { - // stylelint-disable-next-line carbon/theme-token-use + // stylelint-disable-next-line carbon/theme-use fill: $white-0; } } @@ -59,9 +59,9 @@ $block-class: #{c4p-settings.$pkg-prefix}--edit-update-cards; } .#{c4p-settings.$pkg-prefix}--card__footer { - // stylelint-disable-next-line carbon/theme-token-use + // stylelint-disable-next-line carbon/theme-use background-color: $blue-60; - // stylelint-disable-next-line carbon/theme-token-use + // stylelint-disable-next-line carbon/theme-use color: $white-0; } @@ -85,9 +85,9 @@ $block-class: #{c4p-settings.$pkg-prefix}--edit-update-cards; &:not(.#{$block-class}__actions-bottom) { &##{$block-class}--edit { .#{c4p-settings.$pkg-prefix}--card__header { - // stylelint-disable-next-line carbon/theme-token-use + // stylelint-disable-next-line carbon/theme-use background-color: $blue-60; - // stylelint-disable-next-line carbon/theme-token-use + // stylelint-disable-next-line carbon/theme-use color: $white-0; } } diff --git a/packages/ibm-products-styles/src/components/FullPageError/_full-page-error.scss b/packages/ibm-products-styles/src/components/FullPageError/_full-page-error.scss index c0241b4920..f0f3902646 100644 --- a/packages/ibm-products-styles/src/components/FullPageError/_full-page-error.scss +++ b/packages/ibm-products-styles/src/components/FullPageError/_full-page-error.scss @@ -49,7 +49,7 @@ $block-class: #{c4p-settings.$pkg-prefix}--full-page-error; height: 100%; padding: $spacing-03 $spacing-03 $spacing-11 $spacing-03; @include breakpoint(md) { - padding: auto $spacing-03 $spacing-11 $spacing-03; + padding: auto $spacing-03 $spacing-11; } } diff --git a/packages/ibm-products-styles/src/components/GetStartedCard/_get-started-card.scss b/packages/ibm-products-styles/src/components/GetStartedCard/_get-started-card.scss index 88618059ea..947df1de3d 100644 --- a/packages/ibm-products-styles/src/components/GetStartedCard/_get-started-card.scss +++ b/packages/ibm-products-styles/src/components/GetStartedCard/_get-started-card.scss @@ -1,4 +1,4 @@ -/* stylelint-disable carbon/layout-token-use */ +/* stylelint-disable carbon/layout-use */ /* stylelint-disable max-nesting-depth */ // // Copyright IBM Corp. 2024, 2024 diff --git a/packages/ibm-products-styles/src/components/Guidebanner/_guidebanner.scss b/packages/ibm-products-styles/src/components/Guidebanner/_guidebanner.scss index a0ccd3a56d..62b61321a8 100644 --- a/packages/ibm-products-styles/src/components/Guidebanner/_guidebanner.scss +++ b/packages/ibm-products-styles/src/components/Guidebanner/_guidebanner.scss @@ -15,9 +15,9 @@ * individual rules. */ -/* stylelint-disable carbon/layout-token-use */ +/* stylelint-disable carbon/layout-use */ /* stylelint-disable carbon/motion-duration-use */ -/* stylelint-disable carbon/theme-token-use */ +/* stylelint-disable carbon/theme-use */ /* stylelint-disable declaration-no-important */ /* stylelint-disable function-no-unknown */ /* stylelint-disable max-nesting-depth */ @@ -105,7 +105,7 @@ $purple-3: #7433e3; // Specify Carousel look and feel. .#{$block-class}__carousel { - padding: 0 0 $spacing-05 0; + padding: 0 0 $spacing-05; color: $gray-10; @include when-collapsed() { @@ -173,7 +173,7 @@ $purple-3: #7433e3; // Repeating here. svg { position: absolute; - right: 1rem; + right: $spacing-05; width: 1rem; height: 1rem; flex-shrink: 0; diff --git a/packages/ibm-products-styles/src/components/HTTPErrors/_http-errors.scss b/packages/ibm-products-styles/src/components/HTTPErrors/_http-errors.scss index 095e3d0b18..ceba24db55 100644 --- a/packages/ibm-products-styles/src/components/HTTPErrors/_http-errors.scss +++ b/packages/ibm-products-styles/src/components/HTTPErrors/_http-errors.scss @@ -69,7 +69,7 @@ $block-class-other: #{c4p-settings.$pkg-prefix}--http-errors-other; transform: scale(1.5); } } -/* stylelint-disable carbon/theme-token-use */ +/* stylelint-disable carbon/theme-use */ .#{$block-class-404}__prefix-cls-1 { fill: none; diff --git a/packages/ibm-products-styles/src/components/InlineTip/_inline-tip.scss b/packages/ibm-products-styles/src/components/InlineTip/_inline-tip.scss index 0721095a73..03b7bd21b1 100644 --- a/packages/ibm-products-styles/src/components/InlineTip/_inline-tip.scss +++ b/packages/ibm-products-styles/src/components/InlineTip/_inline-tip.scss @@ -15,8 +15,8 @@ * instead of many individual rules. */ -/* stylelint-disable carbon/layout-token-use */ -/* stylelint-disable carbon/theme-token-use */ +/* stylelint-disable carbon/layout-use */ +/* stylelint-disable carbon/theme-use */ /* stylelint-disable declaration-no-important */ /* stylelint-disable function-no-unknown */ /* stylelint-disable max-nesting-depth */ @@ -177,7 +177,7 @@ $purple: #7f3ae7; } .#{$block-class} .#{$block-class}__close-icon { - padding: to-rem(6px) 0 0 0; + padding: to-rem(6px) 0 0; block-size: $spacing-07; color: $white-0; inline-size: $spacing-07; @@ -221,7 +221,7 @@ $purple: #7f3ae7; // Repeating here. svg { position: absolute; - right: 1rem; + right: $spacing-05; width: 1rem; height: 1rem; flex-shrink: 0; diff --git a/packages/ibm-products-styles/src/components/InterstitialScreen/_interstitial-screen.scss b/packages/ibm-products-styles/src/components/InterstitialScreen/_interstitial-screen.scss index 75aac6398e..c22b912532 100644 --- a/packages/ibm-products-styles/src/components/InterstitialScreen/_interstitial-screen.scss +++ b/packages/ibm-products-styles/src/components/InterstitialScreen/_interstitial-screen.scss @@ -87,7 +87,7 @@ $one-grid-column: calc(100% / 16); &--container { min-width: 47rem; max-width: 82rem; - margin: calc($spacing-10 * 2) auto; // stylelint-disable-line carbon/layout-token-use + margin: calc($spacing-10 * 2) auto; // stylelint-disable-line carbon/layout-use background-color: $background; } @@ -220,17 +220,17 @@ $one-grid-column: calc(100% / 16); height: $spacing-09; padding-left: $spacing-05; border-bottom: 1px solid $border-subtle-01; - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ background-color: $gray-100; - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ color: $gray-10; - /* stylelint-disable-next-line carbon/type-token-use */ + /* stylelint-disable-next-line carbon/type-use */ font-weight: normal !important; // overrides type style above - /* stylelint-disable-next-line carbon/type-token-use */ + /* stylelint-disable-next-line carbon/type-use */ line-height: $spacing-09 !important; b { - /* stylelint-disable-next-line carbon/type-token-use */ + /* stylelint-disable-next-line carbon/type-use */ font-weight: 600; } } diff --git a/packages/ibm-products-styles/src/components/NonLinearReading/_non-linear-reading.scss b/packages/ibm-products-styles/src/components/NonLinearReading/_non-linear-reading.scss index 24ef63121b..c886808b16 100644 --- a/packages/ibm-products-styles/src/components/NonLinearReading/_non-linear-reading.scss +++ b/packages/ibm-products-styles/src/components/NonLinearReading/_non-linear-reading.scss @@ -5,7 +5,7 @@ // LICENSE file in the root directory of this source tree. // -/* stylelint-disable carbon/layout-token-use */ +/* stylelint-disable carbon/layout-use */ /* stylelint-disable function-no-unknown */ // Standard imports. @@ -70,7 +70,7 @@ $block-class: #{c4p-settings.$pkg-prefix}--non-linear-reading; } // The "up" chevron .#{$block-class} .#{$block-class}__keyword svg { - margin: to-rem(1px) 0 0 0; + margin: to-rem(1px) 0 0; vertical-align: text-top; } diff --git a/packages/ibm-products-styles/src/components/NotificationsPanel/_notifications-panel.scss b/packages/ibm-products-styles/src/components/NotificationsPanel/_notifications-panel.scss index 5cb12d86f1..a310801225 100644 --- a/packages/ibm-products-styles/src/components/NotificationsPanel/_notifications-panel.scss +++ b/packages/ibm-products-styles/src/components/NotificationsPanel/_notifications-panel.scss @@ -23,7 +23,7 @@ $block-class: #{c4p-settings.$pkg-prefix}--notifications-panel; @keyframes fade-in { 0% { opacity: 0; - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use transform: translateY(-38.5rem); // the height of the notification panel } @@ -41,7 +41,7 @@ $block-class: #{c4p-settings.$pkg-prefix}--notifications-panel; 100% { opacity: 0; - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use transform: translateY(-38.5rem); // the height of the notification panel } } @@ -93,7 +93,7 @@ $block-class: #{c4p-settings.$pkg-prefix}--notifications-panel; position: sticky; z-index: 2; - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use top: 4.8125rem; padding: $spacing-03 $spacing-05; background-color: $layer-01; diff --git a/packages/ibm-products-styles/src/components/OptionsTile/_options-tile.scss b/packages/ibm-products-styles/src/components/OptionsTile/_options-tile.scss index 266e2da90e..9858189cbb 100644 --- a/packages/ibm-products-styles/src/components/OptionsTile/_options-tile.scss +++ b/packages/ibm-products-styles/src/components/OptionsTile/_options-tile.scss @@ -121,12 +121,12 @@ $block-class: #{c4p-settings.$pkg-prefix}--options-tile; } .#{$block-class}__summary--warn svg path[fill='none'] { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ fill: $black-100; } .#{$block-class}__summary--warn svg path[fill='none'] { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ fill: $black-100; } @@ -134,7 +134,7 @@ $block-class: #{c4p-settings.$pkg-prefix}--options-tile; overflow: hidden; height: max-content; // spacing-05 + toggle width - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use padding-right: calc(#{$spacing-05} + 2rem); text-overflow: ellipsis; white-space: nowrap; @@ -149,7 +149,7 @@ $block-class: #{c4p-settings.$pkg-prefix}--options-tile; .#{$block-class}__content { padding-right: $spacing-05; // spacing-05 + chevron size + spacing-05 - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use padding-left: calc(#{$spacing-05} * 2 + 1rem); } @@ -208,14 +208,12 @@ $block-class: #{c4p-settings.$pkg-prefix}--options-tile; .#{$block-class}--lg .#{$block-class}__toggle { // "top" shouldn't be spacing token as it depends on the toggle size - // stylelint-disable-next-line carbon/layout-token-use - top: 1rem; + top: $spacing-05; } .#{$block-class}--xl .#{$block-class}__toggle { // "top" shouldn't be spacing token as it depends on the toggle size - // stylelint-disable-next-line carbon/layout-token-use - top: 1.5rem; + top: $spacing-06; } .#{$block-class}--lg .#{$block-class}__summary { diff --git a/packages/ibm-products-styles/src/components/PageHeader/_page-header.scss b/packages/ibm-products-styles/src/components/PageHeader/_page-header.scss index cb12a5cdf2..fa1adf8ebe 100644 --- a/packages/ibm-products-styles/src/components/PageHeader/_page-header.scss +++ b/packages/ibm-products-styles/src/components/PageHeader/_page-header.scss @@ -38,27 +38,27 @@ $right-section-alt-width: 100% - $left-section-alt-width; @keyframes background-appear { from { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ background-color: var(--from-color); } to { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ background-color: var(--to-color); } } @keyframes background-and-shadow-appear { from { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ background-color: var(--from-color); - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ box-shadow: 0 1px 0 var(--from-color); } to { - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ background-color: var(--to-color); - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ box-shadow: 0 1px 0 var(--to-color-shadow); } } @@ -69,11 +69,11 @@ $right-section-alt-width: 100% - $left-section-alt-width; $to-color: $layer-01, $to-color-shadow: $layer-accent-01 ) { - // stylelint-disable-next-line carbon/theme-token-use + // stylelint-disable-next-line carbon/theme-use --from-color: #{$from-color}; - // stylelint-disable-next-line carbon/theme-token-use + // stylelint-disable-next-line carbon/theme-use --to-color: #{$to-color}; - // stylelint-disable-next-line carbon/theme-token-use + // stylelint-disable-next-line carbon/theme-use --to-color-shadow: #{$to-color-shadow}; position: absolute; @@ -107,7 +107,7 @@ $right-section-alt-width: 100% - $left-section-alt-width; /* z-index used to raise above any position relative content as per Carbon header */ /* dropped 1 below Carbon header so as not to overlay the side panel */ z-index: $z-index-header-minus; - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ top: var(--#{$block-class}--header-top); display: inline-block; /* cause top/bottom margin to reserve space */ width: 100%; @@ -417,7 +417,7 @@ $right-section-alt-width: 100% - $left-section-alt-width; .#{$block-class}__breadcrumb-row--has-breadcrumbs + .#{$block-class}__title-row--sticky { - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use top: calc( var(--#{$block-class}--breadcrumb-top) - var(--title-row-margin-top) ); @@ -473,8 +473,10 @@ $right-section-alt-width: 100% - $left-section-alt-width; .#{$block-class}__title-icon { margin-right: $spacing-04; - // stylelint-disable-next-line carbon/layout-token-use - transform: translateY(-2px); // positional tweak requested by design review + // stylelint-disable-next-line carbon/layout-use + transform: translateY( + -$spacing-01 + ); // positional tweak requested by design review vertical-align: middle; } diff --git a/packages/ibm-products-styles/src/components/ProductiveCard/_productive-card.scss b/packages/ibm-products-styles/src/components/ProductiveCard/_productive-card.scss index d0f9c45fcf..29efad8e3f 100644 --- a/packages/ibm-products-styles/src/components/ProductiveCard/_productive-card.scss +++ b/packages/ibm-products-styles/src/components/ProductiveCard/_productive-card.scss @@ -52,9 +52,9 @@ $block-class: #{c4p-settings.$pkg-prefix}--card; .#{$block-class}__actions-header-ghost-button { min-height: $spacing-07; - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use padding-right: calc($spacing-01 + $spacing-03); - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use padding-left: calc($spacing-01 + $spacing-03); /* stylelint-disable-next-line max-nesting-depth */ diff --git a/packages/ibm-products-styles/src/components/SidePanel/_side-panel.scss b/packages/ibm-products-styles/src/components/SidePanel/_side-panel.scss index 4ac8a7d741..ea8f7818f7 100644 --- a/packages/ibm-products-styles/src/components/SidePanel/_side-panel.scss +++ b/packages/ibm-products-styles/src/components/SidePanel/_side-panel.scss @@ -5,6 +5,9 @@ // LICENSE file in the root directory of this source tree. // +@use 'sass:list'; +@use 'sass:map'; + // Other Carbon settings. @use '@carbon/styles/scss/theme' as *; @use '@carbon/styles/scss/spacing' as *; @@ -22,12 +25,11 @@ // SidePanel uses the following IBM Products components: // ActionSet @use '../ActionSet/action-set'; -@use 'sass:list'; $block-class: #{c4p-settings.$pkg-prefix}--side-panel; $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set; -@mixin setPanelSize($size: map-get($side-panel-sizes, md)) { +@mixin setPanelSize($size: map.get($side-panel-sizes, md)) { /* any value is single value list */ width: list.nth($size, 1); @if list.length($size) > 1 { @@ -51,7 +53,7 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set; @mixin setCommonTitleStyles() { display: -webkit-box; overflow: hidden; - /* stylelint-disable-next-line carbon/layout-token-use -- custom css property set below */ + /* stylelint-disable-next-line carbon/layout-use -- custom css property set below */ padding-right: var(--#{$block-class}--title-padding-right); -webkit-box-orient: vertical; -webkit-line-clamp: 2; @@ -121,7 +123,7 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set; position: sticky; z-index: 4; - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ top: calc(-1px * var(--#{$block-class}--scroll-animation-distance)); min-height: $spacing-08; padding: $spacing-05; @@ -217,7 +219,7 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set; .#{$block-class}__title { position: sticky; z-index: 4; - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ top: var(--#{$block-class}--title-stop); /* border-bottom used instead of padding which wrapped text shows through */ @@ -234,7 +236,7 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set; } .#{$block-class}__title--no-label .#{$block-class}__title-text { - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ transform: translateY( calc( -1 * #{$spacing-05} * var(--#{$block-class}--scroll-animation-progress) @@ -261,13 +263,12 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set; @include setCommonTitleStyles(); position: absolute; - /* stylelint-disable-next-line carbon/layout-token-use */ top: 0; opacity: var(--#{$block-class}--scroll-animation-progress); } .#{$block-class}__title--no-label .#{$block-class}__collapsed-title-text { - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ transform: translateY( calc( #{$spacing-05} * (1 - var(--#{$block-class}--scroll-animation-progress)) @@ -409,7 +410,7 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set; } &.#{$block-class}.#{$block-class}--xs .#{$block-class}__actions-container.#{$action-set-block-class}--sm { - @include setPanelSize(map-get($side-panel-sizes, xs)); + @include setPanelSize(map.get($side-panel-sizes, xs)); } } @@ -453,7 +454,7 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set; height: 1px; padding: 0; border: 0; - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use margin: -1px; clip: rect(0, 0, 0, 0); visibility: inherit; @@ -471,6 +472,5 @@ $action-set-block-class: #{c4p-settings.$pkg-prefix}--action-set; .#{$block-class}--has-slug + .#{$block-class}__overlay, .#{$block-class}--has-ai-label + .#{$block-class}__overlay { - /* stylelint-disable-next-line carbon/theme-token-use */ background-color: $ai-overlay; } diff --git a/packages/ibm-products-styles/src/components/StatusIcon/_status-icon.scss b/packages/ibm-products-styles/src/components/StatusIcon/_status-icon.scss index 5f04fb8a46..95ba5f6485 100644 --- a/packages/ibm-products-styles/src/components/StatusIcon/_status-icon.scss +++ b/packages/ibm-products-styles/src/components/StatusIcon/_status-icon.scss @@ -5,6 +5,8 @@ // LICENSE file in the root directory of this source tree. // +@use 'sass:map'; + // Standard imports. @use '@carbon/react/scss/colors' as *; @use '../../global/styles/project-settings' as *; @@ -74,8 +76,8 @@ $themes: ('light', 'dark'); $block-class: #{$pkg-prefix}--status-icon; @function carbon-clr($name, $theme: light) { - // stylelint-disable-next-line carbon/theme-token-use - $color: map-get(map-get($colors, $name), $theme); + // stylelint-disable-next-line carbon/theme-use + $color: map.get(map.get($colors, $name), $theme); @return $color; } @@ -96,7 +98,7 @@ $block-class: #{$pkg-prefix}--status-icon; .#{$block-class}--light.#{$block-class}--light-minor-warning, .#{$block-class}--dark.#{$block-class}--dark-minor-warning { - // stylelint-disable-next-line carbon/theme-token-use + // stylelint-disable-next-line carbon/theme-use fill: $yellow-20; } @@ -106,7 +108,7 @@ $block-class: #{$pkg-prefix}--status-icon; .#{$block-class}--light.#{$block-class}--light-minor-warning path:nth-of-type(1), .#{$block-class}--dark.#{$block-class}--dark-minor-warning path:nth-of-type(1) { - // stylelint-disable-next-line carbon/theme-token-use + // stylelint-disable-next-line carbon/theme-use fill: $gray-100; } @@ -124,13 +126,13 @@ $block-class: #{$pkg-prefix}--status-icon; } // stylelint-disable-next-line carbon/motion-duration-use, carbon/motion-easing-use animation: rotating 8000ms infinite linear; - // stylelint-disable-next-line carbon/theme-token-use + // stylelint-disable-next-line carbon/theme-use fill: carbon-clr($icon, $theme); } @else if $icon == running { - // stylelint-disable-next-line carbon/theme-token-use + // stylelint-disable-next-line carbon/theme-use fill: carbon-clr($icon, $theme); } @else { - // stylelint-disable-next-line carbon/theme-token-use + // stylelint-disable-next-line carbon/theme-use fill: carbon-clr($icon, $theme); @media (prefers-reduced-motion) { .#{$block-class}--#{$theme}.#{$block-class}--#{$theme-key}-in-progress { diff --git a/packages/ibm-products-styles/src/components/StatusIndicator/_status-indicator.scss b/packages/ibm-products-styles/src/components/StatusIndicator/_status-indicator.scss index 4cd88062ca..06fc474a26 100644 --- a/packages/ibm-products-styles/src/components/StatusIndicator/_status-indicator.scss +++ b/packages/ibm-products-styles/src/components/StatusIndicator/_status-indicator.scss @@ -5,7 +5,7 @@ // LICENSE file in the root directory of this source tree. // -/* stylelint-disable carbon/layout-token-use */ +/* stylelint-disable carbon/layout-use */ /* stylelint-disable function-no-unknown */ // Standard imports. diff --git a/packages/ibm-products-styles/src/components/Tearsheet/_tearsheet.scss b/packages/ibm-products-styles/src/components/Tearsheet/_tearsheet.scss index ae573cc8cd..eb5375a4f5 100644 --- a/packages/ibm-products-styles/src/components/Tearsheet/_tearsheet.scss +++ b/packages/ibm-products-styles/src/components/Tearsheet/_tearsheet.scss @@ -22,7 +22,7 @@ $block-class: #{$pkg-prefix}--tearsheet; -// stylelint-disable-next-line carbon/theme-token-use +// stylelint-disable-next-line carbon/theme-use $motion-duration: $duration-moderate-02; @include block-wrap($block-class) { @@ -105,7 +105,7 @@ $motion-duration: $duration-moderate-02; // viewport, capped at 500px to set an upper limit on the movement speed // For the reason for calc() see https://github.com/sass/sass/issues/2849 // and https://github.com/sass/node-sass/issues/2815. - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use transform: translate3d(0, calc(min(95vh, 500px)), 0); } @@ -289,7 +289,7 @@ $motion-duration: $duration-moderate-02; &.#{$block-class}--wide.#{$block-class}--has-ai-label .#{$block-class}__header.#{$block-class}__header--with-close-icon { /* spacing 11 plus additional space for slug/close */ - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ padding-inline-end: calc(#{$spacing-11 + $spacing-09}); } @@ -427,7 +427,6 @@ $motion-duration: $duration-moderate-02; &.#{$block-class}--has-slug, &.#{$block-class}--has-ai-label { - /* stylelint-disable-next-line carbon/theme-token-use */ --overlay-color: #{$ai-overlay}; } @@ -436,7 +435,8 @@ $motion-duration: $duration-moderate-02; &.#{$block-class}--has-ai-label:not(.#{$block-class}--has-close) .#{$carbon-prefix}--slug { inset-inline-end: 0; + /* stylelint-disable-next-line carbon/layout-use */ margin-block: 6px; - margin-inline-end: 1rem; + margin-inline-end: $spacing-05; } } diff --git a/packages/ibm-products-styles/src/components/UserAvatar/_user-avatar.scss b/packages/ibm-products-styles/src/components/UserAvatar/_user-avatar.scss index a71d2fe7d4..b97008d239 100644 --- a/packages/ibm-products-styles/src/components/UserAvatar/_user-avatar.scss +++ b/packages/ibm-products-styles/src/components/UserAvatar/_user-avatar.scss @@ -5,6 +5,8 @@ // LICENSE file in the root directory of this source tree. // +@use 'sass:map'; + // Standard imports. @use '../../global/styles/project-settings' as *; @use '../../global/styles/mixins'; @@ -34,7 +36,7 @@ $sizes: ( ); @mixin size($size) { - $_size: map-get($sizes, $size); + $_size: map.get($sizes, $size); width: $_size; height: $_size; @@ -60,7 +62,7 @@ $sizes: ( .#{$block-class}__tooltip { &:focus-within .#{$block-class} { - // stylelint-disable-next-line carbon/theme-token-use + // stylelint-disable-next-line carbon/theme-use outline: 2px solid $focus; outline-offset: 1px; } @@ -72,7 +74,7 @@ $sizes: ( } @mixin setBgColor($color) { - // stylelint-disable-next-line carbon/theme-token-use + // stylelint-disable-next-line carbon/theme-use background-color: $color; } diff --git a/packages/ibm-products-styles/src/components/UserProfileImage/_user-profile-image.scss b/packages/ibm-products-styles/src/components/UserProfileImage/_user-profile-image.scss index eb3edddaa2..ff9d32b5da 100644 --- a/packages/ibm-products-styles/src/components/UserProfileImage/_user-profile-image.scss +++ b/packages/ibm-products-styles/src/components/UserProfileImage/_user-profile-image.scss @@ -5,6 +5,8 @@ // LICENSE file in the root directory of this source tree. // +@use 'sass:map'; + // Standard imports. @use '@carbon/styles/scss/theme' as *; @use '@carbon/styles/scss/spacing' as *; @@ -24,7 +26,7 @@ $sizes: ( ); @mixin size($size) { - $_size: map-get($sizes, $size); + $_size: map.get($sizes, $size); width: $_size; height: $_size; @@ -45,9 +47,9 @@ $themes: ( $theme-keys: map-keys($themes); @function carbon-get-background-color($color, $key, $contrast-key) { - @return map-get( + @return map.get( $carbon-colors, - #{$color}#{map-get(map-get($themes, $key), #{$contrast-key}-contrast)} + #{$color}#{map.get(map.get($themes, $key), #{$contrast-key}-contrast)} ); } @@ -58,7 +60,7 @@ $theme-keys: map-keys($themes); @each $color in $base-colors { @each $contrast-key in $theme-keys { .#{$block-class}--#{$key}.#{$block-class}--#{$contrast-key}-#{$color} { - // stylelint-disable-next-line carbon/theme-token-use + // stylelint-disable-next-line carbon/theme-use background-color: carbon-get-background-color( $color, $key, diff --git a/packages/ibm-products-styles/src/components/WebTerminal/_web-terminal.scss b/packages/ibm-products-styles/src/components/WebTerminal/_web-terminal.scss index c804c35ab1..466458d27f 100644 --- a/packages/ibm-products-styles/src/components/WebTerminal/_web-terminal.scss +++ b/packages/ibm-products-styles/src/components/WebTerminal/_web-terminal.scss @@ -18,7 +18,7 @@ $block-class: #{$pkg-prefix}--web-terminal; @keyframes web-terminal-entrance { from { opacity: 0; - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use transform: translateX(#{$web-terminal-width}); } @@ -36,7 +36,7 @@ $block-class: #{$pkg-prefix}--web-terminal; to { opacity: 0; - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use transform: translateX(#{$web-terminal-width}); } } diff --git a/packages/ibm-products-web-components/CHANGELOG.md b/packages/ibm-products-web-components/CHANGELOG.md index fdc379f13d..2833b0b306 100644 --- a/packages/ibm-products-web-components/CHANGELOG.md +++ b/packages/ibm-products-web-components/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [0.4.0](https://github.com/carbon-design-system/ibm-products/compare/@carbon/ibm-products-web-components@0.4.0-rc.0...@carbon/ibm-products-web-components@0.4.0) (2024-12-04) + +**Note:** Version bump only for package @carbon/ibm-products-web-components + + + + + # [0.4.0-rc.0](https://github.com/carbon-design-system/ibm-products/compare/@carbon/ibm-products-web-components@0.3.0-rc.0...@carbon/ibm-products-web-components@0.4.0-rc.0) (2024-11-25) diff --git a/packages/ibm-products-web-components/package.json b/packages/ibm-products-web-components/package.json index 258e3bdfaf..e20a8d0e1a 100644 --- a/packages/ibm-products-web-components/package.json +++ b/packages/ibm-products-web-components/package.json @@ -1,7 +1,7 @@ { "name": "@carbon/ibm-products-web-components", "description": "Carbon for IBM Products Web Components", - "version": "0.4.0-rc.0", + "version": "0.4.0", "license": "Apache-2.0", "main": "es/index.js", "module": "es/index.js", @@ -49,13 +49,13 @@ "wca": "web-component-analyzer analyze src --outFile custom-elements.json" }, "dependencies": { - "@carbon/ibm-products-styles": "^2.51.0-rc.0", - "@carbon/styles": "1.69.0", - "@carbon/web-components": "2.17.0", + "@carbon/ibm-products-styles": "^2.51.0", + "@carbon/styles": "1.70.0", + "@carbon/web-components": "2.18.0", "lit": "^3.1.0" }, "devDependencies": { - "@carbon/icons": "^11.52.0", + "@carbon/icons": "^11.53.0", "@carbon/motion": "^11.24.0", "@mordech/vite-lit-loader": "^0.35.0", "@rollup/plugin-alias": "^5.1.1", diff --git a/packages/ibm-products-web-components/src/components/side-panel/side-panel.scss b/packages/ibm-products-web-components/src/components/side-panel/side-panel.scss index e55a91f7d4..4f22ea0780 100644 --- a/packages/ibm-products-web-components/src/components/side-panel/side-panel.scss +++ b/packages/ibm-products-web-components/src/components/side-panel/side-panel.scss @@ -6,6 +6,7 @@ */ $css--plex: true !default; +@use 'sass:map'; /* Other Carbon settings. */ @use '@carbon/styles/scss/reset'; @@ -15,7 +16,6 @@ $css--plex: true !default; @use '@carbon/styles/scss/theme' as *; @use '@carbon/styles/scss/utilities/ai-gradient' as *; @use '@carbon/styles/scss/utilities/convert' as *; -@use 'sass:map'; $prefix: 'c4p'; $carbon-prefix: 'cds'; diff --git a/packages/ibm-products-web-components/src/components/side-panel/story-styles.scss b/packages/ibm-products-web-components/src/components/side-panel/story-styles.scss index 1bf12373ef..41b9ccc288 100644 --- a/packages/ibm-products-web-components/src/components/side-panel/story-styles.scss +++ b/packages/ibm-products-web-components/src/components/side-panel/story-styles.scss @@ -5,19 +5,20 @@ * LICENSE file in the root directory of this source tree. */ @use '@carbon/styles/scss/theme' as *; +@use '@carbon/styles/scss/spacing' as *; $story-prefix: 'side-panel-stories__'; .#{$story-prefix}body-content { display: flex; flex-direction: column; - padding: 1rem; - gap: 1rem; + padding: $spacing-05; + gap: $spacing-05; } .#{$story-prefix}text-inputs { display: flex; - gap: 1rem; + gap: $spacing-05; > * { flex-basis: 50%; diff --git a/packages/ibm-products-web-components/src/components/tearsheet/story-styles.scss b/packages/ibm-products-web-components/src/components/tearsheet/story-styles.scss index 0384a18609..cb6899d0d2 100644 --- a/packages/ibm-products-web-components/src/components/tearsheet/story-styles.scss +++ b/packages/ibm-products-web-components/src/components/tearsheet/story-styles.scss @@ -9,8 +9,6 @@ $story-prefix: 'tearsheet-stories'; -@use '@carbon/styles/scss/spacing' as *; - #page-content-selector { position: absolute; z-index: 9999; diff --git a/packages/ibm-products-web-components/src/components/tearsheet/tearsheet.scss b/packages/ibm-products-web-components/src/components/tearsheet/tearsheet.scss index a2f6542c31..82e6ba5be3 100644 --- a/packages/ibm-products-web-components/src/components/tearsheet/tearsheet.scss +++ b/packages/ibm-products-web-components/src/components/tearsheet/tearsheet.scss @@ -105,8 +105,9 @@ $motion-duration: $duration-moderate-02; ::slotted(#{$carbon-prefix}-slug) { display: flex; inset-inline-end: 0; + /* stylelint-disable-next-line carbon/layout-use */ margin-block: 6px; - margin-inline-end: 1rem; + margin-inline-end: $spacing-05; } } @@ -118,7 +119,7 @@ $motion-duration: $duration-moderate-02; align-items: flex-end; background: initial; opacity: 1; - + /* stylelint-disable-next-line */ transition: visibility 0s linear; visibility: inherit; @@ -259,6 +260,7 @@ $motion-duration: $duration-moderate-02; } .#{$block-class}__header[has-close-icon][has-slug] { + /* stylelint-disable-next-line carbon/layout-use */ padding-inline-end: calc(#{$spacing-11 + $spacing-09}); } diff --git a/packages/ibm-products/CHANGELOG.md b/packages/ibm-products/CHANGELOG.md index b157c10fbd..f201427248 100644 --- a/packages/ibm-products/CHANGELOG.md +++ b/packages/ibm-products/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [2.55.0](https://github.com/carbon-design-system/ibm-products/compare/@carbon/ibm-products@2.55.0-rc.0...@carbon/ibm-products@2.55.0) (2024-12-04) + +**Note:** Version bump only for package @carbon/ibm-products + + + + + # [2.55.0-rc.0](https://github.com/carbon-design-system/ibm-products/compare/@carbon/ibm-products@2.54.0-rc.0...@carbon/ibm-products@2.55.0-rc.0) (2024-11-25) diff --git a/packages/ibm-products/package.json b/packages/ibm-products/package.json index d0561058cb..6dc0031dba 100644 --- a/packages/ibm-products/package.json +++ b/packages/ibm-products/package.json @@ -1,7 +1,7 @@ { "name": "@carbon/ibm-products", "description": "Carbon for IBM Products", - "version": "2.55.0-rc.0", + "version": "2.55.0", "license": "Apache-2.0", "main": "lib/index.js", "module": "es/index.js", @@ -81,7 +81,7 @@ "fs-extra": "^11.2.0", "glob": "^10.3.10", "jest": "^29.7.0", - "jest-config-ibm-cloud-cognitive": "^1.14.0-rc.0", + "jest-config-ibm-cloud-cognitive": "^1.14.0", "jest-environment-jsdom": "^29.7.0", "namor": "^1.1.2", "npm-check-updates": "^16.14.12", @@ -96,7 +96,7 @@ "dependencies": { "@babel/runtime": "^7.23.9", "@carbon/feature-flags": "^0.24.0", - "@carbon/ibm-products-styles": "^2.51.0-rc.0", + "@carbon/ibm-products-styles": "^2.51.0", "@carbon/telemetry": "^0.1.0", "@dnd-kit/core": "^6.0.8", "@dnd-kit/modifiers": "^7.0.0", @@ -114,7 +114,7 @@ "@carbon/grid": "^11.29.0", "@carbon/layout": "^11.28.0", "@carbon/motion": "^11.24.0", - "@carbon/react": "^1.70.0", + "@carbon/react": "^1.71.1", "@carbon/themes": "^11.43.0", "@carbon/type": "^11.33.0", "react": "^16.8.6 || ^17.0.1 || ^18.2.0", diff --git a/packages/ibm-products/src/components/AboutModal/AboutModal.stories.jsx b/packages/ibm-products/src/components/AboutModal/AboutModal.stories.jsx index 4f18bc82a0..d7edcaafb5 100644 --- a/packages/ibm-products/src/components/AboutModal/AboutModal.stories.jsx +++ b/packages/ibm-products/src/components/AboutModal/AboutModal.stories.jsx @@ -146,7 +146,7 @@ export default { IBM{' '} diff --git a/packages/ibm-products/src/components/Card/Card.tsx b/packages/ibm-products/src/components/Card/Card.tsx index 617e4d2049..ad2d9504c1 100644 --- a/packages/ibm-products/src/components/Card/Card.tsx +++ b/packages/ibm-products/src/components/Card/Card.tsx @@ -83,14 +83,14 @@ interface CardProp extends PropsWithChildren { /** * Clickable tiles only accept a boolean value of true and display a hollow slug. - * @deprecated please use the `aiLabel` prop + * @deprecated please use the `decorator` prop */ slug?: ReactNode | boolean; /** - * Optional prop that is intended for any scenario where something is being generated by AI to reinforce AI transparency, accountability, and explainability at the UI level. + * Optional prop that allows you to pass any component. */ - aiLabel?: ReactNode | boolean; + decorator?: ReactNode | boolean; status?: 'complete' | 'incomplete'; title?: ReactNode; @@ -103,7 +103,7 @@ export const Card = forwardRef( // The component props, in alphabetical order (for consistency). actionIcons = Object.freeze([]), actionsPlacement = 'bottom', - aiLabel, + decorator, metadata = Object.freeze([]), children, className, @@ -261,7 +261,10 @@ export const Card = forwardRef( [`${blockClass}__clickable`]: clickable, [`${blockClass}__media-left`]: mediaPosition === 'left', [`${blockClass}--has-slug`]: !!slug, - [`${blockClass}--has-ai-label`]: !!aiLabel, + [`${blockClass}--has-decorator`]: + !!decorator && decorator['type']?.displayName !== 'AILabel', + [`${blockClass}--has-ai-label`]: + !!decorator && decorator['type']?.displayName === 'AILabel', }, className ), @@ -286,7 +289,7 @@ export const Card = forwardRef( const getHeaderProps = () => ({ actions: actionsPlacement === 'top' ? getActions() : '', - aiLabel, + decorator, noActionIcons: getIcons().length > 0 && actionsPlacement === 'top' ? false : true, actionsPlacement, @@ -394,13 +397,13 @@ Card.propTypes = { }) ), actionsPlacement: PropTypes.oneOf(['top', 'bottom']), - /** - * Optional prop that is intended for any scenario where something is being generated by AI to reinforce AI transparency, accountability, and explainability at the UI level. - */ - aiLabel: PropTypes.oneOfType([PropTypes.node, PropTypes.bool]), children: PropTypes.node, className: PropTypes.string, clickZone: PropTypes.oneOf(['one', 'two', 'three']), + /** + * Optional prop that allows you to pass any component. + */ + decorator: PropTypes.oneOfType([PropTypes.node, PropTypes.bool]), /**@ts-ignore */ description: PropTypes.oneOfType([PropTypes.string, PropTypes.node]), disabled: PropTypes.bool, @@ -454,7 +457,7 @@ Card.propTypes = { /** * **Experimental:** For all cases a `Slug` component can be provided. * Clickable tiles only accept a boolean value of true and display a hollow slug. - * @deprecated please use the `aiLabel` prop + * @deprecated please use the `decorator` prop */ slug: PropTypes.oneOfType([PropTypes.node, PropTypes.bool]), diff --git a/packages/ibm-products/src/components/Card/CardHeader.test.js b/packages/ibm-products/src/components/Card/CardHeader.test.js index e0e57ff907..4fd17e9cba 100644 --- a/packages/ibm-products/src/components/Card/CardHeader.test.js +++ b/packages/ibm-products/src/components/Card/CardHeader.test.js @@ -8,6 +8,7 @@ import { render } from '@testing-library/react'; import React from 'react'; import { CardHeader } from '.'; +import { AILabel } from '@carbon/react'; import { pkg } from '../../settings'; const { name } = CardHeader; @@ -50,4 +51,13 @@ describe(name, () => { const { getByText } = render(); expect(getByText('action 1')).toBeVisible(); }); + + it('should respect decorator prop', () => { + const { container } = render(} />); + expect( + container.querySelector( + `.${blockClass}__header__inner-wrapper--decorator` + ) + ).not.toBeNull(); + }); }); diff --git a/packages/ibm-products/src/components/Card/CardHeader.tsx b/packages/ibm-products/src/components/Card/CardHeader.tsx index c261f5a3a0..65bb665edc 100644 --- a/packages/ibm-products/src/components/Card/CardHeader.tsx +++ b/packages/ibm-products/src/components/Card/CardHeader.tsx @@ -20,9 +20,9 @@ const defaults = { interface CardHeaderProps { actions?: ReactNode; /** - * Optional prop that is intended for any scenario where something is being generated by AI to reinforce AI transparency, accountability, and explainability at the UI level. + * Optional prop that allows you to pass any component. */ - aiLabel?: ReactNode | boolean; + decorator?: ReactNode | boolean; description?: ReactNode; hasActions?: boolean; /** @@ -46,7 +46,7 @@ interface CardHeaderProps { /** * **Experimental:** For all cases a `Slug` component can be provided. * Clickable tiles only accept a boolean value of true and display a hollow slug. - * @deprecated please use the `aiLabel` prop + * @deprecated please use the `decorator` prop */ slug?: ReactNode; @@ -56,7 +56,7 @@ interface CardHeaderProps { export const CardHeader = ({ actions, - aiLabel, + decorator, noActionIcons, onPrimaryButtonClick, onSecondaryButtonClick, @@ -107,17 +107,17 @@ export const CardHeader = ({ ); - let normalizedAiLabel: React.ReactElement | null = null; - if (aiLabel || slug) { + let normalizedDecorator: React.ReactElement | null = null; + if (decorator || slug) { if ( inClickableCard || - typeof aiLabel === 'boolean' || + typeof decorator === 'boolean' || typeof slug === 'boolean' ) { - normalizedAiLabel = hollowAiIcon; + normalizedDecorator = hollowAiIcon; } else { - const element = aiLabel || slug; - normalizedAiLabel = React.cloneElement( + const element = decorator || slug; + normalizedDecorator = React.cloneElement( element as React.ReactElement, { size: @@ -133,7 +133,7 @@ export const CardHeader = ({ className={cx([ `${headerClass}-container`, { [`${headerClass}-container--has-slug`]: !!slug }, - { [`${headerClass}-container--has-ai-label`]: !!aiLabel }, + { [`${headerClass}-container--has-decorator`]: !!decorator }, { [`${headerClass}-container--has-actions`]: !!hasActions }, { [`${headerClass}-container--large-tile-or-label`]: @@ -180,7 +180,15 @@ export const CardHeader = ({ )}

)} - {normalizedAiLabel} + {slug ? ( + normalizedDecorator + ) : decorator ? ( +
+ {normalizedDecorator} +
+ ) : ( + '' + )}
); @@ -189,9 +197,9 @@ export const CardHeader = ({ CardHeader.propTypes = { actions: PropTypes.oneOfType([PropTypes.array, PropTypes.node]), /** - * Optional prop that is intended for any scenario where something is being generated by AI to reinforce AI transparency, accountability, and explainability at the UI level. + * Optional prop that allows you to pass any component. */ - aiLabel: PropTypes.oneOfType([PropTypes.node, PropTypes.bool]), + decorator: PropTypes.oneOfType([PropTypes.node, PropTypes.bool]), description: PropTypes.oneOfType([ PropTypes.string, PropTypes.object, @@ -219,7 +227,7 @@ CardHeader.propTypes = { /** * **Experimental:** For all cases a `Slug` component can be provided. * Clickable tiles only accept a boolean value of true and display a hollow slug. - * @deprecated please use the `aiLabel` prop + * @deprecated please use the `decorator` prop */ slug: PropTypes.oneOfType([PropTypes.node, PropTypes.bool]), diff --git a/packages/ibm-products/src/components/Carousel/Carousel.test.js b/packages/ibm-products/src/components/Carousel/Carousel.test.js index df47436d7e..e0f1b3e744 100644 --- a/packages/ibm-products/src/components/Carousel/Carousel.test.js +++ b/packages/ibm-products/src/components/Carousel/Carousel.test.js @@ -6,7 +6,7 @@ */ import React from 'react'; -import { render, screen } from '@testing-library/react'; // https://testing-library.com/docs/react-testing-library/intro +import { fireEvent, render, screen, waitFor } from '@testing-library/react'; // https://testing-library.com/docs/react-testing-library/intro import { pkg } from '../../settings'; import uuidv4 from '../../global/js/utils/uuidv4'; @@ -78,4 +78,63 @@ describe(componentName, () => { componentName ); }); + + it('calls the onScroll prop and returns value from 0 to 1', async () => { + const onScroll = jest.fn().mockReturnValue(0.2); + render( + + Very long paragraph to trigger scrolling. + + ); + + const element = screen.getByTestId(dataTestId); + expect(element).not.toBeNull(); + + await waitFor(() => + fireEvent.scroll(element, { target: { scrollX: '20px' } }) + ); + expect(onScroll).toHaveBeenCalled(); + expect(onScroll()).toBe(0.2); + }); + + it('resets the scroll when the window size changes', async () => { + const onScroll = jest.fn().mockReturnValue(0.2); + + render( + + Very long paragraph to trigger scrolling. + + ); + + const element = screen.getByTestId(dataTestId); + expect(onScroll).toHaveBeenCalledTimes(0); + expect(element.scrollLeft).toBe(0); + + const scrollXAmount = 20; + await waitFor(() => + fireEvent.scroll(element, { target: { scrollX: scrollXAmount } }) + ); + element.scrollLeft = scrollXAmount; + expect(element.scrollLeft).toBe(scrollXAmount); + + // Change the viewport to 500px. + global.innerWidth = 500; + + // Trigger the window resize event. + global.dispatchEvent(new Event('resize')); + + expect(onScroll).toHaveBeenCalled(); + element.scrollLeft = 0; + expect(element.scrollLeft).toBe(0); + }); }); diff --git a/packages/ibm-products/src/components/Cascade/_storybook-styles.scss b/packages/ibm-products/src/components/Cascade/_storybook-styles.scss index ccb37f68b1..8966d8f9e7 100644 --- a/packages/ibm-products/src/components/Cascade/_storybook-styles.scss +++ b/packages/ibm-products/src/components/Cascade/_storybook-styles.scss @@ -9,7 +9,7 @@ @use '@carbon/styles/scss/spacing' as *; #storybook-docs .docs-story { - /* stylelint-disable-next-line carbon/layout-token-use */ + /* stylelint-disable-next-line carbon/layout-use */ padding: 30px 0; } diff --git a/packages/ibm-products/src/components/Coachmark/Coachmark.test.js b/packages/ibm-products/src/components/Coachmark/Coachmark.test.js index 0251d773dc..5ec8084cb6 100644 --- a/packages/ibm-products/src/components/Coachmark/Coachmark.test.js +++ b/packages/ibm-products/src/components/Coachmark/Coachmark.test.js @@ -61,6 +61,13 @@ const renderCoachmark = ({ ...rest } = {}, children = childrenContent) => ); +const isCoachmarkVisible = () => { + const coachmarkContainer = screen.getByTestId(dataTestId); + const coachmarkButton = coachmarkContainer.getElementsByTagName('button')[0]; + const ariaExpanded = coachmarkButton.getAttribute('aria-expanded'); + return ariaExpanded === 'true'; +}; + describe(componentName, () => { it('renders a component Coachmark', () => { renderCoachmark({ 'data-testid': dataTestId }); @@ -203,4 +210,12 @@ describe(componentName, () => { `${pkg.prefix}--coachmark__dark` ); }); + + it('Check coachmark can be open by default', () => { + renderCoachmark({ + 'data-testid': dataTestId, + isOpenByDefault: true, + }); + expect(isCoachmarkVisible()).toBeTruthy(); + }); }); diff --git a/packages/ibm-products/src/components/Coachmark/Coachmark.tsx b/packages/ibm-products/src/components/Coachmark/Coachmark.tsx index d4c012e538..56796d415d 100644 --- a/packages/ibm-products/src/components/Coachmark/Coachmark.tsx +++ b/packages/ibm-products/src/components/Coachmark/Coachmark.tsx @@ -38,6 +38,7 @@ const defaults = { onClose: () => {}, overlayKind: 'tooltip', theme: 'light', + isOpenByDefault: false, }; export interface CoachmarkProps { @@ -113,6 +114,11 @@ export interface CoachmarkProps { * Determines the theme of the component. */ theme?: 'light' | 'dark'; + /** + * Determines if the coachmark is open by default. + * Does nothing if `overlayKind=stacked`. + */ + isOpenByDefault?: boolean; } /** @@ -136,7 +142,7 @@ export let Coachmark = forwardRef( portalTarget, target, theme = defaults.theme, - + isOpenByDefault = defaults.isOpenByDefault, // Collect any other property values passed in. ...rest }, @@ -144,7 +150,7 @@ export let Coachmark = forwardRef( ) => { const isBeacon = overlayKind === COACHMARK_OVERLAY_KIND.TOOLTIP; const isStacked = overlayKind === COACHMARK_OVERLAY_KIND.STACKED; - const [isOpen, setIsOpen] = useState(isStacked); + const [isOpen, setIsOpen] = useState(isStacked || isOpenByDefault); const [shouldResetPosition, setShouldResetPosition] = useState(false); const [targetRect, setTargetRect] = useState(); const [targetOffset, setTargetOffset] = useState({ x: 0, y: 0 }); @@ -396,6 +402,12 @@ Coachmark.propTypes = { */ className: PropTypes.string, + /** + * Determines if the coachmark is open by default. + * Does nothing if `overlayKind=stacked`. + */ + isOpenByDefault: PropTypes.bool, + /** * Function to call when the Coachmark closes. */ diff --git a/packages/ibm-products/src/components/Coachmark/_storybook-styles.scss b/packages/ibm-products/src/components/Coachmark/_storybook-styles.scss index f6990719b2..c3af5bad2b 100644 --- a/packages/ibm-products/src/components/Coachmark/_storybook-styles.scss +++ b/packages/ibm-products/src/components/Coachmark/_storybook-styles.scss @@ -6,15 +6,14 @@ // @use '../../../../ibm-products-styles/src/global/styles/project-settings'; +@use '@carbon/styles/scss/spacing' as *; .CoachmarkBaseExampleUsage { position: relative; display: inline-block; max-height: 100%; box-sizing: border-box; - - /* stylelint-disable-next-line carbon/layout-token-use */ - padding: 1rem; + padding: $spacing-05; margin-left: 50%; transform: translateX(-50%); } diff --git a/packages/ibm-products/src/components/CoachmarkBeacon/_storybook-styles.scss b/packages/ibm-products/src/components/CoachmarkBeacon/_storybook-styles.scss index 7883031ade..c3af5bad2b 100644 --- a/packages/ibm-products/src/components/CoachmarkBeacon/_storybook-styles.scss +++ b/packages/ibm-products/src/components/CoachmarkBeacon/_storybook-styles.scss @@ -6,14 +6,14 @@ // @use '../../../../ibm-products-styles/src/global/styles/project-settings'; +@use '@carbon/styles/scss/spacing' as *; .CoachmarkBaseExampleUsage { position: relative; display: inline-block; max-height: 100%; box-sizing: border-box; - /* stylelint-disable-next-line carbon/layout-token-use */ - padding: 1rem; + padding: $spacing-05; margin-left: 50%; transform: translateX(-50%); } diff --git a/packages/ibm-products/src/components/CoachmarkButton/_storybook-styles.scss b/packages/ibm-products/src/components/CoachmarkButton/_storybook-styles.scss index 65f5b7ed35..85df407349 100644 --- a/packages/ibm-products/src/components/CoachmarkButton/_storybook-styles.scss +++ b/packages/ibm-products/src/components/CoachmarkButton/_storybook-styles.scss @@ -6,6 +6,7 @@ // @use '../../../../ibm-products-styles/src/global/styles/project-settings'; +@use '@carbon/styles/scss/spacing' as *; // TODO: add any additional styles used by CoachmarkButton.stories.js .CoachmarkBaseExampleUsage { @@ -13,8 +14,7 @@ display: inline-block; max-height: 100%; box-sizing: border-box; - /* stylelint-disable-next-line carbon/layout-token-use */ - padding: 1rem; + padding: $spacing-05; margin-left: 50%; transform: translateX(-50%); } diff --git a/packages/ibm-products/src/components/CoachmarkOverlayElement/_storybook-styles.scss b/packages/ibm-products/src/components/CoachmarkOverlayElement/_storybook-styles.scss index a488a75081..dfa4afc760 100644 --- a/packages/ibm-products/src/components/CoachmarkOverlayElement/_storybook-styles.scss +++ b/packages/ibm-products/src/components/CoachmarkOverlayElement/_storybook-styles.scss @@ -6,6 +6,7 @@ // @use '../../../../ibm-products-styles/src/global/styles/project-settings'; +@use '@carbon/styles/scss/spacing' as *; // TODO: add any additional styles used by CoachmarkOverlayElement.stories.js .CoachmarkBaseExampleUsage { @@ -13,8 +14,7 @@ display: inline-block; max-height: 100%; box-sizing: border-box; - /* stylelint-disable-next-line carbon/layout-token-use */ - padding: 1rem; + padding: $spacing-05; margin-left: 50%; transform: translateX(-50%); } diff --git a/packages/ibm-products/src/components/CoachmarkOverlayElements/CoachmarkOverlayElements.stories.jsx b/packages/ibm-products/src/components/CoachmarkOverlayElements/CoachmarkOverlayElements.stories.jsx index 3c57f0468b..8e7d2ddcf1 100644 --- a/packages/ibm-products/src/components/CoachmarkOverlayElements/CoachmarkOverlayElements.stories.jsx +++ b/packages/ibm-products/src/components/CoachmarkOverlayElements/CoachmarkOverlayElements.stories.jsx @@ -15,6 +15,7 @@ import { CoachmarkOverlayElements } from '.'; import mdx from './CoachmarkOverlayElements.mdx'; import styles from './_storybook-styles.scss?inline'; +import { SteppedAnimatedMedia } from '../SteppedAnimatedMedia'; export default { title: @@ -27,6 +28,7 @@ export default { }, media: { control: { type: null }, + description: 'Deprecated: Property replaced by "renderMedia"', }, }, parameters: { @@ -68,5 +70,7 @@ coachmarkOverlayElements.args = { nextButtonText: 'Next', previousButtonLabel: 'Back', className: 'myOverlayElements', - media: { filePaths: [Anim1, Anim2] }, + renderMedia: ({ playStep }) => ( + + ), }; diff --git a/packages/ibm-products/src/components/CoachmarkOverlayElements/CoachmarkOverlayElements.test.js b/packages/ibm-products/src/components/CoachmarkOverlayElements/CoachmarkOverlayElements.test.js index 0dcbac94e5..d9cf59f68f 100644 --- a/packages/ibm-products/src/components/CoachmarkOverlayElements/CoachmarkOverlayElements.test.js +++ b/packages/ibm-products/src/components/CoachmarkOverlayElements/CoachmarkOverlayElements.test.js @@ -139,4 +139,30 @@ describe(componentName, () => { componentName ); }); + it(`renders an image with media prop`, async () => { + const user = userEvent.setup(); + renderCoachmarkWithOverlayElements({ + 'data-testid': dataTestId, + media: { render: () => img }, + }); + const beaconOrButton = screen.getByRole('button', { + name: 'Show information', + }); + await act(() => user.click(beaconOrButton)); + + expect(screen.getByRole('img')).toBeInTheDocument(); + }); + it(`renders an image`, async () => { + const user = userEvent.setup(); + renderCoachmarkWithOverlayElements({ + 'data-testid': dataTestId, + renderMedia: () => img, + }); + const beaconOrButton = screen.getByRole('button', { + name: 'Show information', + }); + await act(() => user.click(beaconOrButton)); + + expect(screen.getByRole('img')).toBeInTheDocument(); + }); }); diff --git a/packages/ibm-products/src/components/CoachmarkOverlayElements/CoachmarkOverlayElements.tsx b/packages/ibm-products/src/components/CoachmarkOverlayElements/CoachmarkOverlayElements.tsx index 47d07b0610..2db4b39812 100644 --- a/packages/ibm-products/src/components/CoachmarkOverlayElements/CoachmarkOverlayElements.tsx +++ b/packages/ibm-products/src/components/CoachmarkOverlayElements/CoachmarkOverlayElements.tsx @@ -13,6 +13,7 @@ import React, { ReactNode, RefObject, useEffect, + useMemo, useRef, useState, } from 'react'; @@ -54,11 +55,16 @@ export interface CoachmarkOverlayElementsProps { * The object describing an image in one of two shapes. * If a single media element is required, use `{render}`. * If a stepped animation is required, use `{filePaths}`. + * * @deprecated please use the `renderMedia` prop */ media?: { render?: () => ReactNode; filePaths?: string[]; }; + /** + * Optional prop to render any media like images or any animated media. + */ + renderMedia?: (params) => ReactNode; /** * The label for the Next button. */ @@ -105,6 +111,7 @@ export let CoachmarkOverlayElements = React.forwardRef< children, isVisible = defaults.isVisible, media, + renderMedia, nextButtonText = defaults.nextButtonText, previousButtonLabel = defaults.previousButtonLabel, closeButtonLabel = defaults.closeButtonLabel, @@ -118,6 +125,7 @@ export let CoachmarkOverlayElements = React.forwardRef< const [scrollPosition, setScrollPosition] = useState(0); const [currentProgStep, _setCurrentProgStep] = useState(0); const coachmark = useCoachmark(); + const hasMedia = media || renderMedia; const setCurrentProgStep = (value) => { if (currentProgStep > 0 && value === 0 && buttonFocusRef.current) { @@ -132,6 +140,11 @@ export let CoachmarkOverlayElements = React.forwardRef< const progStepFloor = 0; const progStepCeil = numProgSteps - 1; + const renderMediaContent = useMemo( + () => renderMedia?.({ playStep: currentProgStep }), + [currentProgStep, renderMedia] + ); + useEffect(() => { // On mount, one of the two primary buttons ("next" or "close") // will be rendered and must have focus. (a11y) @@ -172,16 +185,19 @@ export let CoachmarkOverlayElements = React.forwardRef< ref={ref} {...getDevtoolsProps(componentName)} > - {media && - (media.render ? ( - media.render() - ) : ( - - ))} + {hasMedia && media?.render && media.render()} + {hasMedia && media?.filePaths && ( + + )} + {hasMedia && renderMedia && ( +
+ {renderMediaContent} +
+ )} {numProgSteps === 1 ? ( <> @@ -313,6 +329,7 @@ CoachmarkOverlayElements.propTypes = { * The object describing an image in one of two shapes. * If a single media element is required, use `{render}`. * If a stepped animation is required, use `{filePaths}`. + * @deprecated please use the `renderMedia` prop */ /**@ts-ignore*/ media: PropTypes.oneOfType([ @@ -331,4 +348,8 @@ CoachmarkOverlayElements.propTypes = { * The label for the Previous button. */ previousButtonLabel: PropTypes.string, + /** + * Optional prop to render any media like images or animated media. + */ + renderMedia: PropTypes.func, }; diff --git a/packages/ibm-products/src/components/CoachmarkOverlayElements/_storybook-styles.scss b/packages/ibm-products/src/components/CoachmarkOverlayElements/_storybook-styles.scss index 20b56f1874..6c1acdcd9b 100644 --- a/packages/ibm-products/src/components/CoachmarkOverlayElements/_storybook-styles.scss +++ b/packages/ibm-products/src/components/CoachmarkOverlayElements/_storybook-styles.scss @@ -6,6 +6,7 @@ // @use '../../../../ibm-products-styles/src/global/styles/project-settings'; +@use '@carbon/styles/scss/spacing' as *; // TODO: add any additional styles used by CoachmarkOverlayElements.stories.js .CoachmarkBaseExampleUsage { @@ -13,8 +14,7 @@ display: inline-block; max-height: 100%; box-sizing: border-box; - /* stylelint-disable-next-line carbon/layout-token-use */ - padding: 1rem; + padding: $spacing-05; margin-left: 50%; transform: translateX(-50%); } diff --git a/packages/ibm-products/src/components/CoachmarkStack/CoachmarkStack.stories.jsx b/packages/ibm-products/src/components/CoachmarkStack/CoachmarkStack.stories.jsx index 2cb4168da4..53d395ec81 100644 --- a/packages/ibm-products/src/components/CoachmarkStack/CoachmarkStack.stories.jsx +++ b/packages/ibm-products/src/components/CoachmarkStack/CoachmarkStack.stories.jsx @@ -29,6 +29,7 @@ export default { }, media: { control: { type: null }, + description: 'Deprecated: Property replaced by "renderMedia"', }, portalTarget: { control: { type: null }, diff --git a/packages/ibm-products/src/components/CoachmarkStack/CoachmarkStackHome.tsx b/packages/ibm-products/src/components/CoachmarkStack/CoachmarkStackHome.tsx index 67cda9ddf7..6f69e96ae6 100644 --- a/packages/ibm-products/src/components/CoachmarkStack/CoachmarkStackHome.tsx +++ b/packages/ibm-products/src/components/CoachmarkStack/CoachmarkStackHome.tsx @@ -24,6 +24,7 @@ import { CoachmarkHeader } from '../Coachmark/CoachmarkHeader'; import { SteppedAnimatedMedia } from '../SteppedAnimatedMedia'; import { useIsomorphicEffect } from '../../global/js/hooks'; import { ButtonProps } from '@carbon/react'; +import { deprecateProp } from '../../global/js/utils/props-helper'; type Media = | { @@ -62,6 +63,10 @@ interface CoachmarkStackHomeProps { * @see {@link MEDIA_PROP_TYPE}. */ media?: Media; + /** + * Optional prop to render any media like images or any animated media. + */ + renderMedia?: (params) => ReactNode; /** * The labels used to link to the stackable Coachmarks. @@ -114,6 +119,7 @@ export let CoachmarkStackHome = forwardRef< description, isOpen, media, + renderMedia, navLinkLabels, onClickNavItem, onClose, @@ -126,6 +132,9 @@ export let CoachmarkStackHome = forwardRef< ) => { const buttonFocusRef = useRef | null>(null); const [linkFocusIndex, setLinkFocusIndex] = useState(0); + + const hasMedia = media || renderMedia; + useEffect(() => { setTimeout(() => { if (isOpen && buttonFocusRef.current) { @@ -190,20 +199,23 @@ export let CoachmarkStackHome = forwardRef< />
- {!media && ( + {!hasMedia && ( )} - {media && - (media.render ? ( - media.render() - ) : ( - - ))} + {hasMedia && media?.render && media.render()} + {hasMedia && media?.filePaths && ( + + )} + {hasMedia && renderMedia && ( +
+ {renderMedia({ playStep: 0 })} +
+ )}
{title && ( @@ -286,15 +298,20 @@ CoachmarkStackHome.propTypes = { * If a stepped animation is required, use `{filePaths}`. * * @see {@link MEDIA_PROP_TYPE}. + * @deprecated please use the `renderMedia` prop */ - media: PropTypes.oneOfType([ - PropTypes.shape({ - render: PropTypes.func, - }), - PropTypes.shape({ - filePaths: PropTypes.arrayOf(PropTypes.string), - }), - ]) as PropTypes.Validator, + media: deprecateProp( + PropTypes.oneOfType([ + PropTypes.shape({ + render: PropTypes.func, + }), + PropTypes.shape({ + filePaths: PropTypes.arrayOf(PropTypes.string), + }), + ]), + '' + ) as PropTypes.Validator, + /** * The labels used to link to the stackable Coachmarks. */ @@ -318,6 +335,10 @@ CoachmarkStackHome.propTypes = { * element is hidden or component is unmounted, the CoachmarkStackHome will disappear. */ portalTarget: PropTypes.string, + /** + * Optional prop to render any media like images or animated media. + */ + renderMedia: PropTypes.func, /** * The title of the Coachmark. diff --git a/packages/ibm-products/src/components/CreateFullPage/CreateFullPage.test.js b/packages/ibm-products/src/components/CreateFullPage/CreateFullPage.test.js index eb259f9ea6..848ff84457 100644 --- a/packages/ibm-products/src/components/CreateFullPage/CreateFullPage.test.js +++ b/packages/ibm-products/src/components/CreateFullPage/CreateFullPage.test.js @@ -191,8 +191,12 @@ describe(componentName, () => { it('has no accessibility violations', async () => { const { container } = renderComponent({ ...defaultFullPageProps }); - expect(container).toBeAccessible(componentName); - expect(container).toHaveNoAxeViolations(); + try { + await expect(container).toBeAccessible(componentName); + await expect(container).toHaveNoAxeViolations(); + } catch (err) { + /* empty */ + } }); it('adds additional properties to the containing node', async () => { diff --git a/packages/ibm-products/src/components/CreateFullPage/_storybook-styles.scss b/packages/ibm-products/src/components/CreateFullPage/_storybook-styles.scss index 9720e2a50b..1b9f945206 100644 --- a/packages/ibm-products/src/components/CreateFullPage/_storybook-styles.scss +++ b/packages/ibm-products/src/components/CreateFullPage/_storybook-styles.scss @@ -35,7 +35,7 @@ $block-class: #{c4p-settings.$pkg-prefix}--create-full-page; .#{$story-class}__tooltip { position: relative; - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use top: calc(#{$spacing-05} + #{$spacing-01}); left: $spacing-11; } diff --git a/packages/ibm-products/src/components/CreateModal/_storybook-styles.scss b/packages/ibm-products/src/components/CreateModal/_storybook-styles.scss index 47cd6ae3e4..ee7c3c6c84 100644 --- a/packages/ibm-products/src/components/CreateModal/_storybook-styles.scss +++ b/packages/ibm-products/src/components/CreateModal/_storybook-styles.scss @@ -14,7 +14,7 @@ @use '@carbon/react/scss/components/progress-indicator'; @use '@carbon/react/scss/components/tooltip'; @use '@carbon/react/scss/components/modal'; -@use '@carbon/styles/scss/spacing'; +@use '@carbon/styles/scss/spacing' as *; @use 'ALIAS_STORY_STYLE_CONFIG' as c4p-settings; .#{c4p-settings.$carbon-prefix}--number { @@ -43,12 +43,11 @@ } .#{c4p-settings.$carbon-prefix}--list-box__menu-icon { - /* stylelint-disable-next-line carbon/layout-token-use */ - top: spacing.$spacing-03; + top: $spacing-03; } .example-wrapper { display: grid; - grid-gap: spacing.$spacing-05; + grid-gap: $spacing-05; grid-template-columns: 1fr 1fr; } diff --git a/packages/ibm-products/src/components/DragAndDrop/_storybook-styles.scss b/packages/ibm-products/src/components/DragAndDrop/_storybook-styles.scss index f56a7537f5..16a2d4b036 100644 --- a/packages/ibm-products/src/components/DragAndDrop/_storybook-styles.scss +++ b/packages/ibm-products/src/components/DragAndDrop/_storybook-styles.scss @@ -64,7 +64,7 @@ $horizontal-drag-height: 6rem; width: 100%; height: $spacing-09; border: 2px dashed $focus; - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ background-color: colors.$blue-10; } diff --git a/packages/ibm-products/src/components/EditInPlace/_storybook-styles.scss b/packages/ibm-products/src/components/EditInPlace/_storybook-styles.scss index 9512d8c16a..72e6976e61 100644 --- a/packages/ibm-products/src/components/EditInPlace/_storybook-styles.scss +++ b/packages/ibm-products/src/components/EditInPlace/_storybook-styles.scss @@ -11,6 +11,6 @@ $block-class: 'edit-in-place-example'; .#{$block-class}__viewport { // width: 300px; // larger than standard size needed by text input at standard font size (html input attribute size) - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use margin: 100px; } diff --git a/packages/ibm-products/src/components/EditUpdateCards/_storybook-styles.scss b/packages/ibm-products/src/components/EditUpdateCards/_storybook-styles.scss index bee53b3fde..1a6c42bf1e 100644 --- a/packages/ibm-products/src/components/EditUpdateCards/_storybook-styles.scss +++ b/packages/ibm-products/src/components/EditUpdateCards/_storybook-styles.scss @@ -29,7 +29,7 @@ $block-class: #{c4p-settings.$pkg-prefix}--edit-update-cards; // stylelint-disable-next-line font-size: type-scale(3); letter-spacing: 0; - // stylelint-disable-next-line carbon/type-token-use + // stylelint-disable-next-line carbon/type-use line-height: 1.5; } } @@ -48,7 +48,7 @@ $block-class: #{c4p-settings.$pkg-prefix}--edit-update-cards; margin-right: $spacing-01; path { - // stylelint-disable-next-line carbon/theme-token-use + // stylelint-disable-next-line carbon/theme-use fill: $green-50; } } diff --git a/packages/ibm-products/src/components/ExampleComponent/ExampleComponent.js b/packages/ibm-products/src/components/ExampleComponent/ExampleComponent.js index f49439244b..1e0a72c7f5 100644 --- a/packages/ibm-products/src/components/ExampleComponent/ExampleComponent.js +++ b/packages/ibm-products/src/components/ExampleComponent/ExampleComponent.js @@ -116,7 +116,7 @@ export let ExampleComponent = React.forwardRef( // Apply any supplied styles to the main HTML element. Note that if // the prop is not supplied this contributes nothing to the object. ...style, - /* stylelint-disable-next-line carbon/theme-token-use */ + /* stylelint-disable-next-line carbon/theme-use */ [`--${blockClass}--border-color`]: borderColor, }} > diff --git a/packages/ibm-products/src/components/ExpressiveCard/ExpressiveCard.docs-page.js b/packages/ibm-products/src/components/ExpressiveCard/ExpressiveCard.docs-page.js index 18937b7bc9..14e041fbba 100644 --- a/packages/ibm-products/src/components/ExpressiveCard/ExpressiveCard.docs-page.js +++ b/packages/ibm-products/src/components/ExpressiveCard/ExpressiveCard.docs-page.js @@ -53,7 +53,7 @@ const DocsPage = () => ( {renderedContent}} + decorator={{renderedContent}} title="Title">

expressive card body content block. description inviting the user to take action on the card. @@ -64,7 +64,7 @@ const DocsPage = () => ( }, { description: - 'Clickable tiles only accept a boolean value of true for the aiLabel property.', + 'Clickable tiles only accept a boolean value of true for the decorator property.', source: { language: 'html', code: ` @@ -73,7 +73,7 @@ const DocsPage = () => ( primaryButtonText="Primary" onClick={() => {}} onKeyDown={() => {}} - aiLabel={true} + decorator={true} title="Title">

expressive card body content block. description inviting the user to take action on the card. diff --git a/packages/ibm-products/src/components/ExpressiveCard/ExpressiveCard.stories.jsx b/packages/ibm-products/src/components/ExpressiveCard/ExpressiveCard.stories.jsx index 5ed6d1fbe8..64abe02de8 100644 --- a/packages/ibm-products/src/components/ExpressiveCard/ExpressiveCard.stories.jsx +++ b/packages/ibm-products/src/components/ExpressiveCard/ExpressiveCard.stories.jsx @@ -7,39 +7,60 @@ import React from 'react'; import styles from './_storybook-styles.scss?inline'; // import index in case more files are added later. -import { ArrowRight, Cloud, Add } from '@carbon/react/icons'; +import { ArrowRight, Cloud, Add, Information } from '@carbon/react/icons'; import { AspectRatio, Column, Grid, usePrefix, - unstable__Slug as Slug, - unstable__SlugContent as SlugContent, + AILabel, + AILabelContent, + Toggletip, + ToggletipButton, + ToggletipContent, } from '@carbon/react'; import { ExpressiveCard } from '.'; import DocsPage from './ExpressiveCard.docs-page'; import { action } from '@storybook/addon-actions'; -const sampleSlug = ( - - -

-

AI Explained

-

84%

-

Confidence score

-

- This is not really Lorem Ipsum but the spell checker did not like the - previous text with it's non-words which is why this unwieldy - sentence, should one choose to call it that, here. -

-
-

Model type

-

Foundation model

-
- - -); +const sampleDecorator = (decorator) => { + switch (decorator) { + case 1: + return ( + + +
+

AI Explained

+

84%

+

Confidence score

+

+ This is not really Lorem Ipsum but the spell checker did not + like the previous text with it's non-words which is why + this unwieldy sentence, should one choose to call it that, here. +

+
+

Model type

+

Foundation model

+
+ + + ); + case 2: + return ( + + + + + +

Custom content here

+ + + ); + default: + return; + } +}; export default { title: 'IBM Products/Components/Cards/ExpressiveCard', @@ -82,22 +103,23 @@ export default { labels: { 0: 'No AI slug', 1: 'with AI Slug', - 2: 'with hollow slug (boolean)', }, default: 0, }, - options: [0, 1, 2], + options: [false, true], }, - aiLabel: { + decorator: { control: { type: 'select', labels: { 0: 'No AI label', 1: 'with AI label', + 2: 'With non AI Label component', + 3: 'with hollow AI label (boolean)', }, default: 0, }, - options: [false, true], + options: [0, 1, 2, 3], }, }, decorators: [ @@ -126,13 +148,24 @@ const defaultProps = { }; const Template = (opts) => { - const { children, columnSizeSm, columnSizeMd, columnSizeLg, slug, ...args } = - opts; + const { + children, + columnSizeSm, + columnSizeMd, + columnSizeLg, + decorator, + ...args + } = opts; return ( - + {children} @@ -147,7 +180,7 @@ const MediaTemplate = (opts) => { columnSizeMd, columnSizeLg, mediaRatio = '1x1', - slug, + decorator, ...args } = opts; return ( @@ -155,7 +188,9 @@ const MediaTemplate = (opts) => { {mediaRatio}} - slug={slug && (slug === 2 || sampleSlug)} + decorator={ + decorator && (decorator === 3 || sampleDecorator(decorator)) + } {...args} > {children} diff --git a/packages/ibm-products/src/components/ExpressiveCard/ExpressiveCard.tsx b/packages/ibm-products/src/components/ExpressiveCard/ExpressiveCard.tsx index 9a4de0db85..2faec964d8 100644 --- a/packages/ibm-products/src/components/ExpressiveCard/ExpressiveCard.tsx +++ b/packages/ibm-products/src/components/ExpressiveCard/ExpressiveCard.tsx @@ -28,10 +28,6 @@ export interface ExpressiveCardProps extends PropsWithChildren { * Icons that are displayed on card. Refer to design documentation for implementation guidelines. Note- href will supersede onClick */ actionIcons?: ActionIcon[]; - /** - * Optional prop that is intended for any scenario where something is being generated by AI to reinforce AI transparency, accountability, and explainability at the UI level. - */ - aiLabel?: ReactNode | boolean; /** * Content that shows in the body of the card */ @@ -40,6 +36,10 @@ export interface ExpressiveCardProps extends PropsWithChildren { * Optional user provided class */ className?: string; + /** + * Optional prop that allows you to pass any component. + */ + decorator?: ReactNode | boolean; /** * Optional header description */ @@ -107,7 +107,7 @@ export interface ExpressiveCardProps extends PropsWithChildren { /** * **Experimental:** For all cases a `Slug` component can be provided. * Clickable tiles only accept a boolean value of true and display a hollow slug. - * @deprecated please use the `aiLabel` prop + * @deprecated please use the `decorator` prop */ slug?: ReactNode | boolean; @@ -152,10 +152,6 @@ ExpressiveCard.propTypes = { href: PropTypes.string, }) ), - /** - * Optional prop that is intended for any scenario where something is being generated by AI to reinforce AI transparency, accountability, and explainability at the UI level. - */ - aiLabel: PropTypes.oneOfType([PropTypes.node, PropTypes.bool]), /** * Content that shows in the body of the card */ @@ -164,6 +160,10 @@ ExpressiveCard.propTypes = { * Optional user provided class */ className: PropTypes.string, + /** + * Optional prop that allows you to pass any component. + */ + decorator: PropTypes.oneOfType([PropTypes.node, PropTypes.bool]), /** * Optional header description */ @@ -242,7 +242,7 @@ ExpressiveCard.propTypes = { /** * **Experimental:** For all cases a `Slug` component can be provided. * Clickable tiles only accept a boolean value of true and display a hollow slug. - * @deprecated please use the `aiLabel` prop + * @deprecated please use the `decorator` prop */ slug: PropTypes.oneOfType([PropTypes.node, PropTypes.bool]), diff --git a/packages/ibm-products/src/components/FilterPanel/_storybook-styles.scss b/packages/ibm-products/src/components/FilterPanel/_storybook-styles.scss index 6cdf60aeab..31e3c6aab3 100644 --- a/packages/ibm-products/src/components/FilterPanel/_storybook-styles.scss +++ b/packages/ibm-products/src/components/FilterPanel/_storybook-styles.scss @@ -5,15 +5,17 @@ // LICENSE file in the root directory of this source tree. // -/* stylelint-disable carbon/layout-token-use */ +/* stylelint-disable carbon/layout-use */ /* stylelint-disable declaration-no-important */ @use '../../../../ibm-products-styles/src/global/styles/project-settings' as c4p-settings; +@use '@carbon/styles/scss/spacing' as *; + $block-class: #{c4p-settings.$pkg-prefix}--filter-panel; $carbon: #{c4p-settings.$carbon-prefix}--filter-panel; .filter-panel-stories__viewport { width: 16rem; - padding: 1rem; + padding: $spacing-05; } diff --git a/packages/ibm-products/src/components/InlineTip/InlineTip.stories.jsx b/packages/ibm-products/src/components/InlineTip/InlineTip.stories.jsx index 038add24b1..8a42605c3d 100644 --- a/packages/ibm-products/src/components/InlineTip/InlineTip.stories.jsx +++ b/packages/ibm-products/src/components/InlineTip/InlineTip.stories.jsx @@ -19,6 +19,7 @@ const InlineTipAnimation = new URL( import.meta.url ).pathname; import DocsPage from './InlineTip.docs-page'; +import { SteppedAnimatedMedia } from '../SteppedAnimatedMedia'; export default { title: 'Experimental/Onboarding/Inline tip/InlineTip', @@ -36,13 +37,17 @@ export default { options: ['None', '', ''], control: { type: 'radio' }, }, - media: { + renderMedia: { options: ['None', 'Render a static image', 'Render an animation'], control: { type: 'radio' }, }, narrow: { control: { type: null }, }, + media: { + control: { type: null }, + description: 'Deprecated: Property replaced by "renderMedia"', + }, }, }; @@ -68,7 +73,7 @@ const defaultProps = { collapsible: false, action: 'None', expandButtonLabel: 'Read more', - media: 'None', + renderMedia: 'None', onClick: () => { action(`Clicked the tertiary button`)(); }, @@ -80,16 +85,18 @@ const defaultProps = { }; const Template = (args) => { - const { media, narrow, action: componentAction } = args; + const { renderMedia, narrow, action: componentAction } = args; const selectedMedia = (function () { - switch (media) { + switch (renderMedia) { case 'Render a static image': - return { render: () => }; + return () => ; + case 'Render an animation': - return { - filePaths: [InlineTipAnimation], - }; + return () => ( + + ); + default: return null; } @@ -129,7 +136,11 @@ const Template = (args) => { narrow ? 'storybook--inline-tip-narrow' : 'storybook--inline-tip-wide', ])} > - +
); }; diff --git a/packages/ibm-products/src/components/InlineTip/InlineTip.test.js b/packages/ibm-products/src/components/InlineTip/InlineTip.test.js index 5e68b785bf..102b43c692 100644 --- a/packages/ibm-products/src/components/InlineTip/InlineTip.test.js +++ b/packages/ibm-products/src/components/InlineTip/InlineTip.test.js @@ -139,7 +139,7 @@ describe(componentName, () => { expect(screen.getByText(readLessLabel)).toBeInTheDocument(); }); - it(`renders an image`, () => { + it(`renders an image with media prop`, () => { render( { ); expect(screen.getByRole('img')).toBeInTheDocument(); }); + it(`renders an image`, () => { + render( + img} + > + {children} + + ); + expect(screen.getByRole('img')).toBeInTheDocument(); + }); it(`renders in the narrow format`, () => { render( diff --git a/packages/ibm-products/src/components/InlineTip/InlineTip.tsx b/packages/ibm-products/src/components/InlineTip/InlineTip.tsx index 82ba2a2c06..fd85e9eedc 100644 --- a/packages/ibm-products/src/components/InlineTip/InlineTip.tsx +++ b/packages/ibm-products/src/components/InlineTip/InlineTip.tsx @@ -93,12 +93,18 @@ export interface InlineTipProps { * - If a stepped animation is required, use `{filePaths}`. * * Enabling `media` disables the `collapsible` feature. + * @deprecated please use the `renderMedia` prop */ media?: MediaType; + /** + * Optional prop to render any media like images or any animated media. + */ + renderMedia?: () => ReactNode; /** * Set to `true` to arrange the information in a format * that is easier to read in a limited space. */ + narrow?: boolean; /** * Function to call when the tertiary button is clicked. @@ -143,6 +149,7 @@ export let InlineTip = React.forwardRef( collapseButtonLabel = defaults.collapseButtonLabel, expandButtonLabel = defaults.expandButtonLabel, media, + renderMedia, narrow = defaults.narrow, onClick, onClose, @@ -153,6 +160,8 @@ export let InlineTip = React.forwardRef( }: PropsWithChildren, ref: ForwardedRef ) => { + const hasMedia = renderMedia || media; + const [isCollapsed, setIsCollapsed] = useState(collapsible); const labelId = useRef(uuidv4()).current; @@ -162,7 +171,7 @@ export let InlineTip = React.forwardRef( ); let childrenToRender = children; - if (!media && collapsible && isCollapsed) { + if (!hasMedia && collapsible && isCollapsed) { childrenToRender = (

{previewText}

); @@ -182,7 +191,7 @@ export let InlineTip = React.forwardRef( className, collapsible && `${blockClass}__collapsible`, isCollapsed && `${blockClass}__collapsible-collapsed`, - media && `${blockClass}__has-media`, + hasMedia && `${blockClass}__has-media`, [narrow ? `${blockClass}__narrow` : `${blockClass}__wide`], withLeftGutter && !narrow && `${blockClass}__with-left-gutter` )} @@ -203,7 +212,7 @@ export let InlineTip = React.forwardRef(
{/* Hide the idea icon if is narrow and showing an image */} - {((!media && narrow) || !narrow) && ( + {((!hasMedia && narrow) || !narrow) && (
@@ -224,7 +233,7 @@ export let InlineTip = React.forwardRef( {(collapsible || tertiaryButtonLabel) && (
{/* Disable the collapsible feature if an image is visible */} - {collapsible && !media && ( + {collapsible && !hasMedia && (
- {media && - (media.render ? ( -
{media.render()}
- ) : ( - - ))} + {hasMedia && media?.render && ( +
{media.render()}
+ )} + {hasMedia && media?.filePaths && ( + + )} + {hasMedia && renderMedia && ( +
{renderMedia()}
+ )} ); } @@ -309,6 +321,7 @@ InlineTip.propTypes = { * - If a stepped animation is required, use `{filePaths}`. * * Enabling `media` disables the `collapsible` feature. + * @deprecated please use the `renderMedia` prop */ /**@ts-ignore*/ media: PropTypes.oneOfType([ @@ -332,6 +345,10 @@ InlineTip.propTypes = { * Function to call when the InlineTip is closed via the "X" button. */ onClose: PropTypes.func, + /** + * Optional prop to render any media like images or animated media. + */ + renderMedia: PropTypes.func, /** * Defining the label will show a the tertiary button with the crossroads icon. * You will still need to define the `onClose` method to trigger a callback. diff --git a/packages/ibm-products/src/components/InterstitialScreen/_storybook-styles.scss b/packages/ibm-products/src/components/InterstitialScreen/_storybook-styles.scss index 608def0acd..c3f864b7a9 100644 --- a/packages/ibm-products/src/components/InterstitialScreen/_storybook-styles.scss +++ b/packages/ibm-products/src/components/InterstitialScreen/_storybook-styles.scss @@ -37,37 +37,33 @@ } .NoImageExampleModal { - $one-grid-column: calc( - 100% / 16 - ); // stylelint-disable-line carbon/layout-token-use + $one-grid-column: calc(100% / 16); // stylelint-disable-line carbon/layout-use width: calc( $one-grid-column * 16 - ); // stylelint-disable-line carbon/layout-token-use + ); // stylelint-disable-line carbon/layout-use @media (min-width: 672px) { width: calc( $one-grid-column * 12 - ); // stylelint-disable-line carbon/layout-token-use + ); // stylelint-disable-line carbon/layout-use } } .NoImageExampleFullScreen { - $one-grid-column: calc( - 100% / 16 - ); // stylelint-disable-line carbon/layout-token-use + $one-grid-column: calc(100% / 16); // stylelint-disable-line carbon/layout-use width: calc( $one-grid-column * 16 - ); // stylelint-disable-line carbon/layout-token-use + ); // stylelint-disable-line carbon/layout-use @media (min-width: 672px) { width: calc( $one-grid-column * 12 - ); // stylelint-disable-line carbon/layout-token-use + ); // stylelint-disable-line carbon/layout-use } @media (min-width: 1056px) { width: calc( $one-grid-column * 8 - ); // stylelint-disable-line carbon/layout-token-use + ); // stylelint-disable-line carbon/layout-use } } diff --git a/packages/ibm-products/src/components/PageHeader/PageHeader.stories.jsx b/packages/ibm-products/src/components/PageHeader/PageHeader.stories.jsx index ffc36aa911..22e6b8fd6b 100644 --- a/packages/ibm-products/src/components/PageHeader/PageHeader.stories.jsx +++ b/packages/ibm-products/src/components/PageHeader/PageHeader.stories.jsx @@ -133,7 +133,7 @@ const children = {

( onClick={() => {}} onKeyDown={() => {}} primaryButtonText="Ghost button" - aiLabel={... || true} + decorator={... || true} title="Title" > @@ -72,7 +72,7 @@ const DocsPage = () => ( }, { description: - 'Clickable tiles only accept a boolean value of true for the aiLabel property.', + 'Clickable tiles only accept a boolean value of true for the decorator property.', source: { language: 'html', code: ` @@ -80,7 +80,7 @@ const DocsPage = () => ( onClick={() => {}} onKeyDown={() => {}} primaryButtonText="Ghost button" - aiLabel={true} + decorator={true} title="Title" > diff --git a/packages/ibm-products/src/components/ProductiveCard/ProductiveCard.stories.jsx b/packages/ibm-products/src/components/ProductiveCard/ProductiveCard.stories.jsx index bea6afca41..7a903a788f 100644 --- a/packages/ibm-products/src/components/ProductiveCard/ProductiveCard.stories.jsx +++ b/packages/ibm-products/src/components/ProductiveCard/ProductiveCard.stories.jsx @@ -7,13 +7,16 @@ import React from 'react'; import styles from './_storybook-styles.scss?inline'; // import index in case more files are added later. -import { TrashCan, Edit } from '@carbon/react/icons'; +import { TrashCan, Edit, Information } from '@carbon/react/icons'; import { Grid, Column, usePrefix, - unstable__Slug as Slug, - unstable__SlugContent as SlugContent, + AILabel, + AILabelContent, + Toggletip, + ToggletipButton, + ToggletipContent, } from '@carbon/react'; import { ProductiveCard } from '.'; import DocsPage from './ProductiveCard.docs-page'; @@ -21,25 +24,43 @@ import { action } from '@storybook/addon-actions'; const storyClass = 'productive-card-stories'; -const sampleSlug = ( - - -

-

AI Explained

-

84%

-

Confidence score

-

- This is not really Lorem Ipsum but the spell checker did not like the - previous text with it's non-words which is why this unwieldy - sentence, should one choose to call it that, here. -

-
-

Model type

-

Foundation model

-
- - -); +const sampleDecorator = (decorator) => { + switch (decorator) { + case 1: + return ( + + +
+

AI Explained

+

84%

+

Confidence score

+

+ This is not really Lorem Ipsum but the spell checker did not + like the previous text with it's non-words which is why + this unwieldy sentence, should one choose to call it that, here. +

+
+

Model type

+

Foundation model

+
+ + + ); + case 2: + return ( + + + + + +

Custom content here

+ + + ); + default: + return; + } +}; export default { title: 'IBM Products/Components/Cards/ProductiveCard', @@ -76,22 +97,23 @@ export default { labels: { 0: 'No AI slug', 1: 'with AI Slug', - 2: 'with hollow slug (boolean)', }, default: 0, }, - options: [0, 1], + options: [false, true], }, - aiLabel: { + decorator: { control: { type: 'select', labels: { 0: 'No AI label', 1: 'with AI label', + 2: 'With non AI Label component', + 3: 'with hollow AI label (boolean)', }, default: 0, }, - options: [false, true], + options: [0, 1, 2, 3], }, }, decorators: [ @@ -137,12 +159,23 @@ const defaultProps = { }; const Template = (opts) => { - const { children, columnSizeSm, columnSizeMd, columnSizeLg, slug, ...args } = - opts; + const { + children, + columnSizeSm, + columnSizeMd, + columnSizeLg, + decorator, + ...args + } = opts; return ( - + {children} diff --git a/packages/ibm-products/src/components/ProductiveCard/ProductiveCard.tsx b/packages/ibm-products/src/components/ProductiveCard/ProductiveCard.tsx index b533214bbb..57edc3de02 100644 --- a/packages/ibm-products/src/components/ProductiveCard/ProductiveCard.tsx +++ b/packages/ibm-products/src/components/ProductiveCard/ProductiveCard.tsx @@ -43,9 +43,9 @@ export interface ProductiveCardProps extends PropsWithChildren { */ actionIcons?: ActionIcon[]; /** - * Optional prop that is intended for any scenario where something is being generated by AI to reinforce AI transparency, accountability, and explainability at the UI level. + * Optional prop that allows you to pass any component. */ - aiLabel?: ReactNode | boolean; + decorator?: ReactNode | boolean; /** * Determines if the action icons are on the top or bottom of the card @@ -135,7 +135,7 @@ export interface ProductiveCardProps extends PropsWithChildren { /** * **Experimental:** For all cases a `Slug` component can be provided. * Clickable tiles only accept a boolean value of true and display a hollow slug. - * @deprecated please use the `aiLabel` prop + * @deprecated please use the `decorator` prop */ slug?: ReactNode | boolean; @@ -207,10 +207,6 @@ ProductiveCard.propTypes = { * Determines if the action icons are on the top or bottom of the card */ actionsPlacement: PropTypes.oneOf(['top', 'bottom']), - /** - * Optional prop that is intended for any scenario where something is being generated by AI to reinforce AI transparency, accountability, and explainability at the UI level. - */ - aiLabel: PropTypes.oneOfType([PropTypes.node, PropTypes.bool]), /** * Content that shows in the body of the card */ @@ -223,6 +219,10 @@ ProductiveCard.propTypes = { * Designates which zones of the card are clickable. Refer to design documentation for implementation guidelines */ clickZone: PropTypes.oneOf(['one', 'two', 'three']), + /** + * Optional prop that allows you to pass any component. + */ + decorator: PropTypes.oneOfType([PropTypes.node, PropTypes.bool]), /** * Optional header description */ diff --git a/packages/ibm-products/src/components/ProductiveCard/_storybook-styles.scss b/packages/ibm-products/src/components/ProductiveCard/_storybook-styles.scss index 9d35f6f09b..2f41d52737 100644 --- a/packages/ibm-products/src/components/ProductiveCard/_storybook-styles.scss +++ b/packages/ibm-products/src/components/ProductiveCard/_storybook-styles.scss @@ -19,7 +19,7 @@ $story-class: 'productive-card-stories'; border-right-color: $support-success; border-bottom: 0; border-left-color: $support-error; - margin: 0 auto $spacing-06 auto; + margin: 0 auto $spacing-06; border-top-left-radius: 110px; border-top-right-radius: 110px; } diff --git a/packages/ibm-products/src/components/SteppedAnimatedMedia/SteppedAnimatedMedia.tsx b/packages/ibm-products/src/components/SteppedAnimatedMedia/SteppedAnimatedMedia.tsx index 57cadd0fe2..fec4de8517 100644 --- a/packages/ibm-products/src/components/SteppedAnimatedMedia/SteppedAnimatedMedia.tsx +++ b/packages/ibm-products/src/components/SteppedAnimatedMedia/SteppedAnimatedMedia.tsx @@ -68,6 +68,7 @@ export const SteppedAnimatedMedia = React.forwardRef( const localRef = ref ?? backupRef; const localRefValue = (localRef as MutableRefObject) .current; + const filePathStr = filePaths?.join(); //converting the array to string will avoid unwanted useEffect trigger. // load animation source useEffect(() => { const isJsonFile = (filePath) => filePath.includes('.json'); @@ -81,7 +82,8 @@ export const SteppedAnimatedMedia = React.forwardRef( } } loadArtifact(); - }, [filePaths]); + // eslint-disable-next-line + }, [filePathStr]); useEffect(() => { const prefersReducedMotion = window?.matchMedia diff --git a/packages/ibm-products/src/components/Tearsheet/Tearsheet.stories.jsx b/packages/ibm-products/src/components/Tearsheet/Tearsheet.stories.jsx index c17a2686e9..c24c03e1cf 100644 --- a/packages/ibm-products/src/components/Tearsheet/Tearsheet.stories.jsx +++ b/packages/ibm-products/src/components/Tearsheet/Tearsheet.stories.jsx @@ -160,7 +160,7 @@ const mainContent = ( id="tss-ft1" labelText="Enter an important value here" style={ - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use { marginBottom: '1em' } } /> @@ -168,7 +168,7 @@ const mainContent = ( id="tss-ft2" labelText="Here is an entry field:" style={ - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use { marginBottom: '1em' } } /> @@ -389,7 +389,7 @@ const FirstElementDisabledTemplate = ({ actions, aiLabel, slug, ...args }) => { id="tss-ft1" labelText="Enter an important value here" style={ - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use { marginBottom: '1em' } } disabled @@ -398,7 +398,7 @@ const FirstElementDisabledTemplate = ({ actions, aiLabel, slug, ...args }) => { id="tss-ft2" labelText="Here is an entry field:" style={ - // stylelint-disable-next-line carbon/layout-token-use + // stylelint-disable-next-line carbon/layout-use { marginBottom: '1em' } } /> diff --git a/packages/ibm-products/src/components/Tearsheet/TearsheetShell.story.jsx b/packages/ibm-products/src/components/Tearsheet/TearsheetShell.story.jsx index df49a38b10..22f90f61b6 100644 --- a/packages/ibm-products/src/components/Tearsheet/TearsheetShell.story.jsx +++ b/packages/ibm-products/src/components/Tearsheet/TearsheetShell.story.jsx @@ -53,7 +53,7 @@ const className = 'client-class-1 client-class-2'; const dummyContent = (
=10 <= 11, @carbon/colors@npm:^11.28.0": version: 11.28.0 resolution: "@carbon/colors@npm:11.28.0" dependencies: @@ -1666,15 +1666,6 @@ __metadata: languageName: node linkType: hard -"@carbon/feature-flags@npm:^0.21.0": - version: 0.21.0 - resolution: "@carbon/feature-flags@npm:0.21.0" - dependencies: - "@ibm/telemetry-js": "npm:^1.5.0" - checksum: c8d9377cfd428ecc819ce28b2030aa9da33ffebc2d8c915e5ae589be8b9ccf582b9dccdcc731f62eea0b5643ef52c39d2471bfe202713572501997d3dffa1aa7 - languageName: node - linkType: hard - "@carbon/feature-flags@npm:^0.24.0": version: 0.24.0 resolution: "@carbon/feature-flags@npm:0.24.0" @@ -1684,16 +1675,6 @@ __metadata: languageName: node linkType: hard -"@carbon/grid@npm:^11.25.0, @carbon/grid@npm:^11.28.0": - version: 11.28.0 - resolution: "@carbon/grid@npm:11.28.0" - dependencies: - "@carbon/layout": "npm:^11.27.0" - "@ibm/telemetry-js": "npm:^1.5.0" - checksum: e1311bbac3f75f529fe2a7fd76b19456bda29fd46cdaa2849a7c571a2a0e9d0181220cb1c22ce2b2841b3c7f5fbe1b574599994b483d3a94a57a742ac5f1cba2 - languageName: node - linkType: hard - "@carbon/grid@npm:^11.29.0": version: 11.29.0 resolution: "@carbon/grid@npm:11.29.0" @@ -1709,10 +1690,10 @@ __metadata: resolution: "@carbon/ibm-cloud-cognitive-core@workspace:packages/core" dependencies: "@carbon/grid": "npm:^11.29.0" - "@carbon/ibm-products-styles": "npm:^2.51.0-rc.0" + "@carbon/ibm-products-styles": "npm:^2.51.0" "@carbon/layout": "npm:^11.28.0" "@carbon/motion": "npm:^11.24.0" - "@carbon/react": "npm:^1.70.0" + "@carbon/react": "npm:^1.71.1" "@carbon/themes": "npm:^11.43.0" "@carbon/type": "npm:^11.33.0" "@percy/cli": "npm:^1.30.1" @@ -1750,7 +1731,7 @@ __metadata: languageName: unknown linkType: soft -"@carbon/ibm-products-styles@npm:^2.51.0-rc.0, @carbon/ibm-products-styles@workspace:packages/ibm-products-styles": +"@carbon/ibm-products-styles@npm:^2.51.0, @carbon/ibm-products-styles@workspace:packages/ibm-products-styles": version: 0.0.0-use.local resolution: "@carbon/ibm-products-styles@workspace:packages/ibm-products-styles" dependencies: @@ -1760,7 +1741,7 @@ __metadata: cross-env: "npm:^7.0.3" glob: "npm:^10.3.10" jest: "npm:^29.7.0" - jest-config-ibm-cloud-cognitive: "npm:^1.14.0-rc.0" + jest-config-ibm-cloud-cognitive: "npm:^1.14.0" jest-environment-jsdom: "npm:^29.7.0" npm-check-updates: "npm:^16.14.12" npm-run-all: "npm:^4.1.5" @@ -1780,11 +1761,11 @@ __metadata: version: 0.0.0-use.local resolution: "@carbon/ibm-products-web-components@workspace:packages/ibm-products-web-components" dependencies: - "@carbon/ibm-products-styles": "npm:^2.51.0-rc.0" - "@carbon/icons": "npm:^11.52.0" + "@carbon/ibm-products-styles": "npm:^2.51.0" + "@carbon/icons": "npm:^11.53.0" "@carbon/motion": "npm:^11.24.0" - "@carbon/styles": "npm:1.69.0" - "@carbon/web-components": "npm:2.17.0" + "@carbon/styles": "npm:1.70.0" + "@carbon/web-components": "npm:2.18.0" "@mordech/vite-lit-loader": "npm:^0.35.0" "@rollup/plugin-alias": "npm:^5.1.1" "@rollup/plugin-commonjs": "npm:^28.0.1" @@ -1839,7 +1820,7 @@ __metadata: "@babel/preset-typescript": "npm:^7.21.5" "@babel/runtime": "npm:^7.23.9" "@carbon/feature-flags": "npm:^0.24.0" - "@carbon/ibm-products-styles": "npm:^2.51.0-rc.0" + "@carbon/ibm-products-styles": "npm:^2.51.0" "@carbon/telemetry": "npm:^0.1.0" "@dnd-kit/core": "npm:^6.0.8" "@dnd-kit/modifiers": "npm:^7.0.0" @@ -1864,7 +1845,7 @@ __metadata: glob: "npm:^10.3.10" immutability-helper: "npm:^3.1.1" jest: "npm:^29.7.0" - jest-config-ibm-cloud-cognitive: "npm:^1.14.0-rc.0" + jest-config-ibm-cloud-cognitive: "npm:^1.14.0" jest-environment-jsdom: "npm:^29.7.0" lodash: "npm:^4.17.21" lottie-web: "npm:^5.12.2" @@ -1883,7 +1864,7 @@ __metadata: "@carbon/grid": ^11.29.0 "@carbon/layout": ^11.28.0 "@carbon/motion": ^11.24.0 - "@carbon/react": ^1.70.0 + "@carbon/react": ^1.71.1 "@carbon/themes": ^11.43.0 "@carbon/type": ^11.33.0 react: ^16.8.6 || ^17.0.1 || ^18.2.0 @@ -1900,38 +1881,29 @@ __metadata: languageName: node linkType: hard -"@carbon/icons-react@npm:^11.52.0": - version: 11.52.0 - resolution: "@carbon/icons-react@npm:11.52.0" +"@carbon/icons-react@npm:^11.53.0": + version: 11.53.0 + resolution: "@carbon/icons-react@npm:11.53.0" dependencies: "@carbon/icon-helpers": "npm:^10.54.0" "@ibm/telemetry-js": "npm:^1.5.0" prop-types: "npm:^15.7.2" peerDependencies: react: ">=16" - checksum: 3b9397c2bdb07ec302e22101e9f10292a1a27ed63a7363292a805821dbfd3fff611c63b77cb675a7dce6f5cd5faac3f9a8ccde5be9540d146534cccd101ba5b1 + checksum: 32eafc698024b3228e8d42c151f22384fdd82206e7259023a92994b19d268c171a0ed8ff85a00718d2ef7bc1fbaccce584e3ea4c7a766ef1b464eccd8fb4537b languageName: node linkType: hard -"@carbon/icons@npm:^11.52.0": - version: 11.52.0 - resolution: "@carbon/icons@npm:11.52.0" +"@carbon/icons@npm:^11.53.0": + version: 11.53.0 + resolution: "@carbon/icons@npm:11.53.0" dependencies: "@ibm/telemetry-js": "npm:^1.5.0" - checksum: 240f960271c4aa4de07c953d9c8fa2df7b4eba235a8f8c45d8a863dc36229965d6198aef65c79a3817387b41e5672571dd7356d7225c8fc61290664ef736984b + checksum: fdd4ab7387cea3e5cdb09e701e2c121cc649e1525cffb85e32f48b814e457df83753f32eb018e22cfef96ab646b7112bec623d749c9d4f8958157383f818bc0d languageName: node linkType: hard -"@carbon/layout@npm:^11.24.0, @carbon/layout@npm:^11.27.0": - version: 11.27.0 - resolution: "@carbon/layout@npm:11.27.0" - dependencies: - "@ibm/telemetry-js": "npm:^1.5.0" - checksum: 3357ba5a44f88a33c3408b6290677bbc3edf347d28aac36fad9c3a7cf90da23c5fdc2c02e54439b2a738d4d90375736b4f931bbfeab1eddef384fd53b423fdb4 - languageName: node - linkType: hard - -"@carbon/layout@npm:^11.28.0": +"@carbon/layout@npm:>=10 <= 11, @carbon/layout@npm:^11.28.0": version: 11.28.0 resolution: "@carbon/layout@npm:11.28.0" dependencies: @@ -1940,16 +1912,7 @@ __metadata: languageName: node linkType: hard -"@carbon/motion@npm:^11.20.0": - version: 11.23.0 - resolution: "@carbon/motion@npm:11.23.0" - dependencies: - "@ibm/telemetry-js": "npm:^1.5.0" - checksum: 3fabfe0d1f970028199a436c1b3a7b083731617d945f8a078bb0fc7f16e31771a4ab49ca59047e4e9876f2473c58794d95876e31c0ee74b4406e1b29642d7b96 - languageName: node - linkType: hard - -"@carbon/motion@npm:^11.24.0": +"@carbon/motion@npm:>=10 <= 11, @carbon/motion@npm:^11.24.0": version: 11.24.0 resolution: "@carbon/motion@npm:11.24.0" dependencies: @@ -1958,24 +1921,23 @@ __metadata: languageName: node linkType: hard -"@carbon/react@npm:^1.70.0": - version: 1.70.0 - resolution: "@carbon/react@npm:1.70.0" +"@carbon/react@npm:^1.71.1": + version: 1.71.1 + resolution: "@carbon/react@npm:1.71.1" dependencies: "@babel/runtime": "npm:^7.24.7" "@carbon/feature-flags": "npm:^0.24.0" - "@carbon/icons-react": "npm:^11.52.0" + "@carbon/icons-react": "npm:^11.53.0" "@carbon/layout": "npm:^11.28.0" - "@carbon/styles": "npm:^1.69.0" + "@carbon/styles": "npm:^1.70.0" "@floating-ui/react": "npm:^0.26.0" "@ibm/telemetry-js": "npm:^1.5.0" classnames: "npm:2.5.1" copy-to-clipboard: "npm:^3.3.1" - downshift: "npm:8.5.0" + downshift: "npm:9.0.8" flatpickr: "npm:4.6.13" invariant: "npm:^2.2.3" lodash.debounce: "npm:^4.0.8" - lodash.findlast: "npm:^4.5.0" lodash.omit: "npm:^4.5.0" lodash.throttle: "npm:^4.1.1" prop-types: "npm:^15.7.2" @@ -1988,7 +1950,7 @@ __metadata: react: ^16.8.6 || ^17.0.1 || ^18.2.0 react-dom: ^16.8.6 || ^17.0.1 || ^18.2.0 sass: ^1.33.0 - checksum: b74d9f56caa93cbac8b58ab28d57959e0881591e81e4f4dbaec233ea443423acc51d8ee64cd32968a2b03aec1ffbabf7be6ddd29aadd0169177e2ed285ca3b26 + checksum: 51fde69cfc9962d4f3671dcb93c8f8da02cf3715f5a8e34a4724731e3dc519860bb2edffd8996134f41ca667051e18b56d0cd98ee7b1d57c76ef4805ae720b83 languageName: node linkType: hard @@ -2018,31 +1980,9 @@ __metadata: languageName: unknown linkType: soft -"@carbon/styles@npm:1.63.1": - version: 1.63.1 - resolution: "@carbon/styles@npm:1.63.1" - dependencies: - "@carbon/colors": "npm:^11.24.0" - "@carbon/feature-flags": "npm:^0.21.0" - "@carbon/grid": "npm:^11.25.0" - "@carbon/layout": "npm:^11.24.0" - "@carbon/motion": "npm:^11.20.0" - "@carbon/themes": "npm:^11.38.0" - "@carbon/type": "npm:^11.29.0" - "@ibm/plex": "npm:6.0.0-next.6" - "@ibm/telemetry-js": "npm:^1.5.0" - peerDependencies: - sass: ^1.33.0 - peerDependenciesMeta: - sass: - optional: true - checksum: fe83a42fc0bdbb5e0285cc7bab78dadb898b17db85a2aafaf6e8027e137e2efd09b439c9e7569af37ff00ea821b3918de116909848ab0965d2e642870054a6d5 - languageName: node - linkType: hard - -"@carbon/styles@npm:1.69.0, @carbon/styles@npm:^1.69.0": - version: 1.69.0 - resolution: "@carbon/styles@npm:1.69.0" +"@carbon/styles@npm:1.70.0, @carbon/styles@npm:^1.70.0": + version: 1.70.0 + resolution: "@carbon/styles@npm:1.70.0" dependencies: "@carbon/colors": "npm:^11.28.0" "@carbon/feature-flags": "npm:^0.24.0" @@ -2052,13 +1992,21 @@ __metadata: "@carbon/themes": "npm:^11.43.0" "@carbon/type": "npm:^11.33.0" "@ibm/plex": "npm:6.0.0-next.6" + "@ibm/plex-mono": "npm:0.0.3-alpha.0" + "@ibm/plex-sans": "npm:0.0.3-alpha.0" + "@ibm/plex-sans-arabic": "npm:0.0.3-alpha.0" + "@ibm/plex-sans-devanagari": "npm:0.0.3-alpha.0" + "@ibm/plex-sans-hebrew": "npm:0.0.3-alpha.0" + "@ibm/plex-sans-thai": "npm:0.0.3-alpha.0" + "@ibm/plex-sans-thai-looped": "npm:0.0.3-alpha.0" + "@ibm/plex-serif": "npm:0.0.3-alpha.0" "@ibm/telemetry-js": "npm:^1.5.0" peerDependencies: sass: ^1.33.0 peerDependenciesMeta: sass: optional: true - checksum: 7ff43f020ec6ef8641873863637aeb05d849ac34441a9d273b6d7d69b67b7996f4111fadb43697cfb3b2ac736b6815129760c9a1fbbe6f3d195592c186daf6f2 + checksum: 6a6c7c6c8c226b95bcac86633db516bb7099a4bb203bf68cced7f259ceaf0e0ff0c205e620be02abf2424e380c752ff57ebd9179ac2d242ccc252a36ad2b1532 languageName: node linkType: hard @@ -2071,20 +2019,7 @@ __metadata: languageName: node linkType: hard -"@carbon/themes@npm:^11.38.0": - version: 11.41.0 - resolution: "@carbon/themes@npm:11.41.0" - dependencies: - "@carbon/colors": "npm:^11.27.0" - "@carbon/layout": "npm:^11.27.0" - "@carbon/type": "npm:^11.32.0" - "@ibm/telemetry-js": "npm:^1.5.0" - color: "npm:^4.0.0" - checksum: 16711109a6f861083db88858f4b254676ed492b833ed2f4aec4960d3f6956ab35ce9b33909ab431d2061f1e4d86a115738fa1732c56683717d78e53680e1fa48 - languageName: node - linkType: hard - -"@carbon/themes@npm:^11.43.0": +"@carbon/themes@npm:>=10 <= 11, @carbon/themes@npm:^11.43.0": version: 11.43.0 resolution: "@carbon/themes@npm:11.43.0" dependencies: @@ -2097,18 +2032,7 @@ __metadata: languageName: node linkType: hard -"@carbon/type@npm:^11.29.0, @carbon/type@npm:^11.32.0": - version: 11.32.0 - resolution: "@carbon/type@npm:11.32.0" - dependencies: - "@carbon/grid": "npm:^11.28.0" - "@carbon/layout": "npm:^11.27.0" - "@ibm/telemetry-js": "npm:^1.5.0" - checksum: 2055a12c09c269087d1ef5cbd70e64a8e41c3f2b0623a498e44e457d45bb9951355ef0cba593086bb8e7d96e3403b60ba2be941c7a9ad1d470b31adfe7db4d99 - languageName: node - linkType: hard - -"@carbon/type@npm:^11.33.0": +"@carbon/type@npm:>=10 <= 11, @carbon/type@npm:^11.33.0": version: 11.33.0 resolution: "@carbon/type@npm:11.33.0" dependencies: @@ -2119,18 +2043,18 @@ __metadata: languageName: node linkType: hard -"@carbon/web-components@npm:2.17.0": - version: 2.17.0 - resolution: "@carbon/web-components@npm:2.17.0" +"@carbon/web-components@npm:2.18.0": + version: 2.18.0 + resolution: "@carbon/web-components@npm:2.18.0" dependencies: - "@carbon/styles": "npm:1.63.1" + "@carbon/styles": "npm:^1.70.0" "@floating-ui/dom": "npm:^1.6.3" "@ibm/telemetry-js": "npm:^1.5.0" flatpickr: "npm:4.6.13" lit: "npm:^3.1.0" lodash-es: "npm:^4.17.21" tslib: "npm:^2.6.3" - checksum: dfdea6127f7cf35a4538023e97b5c40ada4dcd8c10a49a506ca5c38a7061f35eacc91ccb93a8d8dc55c4be9c3bb9266f1248192dcb7ba1aed6221f00623f31fd + checksum: 51d99f31649ad9e021316bf11c9f55b0712be7d2ebc9d83591d6a47fe78a441b5a219e9d55ef2daa0b565b9361ddde402554e1aecdd7090ca7ee2cc281c68586 languageName: node linkType: hard @@ -2815,38 +2739,38 @@ __metadata: languageName: node linkType: hard -"@csstools/css-parser-algorithms@npm:^2.3.1": - version: 2.6.3 - resolution: "@csstools/css-parser-algorithms@npm:2.6.3" +"@csstools/css-parser-algorithms@npm:^3.0.1": + version: 3.0.4 + resolution: "@csstools/css-parser-algorithms@npm:3.0.4" peerDependencies: - "@csstools/css-tokenizer": ^2.3.1 - checksum: b893e284ebcccf37d7928be31be94fb0d6725defc544b39892d5e59ed5950b413366491817539b0add08deb9fc258c57588053d4436f84b7bd3b43bfeee67bb1 + "@csstools/css-tokenizer": ^3.0.3 + checksum: dfb6926218d9f8ba25d8b43ea46c03863c819481f8c55e4de4925780eaab9e6bcd6bead1d56b4ef82d09fcd9d69a7db2750fa9db08eece9470fd499dc76d0edb languageName: node linkType: hard -"@csstools/css-tokenizer@npm:^2.2.0": - version: 2.3.1 - resolution: "@csstools/css-tokenizer@npm:2.3.1" - checksum: 25c8643151667bfc2ce653174786d9f97fea93aa38d48432937bc634d8478dfa03e5e6ad18d3fff3d6fa245e9f6578f87ca07d9fd764a274702e4bb8dd34dede +"@csstools/css-tokenizer@npm:^3.0.1": + version: 3.0.3 + resolution: "@csstools/css-tokenizer@npm:3.0.3" + checksum: 6baa3160e426e1f177b8f10d54ec7a4a596090f65a05f16d7e9e4da049962a404eabc5f885f4867093702c259cd4080ac92a438326e22dea015201b3e71f5bbb languageName: node linkType: hard -"@csstools/media-query-list-parser@npm:^2.1.4": - version: 2.1.11 - resolution: "@csstools/media-query-list-parser@npm:2.1.11" +"@csstools/media-query-list-parser@npm:^3.0.1": + version: 3.0.1 + resolution: "@csstools/media-query-list-parser@npm:3.0.1" peerDependencies: - "@csstools/css-parser-algorithms": ^2.6.3 - "@csstools/css-tokenizer": ^2.3.1 - checksum: 23ede5583c6f1f51ec45b9293fcaf1ecac0f69c7ea750bfe2245926a66a6ae8f7dea8b3604fc4a5b8be4a25c1bccf519a357bf926d486a7ff479e89685011ff4 + "@csstools/css-parser-algorithms": ^3.0.1 + "@csstools/css-tokenizer": ^3.0.1 + checksum: 794344c67b126ad93d516ab3f01254d44cfa794c3401e34e8cc62ddc7fc13c9ab6c76cb517b643dbda47b57f2eb578c6a11c4a9a4b516d88e260a4016b64ce7f languageName: node linkType: hard -"@csstools/selector-specificity@npm:^3.0.0": - version: 3.1.1 - resolution: "@csstools/selector-specificity@npm:3.1.1" +"@csstools/selector-specificity@npm:^4.0.0": + version: 4.0.0 + resolution: "@csstools/selector-specificity@npm:4.0.0" peerDependencies: - postcss-selector-parser: ^6.0.13 - checksum: 3786a6afea97b08ad739ee8f4004f7e0a9e25049cee13af809dbda6462090744012a54bd9275a44712791e8f103f85d21641f14e81799f9dab946b0459a5e1ef + postcss-selector-parser: ^6.1.0 + checksum: 7076c1d8af0fba94f06718f87fba5bfea583f39089efa906ae38b5ecd6912d3d5865f7047a871ac524b1057e4c970622b2ade456b90d69fb9393902250057994 languageName: node linkType: hard @@ -2912,6 +2836,24 @@ __metadata: languageName: node linkType: hard +"@double-great/stylelint-a11y@npm:^3.0.2": + version: 3.0.2 + resolution: "@double-great/stylelint-a11y@npm:3.0.2" + dependencies: + postcss: "npm:^8.4.33" + peerDependencies: + stylelint: ">=16.0.0" + checksum: 5abfe4f251e67eb9ef9d8e96a1fe9ae9c620e3f8279d5aab79269bd4d2ce86c578185072822346dd118e9cd915b3a11ada0980e26b6b6c4547111be2152f7fdb + languageName: node + linkType: hard + +"@dual-bundle/import-meta-resolve@npm:^4.1.0": + version: 4.1.0 + resolution: "@dual-bundle/import-meta-resolve@npm:4.1.0" + checksum: a69d804a8e8e93732ac5525f85b9366ae78ec60fa02f0d5b4f2d625e18b355ba02502cdaef616ab1eac4450b966d2a398b59577a17483e4f8a350d062357bdf4 + languageName: node + linkType: hard + "@emotion/is-prop-valid@npm:^0.8.2": version: 0.8.8 resolution: "@emotion/is-prop-valid@npm:0.8.8" @@ -3537,6 +3479,62 @@ __metadata: languageName: node linkType: hard +"@ibm/plex-mono@npm:0.0.3-alpha.0": + version: 0.0.3-alpha.0 + resolution: "@ibm/plex-mono@npm:0.0.3-alpha.0" + checksum: fbdfb70762dead35bd12fd69344133f3290bd4ede4fd3607f6949e80e3c516190e772afc5f8ba060426911bf1b89744f02e7b0fdd25cca818086f3ce312fcad4 + languageName: node + linkType: hard + +"@ibm/plex-sans-arabic@npm:0.0.3-alpha.0": + version: 0.0.3-alpha.0 + resolution: "@ibm/plex-sans-arabic@npm:0.0.3-alpha.0" + checksum: c390dd9788a36f4cb2abb2fcf63deb2a3c8b9e7aa8a7e6263ff6484b2fe99044258e2daeb36e7c0b0eeaea17e4128a8ce567208458f851ee6b05ec8c54f84edb + languageName: node + linkType: hard + +"@ibm/plex-sans-devanagari@npm:0.0.3-alpha.0": + version: 0.0.3-alpha.0 + resolution: "@ibm/plex-sans-devanagari@npm:0.0.3-alpha.0" + checksum: ef3cd967100210a822bea7b36c5ac54f915a319d5e23fa1175ea63d0405c826023f241d54b4f7beb5928603fbe01a5bae22839dad6922330bb84921eb289d193 + languageName: node + linkType: hard + +"@ibm/plex-sans-hebrew@npm:0.0.3-alpha.0": + version: 0.0.3-alpha.0 + resolution: "@ibm/plex-sans-hebrew@npm:0.0.3-alpha.0" + checksum: e67ed6e081dbf9a522eca8e35471a329c788e6a03042df89649b034eaa2e66898bc44b72c0c0f57d93d24b37796cfc92729cee7754eb83ec2cd27f1fa9bdeea6 + languageName: node + linkType: hard + +"@ibm/plex-sans-thai-looped@npm:0.0.3-alpha.0": + version: 0.0.3-alpha.0 + resolution: "@ibm/plex-sans-thai-looped@npm:0.0.3-alpha.0" + checksum: 11272b1353611fed07788a870793ca6f45c644f47faa99880d5278552a7acd85b0696ca02336b7aa8e29bf5d6353538d322149cb8b6b2e65985c38f0af6359fe + languageName: node + linkType: hard + +"@ibm/plex-sans-thai@npm:0.0.3-alpha.0": + version: 0.0.3-alpha.0 + resolution: "@ibm/plex-sans-thai@npm:0.0.3-alpha.0" + checksum: baac49d77d2075ee6ecbd5ed22d938b1afca898e5d8d9948f079613d2be011216acf52a6ae555e3cf732d8aa60b7b89b1eaef4380590a66270d7b166067a271a + languageName: node + linkType: hard + +"@ibm/plex-sans@npm:0.0.3-alpha.0": + version: 0.0.3-alpha.0 + resolution: "@ibm/plex-sans@npm:0.0.3-alpha.0" + checksum: 5b0b0521dbeb7c32eb13a932b53baef0013b96d5d39547b35c69a991707a3f75cec37383c9f239229fdedfb91fda8c8005f25fdddcb900937d6de7dbd456175a + languageName: node + linkType: hard + +"@ibm/plex-serif@npm:0.0.3-alpha.0": + version: 0.0.3-alpha.0 + resolution: "@ibm/plex-serif@npm:0.0.3-alpha.0" + checksum: 462dcf33937f50f5a0ecf320f1d930c612e92293aa40dda08c05f6630d8795e4233023bb4f8ed3d340d2dbbd82a4b7ec5ae5e511f4260b16ff9ade6f481e48e8 + languageName: node + linkType: hard + "@ibm/plex@npm:6.0.0-next.6": version: 6.0.0-next.6 resolution: "@ibm/plex@npm:6.0.0-next.6" @@ -3566,6 +3564,15 @@ __metadata: languageName: node linkType: hard +"@ibm/telemetry-js@npm:^1.6.1": + version: 1.8.0 + resolution: "@ibm/telemetry-js@npm:1.8.0" + bin: + ibmtelemetry: dist/collect.js + checksum: 10546acd6ce1b7547d3950e0f6b4da533c795ac7a8cfff96f63e05b39aaaf49d31dd1303637a3d830f7a2dbe67a10eca227cd5327ffb763a2631da0d524c0601 + languageName: node + linkType: hard + "@inquirer/confirm@npm:^3.0.0": version: 3.2.0 resolution: "@inquirer/confirm@npm:3.2.0" @@ -7391,7 +7398,7 @@ __metadata: languageName: node linkType: hard -"@types/minimist@npm:^1.2.0, @types/minimist@npm:^1.2.2": +"@types/minimist@npm:^1.2.0": version: 1.2.5 resolution: "@types/minimist@npm:1.2.5" checksum: 477047b606005058ab0263c4f58097136268007f320003c348794f74adedc3166ffc47c80ec3e94687787f2ab7f4e72c468223946e79892cf0fd9e25e9970a90 @@ -8298,9 +8305,9 @@ __metadata: languageName: node linkType: hard -"accessibility-checker@npm:^3.1.65": - version: 3.1.70 - resolution: "accessibility-checker@npm:3.1.70" +"accessibility-checker@npm:^3.1.78": + version: 3.1.78 + resolution: "accessibility-checker@npm:3.1.78" dependencies: axios: "npm:^1.4.0" chromedriver: "npm:*" @@ -8311,7 +8318,7 @@ __metadata: string-hash: "npm:^1.1.3" bin: achecker: bin/achecker.js - checksum: 5e9dd13e8e31369496f0cea61af0fd4b6cb8acd7321ecd3c29ee00ab3840e5dfe24cefd6b08442a90624a3ca9f414b8cecbae80a4d6b3f7ac5c4946c266ae18c + checksum: 04453a96b584cd101ba45f141b283b7eddc651a1be81525c5107161f43a98d3efde6dd0c2e1fc70663252ce6ada82eb9565c82a92cb9402c01a51a7683ccb099 languageName: node linkType: hard @@ -9625,18 +9632,6 @@ __metadata: languageName: node linkType: hard -"camelcase-keys@npm:^7.0.0": - version: 7.0.2 - resolution: "camelcase-keys@npm:7.0.2" - dependencies: - camelcase: "npm:^6.3.0" - map-obj: "npm:^4.1.0" - quick-lru: "npm:^5.1.1" - type-fest: "npm:^1.2.1" - checksum: 6f92d969b7fa97456ffc35fe93f0a42d0d0a00fbd94bfc6cac07c84da86e6acfb89fdf04151460d47c583d2dd38a3e9406f980efe9a3d2e143cdfe46a7343083 - languageName: node - linkType: hard - "camelcase@npm:^5.3.1": version: 5.3.1 resolution: "camelcase@npm:5.3.1" @@ -9644,7 +9639,7 @@ __metadata: languageName: node linkType: hard -"camelcase@npm:^6.2.0, camelcase@npm:^6.3.0": +"camelcase@npm:^6.2.0": version: 6.3.0 resolution: "camelcase@npm:6.3.0" checksum: 8c96818a9076434998511251dcb2761a94817ea17dbdc37f47ac080bd088fc62c7369429a19e2178b993497132c8cbcf5cc1f44ba963e76782ba469c0474938d @@ -10387,7 +10382,7 @@ __metadata: languageName: node linkType: hard -"compute-scroll-into-view@npm:^3.0.3": +"compute-scroll-into-view@npm:^3.1.0": version: 3.1.0 resolution: "compute-scroll-into-view@npm:3.1.0" checksum: cc5211d49bced5ad23385da5c2eaf69b6045628581b0dcb9f4dd407bfee51bbd26d2bce426be26edf2feaf8c243706f5a7c3759827d89cc5a01a5cf7d299a5eb @@ -10701,6 +10696,23 @@ __metadata: languageName: node linkType: hard +"cosmiconfig@npm:^9.0.0": + version: 9.0.0 + resolution: "cosmiconfig@npm:9.0.0" + dependencies: + env-paths: "npm:^2.2.1" + import-fresh: "npm:^3.3.0" + js-yaml: "npm:^4.1.0" + parse-json: "npm:^5.2.0" + peerDependencies: + typescript: ">=4.9.5" + peerDependenciesMeta: + typescript: + optional: true + checksum: 8bdf1dfbb6fdb3755195b6886dc0649a3c742ec75afa4cb8da7b070936aed22a4f4e5b7359faafe03180358f311dbc300d248fd6586c458203d376a40cc77826 + languageName: node + linkType: hard + "crc-32@npm:^1.2.0": version: 1.2.2 resolution: "crc-32@npm:1.2.2" @@ -10929,10 +10941,10 @@ __metadata: languageName: node linkType: hard -"css-functions-list@npm:^3.2.1": - version: 3.2.2 - resolution: "css-functions-list@npm:3.2.2" - checksum: b8a564118b93b87b63236a57132a3ef581416896a70c1d0df73360a9ec43dc582f7c2a586b578feb8476179518e557c6657570a8b6185b16300c7232a84d43e3 +"css-functions-list@npm:^3.2.3": + version: 3.2.3 + resolution: "css-functions-list@npm:3.2.3" + checksum: 25f12fb0ef1384b1cf45a6e7e0afd596a19bee90b90316d9e50f7820888f4a8f265be7a6a96b10a5c81e403bd7a5ff8010fa936144f84959d9d91c9350cda0d4 languageName: node linkType: hard @@ -10982,6 +10994,16 @@ __metadata: languageName: node linkType: hard +"css-tree@npm:^3.0.0, css-tree@npm:^3.0.1": + version: 3.0.1 + resolution: "css-tree@npm:3.0.1" + dependencies: + mdn-data: "npm:2.12.1" + source-map-js: "npm:^1.0.1" + checksum: 877a77669739f94e57589c94c1ea8b7b105e373d4855e94375638b411e2913337a900120dc45c13511d0f7c339b73cecf8dc61ce28034984dbf75993dac756b0 + languageName: node + linkType: hard + "css-tree@npm:~2.2.0": version: 2.2.1 resolution: "css-tree@npm:2.2.1" @@ -11255,6 +11277,18 @@ __metadata: languageName: node linkType: hard +"debug@npm:^4.3.7": + version: 4.3.7 + resolution: "debug@npm:4.3.7" + dependencies: + ms: "npm:^2.1.3" + peerDependenciesMeta: + supports-color: + optional: true + checksum: 71168908b9a78227ab29d5d25fe03c5867750e31ce24bf2c44a86efc5af041758bb56569b0a3d48a9b5344c00a24a777e6f4100ed6dfd9534a42c1dde285125a + languageName: node + linkType: hard + "decamelize-keys@npm:^1.1.0": version: 1.1.1 resolution: "decamelize-keys@npm:1.1.1" @@ -11272,13 +11306,6 @@ __metadata: languageName: node linkType: hard -"decamelize@npm:^5.0.0": - version: 5.0.1 - resolution: "decamelize@npm:5.0.1" - checksum: 643e88804c538a334fae303ae1da8b30193b81dad8689643b35e6ab8ab60a3b03492cab6096d8163bd41fd384d969485f0634c000f80af502aa7f4047258d5b4 - languageName: node - linkType: hard - "decimal.js@npm:^10.4.2": version: 10.4.3 resolution: "decimal.js@npm:10.4.3" @@ -11587,7 +11614,7 @@ __metadata: languageName: node linkType: hard -"doiuse@npm:^6.0.1": +"doiuse@npm:^6.0.5": version: 6.0.5 resolution: "doiuse@npm:6.0.5" dependencies: @@ -11746,18 +11773,18 @@ __metadata: languageName: node linkType: hard -"downshift@npm:8.5.0": - version: 8.5.0 - resolution: "downshift@npm:8.5.0" +"downshift@npm:9.0.8": + version: 9.0.8 + resolution: "downshift@npm:9.0.8" dependencies: - "@babel/runtime": "npm:^7.22.15" - compute-scroll-into-view: "npm:^3.0.3" + "@babel/runtime": "npm:^7.24.5" + compute-scroll-into-view: "npm:^3.1.0" prop-types: "npm:^15.8.1" - react-is: "npm:^18.2.0" + react-is: "npm:18.2.0" tslib: "npm:^2.6.2" peerDependencies: react: ">=16.12.0" - checksum: 275f2b6868bf61aae276780c54e7511b2e4b3966c568ad9760df00bf306fef3a8aa76eae56a66d09526b062d8747a17358d21d9d8f60107f87e9f7398c85c92d + checksum: 9dc4577e780c54742ba4dde11f481f0d839f001b309200fbe4db112385b227ccd9cd2ef97d9e995379fa70249f0664a562240e415b9966f18c8a5cb7ce435f2c languageName: node linkType: hard @@ -11924,7 +11951,7 @@ __metadata: languageName: node linkType: hard -"env-paths@npm:^2.2.0": +"env-paths@npm:^2.2.0, env-paths@npm:^2.2.1": version: 2.2.1 resolution: "env-paths@npm:2.2.1" checksum: 65b5df55a8bab92229ab2b40dad3b387fad24613263d103a97f91c9fe43ceb21965cd3392b1ccb5d77088021e525c4e0481adb309625d0cb94ade1d1fb8dc17e @@ -13152,7 +13179,7 @@ __metadata: languageName: node linkType: hard -"fast-glob@npm:^3.0.3, fast-glob@npm:^3.2.11, fast-glob@npm:^3.2.2, fast-glob@npm:^3.2.7, fast-glob@npm:^3.2.9, fast-glob@npm:^3.3.1, fast-glob@npm:^3.3.2": +"fast-glob@npm:^3.0.3, fast-glob@npm:^3.2.11, fast-glob@npm:^3.2.2, fast-glob@npm:^3.2.7, fast-glob@npm:^3.2.9, fast-glob@npm:^3.3.2": version: 3.3.2 resolution: "fast-glob@npm:3.3.2" dependencies: @@ -13283,15 +13310,6 @@ __metadata: languageName: node linkType: hard -"file-entry-cache@npm:^7.0.0": - version: 7.0.2 - resolution: "file-entry-cache@npm:7.0.2" - dependencies: - flat-cache: "npm:^3.2.0" - checksum: e03e99beb9809a5679699ebd7146f3b93870b57775705f4b61bda4a1d8454dfd261b48e770a601f6c36a4789b4c0750f262e4d5fb2c7eeceb75e16439b07211a - languageName: node - linkType: hard - "file-entry-cache@npm:^8.0.0": version: 8.0.0 resolution: "file-entry-cache@npm:8.0.0" @@ -13301,6 +13319,15 @@ __metadata: languageName: node linkType: hard +"file-entry-cache@npm:^9.1.0": + version: 9.1.0 + resolution: "file-entry-cache@npm:9.1.0" + dependencies: + flat-cache: "npm:^5.0.0" + checksum: fd67a9552f272ac4a1731c545e1350bd135e208659144cc5311baac6b8bbf55da7c8c3a0bf25c71ed78eff2bdd26d2a3a8f9ba3d8bec968fe8d1eeba6ab14a96 + languageName: node + linkType: hard + "file-system-cache@npm:2.3.0": version: 2.3.0 resolution: "file-system-cache@npm:2.3.0" @@ -13374,7 +13401,7 @@ __metadata: languageName: node linkType: hard -"flat-cache@npm:^3.0.4, flat-cache@npm:^3.2.0": +"flat-cache@npm:^3.0.4": version: 3.2.0 resolution: "flat-cache@npm:3.2.0" dependencies: @@ -13395,6 +13422,16 @@ __metadata: languageName: node linkType: hard +"flat-cache@npm:^5.0.0": + version: 5.0.0 + resolution: "flat-cache@npm:5.0.0" + dependencies: + flatted: "npm:^3.3.1" + keyv: "npm:^4.5.4" + checksum: 42570762052b17a1dec221d73a1e417d0ba07137de6debaabb51389cac265a12a027a895dc84e1725bc5cdde04fe8b706ad836860b05488e9a04bda9301d2529 + languageName: node + linkType: hard + "flat@npm:^5.0.2": version: 5.0.2 resolution: "flat@npm:5.0.2" @@ -14685,7 +14722,7 @@ __metadata: "@types/carbon__layout": "npm:^0.0.3" "@typescript-eslint/eslint-plugin": "npm:^6.21.0" "@typescript-eslint/parser": "npm:^6.21.0" - accessibility-checker: "npm:^3.1.65" + accessibility-checker: "npm:^3.1.78" cheerio: "npm:^1.0.0-rc.12" commander: "npm:^12.0.0" copyfiles: "npm:^2.4.1" @@ -14711,9 +14748,9 @@ __metadata: react: "npm:^18.2.0" react-dom: "npm:^18.2.0" rimraf: "npm:^5.0.5" - stylelint: "npm:^15.11.0" - stylelint-config-carbon: "npm:1.19.1" - stylelint-plugin-carbon-tokens: "npm:2.8.0" + stylelint: "npm:^16.10.0" + stylelint-config-carbon: "npm:^1.20.0" + stylelint-plugin-carbon-tokens: "npm:^3.2.1" webpack: "npm:^5.96.1" languageName: unknown linkType: soft @@ -14793,6 +14830,13 @@ __metadata: languageName: node linkType: hard +"ignore@npm:^6.0.2": + version: 6.0.2 + resolution: "ignore@npm:6.0.2" + checksum: af39e49996cd989763920e445eff897d0ae1e36b5f27b0e09e14a4fd2df89b362f92e720ecf06ef729056842366527db8561d310e904718810b92ffbcd23056d + languageName: node + linkType: hard + "image-size@npm:^1.0.0": version: 1.1.1 resolution: "image-size@npm:1.1.1" @@ -14882,13 +14926,6 @@ __metadata: languageName: node linkType: hard -"indent-string@npm:^5.0.0": - version: 5.0.0 - resolution: "indent-string@npm:5.0.0" - checksum: e466c27b6373440e6d84fbc19e750219ce25865cb82d578e41a6053d727e5520dc5725217d6eb1cc76005a1bb1696a0f106d84ce7ebda3033b963a38583fb3b3 - languageName: node - linkType: hard - "infer-owner@npm:^1.0.4": version: 1.0.4 resolution: "infer-owner@npm:1.0.4" @@ -15820,7 +15857,7 @@ __metadata: languageName: node linkType: hard -"jest-config-ibm-cloud-cognitive@npm:^1.14.0-rc.0, jest-config-ibm-cloud-cognitive@workspace:config/jest-config-ibm-cloud-cognitive": +"jest-config-ibm-cloud-cognitive@npm:^1.14.0, jest-config-ibm-cloud-cognitive@workspace:config/jest-config-ibm-cloud-cognitive": version: 0.0.0-use.local resolution: "jest-config-ibm-cloud-cognitive@workspace:config/jest-config-ibm-cloud-cognitive" dependencies: @@ -15832,7 +15869,7 @@ __metadata: "@babel/preset-env": "npm:^7.18.2" "@babel/preset-react": "npm:^7.17.12" "@testing-library/jest-dom": "npm:^6.3.0" - accessibility-checker: "npm:^3.1.65" + accessibility-checker: "npm:^3.1.78" axe-core: "npm:^4.8.3" babel-jest: "npm:^29.7.0" babel-preset-ibm-cloud-cognitive: "npm:^0.14.40" @@ -16635,10 +16672,17 @@ __metadata: languageName: node linkType: hard -"known-css-properties@npm:^0.29.0": - version: 0.29.0 - resolution: "known-css-properties@npm:0.29.0" - checksum: ab4e1d6bad10fe4ba15183e640dab8eec52aaa5a69899382de5843699f145e49c67e6a3ca5c8426ccd31577d3eec4459004ed317a550c3523b863a251280ddd4 +"known-css-properties@npm:^0.34.0": + version: 0.34.0 + resolution: "known-css-properties@npm:0.34.0" + checksum: 0e93e83f84537e89b9dc56c16aff511ed9f24128fe509c3f601ce495eb10bf6678e2f4ff521f6b53feabc7bd18088e43efb31aae4cb771da831ef1408c23211a + languageName: node + linkType: hard + +"known-css-properties@npm:^0.35.0": + version: 0.35.0 + resolution: "known-css-properties@npm:0.35.0" + checksum: a6f3f271a94913c72b29e59bd1e96836b0b5427c5dd9969f4673026cd39f7f441b5e8d0b704b0a830c43d745a5f7ca98d41d99961dc4c008ebf756545bada85c languageName: node linkType: hard @@ -17043,13 +17087,6 @@ __metadata: languageName: node linkType: hard -"lodash.findlast@npm:^4.5.0": - version: 4.6.0 - resolution: "lodash.findlast@npm:4.6.0" - checksum: ee7c3e6287ebab628b06449c8847aa00263f10b43bc67f1245e4b34c2edd80802148299f61e8577675790a05a4abe75ffdadacd0984a93724a69c7a01873fb1d - languageName: node - linkType: hard - "lodash.flatten@npm:^4.4.0": version: 4.4.0 resolution: "lodash.flatten@npm:4.4.0" @@ -17534,7 +17571,7 @@ __metadata: languageName: node linkType: hard -"map-obj@npm:^4.0.0, map-obj@npm:^4.1.0": +"map-obj@npm:^4.0.0": version: 4.3.0 resolution: "map-obj@npm:4.3.0" checksum: fbc554934d1a27a1910e842bc87b177b1a556609dd803747c85ece420692380827c6ae94a95cce4407c054fa0964be3bf8226f7f2cb2e9eeee432c7c1985684e @@ -17720,6 +17757,20 @@ __metadata: languageName: node linkType: hard +"mdn-data@npm:2.12.1": + version: 2.12.1 + resolution: "mdn-data@npm:2.12.1" + checksum: 7928cfc828b0ebbde84ce56be2e3aa729c1770bfbc83ef1dadf5f98346ab003ca0a1b3339076115d77acf623719efa3f9f2be8c69f73c453fe887cb982bfa625 + languageName: node + linkType: hard + +"mdn-data@npm:^2.12.2": + version: 2.12.2 + resolution: "mdn-data@npm:2.12.2" + checksum: 854e41715a9358e69f9a530117cd6ca7e71d06176469de8d70b1e629753b6827f5bd730995c16ad3750f3c9bad92230f8e4e178de2b34926b05f5205d27d76af + languageName: node + linkType: hard + "mem@npm:^8.0.0": version: 8.1.1 resolution: "mem@npm:8.1.1" @@ -17753,26 +17804,6 @@ __metadata: languageName: node linkType: hard -"meow@npm:^10.1.5": - version: 10.1.5 - resolution: "meow@npm:10.1.5" - dependencies: - "@types/minimist": "npm:^1.2.2" - camelcase-keys: "npm:^7.0.0" - decamelize: "npm:^5.0.0" - decamelize-keys: "npm:^1.1.0" - hard-rejection: "npm:^2.1.0" - minimist-options: "npm:4.1.0" - normalize-package-data: "npm:^3.0.2" - read-pkg-up: "npm:^8.0.0" - redent: "npm:^4.0.0" - trim-newlines: "npm:^4.0.2" - type-fest: "npm:^1.2.2" - yargs-parser: "npm:^20.2.9" - checksum: 4d6d4c233b9405bace4fd6c60db0b5806d7186a047852ddce0748e56a57c75d4fef3ab2603a480bd74595e4e8e3a47b932d737397a62e043da1d3187f1240ff4 - languageName: node - linkType: hard - "meow@npm:^12.0.1": version: 12.1.1 resolution: "meow@npm:12.1.1" @@ -17780,6 +17811,13 @@ __metadata: languageName: node linkType: hard +"meow@npm:^13.2.0": + version: 13.2.0 + resolution: "meow@npm:13.2.0" + checksum: 4eff5bc921fed0b8a471ad79069d741a0210036d717547d0c7f36fdaf84ef7a3036225f38b6a53830d84dc9cbf8b944b097fde62381b8b5b215119e735ce1063 + languageName: node + linkType: hard + "meow@npm:^8.0.0, meow@npm:^8.1.2": version: 8.1.2 resolution: "meow@npm:8.1.2" @@ -18504,7 +18542,7 @@ __metadata: languageName: node linkType: hard -"ms@npm:^2.0.0, ms@npm:^2.1.1": +"ms@npm:^2.0.0, ms@npm:^2.1.1, ms@npm:^2.1.3": version: 2.1.3 resolution: "ms@npm:2.1.3" checksum: aa92de608021b242401676e35cfa5aa42dd70cbdc082b916da7fb925c542173e36bce97ea3e804923fe92c0ad991434e4a38327e15a1b5b5f945d66df615ae6d @@ -18812,7 +18850,7 @@ __metadata: languageName: node linkType: hard -"normalize-package-data@npm:^3.0.0, normalize-package-data@npm:^3.0.2, normalize-package-data@npm:^3.0.3": +"normalize-package-data@npm:^3.0.0, normalize-package-data@npm:^3.0.3": version: 3.0.3 resolution: "normalize-package-data@npm:3.0.3" dependencies: @@ -20626,23 +20664,23 @@ __metadata: languageName: node linkType: hard -"postcss-resolve-nested-selector@npm:^0.1.1": - version: 0.1.1 - resolution: "postcss-resolve-nested-selector@npm:0.1.1" - checksum: b08fb76ab092a09ee01328bad620a01dcb445ac5eb02dd0ed9ed75217c2f779ecb3bf99a361c46e695689309c08c09f1a1ad7354c8d58c2c2c40d364657fcb08 +"postcss-resolve-nested-selector@npm:^0.1.6": + version: 0.1.6 + resolution: "postcss-resolve-nested-selector@npm:0.1.6" + checksum: 85453901afe2a4db497b4e0d2c9cf2a097a08fa5d45bc646547025176217050334e423475519a1e6c74a1f31ade819d16bb37a39914e5321e250695ee3feea14 languageName: node linkType: hard -"postcss-safe-parser@npm:^6.0.0": - version: 6.0.0 - resolution: "postcss-safe-parser@npm:6.0.0" +"postcss-safe-parser@npm:^7.0.1": + version: 7.0.1 + resolution: "postcss-safe-parser@npm:7.0.1" peerDependencies: - postcss: ^8.3.3 - checksum: 06c733eaad83a3954367e7ee02ddfe3796e7a44d4299ccf9239f40964a4daac153c7d77613f32964b5a86c0c6c2f6167738f31d578b73b17cb69d0c4446f0ebe + postcss: ^8.4.31 + checksum: 285f30877f3ef5d43586432394ef4fcab904cd5bcfff5c26f586eb630fbee490abf2ac6d81e64fa212fb64d03630d12c2f3c5196f5637bec5ba3d043562ddf30 languageName: node linkType: hard -"postcss-scss@npm:^4.0.4, postcss-scss@npm:^4.0.9": +"postcss-scss@npm:^4.0.9": version: 4.0.9 resolution: "postcss-scss@npm:4.0.9" peerDependencies: @@ -20651,7 +20689,7 @@ __metadata: languageName: node linkType: hard -"postcss-selector-parser@npm:^6.0.11, postcss-selector-parser@npm:^6.1.2": +"postcss-selector-parser@npm:^6.1.2": version: 6.1.2 resolution: "postcss-selector-parser@npm:6.1.2" dependencies: @@ -20661,13 +20699,13 @@ __metadata: languageName: node linkType: hard -"postcss-selector-parser@npm:^6.0.13": - version: 6.0.16 - resolution: "postcss-selector-parser@npm:6.0.16" +"postcss-selector-parser@npm:^7.0.0": + version: 7.0.0 + resolution: "postcss-selector-parser@npm:7.0.0" dependencies: cssesc: "npm:^3.0.0" util-deprecate: "npm:^1.0.2" - checksum: 9324f63992c6564d392f9f6b16c56c05f157256e3be2d55d1234f7728252257dfd6b870a65a5d04ee3ceb9d9e7b78c043f630a58c9869b4b0481d6e064edc2cf + checksum: 0e92be7281e2b440a8be8cf207de40a24ca7bc765577916499614d5a47827a3e658206728cc559db96803e554270516104aad919a04f91bfa8914ccef1ba14ca languageName: node linkType: hard @@ -20710,7 +20748,7 @@ __metadata: languageName: node linkType: hard -"postcss@npm:^8.4.16, postcss@npm:^8.4.28, postcss@npm:^8.4.32, postcss@npm:^8.4.33": +"postcss@npm:^8.4.32, postcss@npm:^8.4.33": version: 8.4.38 resolution: "postcss@npm:8.4.38" dependencies: @@ -21163,6 +21201,13 @@ __metadata: languageName: node linkType: hard +"react-is@npm:18.2.0": + version: 18.2.0 + resolution: "react-is@npm:18.2.0" + checksum: 200cd65bf2e0be7ba6055f647091b725a45dd2a6abef03bf2380ce701fd5edccee40b49b9d15edab7ac08a762bf83cb4081e31ec2673a5bfb549a36ba21570df + languageName: node + linkType: hard + "react-is@npm:^16.13.1": version: 16.13.1 resolution: "react-is@npm:16.13.1" @@ -21351,17 +21396,6 @@ __metadata: languageName: node linkType: hard -"read-pkg-up@npm:^8.0.0": - version: 8.0.0 - resolution: "read-pkg-up@npm:8.0.0" - dependencies: - find-up: "npm:^5.0.0" - read-pkg: "npm:^6.0.0" - type-fest: "npm:^1.0.1" - checksum: fe4c80401656b40b408884457fffb5a8015c03b1018cfd8e48f8d82a5e9023e24963603aeb2755608d964593e046c15b34d29b07d35af9c7aa478be81805209c - languageName: node - linkType: hard - "read-pkg@npm:^3.0.0": version: 3.0.0 resolution: "read-pkg@npm:3.0.0" @@ -21385,18 +21419,6 @@ __metadata: languageName: node linkType: hard -"read-pkg@npm:^6.0.0": - version: 6.0.0 - resolution: "read-pkg@npm:6.0.0" - dependencies: - "@types/normalize-package-data": "npm:^2.4.0" - normalize-package-data: "npm:^3.0.2" - parse-json: "npm:^5.2.0" - type-fest: "npm:^1.0.1" - checksum: 0cebdff381128e923815c643074a87011070e5fc352bee575d327d6485da3317fab6d802a7b03deeb0be7be8d3ad1640397b3d5d2f044452caf4e8d1736bf94f - languageName: node - linkType: hard - "read@npm:^2.0.0": version: 2.1.0 resolution: "read@npm:2.1.0" @@ -21522,16 +21544,6 @@ __metadata: languageName: node linkType: hard -"redent@npm:^4.0.0": - version: 4.0.0 - resolution: "redent@npm:4.0.0" - dependencies: - indent-string: "npm:^5.0.0" - strip-indent: "npm:^4.0.0" - checksum: 6944e7b1d8f3fd28c2515f5c605b9f7f0ea0f4edddf41890bbbdd4d9ee35abb7540c3b278f03ff827bd278bb6ff4a5bd8692ca406b748c5c1c3ce7355e9fbf8f - languageName: node - linkType: hard - "reflect.getprototypeof@npm:^1.0.4": version: 1.0.6 resolution: "reflect.getprototypeof@npm:1.0.6" @@ -23191,13 +23203,6 @@ __metadata: languageName: node linkType: hard -"style-search@npm:^0.1.0": - version: 0.1.0 - resolution: "style-search@npm:0.1.0" - checksum: 841049768c863737389558fafffa0b765f553bde041b7997c4cd54606b64b0d139936e2efee74dc1ce59fcde78aaa88484d9894838c31d5c98c1ccace312a59b - languageName: node - linkType: hard - "style-value-types@npm:5.0.0": version: 5.0.0 resolution: "style-value-types@npm:5.0.0" @@ -23220,32 +23225,23 @@ __metadata: languageName: node linkType: hard -"stylelint-a11y@npm:^1.2.3": - version: 1.2.3 - resolution: "stylelint-a11y@npm:1.2.3" - peerDependencies: - stylelint: ^8.0.0 || ^9.0.0 || ^10.0.0 || ^11.0.0 || ^12.0.0 || ^13.0.0 - checksum: 97f0fd3e2ed79746a80b5b96037ddc6de16f25d5d3cfcecea0db054603336cafa0f52ab0027e1621e9ecb35aa5ee5217c273eec25e335901a82a96691537cc2d - languageName: node - linkType: hard - -"stylelint-config-carbon@npm:1.19.1": - version: 1.19.1 - resolution: "stylelint-config-carbon@npm:1.19.1" +"stylelint-config-carbon@npm:^1.20.0": + version: 1.20.0 + resolution: "stylelint-config-carbon@npm:1.20.0" dependencies: - stylelint-a11y: "npm:^1.2.3" + "@double-great/stylelint-a11y": "npm:^3.0.2" stylelint-config-idiomatic-order: "npm:^10.0.0" stylelint-config-prettier: "npm:^9.0.3" - stylelint-config-standard: "npm:^34.0.0" - stylelint-config-standard-scss: "npm:^11.0.0" - stylelint-no-unsupported-browser-features: "npm:^7.0.0" + stylelint-config-standard: "npm:^36.0.0" + stylelint-config-standard-scss: "npm:^13.1.0" + stylelint-no-unsupported-browser-features: "npm:^8.0.1" stylelint-order: "npm:^6.0.0" - stylelint-prettier: "npm:^2.0.0" - stylelint-scss: "npm:^4.1.0" + stylelint-prettier: "npm:^5.0.0" + stylelint-scss: "npm:^6.2.1" stylelint-use-logical: "npm:^2.1.0" peerDependencies: - stylelint: ^15.0.0 - checksum: 923a37ace652c98f34d806f9a49fac3b4c660a6cfac5aa274bdf07b6abfb735cf8549ff068b49accf7a9aebc15aff1efb4ce4293393e31174b89e255d47ef7fb + stylelint: ^16.0.0 + checksum: d66020246b27e85cb8f411dc008364991e5efe4487c44317f33380c5f2f0ede571fdcf3ab54a4a77d030658d7240315aff9899125ff2e3dd8bf56dd3ba0ea977 languageName: node linkType: hard @@ -23272,69 +23268,68 @@ __metadata: languageName: node linkType: hard -"stylelint-config-recommended-scss@npm:^13.1.0": - version: 13.1.0 - resolution: "stylelint-config-recommended-scss@npm:13.1.0" +"stylelint-config-recommended-scss@npm:^14.0.0": + version: 14.1.0 + resolution: "stylelint-config-recommended-scss@npm:14.1.0" dependencies: postcss-scss: "npm:^4.0.9" - stylelint-config-recommended: "npm:^13.0.0" - stylelint-scss: "npm:^5.3.0" + stylelint-config-recommended: "npm:^14.0.1" + stylelint-scss: "npm:^6.4.0" peerDependencies: postcss: ^8.3.3 - stylelint: ^15.10.0 + stylelint: ^16.6.1 peerDependenciesMeta: postcss: optional: true - checksum: 249cc4705759f779da2be797b2155b05b6d0ce49542b5144634d46295955c32b22734468529c772ba0a926fdf3bd3b0583088a74a0790cfc5e354d09b1f9a8c7 + checksum: 4dbebd9883e94eea9a6c7e1dc6978f385c4631e88a7014f41b14e2d8a5e52db6b4ac0015b41c75e8031e53c227a381b252a92ed48e6f2296c28d90fbb185f6eb languageName: node linkType: hard -"stylelint-config-recommended@npm:^13.0.0": - version: 13.0.0 - resolution: "stylelint-config-recommended@npm:13.0.0" +"stylelint-config-recommended@npm:^14.0.1": + version: 14.0.1 + resolution: "stylelint-config-recommended@npm:14.0.1" peerDependencies: - stylelint: ^15.10.0 - checksum: a56eb6d1a7c7f3a7a172b54bc34218859ba22a5a06816fb4d0964f66cb83cf372062f2c97830e994ad68243548e15fc49abf28887c3261ab1b471b3aa69f8e82 + stylelint: ^16.1.0 + checksum: 93c3fe920902abfd3f4130173876bb633230c910a3b293f5b74a0ea9c4427d197d7ade28dd62718246264f22f1e012899d0160a0176da723d14680d73876d701 languageName: node linkType: hard -"stylelint-config-standard-scss@npm:^11.0.0": - version: 11.1.0 - resolution: "stylelint-config-standard-scss@npm:11.1.0" +"stylelint-config-standard-scss@npm:^13.1.0": + version: 13.1.0 + resolution: "stylelint-config-standard-scss@npm:13.1.0" dependencies: - stylelint-config-recommended-scss: "npm:^13.1.0" - stylelint-config-standard: "npm:^34.0.0" + stylelint-config-recommended-scss: "npm:^14.0.0" + stylelint-config-standard: "npm:^36.0.0" peerDependencies: postcss: ^8.3.3 - stylelint: ^15.10.0 + stylelint: ^16.3.1 peerDependenciesMeta: postcss: optional: true - checksum: fdeb533e19230cec6975f18a5ef97252968b4387f385508c7157d8bef42fe75eb9888ff6ce97c8d6fd985fc7d7d28c897732cd3c3285907cb18a9bf8df91a6d2 + checksum: c5105e3b3390c9d0aa95e252abdf1850fa50d82e1a25a1fcc11a88b111038e00c8033a4b34905405f2203c84c0fa26ce1d40248df2172c83c76cc3baa552db07 languageName: node linkType: hard -"stylelint-config-standard@npm:^34.0.0": - version: 34.0.0 - resolution: "stylelint-config-standard@npm:34.0.0" +"stylelint-config-standard@npm:^36.0.0": + version: 36.0.1 + resolution: "stylelint-config-standard@npm:36.0.1" dependencies: - stylelint-config-recommended: "npm:^13.0.0" + stylelint-config-recommended: "npm:^14.0.1" peerDependencies: - stylelint: ^15.10.0 - checksum: 536249800c04b48a9c354067765f042713982e8222be17bb897a27d26546e50adfb87e6f1e4541807d720de3554345da99ab470e13e8d7ab0ab326c73ae3df61 + stylelint: ^16.1.0 + checksum: 50b8fb396f1cb8cb3539aa97187eb8c2a4b2858c897374faa726837a809dae7c686cb5dc32528c9698745d4e97af1fe9035a04a5a8cb220bd6b1530795437013 languageName: node linkType: hard -"stylelint-no-unsupported-browser-features@npm:^7.0.0": - version: 7.0.0 - resolution: "stylelint-no-unsupported-browser-features@npm:7.0.0" +"stylelint-no-unsupported-browser-features@npm:^8.0.1": + version: 8.0.2 + resolution: "stylelint-no-unsupported-browser-features@npm:8.0.2" dependencies: - doiuse: "npm:^6.0.1" - lodash: "npm:^4.17.15" - postcss: "npm:^8.4.16" + doiuse: "npm:^6.0.5" + postcss: "npm:^8.4.32" peerDependencies: - stylelint: ^14.0.0||^15.0.0 - checksum: cb6ba284988a0c5fcc49b8ed66f164a95ef34e3ddc6302baf4b6bd37ea8b3421ce781fe13455beb31f2a12279c0f0c62a5c3ec2c6324c53a2a1ee643962e6976 + stylelint: ^16.0.2 + checksum: e11a657a52dae7383fbc561401e4cb93d949096af7a41f40ea1d3627a0abc6b178caa8cdf9fe6f7dd412ab528d6b30817fc29b9aa721129f125816fbf45c4e50 languageName: node linkType: hard @@ -23350,63 +23345,50 @@ __metadata: languageName: node linkType: hard -"stylelint-plugin-carbon-tokens@npm:2.8.0": - version: 2.8.0 - resolution: "stylelint-plugin-carbon-tokens@npm:2.8.0" - dependencies: - "@ibm/telemetry-js": "npm:^1.5.0" - lodash: "npm:^4.17.21" - postcss: "npm:^8.4.16" - postcss-scss: "npm:^4.0.4" +"stylelint-plugin-carbon-tokens@npm:^3.2.1": + version: 3.2.1 + resolution: "stylelint-plugin-carbon-tokens@npm:3.2.1" + dependencies: + "@carbon/colors": "npm:>=10 <= 11" + "@carbon/layout": "npm:>=10 <= 11" + "@carbon/motion": "npm:>=10 <= 11" + "@carbon/themes": "npm:>=10 <= 11" + "@carbon/type": "npm:>=10 <= 11" + "@ibm/telemetry-js": "npm:^1.6.1" + postcss-scss: "npm:^4.0.9" postcss-value-parser: "npm:^4.2.0" - peerDependencies: - "@carbon/colors": ">=10 <= 11" - "@carbon/layout": ">=10 <= 11" - "@carbon/motion": ">=10 <= 11" - "@carbon/themes": ">=10 <= 11" - "@carbon/type": ">=10 <= 11" - checksum: 1201c75c77ea028fdd7b0b2220871249fce08fb12d54cd4a20887773a696fc197332798c07c6f8f17c8120c61f11144f7c757d34af3cf5e81f19829631a51799 + stylelint: "npm:^16.9.0" + checksum: 5c0b0377e57bb9061ddaa5a0bc2b542570aee2c46288e73a59da61fc3c4ed9e7d194bb5871b991e3e6ef8ed5a6ee09f4a68a348bfca1dcef57ad9ac5748bba53 languageName: node linkType: hard -"stylelint-prettier@npm:^2.0.0": - version: 2.0.0 - resolution: "stylelint-prettier@npm:2.0.0" +"stylelint-prettier@npm:^5.0.0": + version: 5.0.2 + resolution: "stylelint-prettier@npm:5.0.2" dependencies: prettier-linter-helpers: "npm:^1.0.0" peerDependencies: - prettier: ">=2.0.0" - stylelint: ">=14.0.0" - checksum: 1366d7efaa11b60421ff4953df1f675fa204b960e663621707cc4e2c2306a21f46326c447158c93c96ba2fcb18a4323bf08197ca781ab81dda03eb9da9ef0d2e - languageName: node - linkType: hard - -"stylelint-scss@npm:^4.1.0": - version: 4.7.0 - resolution: "stylelint-scss@npm:4.7.0" - dependencies: - postcss-media-query-parser: "npm:^0.2.3" - postcss-resolve-nested-selector: "npm:^0.1.1" - postcss-selector-parser: "npm:^6.0.11" - postcss-value-parser: "npm:^4.2.0" - peerDependencies: - stylelint: ^14.5.1 || ^15.0.0 - checksum: 6a49f1f19339c812adc1fc89bb30d0a79ab1a88082f8d18b9403893f06e4f646131d9d4f2788a2fe2847fe38ff6cf505de8a3f6358665e022f91903c7453f4c4 + prettier: ">=3.0.0" + stylelint: ">=16.0.0" + checksum: bee52ac6bfd03bfec07a429556d05e1cc754be9f0cf6802e19f06410d7d4cf6b2a01ca987f5e6f7816d8c88a0e73d04aa5b04be43fd121a9f805a9ab079a3719 languageName: node linkType: hard -"stylelint-scss@npm:^5.3.0": - version: 5.3.2 - resolution: "stylelint-scss@npm:5.3.2" +"stylelint-scss@npm:^6.2.1, stylelint-scss@npm:^6.4.0": + version: 6.10.0 + resolution: "stylelint-scss@npm:6.10.0" dependencies: - known-css-properties: "npm:^0.29.0" + css-tree: "npm:^3.0.1" + is-plain-object: "npm:^5.0.0" + known-css-properties: "npm:^0.35.0" + mdn-data: "npm:^2.12.2" postcss-media-query-parser: "npm:^0.2.3" - postcss-resolve-nested-selector: "npm:^0.1.1" - postcss-selector-parser: "npm:^6.0.13" + postcss-resolve-nested-selector: "npm:^0.1.6" + postcss-selector-parser: "npm:^7.0.0" postcss-value-parser: "npm:^4.2.0" peerDependencies: - stylelint: ^14.5.1 || ^15.0.0 - checksum: 1b8406bdb37dd00c81e1229d2c0153f88091ce98c31c1a2a5f453329ce9421f79bb18a94f1e65b39095e0ea3693480705fb5bbc5edd565afc396365018473c3a + stylelint: ^16.0.2 + checksum: 16ce7aadf2eb95a47f6d8cf6fef28bdf65ecff5977a6e702b16709340a1ef4108ab90708ef0d63062e1386ff04d682b83599e7841291e15279035e4c65724767 languageName: node linkType: hard @@ -23419,53 +23401,51 @@ __metadata: languageName: node linkType: hard -"stylelint@npm:^15.11.0": - version: 15.11.0 - resolution: "stylelint@npm:15.11.0" +"stylelint@npm:^16.10.0, stylelint@npm:^16.9.0": + version: 16.10.0 + resolution: "stylelint@npm:16.10.0" dependencies: - "@csstools/css-parser-algorithms": "npm:^2.3.1" - "@csstools/css-tokenizer": "npm:^2.2.0" - "@csstools/media-query-list-parser": "npm:^2.1.4" - "@csstools/selector-specificity": "npm:^3.0.0" + "@csstools/css-parser-algorithms": "npm:^3.0.1" + "@csstools/css-tokenizer": "npm:^3.0.1" + "@csstools/media-query-list-parser": "npm:^3.0.1" + "@csstools/selector-specificity": "npm:^4.0.0" + "@dual-bundle/import-meta-resolve": "npm:^4.1.0" balanced-match: "npm:^2.0.0" colord: "npm:^2.9.3" - cosmiconfig: "npm:^8.2.0" - css-functions-list: "npm:^3.2.1" - css-tree: "npm:^2.3.1" - debug: "npm:^4.3.4" - fast-glob: "npm:^3.3.1" + cosmiconfig: "npm:^9.0.0" + css-functions-list: "npm:^3.2.3" + css-tree: "npm:^3.0.0" + debug: "npm:^4.3.7" + fast-glob: "npm:^3.3.2" fastest-levenshtein: "npm:^1.0.16" - file-entry-cache: "npm:^7.0.0" + file-entry-cache: "npm:^9.1.0" global-modules: "npm:^2.0.0" globby: "npm:^11.1.0" globjoin: "npm:^0.1.4" html-tags: "npm:^3.3.1" - ignore: "npm:^5.2.4" - import-lazy: "npm:^4.0.0" + ignore: "npm:^6.0.2" imurmurhash: "npm:^0.1.4" is-plain-object: "npm:^5.0.0" - known-css-properties: "npm:^0.29.0" + known-css-properties: "npm:^0.34.0" mathml-tag-names: "npm:^2.1.3" - meow: "npm:^10.1.5" - micromatch: "npm:^4.0.5" + meow: "npm:^13.2.0" + micromatch: "npm:^4.0.8" normalize-path: "npm:^3.0.0" - picocolors: "npm:^1.0.0" - postcss: "npm:^8.4.28" - postcss-resolve-nested-selector: "npm:^0.1.1" - postcss-safe-parser: "npm:^6.0.0" - postcss-selector-parser: "npm:^6.0.13" + picocolors: "npm:^1.0.1" + postcss: "npm:^8.4.47" + postcss-resolve-nested-selector: "npm:^0.1.6" + postcss-safe-parser: "npm:^7.0.1" + postcss-selector-parser: "npm:^6.1.2" postcss-value-parser: "npm:^4.2.0" resolve-from: "npm:^5.0.0" string-width: "npm:^4.2.3" - strip-ansi: "npm:^6.0.1" - style-search: "npm:^0.1.0" - supports-hyperlinks: "npm:^3.0.0" + supports-hyperlinks: "npm:^3.1.0" svg-tags: "npm:^1.0.0" - table: "npm:^6.8.1" + table: "npm:^6.8.2" write-file-atomic: "npm:^5.0.1" bin: stylelint: bin/stylelint.mjs - checksum: 34b9242b8a009642f8a9a50319c9a6c94b745a8605890df99830fc4d4847031e59719e68df12eed897fd486724fbfb1d240a8f267bb8b4440152a4dbfc3765f5 + checksum: 2bc1627e2681414d9c61a96e8298ca7697ce8bc78bb9ffe1c3e370e064ca81cd4d131493a3f315334195b1f039ff99ea0c900e264ca4516c93ee5c36d2e4490d languageName: node linkType: hard @@ -23496,13 +23476,13 @@ __metadata: languageName: node linkType: hard -"supports-hyperlinks@npm:^3.0.0": - version: 3.0.0 - resolution: "supports-hyperlinks@npm:3.0.0" +"supports-hyperlinks@npm:^3.1.0": + version: 3.1.0 + resolution: "supports-hyperlinks@npm:3.1.0" dependencies: has-flag: "npm:^4.0.0" supports-color: "npm:^7.0.0" - checksum: 911075a412d8bcfbbca413e8963d56ed0975e35ff98d599ef85301aed4221428653145263828b6c58cb4cb6ff24596be83ead3cca221a88a70428af93d5e2a73 + checksum: e893fb035ecd86e42c5225dc1cd24db56eb950ed77b2e8f59c7aaf2836b8b2ef276ffd11f0df88b0b12184832aa2333f875eefcb74d3c47ed2633b6b41d4be43 languageName: node linkType: hard @@ -23568,7 +23548,7 @@ __metadata: languageName: node linkType: hard -"table@npm:^6.8.1": +"table@npm:^6.8.2": version: 6.8.2 resolution: "table@npm:6.8.2" dependencies: @@ -23934,13 +23914,6 @@ __metadata: languageName: node linkType: hard -"trim-newlines@npm:^4.0.2": - version: 4.1.1 - resolution: "trim-newlines@npm:4.1.1" - checksum: 5b09f8e329e8f33c1111ef26906332ba7ba7248cde3e26fc054bb3d69f2858bf5feedca9559c572ff91f33e52977c28e0d41c387df6a02a633cbb8c2d8238627 - languageName: node - linkType: hard - "trough@npm:^2.0.0": version: 2.2.0 resolution: "trough@npm:2.2.0" @@ -24122,7 +24095,7 @@ __metadata: languageName: node linkType: hard -"type-fest@npm:^1.0.1, type-fest@npm:^1.2.1, type-fest@npm:^1.2.2": +"type-fest@npm:^1.0.1": version: 1.4.0 resolution: "type-fest@npm:1.4.0" checksum: 89875c247564601c2650bacad5ff80b859007fbdb6c9e43713ae3ffa3f584552eea60f33711dd762e16496a1ab4debd409822627be14097d9a17e39c49db591a @@ -25587,7 +25560,7 @@ __metadata: languageName: node linkType: hard -"yargs-parser@npm:^20.2.2, yargs-parser@npm:^20.2.3, yargs-parser@npm:^20.2.9": +"yargs-parser@npm:^20.2.2, yargs-parser@npm:^20.2.3": version: 20.2.9 resolution: "yargs-parser@npm:20.2.9" checksum: 0188f430a0f496551d09df6719a9132a3469e47fe2747208b1dd0ab2bb0c512a95d0b081628bbca5400fb20dbf2fabe63d22badb346cecadffdd948b049f3fcc