@toptal/picasso-button 4.0.6-alpha-FX-NULL-fix-options-rendering-453e2e654.0 → 4.0.6-alpha-fx-null-button-overridable-a6bdbbaa2.0
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-package/src/Button/Button.d.ts +3 -2
- package/dist-package/src/Button/Button.d.ts.map +1 -1
- package/dist-package/src/Button/Button.js.map +1 -1
- package/dist-package/src/ButtonAction/ButtonAction.d.ts +3 -2
- package/dist-package/src/ButtonAction/ButtonAction.d.ts.map +1 -1
- package/dist-package/src/ButtonAction/ButtonAction.js.map +1 -1
- package/dist-package/src/ButtonBase/ButtonBase.d.ts +4 -3
- package/dist-package/src/ButtonBase/ButtonBase.d.ts.map +1 -1
- package/dist-package/src/ButtonBase/ButtonBase.js.map +1 -1
- package/dist-package/src/ButtonCircular/ButtonCircular.d.ts +3 -2
- package/dist-package/src/ButtonCircular/ButtonCircular.d.ts.map +1 -1
- package/dist-package/src/ButtonCircular/ButtonCircular.js.map +1 -1
- package/dist-package/src/ButtonCompound/index.d.ts +16 -10
- package/dist-package/src/ButtonCompound/index.d.ts.map +1 -1
- package/dist-package/src/ButtonCompound/index.js.map +1 -1
- package/dist-package/src/ButtonControlLabel/ButtonControlLabel.d.ts.map +1 -1
- package/dist-package/src/ButtonControlLabel/ButtonControlLabel.js +10 -3
- package/dist-package/src/ButtonControlLabel/ButtonControlLabel.js.map +1 -1
- package/package.json +14 -14
- package/src/Button/Button.tsx +4 -5
- package/src/ButtonAction/ButtonAction.tsx +40 -45
- package/src/ButtonBase/ButtonBase.tsx +79 -78
- package/src/ButtonCircular/ButtonCircular.tsx +42 -47
- package/src/ButtonCompound/index.ts +10 -1
- package/src/ButtonControlLabel/ButtonControlLabel.tsx +26 -16
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import type { ReactNode, ReactElement, MouseEvent, ElementType } from 'react';
|
|
2
|
-
import
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import type { StandardProps, SizeType, ButtonOrAnchorProps, TextLabelProps } from '@toptal/picasso-shared';
|
|
3
4
|
export declare type VariantType = 'primary' | 'negative' | 'positive' | 'secondary' | 'transparent';
|
|
4
5
|
export declare type IconPositionType = 'left' | 'right';
|
|
5
6
|
export interface Props extends StandardProps, TextLabelProps, ButtonOrAnchorProps {
|
|
@@ -34,6 +35,6 @@ export interface Props extends StandardProps, TextLabelProps, ButtonOrAnchorProp
|
|
|
34
35
|
/** HTML type of Button component */
|
|
35
36
|
type?: 'button' | 'reset' | 'submit';
|
|
36
37
|
}
|
|
37
|
-
export declare const Button:
|
|
38
|
+
export declare const Button: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLButtonElement>>;
|
|
38
39
|
export default Button;
|
|
39
40
|
//# sourceMappingURL=Button.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAC7E,OAAO,KAAqB,MAAM,OAAO,CAAA;AAGzC,OAAO,KAAK,EACV,aAAa,EACb,QAAQ,EACR,mBAAmB,EACnB,cAAc,EACf,MAAM,wBAAwB,CAAA;AAiB/B,oBAAY,WAAW,GACnB,SAAS,GACT,UAAU,GACV,UAAU,GACV,WAAW,GACX,aAAa,CAAA;AAEjB,oBAAY,gBAAgB,GAAG,MAAM,GAAG,OAAO,CAAA;AAE/C,MAAM,WAAW,KACf,SAAQ,aAAa,EACnB,cAAc,EACd,mBAAmB;IACrB,+DAA+D;IAC/D,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,EAAE,CAAC,EAAE,WAAW,CAAA;IAChB,sBAAsB;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,yCAAyC;IACzC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,uCAAuC;IACvC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,gDAAgD;IAChD,IAAI,CAAC,EAAE,YAAY,CAAA;IACnB,kDAAkD;IAClD,YAAY,CAAC,EAAE,gBAAgB,CAAA;IAC/B,0DAA0D;IAC1D,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,iDAAiD;IACjD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,KAAK,IAAI,CAAA;IAC5E,wCAAwC;IACxC,IAAI,CAAC,EAAE,QAAQ,CAAC,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC,CAAA;IAC7C,yBAAyB;IACzB,OAAO,CAAC,EAAE,WAAW,CAAA;IACrB,qCAAqC;IACrC,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,qCAAqC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,oCAAoC;IACpC,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAA;CACrC;AA2BD,eAAO,MAAM,MAAM,iFA0EjB,CAAA;AAoBF,eAAe,MAAM,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/Button/Button.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAA;
|
|
1
|
+
{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/Button/Button.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import type { ReactElement, MouseEvent, ElementType } from 'react';
|
|
2
|
-
import
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import type { BaseProps, ButtonOrAnchorProps } from '@toptal/picasso-shared';
|
|
3
4
|
import type { IconPositionType } from '../Button';
|
|
4
5
|
export interface Props extends BaseProps, ButtonOrAnchorProps {
|
|
5
6
|
/** Show button in the active state (left mouse button down) */
|
|
@@ -23,6 +24,6 @@ export interface Props extends BaseProps, ButtonOrAnchorProps {
|
|
|
23
24
|
/** HTML Value of Button component */
|
|
24
25
|
value?: string | number;
|
|
25
26
|
}
|
|
26
|
-
export declare const ButtonAction:
|
|
27
|
+
export declare const ButtonAction: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLButtonElement>>;
|
|
27
28
|
export default ButtonAction;
|
|
28
29
|
//# sourceMappingURL=ButtonAction.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonAction.d.ts","sourceRoot":"","sources":["../../../src/ButtonAction/ButtonAction.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,WAAW,EAAa,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"ButtonAction.d.ts","sourceRoot":"","sources":["../../../src/ButtonAction/ButtonAction.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,WAAW,EAAa,MAAM,OAAO,CAAA;AAC7E,OAAO,KAAqB,MAAM,OAAO,CAAA;AAEzC,OAAO,KAAK,EAAE,SAAS,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAA;AAG5E,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAA;AA0BjD,MAAM,WAAW,KAAM,SAAQ,SAAS,EAAE,mBAAmB;IAC3D,+DAA+D;IAC/D,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,iGAAiG;IACjG,EAAE,CAAC,EAAE,WAAW,CAAA;IAChB,sBAAsB;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,uCAAuC;IACvC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,uCAAuC;IACvC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,gDAAgD;IAChD,IAAI,CAAC,EAAE,YAAY,CAAA;IACnB,kDAAkD;IAClD,YAAY,CAAC,EAAE,gBAAgB,CAAA;IAC/B,0DAA0D;IAC1D,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,iDAAiD;IACjD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,KAAK,IAAI,CAAA;IAC5E,qCAAqC;IACrC,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CACxB;AAID,eAAO,MAAM,YAAY,iFAyCxB,CAAA;AAQD,eAAe,YAAY,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonAction.js","sourceRoot":"","sources":["../../../src/ButtonAction/ButtonAction.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,MAAM,YAAY,CAAA;
|
|
1
|
+
{"version":3,"file":"ButtonAction.js","sourceRoot":"","sources":["../../../src/ButtonAction/ButtonAction.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAA;AAG/C,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC1C,OAAO,EAAE,oBAAoB,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAA;AAErE,MAAM,OAAO,GAAG,CAAC,EACf,QAAQ,EACR,IAAI,EACJ,YAAY,GAKb,EAAE,EAAE;IACH,IAAI,CAAC,IAAI,EAAE;QACT,OAAO,IAAI,CAAA;KACZ;IAED,MAAM,cAAc,GAAG,oBAAoB,CAAC;QAC1C,YAAY,EAAE,QAAQ,IAAI,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,SAAS;KAClE,CAAC,CAAA;IAEF,OAAO,KAAK,CAAC,YAAY,CAAC,IAAI,EAAE;QAC9B,SAAS,EAAE,EAAE,CAAC,cAAc,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC;KACpD,CAAC,CAAA;AACJ,CAAC,CAAA;AAyBD,MAAM,UAAU,GAAG,oBAAC,MAAM,IAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAC,SAAS,GAAG,CAAA;AAE5D,MAAM,CAAC,MAAM,YAAY,GAAG,UAAU,CACpC,SAAS,YAAY,CAAC,KAAK,EAAE,GAAG;IAC9B,MAAM;IACJ,sDAAsD;IACtD,8CAA8C;IAC9C,MAAM,EACN,OAAO,EACP,OAAO;IACP,qDAAqD;IACrD,SAAS,EACT,QAAQ,EACR,OAAO,EACP,IAAI,EACJ,YAAY,EACZ,OAAO,KAEL,KAAK,EADJ,IAAI,UACL,KAAK,EAdH,uGAcL,CAAQ,CAAA;IAET,MAAM,QAAQ,GAAG,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAA;IAC5C,MAAM,gBAAgB,GAAG,IAAI,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,OAAO,CAAA;IAEtD,MAAM,cAAc,GAAG,EAAE,CAAC,oBAAoB,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,CAAA;IACjE,MAAM,SAAS,GAAG,OAAO,CAAC;QACxB,QAAQ,EAAE,IAAI,CAAC,QAAQ;QACvB,IAAI,EAAE,QAAQ;QACd,YAAY,EAAE,gBAAgB;KAC/B,CAAC,CAAA;IAEF,OAAO,CACL,oBAAC,UAAU,oBACL,IAAI,IACR,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,SAAS,EACf,YAAY,EAAE,gBAAgB,EAC9B,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,EACtC,SAAS,EAAE,cAAc,EACzB,gBAAgB,EAAC,qCAAqC,EACtD,QAAQ,EAAE,QAAQ,IAClB,CACH,CAAA;AACH,CAAC,CACF,CAAA;AAED,YAAY,CAAC,YAAY,GAAG;IAC1B,YAAY,EAAE,MAAM;CACrB,CAAA;AAED,YAAY,CAAC,WAAW,GAAG,cAAc,CAAA;AAEzC,eAAe,YAAY,CAAA"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import type { ReactNode, ReactElement, MouseEvent, ElementType } from 'react';
|
|
2
|
-
import
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import type { StandardProps, ButtonOrAnchorProps, TextLabelProps } from '@toptal/picasso-shared';
|
|
3
4
|
export declare type IconPositionType = 'left' | 'right';
|
|
4
5
|
export interface Props extends StandardProps, TextLabelProps, ButtonOrAnchorProps {
|
|
5
6
|
as?: ElementType;
|
|
@@ -10,7 +11,7 @@ export interface Props extends StandardProps, TextLabelProps, ButtonOrAnchorProp
|
|
|
10
11
|
/** ClassName for the content */
|
|
11
12
|
contentClassName?: string;
|
|
12
13
|
/** Add an `<Icon />` along Button's children */
|
|
13
|
-
icon?: ReactElement;
|
|
14
|
+
icon?: ReactElement | null;
|
|
14
15
|
/** Icon can be positioned on the left or right */
|
|
15
16
|
iconPosition?: IconPositionType;
|
|
16
17
|
/** Shows a loading indicator and disables click events */
|
|
@@ -24,6 +25,6 @@ export interface Props extends StandardProps, TextLabelProps, ButtonOrAnchorProp
|
|
|
24
25
|
/** HTML type of Button component */
|
|
25
26
|
type?: 'button' | 'reset' | 'submit';
|
|
26
27
|
}
|
|
27
|
-
export declare const ButtonBase:
|
|
28
|
+
export declare const ButtonBase: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLButtonElement>>;
|
|
28
29
|
export default ButtonBase;
|
|
29
30
|
//# sourceMappingURL=ButtonBase.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonBase.d.ts","sourceRoot":"","sources":["../../../src/ButtonBase/ButtonBase.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"ButtonBase.d.ts","sourceRoot":"","sources":["../../../src/ButtonBase/ButtonBase.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAC7E,OAAO,KAAqB,MAAM,OAAO,CAAA;AAEzC,OAAO,KAAK,EACV,aAAa,EACb,mBAAmB,EACnB,cAAc,EACf,MAAM,wBAAwB,CAAA;AAU/B,oBAAY,gBAAgB,GAAG,MAAM,GAAG,OAAO,CAAA;AAE/C,MAAM,WAAW,KACf,SAAQ,aAAa,EACnB,cAAc,EACd,mBAAmB;IACrB,EAAE,CAAC,EAAE,WAAW,CAAA;IAChB,sBAAsB;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,gCAAgC;IAChC,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,gDAAgD;IAChD,IAAI,CAAC,EAAE,YAAY,GAAG,IAAI,CAAA;IAC1B,kDAAkD;IAClD,YAAY,CAAC,EAAE,gBAAgB,CAAA;IAC/B,0DAA0D;IAC1D,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,iDAAiD;IACjD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,KAAK,IAAI,CAAA;IAC5E,qCAAqC;IACrC,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,qCAAqC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,oCAAoC;IACpC,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAA;CACrC;AAyBD,eAAO,MAAM,UAAU,iFAiFtB,CAAA;AAcD,eAAe,UAAU,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonBase.js","sourceRoot":"","sources":["../../../src/ButtonBase/ButtonBase.tsx"],"names":[],"mappings":";;;;;;;;;;;AAEA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAA;
|
|
1
|
+
{"version":3,"file":"ButtonBase.js","sourceRoot":"","sources":["../../../src/ButtonBase/ButtonBase.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import type { ReactElement, MouseEvent, ElementType } from 'react';
|
|
2
|
-
import
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import type { BaseProps, ButtonOrAnchorProps } from '@toptal/picasso-shared';
|
|
3
4
|
export declare type VariantType = 'primary' | 'flat' | 'transparent';
|
|
4
5
|
export interface Props extends BaseProps, ButtonOrAnchorProps {
|
|
5
6
|
/** Show button in the active state (left mouse button down) */
|
|
@@ -25,6 +26,6 @@ export interface Props extends BaseProps, ButtonOrAnchorProps {
|
|
|
25
26
|
/** Adjust button size to be bigger on screens under xl */
|
|
26
27
|
responsive?: boolean;
|
|
27
28
|
}
|
|
28
|
-
export declare const ButtonCircular:
|
|
29
|
+
export declare const ButtonCircular: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLButtonElement>>;
|
|
29
30
|
export default ButtonCircular;
|
|
30
31
|
//# sourceMappingURL=ButtonCircular.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonCircular.d.ts","sourceRoot":"","sources":["../../../src/ButtonCircular/ButtonCircular.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"ButtonCircular.d.ts","sourceRoot":"","sources":["../../../src/ButtonCircular/ButtonCircular.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAClE,OAAO,KAAqB,MAAM,OAAO,CAAA;AAEzC,OAAO,KAAK,EAAE,SAAS,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAA;AAK5E,oBAAY,WAAW,GAAG,SAAS,GAAG,MAAM,GAAG,aAAa,CAAA;AAE5D,MAAM,WAAW,KAAM,SAAQ,SAAS,EAAE,mBAAmB;IAC3D,+DAA+D;IAC/D,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,iGAAiG;IACjG,EAAE,CAAC,EAAE,WAAW,CAAA;IAChB,sBAAsB;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,uCAAuC;IACvC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,uCAAuC;IACvC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,gDAAgD;IAChD,IAAI,CAAC,EAAE,YAAY,CAAA;IACnB,0DAA0D;IAC1D,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,iDAAiD;IACjD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,KAAK,IAAI,CAAA;IAC5E,yBAAyB;IACzB,OAAO,CAAC,EAAE,WAAW,CAAA;IACrB,qCAAqC;IACrC,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,2DAA2D;IAC3D,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB;AAED,eAAO,MAAM,cAAc,iFA2C1B,CAAA;AAQD,eAAe,cAAc,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonCircular.js","sourceRoot":"","sources":["../../../src/ButtonCircular/ButtonCircular.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,MAAM,YAAY,CAAA;
|
|
1
|
+
{"version":3,"file":"ButtonCircular.js","sourceRoot":"","sources":["../../../src/ButtonCircular/ButtonCircular.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,MAAM,YAAY,CAAA;AAG3B,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC1C,OAAO,EAAE,oBAAoB,EAAE,uBAAuB,EAAE,MAAM,UAAU,CAAA;AA6BxE,MAAM,CAAC,MAAM,cAAc,GAAG,UAAU,CACtC,SAAS,cAAc,CAAC,KAAK,EAAE,GAAG;IAChC,MAAM,EACJ,SAAS,EACT,OAAO,GAAG,SAAS,EACnB,MAAM,EACN,OAAO,EACP,OAAO,EACP,QAAQ,EACR,UAAU,EACV,OAAO,KAEL,KAAK,EADJ,IAAI,UACL,KAAK,EAVH,6FAUL,CAAQ,CAAA;IACT,MAAM,iBAAiB,GAAG,uBAAuB,CAAC,OAAO,EAAE;QACzD,QAAQ;QACR,OAAO;QACP,OAAO;QACP,MAAM;KACP,CAAC,CAAA;IAEF,MAAM,cAAc,GAAG,EAAE,CACvB,oBAAoB,CAAC,EAAE,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC,EACxE,iBAAiB,EACjB,SAAS,CACV,CAAA;IAED,MAAM,gBAAgB,GAAG,EAAE,CACzB,iCAAiC,EACjC,mBAAmB,EACnB,OAAO,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,CAC3B,CAAA;IAED,OAAO,CACL,oBAAC,UAAU,oBACL,IAAI,IACR,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,cAAc,EACzB,gBAAgB,EAAE,gBAAgB,EAClC,QAAQ,EAAE,QAAQ,IAClB,CACH,CAAA;AACH,CAAC,CACF,CAAA;AAED,cAAc,CAAC,YAAY,GAAG;IAC5B,OAAO,EAAE,SAAS;CACnB,CAAA;AAED,cAAc,CAAC,WAAW,GAAG,gBAAgB,CAAA;AAE7C,eAAe,cAAc,CAAA"}
|
|
@@ -1,12 +1,18 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
1
|
+
import { Button } from '../Button';
|
|
2
|
+
import { ButtonGroup } from '../ButtonGroup';
|
|
3
|
+
import { ButtonCircular } from '../ButtonCircular';
|
|
4
|
+
import { ButtonAction } from '../ButtonAction';
|
|
5
|
+
import { ButtonSplit } from '../ButtonSplit';
|
|
6
|
+
import { ButtonCheckbox } from '../ButtonCheckbox';
|
|
7
|
+
import { ButtonRadio } from '../ButtonRadio';
|
|
8
|
+
declare type ButtonCompoundType = typeof Button & {
|
|
9
|
+
Group: typeof ButtonGroup;
|
|
10
|
+
Circular: typeof ButtonCircular;
|
|
11
|
+
Action: typeof ButtonAction;
|
|
12
|
+
Split: typeof ButtonSplit;
|
|
13
|
+
Checkbox: typeof ButtonCheckbox;
|
|
14
|
+
Radio: typeof ButtonRadio;
|
|
11
15
|
};
|
|
16
|
+
export declare const ButtonCompound: ButtonCompoundType;
|
|
17
|
+
export {};
|
|
12
18
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ButtonCompound/index.ts"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ButtonCompound/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAC9C,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAE5C,aAAK,kBAAkB,GAAG,OAAO,MAAM,GAAG;IACxC,KAAK,EAAE,OAAO,WAAW,CAAA;IACzB,QAAQ,EAAE,OAAO,cAAc,CAAA;IAC/B,MAAM,EAAE,OAAO,YAAY,CAAA;IAC3B,KAAK,EAAE,OAAO,WAAW,CAAA;IACzB,QAAQ,EAAE,OAAO,cAAc,CAAA;IAC/B,KAAK,EAAE,OAAO,WAAW,CAAA;CAC1B,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,kBAO3B,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ButtonCompound/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAC9C,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ButtonCompound/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAC9C,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAW5C,MAAM,CAAC,MAAM,cAAc,GAAuB,MAAM,CAAC,MAAM,CAAC,MAAM,EAAE;IACtE,KAAK,EAAE,WAAW;IAClB,QAAQ,EAAE,cAAc;IACxB,MAAM,EAAE,YAAY;IACpB,KAAK,EAAE,WAAW;IAClB,QAAQ,EAAE,cAAc;IACxB,KAAK,EAAE,WAAW;CACnB,CAAC,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonControlLabel.d.ts","sourceRoot":"","sources":["../../../src/ButtonControlLabel/ButtonControlLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACpD,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAA;AAOjE,MAAM,WAAW,KAAM,SAAQ,SAAS;IACtC,4CAA4C;IAC5C,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,+DAA+D;IAC/D,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,sBAAsB;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,uCAAuC;IACvC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,uCAAuC;IACvC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,wCAAwC;IACxC,IAAI,CAAC,EAAE,QAAQ,CAAC,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC,CAAA;IAC7C,qCAAqC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,CACT,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,EAC1C,OAAO,EAAE,OAAO,KACb,IAAI,CAAA;IACT,kBAAkB;IAClB,QAAQ,EAAE,SAAS,CAAA;IACnB,kCAAkC;IAClC,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,0EAA0E;IAC1E,OAAO,EAAE,YAAY,CAAA;CACtB;AAED,QAAA,MAAM,kBAAkB;+FAWrB,KAAK;;;;
|
|
1
|
+
{"version":3,"file":"ButtonControlLabel.d.ts","sourceRoot":"","sources":["../../../src/ButtonControlLabel/ButtonControlLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACpD,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAA;AAOjE,MAAM,WAAW,KAAM,SAAQ,SAAS;IACtC,4CAA4C;IAC5C,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,+DAA+D;IAC/D,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,sBAAsB;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,uCAAuC;IACvC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,uCAAuC;IACvC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,wCAAwC;IACxC,IAAI,CAAC,EAAE,QAAQ,CAAC,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC,CAAA;IAC7C,qCAAqC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,CACT,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,EAC1C,OAAO,EAAE,OAAO,KACb,IAAI,CAAA;IACT,kBAAkB;IAClB,QAAQ,EAAE,SAAS,CAAA;IACnB,kCAAkC;IAClC,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,0EAA0E;IAC1E,OAAO,EAAE,YAAY,CAAA;CACtB;AAED,QAAA,MAAM,kBAAkB;+FAWrB,KAAK;;;;CAgCP,CAAA;AAMD,eAAe,kBAAkB,CAAA"}
|
|
@@ -17,9 +17,16 @@ import { createSizeClassNames, createContentSizeClassNames } from './styles';
|
|
|
17
17
|
const ButtonControlLabel = (_a) => {
|
|
18
18
|
var { children, size = 'medium', className, checked, onChange, id, control, value, disabled } = _a, props = __rest(_a, ["children", "size", "className", "checked", "onChange", "id", "control", "value", "disabled"]);
|
|
19
19
|
const contentLeftSpacing = size === 'large' ? 1 : 0.5;
|
|
20
|
-
return (React.createElement(
|
|
21
|
-
React.
|
|
22
|
-
|
|
20
|
+
return (React.createElement("label", { htmlFor: id, "aria-disabled": disabled },
|
|
21
|
+
React.createElement(Button, Object.assign({}, props, { className: twMerge('text-center', createSizeClassNames(size), className), variant: 'secondary', size: size, disabled: disabled }),
|
|
22
|
+
React.cloneElement(control, {
|
|
23
|
+
id,
|
|
24
|
+
checked,
|
|
25
|
+
value,
|
|
26
|
+
onChange,
|
|
27
|
+
disabled,
|
|
28
|
+
}),
|
|
29
|
+
React.createElement(Container, { className: createContentSizeClassNames(size), left: contentLeftSpacing }, children))));
|
|
23
30
|
};
|
|
24
31
|
ButtonControlLabel.defaultProps = {
|
|
25
32
|
size: 'medium',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonControlLabel.js","sourceRoot":"","sources":["../../../src/ButtonControlLabel/ButtonControlLabel.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAA;AACxD,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AAErD,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,EAAE,oBAAoB,EAAE,2BAA2B,EAAE,MAAM,UAAU,CAAA;AA8B5E,MAAM,kBAAkB,GAAG,CAAC,EAWpB,EAAE,EAAE;QAXgB,EAC1B,QAAQ,EACR,IAAI,GAAG,QAAQ,EACf,SAAS,EACT,OAAO,EACP,QAAQ,EACR,EAAE,EACF,OAAO,EACP,KAAK,EACL,QAAQ,OAEF,EADH,KAAK,cAVkB,8FAW3B,CADS;IAER,MAAM,kBAAkB,GAAG,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAA;IAErD,OAAO,CACL,oBAAC,MAAM,oBACD,KAAK,IACT,SAAS,EAAE,OAAO,
|
|
1
|
+
{"version":3,"file":"ButtonControlLabel.js","sourceRoot":"","sources":["../../../src/ButtonControlLabel/ButtonControlLabel.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAA;AACxD,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AAErD,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,EAAE,oBAAoB,EAAE,2BAA2B,EAAE,MAAM,UAAU,CAAA;AA8B5E,MAAM,kBAAkB,GAAG,CAAC,EAWpB,EAAE,EAAE;QAXgB,EAC1B,QAAQ,EACR,IAAI,GAAG,QAAQ,EACf,SAAS,EACT,OAAO,EACP,QAAQ,EACR,EAAE,EACF,OAAO,EACP,KAAK,EACL,QAAQ,OAEF,EADH,KAAK,cAVkB,8FAW3B,CADS;IAER,MAAM,kBAAkB,GAAG,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAA;IAErD,OAAO,CACL,+BAAO,OAAO,EAAE,EAAE,mBAAiB,QAAQ;QACzC,oBAAC,MAAM,oBACD,KAAK,IACT,SAAS,EAAE,OAAO,CAChB,aAAa,EACb,oBAAoB,CAAC,IAAI,CAAC,EAC1B,SAAS,CACV,EACD,OAAO,EAAC,WAAW,EACnB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ;YAEjB,KAAK,CAAC,YAAY,CAAC,OAAO,EAAE;gBAC3B,EAAE;gBACF,OAAO;gBACP,KAAK;gBACL,QAAQ;gBACR,QAAQ;aACT,CAAC;YACF,oBAAC,SAAS,IACR,SAAS,EAAE,2BAA2B,CAAC,IAAI,CAAC,EAC5C,IAAI,EAAE,kBAAkB,IAEvB,QAAQ,CACC,CACL,CACH,CACT,CAAA;AACH,CAAC,CAAA;AAED,kBAAkB,CAAC,YAAY,GAAG;IAChC,IAAI,EAAE,QAAQ;CACf,CAAA;AAED,eAAe,kBAAkB,CAAA"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@toptal/picasso-button",
|
|
3
|
-
"version": "4.0.6-alpha-
|
|
3
|
+
"version": "4.0.6-alpha-fx-null-button-overridable-a6bdbbaa2.0+a6bdbbaa2",
|
|
4
4
|
"description": "Toptal UI components library - Button",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -23,15 +23,15 @@
|
|
|
23
23
|
"homepage": "https://github.com/toptal/picasso/tree/master/packages/picasso#readme",
|
|
24
24
|
"dependencies": {
|
|
25
25
|
"@mui/base": "5.0.0-beta.40",
|
|
26
|
-
"@toptal/picasso-checkbox": "5.0.3-alpha-
|
|
27
|
-
"@toptal/picasso-container": "3.1.1-alpha-
|
|
28
|
-
"@toptal/picasso-dropdown": "4.1.2-alpha-
|
|
29
|
-
"@toptal/picasso-icons": "1.6.2-alpha-
|
|
30
|
-
"@toptal/picasso-link": "3.0.3-alpha-
|
|
31
|
-
"@toptal/picasso-loader": "3.0.2-alpha-
|
|
32
|
-
"@toptal/picasso-radio": "5.0.3-alpha-
|
|
33
|
-
"@toptal/picasso-shared": "15.0.1-alpha-
|
|
34
|
-
"@toptal/picasso-utils": "2.0.1-alpha-
|
|
26
|
+
"@toptal/picasso-checkbox": "5.0.3-alpha-fx-null-button-overridable-a6bdbbaa2.0+a6bdbbaa2",
|
|
27
|
+
"@toptal/picasso-container": "3.1.1-alpha-fx-null-button-overridable-a6bdbbaa2.7+a6bdbbaa2",
|
|
28
|
+
"@toptal/picasso-dropdown": "4.1.2-alpha-fx-null-button-overridable-a6bdbbaa2.14+a6bdbbaa2",
|
|
29
|
+
"@toptal/picasso-icons": "1.6.2-alpha-fx-null-button-overridable-a6bdbbaa2.14+a6bdbbaa2",
|
|
30
|
+
"@toptal/picasso-link": "3.0.3-alpha-fx-null-button-overridable-a6bdbbaa2.4+a6bdbbaa2",
|
|
31
|
+
"@toptal/picasso-loader": "3.0.2-alpha-fx-null-button-overridable-a6bdbbaa2.14+a6bdbbaa2",
|
|
32
|
+
"@toptal/picasso-radio": "5.0.3-alpha-fx-null-button-overridable-a6bdbbaa2.0+a6bdbbaa2",
|
|
33
|
+
"@toptal/picasso-shared": "15.0.1-alpha-fx-null-button-overridable-a6bdbbaa2.208+a6bdbbaa2",
|
|
34
|
+
"@toptal/picasso-utils": "2.0.1-alpha-fx-null-button-overridable-a6bdbbaa2.14+a6bdbbaa2",
|
|
35
35
|
"ap-style-title-case": "^1.1.2",
|
|
36
36
|
"classnames": "^2.5.1"
|
|
37
37
|
},
|
|
@@ -49,14 +49,14 @@
|
|
|
49
49
|
".": "./dist-package/src/index.js"
|
|
50
50
|
},
|
|
51
51
|
"devDependencies": {
|
|
52
|
-
"@toptal/picasso-provider": "5.0.1-alpha-
|
|
53
|
-
"@toptal/picasso-tailwind-merge": "2.0.2-alpha-
|
|
54
|
-
"@toptal/picasso-test-utils": "1.1.2-alpha-
|
|
52
|
+
"@toptal/picasso-provider": "5.0.1-alpha-fx-null-button-overridable-a6bdbbaa2.129+a6bdbbaa2",
|
|
53
|
+
"@toptal/picasso-tailwind-merge": "2.0.2-alpha-fx-null-button-overridable-a6bdbbaa2.14+a6bdbbaa2",
|
|
54
|
+
"@toptal/picasso-test-utils": "1.1.2-alpha-fx-null-button-overridable-a6bdbbaa2.208+a6bdbbaa2"
|
|
55
55
|
},
|
|
56
56
|
"files": [
|
|
57
57
|
"dist-package/**",
|
|
58
58
|
"!dist-package/tsconfig.tsbuildinfo",
|
|
59
59
|
"src"
|
|
60
60
|
],
|
|
61
|
-
"gitHead": "
|
|
61
|
+
"gitHead": "a6bdbbaa25247c35686b5c9b17b14a02b9f497ba"
|
|
62
62
|
}
|
package/src/Button/Button.tsx
CHANGED
|
@@ -6,7 +6,6 @@ import type {
|
|
|
6
6
|
StandardProps,
|
|
7
7
|
SizeType,
|
|
8
8
|
ButtonOrAnchorProps,
|
|
9
|
-
OverridableComponent,
|
|
10
9
|
TextLabelProps,
|
|
11
10
|
} from '@toptal/picasso-shared'
|
|
12
11
|
import { noop } from '@toptal/picasso-utils'
|
|
@@ -95,10 +94,10 @@ const getIcon = ({
|
|
|
95
94
|
})
|
|
96
95
|
}
|
|
97
96
|
|
|
98
|
-
export const Button
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
97
|
+
export const Button = forwardRef<HTMLButtonElement, Props>(function Button(
|
|
98
|
+
props,
|
|
99
|
+
ref
|
|
100
|
+
) {
|
|
102
101
|
const {
|
|
103
102
|
icon,
|
|
104
103
|
iconPosition,
|
|
@@ -1,11 +1,7 @@
|
|
|
1
1
|
import type { ReactElement, MouseEvent, ElementType, ReactNode } from 'react'
|
|
2
2
|
import React, { forwardRef } from 'react'
|
|
3
3
|
import cx from 'classnames'
|
|
4
|
-
import type {
|
|
5
|
-
BaseProps,
|
|
6
|
-
ButtonOrAnchorProps,
|
|
7
|
-
OverridableComponent,
|
|
8
|
-
} from '@toptal/picasso-shared'
|
|
4
|
+
import type { BaseProps, ButtonOrAnchorProps } from '@toptal/picasso-shared'
|
|
9
5
|
import { Loader } from '@toptal/picasso-loader'
|
|
10
6
|
|
|
11
7
|
import type { IconPositionType } from '../Button'
|
|
@@ -59,49 +55,48 @@ export interface Props extends BaseProps, ButtonOrAnchorProps {
|
|
|
59
55
|
|
|
60
56
|
const loaderIcon = <Loader size='small' variant='inherit' />
|
|
61
57
|
|
|
62
|
-
export const ButtonAction
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
...rest
|
|
80
|
-
} = props
|
|
58
|
+
export const ButtonAction = forwardRef<HTMLButtonElement, Props>(
|
|
59
|
+
function ButtonAction(props, ref) {
|
|
60
|
+
const {
|
|
61
|
+
/* eslint-disable @typescript-eslint/no-unused-vars */
|
|
62
|
+
// We use these props only to determine styles
|
|
63
|
+
active,
|
|
64
|
+
focused,
|
|
65
|
+
hovered,
|
|
66
|
+
/* eslint-enable @typescript-eslint/no-unused-vars */
|
|
67
|
+
className,
|
|
68
|
+
disabled,
|
|
69
|
+
loading,
|
|
70
|
+
icon,
|
|
71
|
+
iconPosition,
|
|
72
|
+
onClick,
|
|
73
|
+
...rest
|
|
74
|
+
} = props
|
|
81
75
|
|
|
82
|
-
|
|
83
|
-
|
|
76
|
+
const usedIcon = loading ? loaderIcon : icon
|
|
77
|
+
const usedIconPosition = icon ? iconPosition : 'right'
|
|
84
78
|
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
79
|
+
const finalClassName = cx(createRootClassNames(props), className)
|
|
80
|
+
const finalIcon = getIcon({
|
|
81
|
+
children: rest.children,
|
|
82
|
+
icon: usedIcon,
|
|
83
|
+
iconPosition: usedIconPosition,
|
|
84
|
+
})
|
|
91
85
|
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
}
|
|
86
|
+
return (
|
|
87
|
+
<ButtonBase
|
|
88
|
+
{...rest}
|
|
89
|
+
ref={ref}
|
|
90
|
+
icon={finalIcon}
|
|
91
|
+
iconPosition={usedIconPosition}
|
|
92
|
+
onClick={loading ? undefined : onClick}
|
|
93
|
+
className={finalClassName}
|
|
94
|
+
contentClassName='font-semibold text-blue-500 text-md'
|
|
95
|
+
disabled={disabled}
|
|
96
|
+
/>
|
|
97
|
+
)
|
|
98
|
+
}
|
|
99
|
+
)
|
|
105
100
|
|
|
106
101
|
ButtonAction.defaultProps = {
|
|
107
102
|
iconPosition: 'left',
|
|
@@ -5,7 +5,6 @@ import { twMerge } from '@toptal/picasso-tailwind-merge'
|
|
|
5
5
|
import type {
|
|
6
6
|
StandardProps,
|
|
7
7
|
ButtonOrAnchorProps,
|
|
8
|
-
OverridableComponent,
|
|
9
8
|
TextLabelProps,
|
|
10
9
|
} from '@toptal/picasso-shared'
|
|
11
10
|
import { useTitleCase } from '@toptal/picasso-shared'
|
|
@@ -31,7 +30,7 @@ export interface Props
|
|
|
31
30
|
/** ClassName for the content */
|
|
32
31
|
contentClassName?: string
|
|
33
32
|
/** Add an `<Icon />` along Button's children */
|
|
34
|
-
icon?: ReactElement
|
|
33
|
+
icon?: ReactElement | null
|
|
35
34
|
/** Icon can be positioned on the left or right */
|
|
36
35
|
iconPosition?: IconPositionType
|
|
37
36
|
/** Shows a loading indicator and disables click events */
|
|
@@ -69,86 +68,88 @@ const RootElement = forwardRef(
|
|
|
69
68
|
}
|
|
70
69
|
)
|
|
71
70
|
|
|
72
|
-
export const ButtonBase
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
finalChildren.push(iconComponent)
|
|
71
|
+
export const ButtonBase = forwardRef<HTMLButtonElement, Props>(
|
|
72
|
+
function ButtonBase(props, ref) {
|
|
73
|
+
const {
|
|
74
|
+
icon,
|
|
75
|
+
iconPosition,
|
|
76
|
+
loading,
|
|
77
|
+
children,
|
|
78
|
+
className,
|
|
79
|
+
contentClassName,
|
|
80
|
+
style,
|
|
81
|
+
disabled,
|
|
82
|
+
onClick,
|
|
83
|
+
title,
|
|
84
|
+
value,
|
|
85
|
+
type,
|
|
86
|
+
as = 'button',
|
|
87
|
+
titleCase: propsTitleCase,
|
|
88
|
+
...rest
|
|
89
|
+
} = props
|
|
90
|
+
|
|
91
|
+
const titleCase = useTitleCase(propsTitleCase)
|
|
92
|
+
const finalChildren = [titleCase ? toTitleCase(children) : children]
|
|
93
|
+
const finalRootElementName = typeof as === 'string' ? as : 'a'
|
|
94
|
+
|
|
95
|
+
if (icon) {
|
|
96
|
+
const iconComponent = getIcon({ icon })
|
|
97
|
+
|
|
98
|
+
if (iconPosition === 'left') {
|
|
99
|
+
finalChildren.unshift(iconComponent)
|
|
100
|
+
} else {
|
|
101
|
+
finalChildren.push(iconComponent)
|
|
102
|
+
}
|
|
105
103
|
}
|
|
106
|
-
}
|
|
107
104
|
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
as
|
|
132
|
-
inline
|
|
133
|
-
flex
|
|
134
|
-
direction='row'
|
|
135
|
-
alignItems='center'
|
|
136
|
-
className={contentClassName}
|
|
105
|
+
const finalClassName = twMerge(
|
|
106
|
+
createCoreClassNames({ disabled }),
|
|
107
|
+
className
|
|
108
|
+
)
|
|
109
|
+
|
|
110
|
+
return (
|
|
111
|
+
<MUIButtonBase
|
|
112
|
+
{...rest}
|
|
113
|
+
ref={ref}
|
|
114
|
+
onClick={getClickHandler(loading, onClick)}
|
|
115
|
+
className={finalClassName}
|
|
116
|
+
style={style}
|
|
117
|
+
aria-disabled={disabled}
|
|
118
|
+
disabled={disabled}
|
|
119
|
+
title={title}
|
|
120
|
+
value={value}
|
|
121
|
+
type={type}
|
|
122
|
+
data-component-type='button'
|
|
123
|
+
tabIndex={rest.tabIndex ?? disabled ? -1 : 0}
|
|
124
|
+
role={rest.role ?? 'button'}
|
|
125
|
+
rootElementName={finalRootElementName as keyof HTMLElementTagNameMap}
|
|
126
|
+
slots={{ root: RootElement }}
|
|
127
|
+
// @ts-ignore
|
|
128
|
+
slotProps={{ root: { as } }}
|
|
137
129
|
>
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
{loading && (
|
|
142
|
-
<Loader
|
|
143
|
-
variant='inherit'
|
|
144
|
-
className='absolute top-1/2 left-1/2 translate-x-[-50%] translate-y-[-50%]'
|
|
130
|
+
<Container
|
|
131
|
+
as='span'
|
|
145
132
|
inline
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
}
|
|
133
|
+
flex
|
|
134
|
+
direction='row'
|
|
135
|
+
alignItems='center'
|
|
136
|
+
className={contentClassName}
|
|
137
|
+
>
|
|
138
|
+
{finalChildren}
|
|
139
|
+
</Container>
|
|
140
|
+
|
|
141
|
+
{loading && (
|
|
142
|
+
<Loader
|
|
143
|
+
variant='inherit'
|
|
144
|
+
className='absolute top-1/2 left-1/2 translate-x-[-50%] translate-y-[-50%]'
|
|
145
|
+
inline
|
|
146
|
+
size='small'
|
|
147
|
+
/>
|
|
148
|
+
)}
|
|
149
|
+
</MUIButtonBase>
|
|
150
|
+
)
|
|
151
|
+
}
|
|
152
|
+
)
|
|
152
153
|
|
|
153
154
|
ButtonBase.defaultProps = {
|
|
154
155
|
as: 'button',
|
|
@@ -1,11 +1,7 @@
|
|
|
1
1
|
import type { ReactElement, MouseEvent, ElementType } from 'react'
|
|
2
2
|
import React, { forwardRef } from 'react'
|
|
3
3
|
import cx from 'classnames'
|
|
4
|
-
import type {
|
|
5
|
-
BaseProps,
|
|
6
|
-
ButtonOrAnchorProps,
|
|
7
|
-
OverridableComponent,
|
|
8
|
-
} from '@toptal/picasso-shared'
|
|
4
|
+
import type { BaseProps, ButtonOrAnchorProps } from '@toptal/picasso-shared'
|
|
9
5
|
|
|
10
6
|
import { ButtonBase } from '../ButtonBase'
|
|
11
7
|
import { createRootClassNames, createVariantClassNames } from './styles'
|
|
@@ -37,51 +33,50 @@ export interface Props extends BaseProps, ButtonOrAnchorProps {
|
|
|
37
33
|
responsive?: boolean
|
|
38
34
|
}
|
|
39
35
|
|
|
40
|
-
export const ButtonCircular
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
active,
|
|
60
|
-
})
|
|
36
|
+
export const ButtonCircular = forwardRef<HTMLButtonElement, Props>(
|
|
37
|
+
function ButtonCircular(props, ref) {
|
|
38
|
+
const {
|
|
39
|
+
className,
|
|
40
|
+
variant = 'primary',
|
|
41
|
+
active,
|
|
42
|
+
focused,
|
|
43
|
+
hovered,
|
|
44
|
+
disabled,
|
|
45
|
+
responsive,
|
|
46
|
+
loading,
|
|
47
|
+
...rest
|
|
48
|
+
} = props
|
|
49
|
+
const variantClassNames = createVariantClassNames(variant, {
|
|
50
|
+
disabled,
|
|
51
|
+
focused,
|
|
52
|
+
hovered,
|
|
53
|
+
active,
|
|
54
|
+
})
|
|
61
55
|
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
56
|
+
const finalClassName = cx(
|
|
57
|
+
createRootClassNames({ responsive, active, disabled, focused, hovered }),
|
|
58
|
+
variantClassNames,
|
|
59
|
+
className
|
|
60
|
+
)
|
|
67
61
|
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
62
|
+
const contentClassName = cx(
|
|
63
|
+
'font-semibold whitespace-nowrap',
|
|
64
|
+
'text-button-small',
|
|
65
|
+
loading ? 'opacity-0' : ''
|
|
66
|
+
)
|
|
73
67
|
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
}
|
|
68
|
+
return (
|
|
69
|
+
<ButtonBase
|
|
70
|
+
{...rest}
|
|
71
|
+
ref={ref}
|
|
72
|
+
loading={loading}
|
|
73
|
+
className={finalClassName}
|
|
74
|
+
contentClassName={contentClassName}
|
|
75
|
+
disabled={disabled}
|
|
76
|
+
/>
|
|
77
|
+
)
|
|
78
|
+
}
|
|
79
|
+
)
|
|
85
80
|
|
|
86
81
|
ButtonCircular.defaultProps = {
|
|
87
82
|
variant: 'primary',
|
|
@@ -6,7 +6,16 @@ import { ButtonSplit } from '../ButtonSplit'
|
|
|
6
6
|
import { ButtonCheckbox } from '../ButtonCheckbox'
|
|
7
7
|
import { ButtonRadio } from '../ButtonRadio'
|
|
8
8
|
|
|
9
|
-
|
|
9
|
+
type ButtonCompoundType = typeof Button & {
|
|
10
|
+
Group: typeof ButtonGroup
|
|
11
|
+
Circular: typeof ButtonCircular
|
|
12
|
+
Action: typeof ButtonAction
|
|
13
|
+
Split: typeof ButtonSplit
|
|
14
|
+
Checkbox: typeof ButtonCheckbox
|
|
15
|
+
Radio: typeof ButtonRadio
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
export const ButtonCompound: ButtonCompoundType = Object.assign(Button, {
|
|
10
19
|
Group: ButtonGroup,
|
|
11
20
|
Circular: ButtonCircular,
|
|
12
21
|
Action: ButtonAction,
|
|
@@ -50,23 +50,33 @@ const ButtonControlLabel = ({
|
|
|
50
50
|
const contentLeftSpacing = size === 'large' ? 1 : 0.5
|
|
51
51
|
|
|
52
52
|
return (
|
|
53
|
-
<
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
className={createContentSizeClassNames(size)}
|
|
65
|
-
left={contentLeftSpacing}
|
|
53
|
+
<label htmlFor={id} aria-disabled={disabled}>
|
|
54
|
+
<Button
|
|
55
|
+
{...props}
|
|
56
|
+
className={twMerge(
|
|
57
|
+
'text-center',
|
|
58
|
+
createSizeClassNames(size),
|
|
59
|
+
className
|
|
60
|
+
)}
|
|
61
|
+
variant='secondary'
|
|
62
|
+
size={size}
|
|
63
|
+
disabled={disabled}
|
|
66
64
|
>
|
|
67
|
-
{
|
|
68
|
-
|
|
69
|
-
|
|
65
|
+
{React.cloneElement(control, {
|
|
66
|
+
id,
|
|
67
|
+
checked,
|
|
68
|
+
value,
|
|
69
|
+
onChange,
|
|
70
|
+
disabled,
|
|
71
|
+
})}
|
|
72
|
+
<Container
|
|
73
|
+
className={createContentSizeClassNames(size)}
|
|
74
|
+
left={contentLeftSpacing}
|
|
75
|
+
>
|
|
76
|
+
{children}
|
|
77
|
+
</Container>
|
|
78
|
+
</Button>
|
|
79
|
+
</label>
|
|
70
80
|
)
|
|
71
81
|
}
|
|
72
82
|
|