datocms-react-ui 0.3.9 → 0.3.10
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/dist/cjs/Button/index.js +65 -4
- package/dist/cjs/Button/index.js.map +1 -1
- package/dist/cjs/Button/styles.module.css.json +1 -1
- package/dist/cjs/Canvas/index.js +487 -7
- package/dist/cjs/Canvas/index.js.map +1 -1
- package/dist/cjs/Canvas/styles.module.css.json +1 -1
- package/dist/cjs/ContextInspector/styles.module.css.json +1 -1
- package/dist/cjs/Form/index.js +72 -0
- package/dist/cjs/Form/index.js.map +1 -1
- package/dist/cjs/Section/index.js +47 -0
- package/dist/cjs/Section/index.js.map +1 -1
- package/dist/cjs/Section/styles.module.css.json +1 -1
- package/dist/cjs/SelectInput/index.js +4 -2
- package/dist/cjs/SelectInput/index.js.map +1 -1
- package/dist/cjs/SwitchInput/index.js +1 -1
- package/dist/cjs/SwitchInput/index.js.map +1 -1
- package/dist/cjs/TextInput/styles.module.css.json +1 -1
- package/dist/esm/Button/index.d.ts +62 -1
- package/dist/esm/Button/index.js +65 -4
- package/dist/esm/Button/index.js.map +1 -1
- package/dist/esm/Button/styles.module.css.json +1 -1
- package/dist/esm/Canvas/index.d.ts +479 -1
- package/dist/esm/Canvas/index.js +487 -7
- package/dist/esm/Canvas/index.js.map +1 -1
- package/dist/esm/Canvas/styles.module.css.json +1 -1
- package/dist/esm/ContextInspector/styles.module.css.json +1 -1
- package/dist/esm/Form/index.d.ts +72 -0
- package/dist/esm/Form/index.js +72 -0
- package/dist/esm/Form/index.js.map +1 -1
- package/dist/esm/Section/index.d.ts +47 -0
- package/dist/esm/Section/index.js +47 -0
- package/dist/esm/Section/index.js.map +1 -1
- package/dist/esm/Section/styles.module.css.json +1 -1
- package/dist/esm/SelectInput/index.js +4 -2
- package/dist/esm/SelectInput/index.js.map +1 -1
- package/dist/esm/SwitchInput/index.d.ts +1 -1
- package/dist/esm/SwitchInput/index.js +1 -1
- package/dist/esm/SwitchInput/index.js.map +1 -1
- package/dist/esm/TextInput/styles.module.css.json +1 -1
- package/dist/types/Button/index.d.ts +62 -1
- package/dist/types/Canvas/index.d.ts +479 -1
- package/dist/types/Form/index.d.ts +72 -0
- package/dist/types/Section/index.d.ts +47 -0
- package/dist/types/SwitchInput/index.d.ts +1 -1
- package/package.json +3 -11
- package/styles.css +1 -1
- package/types.json +99 -35
|
@@ -12,5 +12,52 @@ declare type SectionProps = {
|
|
|
12
12
|
headerStyle?: CSSProperties;
|
|
13
13
|
titleStyle?: CSSProperties;
|
|
14
14
|
};
|
|
15
|
+
/**
|
|
16
|
+
* @example Basic usage
|
|
17
|
+
*
|
|
18
|
+
* ```jsx
|
|
19
|
+
* <Canvas ctx={ctx}>
|
|
20
|
+
* <Section title="Section title">
|
|
21
|
+
* Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
|
|
22
|
+
* eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
|
|
23
|
+
* ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
|
|
24
|
+
* aliquip ex ea commodo consequat.
|
|
25
|
+
* </Section>
|
|
26
|
+
* </Canvas>;
|
|
27
|
+
* ```
|
|
28
|
+
*
|
|
29
|
+
* @example Highlighted
|
|
30
|
+
*
|
|
31
|
+
* ```jsx
|
|
32
|
+
* <Canvas ctx={ctx}>
|
|
33
|
+
* <Section title="Section title" highlighted>
|
|
34
|
+
* Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
|
|
35
|
+
* eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
|
|
36
|
+
* ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
|
|
37
|
+
* aliquip ex ea commodo consequat.
|
|
38
|
+
* </Section>
|
|
39
|
+
* </Canvas>;
|
|
40
|
+
* ```
|
|
41
|
+
*
|
|
42
|
+
* @example Collapsible
|
|
43
|
+
*
|
|
44
|
+
* ```jsx
|
|
45
|
+
* <Canvas ctx={ctx}>
|
|
46
|
+
* <StateManager initial={true}>
|
|
47
|
+
* {(isOpen, setOpen) => (
|
|
48
|
+
* <Section
|
|
49
|
+
* title="Section title"
|
|
50
|
+
* collapsible={{ isOpen, onToggle: () => setOpen((v) => !v) }}
|
|
51
|
+
* >
|
|
52
|
+
* Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
|
|
53
|
+
* eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
|
|
54
|
+
* enim ad minim veniam, quis nostrud exercitation ullamco laboris
|
|
55
|
+
* nisi ut aliquip ex ea commodo consequat.
|
|
56
|
+
* </Section>
|
|
57
|
+
* )}
|
|
58
|
+
* </StateManager>
|
|
59
|
+
* </Canvas>;
|
|
60
|
+
* ```
|
|
61
|
+
*/
|
|
15
62
|
export declare function Section({ title, children, highlighted, collapsible, headerClassName, titleClassName, headerStyle, titleStyle, }: SectionProps): JSX.Element;
|
|
16
63
|
export {};
|
|
@@ -1,6 +1,53 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import cn from 'classnames';
|
|
3
3
|
import s from './styles.module.css.json';
|
|
4
|
+
/**
|
|
5
|
+
* @example Basic usage
|
|
6
|
+
*
|
|
7
|
+
* ```jsx
|
|
8
|
+
* <Canvas ctx={ctx}>
|
|
9
|
+
* <Section title="Section title">
|
|
10
|
+
* Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
|
|
11
|
+
* eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
|
|
12
|
+
* ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
|
|
13
|
+
* aliquip ex ea commodo consequat.
|
|
14
|
+
* </Section>
|
|
15
|
+
* </Canvas>;
|
|
16
|
+
* ```
|
|
17
|
+
*
|
|
18
|
+
* @example Highlighted
|
|
19
|
+
*
|
|
20
|
+
* ```jsx
|
|
21
|
+
* <Canvas ctx={ctx}>
|
|
22
|
+
* <Section title="Section title" highlighted>
|
|
23
|
+
* Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
|
|
24
|
+
* eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
|
|
25
|
+
* ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
|
|
26
|
+
* aliquip ex ea commodo consequat.
|
|
27
|
+
* </Section>
|
|
28
|
+
* </Canvas>;
|
|
29
|
+
* ```
|
|
30
|
+
*
|
|
31
|
+
* @example Collapsible
|
|
32
|
+
*
|
|
33
|
+
* ```jsx
|
|
34
|
+
* <Canvas ctx={ctx}>
|
|
35
|
+
* <StateManager initial={true}>
|
|
36
|
+
* {(isOpen, setOpen) => (
|
|
37
|
+
* <Section
|
|
38
|
+
* title="Section title"
|
|
39
|
+
* collapsible={{ isOpen, onToggle: () => setOpen((v) => !v) }}
|
|
40
|
+
* >
|
|
41
|
+
* Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
|
|
42
|
+
* eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
|
|
43
|
+
* enim ad minim veniam, quis nostrud exercitation ullamco laboris
|
|
44
|
+
* nisi ut aliquip ex ea commodo consequat.
|
|
45
|
+
* </Section>
|
|
46
|
+
* )}
|
|
47
|
+
* </StateManager>
|
|
48
|
+
* </Canvas>;
|
|
49
|
+
* ```
|
|
50
|
+
*/
|
|
4
51
|
export function Section(_a) {
|
|
5
52
|
var _b, _c;
|
|
6
53
|
var title = _a.title, children = _a.children, highlighted = _a.highlighted, collapsible = _a.collapsible, headerClassName = _a.headerClassName, titleClassName = _a.titleClassName, headerStyle = _a.headerStyle, titleStyle = _a.titleStyle;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/Section/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmC,MAAM,OAAO,CAAC;AACxD,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,CAAC,MAAM,0BAA0B,CAAC;AAazC,MAAM,UAAU,OAAO,CAAC,EAST;;QARb,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,WAAW,iBAAA,EACX,WAAW,iBAAA,EACX,eAAe,qBAAA,EACf,cAAc,oBAAA,EACd,WAAW,iBAAA,EACX,UAAU,gBAAA;IAEV,OAAO,CACL,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/Section/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmC,MAAM,OAAO,CAAC;AACxD,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,CAAC,MAAM,0BAA0B,CAAC;AAazC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8CG;AACH,MAAM,UAAU,OAAO,CAAC,EAST;;QARb,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,WAAW,iBAAA,EACX,WAAW,iBAAA,EACX,eAAe,qBAAA,EACf,cAAc,oBAAA,EACd,WAAW,iBAAA,EACX,UAAU,gBAAA;IAEV,OAAO,CACL,6BACE,SAAS,EAAE,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,YAAI,GAAC,CAAC,CAAC,sBAAsB,CAAC,IAAG,WAAW,MAAG;QAEzE,6BACE,SAAS,EAAE,EAAE,CAAC,CAAC,CAAC,iBAAiB,CAAC,EAAE,eAAe,CAAC,EACpD,KAAK,EAAE,WAAW;YAElB,6BACE,SAAS,EAAE,EAAE,CACX,CAAC,CAAC,gBAAgB,CAAC,EAEnB,cAAc,CACf,EACD,KAAK,EAAE,UAAU;gBAEhB,WAAW,IAAI,CACd,gCACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,EAAE,CAAC,CAAC,CAAC,gBAAgB,CAAC;wBAC/B,GAAC,CAAC,CAAC,yBAAyB,CAAC,IAAG,WAAW,CAAC,MAAM;4BAClD,EACF,OAAO,EAAE,WAAW,CAAC,QAAQ,GAC7B,CACH;gBACD,6BAAK,SAAS,EAAE,CAAC,CAAC,yBAAyB,CAAC,IAAG,KAAK,CAAO,CACvD,CACF;QACL,CAAC,CAAC,WAAW,IAAI,WAAW,CAAC,MAAM,CAAC,IAAI,QAAQ,CAC7C,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{ "Section": "
|
|
1
|
+
{ "Section": "_Section_zh95u_1", "Section--highlighted": "_Section--highlighted_zh95u_5", "pageContentSectionHighligh": "_pageContentSectionHighligh_zh95u_1", "Section__header": "_Section__header_zh95u_19", "Section__title": "_Section__title_zh95u_38", "Section__title__content": "_Section__title__content_zh95u_52", "Section__arrow": "_Section__arrow_zh95u_55", "Section__arrow--is-open": "_Section__arrow--is-open_zh95u_82" }
|
|
@@ -47,13 +47,15 @@ var useStyles = function (isDisabled, error) {
|
|
|
47
47
|
result = __assign(__assign({}, result), { minHeight: 40 });
|
|
48
48
|
if (isFocused) {
|
|
49
49
|
return __assign(__assign({}, result), { borderColor: error ? 'var(--alert-color)' : 'var(--accent-color)', backgroundColor: isDisabled ? 'var(--disabled-color)' : 'white', boxShadow: "0 0 0 3px " + (error
|
|
50
|
-
? 'rgba(var(--alert-rgb-components), 0.2)'
|
|
50
|
+
? 'rgba(var(--alert-color-rgb-components), 0.2)'
|
|
51
51
|
: 'var(--semi-transparent-accent-color)'), '&:hover': {
|
|
52
52
|
borderColor: error ? 'var(--alert-color)' : 'var(--accent-color)',
|
|
53
53
|
} });
|
|
54
54
|
}
|
|
55
55
|
return __assign(__assign({}, result), { borderColor: error ? 'var(--alert-color)' : 'var(--border-color)', backgroundColor: isDisabled ? 'var(--disabled-color)' : 'white', '&:hover': {
|
|
56
|
-
borderColor: error
|
|
56
|
+
borderColor: error
|
|
57
|
+
? 'var(--alert-color)'
|
|
58
|
+
: 'var(--darker-border-color)',
|
|
57
59
|
} });
|
|
58
60
|
},
|
|
59
61
|
multiValueRemove: function (provided) { return (__assign(__assign({}, provided), { cursor: 'pointer' })); },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/SelectInput/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,SAKN,MAAM,cAAc,CAAC;AACtB,OAAO,cAA8B,MAAM,oBAAoB,CAAC;AAChE,OAAO,uBAEN,MAAM,8BAA8B,CAAC;AACtC,OAAO,kBAAsC,MAAM,wBAAwB,CAAC;AAE5E,IAAM,WAAW,GAAgB,UAAC,QAAQ,IAAK,OAAA,uBAC1C,QAAQ,KACX,YAAY,EAAE,CAAC,EACf,MAAM,wBACD,QAAQ,CAAC,MAAM,KAClB,SAAS,EAAE,sCAAsC;QACjD,WAAW;QACX,SAAS,EAAE,qBAAqB;QAChC,SAAS;QACT,SAAS,EAAE,qBAAqB;QAChC,UAAU;QACV,OAAO,EAAE,qBAAqB;QAC9B,QAAQ;QACR,SAAS,EAAE,4BAA4B,OAEzC,EAf6C,CAe7C,CAAC;AAEH,IAAM,SAAS,GAAG,UAAC,UAAoB,EAAE,KAAe;IACtD,OAAO,OAAO,CAAe;QAC3B,OAAO;YACL,WAAW,EAAE,UAAC,QAAQ,IAAK,OAAA,uBACtB,QAAQ,KACX,KAAK,EAAE,+BAA+B,IACtC,EAHyB,CAGzB;YACF,SAAS,EAAE,UAAC,QAAQ;gBAClB,6BACK,QAAQ,KACX,QAAQ,EAAE,SAAS,IACnB;YACJ,CAAC;YAED,OAAO,EAAE,UAAC,QAAQ,EAAE,EAAa;oBAAX,SAAS,eAAA;gBAC7B,IAAI,MAAM,GAAG,QAAQ,CAAC;gBAEtB,MAAM,yBACD,MAAM,KACT,SAAS,EAAE,EAAE,GACd,CAAC;gBAEF,IAAI,SAAS,EAAE;oBACb,6BACK,MAAM,KACT,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,qBAAqB,EACjE,eAAe,EAAE,UAAU,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,OAAO,EAC/D,SAAS,EAAE,gBACT,KAAK;4BACH,CAAC,CAAC,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/SelectInput/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -3,7 +3,7 @@ export declare type SwitchInputChangeEventHandler = (newValue: boolean, event: R
|
|
|
3
3
|
export interface SwitchInputProps extends Omit<React.HTMLAttributes<HTMLButtonElement>, 'onChange'> {
|
|
4
4
|
name: string;
|
|
5
5
|
disabled?: boolean;
|
|
6
|
-
onChange
|
|
6
|
+
onChange?: SwitchInputChangeEventHandler;
|
|
7
7
|
onKeyDown?: React.KeyboardEventHandler<HTMLButtonElement>;
|
|
8
8
|
value: boolean;
|
|
9
9
|
}
|
|
@@ -27,7 +27,7 @@ export function SwitchInput(_a) {
|
|
|
27
27
|
var _b;
|
|
28
28
|
var className = _a.className, value = _a.value, disabled = _a.disabled, onClick = _a.onClick, onChange = _a.onChange, onKeyDown = _a.onKeyDown, restProps = __rest(_a, ["className", "value", "disabled", "onClick", "onChange", "onKeyDown"]);
|
|
29
29
|
function triggerChange(newValue, event) {
|
|
30
|
-
if (!disabled) {
|
|
30
|
+
if (!disabled && onChange) {
|
|
31
31
|
onChange(newValue, event);
|
|
32
32
|
}
|
|
33
33
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/SwitchInput/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,CAAC,MAAM,0BAA0B,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/SwitchInput/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,CAAC,MAAM,0BAA0B,CAAC;AAkBzC,MAAM,UAAU,WAAW,CAAC,EAQT;;IAPjB,IAAA,SAAS,eAAA,EACT,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,OAAO,aAAA,EACP,QAAQ,cAAA,EACR,SAAS,eAAA,EACN,SAAS,cAPc,sEAQ3B,CADa;IAEZ,SAAS,aAAa,CACpB,QAAiB,EACjB,KAE0C;QAE1C,IAAI,CAAC,QAAQ,IAAI,QAAQ,EAAE;YACzB,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;SAC3B;IACH,CAAC;IAED,SAAS,iBAAiB,CAAC,CAAyC;QAClE,IAAI,CAAC,CAAC,GAAG,KAAK,WAAW,EAAE;YACzB,aAAa,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;SACzB;aAAM,IAAI,CAAC,CAAC,GAAG,KAAK,YAAY,EAAE;YACjC,aAAa,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC;SACxB;QACD,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAG,CAAC,CAAC,CAAC;IACjB,CAAC;IAED,SAAS,eAAe,CAAC,CAAsC;QAC7D,aAAa,CAAC,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;QACzB,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,CAAC,CAAC,CAAC;IACf,CAAC;IAED,IAAM,eAAe,GAAG,EAAE,CAAC,CAAC,CAAC,aAAa,CAAC,EAAE,SAAS;QACpD,GAAC,CAAC,CAAC,sBAAsB,CAAC,IAAG,KAAK;QAClC,GAAC,CAAC,CAAC,uBAAuB,CAAC,IAAG,QAAQ;YACtC,CAAC;IAEH,OAAO,CACL,2CACM,SAAS,IACb,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,QAAQ,kBACC,KAAK,EACnB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,eAAe,EAC1B,SAAS,EAAE,iBAAiB,EAC5B,OAAO,EAAE,eAAe;QAExB,8BAAM,SAAS,EAAE,CAAC,CAAC,oBAAoB,CAAC,GAAI,CACrC,CACV,CAAC;AACJ,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{ "TextInput": "
|
|
1
|
+
{ "TextInput": "_TextInput_x2oj2_1", "TextInput--monospaced": "_TextInput--monospaced_x2oj2_30", "TextInput--disabled": "_TextInput--disabled_x2oj2_35", "TextInput--error": "_TextInput--error_x2oj2_41" }
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React, { CSSProperties, MouseEventHandler, ReactNode } from 'react';
|
|
2
2
|
export declare type ButtonProps = {
|
|
3
3
|
children?: ReactNode;
|
|
4
|
-
type
|
|
4
|
+
type?: React.ButtonHTMLAttributes<HTMLButtonElement>['type'];
|
|
5
5
|
className?: string;
|
|
6
6
|
disabled?: boolean;
|
|
7
7
|
onClick?: MouseEventHandler;
|
|
@@ -12,6 +12,67 @@ export declare type ButtonProps = {
|
|
|
12
12
|
fullWidth?: boolean;
|
|
13
13
|
style?: CSSProperties;
|
|
14
14
|
};
|
|
15
|
+
/**
|
|
16
|
+
* @example Button types
|
|
17
|
+
*
|
|
18
|
+
* ```js
|
|
19
|
+
* <Canvas ctx={ctx}>
|
|
20
|
+
* <div style={{ marginBottom: 'var(--spacing-m)' }}>
|
|
21
|
+
* <Button buttonType="muted">Submit</Button>{' '}
|
|
22
|
+
* <Button buttonType="primary">Submit</Button>{' '}
|
|
23
|
+
* <Button buttonType="negative">Submit</Button>
|
|
24
|
+
* </div>
|
|
25
|
+
* <div>
|
|
26
|
+
* <Button buttonType="muted" disabled>
|
|
27
|
+
* Submit
|
|
28
|
+
* </Button>{' '}
|
|
29
|
+
* <Button buttonType="primary" disabled>
|
|
30
|
+
* Submit
|
|
31
|
+
* </Button>{' '}
|
|
32
|
+
* <Button buttonType="negative" disabled>
|
|
33
|
+
* Submit
|
|
34
|
+
* </Button>
|
|
35
|
+
* </div>
|
|
36
|
+
* </Canvas>;
|
|
37
|
+
* ```
|
|
38
|
+
*
|
|
39
|
+
* @example Full-width
|
|
40
|
+
*
|
|
41
|
+
* ```js
|
|
42
|
+
* <Canvas ctx={ctx}>
|
|
43
|
+
* <Button fullWidth>Submit</Button>
|
|
44
|
+
* </Canvas>;
|
|
45
|
+
* ```
|
|
46
|
+
*
|
|
47
|
+
* @example Sizing
|
|
48
|
+
*
|
|
49
|
+
* ```js
|
|
50
|
+
* <Canvas ctx={ctx}>
|
|
51
|
+
* <Button buttonSize="xxs">Submit</Button>{' '}
|
|
52
|
+
* <Button buttonSize="xs">Submit</Button>{' '}
|
|
53
|
+
* <Button buttonSize="s">Submit</Button>{' '}
|
|
54
|
+
* <Button buttonSize="m">Submit</Button>{' '}
|
|
55
|
+
* <Button buttonSize="l">Submit</Button>{' '}
|
|
56
|
+
* <Button buttonSize="xl">Submit</Button>{' '}
|
|
57
|
+
* </Canvas>;
|
|
58
|
+
* ```
|
|
59
|
+
*
|
|
60
|
+
* @example Icons
|
|
61
|
+
*
|
|
62
|
+
* ```js
|
|
63
|
+
* <Canvas ctx={ctx}>
|
|
64
|
+
* <div style={{ marginBottom: 'var(--spacing-m)' }}>
|
|
65
|
+
* <Button leftIcon={<PlusIcon />}>Submit</Button>
|
|
66
|
+
* </div>
|
|
67
|
+
* <div style={{ marginBottom: 'var(--spacing-m)' }}>
|
|
68
|
+
* <Button rightIcon={<ChevronDownIcon />}>Options</Button>
|
|
69
|
+
* </div>
|
|
70
|
+
* <div>
|
|
71
|
+
* <Button leftIcon={<PlusIcon />} />
|
|
72
|
+
* </div>
|
|
73
|
+
* </Canvas>;
|
|
74
|
+
* ```
|
|
75
|
+
*/
|
|
15
76
|
export declare function Button({ children, className, disabled, buttonType, buttonSize, fullWidth, onClick, style, leftIcon, rightIcon, type, }: ButtonProps): JSX.Element;
|
|
16
77
|
export declare type ButtonLinkProps = {
|
|
17
78
|
children?: ReactNode;
|