Skip to content

Commit 2ec7d99

Browse files
vividvioletvividviolet
authored
Merge pull request #2770 from Shopify/fix-event-types
Fix JSX event types for Admin components
2 parents 0e3621f + 286514c commit 2ec7d99

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

47 files changed

+1974
-1376
lines changed

‎packages/ui-extensions/src/surfaces/admin/components.d.ts‎

Lines changed: 1010 additions & 674 deletions
Large diffs are not rendered by default.

‎packages/ui-extensions/src/surfaces/admin/components/AdminAction.d.ts‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,10 @@
1-
/** VERSION: 0.47.2 **/
1+
/** VERSION: 0.49.0 **/
22
/* eslint-disable import/extensions */
33

44
/* eslint-disable @typescript-eslint/no-namespace */
55

66
// eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
77
/// <reference lib="DOM" />
8-
// eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
9-
/// <reference lib="WebWorker" />
108
import type {ComponentChild, AdminActionProps$1} from './shared.d.ts';
119

1210
export interface AdminActionProps
@@ -94,8 +92,11 @@ declare global {
9492
declare module 'preact' {
9593
namespace createElement.JSX {
9694
interface IntrinsicElements {
97-
[tagName]: HTMLAttributes<HTMLElement> &
98-
Omit<ReactProps, 'primaryAction' | 'secondaryActions'>;
95+
[tagName]: Omit<
96+
HTMLAttributes<HTMLElement>,
97+
Extract<keyof HTMLAttributes<HTMLElement>, `on${Capitalize<string>}`>
98+
> &
99+
ReactProps;
99100
}
100101
}
101102
}

‎packages/ui-extensions/src/surfaces/admin/components/AdminBlock.d.ts‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,10 @@
1-
/** VERSION: 0.47.2 **/
1+
/** VERSION: 0.49.0 **/
22
/* eslint-disable import/extensions */
33

44
/* eslint-disable @typescript-eslint/no-namespace */
55

66
// eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
77
/// <reference lib="DOM" />
8-
// eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
9-
/// <reference lib="WebWorker" />
108
import type {AdminBlockProps$1, ComponentChild} from './shared.d.ts';
119

1210
export interface AdminBlockProps
@@ -91,7 +89,11 @@ declare global {
9189
declare module 'preact' {
9290
namespace createElement.JSX {
9391
interface IntrinsicElements {
94-
[tagName]: HTMLAttributes<HTMLElement> & ReactProps;
92+
[tagName]: Omit<
93+
HTMLAttributes<HTMLElement>,
94+
Extract<keyof HTMLAttributes<HTMLElement>, `on${Capitalize<string>}`>
95+
> &
96+
ReactProps;
9597
}
9698
}
9799
}

‎packages/ui-extensions/src/surfaces/admin/components/AdminPrintAction.d.ts‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,10 @@
1-
/** VERSION: 0.47.2 **/
1+
/** VERSION: 0.49.0 **/
22
/* eslint-disable import/extensions */
33

44
/* eslint-disable @typescript-eslint/no-namespace */
55

66
// eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
77
/// <reference lib="DOM" />
8-
// eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
9-
/// <reference lib="WebWorker" />
108
import type {AdminPrintActionProps$1, ComponentChild} from './shared.d.ts';
119

1210
export interface AdminPrintActionProps
@@ -90,7 +88,11 @@ declare global {
9088
declare module 'preact' {
9189
namespace createElement.JSX {
9290
interface IntrinsicElements {
93-
[tagName]: HTMLAttributes<HTMLElement> & ReactProps;
91+
[tagName]: Omit<
92+
HTMLAttributes<HTMLElement>,
93+
Extract<keyof HTMLAttributes<HTMLElement>, `on${Capitalize<string>}`>
94+
> &
95+
ReactProps;
9496
}
9597
}
9698
}

‎packages/ui-extensions/src/surfaces/admin/components/Badge.d.ts‎

Lines changed: 15 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,23 @@
1-
/** VERSION: 0.47.2 **/
1+
/** VERSION: 0.49.0 **/
22
/* eslint-disable import/extensions */
33

44
/* eslint-disable @typescript-eslint/no-namespace */
55
/* eslint-disable @typescript-eslint/member-ordering */
66

77
// eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
88
/// <reference lib="DOM" />
9-
// eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
10-
/// <reference lib="WebWorker" />
11-
import type {BadgeProps$1, IconType, ComponentChild} from './shared.d.ts';
9+
import type {
10+
IconProps$1,
11+
BadgeProps$1,
12+
IconType,
13+
ComponentChild,
14+
} from './shared.d.ts';
1215

1316
export interface IconProps
1417
extends Pick<IconProps$1, 'type' | 'tone' | 'color' | 'size'> {
18+
/**
19+
* Specifies the type of icon that will be displayed.
20+
*/
1521
type: '' | IconType | 'empty';
1622
tone: Extract<
1723
IconProps$1['tone'],
@@ -110,7 +116,11 @@ declare global {
110116
declare module 'preact' {
111117
namespace createElement.JSX {
112118
interface IntrinsicElements {
113-
[tagName]: HTMLAttributes<HTMLElement> & ReactProps;
119+
[tagName]: Omit<
120+
HTMLAttributes<HTMLElement>,
121+
Extract<keyof HTMLAttributes<HTMLElement>, `on${Capitalize<string>}`>
122+
> &
123+
ReactProps;
114124
}
115125
}
116126
}

‎packages/ui-extensions/src/surfaces/admin/components/Banner.d.ts‎

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,27 @@
1-
/** VERSION: 0.47.2 **/
1+
/** VERSION: 0.49.0 **/
22
/* eslint-disable import/extensions */
33

44
/* eslint-disable @typescript-eslint/no-namespace */
55
/* eslint-disable @typescript-eslint/member-ordering */
66

77
// eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
88
/// <reference lib="DOM" />
9-
// eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
10-
/// <reference lib="WebWorker" />
119
import type {ComponentChild, BannerProps$1} from './shared.d.ts';
1210

1311
export type RequiredBannerProps = Required<BannerProps$1>;
1412
export interface BannerProps
15-
extends Pick<RequiredBannerProps, 'heading' | 'dismissible' | 'hidden'> {
13+
extends Pick<
14+
RequiredBannerProps,
15+
'heading' | 'dismissible' | 'hidden' | 'tone'
16+
> {
1617
tone: Extract<
1718
RequiredBannerProps['tone'],
1819
'auto' | 'critical' | 'warning' | 'success' | 'info'
1920
>;
2021
}
2122

2223
export type CallbackEvent<T extends keyof HTMLElementTagNameMap> = Event & {
23-
target: HTMLElementTagNameMap[T];
24+
currentTarget: HTMLElementTagNameMap[T];
2425
};
2526
export type CallbackEventListener<T extends keyof HTMLElementTagNameMap> =
2627
| (EventListener & {
@@ -112,8 +113,11 @@ declare global {
112113
declare module 'preact' {
113114
namespace createElement.JSX {
114115
interface IntrinsicElements {
115-
[tagName]: HTMLAttributes<HTMLElement> &
116-
Omit<ReactProps, 'secondaryActions'>;
116+
[tagName]: Omit<
117+
HTMLAttributes<HTMLElement>,
118+
Extract<keyof HTMLAttributes<HTMLElement>, `on${Capitalize<string>}`>
119+
> &
120+
ReactProps;
117121
}
118122
}
119123
}

‎packages/ui-extensions/src/surfaces/admin/components/Box.d.ts‎

Lines changed: 46 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,10 @@
1-
/** VERSION: 0.47.2 **/
1+
/** VERSION: 0.49.0 **/
22
/* eslint-disable import/extensions */
33

44
/* eslint-disable @typescript-eslint/no-namespace */
55

66
// eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
77
/// <reference lib="DOM" />
8-
// eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
9-
/// <reference lib="WebWorker" />
108
import type {
119
BoxProps$1,
1210
MaybeAllValuesShorthandProperty,
@@ -15,79 +13,70 @@ import type {
1513

1614
export type MakeResponsive<T> = T | `@container${string}`;
1715

18-
export type AlignedBox = Required<BoxProps$1>;
16+
export type RequiredBoxProps = Required<BoxProps$1>;
17+
export type BoxBorderRadii = Extract<
18+
RequiredBoxProps['borderRadius'],
19+
| 'none'
20+
| 'small-200'
21+
| 'small-100'
22+
| 'small'
23+
| 'base'
24+
| 'large'
25+
| 'large-100'
26+
| 'large-200'
27+
>;
28+
export type BoxBorderStyles = Extract<
29+
RequiredBoxProps['borderStyle'],
30+
'none' | 'solid' | 'dashed' | 'auto'
31+
>;
1932
export interface BoxProps
2033
extends Pick<
21-
AlignedBox,
34+
RequiredBoxProps,
35+
| 'accessibilityLabel'
2236
| 'accessibilityRole'
37+
| 'accessibilityVisibility'
2338
| 'background'
2439
| 'blockSize'
25-
| 'minBlockSize'
26-
| 'maxBlockSize'
27-
| 'inlineSize'
28-
| 'minInlineSize'
29-
| 'maxInlineSize'
3040
| 'border'
31-
| 'borderWidth'
32-
| 'borderRadius'
3341
| 'borderColor'
42+
| 'borderRadius'
3443
| 'borderStyle'
44+
| 'borderWidth'
3545
| 'display'
46+
| 'inlineSize'
47+
| 'maxBlockSize'
48+
| 'maxInlineSize'
49+
| 'minBlockSize'
50+
| 'minInlineSize'
3651
| 'overflow'
3752
> {
38-
accessibilityRole: AlignedBox['accessibilityRole'];
3953
background: Extract<
40-
AlignedBox['background'],
54+
RequiredBoxProps['background'],
4155
'transparent' | 'base' | 'subdued' | 'strong'
4256
>;
43-
blockSize: AlignedBox['blockSize'];
44-
minBlockSize: AlignedBox['minBlockSize'];
45-
maxBlockSize: AlignedBox['maxBlockSize'];
46-
inlineSize: AlignedBox['inlineSize'];
47-
minInlineSize: AlignedBox['minInlineSize'];
48-
maxInlineSize: AlignedBox['maxInlineSize'];
49-
padding: MakeResponsive<AlignedBox['padding']>;
50-
paddingBlock: MakeResponsive<AlignedBox['paddingBlock']>;
51-
paddingBlockStart: MakeResponsive<AlignedBox['paddingBlockStart']>;
52-
paddingBlockEnd: MakeResponsive<AlignedBox['paddingBlockEnd']>;
53-
paddingInline: MakeResponsive<AlignedBox['paddingInline']>;
54-
paddingInlineStart: MakeResponsive<AlignedBox['paddingInlineStart']>;
55-
paddingInlineEnd: MakeResponsive<AlignedBox['paddingInlineEnd']>;
56-
border: AlignedBox['border'] | 'none';
57+
padding: MakeResponsive<RequiredBoxProps['padding']>;
58+
paddingBlock: MakeResponsive<RequiredBoxProps['paddingBlock']>;
59+
paddingBlockStart: MakeResponsive<RequiredBoxProps['paddingBlockStart']>;
60+
paddingBlockEnd: MakeResponsive<RequiredBoxProps['paddingBlockEnd']>;
61+
paddingInline: MakeResponsive<RequiredBoxProps['paddingInline']>;
62+
paddingInlineStart: MakeResponsive<RequiredBoxProps['paddingInlineStart']>;
63+
paddingInlineEnd: MakeResponsive<RequiredBoxProps['paddingInlineEnd']>;
5764
borderWidth:
5865
| MaybeAllValuesShorthandProperty<
5966
Extract<
60-
AlignedBox['borderWidth'],
67+
RequiredBoxProps['borderWidth'],
6168
'small-100' | 'small' | 'base' | 'large' | 'large-100' | 'none'
6269
>
6370
>
64-
| Extract<AlignedBox['borderWidth'], ''>;
71+
| Extract<RequiredBoxProps['borderWidth'], ''>;
6572
borderStyle:
66-
| MaybeAllValuesShorthandProperty<
67-
Extract<AlignedBox['borderStyle'], 'none' | 'solid' | 'dashed'>
68-
>
69-
| Extract<AlignedBox['borderStyle'], ''>;
73+
| MaybeAllValuesShorthandProperty<BoxBorderStyles>
74+
| Extract<RequiredBoxProps['borderStyle'], ''>;
7075
borderColor: Extract<
71-
AlignedBox['borderColor'],
76+
RequiredBoxProps['borderColor'],
7277
'subdued' | 'base' | 'strong' | ''
7378
>;
74-
borderRadius: MaybeAllValuesShorthandProperty<
75-
Extract<
76-
AlignedBox['borderRadius'],
77-
| 'none'
78-
| 'small-200'
79-
| 'small-100'
80-
| 'small'
81-
| 'base'
82-
| 'large'
83-
| 'large-100'
84-
| 'large-200'
85-
>
86-
>;
87-
accessibilityLabel: AlignedBox['accessibilityLabel'];
88-
accessibilityVisibility: AlignedBox['accessibilityVisibility'];
89-
display: AlignedBox['display'];
90-
overflow: AlignedBox['overflow'];
79+
borderRadius: MaybeAllValuesShorthandProperty<BoxBorderRadii>;
9180
}
9281

9382
declare const tagName = 's-box';
@@ -190,7 +179,11 @@ declare global {
190179
declare module 'preact' {
191180
namespace createElement.JSX {
192181
interface IntrinsicElements {
193-
[tagName]: HTMLAttributes<HTMLElement> & ReactProps;
182+
[tagName]: Omit<
183+
HTMLAttributes<HTMLElement>,
184+
Extract<keyof HTMLAttributes<HTMLElement>, `on${Capitalize<string>}`>
185+
> &
186+
ReactProps;
194187
}
195188
}
196189
}

‎packages/ui-extensions/src/surfaces/admin/components/Button.d.ts‎

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,13 @@
1-
/** VERSION: 0.47.2 **/
1+
/** VERSION: 0.49.0 **/
22
/* eslint-disable import/extensions */
33

44
/* eslint-disable @typescript-eslint/no-namespace */
55
/* eslint-disable @typescript-eslint/member-ordering */
66

77
// eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
88
/// <reference lib="DOM" />
9-
// eslint-disable-next-line @typescript-eslint/triple-slash-reference, spaced-comment
10-
/// <reference lib="WebWorker" />
119
import type {
10+
IconProps$1,
1211
ButtonProps$1,
1312
IconType,
1413
InteractionProps,
@@ -17,6 +16,9 @@ import type {
1716

1817
export interface IconProps
1918
extends Pick<IconProps$1, 'type' | 'tone' | 'color' | 'size'> {
19+
/**
20+
* Specifies the type of icon that will be displayed.
21+
*/
2022
type: '' | IconType | 'empty';
2123
tone: Extract<
2224
IconProps$1['tone'],
@@ -55,7 +57,7 @@ export interface ButtonProps extends ButtonBaseProps {
5557
}
5658

5759
export type CallbackEvent<T extends keyof HTMLElementTagNameMap> = Event & {
58-
target: HTMLElementTagNameMap[T];
60+
currentTarget: HTMLElementTagNameMap[T];
5961
};
6062
export type CallbackEventListener<T extends keyof HTMLElementTagNameMap> =
6163
| (EventListener & {
@@ -166,7 +168,11 @@ declare global {
166168
declare module 'preact' {
167169
namespace createElement.JSX {
168170
interface IntrinsicElements {
169-
[tagName]: HTMLAttributes<HTMLElement> & ReactProps;
171+
[tagName]: Omit<
172+
HTMLAttributes<HTMLElement>,
173+
Extract<keyof HTMLAttributes<HTMLElement>, `on${Capitalize<string>}`>
174+
> &
175+
ReactProps;
170176
}
171177
}
172178
}

0 commit comments

Comments
 (0)