Skip to content

Commit

Permalink
Oh no, these new arg tables do not look good
Browse files Browse the repository at this point in the history 
It seems as though the type inference has gotten worse in this version. Instead of the type for Badge `size` being listed as `big` (only supports big), it is now reported as `literal`. For `string | React.ReactNode`, it only says `union`. Instead of `type` being `checkbox` and `radio`, it’s `union`. Instead of `ReactNode` for `React.ReactNode`, it prints out as `ReactReactNode`
  • Loading branch information
@pwolfert
pwolfert committed May 10, 2024
1 parent 19b9ff8 commit 6811f4b
Show file tree
Hide file tree
Showing 41 changed files with 249 additions and 554 deletions.
6 changes: 3 additions & 3 deletions packages/design-system/src/components/Badge/Badge.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import type * as React from 'react';
import type { ReactNode, ComponentPropsWithRef } from 'react';
import classNames from 'classnames';
import { t } from '../i18n';

Expand All @@ -14,7 +14,7 @@ interface BaseBadgeProps {
/**
* Label text or HTML.
*/
children: string | React.ReactNode;
children: ReactNode;
/**
* Sets the font size of the Badge. Only supports 'big'
*/
Expand All @@ -25,7 +25,7 @@ interface BaseBadgeProps {
variation?: BadgeVariation;
}

export type BadgeProps = BaseBadgeProps & React.ComponentPropsWithRef<'span'>;
export type BadgeProps = BaseBadgeProps & ComponentPropsWithRef<'span'>;

/**
* For information about how and when to use this component,
Expand Down
2 changes: 1 addition & 1 deletion ...snapshots/storybook-docs/Docs-Components-Accordion-Docs-prop-table-matches-snapshot-1.txt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
],
[
"children",
"Children should consist of AccordionItems\nReactNode",
"Children should consist of AccordionItems\nReactReactNode",
"-"
],
[
Expand Down
12 changes: 6 additions & 6 deletions ...pshots/storybook-docs/Docs-Components-Autocomplete-Docs-prop-table-matches-snapshot-1.txt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
[
"autoCompleteLabel",
"Control the TextField autocomplete attribute. Defaults to \"off\" to support accessibility. Read more.\nstring",
"\"off\""
"'off'"
],
[
"autoFocus",
Expand All @@ -25,7 +25,7 @@
],
[
"children*",
"Must contain a TextField component\nReactNode",
"Must contain a TextField component\nReactReactNode",
"-"
],
[
Expand All @@ -35,7 +35,7 @@
],
[
"clearInputText",
"Text rendered on the page if clearInput prop is passed. Default is \"Clear search\".\nReactNode",
"Text rendered on the page if clearInput prop is passed. Default is \"Clear search\".\nReactReactNode",
"-"
],
[
Expand Down Expand Up @@ -75,7 +75,7 @@
],
[
"label",
"Adds a heading to the top of the autocomplete list. This can be used to convey to the user that they're required to select an option from the autocomplete list.\nReactNode",
"Adds a heading to the top of the autocomplete list. This can be used to convey to the user that they're required to select an option from the autocomplete list.\nReactReactNode",
"-"
],
[
Expand All @@ -90,12 +90,12 @@
],
[
"loadingMessage",
"Message users will see when the loading prop is passed to Autocomplete.\nReactNode",
"Message users will see when the loading prop is passed to Autocomplete.\nReactReactNode",
"-"
],
[
"noResultsMessage",
"Message users will see when the items array returns empty and the loading prop is passed to <Autocomplete />.\nReactNode",
"Message users will see when the items array returns empty and the loading prop is passed to <Autocomplete />.\nReactReactNode",
"-"
],
[
Expand Down
19 changes: 7 additions & 12 deletions ...er/snapshots/storybook-docs/Docs-Components-Button-Docs-prop-table-matches-snapshot-1.txt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@
],
[
"children*",
"Label text or HTML\nReactNode",
"Label text or HTML\nunion",
"-"
],
[
Expand All @@ -49,7 +49,7 @@
],
[
"inputRef",
"Access a reference to the button or a element\nButtonRef",
"Access a reference to the button or a element\nunion",
"-"
],
[
Expand All @@ -59,7 +59,7 @@
],
[
"onAnalyticsEvent",
"Optional callback that will intercept analytics events for this component. If none is specified, the design system will use the default analytics function, which can be overwritten globally with the defaultAnalyticsFunction config property.\n\n(event: AnalyticsEvent) => void",
"Optional callback that will intercept analytics events for this component. If none is specified, the design system will use the default analytics function, which can be overwritten globally with the defaultAnalyticsFunction config property.\n\nsendLinkEvent",
"-"
],
[
Expand All @@ -72,24 +72,19 @@
"Defines a color palette best used when Button is placed on a dark background-color. By default, Button uses a light color palette.\n\nboolean",
"false"
],
[
"ref",
"Ref<HTMLButtonElement> & Ref<HTMLAnchorElement>",
"-"
],
[
"size",
"\"big\"\n\"small\"",
"union",
"-"
],
[
"type",
"Button type attribute\n\"button\"\n\"submit\"\n\"reset\"",
"\"'button' as const\""
"Button type attribute\nReactComponentProps['type']",
"'button'"
],
[
"variation",
"A string corresponding to Button variation classes.\n\"solid\"\n\"ghost\"",
"A string corresponding to Button variation classes.\nunion",
"-"
]
]
52 changes: 11 additions & 41 deletions ...er/snapshots/storybook-docs/Docs-Components-Choice-Docs-prop-table-matches-snapshot-1.txt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
],
[
"checkedChildren",
"Content to be shown when the choice is checked. See Checked children and the expose within pattern on the Guidance tab for detailed instructions.\n\nReactNode",
"Content to be shown when the choice is checked. See Checked children and the expose within pattern on the Guidance tab for detailed instructions.\n\nReactReactNode",
"-"
],
[
Expand All @@ -24,29 +24,14 @@
"Disables the entire field.\nboolean",
"-"
],
[
"errorId",
"The ID of the error message applied to this field. If none is provided, the id will be derived from the id prop for the field.\n\nstring",
"-"
],
[
"errorMessage",
"Enable the error state by providing an error message.\nReactNode",
"-"
],
[
"errorMessageClassName",
"Additional classes to be added to the error message\nstring",
"string",
"-"
],
[
"hint",
"Additional hint text to display\nReactNode",
"-"
],
[
"hintId",
"The ID of the hint element\nstring",
"string",
"-"
],
[
Expand All @@ -70,18 +55,8 @@
"-"
],
[
"label*",
"Label for the field.\nReactNode",
"-"
],
[
"labelClassName",
"Additional classes to be added to the label\nstring",
"-"
],
[
"labelId",
"A unique id to be used on the field label. If one isn't provided, a unique ID will be generated.\n\nstring",
"label",
"string",
"-"
],
[
Expand All @@ -96,37 +71,32 @@
],
[
"onChange",
"(event: ChangeEvent<HTMLInputElement>) => any",
"-"
],
[
"ref",
"Ref<HTMLInputElement>",
"(event: React.ChangeEvent<HTMLInputElement>) => any",
"-"
],
[
"requirementLabel",
"Text showing the requirement (\"Required\", \"Optional\", etc.). See Required and Optional Fields.\nReactNode",
"-",
"-"
],
[
"size",
"\"small\"",
"literal",
"-"
],
[
"type*",
"Sets the type to render checkbox fields or radio buttons\n\"checkbox\"\n\"radio\"",
"Sets the type to render checkbox fields or radio buttons\nunion",
"-"
],
[
"uncheckedChildren",
"Content to be shown when the choice is not checked\nReactNode",
"Content to be shown when the choice is not checked\nReactReactNode",
"-"
],
[
"value*",
"The input value attribute\nChoiceValue",
"The input value attribute\nunion",
"-"
]
]
52 changes: 6 additions & 46 deletions ...napshots/storybook-docs/Docs-Components-ChoiceList-Docs-prop-table-matches-snapshot-1.txt
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
[
[
"choices*",
"Array of objects representing the props for each Choice in the ChoiceList\nOmit<ChoiceProps, \"name\" | \"type\">[]",
"Array of objects representing the props for each Choice in the ChoiceList\nOmit<ChoiceProps, 'name' | 'type'>[]",
"-"
],
[
Expand All @@ -14,34 +14,14 @@
"Disables the entire field.\nboolean",
"-"
],
[
"errorId",
"The ID of the error message applied to this field. If none is provided, the id will be derived from the id prop for the field.\n\nstring",
"-"
],
[
"errorMessage",
"Enable the error state by providing an error message.\nReactNode",
"-"
],
[
"errorMessageClassName",
"Additional classes to be added to the error message\nstring",
"-"
],
[
"errorPlacement",
"Location of the error message relative to the field input\n\"top\"\n\"bottom\"",
"-",
"-"
],
[
"hint",
"Additional hint text to display\nReactNode",
"-"
],
[
"hintId",
"The ID of the hint element\nstring",
"-",
"-"
],
[
Expand All @@ -54,21 +34,6 @@
"Set to true to apply the \"inverse\" color scheme\nboolean",
"-"
],
[
"label*",
"Label for the field.\nReactNode",
"-"
],
[
"labelClassName",
"Additional classes to be added to the label\nstring",
"-"
],
[
"labelId",
"A unique id to be used on the field label. If one isn't provided, a unique ID will be generated.\n\nstring",
"-"
],
[
"name*",
"The field's name attribute\nstring",
Expand All @@ -89,24 +54,19 @@
"Called when any choice is blurred and the focus does not land on one of the other choices inside this component (i.e., when the whole component loses focus)\n\n(...args: any[]) => any",
"-"
],
[
"ref",
"Ref<HTMLFieldSetElement>",
"-"
],
[
"requirementLabel",
"Text showing the requirement (\"Required\", \"Optional\", etc.). See Required and Optional Fields.\nReactNode",
"-",
"-"
],
[
"size",
"Sets the size of the checkbox or radio button\n\"small\"",
"Sets the size of the checkbox or radio button\nliteral",
"-"
],
[
"type*",
"Sets the type to render checkbox fields or radio buttons\n\"checkbox\"\n\"radio\"",
"Sets the type to render checkbox fields or radio buttons\nunion",
"-"
]
]
18 changes: 9 additions & 9 deletions ...er/snapshots/storybook-docs/Docs-Components-Dialog-Docs-prop-table-matches-snapshot-1.txt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
],
[
"actions",
"Buttons or other HTML to be rendered in the \"actions\" bar at the bottom of the dialog.\n\nReactNode",
"Buttons or other HTML to be rendered in the \"actions\" bar at the bottom of the dialog.\n\nReactReactNode",
"-"
],
[
Expand Down Expand Up @@ -42,6 +42,11 @@
"Pass true to have the dialog close when its backdrop pseudo-element is clicked\nboolean",
"-"
],
[
"children",
"ReactReactNode",
"-"
],
[
"className",
"Additional classes to be added to the root dialog element.\nstring",
Expand All @@ -54,7 +59,7 @@
],
[
"heading",
"The Dialog's heading, to be rendered in the header alongside the close button.\nReactNode",
"The Dialog's heading, to be rendered in the header alongside the close button.\nReactReactNode",
"-"
],
[
Expand All @@ -69,17 +74,12 @@
],
[
"onAnalyticsEvent",
"Optional callback that will intercept analytics events for this component. If none is specified, the design system will use the default analytics function, which can be overwritten globally with the defaultAnalyticsFunction config property.\n\n(event: AnalyticsEvent) => void",
"-"
],
[
"onExit*",
"Called when the user triggers an exit event, like by clicking the close button or pressing the ESC key. The parent of this component is responsible for showing or not showing the dialog, so you need to use this callback to make that happen. The dialog does not hide or remove itself.\n\n(event: MouseEvent<Element, MouseEvent> | KeyboardEvent<Element>) => void",
"Optional callback that will intercept analytics events for this component. If none is specified, the design system will use the default analytics function, which can be overwritten globally with the defaultAnalyticsFunction config property.\n\nsendLinkEvent",
"-"
],
[
"size",
"The Dialog's size parameter.\n\"narrow\"\n\"wide\"\n\"full\"",
"The Dialog's size parameter.\nunion",
"-"
]
]
Loading

0 comments on commit 6811f4b

Please sign in to comment.