@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
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/CloseButton/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/CloseButton/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAOjC,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAOrD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAE/C;;;;GAIG;AACH,cAEM,WAAY,SAAQ,SAAS,CAAC,gBAAgB,CAAC;IACnD,MAAM,CAAC,QAAQ,CAAC,WAAW,iBAAgB;IAE3C,MAAM,CAAC,SAAS;;;;;;;;4DAVlB;;;;WAIG;;;;;;;OAM2B;IAC5B,MAAM,CAAC,YAAY;;;;;;;;4DAXrB;;;;WAIG;;;;;;;SAOiC;IAClC,MAAM,CAAC,YAAY;;;;;;;;;MAWlB;IAED,iBAAiB;IAKjB,kBAAkB;IAKlB,IAAI,WAAW,0DAEd;IAED,IAAI,KAAK,gDAIR;IAED,MAAM;CAyCP;AAED,eAAe,WAAW,CAAA;AAC1B,OAAO,EAAE,WAAW,EAAE,CAAA"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import type { Spacing, WithStyleProps } from '@instructure/emotion';
|
|
3
|
+
import type { AsElementType, PropValidators } from '@instructure/shared-types';
|
|
4
|
+
declare type CloseButtonOwnProps = {
|
|
5
|
+
screenReaderLabel: string | React.ReactNode;
|
|
6
|
+
color?: 'primary' | 'primary-inverse';
|
|
7
|
+
interaction?: 'enabled' | 'disabled' | 'readonly';
|
|
8
|
+
elementRef?: (...args: any[]) => any;
|
|
9
|
+
size?: 'small' | 'medium' | 'large';
|
|
10
|
+
onClick?: (...args: any[]) => any;
|
|
11
|
+
margin?: Spacing;
|
|
12
|
+
placement?: 'start' | 'end' | 'static';
|
|
13
|
+
offset?: 'none' | 'x-small' | 'small' | 'medium';
|
|
14
|
+
type?: 'button' | 'submit' | 'reset';
|
|
15
|
+
as?: AsElementType;
|
|
16
|
+
href?: string;
|
|
17
|
+
cursor?: string;
|
|
18
|
+
tabIndex?: number | string;
|
|
19
|
+
};
|
|
20
|
+
declare type PropKeys = keyof CloseButtonOwnProps;
|
|
21
|
+
declare type AllowedPropKeys = Readonly<Array<PropKeys>>;
|
|
22
|
+
declare type CloseButtonProps = CloseButtonOwnProps & WithStyleProps;
|
|
23
|
+
declare const propTypes: PropValidators<PropKeys>;
|
|
24
|
+
declare const allowedProps: AllowedPropKeys;
|
|
25
|
+
export type { CloseButtonProps };
|
|
26
|
+
export { propTypes, allowedProps };
|
|
27
|
+
//# sourceMappingURL=props.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/CloseButton/props.ts"],"names":[],"mappings":";AA2BA,OAAO,KAAK,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AACnE,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAE9E,aAAK,mBAAmB,GAAG;IACzB,iBAAiB,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAA;IAC3C,KAAK,CAAC,EAAE,SAAS,GAAG,iBAAiB,CAAA;IACrC,WAAW,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,UAAU,CAAA;IACjD,UAAU,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACpC,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;IACnC,OAAO,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACjC,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,SAAS,CAAC,EAAE,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAA;IACtC,MAAM,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,OAAO,GAAG,QAAQ,CAAA;IAChD,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAA;IACpC,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CAC3B,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,mBAAmB,CAAA;AAEzC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,gBAAgB,GAAG,mBAAmB,GAAG,cAAc,CAAA;AAE5D,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CA+DvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAenB,CAAA;AAED,YAAY,EAAE,gBAAgB,EAAE,CAAA;AAChC,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import { Component } from 'react';
|
|
2
|
-
import
|
|
3
|
-
import { CondensedButtonProps } from './types';
|
|
1
|
+
import React, { Component } from 'react';
|
|
2
|
+
import type { CondensedButtonProps } from './props';
|
|
4
3
|
/**
|
|
5
4
|
---
|
|
6
5
|
category: components
|
|
@@ -8,67 +7,41 @@ category: components
|
|
|
8
7
|
**/
|
|
9
8
|
declare class CondensedButton extends Component<CondensedButtonProps> {
|
|
10
9
|
static readonly componentId = "CondensedButton";
|
|
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
|
-
* Specifies the color for the `CondensedButton`.
|
|
38
|
-
*/
|
|
39
|
-
color: PropTypes.Requireable<string>;
|
|
40
|
-
/**
|
|
41
|
-
* Valid values are `0`, `none`, `auto`, `xxx-small`, `xx-small`, `x-small`,
|
|
42
|
-
* `small`, `medium`, `large`, `x-large`, `xx-large`. Apply these values via
|
|
43
|
-
* familiar CSS-like shorthand. For example: `margin="small auto large"`.
|
|
44
|
-
*/
|
|
45
|
-
margin: (props: any, propName: any, componentName: any, location: any) => any;
|
|
46
|
-
/**
|
|
47
|
-
* Specify a mouse cursor to use when hovering over the button.
|
|
48
|
-
* The `pointer` cursor is used by default.
|
|
49
|
-
*/
|
|
50
|
-
cursor: PropTypes.Requireable<string>;
|
|
51
|
-
/**
|
|
52
|
-
* Specifies an href attribute for the `CondensedButton`'s underlying html element.
|
|
53
|
-
*/
|
|
54
|
-
href: PropTypes.Requireable<string>;
|
|
55
|
-
/**
|
|
56
|
-
* An icon, or function that returns an icon.
|
|
57
|
-
*/
|
|
58
|
-
renderIcon: PropTypes.Requireable<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
|
|
59
|
-
};
|
|
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" | undefined;
|
|
18
|
+
margin?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
|
|
19
|
+
cursor?: string | undefined;
|
|
20
|
+
href?: string | undefined;
|
|
21
|
+
renderIcon?: React.ReactNode | ((...args: any[]) => any);
|
|
22
|
+
}>;
|
|
23
|
+
static allowedProps: readonly (keyof {
|
|
24
|
+
children?: React.ReactNode;
|
|
25
|
+
type?: "button" | "submit" | "reset" | undefined;
|
|
26
|
+
size?: "small" | "medium" | "large" | undefined;
|
|
27
|
+
elementRef?: ((...args: any[]) => any) | undefined;
|
|
28
|
+
as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
|
|
29
|
+
interaction?: "enabled" | "disabled" | "readonly" | undefined;
|
|
30
|
+
color?: "primary" | "primary-inverse" | undefined;
|
|
31
|
+
margin?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
|
|
32
|
+
cursor?: string | undefined;
|
|
33
|
+
href?: string | undefined;
|
|
34
|
+
renderIcon?: React.ReactNode | ((...args: any[]) => any);
|
|
35
|
+
})[];
|
|
60
36
|
static defaultProps: {
|
|
61
37
|
children: null;
|
|
62
38
|
type: string;
|
|
63
39
|
size: string;
|
|
64
40
|
elementRef: (el: any) => void;
|
|
65
41
|
as: string;
|
|
66
|
-
interaction: undefined;
|
|
67
42
|
color: string;
|
|
68
43
|
margin: string;
|
|
69
44
|
cursor: string;
|
|
70
|
-
href: undefined;
|
|
71
|
-
renderIcon: undefined;
|
|
72
45
|
};
|
|
73
46
|
_baseButton: null;
|
|
74
47
|
get focused(): null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/CondensedButton/index.tsx"],"names":[],"mappings":"AAwBA,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/CondensedButton/index.tsx"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAWxC,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAEnD;;;;GAIG;AAEH,cAEM,eAAgB,SAAQ,SAAS,CAAC,oBAAoB,CAAC;IAC3D,MAAM,CAAC,QAAQ,CAAC,WAAW,qBAAoB;IAE/C,MAAM,CAAC,SAAS;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;;;;;MAWlB;IAED,WAAW,OAAO;IAElB,IAAI,OAAO,SAGV;IAED,KAAK;IAKL,MAAM;CA+CP;AAED,eAAe,eAAe,CAAA;AAC9B,OAAO,EAAE,eAAe,EAAE,CAAA"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { Spacing } from '@instructure/emotion';
|
|
3
|
+
import type { AsElementType, PropValidators } from '@instructure/shared-types';
|
|
4
|
+
declare type CondensedButtonOwnProps = {
|
|
5
|
+
children?: React.ReactNode;
|
|
6
|
+
type?: 'button' | 'submit' | 'reset';
|
|
7
|
+
size?: 'small' | 'medium' | 'large';
|
|
8
|
+
elementRef?: (...args: any[]) => any;
|
|
9
|
+
as?: AsElementType;
|
|
10
|
+
interaction?: 'enabled' | 'disabled' | 'readonly';
|
|
11
|
+
color?: 'primary' | 'primary-inverse';
|
|
12
|
+
margin?: Spacing;
|
|
13
|
+
cursor?: string;
|
|
14
|
+
href?: string;
|
|
15
|
+
renderIcon?: React.ReactNode | ((...args: any[]) => any);
|
|
16
|
+
};
|
|
17
|
+
declare type PropKeys = keyof CondensedButtonOwnProps;
|
|
18
|
+
declare type AllowedPropKeys = Readonly<Array<PropKeys>>;
|
|
19
|
+
declare type CondensedButtonProps = CondensedButtonOwnProps;
|
|
20
|
+
declare const propTypes: PropValidators<PropKeys>;
|
|
21
|
+
declare const allowedProps: AllowedPropKeys;
|
|
22
|
+
export type { CondensedButtonProps };
|
|
23
|
+
export { propTypes, allowedProps };
|
|
24
|
+
//# sourceMappingURL=props.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/CondensedButton/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,uBAAuB,GAAG;IAC7B,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,CAAA;IACrC,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,uBAAuB,CAAA;AAE7C,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,oBAAoB,GAAG,uBAAuB,CAAA;AAEnD,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAgDvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAYnB,CAAA;AAED,YAAY,EAAE,oBAAoB,EAAE,CAAA;AACpC,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import { Component } from 'react';
|
|
2
|
-
import
|
|
3
|
-
import { IconButtonProps } from './types';
|
|
1
|
+
import React, { Component } from 'react';
|
|
2
|
+
import type { IconButtonProps } from './props';
|
|
4
3
|
/**
|
|
5
4
|
---
|
|
6
5
|
category: components
|
|
@@ -8,91 +7,54 @@ category: components
|
|
|
8
7
|
**/
|
|
9
8
|
declare class IconButton extends Component<IconButtonProps> {
|
|
10
9
|
static readonly componentId = "IconButton";
|
|
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
|
-
elementRef
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
color: PropTypes.Requireable<string>;
|
|
48
|
-
/**
|
|
49
|
-
* Override the `Button`'s default focus outline color.
|
|
50
|
-
*/
|
|
51
|
-
focusColor: PropTypes.Requireable<string>;
|
|
52
|
-
/**
|
|
53
|
-
* Specifies if the `IconButton` shape should be a circle or rectangle.
|
|
54
|
-
*/
|
|
55
|
-
shape: PropTypes.Requireable<string>;
|
|
56
|
-
/**
|
|
57
|
-
* Specifies if the `IconButton` should render with a solid background. When false, the background is transparent.
|
|
58
|
-
*/
|
|
59
|
-
withBackground: PropTypes.Requireable<boolean>;
|
|
60
|
-
/**
|
|
61
|
-
* Specifies if the `IconButton` should render with a border.
|
|
62
|
-
*/
|
|
63
|
-
withBorder: PropTypes.Requireable<boolean>;
|
|
64
|
-
/**
|
|
65
|
-
* Valid values are `0`, `none`, `auto`, `xxx-small`, `xx-small`, `x-small`,
|
|
66
|
-
* `small`, `medium`, `large`, `x-large`, `xx-large`. Apply these values via
|
|
67
|
-
* familiar CSS-like shorthand. For example: `margin="small auto large"`.
|
|
68
|
-
*/
|
|
69
|
-
margin: (props: any, propName: any, componentName: any, location: any) => any;
|
|
70
|
-
/**
|
|
71
|
-
* Specify a mouse cursor to use when hovering over the button.
|
|
72
|
-
* The `pointer` cursor is used by default.
|
|
73
|
-
*/
|
|
74
|
-
cursor: PropTypes.Requireable<string>;
|
|
75
|
-
/**
|
|
76
|
-
* Specifies an href attribute for the `IconButton`'s underlying html element.
|
|
77
|
-
*/
|
|
78
|
-
href: PropTypes.Requireable<string>;
|
|
79
|
-
};
|
|
10
|
+
static propTypes: import("@instructure/shared-types/types/UtilityTypes").PropValidators<keyof {
|
|
11
|
+
children?: React.ReactNode | ((...args: any[]) => React.ReactNode);
|
|
12
|
+
renderIcon?: React.ReactNode | ((...args: any[]) => any);
|
|
13
|
+
screenReaderLabel: string;
|
|
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?: "enabled" | "disabled" | "readonly" | undefined;
|
|
19
|
+
color?: "primary" | "primary-inverse" | "secondary" | "success" | "danger" | undefined;
|
|
20
|
+
focusColor?: "info" | "inverse" | undefined;
|
|
21
|
+
shape?: "circle" | "rectangle" | undefined;
|
|
22
|
+
withBackground?: boolean | undefined;
|
|
23
|
+
withBorder?: boolean | undefined;
|
|
24
|
+
margin?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
|
|
25
|
+
cursor?: string | undefined;
|
|
26
|
+
href?: string | undefined;
|
|
27
|
+
}>;
|
|
28
|
+
static allowedProps: readonly (keyof {
|
|
29
|
+
children?: React.ReactNode | ((...args: any[]) => React.ReactNode);
|
|
30
|
+
renderIcon?: React.ReactNode | ((...args: any[]) => any);
|
|
31
|
+
screenReaderLabel: string;
|
|
32
|
+
type?: "button" | "submit" | "reset" | undefined;
|
|
33
|
+
size?: "small" | "medium" | "large" | undefined;
|
|
34
|
+
elementRef?: ((...args: any[]) => any) | undefined;
|
|
35
|
+
as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
|
|
36
|
+
interaction?: "enabled" | "disabled" | "readonly" | undefined;
|
|
37
|
+
color?: "primary" | "primary-inverse" | "secondary" | "success" | "danger" | undefined;
|
|
38
|
+
focusColor?: "info" | "inverse" | undefined;
|
|
39
|
+
shape?: "circle" | "rectangle" | undefined;
|
|
40
|
+
withBackground?: boolean | undefined;
|
|
41
|
+
withBorder?: boolean | undefined;
|
|
42
|
+
margin?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
|
|
43
|
+
cursor?: string | undefined;
|
|
44
|
+
href?: string | undefined;
|
|
45
|
+
})[];
|
|
80
46
|
static defaultProps: {
|
|
81
47
|
children: null;
|
|
82
|
-
renderIcon: undefined;
|
|
83
48
|
type: string;
|
|
84
49
|
size: string;
|
|
85
50
|
elementRef: (el: any) => void;
|
|
86
51
|
as: string;
|
|
87
|
-
interaction: undefined;
|
|
88
52
|
color: string;
|
|
89
|
-
focusColor: undefined;
|
|
90
53
|
shape: string;
|
|
91
54
|
withBackground: boolean;
|
|
92
55
|
withBorder: boolean;
|
|
93
56
|
margin: string;
|
|
94
57
|
cursor: string;
|
|
95
|
-
href: undefined;
|
|
96
58
|
};
|
|
97
59
|
_baseButton: null;
|
|
98
60
|
get focused(): null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/IconButton/index.tsx"],"names":[],"mappings":"AAwBA,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/IconButton/index.tsx"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAYxC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAE9C;;;;GAIG;AAGH,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;;;;;;;;;;;;MAclB;IAED,WAAW,OAAO;IAElB,IAAI,OAAO,SAGV;IAED,KAAK;IAKL,MAAM;CAqDP;AAED,eAAe,UAAU,CAAA;AACzB,OAAO,EAAE,UAAU,EAAE,CAAA"}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { AsElementType } from '@instructure/shared-types';
|
|
3
2
|
import type { Spacing } from '@instructure/emotion';
|
|
4
|
-
|
|
3
|
+
import type { AsElementType, PropValidators } from '@instructure/shared-types';
|
|
4
|
+
declare type IconButtonOwnProps = {
|
|
5
|
+
children?: React.ReactNode | ((...args: any[]) => React.ReactNode);
|
|
5
6
|
renderIcon?: React.ReactNode | ((...args: any[]) => any);
|
|
6
7
|
screenReaderLabel: string;
|
|
7
8
|
type?: 'button' | 'submit' | 'reset';
|
|
@@ -18,4 +19,11 @@ export declare type IconButtonProps = {
|
|
|
18
19
|
cursor?: string;
|
|
19
20
|
href?: string;
|
|
20
21
|
};
|
|
21
|
-
|
|
22
|
+
declare type PropKeys = keyof IconButtonOwnProps;
|
|
23
|
+
declare type AllowedPropKeys = Readonly<Array<PropKeys>>;
|
|
24
|
+
declare type IconButtonProps = IconButtonOwnProps;
|
|
25
|
+
declare const propTypes: PropValidators<PropKeys>;
|
|
26
|
+
declare const allowedProps: AllowedPropKeys;
|
|
27
|
+
export type { IconButtonProps };
|
|
28
|
+
export { propTypes, allowedProps };
|
|
29
|
+
//# sourceMappingURL=props.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/IconButton/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,kBAAkB,GAAG;IACxB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,KAAK,CAAC,SAAS,CAAC,CAAA;IAClE,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAC,CAAA;IACxD,iBAAiB,EAAE,MAAM,CAAA;IACzB,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,KAAK,CAAC,EAAE,WAAW,GAAG,QAAQ,CAAA;IAC9B,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,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,CAAA;AAEzC,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CA0EvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAiBnB,CAAA;AAED,YAAY,EAAE,eAAe,EAAE,CAAA;AAC/B,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import { Component } from 'react';
|
|
2
|
-
import
|
|
3
|
-
import { ToggleButtonProps } from './types';
|
|
1
|
+
import React, { Component } from 'react';
|
|
2
|
+
import type { ToggleButtonProps } from './props';
|
|
4
3
|
/**
|
|
5
4
|
---
|
|
6
5
|
category: components
|
|
@@ -8,76 +7,46 @@ category: components
|
|
|
8
7
|
**/
|
|
9
8
|
declare class ToggleButton extends Component<ToggleButtonProps> {
|
|
10
9
|
static readonly componentId = "ToggleButton";
|
|
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
|
-
elementRef: PropTypes.Requireable<(...args: any[]) => any>;
|
|
44
|
-
/**
|
|
45
|
-
* Callback fired when the `ToggleButton` is clicked
|
|
46
|
-
*/
|
|
47
|
-
onClick: PropTypes.Requireable<(...args: any[]) => any>;
|
|
48
|
-
/**
|
|
49
|
-
* The color in which to display the icon
|
|
50
|
-
*/
|
|
51
|
-
color: PropTypes.Requireable<string>;
|
|
52
|
-
/**
|
|
53
|
-
* By default, the tooltip will show on hover/focus. Use this prop if you need to override that behavior.
|
|
54
|
-
*/
|
|
55
|
-
isShowingTooltip: PropTypes.Requireable<boolean>;
|
|
56
|
-
/**
|
|
57
|
-
* An element or a function returning an element to use as the mount node
|
|
58
|
-
*/
|
|
59
|
-
mountNode: PropTypes.Requireable<PropTypes.ReactElementLike | Element | ((...args: any[]) => any)>;
|
|
60
|
-
/**
|
|
61
|
-
* The placement of the tooltip in relation to the button
|
|
62
|
-
*/
|
|
63
|
-
placement: PropTypes.Requireable<string>;
|
|
64
|
-
/**
|
|
65
|
-
* The parent in which to constrain the tooltip.
|
|
66
|
-
* One of: 'window', 'scroll-parent', 'parent', 'none', an element,
|
|
67
|
-
* or a function returning an element.
|
|
68
|
-
*/
|
|
69
|
-
constrain: PropTypes.Requireable<string | PropTypes.ReactElementLike | Element | ((...args: any[]) => any)>;
|
|
70
|
-
};
|
|
10
|
+
static propTypes: import("@instructure/shared-types/types/UtilityTypes").PropValidators<keyof {
|
|
11
|
+
screenReaderLabel: string;
|
|
12
|
+
renderTooltipContent: React.ReactNode | ((...args: any[]) => any);
|
|
13
|
+
renderIcon: React.ReactNode | ((...args: any[]) => any);
|
|
14
|
+
status: "pressed" | "unpressed";
|
|
15
|
+
as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
|
|
16
|
+
interaction?: "enabled" | "disabled" | "readonly" | undefined;
|
|
17
|
+
size?: "small" | "medium" | "large" | undefined;
|
|
18
|
+
elementRef?: ((...args: any[]) => any) | undefined;
|
|
19
|
+
onClick?: ((...args: any[]) => any) | undefined;
|
|
20
|
+
color?: string | undefined;
|
|
21
|
+
isShowingTooltip?: boolean | undefined;
|
|
22
|
+
mountNode?: import("@instructure/ui-position").PositionMountNode | undefined;
|
|
23
|
+
placement?: import("@instructure/ui-position").PlacementPropValues | undefined;
|
|
24
|
+
constrain?: import("@instructure/ui-position").PositionConstraint | undefined;
|
|
25
|
+
}>;
|
|
26
|
+
static allowedProps: readonly (keyof {
|
|
27
|
+
screenReaderLabel: string;
|
|
28
|
+
renderTooltipContent: React.ReactNode | ((...args: any[]) => any);
|
|
29
|
+
renderIcon: React.ReactNode | ((...args: any[]) => any);
|
|
30
|
+
status: "pressed" | "unpressed";
|
|
31
|
+
as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
|
|
32
|
+
interaction?: "enabled" | "disabled" | "readonly" | undefined;
|
|
33
|
+
size?: "small" | "medium" | "large" | undefined;
|
|
34
|
+
elementRef?: ((...args: any[]) => any) | undefined;
|
|
35
|
+
onClick?: ((...args: any[]) => any) | undefined;
|
|
36
|
+
color?: string | undefined;
|
|
37
|
+
isShowingTooltip?: boolean | undefined;
|
|
38
|
+
mountNode?: import("@instructure/ui-position").PositionMountNode | undefined;
|
|
39
|
+
placement?: import("@instructure/ui-position").PlacementPropValues | undefined;
|
|
40
|
+
constrain?: import("@instructure/ui-position").PositionConstraint | undefined;
|
|
41
|
+
})[];
|
|
71
42
|
static defaultProps: {
|
|
72
43
|
size: string;
|
|
73
44
|
as: string;
|
|
74
|
-
interaction: undefined;
|
|
75
45
|
elementRef: (el: any) => void;
|
|
76
46
|
renderIcon: () => void;
|
|
77
47
|
onClick: () => void;
|
|
78
48
|
mountNode: null;
|
|
79
49
|
color: string;
|
|
80
|
-
isShowingTooltip: undefined;
|
|
81
50
|
placement: string;
|
|
82
51
|
constrain: string;
|
|
83
52
|
};
|