refactor: remove theme defaultProp

eslint.config.mjs

@@ -11,7 +11,6 @@ import noticePlugin from '@zendeskgarden/eslint-config/plugins/notice.js';
 import reactPlugin from '@zendeskgarden/eslint-config/plugins/react.js';
 import typescriptPlugin from '@zendeskgarden/eslint-config/plugins/typescript.js';
 import jestPlugin from '@zendeskgarden/eslint-config/plugins/jest.js';
-import gardenLocalPlugin from 'eslint-plugin-garden-local';
 
 const typescriptRules = {
   ...typescriptPlugin.rules,
@@ -46,16 +45,6 @@ export default [
       ...typescriptRules
     }
   },
-  {
-    files: ['packages/*/src/**/*.{ts,tsx}'],
-    ignores: ['packages/.template/**/*.{ts,tsx}', 'packages/*/src/**/*.spec.{ts,tsx}'],
-    plugins: {
-      'garden-local': gardenLocalPlugin
-    },
-    rules: {
-      'garden-local/require-default-theme': 'error'
-    }
-  },
   {
     files: ['packages/*/src/**/*.spec.{ts,tsx}'],
     ignores: ['packages/.template/**/*.spec.{ts,tsx}'],

package.json

@@ -73,7 +73,6 @@
     "envalid": "8.0.0",
     "eslint": "9.9.0",
     "eslint-config-prettier": "9.1.0",
-    "eslint-plugin-garden-local": "file:./utils/eslint",
     "execa": "9.3.1",
     "husky": "9.1.5",
     "identity-obj-proxy": "3.0.0",

packages/accordions/src/styled/accordion/StyledAccordion.ts

@@ -6,7 +6,7 @@
  */
 
 import styled from 'styled-components';
-import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
+import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
 
 const COMPONENT_ID = 'accordions.accordion';
 
@@ -16,7 +16,3 @@ export const StyledAccordion = styled.div.attrs({
 })`
   ${props => retrieveComponentStyles(COMPONENT_ID, props)};
 `;
-
-StyledAccordion.defaultProps = {
-  theme: DEFAULT_THEME
-};

packages/accordions/src/styled/accordion/StyledButton.ts

@@ -6,12 +6,7 @@
  */
 
 import styled, { css, ThemeProps, DefaultTheme } from 'styled-components';
-import {
-  getLineHeight,
-  retrieveComponentStyles,
-  DEFAULT_THEME,
-  getColor
-} from '@zendeskgarden/react-theming';
+import { getLineHeight, retrieveComponentStyles, getColor } from '@zendeskgarden/react-theming';
 
 export const COMPONENT_ID = 'accordions.button';
 
@@ -79,7 +74,3 @@ export const StyledButton = styled.button.attrs<IStyledButton>({
 
   ${props => retrieveComponentStyles(COMPONENT_ID, props)};
 `;
-
-StyledButton.defaultProps = {
-  theme: DEFAULT_THEME
-};

packages/accordions/src/styled/accordion/StyledHeader.ts

@@ -6,7 +6,7 @@
  */
 
 import styled from 'styled-components';
-import { retrieveComponentStyles, DEFAULT_THEME, focusStyles } from '@zendeskgarden/react-theming';
+import { retrieveComponentStyles, focusStyles } from '@zendeskgarden/react-theming';
 import { StyledButton } from './StyledButton';
 
 const COMPONENT_ID = 'accordions.header';
@@ -38,7 +38,3 @@ export const StyledHeader = styled.div.attrs<IStyledHeader>({
 
   ${props => retrieveComponentStyles(COMPONENT_ID, props)};
 `;
-
-StyledHeader.defaultProps = {
-  theme: DEFAULT_THEME
-};

packages/accordions/src/styled/accordion/StyledInnerPanel.ts

@@ -6,7 +6,7 @@
  */
 
 import styled from 'styled-components';
-import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
+import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
 import { StyledPanel } from './StyledPanel';
 
 const COMPONENT_ID = 'accordions.step_inner_panel';
@@ -34,7 +34,3 @@ export const StyledInnerPanel = styled.div.attrs({
 
   ${props => retrieveComponentStyles(COMPONENT_ID, props)};
 `;
-
-StyledInnerPanel.defaultProps = {
-  theme: DEFAULT_THEME
-};

packages/accordions/src/styled/accordion/StyledRotateIcon.ts

@@ -6,12 +6,7 @@
  */
 
 import styled, { css, ThemeProps, DefaultTheme } from 'styled-components';
-import {
-  retrieveComponentStyles,
-  DEFAULT_THEME,
-  StyledBaseIcon,
-  getColor
-} from '@zendeskgarden/react-theming';
+import { retrieveComponentStyles, StyledBaseIcon, getColor } from '@zendeskgarden/react-theming';
 
 const COMPONENT_ID = 'accordions.rotate_icon';
 
@@ -65,7 +60,3 @@ export const StyledRotateIcon = styled(StyledBaseIcon).attrs({
 
   ${props => retrieveComponentStyles(COMPONENT_ID, props)};
 `;
-
-StyledRotateIcon.defaultProps = {
-  theme: DEFAULT_THEME
-};

packages/accordions/src/styled/accordion/StyledSection.ts

@@ -6,7 +6,7 @@
  */
 
 import styled from 'styled-components';
-import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
+import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
 import { StyledPanel } from './StyledPanel';
 
 const COMPONENT_ID = 'accordions.section';
@@ -21,7 +21,3 @@ export const StyledSection = styled.div.attrs({
 
   ${props => retrieveComponentStyles(COMPONENT_ID, props)};
 `;
-
-StyledSection.defaultProps = {
-  theme: DEFAULT_THEME
-};

packages/accordions/src/styled/stepper/StyledContent.ts

@@ -6,7 +6,7 @@
  */
 
 import styled, { css, ThemeProps, DefaultTheme } from 'styled-components';
-import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
+import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
 
 const COMPONENT_ID = 'accordions.step_content';
 
@@ -44,7 +44,3 @@ export const StyledContent = styled.div.attrs<IStyledContent>({
 
   ${props => retrieveComponentStyles(COMPONENT_ID, props)};
 `;
-
-StyledContent.defaultProps = {
-  theme: DEFAULT_THEME
-};

packages/accordions/src/styled/stepper/StyledIcon.ts

@@ -6,12 +6,7 @@
  */
 
 import styled, { css, ThemeProps, DefaultTheme } from 'styled-components';
-import {
-  getLineHeight,
-  retrieveComponentStyles,
-  DEFAULT_THEME,
-  getColor
-} from '@zendeskgarden/react-theming';
+import { getLineHeight, retrieveComponentStyles, getColor } from '@zendeskgarden/react-theming';
 
 const COMPONENT_ID = 'accordions.step_icon';
 
@@ -82,11 +77,3 @@ export const StyledIcon = styled.div.attrs<IStyledIcon>({
 
   ${props => retrieveComponentStyles(COMPONENT_ID, props)};
 `;
-
-StyledIconFlexContainer.defaultProps = {
-  theme: DEFAULT_THEME
-};
-
-StyledIcon.defaultProps = {
-  theme: DEFAULT_THEME
-};

packages/accordions/src/styled/stepper/StyledInnerContent.ts

@@ -6,12 +6,7 @@
  */
 
 import styled, { ThemeProps, DefaultTheme } from 'styled-components';
-import {
-  getLineHeight,
-  retrieveComponentStyles,
-  DEFAULT_THEME,
-  getColor
-} from '@zendeskgarden/react-theming';
+import { getLineHeight, retrieveComponentStyles, getColor } from '@zendeskgarden/react-theming';
 
 const COMPONENT_ID = 'accordions.step_inner_content';
 
@@ -26,7 +21,3 @@ export const StyledInnerContent = styled.div.attrs<ThemeProps<DefaultTheme>>({
 
   ${props => retrieveComponentStyles(COMPONENT_ID, props)};
 `;
-
-StyledInnerContent.defaultProps = {
-  theme: DEFAULT_THEME
-};

packages/accordions/src/styled/stepper/StyledLabel.ts

@@ -6,12 +6,7 @@
  */
 
 import styled from 'styled-components';
-import {
-  getLineHeight,
-  retrieveComponentStyles,
-  DEFAULT_THEME,
-  getColor
-} from '@zendeskgarden/react-theming';
+import { getLineHeight, retrieveComponentStyles, getColor } from '@zendeskgarden/react-theming';
 
 const COMPONENT_ID = 'accordions.step_label';
 
@@ -41,7 +36,3 @@ export const StyledLabel = styled.div.attrs<IStyledLabelProps>({
 
   ${props => retrieveComponentStyles(COMPONENT_ID, props)};
 `;
-
-StyledLabel.defaultProps = {
-  theme: DEFAULT_THEME
-};

packages/accordions/src/styled/stepper/StyledLabelText.ts

@@ -6,7 +6,6 @@
  */
 
 import styled from 'styled-components';
-import { DEFAULT_THEME } from '@zendeskgarden/react-theming';
 
 const COMPONENT_ID = 'accordions.step_label_text';
 
@@ -23,7 +22,3 @@ export const StyledLabelText = styled.div.attrs<IStyledLabelTextProps>({
   padding: ${props => props.$isHorizontal && `0 ${props.theme.space.base * 3}px`};
   word-wrap: ${props => props.$isHorizontal && 'break-word'};
 `;
-
-StyledLabelText.defaultProps = {
-  theme: DEFAULT_THEME
-};

packages/accordions/src/styled/stepper/StyledLine.ts

@@ -6,7 +6,7 @@
  */
 
 import styled from 'styled-components';
-import { DEFAULT_THEME, getColor } from '@zendeskgarden/react-theming';
+import { getColor } from '@zendeskgarden/react-theming';
 
 const COMPONENT_ID = 'accordions.step_line';
 
@@ -23,7 +23,3 @@ export const StyledLine = styled.div.attrs({
   border-top: ${props => props.theme.borders.sm};
   border-color: ${({ theme }) => getColor({ theme, variable: 'border.default' })};
 `;
-
-StyledLine.defaultProps = {
-  theme: DEFAULT_THEME
-};

packages/accordions/src/styled/stepper/StyledStep.ts

@@ -6,7 +6,7 @@
  */
 
 import styled from 'styled-components';
-import { retrieveComponentStyles, DEFAULT_THEME, getColor } from '@zendeskgarden/react-theming';
+import { retrieveComponentStyles, getColor } from '@zendeskgarden/react-theming';
 import { StyledContent } from './StyledContent';
 import { StyledLine } from './StyledLine';
 
@@ -39,7 +39,3 @@ export const StyledStep = styled.li.attrs<IStyledStep>({
 
   ${props => retrieveComponentStyles(COMPONENT_ID, props)};
 `;
-
-StyledStep.defaultProps = {
-  theme: DEFAULT_THEME
-};

packages/accordions/src/styled/stepper/StyledStepper.ts

@@ -6,7 +6,7 @@
  */
 
 import styled from 'styled-components';
-import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
+import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
 
 const COMPONENT_ID = 'accordions.stepper';
 
@@ -28,7 +28,3 @@ export const StyledStepper = styled.ol.attrs<IStyledStepper>({
 
   ${props => retrieveComponentStyles(COMPONENT_ID, props)};
 `;
-
-StyledStepper.defaultProps = {
-  theme: DEFAULT_THEME
-};

packages/accordions/src/styled/timeline/StyledContent.ts

@@ -6,7 +6,7 @@
  */
 
 import styled from 'styled-components';
-import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
+import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
 
 const COMPONENT_ID = 'timeline.content';
 
@@ -18,7 +18,3 @@ export const StyledTimelineContent = styled.div.attrs({
   padding: ${props => `${props.theme.space.base * 5}px ${props.theme.space.base * 4}px`};
   ${props => retrieveComponentStyles(COMPONENT_ID, props)};
 `;
-
-StyledTimelineContent.defaultProps = {
-  theme: DEFAULT_THEME
-};

packages/accordions/src/styled/timeline/StyledItem.ts

@@ -6,12 +6,7 @@
  */
 
 import styled, { css } from 'styled-components';
-import {
-  getLineHeight,
-  retrieveComponentStyles,
-  DEFAULT_THEME,
-  getColor
-} from '@zendeskgarden/react-theming';
+import { getLineHeight, retrieveComponentStyles, getColor } from '@zendeskgarden/react-theming';
 import { StyledSeparator } from './StyledSeparator';
 import { StyledTimelineContent } from './StyledContent';
 import { StyledOppositeContent } from './StyledOppositeContent';
@@ -64,7 +59,3 @@ export const StyledTimelineItem = styled.li.attrs({
 
   ${props => retrieveComponentStyles(COMPONENT_ID, props)};
 `;
-
-StyledTimelineItem.defaultProps = {
-  theme: DEFAULT_THEME
-};

packages/accordions/src/styled/timeline/StyledItemIcon.ts

@@ -7,12 +7,7 @@
 
 import styled, { DefaultTheme, ThemeProps, css } from 'styled-components';
 import { math } from 'polished';
-import {
-  retrieveComponentStyles,
-  DEFAULT_THEME,
-  StyledBaseIcon,
-  getColor
-} from '@zendeskgarden/react-theming';
+import { retrieveComponentStyles, StyledBaseIcon, getColor } from '@zendeskgarden/react-theming';
 
 const COMPONENT_ID = 'timeline.icon';
 
@@ -56,7 +51,3 @@ export const StyledItemIcon = styled(StyledBaseIcon).attrs({
 
   ${props => retrieveComponentStyles(COMPONENT_ID, props)};
 `;
-
-StyledItemIcon.defaultProps = {
-  theme: DEFAULT_THEME
-};