@toptal/picasso-tabs 1.0.1-alpha-fx-4785-create-a-codemod-to-update-nested-imports-b62d3423a.4050

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 (103) hide show
  1. package/LICENSE +20 -0
  2. package/dist-package/src/Tab/Tab.d.ts +27 -0
  3. package/dist-package/src/Tab/Tab.d.ts.map +1 -0
  4. package/dist-package/src/Tab/Tab.js +61 -0
  5. package/dist-package/src/Tab/Tab.js.map +1 -0
  6. package/dist-package/src/Tab/index.d.ts +5 -0
  7. package/dist-package/src/Tab/index.d.ts.map +1 -0
  8. package/dist-package/src/Tab/index.js +2 -0
  9. package/dist-package/src/Tab/index.js.map +1 -0
  10. package/dist-package/src/Tab/styles.d.ts +4 -0
  11. package/dist-package/src/Tab/styles.d.ts.map +1 -0
  12. package/dist-package/src/Tab/styles.js +94 -0
  13. package/dist-package/src/Tab/styles.js.map +1 -0
  14. package/dist-package/src/TabDescription/TabDescription.d.ts +8 -0
  15. package/dist-package/src/TabDescription/TabDescription.d.ts.map +1 -0
  16. package/dist-package/src/TabDescription/TabDescription.js +12 -0
  17. package/dist-package/src/TabDescription/TabDescription.js.map +1 -0
  18. package/dist-package/src/TabDescription/index.d.ts +2 -0
  19. package/dist-package/src/TabDescription/index.d.ts.map +1 -0
  20. package/dist-package/src/TabDescription/index.js +2 -0
  21. package/dist-package/src/TabDescription/index.js.map +1 -0
  22. package/dist-package/src/TabDescription/styles.d.ts +7 -0
  23. package/dist-package/src/TabDescription/styles.d.ts.map +1 -0
  24. package/dist-package/src/TabDescription/styles.js +7 -0
  25. package/dist-package/src/TabDescription/styles.js.map +1 -0
  26. package/dist-package/src/TabLabel/TabLabel.d.ts +9 -0
  27. package/dist-package/src/TabLabel/TabLabel.d.ts.map +1 -0
  28. package/dist-package/src/TabLabel/TabLabel.js +12 -0
  29. package/dist-package/src/TabLabel/TabLabel.js.map +1 -0
  30. package/dist-package/src/TabLabel/index.d.ts +2 -0
  31. package/dist-package/src/TabLabel/index.d.ts.map +1 -0
  32. package/dist-package/src/TabLabel/index.js +2 -0
  33. package/dist-package/src/TabLabel/index.js.map +1 -0
  34. package/dist-package/src/TabScrollButton/TabScrollButton.d.ts +12 -0
  35. package/dist-package/src/TabScrollButton/TabScrollButton.d.ts.map +1 -0
  36. package/dist-package/src/TabScrollButton/TabScrollButton.js +40 -0
  37. package/dist-package/src/TabScrollButton/TabScrollButton.js.map +1 -0
  38. package/dist-package/src/TabScrollButton/index.d.ts +5 -0
  39. package/dist-package/src/TabScrollButton/index.d.ts.map +1 -0
  40. package/dist-package/src/TabScrollButton/index.js +2 -0
  41. package/dist-package/src/TabScrollButton/index.js.map +1 -0
  42. package/dist-package/src/TabScrollButton/styles.d.ts +4 -0
  43. package/dist-package/src/TabScrollButton/styles.d.ts.map +1 -0
  44. package/dist-package/src/TabScrollButton/styles.js +35 -0
  45. package/dist-package/src/TabScrollButton/styles.js.map +1 -0
  46. package/dist-package/src/Tabs/Tabs.d.ts +20 -0
  47. package/dist-package/src/Tabs/Tabs.d.ts.map +1 -0
  48. package/dist-package/src/Tabs/Tabs.js +35 -0
  49. package/dist-package/src/Tabs/Tabs.js.map +1 -0
  50. package/dist-package/src/Tabs/index.d.ts +5 -0
  51. package/dist-package/src/Tabs/index.d.ts.map +1 -0
  52. package/dist-package/src/Tabs/index.js +2 -0
  53. package/dist-package/src/Tabs/index.js.map +1 -0
  54. package/dist-package/src/Tabs/styles.d.ts +4 -0
  55. package/dist-package/src/Tabs/styles.d.ts.map +1 -0
  56. package/dist-package/src/Tabs/styles.js +41 -0
  57. package/dist-package/src/Tabs/styles.js.map +1 -0
  58. package/dist-package/src/Tabs/use-tab-action.d.ts +5 -0
  59. package/dist-package/src/Tabs/use-tab-action.d.ts.map +1 -0
  60. package/dist-package/src/Tabs/use-tab-action.js +21 -0
  61. package/dist-package/src/Tabs/use-tab-action.js.map +1 -0
  62. package/dist-package/src/TabsCompound/index.d.ts +5 -0
  63. package/dist-package/src/TabsCompound/index.d.ts.map +1 -0
  64. package/dist-package/src/TabsCompound/index.js +6 -0
  65. package/dist-package/src/TabsCompound/index.js.map +1 -0
  66. package/dist-package/src/index.d.ts +7 -0
  67. package/dist-package/src/index.d.ts.map +1 -0
  68. package/dist-package/src/index.js +7 -0
  69. package/dist-package/src/index.js.map +1 -0
  70. package/dist-package/tsconfig.tsbuildinfo +1 -0
  71. package/package.json +53 -0
  72. package/src/Tab/Tab.tsx +153 -0
  73. package/src/Tab/__snapshots__/test.tsx.snap +80 -0
  74. package/src/Tab/index.ts +6 -0
  75. package/src/Tab/story/CustomValue.example.tsx +29 -0
  76. package/src/Tab/story/Disabled.example.tsx +33 -0
  77. package/src/Tab/story/Icon.example.tsx +52 -0
  78. package/src/Tab/story/Vertical.example.tsx +83 -0
  79. package/src/Tab/story/index.jsx +29 -0
  80. package/src/Tab/styles.ts +106 -0
  81. package/src/Tab/test.tsx +77 -0
  82. package/src/TabDescription/TabDescription.tsx +31 -0
  83. package/src/TabDescription/index.ts +1 -0
  84. package/src/TabDescription/styles.ts +7 -0
  85. package/src/TabLabel/TabLabel.tsx +35 -0
  86. package/src/TabLabel/index.ts +1 -0
  87. package/src/TabScrollButton/TabScrollButton.tsx +64 -0
  88. package/src/TabScrollButton/index.ts +6 -0
  89. package/src/TabScrollButton/styles.ts +37 -0
  90. package/src/Tabs/Tabs.tsx +81 -0
  91. package/src/Tabs/__snapshots__/test.tsx.snap +346 -0
  92. package/src/Tabs/index.ts +6 -0
  93. package/src/Tabs/story/Default.example.tsx +33 -0
  94. package/src/Tabs/story/FullWidth.example.tsx +27 -0
  95. package/src/Tabs/story/ScrollButtons.example.tsx +27 -0
  96. package/src/Tabs/story/Vertical.example.tsx +84 -0
  97. package/src/Tabs/story/index.jsx +58 -0
  98. package/src/Tabs/styles.ts +45 -0
  99. package/src/Tabs/test.tsx +165 -0
  100. package/src/Tabs/use-tab-action.ts +27 -0
  101. package/src/TabsCompound/index.ts +6 -0
  102. package/src/index.ts +6 -0
  103. package/tsconfig.json +15 -0
package/LICENSE ADDED
@@ -0,0 +1,20 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2021-2022 Toptal, LLC
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy of
6
+ this software and associated documentation files (the “Software”), to deal in
7
+ the Software without restriction, including without limitation the rights to
8
+ use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
9
+ the Software, and to permit persons to whom the Software is furnished to do so,
10
+ subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
17
+ FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
18
+ COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
19
+ IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
20
+ CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
@@ -0,0 +1,27 @@
1
+ import type { ReactNode, HTMLAttributes, ReactElement } from 'react';
2
+ import React from 'react';
3
+ import type { TabProps } from '@material-ui/core';
4
+ import type { BaseProps, TextLabelProps } from '@toptal/picasso-shared';
5
+ export interface Props extends BaseProps, TextLabelProps, Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
6
+ /**
7
+ * If true, the tab will be disabled
8
+ * @default false
9
+ */
10
+ disabled?: boolean;
11
+ /** You can provide your own value. Otherwise, we fallback to the child position index */
12
+ value?: TabProps['value'];
13
+ /** The label element */
14
+ label?: ReactNode;
15
+ /** The Icon element */
16
+ icon?: ReactElement;
17
+ /** Image URL */
18
+ avatar?: string | null;
19
+ /** Description */
20
+ description?: string;
21
+ selected?: boolean;
22
+ onChange?: TabProps['onChange'];
23
+ onClick?: TabProps['onClick'];
24
+ }
25
+ export declare const Tab: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLDivElement>>;
26
+ export default Tab;
27
+ //# sourceMappingURL=Tab.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Tab.d.ts","sourceRoot":"","sources":["../../../src/Tab/Tab.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AACpE,OAAO,KAAiC,MAAM,OAAO,CAAA;AAGrD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAEjD,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AASvE,MAAM,WAAW,KACf,SAAQ,SAAS,EACf,cAAc,EACd,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IAClD;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAElB,yFAAyF;IACzF,KAAK,CAAC,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAA;IAEzB,wBAAwB;IACxB,KAAK,CAAC,EAAE,SAAS,CAAA;IAEjB,uBAAuB;IACvB,IAAI,CAAC,EAAE,YAAY,CAAA;IAEnB,gBAAgB;IAChB,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAEtB,kBAAkB;IAClB,WAAW,CAAC,EAAE,MAAM,CAAA;IAIpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,QAAQ,CAAC,UAAU,CAAC,CAAA;IAC/B,OAAO,CAAC,EAAE,QAAQ,CAAC,SAAS,CAAC,CAAA;CAC9B;AAID,eAAO,MAAM,GAAG,8EA8Cd,CAAA;AAyDF,eAAe,GAAG,CAAA"}
@@ -0,0 +1,61 @@
1
+ var __rest = (this && this.__rest) || function (s, e) {
2
+ var t = {};
3
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
4
+ t[p] = s[p];
5
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
6
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
7
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
8
+ t[p[i]] = s[p[i]];
9
+ }
10
+ return t;
11
+ };
12
+ import React, { forwardRef, useContext } from 'react';
13
+ import { makeStyles } from '@material-ui/core/styles';
14
+ import { Tab as MUITab } from '@material-ui/core';
15
+ import { useTitleCase } from '@toptal/picasso-shared';
16
+ import { UserBadge } from '@toptal/picasso-user-badge';
17
+ import styles from './styles';
18
+ import { TabsOrientationContext } from '../Tabs/Tabs';
19
+ import { TabLabel } from '../TabLabel';
20
+ import { TabDescription } from '../TabDescription';
21
+ const useStyles = makeStyles(styles, { name: 'PicassoTab' });
22
+ export const Tab = forwardRef(function Tab(props, ref) {
23
+ const { disabled, value, label, icon, selected, onChange, onClick, titleCase: propsTitleCase, description, avatar } = props, rest = __rest(props, ["disabled", "value", "label", "icon", "selected", "onChange", "onClick", "titleCase", "description", "avatar"]);
24
+ const classes = useStyles();
25
+ const titleCase = useTitleCase(propsTitleCase);
26
+ const orientation = useContext(TabsOrientationContext);
27
+ const labelComponent = getLabelComponent({
28
+ avatar,
29
+ description,
30
+ disabled,
31
+ label,
32
+ orientation,
33
+ titleCase,
34
+ });
35
+ return (React.createElement(MUITab, Object.assign({}, rest, { ref: ref, tabIndex: 0, disabled: disabled, label: labelComponent, icon: icon, value: value, selected: selected, onChange: onChange, onClick: onClick, classes: {
36
+ root: classes[orientation],
37
+ selected: classes.selected,
38
+ wrapper: classes.wrapper,
39
+ } })));
40
+ });
41
+ Tab.defaultProps = {};
42
+ Tab.displayName = 'Tab';
43
+ const getLabelComponent = ({ avatar, description, disabled, label, orientation, titleCase, }) => {
44
+ if (!label) {
45
+ return null;
46
+ }
47
+ const isHorizontal = orientation === 'horizontal';
48
+ const isCustomLabel = typeof label !== 'string';
49
+ const Label = () => (React.createElement(TabLabel, { titleCase: titleCase, label: label, orientation: orientation }));
50
+ if (isHorizontal || isCustomLabel) {
51
+ return React.createElement(Label, null);
52
+ }
53
+ if (typeof avatar === 'undefined') {
54
+ return (React.createElement(React.Fragment, null,
55
+ React.createElement(Label, null),
56
+ description && (React.createElement(TabDescription, { disabled: disabled }, description))));
57
+ }
58
+ return (React.createElement(UserBadge, { renderName: Label, name: label, avatar: avatar }, description && (React.createElement(TabDescription, { disabled: disabled }, description))));
59
+ };
60
+ export default Tab;
61
+ //# sourceMappingURL=Tab.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Tab.js","sourceRoot":"","sources":["../../../src/Tab/Tab.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,5 @@
1
+ import type { OmitInternalProps } from '@toptal/picasso-shared';
2
+ import type { Props } from './Tab';
3
+ export { default as Tab } from './Tab';
4
+ export declare type TabProps = OmitInternalProps<Props>;
5
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Tab/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAA;AAE/D,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,OAAO,CAAA;AAElC,OAAO,EAAE,OAAO,IAAI,GAAG,EAAE,MAAM,OAAO,CAAA;AACtC,oBAAY,QAAQ,GAAG,iBAAiB,CAAC,KAAK,CAAC,CAAA"}
@@ -0,0 +1,2 @@
1
+ export { default as Tab } from './Tab';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/Tab/index.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,OAAO,IAAI,GAAG,EAAE,MAAM,OAAO,CAAA"}
@@ -0,0 +1,4 @@
1
+ import type { Theme } from '@material-ui/core/styles';
2
+ declare const _default: ({ sizes, palette, shadows, transitions }: Theme) => import("@material-ui/styles").StyleRules<{}, "horizontal" | "vertical" | "selected" | "wrapper">;
3
+ export default _default;
4
+ //# sourceMappingURL=styles.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/Tab/styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAA;mEAgDK,KAAK;AAA/D,wBAyDI"}
@@ -0,0 +1,94 @@
1
+ import { createStyles } from '@material-ui/core/styles';
2
+ import { rem } from '@toptal/picasso-shared';
3
+ import { PicassoProvider } from '@toptal/picasso-provider';
4
+ PicassoProvider.override(({ breakpoints, palette }) => ({
5
+ MuiTab: {
6
+ root: {
7
+ minHeight: 0,
8
+ minWidth: 0,
9
+ lineHeight: 1,
10
+ textTransform: 'none',
11
+ padding: `${rem('9px')} 0 ${rem('7px')}`,
12
+ overflow: 'initial',
13
+ [breakpoints.up('md')]: {
14
+ padding: undefined,
15
+ },
16
+ color: palette.grey.dark,
17
+ [breakpoints.up('md')]: {
18
+ minWidth: 'auto',
19
+ fontSize: '1rem',
20
+ },
21
+ },
22
+ labelIcon: {
23
+ minHeight: 0,
24
+ paddingRight: '1.5rem',
25
+ paddingTop: rem('9px'),
26
+ '& $wrapper > *:first-child': {
27
+ position: 'absolute',
28
+ right: 0,
29
+ marginBottom: 0,
30
+ },
31
+ },
32
+ selected: {
33
+ color: palette.common.black,
34
+ },
35
+ textColorInherit: {
36
+ '&$disabled': {
37
+ color: palette.grey.main,
38
+ },
39
+ },
40
+ disabled: {},
41
+ },
42
+ }));
43
+ export default ({ sizes, palette, shadows, transitions }) => createStyles({
44
+ horizontal: {
45
+ '&:not(:last-child)': {
46
+ marginRight: '2em',
47
+ },
48
+ },
49
+ vertical: {
50
+ width: '100%',
51
+ borderRadius: `${sizes.borderRadius.small} 0 0 ${sizes.borderRadius.small}`,
52
+ margin: '0.25rem 0',
53
+ overflow: 'hidden',
54
+ padding: '0.5rem 1rem',
55
+ transition: `all ${transitions.duration.short}ms ${transitions.easing.easeInOut}`,
56
+ textAlign: 'left',
57
+ backgroundColor: palette.grey.lighter,
58
+ opacity: 1,
59
+ color: palette.grey.dark,
60
+ '&:first-child': {
61
+ marginTop: '1rem',
62
+ },
63
+ '&:last-child': {
64
+ marginBottom: '1rem',
65
+ },
66
+ '&:hover': {
67
+ color: palette.common.black,
68
+ },
69
+ '&:hover:not($selected)': {
70
+ backgroundColor: palette.grey.lighter2,
71
+ },
72
+ '& $wrapper': {
73
+ display: 'block',
74
+ },
75
+ },
76
+ selected: {
77
+ '&$vertical': {
78
+ color: palette.common.black,
79
+ boxShadow: shadows[1],
80
+ backgroundColor: palette.grey.lightest,
81
+ '&::before': {
82
+ content: '""',
83
+ background: palette.blue.main,
84
+ position: 'absolute',
85
+ left: 0,
86
+ top: 0,
87
+ bottom: 0,
88
+ width: '3px',
89
+ },
90
+ },
91
+ },
92
+ wrapper: {},
93
+ });
94
+ //# sourceMappingURL=styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/Tab/styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAA;AACvD,OAAO,EAAE,GAAG,EAAE,MAAM,wBAAwB,CAAA;AAC5C,OAAO,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAA;AAE1D,eAAe,CAAC,QAAQ,CAAC,CAAC,EAAE,WAAW,EAAE,OAAO,EAAS,EAAE,EAAE,CAAC,CAAC;IAC7D,MAAM,EAAE;QACN,IAAI,EAAE;YACJ,SAAS,EAAE,CAAC;YACZ,QAAQ,EAAE,CAAC;YACX,UAAU,EAAE,CAAC;YACb,aAAa,EAAE,MAAM;YACrB,OAAO,EAAE,GAAG,GAAG,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,KAAK,CAAC,EAAE;YACxC,QAAQ,EAAE,SAAS;YAEnB,CAAC,WAAW,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,EAAE;gBACtB,OAAO,EAAE,SAAS;aACnB;YAED,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;YAExB,CAAC,WAAW,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,EAAE;gBACtB,QAAQ,EAAE,MAAM;gBAChB,QAAQ,EAAE,MAAM;aACjB;SACF;QACD,SAAS,EAAE;YACT,SAAS,EAAE,CAAC;YACZ,YAAY,EAAE,QAAQ;YACtB,UAAU,EAAE,GAAG,CAAC,KAAK,CAAC;YACtB,4BAA4B,EAAE;gBAC5B,QAAQ,EAAE,UAAU;gBACpB,KAAK,EAAE,CAAC;gBACR,YAAY,EAAE,CAAC;aAChB;SACF;QACD,QAAQ,EAAE;YACR,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,KAAK;SAC5B;QACD,gBAAgB,EAAE;YAChB,YAAY,EAAE;gBACZ,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;aACzB;SACF;QACD,QAAQ,EAAE,EAAE;KACb;CACF,CAAC,CAAC,CAAA;AAEH,eAAe,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,WAAW,EAAS,EAAE,EAAE,CACjE,YAAY,CAAC;IACX,UAAU,EAAE;QACV,oBAAoB,EAAE;YACpB,WAAW,EAAE,KAAK;SACnB;KACF;IACD,QAAQ,EAAE;QACR,KAAK,EAAE,MAAM;QACb,YAAY,EAAE,GAAG,KAAK,CAAC,YAAY,CAAC,KAAK,QAAQ,KAAK,CAAC,YAAY,CAAC,KAAK,EAAE;QAC3E,MAAM,EAAE,WAAW;QACnB,QAAQ,EAAE,QAAQ;QAClB,OAAO,EAAE,aAAa;QACtB,UAAU,EAAE,OAAO,WAAW,CAAC,QAAQ,CAAC,KAAK,MAAM,WAAW,CAAC,MAAM,CAAC,SAAS,EAAE;QACjF,SAAS,EAAE,MAAM;QACjB,eAAe,EAAE,OAAO,CAAC,IAAI,CAAC,OAAO;QACrC,OAAO,EAAE,CAAC;QACV,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;QAExB,eAAe,EAAE;YACf,SAAS,EAAE,MAAM;SAClB;QAED,cAAc,EAAE;YACd,YAAY,EAAE,MAAM;SACrB;QAED,SAAS,EAAE;YACT,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,KAAK;SAC5B;QAED,wBAAwB,EAAE;YACxB,eAAe,EAAE,OAAO,CAAC,IAAI,CAAC,QAAQ;SACvC;QAED,YAAY,EAAE;YACZ,OAAO,EAAE,OAAO;SACjB;KACF;IACD,QAAQ,EAAE;QACR,YAAY,EAAE;YACZ,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,KAAK;YAC3B,SAAS,EAAE,OAAO,CAAC,CAAC,CAAC;YACrB,eAAe,EAAE,OAAO,CAAC,IAAI,CAAC,QAAQ;YAEtC,WAAW,EAAE;gBACX,OAAO,EAAE,IAAI;gBACb,UAAU,EAAE,OAAO,CAAC,IAAI,CAAC,IAAI;gBAC7B,QAAQ,EAAE,UAAU;gBACpB,IAAI,EAAE,CAAC;gBACP,GAAG,EAAE,CAAC;gBACN,MAAM,EAAE,CAAC;gBACT,KAAK,EAAE,KAAK;aACb;SACF;KACF;IACD,OAAO,EAAE,EAAE;CACZ,CAAC,CAAA"}
@@ -0,0 +1,8 @@
1
+ /// <reference types="react" />
2
+ interface Props {
3
+ children: string;
4
+ disabled?: boolean;
5
+ }
6
+ declare const TabDescription: ({ children, disabled }: Props) => JSX.Element;
7
+ export default TabDescription;
8
+ //# sourceMappingURL=TabDescription.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TabDescription.d.ts","sourceRoot":"","sources":["../../../src/TabDescription/TabDescription.tsx"],"names":[],"mappings":";AAOA,UAAU,KAAK;IACb,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAID,QAAA,MAAM,cAAc,2BAA4B,KAAK,gBAcpD,CAAA;AAED,eAAe,cAAc,CAAA"}
@@ -0,0 +1,12 @@
1
+ import React from 'react';
2
+ import { makeStyles } from '@material-ui/core/styles';
3
+ import { TypographyOverflow } from '@toptal/picasso-typography-overflow';
4
+ import styles from './styles';
5
+ const useStyles = makeStyles(styles, { name: 'PicassoTabDescription' });
6
+ const TabDescription = ({ children, disabled }) => {
7
+ const classes = useStyles();
8
+ const color = disabled ? 'inherit' : undefined;
9
+ return (React.createElement(TypographyOverflow, { className: classes.root, size: 'xxsmall', inline: true, color: color }, children));
10
+ };
11
+ export default TabDescription;
12
+ //# sourceMappingURL=TabDescription.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TabDescription.js","sourceRoot":"","sources":["../../../src/TabDescription/TabDescription.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AACrD,OAAO,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAA;AAExE,OAAO,MAAM,MAAM,UAAU,CAAA;AAO7B,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE,EAAE,IAAI,EAAE,uBAAuB,EAAE,CAAC,CAAA;AAE9E,MAAM,cAAc,GAAG,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAS,EAAE,EAAE;IACvD,MAAM,OAAO,GAAG,SAAS,EAAE,CAAA;IAC3B,MAAM,KAAK,GAAG,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAA;IAE9C,OAAO,CACL,oBAAC,kBAAkB,IACjB,SAAS,EAAE,OAAO,CAAC,IAAI,EACvB,IAAI,EAAC,SAAS,EACd,MAAM,QACN,KAAK,EAAE,KAAK,IAEX,QAAQ,CACU,CACtB,CAAA;AACH,CAAC,CAAA;AAED,eAAe,cAAc,CAAA"}
@@ -0,0 +1,2 @@
1
+ export { default as TabDescription } from './TabDescription';
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/TabDescription/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAA"}
@@ -0,0 +1,2 @@
1
+ export { default as TabDescription } from './TabDescription';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/TabDescription/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAA"}
@@ -0,0 +1,7 @@
1
+ declare const _default: {
2
+ root: {
3
+ marginTop: string;
4
+ };
5
+ };
6
+ export default _default;
7
+ //# sourceMappingURL=styles.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/TabDescription/styles.ts"],"names":[],"mappings":";;;;;AAEA,wBAIC"}
@@ -0,0 +1,7 @@
1
+ import { rem } from '@toptal/picasso-shared';
2
+ export default {
3
+ root: {
4
+ marginTop: rem('2px'),
5
+ },
6
+ };
7
+ //# sourceMappingURL=styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/TabDescription/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,wBAAwB,CAAA;AAE5C,eAAe;IACb,IAAI,EAAE;QACJ,SAAS,EAAE,GAAG,CAAC,KAAK,CAAC;KACtB;CACF,CAAA"}
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ interface Props {
3
+ label?: React.ReactNode;
4
+ orientation: 'horizontal' | 'vertical';
5
+ titleCase?: boolean;
6
+ }
7
+ declare const TabLabel: ({ label, orientation, titleCase }: Props) => JSX.Element;
8
+ export default TabLabel;
9
+ //# sourceMappingURL=TabLabel.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TabLabel.d.ts","sourceRoot":"","sources":["../../../src/TabLabel/TabLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,UAAU,KAAK;IACb,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,WAAW,EAAE,YAAY,GAAG,UAAU,CAAA;IACtC,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB;AAED,QAAA,MAAM,QAAQ,sCAAuC,KAAK,gBAqBzD,CAAA;AAED,eAAe,QAAQ,CAAA"}
@@ -0,0 +1,12 @@
1
+ import React from 'react';
2
+ import { TypographyOverflow } from '@toptal/picasso-typography-overflow';
3
+ import { Typography } from '@toptal/picasso-typography';
4
+ import { toTitleCase } from '@toptal/picasso-utils';
5
+ const TabLabel = ({ label, orientation, titleCase }) => {
6
+ if (orientation === 'horizontal') {
7
+ return (React.createElement(Typography, { as: 'div', size: 'small', weight: 'semibold', color: 'inherit' }, titleCase ? toTitleCase(label) : label));
8
+ }
9
+ return (React.createElement(TypographyOverflow, { as: 'div', color: 'inherit', inline: true, size: 'medium', variant: 'body', weight: 'semibold' }, titleCase ? toTitleCase(label) : label));
10
+ };
11
+ export default TabLabel;
12
+ //# sourceMappingURL=TabLabel.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TabLabel.js","sourceRoot":"","sources":["../../../src/TabLabel/TabLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAA;AACxE,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAA;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AAQnD,MAAM,QAAQ,GAAG,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,SAAS,EAAS,EAAE,EAAE;IAC5D,IAAI,WAAW,KAAK,YAAY,EAAE;QAChC,OAAO,CACL,oBAAC,UAAU,IAAC,EAAE,EAAC,KAAK,EAAC,IAAI,EAAC,OAAO,EAAC,MAAM,EAAC,UAAU,EAAC,KAAK,EAAC,SAAS,IAChE,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAC5B,CACd,CAAA;KACF;IAED,OAAO,CACL,oBAAC,kBAAkB,IACjB,EAAE,EAAC,KAAK,EACR,KAAK,EAAC,SAAS,EACf,MAAM,QACN,IAAI,EAAC,QAAQ,EACb,OAAO,EAAC,MAAM,EACd,MAAM,EAAC,UAAU,IAEhB,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CACpB,CACtB,CAAA;AACH,CAAC,CAAA;AAED,eAAe,QAAQ,CAAA"}
@@ -0,0 +1,2 @@
1
+ export { default as TabLabel } from './TabLabel';
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/TabLabel/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAA"}
@@ -0,0 +1,2 @@
1
+ export { default as TabLabel } from './TabLabel';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/TabLabel/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAA"}
@@ -0,0 +1,12 @@
1
+ import React from 'react';
2
+ import type { BaseProps } from '@toptal/picasso-shared';
3
+ declare type DirectionType = 'left' | 'right';
4
+ export interface Props extends BaseProps {
5
+ /** The direction the button should indicate. */
6
+ direction: DirectionType;
7
+ /** If `true`, the component is disabled. */
8
+ disabled?: boolean;
9
+ }
10
+ export declare const TabScrollButton: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLDivElement>>;
11
+ export default TabScrollButton;
12
+ //# sourceMappingURL=TabScrollButton.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TabScrollButton.d.ts","sourceRoot":"","sources":["../../../src/TabScrollButton/TabScrollButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAqB,MAAM,OAAO,CAAA;AAGzC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAMvD,aAAK,aAAa,GAAG,MAAM,GAAG,OAAO,CAAA;AAErC,MAAM,WAAW,KAAM,SAAQ,SAAS;IACtC,gDAAgD;IAChD,SAAS,EAAE,aAAa,CAAA;IACxB,4CAA4C;IAC5C,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAMD,eAAO,MAAM,eAAe,8EAoC3B,CAAA;AAID,eAAe,eAAe,CAAA"}
@@ -0,0 +1,40 @@
1
+ var __rest = (this && this.__rest) || function (s, e) {
2
+ var t = {};
3
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
4
+ t[p] = s[p];
5
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
6
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
7
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
8
+ t[p[i]] = s[p[i]];
9
+ }
10
+ return t;
11
+ };
12
+ import cx from 'classnames';
13
+ import React, { forwardRef } from 'react';
14
+ import { ButtonBase } from '@material-ui/core';
15
+ import { makeStyles } from '@material-ui/core/styles';
16
+ import { BackMinor16, ChevronMinor16 } from '@toptal/picasso-icons';
17
+ import { Container } from '@toptal/picasso-container';
18
+ import styles from './styles';
19
+ const useStyles = makeStyles(styles, {
20
+ name: 'PicassoTabScrollButton',
21
+ });
22
+ export const TabScrollButton = forwardRef(function TabScrollButton(props, ref) {
23
+ const { className, style, direction, disabled } = props, rest = __rest(props, ["className", "style", "direction", "disabled"]);
24
+ const classes = useStyles();
25
+ if (disabled) {
26
+ return null;
27
+ }
28
+ return (React.createElement(Container, Object.assign({}, rest, { ref: ref, className: cx(classes.root, className), style: style }),
29
+ React.createElement(Container, { className: cx(classes.gradient, {
30
+ [classes.left]: direction === 'left',
31
+ [classes.right]: direction === 'right',
32
+ }) },
33
+ React.createElement(ButtonBase, { className: cx(classes.button, {
34
+ [classes.left]: direction === 'left',
35
+ [classes.right]: direction === 'right',
36
+ }), "aria-label": `${direction} button`, "data-testid": `tab-scroll-button-${direction}` }, direction === 'left' ? React.createElement(BackMinor16, null) : React.createElement(ChevronMinor16, null)))));
37
+ });
38
+ TabScrollButton.displayName = 'TabScrollButton';
39
+ export default TabScrollButton;
40
+ //# sourceMappingURL=TabScrollButton.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TabScrollButton.js","sourceRoot":"","sources":["../../../src/TabScrollButton/TabScrollButton.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAA;AAC9C,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AAErD,OAAO,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAA;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AAErD,OAAO,MAAM,MAAM,UAAU,CAAA;AAW7B,MAAM,SAAS,GAAG,UAAU,CAAC,MAAM,EAAE;IACnC,IAAI,EAAE,wBAAwB;CAC/B,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,UAAU,CACvC,SAAS,eAAe,CAAC,KAAK,EAAE,GAAG;IACjC,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,KAAc,KAAK,EAAd,IAAI,UAAK,KAAK,EAA1D,+CAAkD,CAAQ,CAAA;IAChE,MAAM,OAAO,GAAG,SAAS,EAAE,CAAA;IAE3B,IAAI,QAAQ,EAAE;QACZ,OAAO,IAAI,CAAA;KACZ;IAED,OAAO,CACL,oBAAC,SAAS,oBACJ,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,SAAS,CAAC,EACtC,KAAK,EAAE,KAAK;QAEZ,oBAAC,SAAS,IACR,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,QAAQ,EAAE;gBAC9B,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,SAAS,KAAK,MAAM;gBACpC,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,SAAS,KAAK,OAAO;aACvC,CAAC;YAEF,oBAAC,UAAU,IACT,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,MAAM,EAAE;oBAC5B,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,SAAS,KAAK,MAAM;oBACpC,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,SAAS,KAAK,OAAO;iBACvC,CAAC,gBACU,GAAG,SAAS,SAAS,iBACpB,qBAAqB,SAAS,EAAE,IAE5C,SAAS,KAAK,MAAM,CAAC,CAAC,CAAC,oBAAC,WAAW,OAAG,CAAC,CAAC,CAAC,oBAAC,cAAc,OAAG,CACjD,CACH,CACF,CACb,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,CAAC,WAAW,GAAG,iBAAiB,CAAA;AAE/C,eAAe,eAAe,CAAA"}
@@ -0,0 +1,5 @@
1
+ import type { OmitInternalProps } from '@toptal/picasso-shared';
2
+ import type { Props } from './TabScrollButton';
3
+ export { default as TabScrollButton } from './TabScrollButton';
4
+ export declare type TabScrollButtonProps = OmitInternalProps<Props>;
5
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/TabScrollButton/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAA;AAE/D,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAE9C,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAC9D,oBAAY,oBAAoB,GAAG,iBAAiB,CAAC,KAAK,CAAC,CAAA"}
@@ -0,0 +1,2 @@
1
+ export { default as TabScrollButton } from './TabScrollButton';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/TabScrollButton/index.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAA"}
@@ -0,0 +1,4 @@
1
+ import type { Theme } from '@material-ui/core/styles';
2
+ declare const _default: ({ palette }: Theme) => import("@material-ui/styles").StyleRules<{}, "root" | "left" | "right" | "button" | "gradient">;
3
+ export default _default;
4
+ //# sourceMappingURL=styles.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/TabScrollButton/styles.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAA;sCAGxB,KAAK;AAAlC,wBAgCC"}
@@ -0,0 +1,35 @@
1
+ import { createStyles } from '@material-ui/core';
2
+ import { alpha } from '@toptal/picasso-shared';
3
+ export default ({ palette }) => {
4
+ const color = palette.common.white;
5
+ const colorStops = `${color} 0%, ${color} 50%, ${alpha(color, 0)} 100%`;
6
+ return createStyles({
7
+ root: {
8
+ position: 'relative',
9
+ },
10
+ gradient: {
11
+ position: 'absolute',
12
+ width: '2.5rem',
13
+ height: '100%',
14
+ zIndex: 2,
15
+ '&$left': {
16
+ background: `linear-gradient(90deg, ${colorStops})`,
17
+ },
18
+ '&$right': {
19
+ background: `linear-gradient(270deg, ${colorStops})`,
20
+ },
21
+ },
22
+ button: {
23
+ position: 'absolute',
24
+ width: '1rem',
25
+ height: '100%',
26
+ },
27
+ left: {
28
+ left: 0,
29
+ },
30
+ right: {
31
+ right: 0,
32
+ },
33
+ });
34
+ };
35
+ //# sourceMappingURL=styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/TabScrollButton/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAEhD,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAA;AAE9C,eAAe,CAAC,EAAE,OAAO,EAAS,EAAE,EAAE;IACpC,MAAM,KAAK,GAAG,OAAO,CAAC,MAAM,CAAC,KAAK,CAAA;IAClC,MAAM,UAAU,GAAG,GAAG,KAAK,QAAQ,KAAK,SAAS,KAAK,CAAC,KAAK,EAAE,CAAC,CAAC,OAAO,CAAA;IAEvE,OAAO,YAAY,CAAC;QAClB,IAAI,EAAE;YACJ,QAAQ,EAAE,UAAU;SACrB;QACD,QAAQ,EAAE;YACR,QAAQ,EAAE,UAAU;YACpB,KAAK,EAAE,QAAQ;YACf,MAAM,EAAE,MAAM;YACd,MAAM,EAAE,CAAC;YACT,QAAQ,EAAE;gBACR,UAAU,EAAE,0BAA0B,UAAU,GAAG;aACpD;YACD,SAAS,EAAE;gBACT,UAAU,EAAE,2BAA2B,UAAU,GAAG;aACrD;SACF;QACD,MAAM,EAAE;YACN,QAAQ,EAAE,UAAU;YACpB,KAAK,EAAE,MAAM;YACb,MAAM,EAAE,MAAM;SACf;QACD,IAAI,EAAE;YACJ,IAAI,EAAE,CAAC;SACR;QACD,KAAK,EAAE;YACL,KAAK,EAAE,CAAC;SACT;KACF,CAAC,CAAA;AACJ,CAAC,CAAA"}
@@ -0,0 +1,20 @@
1
+ import type { ReactNode } from 'react';
2
+ import React from 'react';
3
+ import type { TabsProps } from '@material-ui/core';
4
+ import type { ButtonOrAnchorProps, BaseProps } from '@toptal/picasso-shared';
5
+ export interface Props extends BaseProps, Omit<ButtonOrAnchorProps, 'onChange'> {
6
+ /** Tabs content containing Tab components */
7
+ children: ReactNode;
8
+ /** Callback fired when the value changes. */
9
+ onChange?: (event: React.ChangeEvent<{}>, value: TabsProps['value']) => void;
10
+ /** The value of the currently selected Tab. If you don't want any selected Tab, you can set this property to false. */
11
+ value: TabsProps['value'];
12
+ /** The tabs orientation (layout flow direction). */
13
+ orientation?: 'horizontal' | 'vertical';
14
+ /** Determines additional display behavior of the tabs */
15
+ variant?: Extract<TabsProps['variant'], 'scrollable' | 'fullWidth'>;
16
+ }
17
+ export declare const TabsOrientationContext: React.Context<"horizontal" | "vertical">;
18
+ export declare const Tabs: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLButtonElement>>;
19
+ export default Tabs;
20
+ //# sourceMappingURL=Tabs.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../src/Tabs/Tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,KAAqB,MAAM,OAAO,CAAA;AAGzC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAA;AAElD,OAAO,KAAK,EAAE,mBAAmB,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAM5E,MAAM,WAAW,KACf,SAAQ,SAAS,EACf,IAAI,CAAC,mBAAmB,EAAE,UAAU,CAAC;IACvC,6CAA6C;IAC7C,QAAQ,EAAE,SAAS,CAAA;IAEnB,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,CAAC,OAAO,CAAC,KAAK,IAAI,CAAA;IAE5E,uHAAuH;IACvH,KAAK,EAAE,SAAS,CAAC,OAAO,CAAC,CAAA;IAEzB,oDAAoD;IACpD,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IAEvC,yDAAyD;IACzD,OAAO,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,SAAS,CAAC,EAAE,YAAY,GAAG,WAAW,CAAC,CAAA;CACpE;AAMD,eAAO,MAAM,sBAAsB,0CAEpB,CAAA;AAGf,eAAO,MAAM,IAAI,iFAiCf,CAAA;AAOF,eAAe,IAAI,CAAA"}
@@ -0,0 +1,35 @@
1
+ var __rest = (this && this.__rest) || function (s, e) {
2
+ var t = {};
3
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
4
+ t[p] = s[p];
5
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
6
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
7
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
8
+ t[p[i]] = s[p[i]];
9
+ }
10
+ return t;
11
+ };
12
+ import React, { forwardRef } from 'react';
13
+ import { makeStyles } from '@material-ui/core/styles';
14
+ import { Tabs as MUITabs } from '@material-ui/core';
15
+ import { TabScrollButton } from '../TabScrollButton';
16
+ import styles from './styles';
17
+ import useTabAction from './use-tab-action';
18
+ const useStyles = makeStyles(styles, {
19
+ name: 'Tabs',
20
+ });
21
+ export const TabsOrientationContext = React.createContext('horizontal');
22
+ // eslint-disable-next-line react/display-name
23
+ export const Tabs = forwardRef(function Tabs(props, ref) {
24
+ const { children, orientation, onChange, value, variant = 'scrollable' } = props, rest = __rest(props, ["children", "orientation", "onChange", "value", "variant"]);
25
+ const classes = useStyles(props);
26
+ const action = useTabAction();
27
+ return (React.createElement(TabsOrientationContext.Provider, { value: orientation },
28
+ React.createElement(MUITabs, Object.assign({}, rest, { classes: { root: classes[orientation] }, ref: ref, onChange: onChange, value: value, action: action, scrollButtons: 'auto', ScrollButtonComponent: TabScrollButton, orientation: orientation, variant: variant }), children)));
29
+ });
30
+ Tabs.displayName = 'Tabs';
31
+ Tabs.defaultProps = {
32
+ orientation: 'horizontal',
33
+ };
34
+ export default Tabs;
35
+ //# sourceMappingURL=Tabs.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../../src/Tabs/Tabs.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AAErD,OAAO,EAAE,IAAI,IAAI,OAAO,EAAE,MAAM,mBAAmB,CAAA;AAGnD,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AACpD,OAAO,MAAM,MAAM,UAAU,CAAA;AAC7B,OAAO,YAAY,MAAM,kBAAkB,CAAA;AAqB3C,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE;IAC1C,IAAI,EAAE,MAAM;CACb,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,sBAAsB,GAAG,KAAK,CAAC,aAAa,CAEvD,YAAY,CAAC,CAAA;AAEf,8CAA8C;AAC9C,MAAM,CAAC,MAAM,IAAI,GAAG,UAAU,CAA2B,SAAS,IAAI,CACpE,KAAK,EACL,GAAG;IAEH,MAAM,EACJ,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,KAAK,EACL,OAAO,GAAG,YAAY,KAEpB,KAAK,EADJ,IAAI,UACL,KAAK,EAPH,2DAOL,CAAQ,CAAA;IACT,MAAM,OAAO,GAAG,SAAS,CAAC,KAAK,CAAC,CAAA;IAChC,MAAM,MAAM,GAAG,YAAY,EAAE,CAAA;IAE7B,OAAO,CACL,oBAAC,sBAAsB,CAAC,QAAQ,IAAC,KAAK,EAAE,WAAY;QAClD,oBAAC,OAAO,oBACF,IAAI,IACR,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,CAAC,WAAY,CAAC,EAAE,EACxC,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,EACd,aAAa,EAAC,MAAM,EACpB,qBAAqB,EAAE,eAAe,EACtC,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,OAAO,KAEf,QAAQ,CACD,CACsB,CACnC,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,IAAI,CAAC,WAAW,GAAG,MAAM,CAAA;AACzB,IAAI,CAAC,YAAY,GAAG;IAClB,WAAW,EAAE,YAAY;CAC1B,CAAA;AAED,eAAe,IAAI,CAAA"}
@@ -0,0 +1,5 @@
1
+ import type { OmitInternalProps } from '@toptal/picasso-shared';
2
+ import type { Props } from './Tabs';
3
+ export { default as Tabs } from './Tabs';
4
+ export declare type TabsProps = OmitInternalProps<Props>;
5
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Tabs/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAA;AAE/D,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,QAAQ,CAAA;AAEnC,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAA;AACxC,oBAAY,SAAS,GAAG,iBAAiB,CAAC,KAAK,CAAC,CAAA"}
@@ -0,0 +1,2 @@
1
+ export { default as Tabs } from './Tabs';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/Tabs/index.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAA"}
@@ -0,0 +1,4 @@
1
+ import type { Theme } from '@material-ui/core/styles';
2
+ declare const _default: ({ palette }: Theme) => import("@material-ui/styles").StyleRules<{}, "horizontal" | "vertical">;
3
+ export default _default;
4
+ //# sourceMappingURL=styles.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/Tabs/styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAA;sCA6BxB,KAAK;AAAlC,wBAeI"}