Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(peer-deps): extend styled-components support to v6 #1978

Merged
merged 14 commits into from
Dec 5, 2024
Merged

feat(peer-deps): extend styled-components support to v6 #1978

Show file tree
Hide file tree
Changes from 5 commits
Commits
Show all changes
14 commits
Select commit Hold shift + click to select a range
b579307
deps: upgrade to styled-component v6
ze-flo Nov 12, 2024
60b14bf
test: fix specs
ze-flo Nov 12, 2024
7d57f43
chore: fix type errors
ze-flo Nov 15, 2024
6806ba3
Merge branch 'main' of github.com:zendeskgarden/react-components into…
ze-flo Nov 15, 2024
c3eb8e3
test: fix specs
ze-flo Nov 15, 2024
eeee419
refactor: PR feedback
ze-flo Dec 2, 2024
6b59c31
Merge branch 'main' of github.com:zendeskgarden/react-components into…
ze-flo Dec 2, 2024
10dc96a
chore: fix type error
ze-flo Dec 2, 2024
c9bc4bd
refactor: PR feedback
ze-flo Dec 3, 2024
c4b0b11
refactor(modal header): use transient props
ze-flo Dec 5, 2024
1370c7c
fix: prevent invalid DOM attributes
ze-flo Dec 5, 2024
c64c2e0
fix(splitter): prevent invalid DOM attrs
ze-flo Dec 5, 2024
7217b0b
deps: add [email protected] as peerDependency option
ze-flo Dec 5, 2024
07ecb06
deps(theming): add [email protected] as peerDependency option
ze-flo Dec 5, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
216 changes: 179 additions & 37 deletions package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

4 changes: 2 additions & 2 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,6 @@
"@types/prop-types": "15.7.13",
"@types/react": "18.3.11",
"@types/react-dom": "18.3.1",
"@types/styled-components": "5.1.34",
"@zendeskgarden/css-bedrock": "10.0.0",
"@zendeskgarden/eslint-config": "44.0.1",
"@zendeskgarden/scripts": "2.4.3",
Expand Down Expand Up @@ -100,9 +99,10 @@
"rollup-plugin-delete": "2.1.0",
"rollup-plugin-typescript2": "0.36.0",
"storybook": "7.6.20",
"styled-components": "5.3.11",
"styled-components": "6.1.13",
"stylelint": "16.10.0",
"stylelint-order": "6.0.4",
"stylis": "4.3.4",
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not seeing this added dependency used anywhere.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The migration docs are misleading. 🤔 stylis is a dependency of styled-component. Therefore, this can be removed. Good catch. 💯

"temp": "0.9.4",
"typescript": "5.6.3",
"webpack": "5.95.0"
Expand Down
4 changes: 2 additions & 2 deletions packages/accordions/src/styled/accordion/StyledRotateIcon.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
* found at http://www.apache.org/licenses/LICENSE-2.0.
*/

import styled, { css, ThemeProps, DefaultTheme } from 'styled-components';
import styled, { css, ThemeProps, DefaultTheme, DataAttributes } from 'styled-components';
import { retrieveComponentStyles, StyledBaseIcon, getColor } from '@zendeskgarden/react-theming';

const COMPONENT_ID = 'accordions.rotate_icon';
Expand Down Expand Up @@ -38,7 +38,7 @@ const colorStyles = ({
`;
};

export const StyledRotateIcon = styled(StyledBaseIcon).attrs({
export const StyledRotateIcon = styled(StyledBaseIcon).attrs<DataAttributes>({
'data-garden-id': COMPONENT_ID,
'data-garden-version': PACKAGE_VERSION
})<IStyledRotateIcon>`
Expand Down
4 changes: 2 additions & 2 deletions packages/accordions/src/styled/timeline/StyledItemIcon.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
* found at http://www.apache.org/licenses/LICENSE-2.0.
*/

import styled, { DefaultTheme, ThemeProps, css } from 'styled-components';
import styled, { DataAttributes, DefaultTheme, ThemeProps, css } from 'styled-components';
import { math } from 'polished';
import { retrieveComponentStyles, StyledBaseIcon, getColor } from '@zendeskgarden/react-theming';

Expand Down Expand Up @@ -36,7 +36,7 @@ const colorStyles = ({ $surfaceColor, theme }: IStyledItemIcon & ThemeProps<Defa
/**
* 1. Odd sizing allows the timeline line to center respective of the circle icon.
*/
export const StyledItemIcon = styled(StyledBaseIcon).attrs({
export const StyledItemIcon = styled(StyledBaseIcon).attrs<DataAttributes>({
'data-garden-id': COMPONENT_ID,
'data-garden-version': PACKAGE_VERSION
})<IStyledItemIcon>`
Expand Down
Loading