@toptal/picasso-button 1.0.13-alpha-fx-5263-merge-feature-branch-d124b1f9a.10 → 1.0.13-alpha-fx-4593-migrate-tag-4f7c872c8.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (90) hide show
  1. package/dist-package/src/Button/Button.d.ts.map +1 -1
  2. package/dist-package/src/Button/Button.js +47 -39
  3. package/dist-package/src/Button/Button.js.map +1 -1
  4. package/dist-package/src/Button/styles.d.ts +45 -19
  5. package/dist-package/src/Button/styles.d.ts.map +1 -1
  6. package/dist-package/src/Button/styles.js +178 -161
  7. package/dist-package/src/Button/styles.js.map +1 -1
  8. package/dist-package/src/ButtonAction/ButtonAction.d.ts.map +1 -1
  9. package/dist-package/src/ButtonAction/ButtonAction.js +28 -20
  10. package/dist-package/src/ButtonAction/ButtonAction.js.map +1 -1
  11. package/dist-package/src/ButtonAction/styles.d.ts +3 -11
  12. package/dist-package/src/ButtonAction/styles.d.ts.map +1 -1
  13. package/dist-package/src/ButtonAction/styles.js +55 -36
  14. package/dist-package/src/ButtonAction/styles.js.map +1 -1
  15. package/dist-package/src/ButtonCircular/ButtonCircular.d.ts.map +1 -1
  16. package/dist-package/src/ButtonCircular/ButtonCircular.js +26 -12
  17. package/dist-package/src/ButtonCircular/ButtonCircular.js.map +1 -1
  18. package/dist-package/src/ButtonCircular/styles.d.ts +3 -15
  19. package/dist-package/src/ButtonCircular/styles.d.ts.map +1 -1
  20. package/dist-package/src/ButtonCircular/styles.js +57 -92
  21. package/dist-package/src/ButtonCircular/styles.js.map +1 -1
  22. package/dist-package/src/ButtonCompound/index.d.ts +1 -1
  23. package/dist-package/src/ButtonControlLabel/ButtonControlLabel.d.ts.map +1 -1
  24. package/dist-package/src/ButtonControlLabel/ButtonControlLabel.js +13 -4
  25. package/dist-package/src/ButtonControlLabel/ButtonControlLabel.js.map +1 -1
  26. package/dist-package/src/ButtonControlLabel/styles.d.ts +2 -2
  27. package/dist-package/src/ButtonControlLabel/styles.d.ts.map +1 -1
  28. package/dist-package/src/ButtonControlLabel/styles.js +25 -16
  29. package/dist-package/src/ButtonControlLabel/styles.js.map +1 -1
  30. package/dist-package/src/ButtonGroup/ButtonGroup.d.ts +1 -1
  31. package/dist-package/src/ButtonGroup/ButtonGroup.d.ts.map +1 -1
  32. package/dist-package/src/ButtonGroup/ButtonGroup.js +27 -5
  33. package/dist-package/src/ButtonGroup/ButtonGroup.js.map +1 -1
  34. package/dist-package/src/ButtonGroup/styles.d.ts +2 -1
  35. package/dist-package/src/ButtonGroup/styles.d.ts.map +1 -1
  36. package/dist-package/src/ButtonGroup/styles.js +47 -20
  37. package/dist-package/src/ButtonGroup/styles.js.map +1 -1
  38. package/dist-package/src/ButtonGroupItem/ButtonGroupItem.d.ts +1 -1
  39. package/dist-package/src/ButtonGroupItem/ButtonGroupItem.d.ts.map +1 -1
  40. package/dist-package/src/ButtonGroupItem/ButtonGroupItem.js +12 -17
  41. package/dist-package/src/ButtonGroupItem/ButtonGroupItem.js.map +1 -1
  42. package/dist-package/src/ButtonGroupItem/styles.d.ts +3 -13
  43. package/dist-package/src/ButtonGroupItem/styles.d.ts.map +1 -1
  44. package/dist-package/src/ButtonGroupItem/styles.js +17 -39
  45. package/dist-package/src/ButtonGroupItem/styles.js.map +1 -1
  46. package/dist-package/src/ButtonSplit/ButtonSplit.d.ts.map +1 -1
  47. package/dist-package/src/ButtonSplit/ButtonSplit.js +24 -28
  48. package/dist-package/src/ButtonSplit/ButtonSplit.js.map +1 -1
  49. package/dist-package/src/ButtonSplit/styles.d.ts +3 -9
  50. package/dist-package/src/ButtonSplit/styles.d.ts.map +1 -1
  51. package/dist-package/src/ButtonSplit/styles.js +50 -13
  52. package/dist-package/src/ButtonSplit/styles.js.map +1 -1
  53. package/package.json +15 -19
  54. package/src/Button/Button.tsx +100 -69
  55. package/src/Button/__snapshots__/test.tsx.snap +4 -8
  56. package/src/Button/styles.ts +221 -214
  57. package/src/Button/test.tsx +1 -3
  58. package/src/ButtonAction/ButtonAction.tsx +48 -36
  59. package/src/ButtonAction/styles.ts +57 -57
  60. package/src/ButtonCheckbox/__snapshots__/test.tsx.snap +3 -4
  61. package/src/ButtonCircular/ButtonCircular.tsx +37 -22
  62. package/src/ButtonCircular/styles.ts +75 -127
  63. package/src/ButtonControlLabel/ButtonControlLabel.tsx +16 -7
  64. package/src/ButtonControlLabel/styles.ts +26 -30
  65. package/src/ButtonGroup/ButtonGroup.tsx +44 -9
  66. package/src/ButtonGroup/__snapshots__/test.tsx.snap +7 -13
  67. package/src/ButtonGroup/styles.ts +63 -21
  68. package/src/ButtonGroupItem/ButtonGroupItem.tsx +15 -24
  69. package/src/ButtonGroupItem/styles.ts +28 -62
  70. package/src/ButtonRadio/__snapshots__/test.tsx.snap +3 -4
  71. package/src/ButtonSplit/ButtonSplit.tsx +42 -46
  72. package/src/ButtonSplit/__snapshots__/test.tsx.snap +9 -13
  73. package/src/ButtonSplit/styles.ts +56 -37
  74. package/dist-package/src/ButtonBase/ButtonBase.d.ts +0 -29
  75. package/dist-package/src/ButtonBase/ButtonBase.d.ts.map +0 -1
  76. package/dist-package/src/ButtonBase/ButtonBase.js +0 -78
  77. package/dist-package/src/ButtonBase/ButtonBase.js.map +0 -1
  78. package/dist-package/src/ButtonBase/index.d.ts +0 -5
  79. package/dist-package/src/ButtonBase/index.d.ts.map +0 -1
  80. package/dist-package/src/ButtonBase/index.js +0 -2
  81. package/dist-package/src/ButtonBase/index.js.map +0 -1
  82. package/dist-package/src/ButtonBase/styles.d.ts +0 -6
  83. package/dist-package/src/ButtonBase/styles.d.ts.map +0 -1
  84. package/dist-package/src/ButtonBase/styles.js +0 -29
  85. package/dist-package/src/ButtonBase/styles.js.map +0 -1
  86. package/src/ButtonBase/ButtonBase.tsx +0 -182
  87. package/src/ButtonBase/__snapshots__/test.tsx.snap +0 -262
  88. package/src/ButtonBase/index.ts +0 -5
  89. package/src/ButtonBase/styles.ts +0 -36
  90. package/src/ButtonBase/test.tsx +0 -212
@@ -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;AAI7E,OAAO,KAAK,EACV,aAAa,EACb,QAAQ,EACR,mBAAmB,EACnB,oBAAoB,EACpB,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,EAAE,oBAAoB,CAAC,KAAK,CA0E7C,CAAA;AAoBF,eAAe,MAAM,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;AAG7E,OAAO,KAAK,EACV,aAAa,EACb,QAAQ,EACR,mBAAmB,EACnB,oBAAoB,EACpB,cAAc,EAEf,MAAM,wBAAwB,CAAA;AAoB/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;AA8BD,eAAO,MAAM,MAAM,EAAE,oBAAoB,CAAC,KAAK,CAmG7C,CAAA;AAoBF,eAAe,MAAM,CAAA"}
@@ -11,56 +11,64 @@ var __rest = (this && this.__rest) || function (s, e) {
11
11
  };
12
12
  import React, { forwardRef } from 'react';
13
13
  import cx from 'classnames';
14
- import { twMerge } from 'tailwind-merge';
15
- import { noop } from '@toptal/picasso-utils';
14
+ import { useTitleCase } from '@toptal/picasso-shared';
15
+ import { makeStyles, ButtonBase } from '@material-ui/core';
16
+ import { Loader } from '@toptal/picasso-loader';
17
+ import { Container } from '@toptal/picasso-container';
18
+ import { noop, toTitleCase } from '@toptal/picasso-utils';
16
19
  // we need to ensure the correct order of styles import
17
20
  // TODO: [FX-4614] To be removed when Link component is migrated to tailwind
18
21
  import { Link } from '@toptal/picasso-link';
19
- import { ButtonBase } from '../ButtonBase';
20
- import { createVariantClassNames, createCoreClassNames, createSizeClassNames, createIconClassNames, } from './styles';
22
+ import styles from './styles';
21
23
  // HACK: This statement is only used to prevent webpack from tree shaking the import
22
24
  void Link;
23
- const getIcon = ({ children, icon, iconPosition, size, }) => {
25
+ const useStyles = makeStyles(styles, {
26
+ name: 'PicassoButton',
27
+ });
28
+ const getClickHandler = (loading, handler) => loading ? noop : handler;
29
+ const getIcon = (classes, children, icon, iconPosition) => {
24
30
  if (!icon) {
25
- return undefined;
31
+ return null;
26
32
  }
27
- const iconClassNames = createIconClassNames({
28
- size,
29
- iconPosition: children && iconPosition ? iconPosition : undefined,
30
- });
33
+ const { icon: iconClass, iconLeft: iconLeftClass, iconRight: iconRightClass, } = classes;
31
34
  return React.cloneElement(icon, {
32
- className: twMerge(iconClassNames, icon.props.className),
35
+ className: cx(iconClass, icon.props.className, {
36
+ [iconLeftClass]: children && iconPosition === 'left',
37
+ [iconRightClass]: children && iconPosition === 'right',
38
+ }),
39
+ key: 'button-icon',
33
40
  });
34
41
  };
35
42
  export const Button = forwardRef(function Button(props, ref) {
36
- const { icon, iconPosition, loading, className, fullWidth, variant = 'primary', size = 'medium', focused, hovered, disabled, active } = props, rest = __rest(props, ["icon", "iconPosition", "loading", "className", "fullWidth", "variant", "size", "focused", "hovered", "disabled", "active"]);
37
- const iconComponent = getIcon({
38
- children: rest.children,
39
- icon,
40
- iconPosition,
41
- size,
42
- });
43
- const coreClassNames = createCoreClassNames({
44
- disabled,
45
- focused,
46
- hovered,
47
- active,
48
- });
49
- const variantClassNames = createVariantClassNames(variant, {
50
- disabled,
51
- focused,
52
- hovered,
53
- active,
54
- });
55
- const sizeClassNames = createSizeClassNames(size);
56
- const finalClassName = twMerge(coreClassNames, variantClassNames, sizeClassNames, fullWidth ? 'w-full' : '', className);
57
- const contentSizeClassNames = {
58
- small: ['text-button-small'],
59
- medium: ['text-button-medium'],
60
- large: ['text-button-large'],
61
- };
62
- const contentClassName = cx('font-semibold whitespace-nowrap', contentSizeClassNames[size], loading ? 'opacity-0' : '');
63
- return (React.createElement(ButtonBase, Object.assign({}, rest, { ref: ref, className: finalClassName, contentClassName: contentClassName, icon: iconComponent, iconPosition: iconPosition, loading: loading, disabled: disabled })));
43
+ const { icon, iconPosition, loading, children, className, style, fullWidth, variant = 'primary', size = 'medium', focused, hovered, disabled, active, onClick, title, value, type, as = 'button', titleCase: propsTitleCase } = props, rest = __rest(props, ["icon", "iconPosition", "loading", "children", "className", "style", "fullWidth", "variant", "size", "focused", "hovered", "disabled", "active", "onClick", "title", "value", "type", "as", "titleCase"]);
44
+ const classes = useStyles(props);
45
+ const { root: rootClass, hidden: hiddenClass, loader: loaderClass, content: contentClass, } = classes;
46
+ const titleCase = useTitleCase(propsTitleCase);
47
+ const finalChildren = [titleCase ? toTitleCase(children) : children];
48
+ if (icon) {
49
+ const iconComponent = getIcon(classes, children, icon, iconPosition);
50
+ if (iconPosition === 'left') {
51
+ finalChildren.unshift(iconComponent);
52
+ }
53
+ else {
54
+ finalChildren.push(iconComponent);
55
+ }
56
+ }
57
+ const variantClassName = classes[variant];
58
+ const sizeClassName = classes[size];
59
+ const rootClassName = cx({
60
+ [classes.fullWidth]: fullWidth,
61
+ [classes.active]: active,
62
+ [classes.focused]: focused,
63
+ [classes.hovered]: hovered,
64
+ [classes.disabled]: disabled,
65
+ }, sizeClassName, variantClassName, rootClass);
66
+ return (React.createElement(ButtonBase, Object.assign({}, rest, { ref: ref, classes: {
67
+ root: rootClassName,
68
+ focusVisible: cx(classes.focusVisible),
69
+ }, onClick: getClickHandler(loading, onClick), className: className, style: style, disabled: disabled, title: title, value: value, type: type, component: as, "data-component-type": 'button' }),
70
+ React.createElement(Container, { as: 'span', inline: true, flex: true, direction: 'row', alignItems: 'center', className: cx({ [hiddenClass]: loading }, contentClass) }, finalChildren),
71
+ loading && (React.createElement(Loader, { variant: 'inherit', className: loaderClass, inline: true, size: 'small' }))));
64
72
  });
65
73
  Button.defaultProps = {
66
74
  active: false,
@@ -1 +1 @@
1
- {"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/Button/Button.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/Button/Button.tsx"],"names":[],"mappings":"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"}
@@ -1,20 +1,46 @@
1
- import type { SizeType } from '@toptal/picasso-shared';
2
- import type { IconPositionType, VariantType } from './Button';
3
- export declare const createSizeClassNames: (size: 'small' | 'medium' | 'large') => string[];
4
- export declare const createVariantClassNames: (variant: VariantType, { disabled, focused, hovered, active, }: {
5
- disabled?: boolean | undefined;
6
- focused?: boolean | undefined;
7
- hovered?: boolean | undefined;
8
- active?: boolean | undefined;
9
- }) => string[];
10
- export declare const createCoreClassNames: ({ disabled, focused, active, }: {
11
- disabled?: boolean | undefined;
12
- focused?: boolean | undefined;
13
- hovered?: boolean | undefined;
14
- active?: boolean | undefined;
15
- }) => string[];
16
- export declare const createIconClassNames: ({ iconPosition, size, }: {
17
- iconPosition?: IconPositionType | undefined;
18
- size: SizeType<'small' | 'medium' | 'large'>;
19
- }) => string[];
1
+ import type { Theme } from '@material-ui/core/styles';
2
+ export declare const createOutlineCommons: ({ palette }: Theme) => {
3
+ color: string;
4
+ backgroundColor: string;
5
+ '&:hover, &$hovered': {
6
+ borderColor: string;
7
+ };
8
+ '&&&:visited': {
9
+ color: string;
10
+ };
11
+ '&$disabled': {
12
+ color: string | undefined;
13
+ borderColor: string | undefined;
14
+ backgroundColor: string;
15
+ };
16
+ };
17
+ export declare const activeGroup: ({ palette }: Theme) => {
18
+ backgroundColor: string | undefined;
19
+ borderColor: string | undefined;
20
+ color: string;
21
+ };
22
+ export declare const disabledGroup: ({ palette }: Theme) => {
23
+ color: string | undefined;
24
+ cursor: string;
25
+ pointerEvents: string;
26
+ };
27
+ export declare const createVariant: (mainColor: string, { palette }: Theme) => {
28
+ border: string;
29
+ color: string;
30
+ backgroundColor: string;
31
+ '&:hover, &$hovered': {
32
+ backgroundColor: string;
33
+ };
34
+ '&:active, &$active': {
35
+ backgroundColor: string;
36
+ };
37
+ '&&&:visited': {
38
+ color: string;
39
+ };
40
+ '&$disabled': {
41
+ backgroundColor: string | undefined;
42
+ };
43
+ };
44
+ declare const _default: (theme: Theme) => import("@material-ui/styles").StyleRules<{}, "root" | "content" | "transparent" | "hidden" | "medium" | "large" | "small" | "icon" | "active" | "disabled" | "loader" | "primary" | "negative" | "positive" | "secondary" | "fullWidth" | "hovered" | "focused" | "focusVisible" | "iconLeft" | "iconRight">;
45
+ export default _default;
20
46
  //# sourceMappingURL=styles.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/Button/styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAA;AAEtD,OAAO,KAAK,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AAE7D,eAAO,MAAM,oBAAoB,SACzB,OAAO,GAAG,QAAQ,GAAG,OAAO,KACjC,MAAM,EAWR,CAAA;AAED,eAAO,MAAM,uBAAuB,YACzB,WAAW;;;;;MAYnB,MAAM,EAmIR,CAAA;AAED,eAAO,MAAM,oBAAoB;;;;;MAS7B,MAAM,EAiBT,CAAA;AAED,eAAO,MAAM,oBAAoB;;UAKzB,SAAS,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;MAC1C,MAAM,EAeT,CAAA"}
1
+ {"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/Button/styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAA;AAMrD,eAAO,MAAM,oBAAoB,gBAAiB,KAAK;;;;;;;;;;;;;;CAkBrD,CAAA;AAEF,eAAO,MAAM,WAAW,gBAAiB,KAAK;;;;CAI5C,CAAA;AAEF,eAAO,MAAM,aAAa,gBAAiB,KAAK;;;;CAI9C,CAAA;AAEF,eAAO,MAAM,aAAa,cAAe,MAAM,eAAe,KAAK;;;;;;;;;;;;;;;;CAoBjE,CAAA;gCAEqB,KAAK;AAA5B,wBAiKC"}
@@ -1,163 +1,180 @@
1
- export const createSizeClassNames = (size) => {
2
- const sizeClassNames = {
3
- small: ['min-w-14', 'h-6', 'py-0', 'px-3'],
4
- medium: ['min-w-16', 'h-8', 'py-0', 'px-4'],
5
- large: ['min-w-24', 'h-12', 'py-0', 'px-8'],
6
- };
7
- return sizeClassNames[size];
8
- };
9
- export const createVariantClassNames = (variant, { disabled, focused, hovered, active, }) => {
10
- const variantClassNames = [];
11
- switch (variant) {
12
- case 'primary':
13
- variantClassNames.push('border-none');
14
- variantClassNames.push('text-white');
15
- variantClassNames.push('visited:text-white');
16
- if (disabled) {
17
- variantClassNames.push('bg-gray-400');
18
- }
19
- else {
20
- variantClassNames.push('hover:bg-[#4269D6]');
21
- variantClassNames.push('active:bg-[#1A41AB]');
22
- if (hovered) {
23
- variantClassNames.push('bg-[#4269D6]');
24
- }
25
- else if (active) {
26
- variantClassNames.push('bg-[#1A41AB]');
27
- }
28
- else {
29
- variantClassNames.push('bg-blue-500');
30
- }
31
- }
32
- break;
33
- case 'negative':
34
- variantClassNames.push('border-none');
35
- variantClassNames.push('text-white');
36
- variantClassNames.push('visited:text-white');
37
- if (disabled) {
38
- variantClassNames.push('bg-gray-400');
39
- }
40
- else {
41
- variantClassNames.push('hover:bg-[#DB466B]');
42
- variantClassNames.push('active:bg-[#B01F43]');
43
- if (hovered) {
44
- variantClassNames.push('bg-[#DB466B]');
45
- }
46
- else if (active) {
47
- variantClassNames.push('bg-[#B01F43]');
48
- }
49
- else {
50
- variantClassNames.push('bg-red-500');
51
- }
52
- }
53
- break;
54
- case 'positive':
55
- variantClassNames.push('border-none');
56
- variantClassNames.push('text-white');
57
- variantClassNames.push('visited:text-white');
58
- if (disabled) {
59
- variantClassNames.push('bg-gray-400');
60
- }
61
- else {
62
- variantClassNames.push('hover:bg-[#27D496]');
63
- variantClassNames.push('active:bg-[#00A96C]');
64
- if (hovered) {
65
- variantClassNames.push('bg-[#27D496]');
66
- }
67
- else if (active) {
68
- variantClassNames.push('bg-[#00A96C]');
69
- }
70
- else {
71
- variantClassNames.push('bg-green-500');
72
- }
73
- }
74
- break;
75
- case 'secondary':
76
- variantClassNames.push('border border-solid');
77
- if (disabled) {
78
- variantClassNames.push('text-gray-500');
79
- variantClassNames.push('border-gray-500');
80
- variantClassNames.push('bg-white');
81
- }
82
- else {
83
- variantClassNames.push('text-black');
84
- variantClassNames.push('hover:border-black');
85
- variantClassNames.push('visited:text-black');
86
- variantClassNames.push('active:bg-gray-200');
87
- variantClassNames.push('active:border-black');
88
- if (hovered) {
89
- variantClassNames.push('border-black');
90
- variantClassNames.push('bg-white');
91
- }
92
- else if (active) {
93
- variantClassNames.push('border-black');
94
- variantClassNames.push('bg-gray-200');
95
- }
96
- else {
97
- variantClassNames.push('bg-white');
98
- variantClassNames.push('border-gray-400');
99
- }
100
- }
101
- break;
102
- case 'transparent':
103
- variantClassNames.push('border border-solid');
104
- if (disabled) {
105
- variantClassNames.push('text-white/[0.32]');
106
- variantClassNames.push('border-white/[0.32]');
107
- variantClassNames.push('bg-transparent');
108
- }
109
- else {
110
- variantClassNames.push('text-white');
111
- variantClassNames.push('visited:text-white');
112
- variantClassNames.push('border-solid');
113
- variantClassNames.push('hover:border-white');
114
- variantClassNames.push('active:border-white');
115
- variantClassNames.push('active:bg-white/[.16]');
116
- variantClassNames.push('focus-visible:shadow-[0_0_0_3px_rgba(255,255,255,0.48)]');
117
- if (hovered) {
118
- variantClassNames.push('border-white');
119
- variantClassNames.push('bg-transparent');
120
- }
121
- else if (active) {
122
- variantClassNames.push('border-white');
123
- variantClassNames.push('bg-white/[.16]');
124
- }
125
- else {
126
- variantClassNames.push('border-white/[0.32]');
127
- variantClassNames.push('bg-transparent');
128
- }
129
- if (focused) {
130
- variantClassNames.push('shadow-[0_0_0_3px_rgba(255,255,255,0.48)]');
131
- }
132
- }
133
- break;
134
- }
135
- return variantClassNames;
136
- };
137
- export const createCoreClassNames = ({ disabled, focused, active, }) => {
138
- const classNames = ['no-underline', 'rounded-sm', 'shadow-none'];
139
- if (!disabled) {
140
- classNames.push('focus-visible:shadow-[0_0_0_3px_rgba(32,78,207,0.48)]');
141
- classNames.push('focus-within:shadow-[0_0_0_3px_rgba(32,78,207,0.48)]');
142
- if (focused) {
143
- classNames.push('shadow-[0_0_0_3px_rgba(32,78,207,0.48)]');
144
- }
145
- if (active) {
146
- classNames.push('shadow-none');
147
- }
148
- }
149
- return classNames;
150
- };
151
- export const createIconClassNames = ({ iconPosition, size, }) => {
152
- const sizeClassNames = {
153
- small: [iconPosition === 'left' ? 'ml-[-0.125em]' : 'mr-[-0.125em]'],
154
- medium: [iconPosition === 'left' ? 'ml-[-0.25em]' : 'mr-[-0.25em]'],
155
- large: [iconPosition === 'left' ? 'ml-[-0.5em]' : 'mr-[-0.5em]'],
156
- };
157
- return [
158
- sizeClassNames[size].join(' '),
159
- iconPosition === 'left' ? 'mr-[0.5em]' : '',
160
- iconPosition === 'right' ? 'ml-[0.5em]' : '',
161
- ];
1
+ import { createStyles } from '@material-ui/core/styles';
2
+ import { alpha, outline, mix } from '@toptal/picasso-shared';
3
+ const ICON_SPACING = '0.5em';
4
+ export const createOutlineCommons = ({ palette }) => ({
5
+ color: palette.common.black,
6
+ backgroundColor: palette.common.white,
7
+ '&:hover, &$hovered': {
8
+ borderColor: palette.common.black,
9
+ },
10
+ // when we use <Button as={Link} />
11
+ '&&&:visited': {
12
+ color: palette.common.black,
13
+ },
14
+ '&$disabled': {
15
+ color: palette.grey.main,
16
+ borderColor: palette.grey.main,
17
+ backgroundColor: palette.common.white,
18
+ },
19
+ });
20
+ export const activeGroup = ({ palette }) => ({
21
+ backgroundColor: palette.grey.dark,
22
+ borderColor: palette.grey.dark,
23
+ color: palette.common.white,
24
+ });
25
+ export const disabledGroup = ({ palette }) => ({
26
+ color: palette.grey.main,
27
+ cursor: 'not-allowed',
28
+ pointerEvents: 'all',
29
+ });
30
+ export const createVariant = (mainColor, { palette }) => ({
31
+ border: 'none',
32
+ color: palette.common.white,
33
+ backgroundColor: mainColor,
34
+ '&:hover, &$hovered': {
35
+ backgroundColor: mix(mainColor, palette.common.white, 0.152),
36
+ },
37
+ '&:active, &$active': {
38
+ backgroundColor: mix(mainColor, palette.common.black, 0.172),
39
+ },
40
+ // when we use <Button as={Link} />
41
+ '&&&:visited': {
42
+ color: palette.common.white,
43
+ },
44
+ '&$disabled': {
45
+ backgroundColor: palette.grey.light2,
46
+ },
47
+ });
48
+ export default (theme) => {
49
+ const { palette, sizes, transitions, typography } = theme;
50
+ return createStyles({
51
+ root: {
52
+ position: 'relative',
53
+ textTransform: 'none',
54
+ borderRadius: sizes.borderRadius.small,
55
+ border: `solid ${sizes.borderWidth} ${palette.grey.light2}`,
56
+ fontSize: '1rem',
57
+ transitionDuration: `${transitions.duration.short}ms`,
58
+ transitionTimingFunction: transitions.easing.easeOut,
59
+ transitionProperty: 'border, color, background',
60
+ boxShadow: 'none',
61
+ flexShrink: 0,
62
+ '&$focusVisible, &$focused': Object.assign({}, outline(palette.primary.main)),
63
+ '&+&': {
64
+ marginLeft: '1rem',
65
+ },
66
+ },
67
+ content: {
68
+ lineHeight: '1.5em',
69
+ fontWeight: typography.fontWeights.semibold,
70
+ whiteSpace: 'nowrap',
71
+ },
72
+ loader: {
73
+ position: 'absolute',
74
+ left: '50%',
75
+ top: '50%',
76
+ transform: 'translate(-50%, -50%)',
77
+ },
78
+ // sizes
79
+ small: {
80
+ minWidth: '3.5em',
81
+ height: '1.5em',
82
+ padding: '0 0.75em',
83
+ '& $content': {
84
+ fontSize: typography.buttons.fontSizeSmall,
85
+ lineHeight: typography.buttons.lineHeightSmall,
86
+ },
87
+ '& $iconLeft': {
88
+ marginLeft: '-0.125em',
89
+ },
90
+ '& $iconRight': {
91
+ marginRight: '-0.125em',
92
+ },
93
+ },
94
+ medium: {
95
+ minWidth: '4em',
96
+ height: '2em',
97
+ padding: '0 1em',
98
+ '& $content': {
99
+ fontSize: typography.buttons.fontSizeMedium,
100
+ lineHeight: typography.buttons.lineHeightMedium,
101
+ },
102
+ '& $iconLeft': {
103
+ marginLeft: '-0.25em',
104
+ },
105
+ '& $iconRight': {
106
+ marginRight: '-0.25em',
107
+ },
108
+ },
109
+ large: {
110
+ minWidth: '6em',
111
+ height: '3em',
112
+ padding: '0 2em',
113
+ '& $content': {
114
+ fontSize: typography.buttons.fontSizeLarge,
115
+ lineHeight: typography.buttons.lineHeightLarge,
116
+ },
117
+ '& $iconLeft': {
118
+ marginLeft: '-0.5em',
119
+ },
120
+ '& $iconRight': {
121
+ marginRight: '-0.5em',
122
+ },
123
+ },
124
+ // variants
125
+ primary: createVariant(palette.primary.main, theme),
126
+ negative: createVariant(palette.red.main, theme),
127
+ positive: createVariant(palette.green.main, theme),
128
+ secondary: Object.assign(Object.assign({}, createOutlineCommons(theme)), { '&:active, &$active': {
129
+ backgroundColor: palette.grey.lighter2,
130
+ borderColor: palette.common.black,
131
+ } }),
132
+ transparent: {
133
+ color: palette.common.white,
134
+ border: `solid ${sizes.borderWidth} ${alpha(palette.common.white, 0.32)}`,
135
+ // when we use <Button as={Link} />
136
+ '&&&:visited': {
137
+ color: palette.common.white,
138
+ },
139
+ '&$focusVisible, &$focused': Object.assign({}, outline(palette.common.white)),
140
+ '&:hover, &$hovered': {
141
+ borderColor: palette.common.white,
142
+ },
143
+ '&:active, &$active': {
144
+ backgroundColor: alpha(palette.common.white, 0.16),
145
+ borderColor: palette.common.white,
146
+ },
147
+ '&$disabled': {
148
+ color: alpha(palette.common.white, 0.32),
149
+ borderColor: alpha(palette.common.white, 0.32),
150
+ backgroundColor: 'initial',
151
+ },
152
+ },
153
+ // Other props
154
+ fullWidth: {
155
+ width: '100%',
156
+ },
157
+ hovered: {},
158
+ focused: {},
159
+ active: {
160
+ boxShadow: 'none',
161
+ },
162
+ disabled: {},
163
+ focusVisible: {},
164
+ // Child elements
165
+ icon: {
166
+ fontSize: '1.2em !important',
167
+ flex: '1 1 0%', // IE11 fix
168
+ },
169
+ iconLeft: {
170
+ marginRight: ICON_SPACING,
171
+ },
172
+ iconRight: {
173
+ marginLeft: ICON_SPACING,
174
+ },
175
+ hidden: {
176
+ opacity: 0,
177
+ },
178
+ });
162
179
  };
163
180
  //# sourceMappingURL=styles.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/Button/styles.ts"],"names":[],"mappings":"AAIA,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAClC,IAAkC,EACxB,EAAE;IACZ,MAAM,cAAc,GAGhB;QACF,KAAK,EAAE,CAAC,UAAU,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,CAAC;QAC1C,MAAM,EAAE,CAAC,UAAU,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,CAAC;QAC3C,KAAK,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC;KAC5C,CAAA;IAED,OAAO,cAAc,CAAC,IAAI,CAAC,CAAA;AAC7B,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,uBAAuB,GAAG,CACrC,OAAoB,EACpB,EACE,QAAQ,EACR,OAAO,EACP,OAAO,EACP,MAAM,GAMP,EACS,EAAE;IACZ,MAAM,iBAAiB,GAAG,EAAE,CAAA;IAE5B,QAAQ,OAAO,EAAE;QACf,KAAK,SAAS;YACZ,iBAAiB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAA;YACrC,iBAAiB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAA;YACpC,iBAAiB,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAA;YAE5C,IAAI,QAAQ,EAAE;gBACZ,iBAAiB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAA;aACtC;iBAAM;gBACL,iBAAiB,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAA;gBAC5C,iBAAiB,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAA;gBAE7C,IAAI,OAAO,EAAE;oBACX,iBAAiB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAA;iBACvC;qBAAM,IAAI,MAAM,EAAE;oBACjB,iBAAiB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAA;iBACvC;qBAAM;oBACL,iBAAiB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAA;iBACtC;aACF;YAED,MAAK;QACP,KAAK,UAAU;YACb,iBAAiB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAA;YACrC,iBAAiB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAA;YACpC,iBAAiB,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAA;YAE5C,IAAI,QAAQ,EAAE;gBACZ,iBAAiB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAA;aACtC;iBAAM;gBACL,iBAAiB,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAA;gBAC5C,iBAAiB,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAA;gBAE7C,IAAI,OAAO,EAAE;oBACX,iBAAiB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAA;iBACvC;qBAAM,IAAI,MAAM,EAAE;oBACjB,iBAAiB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAA;iBACvC;qBAAM;oBACL,iBAAiB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAA;iBACrC;aACF;YACD,MAAK;QACP,KAAK,UAAU;YACb,iBAAiB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAA;YACrC,iBAAiB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAA;YACpC,iBAAiB,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAA;YAE5C,IAAI,QAAQ,EAAE;gBACZ,iBAAiB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAA;aACtC;iBAAM;gBACL,iBAAiB,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAA;gBAC5C,iBAAiB,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAA;gBAE7C,IAAI,OAAO,EAAE;oBACX,iBAAiB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAA;iBACvC;qBAAM,IAAI,MAAM,EAAE;oBACjB,iBAAiB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAA;iBACvC;qBAAM;oBACL,iBAAiB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAA;iBACvC;aACF;YACD,MAAK;QACP,KAAK,WAAW;YACd,iBAAiB,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAA;YAE7C,IAAI,QAAQ,EAAE;gBACZ,iBAAiB,CAAC,IAAI,CAAC,eAAe,CAAC,CAAA;gBACvC,iBAAiB,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAA;gBACzC,iBAAiB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAA;aACnC;iBAAM;gBACL,iBAAiB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAA;gBAEpC,iBAAiB,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAA;gBAC5C,iBAAiB,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAA;gBAE5C,iBAAiB,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAA;gBAC5C,iBAAiB,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAA;gBAE7C,IAAI,OAAO,EAAE;oBACX,iBAAiB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAA;oBACtC,iBAAiB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAA;iBACnC;qBAAM,IAAI,MAAM,EAAE;oBACjB,iBAAiB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAA;oBACtC,iBAAiB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAA;iBACtC;qBAAM;oBACL,iBAAiB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAA;oBAClC,iBAAiB,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAA;iBAC1C;aACF;YAED,MAAK;QACP,KAAK,aAAa;YAChB,iBAAiB,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAA;YAC7C,IAAI,QAAQ,EAAE;gBACZ,iBAAiB,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAA;gBAC3C,iBAAiB,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAA;gBAC7C,iBAAiB,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAA;aACzC;iBAAM;gBACL,iBAAiB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAA;gBACpC,iBAAiB,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAA;gBAC5C,iBAAiB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAA;gBAEtC,iBAAiB,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAA;gBAC5C,iBAAiB,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAA;gBAC7C,iBAAiB,CAAC,IAAI,CAAC,uBAAuB,CAAC,CAAA;gBAC/C,iBAAiB,CAAC,IAAI,CACpB,yDAAyD,CAC1D,CAAA;gBAED,IAAI,OAAO,EAAE;oBACX,iBAAiB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAA;oBACtC,iBAAiB,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAA;iBACzC;qBAAM,IAAI,MAAM,EAAE;oBACjB,iBAAiB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAA;oBACtC,iBAAiB,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAA;iBACzC;qBAAM;oBACL,iBAAiB,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAA;oBAC7C,iBAAiB,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAA;iBACzC;gBAED,IAAI,OAAO,EAAE;oBACX,iBAAiB,CAAC,IAAI,CAAC,2CAA2C,CAAC,CAAA;iBACpE;aACF;YACD,MAAK;KACR;IAED,OAAO,iBAAiB,CAAA;AAC1B,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,EACnC,QAAQ,EACR,OAAO,EACP,MAAM,GAMP,EAAY,EAAE;IACb,MAAM,UAAU,GAAG,CAAC,cAAc,EAAE,YAAY,EAAE,aAAa,CAAC,CAAA;IAEhE,IAAI,CAAC,QAAQ,EAAE;QACb,UAAU,CAAC,IAAI,CAAC,uDAAuD,CAAC,CAAA;QACxE,UAAU,CAAC,IAAI,CAAC,sDAAsD,CAAC,CAAA;QAEvE,IAAI,OAAO,EAAE;YACX,UAAU,CAAC,IAAI,CAAC,yCAAyC,CAAC,CAAA;SAC3D;QAED,IAAI,MAAM,EAAE;YACV,UAAU,CAAC,IAAI,CAAC,aAAa,CAAC,CAAA;SAC/B;KACF;IAED,OAAO,UAAU,CAAA;AACnB,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,EACnC,YAAY,EACZ,IAAI,GAIL,EAAY,EAAE;IACb,MAAM,cAAc,GAGhB;QACF,KAAK,EAAE,CAAC,YAAY,KAAK,MAAM,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,eAAe,CAAC;QACpE,MAAM,EAAE,CAAC,YAAY,KAAK,MAAM,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,cAAc,CAAC;QACnE,KAAK,EAAE,CAAC,YAAY,KAAK,MAAM,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC;KACjE,CAAA;IAED,OAAO;QACL,cAAc,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;QAC9B,YAAY,KAAK,MAAM,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE;QAC3C,YAAY,KAAK,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE;KAC7C,CAAA;AACH,CAAC,CAAA"}
1
+ {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/Button/styles.ts"],"names":[],"mappings":"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"}