@primer/components 31.0.2-rc.95622264 → 31.2.0-rc.c285489d

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (81) hide show
  1. package/.storybook/main.js +7 -9
  2. package/.storybook/preview.js +5 -1
  3. package/CHANGELOG.md +11 -1
  4. package/dist/browser.esm.js.map +1 -1
  5. package/dist/browser.umd.js.map +1 -1
  6. package/lib/Autocomplete/Autocomplete.d.ts +4 -4
  7. package/lib/Autocomplete/AutocompleteInput.d.ts +4 -4
  8. package/lib/Button/Button.d.ts +5 -5
  9. package/lib/Button/ButtonBase.d.ts +1 -1
  10. package/lib/Button/ButtonClose.d.ts +3 -3
  11. package/lib/Button/ButtonDanger.d.ts +5 -5
  12. package/lib/Button/ButtonInvisible.d.ts +5 -5
  13. package/lib/Button/ButtonOutline.d.ts +5 -5
  14. package/lib/Button/ButtonPrimary.d.ts +5 -5
  15. package/lib/CircleBadge.d.ts +2 -2
  16. package/lib/CircleOcticon.d.ts +4 -4
  17. package/lib/Dialog.d.ts +4 -4
  18. package/lib/Dropdown.d.ts +16 -16
  19. package/lib/DropdownMenu/DropdownButton.d.ts +6 -6
  20. package/lib/FilterList.d.ts +3 -3
  21. package/lib/Flash.d.ts +1 -1
  22. package/lib/Label.d.ts +1 -1
  23. package/lib/Position.d.ts +4 -4
  24. package/lib/ProgressBar.d.ts +1 -1
  25. package/lib/SelectMenu/SelectMenu.d.ts +24 -24
  26. package/lib/SelectMenu/SelectMenuItem.d.ts +1 -1
  27. package/lib/TextInputWithTokens.d.ts +4 -4
  28. package/lib/Timeline.d.ts +4 -4
  29. package/lib/Token/AvatarToken.d.ts +1 -1
  30. package/lib/Token/IssueLabelToken.d.ts +1 -1
  31. package/lib/Token/Token.d.ts +1 -1
  32. package/lib/_TextInputWrapper.d.ts +1 -1
  33. package/lib/__tests__/KeyPaths.types.test.d.ts +10 -0
  34. package/lib/__tests__/KeyPaths.types.test.js +10 -0
  35. package/lib/sx.d.ts +8 -2
  36. package/lib/theme.d.ts +78 -0
  37. package/lib/theme.js +3 -1
  38. package/lib/utils/types/KeyPaths.d.ts +3 -0
  39. package/lib/utils/types/KeyPaths.js +1 -0
  40. package/lib-esm/Autocomplete/Autocomplete.d.ts +4 -4
  41. package/lib-esm/Autocomplete/AutocompleteInput.d.ts +4 -4
  42. package/lib-esm/Button/Button.d.ts +5 -5
  43. package/lib-esm/Button/ButtonBase.d.ts +1 -1
  44. package/lib-esm/Button/ButtonClose.d.ts +3 -3
  45. package/lib-esm/Button/ButtonDanger.d.ts +5 -5
  46. package/lib-esm/Button/ButtonInvisible.d.ts +5 -5
  47. package/lib-esm/Button/ButtonOutline.d.ts +5 -5
  48. package/lib-esm/Button/ButtonPrimary.d.ts +5 -5
  49. package/lib-esm/CircleBadge.d.ts +2 -2
  50. package/lib-esm/CircleOcticon.d.ts +4 -4
  51. package/lib-esm/Dialog.d.ts +4 -4
  52. package/lib-esm/Dropdown.d.ts +16 -16
  53. package/lib-esm/DropdownMenu/DropdownButton.d.ts +6 -6
  54. package/lib-esm/FilterList.d.ts +3 -3
  55. package/lib-esm/Flash.d.ts +1 -1
  56. package/lib-esm/Label.d.ts +1 -1
  57. package/lib-esm/Position.d.ts +4 -4
  58. package/lib-esm/ProgressBar.d.ts +1 -1
  59. package/lib-esm/SelectMenu/SelectMenu.d.ts +24 -24
  60. package/lib-esm/SelectMenu/SelectMenuItem.d.ts +1 -1
  61. package/lib-esm/TextInputWithTokens.d.ts +4 -4
  62. package/lib-esm/Timeline.d.ts +4 -4
  63. package/lib-esm/Token/AvatarToken.d.ts +1 -1
  64. package/lib-esm/Token/IssueLabelToken.d.ts +1 -1
  65. package/lib-esm/Token/Token.d.ts +1 -1
  66. package/lib-esm/_TextInputWrapper.d.ts +1 -1
  67. package/lib-esm/__tests__/KeyPaths.types.test.d.ts +10 -0
  68. package/lib-esm/__tests__/KeyPaths.types.test.js +3 -0
  69. package/lib-esm/sx.d.ts +8 -2
  70. package/lib-esm/theme.d.ts +78 -0
  71. package/lib-esm/theme.js +2 -1
  72. package/lib-esm/utils/types/KeyPaths.d.ts +3 -0
  73. package/lib-esm/utils/types/KeyPaths.js +1 -0
  74. package/package-lock.json +37942 -41
  75. package/package.json +2 -1
  76. package/src/__tests__/KeyPaths.types.test.ts +13 -0
  77. package/src/sx.ts +14 -2
  78. package/src/theme.ts +86 -0
  79. package/src/utils/types/KeyPaths.ts +4 -0
  80. package/stats.html +1 -1
  81. package/.changeset/tiny-ghosts-repeat.md +0 -5
package/lib/Autocomplete/Autocomplete.d.ts CHANGED
@@ -74,7 +74,7 @@ declare const _default: React.FC<{
74
74
  results?: number | undefined;
75
75
  security?: string | undefined;
76
76
  unselectable?: "on" | "off" | undefined;
77
- inputMode?: "none" | "text" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
77
+ inputMode?: "search" | "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
78
78
  is?: string | undefined;
79
79
  'aria-activedescendant'?: string | undefined;
80
80
  'aria-atomic'?: boolean | "true" | "false" | undefined;
@@ -89,7 +89,7 @@ declare const _default: React.FC<{
89
89
  'aria-describedby'?: string | undefined;
90
90
  'aria-details'?: string | undefined;
91
91
  'aria-disabled'?: boolean | "true" | "false" | undefined;
92
- 'aria-dropeffect'?: "none" | "link" | "copy" | "execute" | "move" | "popup" | undefined;
92
+ 'aria-dropeffect'?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
93
93
  'aria-errormessage'?: string | undefined;
94
94
  'aria-expanded'?: boolean | "true" | "false" | undefined;
95
95
  'aria-flowto'?: string | undefined;
@@ -288,9 +288,9 @@ declare const _default: React.FC<{
288
288
  onTransitionEnd?: React.TransitionEventHandler<HTMLSpanElement> | undefined;
289
289
  onTransitionEndCapture?: React.TransitionEventHandler<HTMLSpanElement> | undefined;
290
290
  block?: boolean | undefined;
291
- sx?: import("@styled-system/css").SystemStyleObject | undefined;
291
+ sx?: import("../sx").BetterSystemStyleObject | undefined;
292
292
  disabled?: boolean | undefined;
293
- variant?: "large" | "small" | undefined;
293
+ variant?: "small" | "large" | undefined;
294
294
  hasIcon?: boolean | undefined;
295
295
  contrast?: boolean | undefined;
296
296
  } & {
package/lib/Autocomplete/AutocompleteInput.d.ts CHANGED
@@ -66,7 +66,7 @@ declare const AutocompleteInput: PolymorphicForwardRefComponent<React.ForwardRef
66
66
  results?: number | undefined;
67
67
  security?: string | undefined;
68
68
  unselectable?: "on" | "off" | undefined;
69
- inputMode?: "none" | "text" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
69
+ inputMode?: "search" | "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
70
70
  is?: string | undefined;
71
71
  'aria-activedescendant'?: string | undefined;
72
72
  'aria-atomic'?: boolean | "true" | "false" | undefined;
@@ -81,7 +81,7 @@ declare const AutocompleteInput: PolymorphicForwardRefComponent<React.ForwardRef
81
81
  'aria-describedby'?: string | undefined;
82
82
  'aria-details'?: string | undefined;
83
83
  'aria-disabled'?: boolean | "true" | "false" | undefined;
84
- 'aria-dropeffect'?: "none" | "link" | "copy" | "execute" | "move" | "popup" | undefined;
84
+ 'aria-dropeffect'?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
85
85
  'aria-errormessage'?: string | undefined;
86
86
  'aria-expanded'?: boolean | "true" | "false" | undefined;
87
87
  'aria-flowto'?: string | undefined;
@@ -280,9 +280,9 @@ declare const AutocompleteInput: PolymorphicForwardRefComponent<React.ForwardRef
280
280
  onTransitionEnd?: React.TransitionEventHandler<HTMLSpanElement> | undefined;
281
281
  onTransitionEndCapture?: React.TransitionEventHandler<HTMLSpanElement> | undefined;
282
282
  block?: boolean | undefined;
283
- sx?: import("@styled-system/css").SystemStyleObject | undefined;
283
+ sx?: import("../sx").BetterSystemStyleObject | undefined;
284
284
  disabled?: boolean | undefined;
285
- variant?: "large" | "small" | undefined;
285
+ variant?: "small" | "large" | undefined;
286
286
  hasIcon?: boolean | undefined;
287
287
  contrast?: boolean | undefined;
288
288
  } & {
package/lib/Button/Button.d.ts CHANGED
@@ -3,7 +3,7 @@ import { SxProp } from '../sx';
3
3
  import { ComponentProps } from '../utils/types';
4
4
  declare const Button: import("styled-components").StyledComponent<"button", any, {
5
5
  as?: string | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
6
- variant?: "large" | "medium" | "small" | undefined;
6
+ variant?: "small" | "medium" | "large" | undefined;
7
7
  } & import("styled-system").FontSizeProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & {
8
8
  color?: string | undefined;
9
9
  fontSize?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
@@ -55,7 +55,7 @@ declare const Button: import("styled-components").StyledComponent<"button", any,
55
55
  results?: number | undefined;
56
56
  security?: string | undefined;
57
57
  unselectable?: "on" | "off" | undefined;
58
- inputMode?: "none" | "text" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
58
+ inputMode?: "search" | "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
59
59
  is?: string | undefined;
60
60
  'aria-activedescendant'?: string | undefined;
61
61
  'aria-atomic'?: boolean | "true" | "false" | undefined;
@@ -70,7 +70,7 @@ declare const Button: import("styled-components").StyledComponent<"button", any,
70
70
  'aria-describedby'?: string | undefined;
71
71
  'aria-details'?: string | undefined;
72
72
  'aria-disabled'?: boolean | "true" | "false" | undefined;
73
- 'aria-dropeffect'?: "none" | "link" | "copy" | "execute" | "move" | "popup" | undefined;
73
+ 'aria-dropeffect'?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
74
74
  'aria-errormessage'?: string | undefined;
75
75
  'aria-expanded'?: boolean | "true" | "false" | undefined;
76
76
  'aria-flowto'?: string | undefined;
@@ -268,6 +268,7 @@ declare const Button: import("styled-components").StyledComponent<"button", any,
268
268
  onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
269
269
  onTransitionEnd?: import("react").TransitionEventHandler<HTMLButtonElement> | undefined;
270
270
  onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLButtonElement> | undefined;
271
+ as?: string | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
271
272
  autoFocus?: boolean | undefined;
272
273
  disabled?: boolean | undefined;
273
274
  formAction?: string | undefined;
@@ -275,8 +276,7 @@ declare const Button: import("styled-components").StyledComponent<"button", any,
275
276
  formMethod?: string | undefined;
276
277
  formNoValidate?: boolean | undefined;
277
278
  formTarget?: string | undefined;
278
- as?: string | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
279
- variant?: "large" | "medium" | "small" | undefined;
279
+ variant?: "small" | "medium" | "large" | undefined;
280
280
  } & {
281
281
  theme?: any;
282
282
  } & import("styled-system").FontSizeProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & import("../constants").SystemCommonProps & import("../constants").SystemLayoutProps & SxProp, never>;
package/lib/Button/ButtonBase.d.ts CHANGED
@@ -6,7 +6,7 @@ export declare const buttonSystemProps: import("styled-system").styleFn;
6
6
  export declare type ButtonSystemProps = FontSizeProps & SystemCommonProps & SystemLayoutProps;
7
7
  declare const ButtonBase: import("styled-components").StyledComponent<"button", any, {
8
8
  as?: string | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
9
- variant?: "large" | "medium" | "small" | undefined;
9
+ variant?: "small" | "medium" | "large" | undefined;
10
10
  } & FontSizeProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol>, never>;
11
11
  export declare type ButtonBaseProps = ComponentProps<typeof ButtonBase>;
12
12
  export default ButtonBase;
package/lib/Button/ButtonClose.d.ts CHANGED
@@ -74,7 +74,7 @@ declare const ButtonClose: React.ForwardRefExoticComponent<Pick<{
74
74
  results?: number | undefined;
75
75
  security?: string | undefined;
76
76
  unselectable?: "on" | "off" | undefined;
77
- inputMode?: "none" | "text" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
77
+ inputMode?: "search" | "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
78
78
  is?: string | undefined;
79
79
  'aria-activedescendant'?: string | undefined;
80
80
  'aria-atomic'?: boolean | "true" | "false" | undefined;
@@ -89,7 +89,7 @@ declare const ButtonClose: React.ForwardRefExoticComponent<Pick<{
89
89
  'aria-describedby'?: string | undefined;
90
90
  'aria-details'?: string | undefined;
91
91
  'aria-disabled'?: boolean | "true" | "false" | undefined;
92
- 'aria-dropeffect'?: "none" | "link" | "copy" | "execute" | "move" | "popup" | undefined;
92
+ 'aria-dropeffect'?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
93
93
  'aria-errormessage'?: string | undefined;
94
94
  'aria-expanded'?: boolean | "true" | "false" | undefined;
95
95
  'aria-flowto'?: string | undefined;
@@ -306,7 +306,7 @@ declare const ButtonClose: React.ForwardRefExoticComponent<Pick<{
306
306
  py?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
307
307
  paddingY?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
308
308
  size?: import("styled-system").ResponsiveValue<import("csstype").Property.Height<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
309
- sx?: import("@styled-system/css").SystemStyleObject | undefined;
309
+ sx?: import("../sx").BetterSystemStyleObject | undefined;
310
310
  autoFocus?: boolean | undefined;
311
311
  disabled?: boolean | undefined;
312
312
  formAction?: string | undefined;
package/lib/Button/ButtonDanger.d.ts CHANGED
@@ -3,7 +3,7 @@ import { SxProp } from '../sx';
3
3
  import { ComponentProps } from '../utils/types';
4
4
  declare const ButtonDanger: import("styled-components").StyledComponent<"button", any, {
5
5
  as?: string | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
6
- variant?: "large" | "medium" | "small" | undefined;
6
+ variant?: "small" | "medium" | "large" | undefined;
7
7
  } & import("styled-system").FontSizeProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & {
8
8
  color?: string | undefined;
9
9
  fontSize?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
@@ -55,7 +55,7 @@ declare const ButtonDanger: import("styled-components").StyledComponent<"button"
55
55
  results?: number | undefined;
56
56
  security?: string | undefined;
57
57
  unselectable?: "on" | "off" | undefined;
58
- inputMode?: "none" | "text" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
58
+ inputMode?: "search" | "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
59
59
  is?: string | undefined;
60
60
  'aria-activedescendant'?: string | undefined;
61
61
  'aria-atomic'?: boolean | "true" | "false" | undefined;
@@ -70,7 +70,7 @@ declare const ButtonDanger: import("styled-components").StyledComponent<"button"
70
70
  'aria-describedby'?: string | undefined;
71
71
  'aria-details'?: string | undefined;
72
72
  'aria-disabled'?: boolean | "true" | "false" | undefined;
73
- 'aria-dropeffect'?: "none" | "link" | "copy" | "execute" | "move" | "popup" | undefined;
73
+ 'aria-dropeffect'?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
74
74
  'aria-errormessage'?: string | undefined;
75
75
  'aria-expanded'?: boolean | "true" | "false" | undefined;
76
76
  'aria-flowto'?: string | undefined;
@@ -268,6 +268,7 @@ declare const ButtonDanger: import("styled-components").StyledComponent<"button"
268
268
  onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
269
269
  onTransitionEnd?: import("react").TransitionEventHandler<HTMLButtonElement> | undefined;
270
270
  onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLButtonElement> | undefined;
271
+ as?: string | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
271
272
  autoFocus?: boolean | undefined;
272
273
  disabled?: boolean | undefined;
273
274
  formAction?: string | undefined;
@@ -275,8 +276,7 @@ declare const ButtonDanger: import("styled-components").StyledComponent<"button"
275
276
  formMethod?: string | undefined;
276
277
  formNoValidate?: boolean | undefined;
277
278
  formTarget?: string | undefined;
278
- as?: string | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
279
- variant?: "large" | "medium" | "small" | undefined;
279
+ variant?: "small" | "medium" | "large" | undefined;
280
280
  } & {
281
281
  theme?: any;
282
282
  } & import("styled-system").FontSizeProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & import("../constants").SystemCommonProps & import("../constants").SystemLayoutProps & SxProp, never>;
package/lib/Button/ButtonInvisible.d.ts CHANGED
@@ -3,7 +3,7 @@ import { SxProp } from '../sx';
3
3
  import { ComponentProps } from '../utils/types';
4
4
  declare const ButtonInvisible: import("styled-components").StyledComponent<"button", any, {
5
5
  as?: string | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
6
- variant?: "large" | "medium" | "small" | undefined;
6
+ variant?: "small" | "medium" | "large" | undefined;
7
7
  } & import("styled-system").FontSizeProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & {
8
8
  color?: string | undefined;
9
9
  fontSize?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
@@ -55,7 +55,7 @@ declare const ButtonInvisible: import("styled-components").StyledComponent<"butt
55
55
  results?: number | undefined;
56
56
  security?: string | undefined;
57
57
  unselectable?: "on" | "off" | undefined;
58
- inputMode?: "none" | "text" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
58
+ inputMode?: "search" | "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
59
59
  is?: string | undefined;
60
60
  'aria-activedescendant'?: string | undefined;
61
61
  'aria-atomic'?: boolean | "true" | "false" | undefined;
@@ -70,7 +70,7 @@ declare const ButtonInvisible: import("styled-components").StyledComponent<"butt
70
70
  'aria-describedby'?: string | undefined;
71
71
  'aria-details'?: string | undefined;
72
72
  'aria-disabled'?: boolean | "true" | "false" | undefined;
73
- 'aria-dropeffect'?: "none" | "link" | "copy" | "execute" | "move" | "popup" | undefined;
73
+ 'aria-dropeffect'?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
74
74
  'aria-errormessage'?: string | undefined;
75
75
  'aria-expanded'?: boolean | "true" | "false" | undefined;
76
76
  'aria-flowto'?: string | undefined;
@@ -268,6 +268,7 @@ declare const ButtonInvisible: import("styled-components").StyledComponent<"butt
268
268
  onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
269
269
  onTransitionEnd?: import("react").TransitionEventHandler<HTMLButtonElement> | undefined;
270
270
  onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLButtonElement> | undefined;
271
+ as?: string | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
271
272
  autoFocus?: boolean | undefined;
272
273
  disabled?: boolean | undefined;
273
274
  formAction?: string | undefined;
@@ -275,8 +276,7 @@ declare const ButtonInvisible: import("styled-components").StyledComponent<"butt
275
276
  formMethod?: string | undefined;
276
277
  formNoValidate?: boolean | undefined;
277
278
  formTarget?: string | undefined;
278
- as?: string | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
279
- variant?: "large" | "medium" | "small" | undefined;
279
+ variant?: "small" | "medium" | "large" | undefined;
280
280
  } & {
281
281
  theme?: any;
282
282
  } & import("styled-system").FontSizeProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & import("../constants").SystemCommonProps & import("../constants").SystemLayoutProps & SxProp, never>;
package/lib/Button/ButtonOutline.d.ts CHANGED
@@ -3,7 +3,7 @@ import { SxProp } from '../sx';
3
3
  import { ComponentProps } from '../utils/types';
4
4
  declare const ButtonOutline: import("styled-components").StyledComponent<"button", any, {
5
5
  as?: string | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
6
- variant?: "large" | "medium" | "small" | undefined;
6
+ variant?: "small" | "medium" | "large" | undefined;
7
7
  } & import("styled-system").FontSizeProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & {
8
8
  color?: string | undefined;
9
9
  fontSize?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
@@ -55,7 +55,7 @@ declare const ButtonOutline: import("styled-components").StyledComponent<"button
55
55
  results?: number | undefined;
56
56
  security?: string | undefined;
57
57
  unselectable?: "on" | "off" | undefined;
58
- inputMode?: "none" | "text" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
58
+ inputMode?: "search" | "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
59
59
  is?: string | undefined;
60
60
  'aria-activedescendant'?: string | undefined;
61
61
  'aria-atomic'?: boolean | "true" | "false" | undefined;
@@ -70,7 +70,7 @@ declare const ButtonOutline: import("styled-components").StyledComponent<"button
70
70
  'aria-describedby'?: string | undefined;
71
71
  'aria-details'?: string | undefined;
72
72
  'aria-disabled'?: boolean | "true" | "false" | undefined;
73
- 'aria-dropeffect'?: "none" | "link" | "copy" | "execute" | "move" | "popup" | undefined;
73
+ 'aria-dropeffect'?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
74
74
  'aria-errormessage'?: string | undefined;
75
75
  'aria-expanded'?: boolean | "true" | "false" | undefined;
76
76
  'aria-flowto'?: string | undefined;
@@ -268,6 +268,7 @@ declare const ButtonOutline: import("styled-components").StyledComponent<"button
268
268
  onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
269
269
  onTransitionEnd?: import("react").TransitionEventHandler<HTMLButtonElement> | undefined;
270
270
  onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLButtonElement> | undefined;
271
+ as?: string | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
271
272
  autoFocus?: boolean | undefined;
272
273
  disabled?: boolean | undefined;
273
274
  formAction?: string | undefined;
@@ -275,8 +276,7 @@ declare const ButtonOutline: import("styled-components").StyledComponent<"button
275
276
  formMethod?: string | undefined;
276
277
  formNoValidate?: boolean | undefined;
277
278
  formTarget?: string | undefined;
278
- as?: string | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
279
- variant?: "large" | "medium" | "small" | undefined;
279
+ variant?: "small" | "medium" | "large" | undefined;
280
280
  } & {
281
281
  theme?: any;
282
282
  } & import("styled-system").FontSizeProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & import("../constants").SystemCommonProps & import("../constants").SystemLayoutProps & SxProp, never>;
package/lib/Button/ButtonPrimary.d.ts CHANGED
@@ -3,7 +3,7 @@ import { SxProp } from '../sx';
3
3
  import { ComponentProps } from '../utils/types';
4
4
  export declare const ButtonPrimary: import("styled-components").StyledComponent<"button", any, {
5
5
  as?: string | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
6
- variant?: "large" | "medium" | "small" | undefined;
6
+ variant?: "small" | "medium" | "large" | undefined;
7
7
  } & import("styled-system").FontSizeProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & {
8
8
  color?: string | undefined;
9
9
  fontSize?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
@@ -55,7 +55,7 @@ export declare const ButtonPrimary: import("styled-components").StyledComponent<
55
55
  results?: number | undefined;
56
56
  security?: string | undefined;
57
57
  unselectable?: "on" | "off" | undefined;
58
- inputMode?: "none" | "text" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
58
+ inputMode?: "search" | "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
59
59
  is?: string | undefined;
60
60
  'aria-activedescendant'?: string | undefined;
61
61
  'aria-atomic'?: boolean | "true" | "false" | undefined;
@@ -70,7 +70,7 @@ export declare const ButtonPrimary: import("styled-components").StyledComponent<
70
70
  'aria-describedby'?: string | undefined;
71
71
  'aria-details'?: string | undefined;
72
72
  'aria-disabled'?: boolean | "true" | "false" | undefined;
73
- 'aria-dropeffect'?: "none" | "link" | "copy" | "execute" | "move" | "popup" | undefined;
73
+ 'aria-dropeffect'?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
74
74
  'aria-errormessage'?: string | undefined;
75
75
  'aria-expanded'?: boolean | "true" | "false" | undefined;
76
76
  'aria-flowto'?: string | undefined;
@@ -268,6 +268,7 @@ export declare const ButtonPrimary: import("styled-components").StyledComponent<
268
268
  onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
269
269
  onTransitionEnd?: import("react").TransitionEventHandler<HTMLButtonElement> | undefined;
270
270
  onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLButtonElement> | undefined;
271
+ as?: string | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
271
272
  autoFocus?: boolean | undefined;
272
273
  disabled?: boolean | undefined;
273
274
  formAction?: string | undefined;
@@ -275,8 +276,7 @@ export declare const ButtonPrimary: import("styled-components").StyledComponent<
275
276
  formMethod?: string | undefined;
276
277
  formNoValidate?: boolean | undefined;
277
278
  formTarget?: string | undefined;
278
- as?: string | import("react").ComponentClass<any, any> | import("react").FunctionComponent<any> | undefined;
279
- variant?: "large" | "medium" | "small" | undefined;
279
+ variant?: "small" | "medium" | "large" | undefined;
280
280
  } & {
281
281
  theme?: any;
282
282
  } & import("styled-system").FontSizeProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & import("../constants").SystemCommonProps & import("../constants").SystemLayoutProps & SxProp, never>;
package/lib/CircleBadge.d.ts CHANGED
@@ -5,7 +5,7 @@ import { SxProp } from './sx';
5
5
  import { ComponentProps } from './utils/types';
6
6
  declare const CircleBadge: import("styled-components").StyledComponent<"div", any, {
7
7
  inline?: boolean | undefined;
8
- variant?: "large" | "medium" | "small" | undefined;
8
+ variant?: "small" | "medium" | "large" | undefined;
9
9
  size?: number | undefined;
10
10
  } & SystemCommonProps & SxProp, never>;
11
11
  declare const CircleBadgeIcon: import("styled-components").StyledComponent<({ icon: IconComponent, ...rest }: {
@@ -15,7 +15,7 @@ export declare type CircleBadgeProps = ComponentProps<typeof CircleBadge>;
15
15
  export declare type CircleBadgeIconProps = ComponentProps<typeof CircleBadgeIcon>;
16
16
  declare const _default: string & import("styled-components").StyledComponentBase<"div", any, {
17
17
  inline?: boolean | undefined;
18
- variant?: "large" | "medium" | "small" | undefined;
18
+ variant?: "small" | "medium" | "large" | undefined;
19
19
  size?: number | undefined;
20
20
  } & SystemCommonProps & SxProp, never> & import("hoist-non-react-statics").NonReactStatics<never, {}> & {
21
21
  Icon: import("styled-components").StyledComponent<({ icon: IconComponent, ...rest }: {
package/lib/CircleOcticon.d.ts CHANGED
@@ -13,6 +13,7 @@ declare namespace CircleOcticon {
13
13
  var defaultProps: {
14
14
  size: number;
15
15
  lineHeight?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
16
+ border?: import("styled-system").ResponsiveValue<import("csstype").Property.Border<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
16
17
  alignContent?: import("styled-system").ResponsiveValue<import("csstype").Property.AlignContent, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
17
18
  alignItems?: import("styled-system").ResponsiveValue<import("csstype").Property.AlignItems, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
18
19
  alignSelf?: import("styled-system").ResponsiveValue<import("csstype").Property.AlignSelf, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
@@ -88,7 +89,6 @@ declare namespace CircleOcticon {
88
89
  zIndex?: import("styled-system").ResponsiveValue<import("csstype").Property.ZIndex, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
89
90
  background?: import("styled-system").ResponsiveValue<import("csstype").Property.Background<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
90
91
  backgroundPosition?: import("styled-system").ResponsiveValue<import("csstype").Property.BackgroundPosition<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
91
- border?: import("styled-system").ResponsiveValue<import("csstype").Property.Border<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
92
92
  borderBottom?: import("styled-system").ResponsiveValue<import("csstype").Property.BorderBottom<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
93
93
  borderColor?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
94
94
  borderLeft?: import("styled-system").ResponsiveValue<import("csstype").Property.BorderLeft<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
@@ -151,7 +151,7 @@ declare namespace CircleOcticon {
151
151
  results?: number | undefined;
152
152
  security?: string | undefined;
153
153
  unselectable?: "on" | "off" | undefined;
154
- inputMode?: "none" | "text" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
154
+ inputMode?: "search" | "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
155
155
  is?: string | undefined;
156
156
  'aria-activedescendant'?: string | undefined;
157
157
  'aria-atomic'?: boolean | "true" | "false" | undefined;
@@ -166,7 +166,7 @@ declare namespace CircleOcticon {
166
166
  'aria-describedby'?: string | undefined;
167
167
  'aria-details'?: string | undefined;
168
168
  'aria-disabled'?: boolean | "true" | "false" | undefined;
169
- 'aria-dropeffect'?: "none" | "link" | "copy" | "execute" | "move" | "popup" | undefined;
169
+ 'aria-dropeffect'?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
170
170
  'aria-errormessage'?: string | undefined;
171
171
  'aria-expanded'?: boolean | "true" | "false" | undefined;
172
172
  'aria-flowto'?: string | undefined;
@@ -384,7 +384,7 @@ declare namespace CircleOcticon {
384
384
  paddingY?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
385
385
  borderX?: import("styled-system").ResponsiveValue<import("csstype").Property.Border<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
386
386
  borderY?: import("styled-system").ResponsiveValue<import("csstype").Property.Border<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
387
- sx?: import("@styled-system/css").SystemStyleObject | undefined;
387
+ sx?: import("./sx").BetterSystemStyleObject | undefined;
388
388
  theme?: any;
389
389
  };
390
390
  }
package/lib/Dialog.d.ts CHANGED
@@ -15,6 +15,7 @@ declare namespace DialogHeader {
15
15
  };
16
16
  var propTypes: {
17
17
  lineHeight?: React.Validator<import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined> | undefined;
18
+ border?: React.Validator<import("styled-system").ResponsiveValue<import("csstype").Property.Border<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined> | undefined;
18
19
  alignContent?: React.Validator<import("styled-system").ResponsiveValue<import("csstype").Property.AlignContent, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined> | undefined;
19
20
  alignItems?: React.Validator<import("styled-system").ResponsiveValue<import("csstype").Property.AlignItems, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined> | undefined;
20
21
  alignSelf?: React.Validator<import("styled-system").ResponsiveValue<import("csstype").Property.AlignSelf, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined> | undefined;
@@ -90,7 +91,6 @@ declare namespace DialogHeader {
90
91
  zIndex?: React.Validator<import("styled-system").ResponsiveValue<import("csstype").Property.ZIndex, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined> | undefined;
91
92
  background?: React.Validator<import("styled-system").ResponsiveValue<import("csstype").Property.Background<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined> | undefined;
92
93
  backgroundPosition?: React.Validator<import("styled-system").ResponsiveValue<import("csstype").Property.BackgroundPosition<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined> | undefined;
93
- border?: React.Validator<import("styled-system").ResponsiveValue<import("csstype").Property.Border<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined> | undefined;
94
94
  borderBottom?: React.Validator<import("styled-system").ResponsiveValue<import("csstype").Property.BorderBottom<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined> | undefined;
95
95
  borderColor?: React.Validator<import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined> | undefined;
96
96
  borderLeft?: React.Validator<import("styled-system").ResponsiveValue<import("csstype").Property.BorderLeft<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined> | undefined;
@@ -153,7 +153,7 @@ declare namespace DialogHeader {
153
153
  results?: React.Validator<number | null | undefined> | undefined;
154
154
  security?: React.Validator<string | null | undefined> | undefined;
155
155
  unselectable?: React.Validator<"on" | "off" | null | undefined> | undefined;
156
- inputMode?: React.Validator<"none" | "text" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | null | undefined> | undefined;
156
+ inputMode?: React.Validator<"search" | "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | null | undefined> | undefined;
157
157
  is?: React.Validator<string | null | undefined> | undefined;
158
158
  'aria-activedescendant'?: React.Validator<string | null | undefined> | undefined;
159
159
  'aria-atomic'?: React.Validator<boolean | "true" | "false" | null | undefined> | undefined;
@@ -168,7 +168,7 @@ declare namespace DialogHeader {
168
168
  'aria-describedby'?: React.Validator<string | null | undefined> | undefined;
169
169
  'aria-details'?: React.Validator<string | null | undefined> | undefined;
170
170
  'aria-disabled'?: React.Validator<boolean | "true" | "false" | null | undefined> | undefined;
171
- 'aria-dropeffect'?: React.Validator<"none" | "link" | "copy" | "execute" | "move" | "popup" | null | undefined> | undefined;
171
+ 'aria-dropeffect'?: React.Validator<"link" | "none" | "copy" | "execute" | "move" | "popup" | null | undefined> | undefined;
172
172
  'aria-errormessage'?: React.Validator<string | null | undefined> | undefined;
173
173
  'aria-expanded'?: React.Validator<boolean | "true" | "false" | null | undefined> | undefined;
174
174
  'aria-flowto'?: React.Validator<string | null | undefined> | undefined;
@@ -387,7 +387,7 @@ declare namespace DialogHeader {
387
387
  size?: React.Validator<import("styled-system").ResponsiveValue<import("csstype").Property.Height<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined> | undefined;
388
388
  borderX?: React.Validator<import("styled-system").ResponsiveValue<import("csstype").Property.Border<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined> | undefined;
389
389
  borderY?: React.Validator<import("styled-system").ResponsiveValue<import("csstype").Property.Border<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined> | undefined;
390
- sx?: React.Validator<import("@styled-system/css").SystemStyleObject | undefined> | undefined;
390
+ sx?: React.Validator<import("./sx").BetterSystemStyleObject | undefined> | undefined;
391
391
  theme?: React.Validator<any> | undefined;
392
392
  };
393
393
  var displayName: string;
package/lib/Dropdown.d.ts CHANGED
@@ -75,7 +75,7 @@ declare const _default: {
75
75
  results?: number | undefined;
76
76
  security?: string | undefined;
77
77
  unselectable?: "on" | "off" | undefined;
78
- inputMode?: "none" | "text" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
78
+ inputMode?: "search" | "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
79
79
  is?: string | undefined;
80
80
  'aria-activedescendant'?: string | undefined;
81
81
  'aria-atomic'?: boolean | "true" | "false" | undefined;
@@ -90,7 +90,7 @@ declare const _default: {
90
90
  'aria-describedby'?: string | undefined;
91
91
  'aria-details'?: string | undefined;
92
92
  'aria-disabled'?: boolean | "true" | "false" | undefined;
93
- 'aria-dropeffect'?: "none" | "link" | "copy" | "execute" | "move" | "popup" | undefined;
93
+ 'aria-dropeffect'?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
94
94
  'aria-errormessage'?: string | undefined;
95
95
  'aria-expanded'?: boolean | "true" | "false" | undefined;
96
96
  'aria-flowto'?: string | undefined;
@@ -307,7 +307,7 @@ declare const _default: {
307
307
  py?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
308
308
  paddingY?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
309
309
  open?: boolean | undefined;
310
- sx?: import("@styled-system/css").SystemStyleObject | undefined;
310
+ sx?: import("./sx").BetterSystemStyleObject | undefined;
311
311
  onToggle?: React.ReactEventHandler<HTMLElement> | undefined;
312
312
  } & {
313
313
  theme?: any;
@@ -372,7 +372,7 @@ declare const _default: {
372
372
  results?: number | undefined;
373
373
  security?: string | undefined;
374
374
  unselectable?: "on" | "off" | undefined;
375
- inputMode?: "none" | "text" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
375
+ inputMode?: "search" | "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
376
376
  is?: string | undefined;
377
377
  'aria-activedescendant'?: string | undefined;
378
378
  'aria-atomic'?: boolean | "true" | "false" | undefined;
@@ -387,7 +387,7 @@ declare const _default: {
387
387
  'aria-describedby'?: string | undefined;
388
388
  'aria-details'?: string | undefined;
389
389
  'aria-disabled'?: boolean | "true" | "false" | undefined;
390
- 'aria-dropeffect'?: "none" | "link" | "copy" | "execute" | "move" | "popup" | undefined;
390
+ 'aria-dropeffect'?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
391
391
  'aria-errormessage'?: string | undefined;
392
392
  'aria-expanded'?: boolean | "true" | "false" | undefined;
393
393
  'aria-flowto'?: string | undefined;
@@ -604,7 +604,7 @@ declare const _default: {
604
604
  py?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
605
605
  paddingY?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
606
606
  open?: boolean | undefined;
607
- sx?: import("@styled-system/css").SystemStyleObject | undefined;
607
+ sx?: import("./sx").BetterSystemStyleObject | undefined;
608
608
  onToggle?: React.ReactEventHandler<HTMLElement> | undefined;
609
609
  } & {
610
610
  theme?: any;
@@ -691,7 +691,7 @@ declare const _default: {
691
691
  results?: number | undefined;
692
692
  security?: string | undefined;
693
693
  unselectable?: "on" | "off" | undefined;
694
- inputMode?: "none" | "text" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
694
+ inputMode?: "search" | "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
695
695
  is?: string | undefined;
696
696
  'aria-activedescendant'?: string | undefined;
697
697
  'aria-atomic'?: boolean | "true" | "false" | undefined;
@@ -706,7 +706,7 @@ declare const _default: {
706
706
  'aria-describedby'?: string | undefined;
707
707
  'aria-details'?: string | undefined;
708
708
  'aria-disabled'?: boolean | "true" | "false" | undefined;
709
- 'aria-dropeffect'?: "none" | "link" | "copy" | "execute" | "move" | "popup" | undefined;
709
+ 'aria-dropeffect'?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
710
710
  'aria-errormessage'?: string | undefined;
711
711
  'aria-expanded'?: boolean | "true" | "false" | undefined;
712
712
  'aria-flowto'?: string | undefined;
@@ -923,7 +923,8 @@ declare const _default: {
923
923
  py?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
924
924
  paddingY?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
925
925
  size?: import("styled-system").ResponsiveValue<import("csstype").Property.Height<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
926
- sx?: import("@styled-system/css").SystemStyleObject | undefined;
926
+ sx?: import("./sx").BetterSystemStyleObject | undefined;
927
+ as?: string | React.ComponentClass<any, any> | React.FunctionComponent<any> | undefined;
927
928
  autoFocus?: boolean | undefined;
928
929
  disabled?: boolean | undefined;
929
930
  formAction?: string | undefined;
@@ -931,8 +932,7 @@ declare const _default: {
931
932
  formMethod?: string | undefined;
932
933
  formNoValidate?: boolean | undefined;
933
934
  formTarget?: string | undefined;
934
- as?: string | React.ComponentClass<any, any> | React.FunctionComponent<any> | undefined;
935
- variant?: "large" | "medium" | "small" | undefined;
935
+ variant?: "small" | "medium" | "large" | undefined;
936
936
  } & {
937
937
  theme?: any;
938
938
  }): JSX.Element;
@@ -1011,7 +1011,7 @@ declare const _default: {
1011
1011
  results?: number | undefined;
1012
1012
  security?: string | undefined;
1013
1013
  unselectable?: "on" | "off" | undefined;
1014
- inputMode?: "none" | "text" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
1014
+ inputMode?: "search" | "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
1015
1015
  is?: string | undefined;
1016
1016
  'aria-activedescendant'?: string | undefined;
1017
1017
  'aria-atomic'?: boolean | "true" | "false" | undefined;
@@ -1026,7 +1026,7 @@ declare const _default: {
1026
1026
  'aria-describedby'?: string | undefined;
1027
1027
  'aria-details'?: string | undefined;
1028
1028
  'aria-disabled'?: boolean | "true" | "false" | undefined;
1029
- 'aria-dropeffect'?: "none" | "link" | "copy" | "execute" | "move" | "popup" | undefined;
1029
+ 'aria-dropeffect'?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
1030
1030
  'aria-errormessage'?: string | undefined;
1031
1031
  'aria-expanded'?: boolean | "true" | "false" | undefined;
1032
1032
  'aria-flowto'?: string | undefined;
@@ -1243,7 +1243,8 @@ declare const _default: {
1243
1243
  py?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
1244
1244
  paddingY?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
1245
1245
  size?: import("styled-system").ResponsiveValue<import("csstype").Property.Height<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
1246
- sx?: import("@styled-system/css").SystemStyleObject | undefined;
1246
+ sx?: import("./sx").BetterSystemStyleObject | undefined;
1247
+ as?: string | React.ComponentClass<any, any> | React.FunctionComponent<any> | undefined;
1247
1248
  autoFocus?: boolean | undefined;
1248
1249
  disabled?: boolean | undefined;
1249
1250
  formAction?: string | undefined;
@@ -1251,8 +1252,7 @@ declare const _default: {
1251
1252
  formMethod?: string | undefined;
1252
1253
  formNoValidate?: boolean | undefined;
1253
1254
  formTarget?: string | undefined;
1254
- as?: string | React.ComponentClass<any, any> | React.FunctionComponent<any> | undefined;
1255
- variant?: "large" | "medium" | "small" | undefined;
1255
+ variant?: "small" | "medium" | "large" | undefined;
1256
1256
  } & {
1257
1257
  theme?: any;
1258
1258
  }> | undefined;