Skip to content

Commit 52e2399

Browse files
segunadebayosegunadebayo
committed
fix(jsx): support data-attr defaultprops
1 parent 396c218 commit 52e2399

File tree

12 files changed

+44
-18
lines changed

12 files changed

+44
-18
lines changed

‎.changeset/support-data-attrs-defaultprops.md‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
---
2+
'@pandacss/generator': patch
3+
---
4+
5+
Fix TypeScript error when using `data-*` attributes in `defaultProps` for `createStyleContext` and JSX factory
6+
functions.
7+
8+
```tsx
9+
const TabsList = withContext(TabsPrimitive.List, 'list', {
10+
defaultProps: {
11+
'data-slot': 'tabs-list', // now works without type errors
12+
}
13+
})
14+
```

‎packages/generator/src/artifacts/preact-jsx/create-style-context.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -114,15 +114,15 @@ export function generatePreactCreateStyleContext(ctx: Context) {
114114
dts: outdent`
115115
${ctx.file.importType('SlotRecipeRuntimeFn, RecipeVariantProps', '../types/recipe')}
116116
${ctx.file.importType('JsxHTMLProps, JsxStyleProps, Assign', '../types/system-types')}
117-
${ctx.file.importType('JsxFactoryOptions', '../types/jsx')}
117+
${ctx.file.importType('JsxFactoryOptions, DataAttrs', '../types/jsx')}
118118
import type { ComponentType, ComponentProps, JSX } from 'preact/compat'
119119
120120
interface UnstyledProps {
121121
unstyled?: boolean | undefined
122122
}
123123
124124
interface WithProviderOptions<P = {}> {
125-
defaultProps?: Partial<P> | undefined
125+
defaultProps?: (Partial<P> & DataAttrs) | undefined
126126
}
127127
128128
type ElementType = JSX.ElementType

‎packages/generator/src/artifacts/preact-jsx/types.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,8 @@ interface Dict {
2323
[k: string]: unknown
2424
}
2525
26+
export type DataAttrs = Record<\`data-\${string}\`, unknown>
27+
2628
export interface UnstyledProps {
2729
/**
2830
* Whether to remove recipe styles
@@ -48,7 +50,7 @@ interface RecipeFn {
4850
4951
export interface JsxFactoryOptions<TProps extends Dict> {
5052
dataAttr?: boolean
51-
defaultProps?: Partial<TProps>
53+
defaultProps?: Partial<TProps> & DataAttrs
5254
shouldForwardProp?: (prop: string, variantKeys: string[]) => boolean
5355
forwardProps?: string[]
5456
}

‎packages/generator/src/artifacts/qwik-jsx/types.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,8 @@ interface Dict {
2929
[k: string]: unknown
3030
}
3131
32+
export type DataAttrs = Record<\`data-\${string}\`, unknown>
33+
3234
export interface UnstyledProps {
3335
/**
3436
* Whether to remove recipe styles
@@ -51,7 +53,7 @@ interface RecipeFn {
5153
5254
export interface JsxFactoryOptions<TProps extends Dict> {
5355
dataAttr?: boolean
54-
defaultProps?: Partial<TProps>
56+
defaultProps?: Partial<TProps> & DataAttrs
5557
shouldForwardProp?: (prop: string, variantKeys: string[]) => boolean
5658
forwardProps?: string[]
5759
}

‎packages/generator/src/artifacts/react-jsx/create-style-context.ts‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -113,7 +113,7 @@ export function generateReactCreateStyleContext(ctx: Context) {
113113
dts: outdent`
114114
${ctx.file.importType('SlotRecipeRuntimeFn, RecipeVariantProps', '../types/recipe')}
115115
${ctx.file.importType('JsxHTMLProps, JsxStyleProps, Assign', '../types/system-types')}
116-
${ctx.file.importType('JsxFactoryOptions, ComponentProps', '../types/jsx')}
116+
${ctx.file.importType('JsxFactoryOptions, ComponentProps, DataAttrs', '../types/jsx')}
117117
import type { ComponentType, ElementType } from 'react'
118118
119119
interface UnstyledProps {
@@ -127,11 +127,11 @@ export function generateReactCreateStyleContext(ctx: Context) {
127127
(props?: any): any
128128
}
129129
type SlotRecipe = SvaFn | SlotRecipeFn
130-
130+
131131
type InferSlot<R extends SlotRecipe> = R extends SlotRecipeFn ? R['__slot'] : R extends SvaFn<infer S> ? S : never
132-
132+
133133
interface WithProviderOptions<P = {}> {
134-
defaultProps?: Partial<P> | undefined
134+
defaultProps?: (Partial<P> & DataAttrs) | undefined
135135
}
136136
137137
type StyleContextProvider<T extends ElementType, R extends SlotRecipe> = ComponentType<

‎packages/generator/src/artifacts/react-jsx/types.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,8 @@ interface Dict {
2121
[k: string]: unknown
2222
}
2323
24+
export type DataAttrs = Record<\`data-\${string}\`, unknown>
25+
2426
export interface UnstyledProps {
2527
/**
2628
* Whether to remove recipe styles
@@ -50,7 +52,7 @@ interface RecipeFn {
5052
5153
export interface JsxFactoryOptions<TProps extends Dict> {
5254
dataAttr?: boolean
53-
defaultProps?: Partial<TProps>
55+
defaultProps?: Partial<TProps> & DataAttrs
5456
shouldForwardProp?: (prop: string, variantKeys: string[]) => boolean
5557
forwardProps?: string[]
5658
}

‎packages/generator/src/artifacts/solid-jsx/create-style-context.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -158,15 +158,15 @@ export function generateSolidCreateStyleContext(ctx: Context) {
158158
dts: outdent`
159159
${ctx.file.importType('SlotRecipeRuntimeFn, RecipeVariantProps', '../types/recipe')}
160160
${ctx.file.importType('JsxHTMLProps, JsxStyleProps, Assign', '../types/system-types')}
161-
${ctx.file.importType('JsxFactoryOptions', '../types/jsx')}
161+
${ctx.file.importType('JsxFactoryOptions, DataAttrs', '../types/jsx')}
162162
import type { Component, JSX, ComponentProps } from 'solid-js'
163163
164164
interface UnstyledProps {
165165
unstyled?: boolean | undefined
166166
}
167167
168168
interface WithProviderOptions<P> {
169-
defaultProps?: Partial<P> | undefined
169+
defaultProps?: (Partial<P> & DataAttrs) | undefined
170170
}
171171
172172
type ElementType = keyof JSX.IntrinsicElements | Component<any>

‎packages/generator/src/artifacts/solid-jsx/types.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,8 @@ interface Dict {
2121
[k: string]: unknown
2222
}
2323
24+
export type DataAttrs = Record<\`data-\${string}\`, unknown>
25+
2426
export interface UnstyledProps {
2527
/**
2628
* Whether to remove recipe styles
@@ -48,7 +50,7 @@ interface RecipeFn {
4850
4951
export interface JsxFactoryOptions<TProps extends Dict> {
5052
dataAttr?: boolean
51-
defaultProps?: Partial<TProps>
53+
defaultProps?: Partial<TProps> & DataAttrs
5254
shouldForwardProp?: (prop: string, variantKeys: string[]) => boolean
5355
forwardProps?: string[]
5456
}

‎packages/generator/src/artifacts/vue-jsx/create-style-context.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -138,15 +138,15 @@ export function generateVueCreateStyleContext(ctx: Context) {
138138
dts: outdent`
139139
${ctx.file.importType('SlotRecipeRuntimeFn, RecipeVariantProps', '../types/recipe')}
140140
${ctx.file.importType('JsxHTMLProps, JsxStyleProps, Assign', '../types/system-types')}
141-
${ctx.file.importType('JsxFactoryOptions', '../types/jsx')}
141+
${ctx.file.importType('JsxFactoryOptions, DataAttrs', '../types/jsx')}
142142
import type { Component, FunctionalComponent, NativeElements } from 'vue'
143143
144144
interface UnstyledProps {
145145
unstyled?: boolean | undefined
146146
}
147147
148148
interface WithProviderOptions<P = {}> {
149-
defaultProps?: Partial<P> | undefined
149+
defaultProps?: (Partial<P> & DataAttrs) | undefined
150150
}
151151
152152
// Add v-model support types

‎packages/generator/src/artifacts/vue-jsx/types.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,8 @@ interface Dict {
3333
[k: string]: unknown
3434
}
3535
36+
export type DataAttrs = Record<\`data-\${string}\`, unknown>
37+
3638
export interface UnstyledProps {
3739
/**
3840
* Whether to remove recipe styles
@@ -57,7 +59,7 @@ interface RecipeFn {
5759
5860
export interface JsxFactoryOptions<TProps extends Dict> {
5961
dataAttr?: boolean
60-
defaultProps?: Partial<TProps>
62+
defaultProps?: Partial<TProps> & DataAttrs
6163
shouldForwardProp?: (prop: string, variantKeys: string[]) => boolean
6264
forwardProps?: string[]
6365
}

0 commit comments

Comments
 (0)