Skip to content

Commit 7be72f1

Browse files
snowystingersnowystinger
authored
chore: TS explicit modules stately and icons (#8392)
* chore: TS explicit modules stately and icons * fix lint
1 parent 18c3e3c commit 7be72f1

File tree

10 files changed

+42
-36
lines changed

10 files changed

+42
-36
lines changed

‎packages/@react-stately/form/src/useFormValidationState.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
* governing permissions and limitations under the License.
1111
*/
1212

13-
import {createContext, useContext, useEffect, useMemo, useRef, useState} from 'react';
13+
import {Context, createContext, useContext, useEffect, useMemo, useRef, useState} from 'react';
1414
import {Validation, ValidationErrors, ValidationFunction, ValidationResult} from '@react-types/shared';
1515

1616
export const VALID_VALIDITY_STATE: ValidityState = {
@@ -39,9 +39,9 @@ export const DEFAULT_VALIDATION_RESULT: ValidationResult = {
3939
validationErrors: []
4040
};
4141

42-
export const FormValidationContext = createContext<ValidationErrors>({});
42+
export const FormValidationContext: Context<ValidationErrors> = createContext<ValidationErrors>({});
4343

44-
export const privateValidationStateProp = '__formValidationState' + Date.now();
44+
export const privateValidationStateProp: string = '__formValidationState' + Date.now();
4545

4646
interface FormValidationProps<T> extends Validation<T> {
4747
builtinValidation?: ValidationResult,

‎packages/@react-stately/layout/src/ListLayout.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -251,7 +251,7 @@ export class ListLayout<T, O extends ListLayoutOptions = ListLayoutOptions> exte
251251
this.validRect = this.requestedRect.copy();
252252
}
253253

254-
protected buildCollection(y = this.padding): LayoutNode[] {
254+
protected buildCollection(y: number = this.padding): LayoutNode[] {
255255
let collection = this.virtualizer!.collection;
256256
let skipped = 0;
257257
let nodes: LayoutNode[] = [];

‎packages/@react-stately/table/src/TableUtils.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -104,7 +104,7 @@ interface FlexItem {
104104
* @param getDefaultWidth - A function that returns the default width of a column by its index.
105105
* @param getDefaultMinWidth - A function that returns the default min width of a column by its index.
106106
*/
107-
export function calculateColumnSizes(availableWidth: number, columns: IColumn[], changedColumns: Map<Key, ColumnSize>, getDefaultWidth?: (number) => ColumnSize | null | undefined, getDefaultMinWidth?: (number) => ColumnSize | null | undefined): number[] {
107+
export function calculateColumnSizes(availableWidth: number, columns: IColumn[], changedColumns: Map<Key, ColumnSize>, getDefaultWidth?: (index: number) => ColumnSize | null | undefined, getDefaultMinWidth?: (index: number) => ColumnSize | null | undefined): number[] {
108108
let hasNonFrozenItems = false;
109109
let flexItems: FlexItem[] = columns.map((column, index) => {
110110
let width: ColumnSize = (changedColumns.get(column.key) != null ? changedColumns.get(column.key) ?? '1fr' : column.width ?? column.defaultWidth ?? getDefaultWidth?.(index) ?? '1fr') as ColumnSize;

‎packages/@react-stately/toast/src/useToastState.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -184,12 +184,12 @@ class Timer {
184184
this.callback = callback;
185185
}
186186

187-
reset(delay: number) {
187+
reset(delay: number): void {
188188
this.remaining = delay;
189189
this.resume();
190190
}
191191

192-
pause() {
192+
pause(): void {
193193
if (this.timerId == null) {
194194
return;
195195
}
@@ -199,7 +199,7 @@ class Timer {
199199
this.remaining -= Date.now() - this.startTime!;
200200
}
201201

202-
resume() {
202+
resume(): void {
203203
if (this.remaining <= 0) {
204204
return;
205205
}

‎packages/@react-stately/tree/stories/useTreeState.stories.tsx

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -12,20 +12,21 @@
1212

1313
import {Collection, Key, Node} from '@react-types/shared';
1414
import {Item} from '@react-stately/collections';
15-
import React, {useMemo, useRef} from 'react';
15+
import {Meta, StoryFn} from '@storybook/react';
16+
import React, {JSX, useMemo, useRef} from 'react';
1617
import {TreeCollection} from '../src/TreeCollection';
1718
import {usePress} from '@react-aria/interactions';
1819
import {useSelectableCollection, useSelectableItem} from '@react-aria/selection';
1920
import {useTreeState} from '../';
2021

2122
export default {
2223
title: 'useTreeState'
23-
};
24+
} as Meta<typeof TreeExample>;
2425

25-
export const KeyboardNavigation = () => <TreeExample />;
26+
export const KeyboardNavigation: StoryFn<typeof TreeExample> = () => <TreeExample />;
2627

2728

28-
function TreeExample(props = {}) {
29+
function TreeExample(props = {}): JSX.Element {
2930
return (
3031
<Tree {...props}>
3132
<Item key="1" title="Animals">

‎packages/@spectrum-icons/color/stories/IconsColor.stories.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,12 +12,13 @@
1212

1313
import CalendarCheckColor from '../CalendarCheckColor';
1414
import React from 'react';
15+
import { Meta, StoryFn } from '@storybook/react';
1516

1617
export default {
1718
title: 'Icons/Color'
18-
};
19+
} as Meta<typeof CalendarCheckColor>;
1920

20-
export const ColorIconWithSizes = () => renderIconSizes(CalendarCheckColor, {'aria-label': 'Adobe Analytics Color'});
21+
export const ColorIconWithSizes: StoryFn<typeof CalendarCheckColor> = () => renderIconSizes(CalendarCheckColor, {'aria-label': 'Adobe Analytics Color'});
2122

2223
ColorIconWithSizes.story = {
2324
name: 'Color icon with sizes'

‎packages/@spectrum-icons/express/chromatic/IconsExpress.chromatic.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,21 +14,22 @@ import Add from '../Add';
1414
import Alert from '@spectrum-icons/express/Alert';
1515
import React from 'react';
1616
import {Flex} from '@react-spectrum/layout';
17+
import { Meta, StoryFn } from '@storybook/react';
1718

1819
export default {
1920
title: 'Icons/Express',
2021
parameters: {
2122
chromaticProvider: {express: true},
2223
}
23-
};
24+
} as Meta<typeof Add>;
2425

25-
export const IconAddWithSizes = () => renderIconSizes(Add, { 'aria-label': 'Add' });
26+
export const IconAddWithSizes: StoryFn<typeof Add> = () => renderIconSizes(Add, { 'aria-label': 'Add' });
2627

2728
IconAddWithSizes.story = {
2829
name: 'icon: Add with sizes',
2930
};
3031

31-
export const Colors = () => (
32+
export const Colors: StoryFn<typeof Alert> = () => (
3233
<Flex gap="size-200">
3334
<Alert aria-label="info default" />
3435
<Alert color="informative" aria-label="info alert" />

‎packages/@spectrum-icons/express/stories/IconsExpress.stories.tsx

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -10,46 +10,47 @@
1010
* governing permissions and limitations under the License.
1111
*/
1212

13+
import { Meta, StoryFn } from '@storybook/react';
1314
import Add from '../Add';
1415
import Alert from '../Alert';
1516
import Bell from '../Bell';
1617
import React from 'react';
1718

1819
export default {
1920
title: 'Icons/Express'
20-
};
21+
} as Meta<typeof Add>;
2122

22-
export const IconAddWithSizes = () => renderIconSizes(Add, {'aria-label': 'Add'});
23+
export const IconAddWithSizes: StoryFn<typeof Add> = () => renderIconSizes(Add, {'aria-label': 'Add'});
2324

2425
IconAddWithSizes.story = {
2526
name: 'icon: Add with sizes'
2627
};
2728

28-
export const IconBellWithSizes = () => renderIconSizes(Bell, {'aria-label': 'Bell'});
29+
export const IconBellWithSizes: StoryFn<typeof Bell> = () => renderIconSizes(Bell, {'aria-label': 'Bell'});
2930

3031
IconBellWithSizes.story = {
3132
name: 'icon: Bell with sizes'
3233
};
3334

34-
export const IconAlertNegative = () => renderIconSizes(Alert, {'aria-label': 'Alert', color: 'negative'});
35+
export const IconAlertNegative: StoryFn<typeof Alert> = () => renderIconSizes(Alert, {'aria-label': 'Alert', color: 'negative'});
3536

3637
IconAlertNegative.story = {
3738
name: 'icon: Alert negative'
3839
};
3940

40-
export const IconAlertInformative = () => renderIconSizes(Alert, {'aria-label': 'Alert', color: 'informative'});
41+
export const IconAlertInformative: StoryFn<typeof Alert> = () => renderIconSizes(Alert, {'aria-label': 'Alert', color: 'informative'});
4142

4243
IconAlertInformative.story = {
4344
name: 'icon: Alert informative'
4445
};
4546

46-
export const IconAlertPositive = () => renderIconSizes(Alert, {'aria-label': 'Alert', color: 'positive'});
47+
export const IconAlertPositive: StoryFn<typeof Alert> = () => renderIconSizes(Alert, {'aria-label': 'Alert', color: 'positive'});
4748

4849
IconAlertPositive.story = {
4950
name: 'icon: Alert positive'
5051
};
5152

52-
export const IconAlertNotice = () => renderIconSizes(Alert, {'aria-label': 'Alert', color: 'notice'});
53+
export const IconAlertNotice: StoryFn<typeof Alert> = () => renderIconSizes(Alert, {'aria-label': 'Alert', color: 'notice'});
5354

5455
IconAlertNotice.story = {
5556
name: 'icon: Alert notice'

‎packages/@spectrum-icons/workflow/chromatic/Workflow.chromatic.tsx

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ import Alert from '@spectrum-icons/workflow/Alert';
1515
import React from 'react';
1616
import {Flex} from '@react-spectrum/layout';
1717
import * as AllIcons from '../src';
18+
import { Meta, StoryFn } from '@storybook/react';
1819

1920
let allIcons = Object.keys(AllIcons);
2021
let alphabet = [...Array(26)].map((val, i) => String.fromCharCode(i + 65));
@@ -29,15 +30,15 @@ export default {
2930
parameters: {
3031
chromaticProvider: {express: false},
3132
}
32-
};
33+
} as Meta<typeof Add>;
3334

34-
export const IconAddWithSizes = () => renderIconSizes(Add, { 'aria-label': 'Add' });
35+
export const IconAddWithSizes: StoryFn<typeof Add> = () => renderIconSizes(Add, { 'aria-label': 'Add' });
3536

3637
IconAddWithSizes.story = {
3738
name: 'icon: Add with sizes',
3839
};
3940

40-
export const Colors = () => (
41+
export const Colors: StoryFn<typeof Alert> = () => (
4142
<Flex gap="size-200">
4243
<Alert aria-label="info default" />
4344
<Alert color="informative" aria-label="info alert" />
@@ -47,7 +48,7 @@ export const Colors = () => (
4748
</Flex>
4849
);
4950

50-
export const AllWorkflow = () => (
51+
export const AllWorkflow: StoryFn<typeof Add> = () => (
5152
<Flex direction="column">
5253
{Object.keys(alphabetizedIcons).map((char) => (
5354
<div style={{ height: 'calc(12 * var(--spectrum-global-dimension-size-300))' }}>

‎packages/@spectrum-icons/workflow/stories/IconsWorkflow.stories.tsx

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -15,48 +15,49 @@ import Add from '../Add';
1515
import Alert from '../Alert';
1616
import Bell from '../Bell';
1717
import React from 'react';
18+
import { Meta, StoryFn } from '@storybook/react';
1819

1920
export default {
2021
title: 'Icons/Workflow'
21-
};
22+
} as Meta<typeof Add>;
2223

23-
export const IconAddWithSizes = () => renderIconSizes(Add, {'aria-label': 'Add'});
24+
export const IconAddWithSizes: StoryFn<typeof Add> = () => renderIconSizes(Add, {'aria-label': 'Add'});
2425

2526
IconAddWithSizes.story = {
2627
name: 'icon: Add with sizes'
2728
};
2829

29-
export const IconBellWithSizes = () => renderIconSizes(Bell, {'aria-label': 'Bell'});
30+
export const IconBellWithSizes: StoryFn<typeof Bell> = () => renderIconSizes(Bell, {'aria-label': 'Bell'});
3031

3132
IconBellWithSizes.story = {
3233
name: 'icon: Bell with sizes',
3334
};
3435

35-
export const Icon3DMaterialsWithSizes = () => renderIconSizes(Icon3DMaterials, {'aria-label': '3D Materials'});
36+
export const Icon3DMaterialsWithSizes: StoryFn<typeof Icon3DMaterials> = () => renderIconSizes(Icon3DMaterials, {'aria-label': '3D Materials'});
3637

3738
Icon3DMaterialsWithSizes.story = {
3839
name: 'icon: _3DMaterials with sizes',
3940
};
4041

41-
export const IconAlertNegative = () => renderIconSizes(Alert, {'aria-label': 'Alert', color: 'negative'});
42+
export const IconAlertNegative: StoryFn<typeof Alert> = () => renderIconSizes(Alert, {'aria-label': 'Alert', color: 'negative'});
4243

4344
IconAlertNegative.story = {
4445
name: 'icon: Alert negative',
4546
};
4647

47-
export const IconAlertInformative = () => renderIconSizes(Alert, {'aria-label': 'Alert', color: 'informative'});
48+
export const IconAlertInformative: StoryFn<typeof Alert> = () => renderIconSizes(Alert, {'aria-label': 'Alert', color: 'informative'});
4849

4950
IconAlertInformative.story = {
5051
name: 'icon: Alert informative',
5152
};
5253

53-
export const IconAlertPositive = () => renderIconSizes(Alert, {'aria-label': 'Alert', color: 'positive'});
54+
export const IconAlertPositive: StoryFn<typeof Alert> = () => renderIconSizes(Alert, {'aria-label': 'Alert', color: 'positive'});
5455

5556
IconAlertPositive.story = {
5657
name: 'icon: Alert positive',
5758
};
5859

59-
export const IconAlertNotice = () => renderIconSizes(Alert, {'aria-label': 'Alert', color: 'notice'});
60+
export const IconAlertNotice: StoryFn<typeof Alert> = () => renderIconSizes(Alert, {'aria-label': 'Alert', color: 'notice'});
6061

6162
IconAlertNotice.story = {
6263
name: 'icon: Alert notice',

0 commit comments

Comments
 (0)