@instructure/ui-buttons 8.8.1-snapshot.7 → 8.9.1-snapshot.2
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.
- package/CHANGELOG.md +6 -0
- package/es/BaseButton/index.js +12 -133
- package/es/BaseButton/props.js +138 -0
- package/es/Button/index.js +4 -87
- package/es/Button/props.js +107 -0
- package/es/CloseButton/index.js +5 -93
- package/es/CloseButton/props.js +103 -0
- package/es/CondensedButton/index.js +4 -65
- package/es/CondensedButton/props.js +86 -0
- package/es/IconButton/index.js +4 -91
- package/es/IconButton/props.js +111 -0
- package/es/ToggleButton/index.js +2 -77
- package/es/ToggleButton/props.js +100 -0
- package/lib/BaseButton/index.js +12 -133
- package/lib/BaseButton/props.js +150 -0
- package/lib/Button/index.js +4 -87
- package/lib/Button/props.js +119 -0
- package/lib/CloseButton/index.js +5 -93
- package/lib/CloseButton/props.js +115 -0
- package/lib/CondensedButton/index.js +4 -65
- package/lib/CondensedButton/props.js +98 -0
- package/lib/IconButton/index.js +4 -91
- package/lib/IconButton/props.js +123 -0
- package/lib/ToggleButton/index.js +3 -79
- package/lib/ToggleButton/props.js +112 -0
- package/package.json +21 -21
- package/src/BaseButton/index.tsx +15 -120
- package/src/BaseButton/props.ts +192 -0
- package/src/BaseButton/styles.ts +1 -1
- package/src/Button/index.tsx +7 -81
- package/src/Button/props.ts +149 -0
- package/src/CloseButton/index.tsx +8 -82
- package/src/CloseButton/props.ts +137 -0
- package/src/CloseButton/styles.ts +1 -1
- package/src/CondensedButton/index.tsx +7 -57
- package/src/CondensedButton/props.ts +118 -0
- package/src/IconButton/index.tsx +7 -84
- package/src/IconButton/props.ts +154 -0
- package/src/ToggleButton/index.tsx +5 -68
- package/src/ToggleButton/props.ts +140 -0
- package/src/index.ts +6 -6
- package/types/BaseButton/index.d.ts +47 -101
- package/types/BaseButton/index.d.ts.map +1 -1
- package/types/BaseButton/{types.d.ts → props.d.ts} +15 -10
- package/types/BaseButton/props.d.ts.map +1 -0
- package/types/BaseButton/styles.d.ts +1 -1
- package/types/Button/index.d.ts +36 -73
- package/types/Button/index.d.ts.map +1 -1
- package/types/Button/{types.d.ts → props.d.ts} +12 -4
- package/types/Button/props.d.ts.map +1 -0
- package/types/CloseButton/index.d.ts +41 -75
- package/types/CloseButton/index.d.ts.map +1 -1
- package/types/CloseButton/props.d.ts +27 -0
- package/types/CloseButton/props.d.ts.map +1 -0
- package/types/CloseButton/styles.d.ts +1 -1
- package/types/CondensedButton/index.d.ts +28 -55
- package/types/CondensedButton/index.d.ts.map +1 -1
- package/types/CondensedButton/props.d.ts +24 -0
- package/types/CondensedButton/props.d.ts.map +1 -0
- package/types/IconButton/index.d.ts +38 -76
- package/types/IconButton/index.d.ts.map +1 -1
- package/types/IconButton/{types.d.ts → props.d.ts} +11 -3
- package/types/IconButton/props.d.ts.map +1 -0
- package/types/ToggleButton/index.d.ts +34 -65
- package/types/ToggleButton/index.d.ts.map +1 -1
- package/types/ToggleButton/{types.d.ts → props.d.ts} +10 -3
- package/types/ToggleButton/props.d.ts.map +1 -0
- package/types/index.d.ts +6 -6
- package/es/BaseButton/types.js +0 -1
- package/es/Button/types.js +0 -1
- package/es/CloseButton/types.js +0 -1
- package/es/CondensedButton/types.js +0 -1
- package/es/IconButton/types.js +0 -1
- package/es/ToggleButton/types.js +0 -1
- package/lib/BaseButton/types.js +0 -1
- package/lib/Button/types.js +0 -1
- package/lib/CloseButton/types.js +0 -1
- package/lib/CondensedButton/types.js +0 -1
- package/lib/IconButton/types.js +0 -1
- package/lib/ToggleButton/types.js +0 -1
- package/src/BaseButton/types.ts +0 -58
- package/src/Button/types.ts +0 -44
- package/src/CloseButton/types.ts +0 -45
- package/src/CondensedButton/types.ts +0 -40
- package/src/IconButton/types.ts +0 -45
- package/src/ToggleButton/types.ts +0 -48
- package/types/BaseButton/types.d.ts.map +0 -1
- package/types/Button/types.d.ts.map +0 -1
- package/types/CloseButton/types.d.ts +0 -22
- package/types/CloseButton/types.d.ts.map +0 -1
- package/types/CondensedButton/types.d.ts +0 -16
- package/types/CondensedButton/types.d.ts.map +0 -1
- package/types/IconButton/types.d.ts.map +0 -1
- package/types/ToggleButton/types.d.ts.map +0 -1
package/src/index.ts
CHANGED
|
@@ -29,9 +29,9 @@ export { CondensedButton } from './CondensedButton'
|
|
|
29
29
|
export { IconButton } from './IconButton'
|
|
30
30
|
export { ToggleButton } from './ToggleButton'
|
|
31
31
|
|
|
32
|
-
export type { BaseButtonProps } from './BaseButton/
|
|
33
|
-
export type { ButtonProps } from './Button/
|
|
34
|
-
export type { CloseButtonProps } from './CloseButton/
|
|
35
|
-
export type { CondensedButtonProps } from './CondensedButton/
|
|
36
|
-
export type { IconButtonProps } from './IconButton/
|
|
37
|
-
export type { ToggleButtonProps } from './ToggleButton/
|
|
32
|
+
export type { BaseButtonProps } from './BaseButton/props'
|
|
33
|
+
export type { ButtonProps } from './Button/props'
|
|
34
|
+
export type { CloseButtonProps } from './CloseButton/props'
|
|
35
|
+
export type { CondensedButtonProps } from './CondensedButton/props'
|
|
36
|
+
export type { IconButtonProps } from './IconButton/props'
|
|
37
|
+
export type { ToggleButtonProps } from './ToggleButton/props'
|
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
2
|
import { Component } from 'react';
|
|
3
|
-
import PropTypes from 'prop-types';
|
|
4
3
|
import { jsx } from '@instructure/emotion';
|
|
5
|
-
import { BaseButtonProps, BaseButtonStyleProps } from './
|
|
4
|
+
import type { BaseButtonProps, BaseButtonStyleProps } from './props';
|
|
6
5
|
/**
|
|
7
6
|
---
|
|
8
7
|
category: components/utilities
|
|
@@ -10,108 +9,59 @@ category: components/utilities
|
|
|
10
9
|
**/
|
|
11
10
|
declare class BaseButton extends Component<BaseButtonProps> {
|
|
12
11
|
static readonly componentId = "BaseButton";
|
|
13
|
-
static propTypes: {
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
*/
|
|
60
|
-
readonly shape: PropTypes.Requireable<string>;
|
|
61
|
-
/**
|
|
62
|
-
* Specifies if the `Button` should render with a solid background. When false, the background is transparent.
|
|
63
|
-
*/
|
|
64
|
-
readonly withBackground: PropTypes.Requireable<boolean>;
|
|
65
|
-
/**
|
|
66
|
-
* Specifies if the `Button` should render with a border.
|
|
67
|
-
*/
|
|
68
|
-
readonly withBorder: PropTypes.Requireable<boolean>;
|
|
69
|
-
/**
|
|
70
|
-
* Designates if the `Button` should render without padding. This option should only be set when `withBorder` and
|
|
71
|
-
* `withBackground` are also set to false.
|
|
72
|
-
*/
|
|
73
|
-
readonly isCondensed: PropTypes.Requireable<boolean>;
|
|
74
|
-
/**
|
|
75
|
-
* Valid values are `0`, `none`, `auto`, `xxx-small`, `xx-small`, `x-small`,
|
|
76
|
-
* `small`, `medium`, `large`, `x-large`, `xx-large`. Apply these values via
|
|
77
|
-
* familiar CSS-like shorthand. For example: `margin="small auto large"`.
|
|
78
|
-
*/
|
|
79
|
-
readonly margin: (props: any, propName: any, componentName: any, location: any) => any;
|
|
80
|
-
/**
|
|
81
|
-
* Specify a mouse cursor to use when hovering over the button.
|
|
82
|
-
* The `pointer` cursor is used by default.
|
|
83
|
-
*/
|
|
84
|
-
readonly cursor: PropTypes.Requireable<string>;
|
|
85
|
-
/**
|
|
86
|
-
* Specifies an href attribute for the `Button`'s underlying html element.
|
|
87
|
-
*/
|
|
88
|
-
readonly href: PropTypes.Requireable<string>;
|
|
89
|
-
/**
|
|
90
|
-
* Callback fired when the `Button` is clicked.
|
|
91
|
-
*/
|
|
92
|
-
readonly onClick: PropTypes.Requireable<(...args: any[]) => any>;
|
|
93
|
-
/**
|
|
94
|
-
* Callback fired when the `Button` receives a keydown event.
|
|
95
|
-
*/
|
|
96
|
-
readonly onKeyDown: PropTypes.Requireable<(...args: any[]) => any>;
|
|
97
|
-
/**
|
|
98
|
-
* An icon, or function that returns an icon.
|
|
99
|
-
*/
|
|
100
|
-
readonly renderIcon: PropTypes.Requireable<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
|
|
101
|
-
/**
|
|
102
|
-
* Specifies the tabindex of the `Button`.
|
|
103
|
-
*/
|
|
104
|
-
readonly tabIndex: PropTypes.Requireable<string | number>;
|
|
105
|
-
};
|
|
12
|
+
static propTypes: import("@instructure/shared-types/types/UtilityTypes").PropValidators<keyof {
|
|
13
|
+
children?: import("react").ReactNode;
|
|
14
|
+
type?: "button" | "submit" | "reset" | undefined;
|
|
15
|
+
size?: "small" | "medium" | "large" | undefined;
|
|
16
|
+
elementRef?: ((...args: any[]) => any) | undefined;
|
|
17
|
+
as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
|
|
18
|
+
interaction?: import("@instructure/ui-react-utils").InteractionType | undefined;
|
|
19
|
+
color?: "primary" | "primary-inverse" | "secondary" | "success" | "danger" | undefined;
|
|
20
|
+
focusColor?: "info" | "inverse" | undefined;
|
|
21
|
+
display?: "inline-block" | "block" | undefined;
|
|
22
|
+
textAlign?: "start" | "center" | undefined;
|
|
23
|
+
shape?: "circle" | "rectangle" | undefined;
|
|
24
|
+
withBackground?: boolean | undefined;
|
|
25
|
+
withBorder?: boolean | undefined;
|
|
26
|
+
isCondensed?: boolean | undefined;
|
|
27
|
+
margin?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
|
|
28
|
+
cursor?: string | undefined;
|
|
29
|
+
href?: string | undefined;
|
|
30
|
+
onClick?: ((...args: any[]) => any) | undefined;
|
|
31
|
+
onKeyDown?: ((...args: any[]) => any) | undefined;
|
|
32
|
+
renderIcon?: import("react").ReactNode | ((...args: any[]) => any);
|
|
33
|
+
tabIndex?: string | number | undefined;
|
|
34
|
+
}>;
|
|
35
|
+
static allowedProps: readonly (keyof {
|
|
36
|
+
children?: import("react").ReactNode;
|
|
37
|
+
type?: "button" | "submit" | "reset" | undefined;
|
|
38
|
+
size?: "small" | "medium" | "large" | undefined;
|
|
39
|
+
elementRef?: ((...args: any[]) => any) | undefined;
|
|
40
|
+
as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
|
|
41
|
+
interaction?: import("@instructure/ui-react-utils").InteractionType | undefined;
|
|
42
|
+
color?: "primary" | "primary-inverse" | "secondary" | "success" | "danger" | undefined;
|
|
43
|
+
focusColor?: "info" | "inverse" | undefined;
|
|
44
|
+
display?: "inline-block" | "block" | undefined;
|
|
45
|
+
textAlign?: "start" | "center" | undefined;
|
|
46
|
+
shape?: "circle" | "rectangle" | undefined;
|
|
47
|
+
withBackground?: boolean | undefined;
|
|
48
|
+
withBorder?: boolean | undefined;
|
|
49
|
+
isCondensed?: boolean | undefined;
|
|
50
|
+
margin?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
|
|
51
|
+
cursor?: string | undefined;
|
|
52
|
+
href?: string | undefined;
|
|
53
|
+
onClick?: ((...args: any[]) => any) | undefined;
|
|
54
|
+
onKeyDown?: ((...args: any[]) => any) | undefined;
|
|
55
|
+
renderIcon?: import("react").ReactNode | ((...args: any[]) => any);
|
|
56
|
+
tabIndex?: string | number | undefined;
|
|
57
|
+
})[];
|
|
106
58
|
static defaultProps: {
|
|
107
59
|
readonly children: null;
|
|
108
60
|
readonly type: "button";
|
|
109
61
|
readonly size: "medium";
|
|
110
62
|
readonly elementRef: (el: any) => void;
|
|
111
63
|
readonly as: "button";
|
|
112
|
-
readonly interaction: undefined;
|
|
113
64
|
readonly color: "secondary";
|
|
114
|
-
readonly focusColor: undefined;
|
|
115
65
|
readonly shape: "rectangle";
|
|
116
66
|
readonly display: "inline-block";
|
|
117
67
|
readonly textAlign: "start";
|
|
@@ -120,11 +70,7 @@ declare class BaseButton extends Component<BaseButtonProps> {
|
|
|
120
70
|
readonly isCondensed: false;
|
|
121
71
|
readonly margin: "0";
|
|
122
72
|
readonly cursor: "pointer";
|
|
123
|
-
readonly href: undefined;
|
|
124
|
-
readonly onClick: undefined;
|
|
125
73
|
readonly onKeyDown: (event: any) => void;
|
|
126
|
-
readonly renderIcon: undefined;
|
|
127
|
-
readonly tabIndex: undefined;
|
|
128
74
|
};
|
|
129
75
|
_rootElement: null;
|
|
130
76
|
componentDidMount(): void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/BaseButton/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/BaseButton/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAcjC,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAMrD,OAAO,KAAK,EAAE,eAAe,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAEpE;;;;GAIG;AAEH,cAEM,UAAW,SAAQ,SAAS,CAAC,eAAe,CAAC;IACjD,MAAM,CAAC,QAAQ,CAAC,WAAW,gBAAe;IAE1C,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;;MAmBT;IAEV,YAAY,OAAO;IAEnB,iBAAiB;IAMjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAKjD,IAAI,mBAAmB,IAAI,oBAAoB,CAK9C;IAED,IAAI,kBAAkB,YAGrB;IAED,IAAI,WAAW,wEAEd;IAED,IAAI,WAAW,0DAEd;IAED,IAAI,UAAU,YAEb;IAED,IAAI,UAAU,YAEb;IAED,IAAI,SAAS,YAEZ;IAED,IAAI,UAAU,uBAkBb;IAED,IAAI,OAAO,YAEV;IAED,KAAK;IAML,gBAAgB,oBAIf;IAGD,WAAW,uBAaV;IAGD,aAAa,uBA0BZ;IAED,cAAc;IAgCd,MAAM;CAwDP;AAED,OAAO,EAAE,UAAU,EAAE,CAAA;AACrB,eAAe,UAAU,CAAA"}
|
|
@@ -1,10 +1,9 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React from 'react';
|
|
2
2
|
import type { InteractionType } from '@instructure/ui-react-utils';
|
|
3
|
-
import type { Spacing } from '@instructure/emotion';
|
|
4
|
-
import type {
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
styles?: any;
|
|
3
|
+
import type { Spacing, WithStyleProps } from '@instructure/emotion';
|
|
4
|
+
import type { AsElementType, PropValidators } from '@instructure/shared-types';
|
|
5
|
+
declare type BaseButtonOwnProps = {
|
|
6
|
+
children?: React.ReactNode;
|
|
8
7
|
type?: 'button' | 'submit' | 'reset';
|
|
9
8
|
size?: 'small' | 'medium' | 'large';
|
|
10
9
|
elementRef?: (...args: any[]) => any;
|
|
@@ -23,12 +22,18 @@ export declare type BaseButtonProps = {
|
|
|
23
22
|
href?: string;
|
|
24
23
|
onClick?: (...args: any[]) => any;
|
|
25
24
|
onKeyDown?: (...args: any[]) => any;
|
|
26
|
-
renderIcon?: ReactNode | ((...args: any[]) => any);
|
|
25
|
+
renderIcon?: React.ReactNode | ((...args: any[]) => any);
|
|
27
26
|
tabIndex?: number | string;
|
|
28
|
-
children?: ReactNode;
|
|
29
27
|
};
|
|
30
|
-
|
|
28
|
+
declare type BaseButtonStyleProps = {
|
|
31
29
|
isDisabled: boolean;
|
|
32
30
|
hasOnlyIconVisible: boolean;
|
|
33
31
|
};
|
|
34
|
-
|
|
32
|
+
declare type PropKeys = keyof BaseButtonOwnProps;
|
|
33
|
+
declare type AllowedPropKeys = Readonly<Array<PropKeys>>;
|
|
34
|
+
declare type BaseButtonProps = BaseButtonOwnProps & WithStyleProps;
|
|
35
|
+
declare const propTypes: PropValidators<PropKeys>;
|
|
36
|
+
declare const allowedProps: AllowedPropKeys;
|
|
37
|
+
export type { BaseButtonProps, BaseButtonStyleProps };
|
|
38
|
+
export { propTypes, allowedProps };
|
|
39
|
+
//# sourceMappingURL=props.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/BaseButton/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAA;AAClE,OAAO,KAAK,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AACnE,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAE9E,aAAK,kBAAkB,GAAG;IACxB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAA;IACpC,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;IACnC,UAAU,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACpC,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,WAAW,CAAC,EAAE,eAAe,CAAA;IAC7B,KAAK,CAAC,EAAE,SAAS,GAAG,iBAAiB,GAAG,WAAW,GAAG,SAAS,GAAG,QAAQ,CAAA;IAC1E,UAAU,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IAC/B,OAAO,CAAC,EAAE,cAAc,GAAG,OAAO,CAAA;IAClC,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IAC9B,KAAK,CAAC,EAAE,WAAW,GAAG,QAAQ,CAAA;IAC9B,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACjC,SAAS,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACnC,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAC,CAAA;IACxD,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CAC3B,CAAA;AAED,aAAK,oBAAoB,GAAG;IAC1B,UAAU,EAAE,OAAO,CAAA;IACnB,kBAAkB,EAAE,OAAO,CAAA;CAC5B,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,kBAAkB,CAAA;AAExC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,eAAe,GAAG,kBAAkB,GAAG,cAAc,CAAA;AAE1D,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAgGvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAsBnB,CAAA;AAED,YAAY,EAAE,eAAe,EAAE,oBAAoB,EAAE,CAAA;AACrD,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
|
package/types/Button/index.d.ts
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import { Component } from 'react';
|
|
2
|
-
import
|
|
3
|
-
import { ButtonProps } from './types';
|
|
1
|
+
import React, { Component } from 'react';
|
|
2
|
+
import type { ButtonProps } from './props';
|
|
4
3
|
/**
|
|
5
4
|
---
|
|
6
5
|
category: components
|
|
@@ -8,88 +7,52 @@ category: components
|
|
|
8
7
|
**/
|
|
9
8
|
declare class Button extends Component<ButtonProps> {
|
|
10
9
|
static readonly componentId = "Button";
|
|
11
|
-
static propTypes: {
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
* The `Button` display property. When set to `inline-block`, the `Button` displays inline with other elements.
|
|
46
|
-
* When set to block, the `Button` expands to fill the width of the container.
|
|
47
|
-
*/
|
|
48
|
-
display: PropTypes.Requireable<string>;
|
|
49
|
-
/**
|
|
50
|
-
* Sets the alignment of the `Button` children and/or icon.
|
|
51
|
-
*/
|
|
52
|
-
textAlign: PropTypes.Requireable<string>;
|
|
53
|
-
/**
|
|
54
|
-
* Specifies if the `Button` should render with a solid background. When false, the background is transparent.
|
|
55
|
-
*/
|
|
56
|
-
withBackground: PropTypes.Requireable<boolean>;
|
|
57
|
-
/**
|
|
58
|
-
* Valid values are `0`, `none`, `auto`, `xxx-small`, `xx-small`, `x-small`,
|
|
59
|
-
* `small`, `medium`, `large`, `x-large`, `xx-large`. Apply these values via
|
|
60
|
-
* familiar CSS-like shorthand. For example: `margin="small auto large"`.
|
|
61
|
-
*/
|
|
62
|
-
margin: (props: any, propName: any, componentName: any, location: any) => any;
|
|
63
|
-
/**
|
|
64
|
-
* Specify a mouse cursor to use when hovering over the button.
|
|
65
|
-
* The `pointer` cursor is used by default.
|
|
66
|
-
*/
|
|
67
|
-
cursor: PropTypes.Requireable<string>;
|
|
68
|
-
/**
|
|
69
|
-
* Specifies an href attribute for the `Button`'s underlying html element.
|
|
70
|
-
*/
|
|
71
|
-
href: PropTypes.Requireable<string>;
|
|
72
|
-
/**
|
|
73
|
-
* An icon, or function that returns an icon.
|
|
74
|
-
*/
|
|
75
|
-
renderIcon: PropTypes.Requireable<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
|
|
76
|
-
};
|
|
10
|
+
static propTypes: import("@instructure/shared-types/types/UtilityTypes").PropValidators<keyof {
|
|
11
|
+
children?: React.ReactNode;
|
|
12
|
+
type?: "button" | "submit" | "reset" | undefined;
|
|
13
|
+
size?: "small" | "medium" | "large" | undefined;
|
|
14
|
+
elementRef?: ((...args: any[]) => any) | undefined;
|
|
15
|
+
as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
|
|
16
|
+
interaction?: "enabled" | "disabled" | "readonly" | undefined;
|
|
17
|
+
color?: "primary" | "primary-inverse" | "secondary" | "success" | "danger" | undefined;
|
|
18
|
+
focusColor?: "info" | "inverse" | undefined;
|
|
19
|
+
display?: "inline-block" | "block" | undefined;
|
|
20
|
+
textAlign?: "start" | "center" | undefined;
|
|
21
|
+
withBackground?: boolean | undefined;
|
|
22
|
+
margin?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
|
|
23
|
+
cursor?: string | undefined;
|
|
24
|
+
href?: string | undefined;
|
|
25
|
+
renderIcon?: React.ReactNode | ((...args: any[]) => any);
|
|
26
|
+
}>;
|
|
27
|
+
static allowedProps: readonly (keyof {
|
|
28
|
+
children?: React.ReactNode;
|
|
29
|
+
type?: "button" | "submit" | "reset" | undefined;
|
|
30
|
+
size?: "small" | "medium" | "large" | undefined;
|
|
31
|
+
elementRef?: ((...args: any[]) => any) | undefined;
|
|
32
|
+
as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
|
|
33
|
+
interaction?: "enabled" | "disabled" | "readonly" | undefined;
|
|
34
|
+
color?: "primary" | "primary-inverse" | "secondary" | "success" | "danger" | undefined;
|
|
35
|
+
focusColor?: "info" | "inverse" | undefined;
|
|
36
|
+
display?: "inline-block" | "block" | undefined;
|
|
37
|
+
textAlign?: "start" | "center" | undefined;
|
|
38
|
+
withBackground?: boolean | undefined;
|
|
39
|
+
margin?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
|
|
40
|
+
cursor?: string | undefined;
|
|
41
|
+
href?: string | undefined;
|
|
42
|
+
renderIcon?: React.ReactNode | ((...args: any[]) => any);
|
|
43
|
+
})[];
|
|
77
44
|
static defaultProps: {
|
|
78
45
|
children: null;
|
|
79
46
|
type: string;
|
|
80
47
|
size: string;
|
|
81
48
|
elementRef: (el: any) => void;
|
|
82
49
|
as: string;
|
|
83
|
-
interaction: undefined;
|
|
84
50
|
color: string;
|
|
85
|
-
focusColor: undefined;
|
|
86
51
|
display: string;
|
|
87
52
|
textAlign: string;
|
|
88
53
|
withBackground: boolean;
|
|
89
54
|
margin: string;
|
|
90
55
|
cursor: string;
|
|
91
|
-
href: undefined;
|
|
92
|
-
renderIcon: undefined;
|
|
93
56
|
};
|
|
94
57
|
_buttonComponent: null;
|
|
95
58
|
get focused(): null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Button/index.tsx"],"names":[],"mappings":"AAwBA,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Button/index.tsx"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAWxC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAE1C;;;;GAIG;AAEH,cAEM,MAAO,SAAQ,SAAS,CAAC,WAAW,CAAC;IACzC,MAAM,CAAC,QAAQ,CAAC,WAAW,YAAW;IAEtC,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;;;;;;;;MAclB;IAED,gBAAgB,OAAO;IAEvB,IAAI,OAAO,SAGV;IAED,KAAK;IAML,gBAAgB,oBAKf;IAGD,eAAe,2BAEd;IAED,MAAM;CA8CP;AAED,eAAe,MAAM,CAAA;AACrB,OAAO,EAAE,MAAM,EAAE,CAAA"}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
import { AsElementType } from '@instructure/shared-types';
|
|
2
|
-
import type { Spacing } from '@instructure/emotion';
|
|
3
1
|
import React from 'react';
|
|
4
|
-
|
|
2
|
+
import type { Spacing } from '@instructure/emotion';
|
|
3
|
+
import type { AsElementType, PropValidators } from '@instructure/shared-types';
|
|
4
|
+
declare type ButtonOwnProps = {
|
|
5
|
+
children?: React.ReactNode;
|
|
5
6
|
type?: 'button' | 'submit' | 'reset';
|
|
6
7
|
size?: 'small' | 'medium' | 'large';
|
|
7
8
|
elementRef?: (...args: any[]) => any;
|
|
@@ -17,4 +18,11 @@ export declare type ButtonProps = {
|
|
|
17
18
|
href?: string;
|
|
18
19
|
renderIcon?: React.ReactNode | ((...args: any[]) => any);
|
|
19
20
|
};
|
|
20
|
-
|
|
21
|
+
declare type PropKeys = keyof ButtonOwnProps;
|
|
22
|
+
declare type AllowedPropKeys = Readonly<Array<PropKeys>>;
|
|
23
|
+
declare type ButtonProps = ButtonOwnProps;
|
|
24
|
+
declare const propTypes: PropValidators<PropKeys>;
|
|
25
|
+
declare const allowedProps: AllowedPropKeys;
|
|
26
|
+
export type { ButtonProps };
|
|
27
|
+
export { propTypes, allowedProps };
|
|
28
|
+
//# sourceMappingURL=props.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/Button/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAA;AACnD,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAE9E,aAAK,cAAc,GAAG;IACpB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAA;IACpC,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;IACnC,UAAU,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACpC,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,WAAW,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,UAAU,CAAA;IACjD,KAAK,CAAC,EAAE,SAAS,GAAG,iBAAiB,GAAG,WAAW,GAAG,SAAS,GAAG,QAAQ,CAAA;IAC1E,UAAU,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IAC/B,OAAO,CAAC,EAAE,cAAc,GAAG,OAAO,CAAA;IAClC,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IAC9B,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAC,CAAA;CACzD,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,cAAc,CAAA;AAEpC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,WAAW,GAAG,cAAc,CAAA;AAEjC,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAuEvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAgBnB,CAAA;AAED,YAAY,EAAE,WAAW,EAAE,CAAA;AAC3B,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
|
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
2
|
import { Component } from 'react';
|
|
3
|
-
import PropTypes from 'prop-types';
|
|
4
3
|
import { jsx } from '@instructure/emotion';
|
|
5
|
-
import { CloseButtonProps } from './
|
|
4
|
+
import type { CloseButtonProps } from './props';
|
|
6
5
|
/**
|
|
7
6
|
---
|
|
8
7
|
category: components
|
|
@@ -10,88 +9,55 @@ category: components
|
|
|
10
9
|
**/
|
|
11
10
|
declare class CloseButton extends Component<CloseButtonProps> {
|
|
12
11
|
static readonly componentId = "CloseButton";
|
|
13
|
-
static propTypes: {
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
onClick
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
* offset will also be created with respect to a positioned parent. If it does not appear to be working, try setting
|
|
54
|
-
* the `position` of the parent container to `relative`.
|
|
55
|
-
*/
|
|
56
|
-
offset: PropTypes.Requireable<string>;
|
|
57
|
-
/**
|
|
58
|
-
* Specifies the type of the `Button`'s underlying html element.
|
|
59
|
-
*/
|
|
60
|
-
type: PropTypes.Requireable<string>;
|
|
61
|
-
/**
|
|
62
|
-
* The element to render as the component root, `CloseButton` by default.
|
|
63
|
-
*/
|
|
64
|
-
as: PropTypes.Requireable<PropTypes.ReactComponentLike>;
|
|
65
|
-
/**
|
|
66
|
-
* Specifies an href attribute for the `CloseButton`'s underlying html element.
|
|
67
|
-
*/
|
|
68
|
-
href: PropTypes.Requireable<string>;
|
|
69
|
-
/**
|
|
70
|
-
* Specify a mouse cursor to use when hovering over the `CloseButton`.
|
|
71
|
-
*/
|
|
72
|
-
cursor: PropTypes.Requireable<string>;
|
|
73
|
-
/**
|
|
74
|
-
* Specifies the tabindex of the `CloseButton`.
|
|
75
|
-
*/
|
|
76
|
-
tabIndex: PropTypes.Requireable<string | number>;
|
|
77
|
-
};
|
|
12
|
+
static propTypes: import("@instructure/shared-types/types/UtilityTypes").PropValidators<keyof {
|
|
13
|
+
screenReaderLabel: import("react").ReactNode;
|
|
14
|
+
color?: "primary" | "primary-inverse" | undefined;
|
|
15
|
+
interaction?: "enabled" | "disabled" | "readonly" | undefined;
|
|
16
|
+
elementRef?: ((...args: any[]) => any) | undefined;
|
|
17
|
+
size?: "small" | "medium" | "large" | undefined;
|
|
18
|
+
onClick?: ((...args: any[]) => any) | undefined;
|
|
19
|
+
margin?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
|
|
20
|
+
placement?: "start" | "end" | "static" | undefined; /**
|
|
21
|
+
---
|
|
22
|
+
category: components
|
|
23
|
+
---
|
|
24
|
+
**/
|
|
25
|
+
offset?: "small" | "medium" | "none" | "x-small" | undefined;
|
|
26
|
+
type?: "button" | "submit" | "reset" | undefined;
|
|
27
|
+
as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
|
|
28
|
+
href?: string | undefined;
|
|
29
|
+
cursor?: string | undefined;
|
|
30
|
+
tabIndex?: string | number | undefined;
|
|
31
|
+
}>;
|
|
32
|
+
static allowedProps: readonly (keyof {
|
|
33
|
+
screenReaderLabel: import("react").ReactNode;
|
|
34
|
+
color?: "primary" | "primary-inverse" | undefined;
|
|
35
|
+
interaction?: "enabled" | "disabled" | "readonly" | undefined;
|
|
36
|
+
elementRef?: ((...args: any[]) => any) | undefined;
|
|
37
|
+
size?: "small" | "medium" | "large" | undefined;
|
|
38
|
+
onClick?: ((...args: any[]) => any) | undefined;
|
|
39
|
+
margin?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
|
|
40
|
+
placement?: "start" | "end" | "static" | undefined; /**
|
|
41
|
+
---
|
|
42
|
+
category: components
|
|
43
|
+
---
|
|
44
|
+
**/
|
|
45
|
+
offset?: "small" | "medium" | "none" | "x-small" | undefined;
|
|
46
|
+
type?: "button" | "submit" | "reset" | undefined;
|
|
47
|
+
as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
|
|
48
|
+
href?: string | undefined;
|
|
49
|
+
cursor?: string | undefined;
|
|
50
|
+
tabIndex?: string | number | undefined;
|
|
51
|
+
})[];
|
|
78
52
|
static defaultProps: {
|
|
79
|
-
screenReaderLabel: undefined;
|
|
80
53
|
onClick: (event: any) => void;
|
|
81
|
-
elementRef: undefined;
|
|
82
|
-
color: undefined;
|
|
83
|
-
interaction: undefined;
|
|
84
|
-
disabled: undefined;
|
|
85
|
-
readOnly: undefined;
|
|
86
54
|
type: string;
|
|
87
55
|
placement: string;
|
|
88
56
|
offset: string;
|
|
89
57
|
size: string;
|
|
90
58
|
margin: string;
|
|
91
59
|
as: string;
|
|
92
|
-
href: undefined;
|
|
93
60
|
cursor: string;
|
|
94
|
-
tabIndex: undefined;
|
|
95
61
|
};
|
|
96
62
|
componentDidMount(): void;
|
|
97
63
|
componentDidUpdate(): void;
|