feat(css,theme,react): use data-color in all components, with color inheritance for some #2703

unekinn · 2024-10-29T16:22:52Z

React components and css now support custom colors through the data-color attribute.

BREAKING CHANGE: All React components that had a color prop have been changed to use data-color.

All¹ css targeting data-color has been changed to work with all custom colors generated by the CLI.

Avatar, Badge, Button, and Link use --ds-color-accent-*², unless data-color is set directly on the element.

For components that had a color prop, but defaulted to something other than "accent", data-color must also be set directly on the element.

All other components that defaulted to "accent", or previously only existed in "accent" color, now support data-color. They will also inherit their color from the closest data-color attribute. If none is found, they use --ds-color-accent-*².

¹: ...except Alert, which only supports info, warning, danger and success colors.
²: If an "accent" color is not defined in the theme, the --ds-color-accent-* variables will point to the first main-color.

changeset-bot · 2024-10-29T16:22:55Z

🦋 Changeset detected

Latest commit: 44ea581

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 4 packages

Name	Type
@digdir/designsystemet-react	Major
@digdir/designsystemet-css	Major
@digdir/designsystemet-theme	Major
@digdir/designsystemet	Major

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

github-actions · 2024-10-29T16:23:10Z

Preview deployments for this pull request:

Storybook - 20. Nov 2024 - 10:15

github-actions · 2024-10-29T16:24:28Z

Coverage Report

Status	Category	Percentage	Covered / Total
🔵	Lines	54.85%	3179 / 5795
🔵	Statements	54.85%	3179 / 5795
🔵	Functions	86.66%	182 / 210
🔵	Branches	76.78%	516 / 672

File Coverage

File	Stmts	Branches	Functions	Lines	Uncovered Lines
Changed Files
packages/react/src/colors.ts	0%	0%	0%	0%
packages/react/src/types.ts	0%	0%	0%	0%
packages/react/src/components/Accordion/Accordion.tsx	100%	100%	100%	100%
packages/react/src/components/Alert/Alert.tsx	100%	100%	100%	100%
packages/react/src/components/Avatar/Avatar.tsx	75%	100%	50%	75%	94-104
packages/react/src/components/Badge/Badge.tsx	12.5%	100%	0%	12.5%	57-79
packages/react/src/components/Breadcrumbs/Breadcrumbs.tsx	100%	100%	100%	100%
packages/react/src/components/Button/Button.tsx	97.05%	85.71%	100%	97.05%	77
packages/react/src/components/Card/Card.tsx	78.12%	75%	50%	78.12%	46-53
packages/react/src/components/Chip/Chips.tsx	100%	62.5%	100%	100%
packages/react/src/components/Dropdown/Dropdown.tsx	100%	100%	100%	100%
packages/react/src/components/Dropdown/DropdownButton.tsx	100%	100%	100%	100%
packages/react/src/components/Dropdown/DropdownTrigger.tsx	100%	100%	100%	100%
packages/react/src/components/ErrorSummary/ErrorSummary.tsx	27.27%	100%	0%	27.27%	23-48
packages/react/src/components/HelpText/HelpText.tsx	100%	100%	100%	100%
packages/react/src/components/Link/Link.tsx	100%	50%	100%	100%
packages/react/src/components/Modal/Modal.tsx	90.14%	76.47%	75%	90.14%	62-66, 70-72
packages/react/src/components/Pagination/Pagination.tsx	100%	50%	100%	100%
packages/react/src/components/Popover/Popover.tsx	94.69%	76.47%	100%	94.69%	156, 192-193, 196-197, 210-211
packages/react/src/components/Popover/PopoverTrigger.tsx	100%	50%	100%	100%
packages/react/src/components/SkipLink/SkipLink.tsx	100%	100%	100%	100%
packages/react/src/components/Tabs/Tabs.tsx	100%	66.66%	100%	100%
packages/react/src/components/Tag/Tag.tsx	100%	100%	100%	100%
packages/react/src/components/ToggleGroup/ToggleGroup.tsx	100%	100%	100%	100%
packages/react/src/components/Tooltip/Tooltip.tsx	90.75%	66.66%	100%	90.75%	146-150, 199-200, 202-203, 205-206
packages/react/src/components/ValidationMessage/ValidationMessage.tsx	100%	33.33%	100%	100%
packages/react/src/components/form/Checkbox/Checkbox.tsx	100%	75%	100%	100%
packages/react/src/components/form/Fieldset/Fieldset.tsx	100%	100%	100%	100%
packages/react/src/components/form/Input/Input.tsx	100%	100%	100%	100%
packages/react/src/components/form/Radio/Radio.tsx	100%	75%	100%	100%
packages/react/src/components/form/Search/SearchButton.tsx	50%	100%	0%	50%	20-25
packages/react/src/components/form/Search/SearchInput.tsx	100%	100%	100%	100%
packages/react/src/components/form/Select/Select.tsx	80.95%	50%	66.66%	80.95%	28-31
packages/react/src/components/form/Switch/Switch.tsx	100%	100%	100%	100%
packages/react/src/components/form/Textarea/Textarea.tsx	100%	100%	100%	100%
packages/react/src/components/form/Textfield/Textfield.tsx	93.87%	66.66%	100%	93.87%	109-111
packages/react/src/components/loaders/Spinner/Spinner.tsx	100%	100%	100%	100%
packages/react/src/utilities/types.ts	0%	0%	0%	0%

Generated in workflow #993 for commit 44ea581 by the Vitest Coverage Report Action

apps/storybook/tsconfig.json

packages/react/react-types.d.ts

… of location in css file

…neric color vars

…ted color

… data-color instead

… components

…ined

mimarz

Simply amazing work @unekinn 👏

I found some components to have missing default colors when no parent data-color was defined, but I suggest we fix this in a separate PR as it was easier to test downstream. Plus we also need to test this downstream now 😅 #2797

This PR was opened by the [Changesets release](https://github.com/changesets/action) GitHub action. When you're ready to do a release, you can merge this and the packages will be published to npm automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to next, this PR will be updated. ⚠️

⚠️

⚠️ `next` is currently in **pre mode** so this branch has prereleases rather than normal releases. If you want to exit prereleases, run `changeset pre exit` on `next`. ⚠️

⚠️

⚠️ # Releases ## @digdir/[email protected] ### Major Changes - Search: New compound API ([#2708](#2708)) - Radio + Checkbox: ([#2607](#2607)) - Use `label` prop instead of `children` as label text - Remove `Radio.Group` and `Checkbox.Group` and use `Fieldset` instead ### Minor Changes - React components and css now support custom colors through the `data-color` attribute. ([#2703](#2703)) **BREAKING CHANGE**: All React components that had a `color` prop have been changed to use `data-color`. All1 css targeting `data-color` has been changed to work with all custom colors generated by the CLI. `Avatar`, `Badge`, `Button`, and `Link` use `--ds-color-accent-*`2, unless `data-color` is set directly on the element. For components that had a `color` prop, but defaulted to something other than `"accent"`, `data-color` must also be set directly on the element. All other components that defaulted to `"accent"`, or previously only existed in `"accent"` color, now support `data-color`. They will also inherit their color from the closest `data-color` attribute. If none is found, they use `--ds-color-accent-*`2. 1: ...except `Alert`, which only supports `info`, `warning`, `danger` and `success` colors. 2: If an `"accent"` color is not defined in the theme, the `--ds-color-accent-*` variables will point to the first `main-color`. - Implemented a more flexible system of semantic border-radius tokens. ([#2497](#2497)) ### Patch Changes - Accordion: Fix chevron abandoning parent in scroll container ([#2699](#2699)) - SkipLink: Add css variables ([#2626](#2626)) - ValidationMessage: Add icon when `error={true}` ([#2596](#2596)) - ValidationMessage: fix icon abandoning the component when scrolling ([#2646](#2646)) - Accordion: Add css variable for chevron ([#2626](#2626)) - CSS: base sizing on font-size so all components can have all sizes, and naturally inherits size from context ([#2541](#2541)) - CSS: Move default background-color to `<body>` element ([#2754](#2754)) - Dropdown: Add `Dropdown.Button` for more explicit API ([#2694](#2694)) - Breadcrumbs: Add css variable for chevron ([#2626](#2626)) - Input: Sufficient color contrast for readonly ([#2621](#2621)) - Alert: fix icon abandoning the component when scrolling ([#2648](#2648)) - chip: Fix wrong font sizes ([#2595](#2595)) - Button: Fix SVG and images shrinking in flex containers ([#2612](#2612)) - Fieldset: Move to compound components `Fieldset.Legend` and `Fieldset.Description` ([#2705](#2705)) - Table: add `z-index` to stickhy header ([#2761](#2761)) - Tooltip: Add more variables ([#2626](#2626)) - Button: Use font-weight `--ds-font-weight-medium` ([#2618](#2618)) - Field: Adds `<Field>` component wrapping and connecting internal form elements for better accessibility ([#2502](#2502)) - Chip: Use correct `32px` height to align nicely with `<Tag>` ([#2683](#2683)) - Combobox: fix overflow on screens narrower than ~340px ([#2570](#2570)) - Label: Fix icon abandoning parent in scroll container ([#2699](#2699)) - Label: Use data attributes for styling ([#2588](#2588)) ValidationMessage: Use data attributes for styling - Select + Textarea: ([#2571](#2571)) - Remove `label`, `hideLabel`, `description`, `characterLimit` and `error` as these will be part of `Field` API - Pagination: Add css variable for chevron ([#2626](#2626)) - Field.Affix: ([#2793](#2793)) - Rename `Field.AffixWrapper` to `Field.Affixes` - Support inputs with `size` attribute - Remove `baseline` layer and fix layerorder for typography ([#2588](#2588)) - Modal backdrop was invisible in some browser versions. See <https://caniuse.com/mdn-css_selectors_backdrop_inherit_from_originating_element> for affected versions. ([#2615](#2615)) - Table: Add `Table.Foot` and style caption ([#2744](#2744)) ## @digdir/[email protected] ### Major Changes - Search: New compound API ([#2708](#2708)) - Dropdown: Add `Dropdown.Button` for more explicit API ([#2694](#2694)) - Switch: Use `label` prop instead of `children` to render label ([#2773](#2773)) - Fieldset: Move to compound components `Fieldset.Legend` and `Fieldset.Description` ([#2705](#2705)) - React components and css now support custom colors through the `data-color` attribute. ([#2703](#2703)) **BREAKING CHANGE**: All React components that had a `color` prop have been changed to use `data-color`. All1 css targeting `data-color` has been changed to work with all custom colors generated by the CLI. `Avatar`, `Badge`, `Button`, and `Link` use `--ds-color-accent-*`2, unless `data-color` is set directly on the element. For components that had a `color` prop, but defaulted to something other than `"accent"`, `data-color` must also be set directly on the element. All other components that defaulted to `"accent"`, or previously only existed in `"accent"` color, now support `data-color`. They will also inherit their color from the closest `data-color` attribute. If none is found, they use `--ds-color-accent-*`2. 1: ...except `Alert`, which only supports `info`, `warning`, `danger` and `success` colors. 2: If an `"accent"` color is not defined in the theme, the `--ds-color-accent-*` variables will point to the first `main-color`. - Input+Select: Use native HTML `size` prop instead of `htmlSize` ([#2697](#2697)) - Radio + Checkbox: ([#2607](#2607)) - Use `label` prop instead of `children` as label text - Remove `Radio.Group` and `Checkbox.Group` and use `Fieldset` instead ### Patch Changes - Dropdown: Rename `DropdownContext` to `DropdownTriggerContext` ([#2782](#2782)) - Textfield: Removed `htmlSize`, you can now use native `size` ([#2710](#2710)) - CSS: base sizing on font-size so all components can have all sizes, and naturally inherits size from context ([#2541](#2541)) - Popover+Dropdown: Fix issue when combining controlled state with changing child elements ([#2707](#2707)) - Modal: Rename `ModalContext` to `ModalTriggerContext` ([#2782](#2782)) - Input: Sufficient color contrast for readonly ([#2621](#2621)) - Popover: Make sure arrow does not leave the popover ([#2652](#2652)) - Modal: Fix `onClose` not being called ([#2622](#2622)) - Textfield: Refactored `characterLimit` to `counter` and now use new `Field.Counter` sub-component ([#2710](#2710)) - useRadioGroup: Add hook to easily control groups of `<Radio>` components ([#2739](#2739)) - useCheckboxGroup: Add hook to easily control groups of `<Checkbox>` components ([#2739](#2739)) - Modal: Expose native close event object to onClose callback ([#2738](#2738)) - Textfield: Now works as expected with `data-size` ([#2710](#2710)) - Field: Adds `<Field>` component wrapping and connecting internal form elements for better accessibility ([#2502](#2502)) - Textfield: Added `multiline` for switching between `input` and `textarea` ([#2710](#2710)) - Tooltip: Be able to send `string` as children ([#2777](#2777)) - Textfield: Removed `hideLabel`, use `aria-label` or `aria-describedby` for "hidden" labels ([#2710](#2710)) - Avatar: Fix `aria-hidden` being wrongly added to a fragment ([#2626](#2626)) - Chip: Use correct `32px` height to align nicely with `<Tag>` ([#2683](#2683)) - Label: Use data attributes for styling ([#2588](#2588)) ValidationMessage: Use data attributes for styling - Select + Textarea: ([#2571](#2571)) - Remove `label`, `hideLabel`, `description`, `characterLimit` and `error` as these will be part of `Field` API - Field.Affix: ([#2793](#2793)) - Rename `Field.AffixWrapper` to `Field.Affixes` - Support inputs with `size` attribute - Table: Add `Table.Foot` and style caption ([#2744](#2744)) - Popover: Rename `PopoverContext` to `PopoverTriggerContext` ([#2782](#2782)) - Spinner: `aria-label` required instead of `title` prop ([#2682](#2682)) - Textfield: Update to use `Field` internally ([#2710](#2710)) ## @digdir/[email protected] ### Minor Changes - React components and css now support custom colors through the `data-color` attribute. ([#2703](#2703)) **BREAKING CHANGE**: All React components that had a `color` prop have been changed to use `data-color`. All1 css targeting `data-color` has been changed to work with all custom colors generated by the CLI. `Avatar`, `Badge`, `Button`, and `Link` use `--ds-color-accent-*`2, unless `data-color` is set directly on the element. For components that had a `color` prop, but defaulted to something other than `"accent"`, `data-color` must also be set directly on the element. All other components that defaulted to `"accent"`, or previously only existed in `"accent"` color, now support `data-color`. They will also inherit their color from the closest `data-color` attribute. If none is found, they use `--ds-color-accent-*`2. 1: ...except `Alert`, which only supports `info`, `warning`, `danger` and `success` colors. 2: If an `"accent"` color is not defined in the theme, the `--ds-color-accent-*` variables will point to the first `main-color`. - CSS variables: `--ds-color-*-{1,2,...,13,contrast-1,contrast-2}`, which were generated from the `primitives` layer of design tokens, have been removed since they are always 1-to-1 with the semantic layer. Use the equivalent variables from the semantic layer instead ([#2641](#2641)) Example, for the `neutral` scale: ```css var(--ds-color-neutral-background-default); /* instead of: var(--ds-color-neutral-1) */ var(--ds-color-neutral-background-subtle); /* instead of: var(--ds-color-neutral-2) */ var(--ds-color-neutral-surface-default); /* instead of: var(--ds-color-neutral-3) */ var(--ds-color-neutral-surface-hover); /* instead of: var(--ds-color-neutral-4) */ var(--ds-color-neutral-surface-active); /* instead of: var(--ds-color-neutral-5) */ var(--ds-color-neutral-border-subtle); /* instead of: var(--ds-color-neutral-6) */ var(--ds-color-neutral-border-default); /* instead of: var(--ds-color-neutral-7) */ var(--ds-color-neutral-border-strong); /* instead of: var(--ds-color-neutral-8) */ var(--ds-color-neutral-base-default); /* instead of: var(--ds-color-neutral-9) */ var(--ds-color-neutral-base-hover); /* instead of: var(--ds-color-neutral-10) */ var(--ds-color-neutral-base-active); /* instead of: var(--ds-color-neutral-11) */ var(--ds-color-neutral-text-subtle); /* instead of: var(--ds-color-neutral-12) */ var(--ds-color-neutral-text-default); /* instead of: var(--ds-color-neutral-13) */ var(--ds-color-neutral-contrast-default); /* instead of: var(--ds-color-neutral-contrast-1) */ var(--ds-color-neutral-contrast-subtle); /* instead of: var(--ds-color-neutral-contrast-2) */ ``` ...and similarly for `accent`, `brand1`, `brand2` and `brand3`. - CLI now supports creating themes with 1 or more "main" colors, a neutral color, and 1 or more "support" colors. The "main" and "support" colors can have arbitrary names. There can not be more than 4 colors of each category unless you're using Figma on the Enterprise plan, due to plan-based restrictions on the number of variable modes per collection. ([#2733](#2733)) - Implemented a more flexible system of semantic border-radius tokens. ([#2497](#2497)) ### Patch Changes - Removed `init` command. Use `tokens create` instead. ([#2616](#2616)) - Update global colors ([#2662](#2662)) - chore: change default tokens build output folder ([`f8986b8316894ef5cd55f6ee232e4f6aaae6486a`](f8986b8)) ## @digdir/[email protected] ### Minor Changes - React components and css now support custom colors through the `data-color` attribute. ([#2703](#2703)) **BREAKING CHANGE**: All React components that had a `color` prop have been changed to use `data-color`. All1 css targeting `data-color` has been changed to work with all custom colors generated by the CLI. `Avatar`, `Badge`, `Button`, and `Link` use `--ds-color-accent-*`2, unless `data-color` is set directly on the element. For components that had a `color` prop, but defaulted to something other than `"accent"`, `data-color` must also be set directly on the element. All other components that defaulted to `"accent"`, or previously only existed in `"accent"` color, now support `data-color`. They will also inherit their color from the closest `data-color` attribute. If none is found, they use `--ds-color-accent-*`2. 1: ...except `Alert`, which only supports `info`, `warning`, `danger` and `success` colors. 2: If an `"accent"` color is not defined in the theme, the `--ds-color-accent-*` variables will point to the first `main-color`. - CSS variables: `--ds-color-*-{1,2,...,13,contrast-1,contrast-2}`, which were generated from the `primitives` layer of design tokens, have been removed since they are always 1-to-1 with the semantic layer. Use the equivalent variables from the semantic layer instead ([#2641](#2641)) Example, for the `neutral` scale: ```css var(--ds-color-neutral-background-default); /* instead of: var(--ds-color-neutral-1) */ var(--ds-color-neutral-background-subtle); /* instead of: var(--ds-color-neutral-2) */ var(--ds-color-neutral-surface-default); /* instead of: var(--ds-color-neutral-3) */ var(--ds-color-neutral-surface-hover); /* instead of: var(--ds-color-neutral-4) */ var(--ds-color-neutral-surface-active); /* instead of: var(--ds-color-neutral-5) */ var(--ds-color-neutral-border-subtle); /* instead of: var(--ds-color-neutral-6) */ var(--ds-color-neutral-border-default); /* instead of: var(--ds-color-neutral-7) */ var(--ds-color-neutral-border-strong); /* instead of: var(--ds-color-neutral-8) */ var(--ds-color-neutral-base-default); /* instead of: var(--ds-color-neutral-9) */ var(--ds-color-neutral-base-hover); /* instead of: var(--ds-color-neutral-10) */ var(--ds-color-neutral-base-active); /* instead of: var(--ds-color-neutral-11) */ var(--ds-color-neutral-text-subtle); /* instead of: var(--ds-color-neutral-12) */ var(--ds-color-neutral-text-default); /* instead of: var(--ds-color-neutral-13) */ var(--ds-color-neutral-contrast-default); /* instead of: var(--ds-color-neutral-contrast-1) */ var(--ds-color-neutral-contrast-subtle); /* instead of: var(--ds-color-neutral-contrast-2) */ ``` ...and similarly for `accent`, `brand1`, `brand2` and `brand3`. - Implemented a more flexible system of semantic border-radius tokens. ([#2497](#2497)) ### Patch Changes - tokens: Removed validationmessage and label typography styles ([#2698](#2698)) - Update global colors ([#2662](#2662)) Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

unekinn force-pushed the feat/use-data-ds-color branch from d3cc4e9 to c55241a Compare October 30, 2024 15:25

unekinn force-pushed the feat/use-data-colors-on-all-components branch from 5bdd46f to e4231ba Compare October 30, 2024 15:32

unekinn force-pushed the feat/use-data-ds-color branch from c55241a to 59d75b8 Compare October 31, 2024 14:16

unekinn force-pushed the feat/use-data-colors-on-all-components branch 3 times, most recently from 1d01855 to d2f8f3d Compare November 6, 2024 12:51

unekinn force-pushed the feat/use-data-colors-on-all-components branch from d2f8f3d to 817bdee Compare November 8, 2024 11:07

unekinn changed the base branch from feat/use-data-ds-color to feat/cli-support-custom-colors November 8, 2024 14:29

unekinn force-pushed the feat/cli-support-custom-colors branch 2 times, most recently from 366fad6 to e3220f8 Compare November 8, 2024 15:20

Base automatically changed from feat/cli-support-custom-colors to next November 8, 2024 15:29

This was referenced Nov 8, 2024

Use data attribute to choose component colors #2507

Closed

refactor(css,react): rewrite existing data-color components to use generic color vars #2700

Closed

Give typesafety for data-* #2655

Closed

unekinn force-pushed the feat/use-data-colors-on-all-components branch 5 times, most recently from 824f31c to e202e8f Compare November 13, 2024 15:10

unekinn marked this pull request as ready for review November 13, 2024 15:29

unekinn requested review from mimarz, Barsnes and eirikbacker as code owners November 13, 2024 15:29

mimarz reviewed Nov 14, 2024

View reviewed changes

apps/storybook/tsconfig.json Outdated Show resolved Hide resolved

mimarz reviewed Nov 14, 2024

View reviewed changes

packages/react/react-types.d.ts Outdated Show resolved Hide resolved

mimarz reviewed Nov 14, 2024

View reviewed changes

packages/react/react-types.d.ts Outdated Show resolved Hide resolved

unekinn force-pushed the feat/use-data-colors-on-all-components branch from 18d6cff to fd54d0e Compare November 14, 2024 16:36

unekinn added 13 commits November 18, 2024 11:14

fix(storybook): incorrect css variables shown in List docs

8eb0c56

fix(storybook): list all --dsc- properties in CssVariables regardless…

52cbe7e

… of location in css file

refactor(css,react): rewrite existing data-color components to use ge…

67ca1e7

…neric color vars

feat(css): change all components from color-accent to generic, inheri…

fe45e17

…ted color

feat(react): remove default accent color, let it be inherited through…

e7867a4

… data-color instead

fix(test): remove check for data-color="accent" in Avatar test

55520e6

fix(css,react): spinner with multiple colors

102e1b2

fix(cli): require an "accent" color

dd9d194

feat(react): add very permissible type to data-color

195b776

feat(react): color -> data-color + document data-{color,size} for all…

c6cc412

… components

fix(css,react): avatar, button and link default to accent color

278f2bb

fix: Merge -> MergeRight

67db79b

fix: remove "import ... from 'packages/react/..."

58ecb78

unekinn force-pushed the feat/use-data-colors-on-all-components branch 2 times, most recently from db7484d to cafdf35 Compare November 18, 2024 17:34

fix(css): 🚫 --dsc-tabs__ ✅ --dsc-tabs-

d69f109

unekinn force-pushed the feat/use-data-colors-on-all-components branch 2 times, most recently from fd4364a to 9585205 Compare November 18, 2024 18:08

fix(cli): don't require "accent", but generate accent vars if not def…

092d302

…ined

unekinn force-pushed the feat/use-data-colors-on-all-components branch from 9585205 to 092d302 Compare November 18, 2024 18:16

unekinn and others added 4 commits November 19, 2024 13:18

fix(css): button variants should also default to accent

b08ade8

docs(react): simplify data-color jsdoc

131db58

Add changeset

0193499

fix cli errors using downstream

54241b5

mimarz approved these changes Nov 20, 2024

View reviewed changes

Merge branch 'next' into feat/use-data-colors-on-all-components

44ea581

mimarz merged commit 1767724 into next Nov 20, 2024
10 checks passed

github-actions bot mentioned this pull request Nov 20, 2024

chore: new release candidate (next) #2592

Merged

unekinn deleted the feat/use-data-colors-on-all-components branch November 20, 2024 10:48

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(css,theme,react): use data-color in all components, with color inheritance for some #2703

feat(css,theme,react): use data-color in all components, with color inheritance for some #2703

unekinn commented Oct 29, 2024 •

edited

Loading

changeset-bot bot commented Oct 29, 2024 •

edited

Loading

github-actions bot commented Oct 29, 2024 •

edited

Loading

github-actions bot commented Oct 29, 2024 •

edited

Loading

mimarz left a comment

feat(css,theme,react): use data-color in all components, with color inheritance for some #2703

feat(css,theme,react): use data-color in all components, with color inheritance for some #2703

Conversation

unekinn commented Oct 29, 2024 • edited Loading

changeset-bot bot commented Oct 29, 2024 • edited Loading

🦋 Changeset detected

github-actions bot commented Oct 29, 2024 • edited Loading

github-actions bot commented Oct 29, 2024 • edited Loading

Coverage Report

mimarz left a comment

Choose a reason for hiding this comment

unekinn commented Oct 29, 2024 •

edited

Loading

changeset-bot bot commented Oct 29, 2024 •

edited

Loading

github-actions bot commented Oct 29, 2024 •

edited

Loading

github-actions bot commented Oct 29, 2024 •

edited

Loading