@peculiar/react-components 1.8.4 → 1.8.6

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 (42) hide show
  1. package/dist/cjs/SegmentedControls/index.js +8 -0
  2. package/dist/cjs/SegmentedControls/index.js.map +1 -0
  3. package/dist/cjs/SegmentedControls/segmented_control.js +149 -0
  4. package/dist/cjs/SegmentedControls/segmented_control.js.map +1 -0
  5. package/dist/cjs/SegmentedControls/segmented_controls.js +82 -0
  6. package/dist/cjs/SegmentedControls/segmented_controls.js.map +1 -0
  7. package/dist/cjs/Tabs/tab.js +12 -22
  8. package/dist/cjs/Tabs/tab.js.map +1 -1
  9. package/dist/cjs/Tabs/tabs.js +0 -4
  10. package/dist/cjs/Tabs/tabs.js.map +1 -1
  11. package/dist/cjs/index.js +1 -0
  12. package/dist/cjs/index.js.map +1 -1
  13. package/dist/esm/SegmentedControls/index.js +3 -0
  14. package/dist/esm/SegmentedControls/index.js.map +1 -0
  15. package/dist/esm/SegmentedControls/segmented_control.js +110 -0
  16. package/dist/esm/SegmentedControls/segmented_control.js.map +1 -0
  17. package/dist/esm/SegmentedControls/segmented_controls.js +43 -0
  18. package/dist/esm/SegmentedControls/segmented_controls.js.map +1 -0
  19. package/dist/esm/Tabs/tab.js +12 -22
  20. package/dist/esm/Tabs/tab.js.map +1 -1
  21. package/dist/esm/Tabs/tabs.js +0 -4
  22. package/dist/esm/Tabs/tabs.js.map +1 -1
  23. package/dist/esm/index.js +1 -0
  24. package/dist/esm/index.js.map +1 -1
  25. package/dist/esnext/SegmentedControls/index.js +3 -0
  26. package/dist/esnext/SegmentedControls/index.js.map +1 -0
  27. package/dist/esnext/SegmentedControls/segmented_control.js +104 -0
  28. package/dist/esnext/SegmentedControls/segmented_control.js.map +1 -0
  29. package/dist/esnext/SegmentedControls/segmented_controls.js +32 -0
  30. package/dist/esnext/SegmentedControls/segmented_controls.js.map +1 -0
  31. package/dist/esnext/Tabs/tab.js +11 -21
  32. package/dist/esnext/Tabs/tab.js.map +1 -1
  33. package/dist/esnext/Tabs/tabs.js +0 -4
  34. package/dist/esnext/Tabs/tabs.js.map +1 -1
  35. package/dist/esnext/index.js +1 -0
  36. package/dist/esnext/index.js.map +1 -1
  37. package/dist/types/SegmentedControls/index.d.ts +3 -0
  38. package/dist/types/SegmentedControls/segmented_control.d.ts +36 -0
  39. package/dist/types/SegmentedControls/segmented_controls.d.ts +28 -0
  40. package/dist/types/Tabs/tab.d.ts +0 -5
  41. package/dist/types/index.d.ts +1 -0
  42. package/package.json +2 -2
@@ -0,0 +1,8 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.SegmentedControl = exports.SegmentedControls = void 0;
4
+ var segmented_controls_1 = require("./segmented_controls");
5
+ Object.defineProperty(exports, "SegmentedControls", { enumerable: true, get: function () { return segmented_controls_1.SegmentedControls; } });
6
+ var segmented_control_1 = require("./segmented_control");
7
+ Object.defineProperty(exports, "SegmentedControl", { enumerable: true, get: function () { return segmented_control_1.SegmentedControl; } });
8
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/SegmentedControls/index.ts"],"names":[],"mappings":";;;AAAA,2DAAyD;AAAhD,uHAAA,iBAAiB,OAAA;AAC1B,yDAAuD;AAA9C,qHAAA,gBAAgB,OAAA"}
@@ -0,0 +1,149 @@
1
+ "use strict";
2
+ var __assign = (this && this.__assign) || function () {
3
+ __assign = Object.assign || function(t) {
4
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
5
+ s = arguments[i];
6
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
+ t[p] = s[p];
8
+ }
9
+ return t;
10
+ };
11
+ return __assign.apply(this, arguments);
12
+ };
13
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
14
+ if (k2 === undefined) k2 = k;
15
+ var desc = Object.getOwnPropertyDescriptor(m, k);
16
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
17
+ desc = { enumerable: true, get: function() { return m[k]; } };
18
+ }
19
+ Object.defineProperty(o, k2, desc);
20
+ }) : (function(o, m, k, k2) {
21
+ if (k2 === undefined) k2 = k;
22
+ o[k2] = m[k];
23
+ }));
24
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
25
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
26
+ }) : function(o, v) {
27
+ o["default"] = v;
28
+ });
29
+ var __importStar = (this && this.__importStar) || (function () {
30
+ var ownKeys = function(o) {
31
+ ownKeys = Object.getOwnPropertyNames || function (o) {
32
+ var ar = [];
33
+ for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
34
+ return ar;
35
+ };
36
+ return ownKeys(o);
37
+ };
38
+ return function (mod) {
39
+ if (mod && mod.__esModule) return mod;
40
+ var result = {};
41
+ if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
42
+ __setModuleDefault(result, mod);
43
+ return result;
44
+ };
45
+ })();
46
+ var __rest = (this && this.__rest) || function (s, e) {
47
+ var t = {};
48
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
49
+ t[p] = s[p];
50
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
51
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
52
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
53
+ t[p[i]] = s[p[i]];
54
+ }
55
+ return t;
56
+ };
57
+ var __importDefault = (this && this.__importDefault) || function (mod) {
58
+ return (mod && mod.__esModule) ? mod : { "default": mod };
59
+ };
60
+ Object.defineProperty(exports, "__esModule", { value: true });
61
+ exports.SegmentedControl = void 0;
62
+ var React = __importStar(require("react"));
63
+ var styled_1 = __importDefault(require("@emotion/styled"));
64
+ var is_prop_valid_1 = __importDefault(require("@emotion/is-prop-valid"));
65
+ var Typography_1 = require("../Typography");
66
+ /**
67
+ *
68
+ */
69
+ /**
70
+ * Styles.
71
+ */
72
+ var SegmentedControlRoot = (0, styled_1.default)('button', {
73
+ shouldForwardProp: is_prop_valid_1.default,
74
+ })(function (props) { return (__assign({ fontFamily: 'inherit', outline: 'none', cursor: 'pointer', boxSizing: 'border-box', border: '1px solid transparent', minHeight: 'calc(var(--pv-size-base) * 4 + 2px)', height: '100%', padding: '0 calc(var(--pv-size-base) * 2)', borderRadius: 'calc(var(--pv-size-base) * 4)', transition: 'background-color 200ms, color 200ms, border-color 200ms, box-shadow 200ms', display: 'inline-flex', alignItems: 'center', justifyContent: 'center', textDecoration: 'none' }, (props.selected && ({
75
+ boxShadow: 'var(--pv-shadow-light-soft)',
76
+ pointerEvents: 'none',
77
+ })))); }, function (props) {
78
+ var isDark = props.theme.mode === 'dark';
79
+ var color = 'var(--pv-color-gray-10)';
80
+ var colorDisabled = isDark
81
+ ? 'var(--pv-color-gray-5)'
82
+ : 'var(--pv-color-gray-8)';
83
+ var backgroundColor = 'transparent';
84
+ var backgroundColorHover = 'var(--pv-color-gray-5)';
85
+ var backgroundColorActive = 'var(--pv-color-gray-6)';
86
+ var borderColor = 'transparent';
87
+ var borderColorHover = 'var(--pv-color-gray-5)';
88
+ var borderColorActive = 'var(--pv-color-gray-6)';
89
+ if (isDark) {
90
+ backgroundColorHover = 'var(--pv-color-gray-4)';
91
+ backgroundColorActive = 'var(--pv-color-gray-5)';
92
+ borderColorHover = 'var(--pv-color-gray-4)';
93
+ borderColorActive = 'var(--pv-color-gray-5)';
94
+ color = 'var(--pv-color-gray-8)';
95
+ }
96
+ if (props.selected) {
97
+ if (isDark) {
98
+ backgroundColor = 'var(--pv-color-gray-6)';
99
+ color = 'var(--pv-color-white)';
100
+ borderColor = 'var(--pv-color-gray-5)';
101
+ }
102
+ else {
103
+ backgroundColor = 'var(--pv-color-white)';
104
+ color = 'var(--pv-color-black)';
105
+ borderColor = 'var(--pv-color-gray-3)';
106
+ }
107
+ }
108
+ return {
109
+ backgroundColor: backgroundColor,
110
+ borderColor: borderColor,
111
+ '&:disabled': {
112
+ cursor: 'not-allowed',
113
+ color: colorDisabled,
114
+ },
115
+ '&:not(:disabled)': {
116
+ color: color,
117
+ '&:hover': {
118
+ backgroundColor: backgroundColorHover,
119
+ borderColor: borderColorHover,
120
+ },
121
+ '&:focus-visible': {
122
+ borderColor: 'var(--pv-color-secondary)',
123
+ },
124
+ '&:active': {
125
+ backgroundColor: backgroundColorActive,
126
+ borderColor: borderColorActive,
127
+ },
128
+ },
129
+ };
130
+ });
131
+ /**
132
+ *
133
+ */
134
+ exports.SegmentedControl = React.forwardRef(function (props, ref) {
135
+ var component = props.component, id = props.id, _a = props.disabled, disabled = _a === void 0 ? false : _a,
136
+ // @ts-expect-error: Property `selected` does not exist
137
+ // on type 'TSegmentedControlProps<"button">'
138
+ selected = props.selected, children = props.children, onChange = props.onChange, other = __rest(props, ["component", "id", "disabled", "selected", "children", "onChange"]);
139
+ var Component = component || 'button';
140
+ var handleClick = function (event) {
141
+ if (!selected && onChange) {
142
+ onChange(event, id);
143
+ }
144
+ };
145
+ return (React.createElement(SegmentedControlRoot, __assign({ as: Component, type: "button", role: "tab", ref: ref, disabled: disabled, id: id, selected: selected, "aria-selected": Boolean(selected), onClick: handleClick }, other),
146
+ React.createElement(Typography_1.Typography, { variant: "btn2", component: "span", color: "inherit" }, children)));
147
+ });
148
+ exports.SegmentedControl.displayName = 'SegmentedControl';
149
+ //# sourceMappingURL=segmented_control.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"segmented_control.js","sourceRoot":"","sources":["../../../src/SegmentedControls/segmented_control.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,82 @@
1
+ "use strict";
2
+ var __assign = (this && this.__assign) || function () {
3
+ __assign = Object.assign || function(t) {
4
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
5
+ s = arguments[i];
6
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
+ t[p] = s[p];
8
+ }
9
+ return t;
10
+ };
11
+ return __assign.apply(this, arguments);
12
+ };
13
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
14
+ if (k2 === undefined) k2 = k;
15
+ var desc = Object.getOwnPropertyDescriptor(m, k);
16
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
17
+ desc = { enumerable: true, get: function() { return m[k]; } };
18
+ }
19
+ Object.defineProperty(o, k2, desc);
20
+ }) : (function(o, m, k, k2) {
21
+ if (k2 === undefined) k2 = k;
22
+ o[k2] = m[k];
23
+ }));
24
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
25
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
26
+ }) : function(o, v) {
27
+ o["default"] = v;
28
+ });
29
+ var __importStar = (this && this.__importStar) || (function () {
30
+ var ownKeys = function(o) {
31
+ ownKeys = Object.getOwnPropertyNames || function (o) {
32
+ var ar = [];
33
+ for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
34
+ return ar;
35
+ };
36
+ return ownKeys(o);
37
+ };
38
+ return function (mod) {
39
+ if (mod && mod.__esModule) return mod;
40
+ var result = {};
41
+ if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
42
+ __setModuleDefault(result, mod);
43
+ return result;
44
+ };
45
+ })();
46
+ var __importDefault = (this && this.__importDefault) || function (mod) {
47
+ return (mod && mod.__esModule) ? mod : { "default": mod };
48
+ };
49
+ Object.defineProperty(exports, "__esModule", { value: true });
50
+ exports.SegmentedControls = void 0;
51
+ var React = __importStar(require("react"));
52
+ var styled_1 = __importDefault(require("@emotion/styled"));
53
+ var Tabs_1 = require("../Tabs");
54
+ ;
55
+ /**
56
+ *
57
+ */
58
+ /**
59
+ * Styles.
60
+ */
61
+ var SegmentedControlsRoot = (0, styled_1.default)(Tabs_1.Tabs)(function (props) {
62
+ var isDark = props.theme.mode === 'dark';
63
+ var backgroundColor = 'var(--pv-color-gray-4)';
64
+ if (isDark) {
65
+ backgroundColor = 'var(--pv-color-gray-3)';
66
+ }
67
+ return {
68
+ whiteSpace: 'nowrap',
69
+ overflowX: 'auto',
70
+ backgroundColor: backgroundColor,
71
+ borderRadius: 'calc(var(--pv-size-base) * 4)',
72
+ display: 'inline-flex',
73
+ padding: 'calc(var(--pv-size-base) - 1px)',
74
+ };
75
+ });
76
+ /**
77
+ *
78
+ */
79
+ // eslint-disable-next-line @stylistic/max-len
80
+ exports.SegmentedControls = React.forwardRef(function (props, ref) { return (React.createElement(SegmentedControlsRoot, __assign({ ref: ref }, (props)), props.children)); });
81
+ exports.SegmentedControls.displayName = 'SegmentedControls';
82
+ //# sourceMappingURL=segmented_controls.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"segmented_controls.js","sourceRoot":"","sources":["../../../src/SegmentedControls/segmented_controls.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAC/B,2DAAqC;AACrC,gCAA+B;AAuB9B,CAAC;AAGF;;GAEG;AAEH;;GAEG;AACH,IAAM,qBAAqB,GAAG,IAAA,gBAAM,EAAC,WAAI,CAAC,CAAC,UAAC,KAAK;IAC/C,IAAM,MAAM,GAAG,KAAK,CAAC,KAAK,CAAC,IAAI,KAAK,MAAM,CAAC;IAC3C,IAAI,eAAe,GAAG,wBAAwB,CAAC;IAE/C,IAAI,MAAM,EAAE,CAAC;QACX,eAAe,GAAG,wBAAwB,CAAC;IAC7C,CAAC;IAED,OAAO;QACL,UAAU,EAAE,QAAQ;QACpB,SAAS,EAAE,MAAM;QACjB,eAAe,iBAAA;QACf,YAAY,EAAE,+BAA+B;QAC7C,OAAO,EAAE,aAAa;QACtB,OAAO,EAAE,iCAAiC;KAC3C,CAAC;AACJ,CAAC,CAAC,CAAC;AACH;;GAEG;AAEH,8CAA8C;AACjC,QAAA,iBAAiB,GAAG,KAAK,CAAC,UAAU,CAA0C,UAAC,KAAK,EAAE,GAAG,IAAK,OAAA,CACzG,oBAAC,qBAAqB,aACpB,GAAG,EAAE,GAAG,IACJ,CAAC,KAAK,CAAC,GAEV,KAAK,CAAC,QAAQ,CACO,CACzB,EAP0G,CAO1G,CAAC,CAAC;AAEH,yBAAiB,CAAC,WAAW,GAAG,mBAAmB,CAAC"}
@@ -70,35 +70,25 @@ var Typography_1 = require("../Typography");
70
70
  * Styles.
71
71
  */
72
72
  var TabRoot = (0, styled_1.default)('button', {
73
- shouldForwardProp: function (prop) { return (0, is_prop_valid_1.default)(prop) && prop !== 'color'; },
73
+ shouldForwardProp: function (prop) { return (0, is_prop_valid_1.default)(prop); },
74
74
  })(function (props) { return (__assign({ fontFamily: 'inherit', outline: 'none', cursor: 'pointer', boxSizing: 'border-box', border: 0, borderBottom: '3px solid transparent', minHeight: 'calc(var(--pv-size-base) * 12)', height: '100%', padding: '0 calc(var(--pv-size-base) * 3)', backgroundColor: 'transparent', transition: 'background-color 200ms, color 200ms, border-color 200ms', display: 'inline-flex', alignItems: 'center', justifyContent: 'center', textDecoration: 'none' }, (props.selected && ({
75
75
  borderColor: 'var(--pv-color-secondary)',
76
76
  })))); }, function (props) {
77
77
  var isDark = props.theme.mode === 'dark';
78
- var isWhite = props.color === 'white';
79
- var color;
80
- var colorDisabled = isDark
81
- ? 'var(--pv-color-gray-5)'
82
- : 'var(--pv-color-gray-7)';
83
- var backgroundColorHove = 'var(--pv-color-secondary-tint-5)';
78
+ var color = 'var(--pv-color-gray-10)';
79
+ var colorDisabled = 'var(--pv-color-gray-7)';
80
+ var backgroundColorHover = 'var(--pv-color-secondary-tint-5)';
84
81
  var backgroundColorFocus = 'var(--pv-color-secondary-tint-4)';
85
82
  var backgroundColorActive = 'var(--pv-color-secondary-tint-3)';
86
- if (isWhite) {
87
- color = 'var(--pv-color-gray-9)';
88
- }
89
- else if (isDark) {
90
- color = 'var(--pv-color-gray-7)';
91
- }
92
- else {
93
- color = 'var(--pv-color-gray-10)';
94
- }
95
83
  if (isDark) {
96
- backgroundColorHove = 'var(--pv-color-secondary-shade-4)';
84
+ color = 'var(--pv-color-gray-7)';
85
+ colorDisabled = 'var(--pv-color-gray-5)';
86
+ backgroundColorHover = 'var(--pv-color-secondary-shade-4)';
97
87
  backgroundColorFocus = 'var(--pv-color-secondary-shade-3)';
98
88
  backgroundColorActive = 'var(--pv-color-secondary-shade-2)';
99
89
  }
100
90
  if (props.selected) {
101
- if (isDark || isWhite) {
91
+ if (isDark) {
102
92
  color = 'var(--pv-color-white)';
103
93
  }
104
94
  else {
@@ -113,7 +103,7 @@ var TabRoot = (0, styled_1.default)('button', {
113
103
  '&:not(:disabled)': {
114
104
  color: color,
115
105
  '&:hover': {
116
- backgroundColor: backgroundColorHove,
106
+ backgroundColor: backgroundColorHover,
117
107
  },
118
108
  '&:focus-visible': {
119
109
  backgroundColor: backgroundColorFocus,
@@ -128,16 +118,16 @@ var TabRoot = (0, styled_1.default)('button', {
128
118
  *
129
119
  */
130
120
  exports.Tab = React.forwardRef(function (props, ref) {
131
- var _a = props.color, color = _a === void 0 ? 'black' : _a, component = props.component, id = props.id, _b = props.disabled, disabled = _b === void 0 ? false : _b,
121
+ var component = props.component, id = props.id, _a = props.disabled, disabled = _a === void 0 ? false : _a,
132
122
  // @ts-expect-error: Property `selected` does not exist on type 'TabProps<"button">'
133
- selected = props.selected, children = props.children, onChange = props.onChange, other = __rest(props, ["color", "component", "id", "disabled", "selected", "children", "onChange"]);
123
+ selected = props.selected, children = props.children, onChange = props.onChange, other = __rest(props, ["component", "id", "disabled", "selected", "children", "onChange"]);
134
124
  var Component = component || 'button';
135
125
  var handleClick = function (event) {
136
126
  if (!selected && onChange) {
137
127
  onChange(event, id);
138
128
  }
139
129
  };
140
- return (React.createElement(TabRoot, __assign({ as: Component, type: "button", role: "tab", ref: ref, disabled: disabled, id: id, color: color, selected: selected, "aria-selected": Boolean(selected), onClick: handleClick }, other),
130
+ return (React.createElement(TabRoot, __assign({ as: Component, type: "button", role: "tab", ref: ref, disabled: disabled, id: id, selected: selected, "aria-selected": Boolean(selected), onClick: handleClick }, other),
141
131
  React.createElement(Typography_1.Typography, { variant: "s2", component: "span", color: "inherit" }, children)));
142
132
  });
143
133
  exports.Tab.displayName = 'Tab';
@@ -1 +1 @@
1
- {"version":3,"file":"tab.js","sourceRoot":"","sources":["../../../src/Tabs/tab.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"tab.js","sourceRoot":"","sources":["../../../src/Tabs/tab.tsx"],"names":[],"mappings":"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"}
@@ -81,10 +81,6 @@ exports.Tabs = React.forwardRef(function (props, ref) {
81
81
  if (!React.isValidElement(child)) {
82
82
  return null;
83
83
  }
84
- if (child.type.displayName !== 'Tab') {
85
- console.error('Peculiar-UI: The Tabs component doesn\'t accept a Element as not a Tab.');
86
- return null;
87
- }
88
84
  var childValue = child.props.id;
89
85
  var selected = childValue === value;
90
86
  return React.cloneElement(child, {
@@ -1 +1 @@
1
- {"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../src/Tabs/tabs.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAC/B,2DAAqC;AAuBpC,CAAC;AAGF;;GAEG;AAEH;;GAEG;AACH,IAAM,QAAQ,GAAG,IAAA,gBAAM,EAAC,KAAK,CAAC,CAAC;IAC7B,UAAU,EAAE,QAAQ;IACpB,SAAS,EAAE,MAAM;CAClB,CAAC,CAAC;AACH;;GAEG;AAEU,QAAA,IAAI,GAAG,KAAK,CAAC,UAAU,CAA6B,UAAC,KAAK,EAAE,GAAG;IAExE,IAAU,YAAY,GAIpB,KAAK,SAJe,EACtB,KAAK,GAGH,KAAK,MAHF,EACL,QAAQ,GAEN,KAAK,SAFC,EACL,KAAK,UACN,KAAK,EALH,iCAKL,CADS,CACA;IAEV,IAAM,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAC,GAAG,CACjC,YAAY,EACZ,UAAC,KAAgD;QAC/C,IAAI,CAAC,KAAK,CAAC,cAAc,CAAa,KAAK,CAAC,EAAE,CAAC;YAC7C,OAAO,IAAI,CAAC;QACd,CAAC;QAED,IAAI,KAAK,CAAC,IAAI,CAAC,WAAW,KAAK,KAAK,EAAE,CAAC;YACrC,OAAO,CAAC,KAAK,CAAC,yEAAyE,CAAC,CAAC;YAEzF,OAAO,IAAI,CAAC;QACd,CAAC;QAED,IAAM,UAAU,GAAG,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC;QAClC,IAAM,QAAQ,GAAG,UAAU,KAAK,KAAK,CAAC;QAEtC,OAAO,KAAK,CAAC,YAAY,CAAC,KAAK,EAAE;YAC/B,QAAQ,UAAA;YACR,QAAQ,UAAA;SACT,CAAC,CAAC;IACL,CAAC,CACF,CAAC;IAEF,OAAO,CACL,oBAAC,QAAQ,aACP,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,SAAS,IACV,KAAK,GAER,QAAQ,CACA,CACZ,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,YAAI,CAAC,WAAW,GAAG,MAAM,CAAC"}
1
+ {"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../src/Tabs/tabs.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAC/B,2DAAqC;AAuBpC,CAAC;AAGF;;GAEG;AAEH;;GAEG;AACH,IAAM,QAAQ,GAAG,IAAA,gBAAM,EAAC,KAAK,CAAC,CAAC;IAC7B,UAAU,EAAE,QAAQ;IACpB,SAAS,EAAE,MAAM;CAClB,CAAC,CAAC;AACH;;GAEG;AAEU,QAAA,IAAI,GAAG,KAAK,CAAC,UAAU,CAA6B,UAAC,KAAK,EAAE,GAAG;IAExE,IAAU,YAAY,GAIpB,KAAK,SAJe,EACtB,KAAK,GAGH,KAAK,MAHF,EACL,QAAQ,GAEN,KAAK,SAFC,EACL,KAAK,UACN,KAAK,EALH,iCAKL,CADS,CACA;IAEV,IAAM,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAC,GAAG,CACjC,YAAY,EACZ,UAAC,KAAgD;QAC/C,IAAI,CAAC,KAAK,CAAC,cAAc,CAAa,KAAK,CAAC,EAAE,CAAC;YAC7C,OAAO,IAAI,CAAC;QACd,CAAC;QAED,IAAM,UAAU,GAAG,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC;QAClC,IAAM,QAAQ,GAAG,UAAU,KAAK,KAAK,CAAC;QAEtC,OAAO,KAAK,CAAC,YAAY,CAAC,KAAK,EAAE;YAC/B,QAAQ,UAAA;YACR,QAAQ,UAAA;SACT,CAAC,CAAC;IACL,CAAC,CACF,CAAC;IAEF,OAAO,CACL,oBAAC,QAAQ,aACP,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,SAAS,IACV,KAAK,GAER,QAAQ,CACA,CACZ,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,YAAI,CAAC,WAAW,GAAG,MAAM,CAAC"}
package/dist/cjs/index.js CHANGED
@@ -53,4 +53,5 @@ __exportStar(require("./styles"), exports);
53
53
  __exportStar(require("./hooks"), exports);
54
54
  __exportStar(require("./OverridableComponent"), exports);
55
55
  __exportStar(require("./Flex"), exports);
56
+ __exportStar(require("./SegmentedControls"), exports);
56
57
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,0CAAwB;AACxB,iDAA+B;AAC/B,2CAAyB;AACzB,wCAAsB;AACtB,2CAAyB;AACzB,6CAA2B;AAC3B,yCAAuB;AACvB,qDAAmC;AACnC,6CAA2B;AAC3B,2CAAyB;AACzB,2CAAyB;AACzB,wCAAsB;AACtB,yCAAuB;AACvB,+CAA6B;AAC7B,0CAAwB;AACxB,0CAAwB;AACxB,mDAAiC;AACjC,yCAAuB;AACvB,6CAA2B;AAC3B,2CAAyB;AACzB,4CAA0B;AAC1B,2CAAyB;AACzB,0CAAwB;AACxB,iDAA+B;AAC/B,6CAA2B;AAC3B,2CAAyB;AACzB,0CAAwB;AACxB,2CAAyB;AACzB,2CAAyB;AACzB,yCAAuB;AACvB,kDAAgC;AAChC,8CAA4B;AAC5B,0CAAwB;AACxB,4CAA0B;AAC1B,+CAA6B;AAC7B,2CAAyB;AACzB,0CAAwB;AACxB,yDAAuC;AACvC,yCAAuB"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,0CAAwB;AACxB,iDAA+B;AAC/B,2CAAyB;AACzB,wCAAsB;AACtB,2CAAyB;AACzB,6CAA2B;AAC3B,yCAAuB;AACvB,qDAAmC;AACnC,6CAA2B;AAC3B,2CAAyB;AACzB,2CAAyB;AACzB,wCAAsB;AACtB,yCAAuB;AACvB,+CAA6B;AAC7B,0CAAwB;AACxB,0CAAwB;AACxB,mDAAiC;AACjC,yCAAuB;AACvB,6CAA2B;AAC3B,2CAAyB;AACzB,4CAA0B;AAC1B,2CAAyB;AACzB,0CAAwB;AACxB,iDAA+B;AAC/B,6CAA2B;AAC3B,2CAAyB;AACzB,0CAAwB;AACxB,2CAAyB;AACzB,2CAAyB;AACzB,yCAAuB;AACvB,kDAAgC;AAChC,8CAA4B;AAC5B,0CAAwB;AACxB,4CAA0B;AAC1B,+CAA6B;AAC7B,2CAAyB;AACzB,0CAAwB;AACxB,yDAAuC;AACvC,yCAAuB;AACvB,sDAAoC"}
@@ -0,0 +1,3 @@
1
+ export { SegmentedControls } from './segmented_controls';
2
+ export { SegmentedControl } from './segmented_control';
3
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/SegmentedControls/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC"}
@@ -0,0 +1,110 @@
1
+ var __assign = (this && this.__assign) || function () {
2
+ __assign = Object.assign || function(t) {
3
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
4
+ s = arguments[i];
5
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
+ t[p] = s[p];
7
+ }
8
+ return t;
9
+ };
10
+ return __assign.apply(this, arguments);
11
+ };
12
+ var __rest = (this && this.__rest) || function (s, e) {
13
+ var t = {};
14
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
15
+ t[p] = s[p];
16
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
17
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
18
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
19
+ t[p[i]] = s[p[i]];
20
+ }
21
+ return t;
22
+ };
23
+ import * as React from 'react';
24
+ import styled from '@emotion/styled';
25
+ import isPropValid from '@emotion/is-prop-valid';
26
+ import { Typography } from '../Typography';
27
+ /**
28
+ *
29
+ */
30
+ /**
31
+ * Styles.
32
+ */
33
+ var SegmentedControlRoot = styled('button', {
34
+ shouldForwardProp: isPropValid,
35
+ })(function (props) { return (__assign({ fontFamily: 'inherit', outline: 'none', cursor: 'pointer', boxSizing: 'border-box', border: '1px solid transparent', minHeight: 'calc(var(--pv-size-base) * 4 + 2px)', height: '100%', padding: '0 calc(var(--pv-size-base) * 2)', borderRadius: 'calc(var(--pv-size-base) * 4)', transition: 'background-color 200ms, color 200ms, border-color 200ms, box-shadow 200ms', display: 'inline-flex', alignItems: 'center', justifyContent: 'center', textDecoration: 'none' }, (props.selected && ({
36
+ boxShadow: 'var(--pv-shadow-light-soft)',
37
+ pointerEvents: 'none',
38
+ })))); }, function (props) {
39
+ var isDark = props.theme.mode === 'dark';
40
+ var color = 'var(--pv-color-gray-10)';
41
+ var colorDisabled = isDark
42
+ ? 'var(--pv-color-gray-5)'
43
+ : 'var(--pv-color-gray-8)';
44
+ var backgroundColor = 'transparent';
45
+ var backgroundColorHover = 'var(--pv-color-gray-5)';
46
+ var backgroundColorActive = 'var(--pv-color-gray-6)';
47
+ var borderColor = 'transparent';
48
+ var borderColorHover = 'var(--pv-color-gray-5)';
49
+ var borderColorActive = 'var(--pv-color-gray-6)';
50
+ if (isDark) {
51
+ backgroundColorHover = 'var(--pv-color-gray-4)';
52
+ backgroundColorActive = 'var(--pv-color-gray-5)';
53
+ borderColorHover = 'var(--pv-color-gray-4)';
54
+ borderColorActive = 'var(--pv-color-gray-5)';
55
+ color = 'var(--pv-color-gray-8)';
56
+ }
57
+ if (props.selected) {
58
+ if (isDark) {
59
+ backgroundColor = 'var(--pv-color-gray-6)';
60
+ color = 'var(--pv-color-white)';
61
+ borderColor = 'var(--pv-color-gray-5)';
62
+ }
63
+ else {
64
+ backgroundColor = 'var(--pv-color-white)';
65
+ color = 'var(--pv-color-black)';
66
+ borderColor = 'var(--pv-color-gray-3)';
67
+ }
68
+ }
69
+ return {
70
+ backgroundColor: backgroundColor,
71
+ borderColor: borderColor,
72
+ '&:disabled': {
73
+ cursor: 'not-allowed',
74
+ color: colorDisabled,
75
+ },
76
+ '&:not(:disabled)': {
77
+ color: color,
78
+ '&:hover': {
79
+ backgroundColor: backgroundColorHover,
80
+ borderColor: borderColorHover,
81
+ },
82
+ '&:focus-visible': {
83
+ borderColor: 'var(--pv-color-secondary)',
84
+ },
85
+ '&:active': {
86
+ backgroundColor: backgroundColorActive,
87
+ borderColor: borderColorActive,
88
+ },
89
+ },
90
+ };
91
+ });
92
+ /**
93
+ *
94
+ */
95
+ export var SegmentedControl = React.forwardRef(function (props, ref) {
96
+ var component = props.component, id = props.id, _a = props.disabled, disabled = _a === void 0 ? false : _a,
97
+ // @ts-expect-error: Property `selected` does not exist
98
+ // on type 'TSegmentedControlProps<"button">'
99
+ selected = props.selected, children = props.children, onChange = props.onChange, other = __rest(props, ["component", "id", "disabled", "selected", "children", "onChange"]);
100
+ var Component = component || 'button';
101
+ var handleClick = function (event) {
102
+ if (!selected && onChange) {
103
+ onChange(event, id);
104
+ }
105
+ };
106
+ return (React.createElement(SegmentedControlRoot, __assign({ as: Component, type: "button", role: "tab", ref: ref, disabled: disabled, id: id, selected: selected, "aria-selected": Boolean(selected), onClick: handleClick }, other),
107
+ React.createElement(Typography, { variant: "btn2", component: "span", color: "inherit" }, children)));
108
+ });
109
+ SegmentedControl.displayName = 'SegmentedControl';
110
+ //# sourceMappingURL=segmented_control.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"segmented_control.js","sourceRoot":"","sources":["../../../src/SegmentedControls/segmented_control.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,43 @@
1
+ var __assign = (this && this.__assign) || function () {
2
+ __assign = Object.assign || function(t) {
3
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
4
+ s = arguments[i];
5
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
+ t[p] = s[p];
7
+ }
8
+ return t;
9
+ };
10
+ return __assign.apply(this, arguments);
11
+ };
12
+ import * as React from 'react';
13
+ import styled from '@emotion/styled';
14
+ import { Tabs } from '../Tabs';
15
+ ;
16
+ /**
17
+ *
18
+ */
19
+ /**
20
+ * Styles.
21
+ */
22
+ var SegmentedControlsRoot = styled(Tabs)(function (props) {
23
+ var isDark = props.theme.mode === 'dark';
24
+ var backgroundColor = 'var(--pv-color-gray-4)';
25
+ if (isDark) {
26
+ backgroundColor = 'var(--pv-color-gray-3)';
27
+ }
28
+ return {
29
+ whiteSpace: 'nowrap',
30
+ overflowX: 'auto',
31
+ backgroundColor: backgroundColor,
32
+ borderRadius: 'calc(var(--pv-size-base) * 4)',
33
+ display: 'inline-flex',
34
+ padding: 'calc(var(--pv-size-base) - 1px)',
35
+ };
36
+ });
37
+ /**
38
+ *
39
+ */
40
+ // eslint-disable-next-line @stylistic/max-len
41
+ export var SegmentedControls = React.forwardRef(function (props, ref) { return (React.createElement(SegmentedControlsRoot, __assign({ ref: ref }, (props)), props.children)); });
42
+ SegmentedControls.displayName = 'SegmentedControls';
43
+ //# sourceMappingURL=segmented_controls.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"segmented_controls.js","sourceRoot":"","sources":["../../../src/SegmentedControls/segmented_controls.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAuB9B,CAAC;AAGF;;GAEG;AAEH;;GAEG;AACH,IAAM,qBAAqB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,UAAC,KAAK;IAC/C,IAAM,MAAM,GAAG,KAAK,CAAC,KAAK,CAAC,IAAI,KAAK,MAAM,CAAC;IAC3C,IAAI,eAAe,GAAG,wBAAwB,CAAC;IAE/C,IAAI,MAAM,EAAE,CAAC;QACX,eAAe,GAAG,wBAAwB,CAAC;IAC7C,CAAC;IAED,OAAO;QACL,UAAU,EAAE,QAAQ;QACpB,SAAS,EAAE,MAAM;QACjB,eAAe,iBAAA;QACf,YAAY,EAAE,+BAA+B;QAC7C,OAAO,EAAE,aAAa;QACtB,OAAO,EAAE,iCAAiC;KAC3C,CAAC;AACJ,CAAC,CAAC,CAAC;AACH;;GAEG;AAEH,8CAA8C;AAC9C,MAAM,CAAC,IAAM,iBAAiB,GAAG,KAAK,CAAC,UAAU,CAA0C,UAAC,KAAK,EAAE,GAAG,IAAK,OAAA,CACzG,oBAAC,qBAAqB,aACpB,GAAG,EAAE,GAAG,IACJ,CAAC,KAAK,CAAC,GAEV,KAAK,CAAC,QAAQ,CACO,CACzB,EAP0G,CAO1G,CAAC,CAAC;AAEH,iBAAiB,CAAC,WAAW,GAAG,mBAAmB,CAAC"}
@@ -31,35 +31,25 @@ import { Typography } from '../Typography';
31
31
  * Styles.
32
32
  */
33
33
  var TabRoot = styled('button', {
34
- shouldForwardProp: function (prop) { return isPropValid(prop) && prop !== 'color'; },
34
+ shouldForwardProp: function (prop) { return isPropValid(prop); },
35
35
  })(function (props) { return (__assign({ fontFamily: 'inherit', outline: 'none', cursor: 'pointer', boxSizing: 'border-box', border: 0, borderBottom: '3px solid transparent', minHeight: 'calc(var(--pv-size-base) * 12)', height: '100%', padding: '0 calc(var(--pv-size-base) * 3)', backgroundColor: 'transparent', transition: 'background-color 200ms, color 200ms, border-color 200ms', display: 'inline-flex', alignItems: 'center', justifyContent: 'center', textDecoration: 'none' }, (props.selected && ({
36
36
  borderColor: 'var(--pv-color-secondary)',
37
37
  })))); }, function (props) {
38
38
  var isDark = props.theme.mode === 'dark';
39
- var isWhite = props.color === 'white';
40
- var color;
41
- var colorDisabled = isDark
42
- ? 'var(--pv-color-gray-5)'
43
- : 'var(--pv-color-gray-7)';
44
- var backgroundColorHove = 'var(--pv-color-secondary-tint-5)';
39
+ var color = 'var(--pv-color-gray-10)';
40
+ var colorDisabled = 'var(--pv-color-gray-7)';
41
+ var backgroundColorHover = 'var(--pv-color-secondary-tint-5)';
45
42
  var backgroundColorFocus = 'var(--pv-color-secondary-tint-4)';
46
43
  var backgroundColorActive = 'var(--pv-color-secondary-tint-3)';
47
- if (isWhite) {
48
- color = 'var(--pv-color-gray-9)';
49
- }
50
- else if (isDark) {
51
- color = 'var(--pv-color-gray-7)';
52
- }
53
- else {
54
- color = 'var(--pv-color-gray-10)';
55
- }
56
44
  if (isDark) {
57
- backgroundColorHove = 'var(--pv-color-secondary-shade-4)';
45
+ color = 'var(--pv-color-gray-7)';
46
+ colorDisabled = 'var(--pv-color-gray-5)';
47
+ backgroundColorHover = 'var(--pv-color-secondary-shade-4)';
58
48
  backgroundColorFocus = 'var(--pv-color-secondary-shade-3)';
59
49
  backgroundColorActive = 'var(--pv-color-secondary-shade-2)';
60
50
  }
61
51
  if (props.selected) {
62
- if (isDark || isWhite) {
52
+ if (isDark) {
63
53
  color = 'var(--pv-color-white)';
64
54
  }
65
55
  else {
@@ -74,7 +64,7 @@ var TabRoot = styled('button', {
74
64
  '&:not(:disabled)': {
75
65
  color: color,
76
66
  '&:hover': {
77
- backgroundColor: backgroundColorHove,
67
+ backgroundColor: backgroundColorHover,
78
68
  },
79
69
  '&:focus-visible': {
80
70
  backgroundColor: backgroundColorFocus,
@@ -89,16 +79,16 @@ var TabRoot = styled('button', {
89
79
  *
90
80
  */
91
81
  export var Tab = React.forwardRef(function (props, ref) {
92
- var _a = props.color, color = _a === void 0 ? 'black' : _a, component = props.component, id = props.id, _b = props.disabled, disabled = _b === void 0 ? false : _b,
82
+ var component = props.component, id = props.id, _a = props.disabled, disabled = _a === void 0 ? false : _a,
93
83
  // @ts-expect-error: Property `selected` does not exist on type 'TabProps<"button">'
94
- selected = props.selected, children = props.children, onChange = props.onChange, other = __rest(props, ["color", "component", "id", "disabled", "selected", "children", "onChange"]);
84
+ selected = props.selected, children = props.children, onChange = props.onChange, other = __rest(props, ["component", "id", "disabled", "selected", "children", "onChange"]);
95
85
  var Component = component || 'button';
96
86
  var handleClick = function (event) {
97
87
  if (!selected && onChange) {
98
88
  onChange(event, id);
99
89
  }
100
90
  };
101
- return (React.createElement(TabRoot, __assign({ as: Component, type: "button", role: "tab", ref: ref, disabled: disabled, id: id, color: color, selected: selected, "aria-selected": Boolean(selected), onClick: handleClick }, other),
91
+ return (React.createElement(TabRoot, __assign({ as: Component, type: "button", role: "tab", ref: ref, disabled: disabled, id: id, selected: selected, "aria-selected": Boolean(selected), onClick: handleClick }, other),
102
92
  React.createElement(Typography, { variant: "s2", component: "span", color: "inherit" }, children)));
103
93
  });
104
94
  Tab.displayName = 'Tab';
@@ -1 +1 @@
1
- {"version":3,"file":"tab.js","sourceRoot":"","sources":["../../../src/Tabs/tab.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"tab.js","sourceRoot":"","sources":["../../../src/Tabs/tab.tsx"],"names":[],"mappings":"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"}
@@ -42,10 +42,6 @@ export var Tabs = React.forwardRef(function (props, ref) {
42
42
  if (!React.isValidElement(child)) {
43
43
  return null;
44
44
  }
45
- if (child.type.displayName !== 'Tab') {
46
- console.error('Peculiar-UI: The Tabs component doesn\'t accept a Element as not a Tab.');
47
- return null;
48
- }
49
45
  var childValue = child.props.id;
50
46
  var selected = childValue === value;
51
47
  return React.cloneElement(child, {
@@ -1 +1 @@
1
- {"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../src/Tabs/tabs.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAuBpC,CAAC;AAGF;;GAEG;AAEH;;GAEG;AACH,IAAM,QAAQ,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAC7B,UAAU,EAAE,QAAQ;IACpB,SAAS,EAAE,MAAM;CAClB,CAAC,CAAC;AACH;;GAEG;AAEH,MAAM,CAAC,IAAM,IAAI,GAAG,KAAK,CAAC,UAAU,CAA6B,UAAC,KAAK,EAAE,GAAG;IAExE,IAAU,YAAY,GAIpB,KAAK,SAJe,EACtB,KAAK,GAGH,KAAK,MAHF,EACL,QAAQ,GAEN,KAAK,SAFC,EACL,KAAK,UACN,KAAK,EALH,iCAKL,CADS,CACA;IAEV,IAAM,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAC,GAAG,CACjC,YAAY,EACZ,UAAC,KAAgD;QAC/C,IAAI,CAAC,KAAK,CAAC,cAAc,CAAa,KAAK,CAAC,EAAE,CAAC;YAC7C,OAAO,IAAI,CAAC;QACd,CAAC;QAED,IAAI,KAAK,CAAC,IAAI,CAAC,WAAW,KAAK,KAAK,EAAE,CAAC;YACrC,OAAO,CAAC,KAAK,CAAC,yEAAyE,CAAC,CAAC;YAEzF,OAAO,IAAI,CAAC;QACd,CAAC;QAED,IAAM,UAAU,GAAG,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC;QAClC,IAAM,QAAQ,GAAG,UAAU,KAAK,KAAK,CAAC;QAEtC,OAAO,KAAK,CAAC,YAAY,CAAC,KAAK,EAAE;YAC/B,QAAQ,UAAA;YACR,QAAQ,UAAA;SACT,CAAC,CAAC;IACL,CAAC,CACF,CAAC;IAEF,OAAO,CACL,oBAAC,QAAQ,aACP,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,SAAS,IACV,KAAK,GAER,QAAQ,CACA,CACZ,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,IAAI,CAAC,WAAW,GAAG,MAAM,CAAC"}
1
+ {"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../src/Tabs/tabs.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAuBpC,CAAC;AAGF;;GAEG;AAEH;;GAEG;AACH,IAAM,QAAQ,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAC7B,UAAU,EAAE,QAAQ;IACpB,SAAS,EAAE,MAAM;CAClB,CAAC,CAAC;AACH;;GAEG;AAEH,MAAM,CAAC,IAAM,IAAI,GAAG,KAAK,CAAC,UAAU,CAA6B,UAAC,KAAK,EAAE,GAAG;IAExE,IAAU,YAAY,GAIpB,KAAK,SAJe,EACtB,KAAK,GAGH,KAAK,MAHF,EACL,QAAQ,GAEN,KAAK,SAFC,EACL,KAAK,UACN,KAAK,EALH,iCAKL,CADS,CACA;IAEV,IAAM,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAC,GAAG,CACjC,YAAY,EACZ,UAAC,KAAgD;QAC/C,IAAI,CAAC,KAAK,CAAC,cAAc,CAAa,KAAK,CAAC,EAAE,CAAC;YAC7C,OAAO,IAAI,CAAC;QACd,CAAC;QAED,IAAM,UAAU,GAAG,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC;QAClC,IAAM,QAAQ,GAAG,UAAU,KAAK,KAAK,CAAC;QAEtC,OAAO,KAAK,CAAC,YAAY,CAAC,KAAK,EAAE;YAC/B,QAAQ,UAAA;YACR,QAAQ,UAAA;SACT,CAAC,CAAC;IACL,CAAC,CACF,CAAC;IAEF,OAAO,CACL,oBAAC,QAAQ,aACP,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,SAAS,IACV,KAAK,GAER,QAAQ,CACA,CACZ,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,IAAI,CAAC,WAAW,GAAG,MAAM,CAAC"}
package/dist/esm/index.js CHANGED
@@ -37,4 +37,5 @@ export * from './styles';
37
37
  export * from './hooks';
38
38
  export * from './OverridableComponent';
39
39
  export * from './Flex';
40
+ export * from './SegmentedControls';
40
41
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,OAAO,CAAC;AACtB,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,oBAAoB,CAAC;AACnC,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,OAAO,CAAC;AACtB,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,kBAAkB,CAAC;AACjC,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,iBAAiB,CAAC;AAChC,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,wBAAwB,CAAC;AACvC,cAAc,QAAQ,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,OAAO,CAAC;AACtB,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,oBAAoB,CAAC;AACnC,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,OAAO,CAAC;AACtB,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,kBAAkB,CAAC;AACjC,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,iBAAiB,CAAC;AAChC,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,wBAAwB,CAAC;AACvC,cAAc,QAAQ,CAAC;AACvB,cAAc,qBAAqB,CAAC"}
@@ -0,0 +1,3 @@
1
+ export { SegmentedControls } from './segmented_controls';
2
+ export { SegmentedControl } from './segmented_control';
3
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/SegmentedControls/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC"}
@@ -0,0 +1,104 @@
1
+ import * as React from 'react';
2
+ import styled from '@emotion/styled';
3
+ import isPropValid from '@emotion/is-prop-valid';
4
+ import { Typography } from '../Typography';
5
+ /**
6
+ *
7
+ */
8
+ /**
9
+ * Styles.
10
+ */
11
+ const SegmentedControlRoot = styled('button', {
12
+ shouldForwardProp: isPropValid,
13
+ })((props) => ({
14
+ fontFamily: 'inherit',
15
+ outline: 'none',
16
+ cursor: 'pointer',
17
+ boxSizing: 'border-box',
18
+ border: '1px solid transparent',
19
+ minHeight: 'calc(var(--pv-size-base) * 4 + 2px)',
20
+ height: '100%',
21
+ padding: '0 calc(var(--pv-size-base) * 2)',
22
+ borderRadius: 'calc(var(--pv-size-base) * 4)',
23
+ transition: 'background-color 200ms, color 200ms, border-color 200ms, box-shadow 200ms',
24
+ display: 'inline-flex',
25
+ alignItems: 'center',
26
+ justifyContent: 'center',
27
+ textDecoration: 'none',
28
+ ...(props.selected && ({
29
+ boxShadow: 'var(--pv-shadow-light-soft)',
30
+ pointerEvents: 'none',
31
+ })),
32
+ }), (props) => {
33
+ const isDark = props.theme.mode === 'dark';
34
+ let color = 'var(--pv-color-gray-10)';
35
+ const colorDisabled = isDark
36
+ ? 'var(--pv-color-gray-5)'
37
+ : 'var(--pv-color-gray-8)';
38
+ let backgroundColor = 'transparent';
39
+ let backgroundColorHover = 'var(--pv-color-gray-5)';
40
+ let backgroundColorActive = 'var(--pv-color-gray-6)';
41
+ let borderColor = 'transparent';
42
+ let borderColorHover = 'var(--pv-color-gray-5)';
43
+ let borderColorActive = 'var(--pv-color-gray-6)';
44
+ if (isDark) {
45
+ backgroundColorHover = 'var(--pv-color-gray-4)';
46
+ backgroundColorActive = 'var(--pv-color-gray-5)';
47
+ borderColorHover = 'var(--pv-color-gray-4)';
48
+ borderColorActive = 'var(--pv-color-gray-5)';
49
+ color = 'var(--pv-color-gray-8)';
50
+ }
51
+ if (props.selected) {
52
+ if (isDark) {
53
+ backgroundColor = 'var(--pv-color-gray-6)';
54
+ color = 'var(--pv-color-white)';
55
+ borderColor = 'var(--pv-color-gray-5)';
56
+ }
57
+ else {
58
+ backgroundColor = 'var(--pv-color-white)';
59
+ color = 'var(--pv-color-black)';
60
+ borderColor = 'var(--pv-color-gray-3)';
61
+ }
62
+ }
63
+ return {
64
+ backgroundColor,
65
+ borderColor,
66
+ '&:disabled': {
67
+ cursor: 'not-allowed',
68
+ color: colorDisabled,
69
+ },
70
+ '&:not(:disabled)': {
71
+ color,
72
+ '&:hover': {
73
+ backgroundColor: backgroundColorHover,
74
+ borderColor: borderColorHover,
75
+ },
76
+ '&:focus-visible': {
77
+ borderColor: 'var(--pv-color-secondary)',
78
+ },
79
+ '&:active': {
80
+ backgroundColor: backgroundColorActive,
81
+ borderColor: borderColorActive,
82
+ },
83
+ },
84
+ };
85
+ });
86
+ /**
87
+ *
88
+ */
89
+ export const SegmentedControl = React.forwardRef((props, ref) => {
90
+ const { component, id, disabled = false,
91
+ // @ts-expect-error: Property `selected` does not exist
92
+ // on type 'TSegmentedControlProps<"button">'
93
+ selected, children, onChange, ...other } = props;
94
+ const Component = component || 'button';
95
+ const handleClick = (event) => {
96
+ if (!selected && onChange) {
97
+ onChange(event, id);
98
+ }
99
+ };
100
+ return (React.createElement(SegmentedControlRoot, { as: Component, type: "button", role: "tab", ref: ref, disabled: disabled, id: id, selected: selected, "aria-selected": Boolean(selected), onClick: handleClick, ...other },
101
+ React.createElement(Typography, { variant: "btn2", component: "span", color: "inherit" }, children)));
102
+ });
103
+ SegmentedControl.displayName = 'SegmentedControl';
104
+ //# sourceMappingURL=segmented_control.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"segmented_control.js","sourceRoot":"","sources":["../../../src/SegmentedControls/segmented_control.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,32 @@
1
+ import * as React from 'react';
2
+ import styled from '@emotion/styled';
3
+ import { Tabs } from '../Tabs';
4
+ ;
5
+ /**
6
+ *
7
+ */
8
+ /**
9
+ * Styles.
10
+ */
11
+ const SegmentedControlsRoot = styled(Tabs)((props) => {
12
+ const isDark = props.theme.mode === 'dark';
13
+ let backgroundColor = 'var(--pv-color-gray-4)';
14
+ if (isDark) {
15
+ backgroundColor = 'var(--pv-color-gray-3)';
16
+ }
17
+ return {
18
+ whiteSpace: 'nowrap',
19
+ overflowX: 'auto',
20
+ backgroundColor,
21
+ borderRadius: 'calc(var(--pv-size-base) * 4)',
22
+ display: 'inline-flex',
23
+ padding: 'calc(var(--pv-size-base) - 1px)',
24
+ };
25
+ });
26
+ /**
27
+ *
28
+ */
29
+ // eslint-disable-next-line @stylistic/max-len
30
+ export const SegmentedControls = React.forwardRef((props, ref) => (React.createElement(SegmentedControlsRoot, { ref: ref, ...(props) }, props.children)));
31
+ SegmentedControls.displayName = 'SegmentedControls';
32
+ //# sourceMappingURL=segmented_controls.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"segmented_controls.js","sourceRoot":"","sources":["../../../src/SegmentedControls/segmented_controls.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAuB9B,CAAC;AAGF;;GAEG;AAEH;;GAEG;AACH,MAAM,qBAAqB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,EAAE,EAAE;IACnD,MAAM,MAAM,GAAG,KAAK,CAAC,KAAK,CAAC,IAAI,KAAK,MAAM,CAAC;IAC3C,IAAI,eAAe,GAAG,wBAAwB,CAAC;IAE/C,IAAI,MAAM,EAAE,CAAC;QACX,eAAe,GAAG,wBAAwB,CAAC;IAC7C,CAAC;IAED,OAAO;QACL,UAAU,EAAE,QAAQ;QACpB,SAAS,EAAE,MAAM;QACjB,eAAe;QACf,YAAY,EAAE,+BAA+B;QAC7C,OAAO,EAAE,aAAa;QACtB,OAAO,EAAE,iCAAiC;KAC3C,CAAC;AACJ,CAAC,CAAC,CAAC;AACH;;GAEG;AAEH,8CAA8C;AAC9C,MAAM,CAAC,MAAM,iBAAiB,GAAG,KAAK,CAAC,UAAU,CAA0C,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE,CAAC,CACzG,oBAAC,qBAAqB,IACpB,GAAG,EAAE,GAAG,KACJ,CAAC,KAAK,CAAC,IAEV,KAAK,CAAC,QAAQ,CACO,CACzB,CAAC,CAAC;AAEH,iBAAiB,CAAC,WAAW,GAAG,mBAAmB,CAAC"}
@@ -9,7 +9,7 @@ import { Typography } from '../Typography';
9
9
  * Styles.
10
10
  */
11
11
  const TabRoot = styled('button', {
12
- shouldForwardProp: (prop) => isPropValid(prop) && prop !== 'color',
12
+ shouldForwardProp: (prop) => isPropValid(prop),
13
13
  })((props) => ({
14
14
  fontFamily: 'inherit',
15
15
  outline: 'none',
@@ -31,30 +31,20 @@ const TabRoot = styled('button', {
31
31
  })),
32
32
  }), (props) => {
33
33
  const isDark = props.theme.mode === 'dark';
34
- const isWhite = props.color === 'white';
35
- let color;
36
- const colorDisabled = isDark
37
- ? 'var(--pv-color-gray-5)'
38
- : 'var(--pv-color-gray-7)';
39
- let backgroundColorHove = 'var(--pv-color-secondary-tint-5)';
34
+ let color = 'var(--pv-color-gray-10)';
35
+ let colorDisabled = 'var(--pv-color-gray-7)';
36
+ let backgroundColorHover = 'var(--pv-color-secondary-tint-5)';
40
37
  let backgroundColorFocus = 'var(--pv-color-secondary-tint-4)';
41
38
  let backgroundColorActive = 'var(--pv-color-secondary-tint-3)';
42
- if (isWhite) {
43
- color = 'var(--pv-color-gray-9)';
44
- }
45
- else if (isDark) {
46
- color = 'var(--pv-color-gray-7)';
47
- }
48
- else {
49
- color = 'var(--pv-color-gray-10)';
50
- }
51
39
  if (isDark) {
52
- backgroundColorHove = 'var(--pv-color-secondary-shade-4)';
40
+ color = 'var(--pv-color-gray-7)';
41
+ colorDisabled = 'var(--pv-color-gray-5)';
42
+ backgroundColorHover = 'var(--pv-color-secondary-shade-4)';
53
43
  backgroundColorFocus = 'var(--pv-color-secondary-shade-3)';
54
44
  backgroundColorActive = 'var(--pv-color-secondary-shade-2)';
55
45
  }
56
46
  if (props.selected) {
57
- if (isDark || isWhite) {
47
+ if (isDark) {
58
48
  color = 'var(--pv-color-white)';
59
49
  }
60
50
  else {
@@ -69,7 +59,7 @@ const TabRoot = styled('button', {
69
59
  '&:not(:disabled)': {
70
60
  color,
71
61
  '&:hover': {
72
- backgroundColor: backgroundColorHove,
62
+ backgroundColor: backgroundColorHover,
73
63
  },
74
64
  '&:focus-visible': {
75
65
  backgroundColor: backgroundColorFocus,
@@ -84,7 +74,7 @@ const TabRoot = styled('button', {
84
74
  *
85
75
  */
86
76
  export const Tab = React.forwardRef((props, ref) => {
87
- const { color = 'black', component, id, disabled = false,
77
+ const { component, id, disabled = false,
88
78
  // @ts-expect-error: Property `selected` does not exist on type 'TabProps<"button">'
89
79
  selected, children, onChange, ...other } = props;
90
80
  const Component = component || 'button';
@@ -93,7 +83,7 @@ export const Tab = React.forwardRef((props, ref) => {
93
83
  onChange(event, id);
94
84
  }
95
85
  };
96
- return (React.createElement(TabRoot, { as: Component, type: "button", role: "tab", ref: ref, disabled: disabled, id: id, color: color, selected: selected, "aria-selected": Boolean(selected), onClick: handleClick, ...other },
86
+ return (React.createElement(TabRoot, { as: Component, type: "button", role: "tab", ref: ref, disabled: disabled, id: id, selected: selected, "aria-selected": Boolean(selected), onClick: handleClick, ...other },
97
87
  React.createElement(Typography, { variant: "s2", component: "span", color: "inherit" }, children)));
98
88
  });
99
89
  Tab.displayName = 'Tab';
@@ -1 +1 @@
1
- {"version":3,"file":"tab.js","sourceRoot":"","sources":["../../../src/Tabs/tab.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"tab.js","sourceRoot":"","sources":["../../../src/Tabs/tab.tsx"],"names":[],"mappings":"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"}
@@ -20,10 +20,6 @@ export const Tabs = React.forwardRef((props, ref) => {
20
20
  if (!React.isValidElement(child)) {
21
21
  return null;
22
22
  }
23
- if (child.type.displayName !== 'Tab') {
24
- console.error('Peculiar-UI: The Tabs component doesn\'t accept a Element as not a Tab.');
25
- return null;
26
- }
27
23
  const childValue = child.props.id;
28
24
  const selected = childValue === value;
29
25
  return React.cloneElement(child, {
@@ -1 +1 @@
1
- {"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../src/Tabs/tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAuBpC,CAAC;AAGF;;GAEG;AAEH;;GAEG;AACH,MAAM,QAAQ,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAC7B,UAAU,EAAE,QAAQ;IACpB,SAAS,EAAE,MAAM;CAClB,CAAC,CAAC;AACH;;GAEG;AAEH,MAAM,CAAC,MAAM,IAAI,GAAG,KAAK,CAAC,UAAU,CAA6B,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IAC9E,MAAM,EACJ,QAAQ,EAAE,YAAY,EACtB,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACT,GAAG,KAAK,CAAC;IAEV,MAAM,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAC,GAAG,CACjC,YAAY,EACZ,CAAC,KAAgD,EAAE,EAAE;QACnD,IAAI,CAAC,KAAK,CAAC,cAAc,CAAa,KAAK,CAAC,EAAE,CAAC;YAC7C,OAAO,IAAI,CAAC;QACd,CAAC;QAED,IAAI,KAAK,CAAC,IAAI,CAAC,WAAW,KAAK,KAAK,EAAE,CAAC;YACrC,OAAO,CAAC,KAAK,CAAC,yEAAyE,CAAC,CAAC;YAEzF,OAAO,IAAI,CAAC;QACd,CAAC;QAED,MAAM,UAAU,GAAG,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC;QAClC,MAAM,QAAQ,GAAG,UAAU,KAAK,KAAK,CAAC;QAEtC,OAAO,KAAK,CAAC,YAAY,CAAC,KAAK,EAAE;YAC/B,QAAQ;YACR,QAAQ;SACT,CAAC,CAAC;IACL,CAAC,CACF,CAAC;IAEF,OAAO,CACL,oBAAC,QAAQ,IACP,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,SAAS,KACV,KAAK,IAER,QAAQ,CACA,CACZ,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,IAAI,CAAC,WAAW,GAAG,MAAM,CAAC"}
1
+ {"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../src/Tabs/tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAuBpC,CAAC;AAGF;;GAEG;AAEH;;GAEG;AACH,MAAM,QAAQ,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAC7B,UAAU,EAAE,QAAQ;IACpB,SAAS,EAAE,MAAM;CAClB,CAAC,CAAC;AACH;;GAEG;AAEH,MAAM,CAAC,MAAM,IAAI,GAAG,KAAK,CAAC,UAAU,CAA6B,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IAC9E,MAAM,EACJ,QAAQ,EAAE,YAAY,EACtB,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACT,GAAG,KAAK,CAAC;IAEV,MAAM,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAC,GAAG,CACjC,YAAY,EACZ,CAAC,KAAgD,EAAE,EAAE;QACnD,IAAI,CAAC,KAAK,CAAC,cAAc,CAAa,KAAK,CAAC,EAAE,CAAC;YAC7C,OAAO,IAAI,CAAC;QACd,CAAC;QAED,MAAM,UAAU,GAAG,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC;QAClC,MAAM,QAAQ,GAAG,UAAU,KAAK,KAAK,CAAC;QAEtC,OAAO,KAAK,CAAC,YAAY,CAAC,KAAK,EAAE;YAC/B,QAAQ;YACR,QAAQ;SACT,CAAC,CAAC;IACL,CAAC,CACF,CAAC;IAEF,OAAO,CACL,oBAAC,QAAQ,IACP,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,SAAS,KACV,KAAK,IAER,QAAQ,CACA,CACZ,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,IAAI,CAAC,WAAW,GAAG,MAAM,CAAC"}
@@ -37,4 +37,5 @@ export * from './styles';
37
37
  export * from './hooks';
38
38
  export * from './OverridableComponent';
39
39
  export * from './Flex';
40
+ export * from './SegmentedControls';
40
41
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,OAAO,CAAC;AACtB,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,oBAAoB,CAAC;AACnC,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,OAAO,CAAC;AACtB,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,kBAAkB,CAAC;AACjC,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,iBAAiB,CAAC;AAChC,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,wBAAwB,CAAC;AACvC,cAAc,QAAQ,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,OAAO,CAAC;AACtB,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,oBAAoB,CAAC;AACnC,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,OAAO,CAAC;AACtB,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,kBAAkB,CAAC;AACjC,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,iBAAiB,CAAC;AAChC,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,wBAAwB,CAAC;AACvC,cAAc,QAAQ,CAAC;AACvB,cAAc,qBAAqB,CAAC"}
@@ -0,0 +1,3 @@
1
+ export { SegmentedControls } from './segmented_controls';
2
+ export { SegmentedControl } from './segmented_control';
3
+ export type { ISegmentedControlOwnProps, TSegmentedControlProps, } from './segmented_control';
@@ -0,0 +1,36 @@
1
+ import * as React from 'react';
2
+ import { IOverridableComponent, TOverrideProps } from '../OverridableComponent';
3
+ /**
4
+ * Types.
5
+ */
6
+ export interface ISegmentedControlOwnProps {
7
+ /**
8
+ * The content of the component.
9
+ */
10
+ children: React.ReactNode;
11
+ /**
12
+ * Unique identifier used to control which segmented control is selected.
13
+ */
14
+ id: string;
15
+ /**
16
+ * If `true`, the segmented control will be disabled.
17
+ * @default false
18
+ */
19
+ disabled?: boolean;
20
+ /**
21
+ * Callback fired when the value changes.
22
+ */
23
+ onChange?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>, value: string) => void;
24
+ onClick?: never;
25
+ }
26
+ export interface ISegmentedControlTypeMap<P = object, D extends React.ElementType = 'button'> {
27
+ props: P & ISegmentedControlOwnProps;
28
+ defaultComponent: D;
29
+ }
30
+ export type TSegmentedControlProps<D extends React.ElementType = ISegmentedControlTypeMap['defaultComponent']> = TOverrideProps<ISegmentedControlTypeMap<object, D>, D> & {
31
+ component?: D;
32
+ };
33
+ /**
34
+ *
35
+ */
36
+ export declare const SegmentedControl: IOverridableComponent<ISegmentedControlTypeMap>;
@@ -0,0 +1,28 @@
1
+ import * as React from 'react';
2
+ import { SegmentedControl, TSegmentedControlProps } from './segmented_control';
3
+ /**
4
+ * Types.
5
+ */
6
+ interface ISegmentedControlsOwnProps {
7
+ /**
8
+ * The content of the component.
9
+ */
10
+ children: React.ReactElement<TSegmentedControlProps, typeof SegmentedControl>[];
11
+ /**
12
+ * The value of the currently selected `SegmentedControl`.
13
+ */
14
+ value: string;
15
+ /**
16
+ * The className of the component.
17
+ */
18
+ className?: string;
19
+ /**
20
+ * Callback fired when the value changes.
21
+ */
22
+ onChange?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>, value: string) => void;
23
+ }
24
+ /**
25
+ *
26
+ */
27
+ export declare const SegmentedControls: React.ForwardRefExoticComponent<ISegmentedControlsOwnProps & Omit<React.HTMLAttributes<HTMLDivElement>, "onChange"> & React.RefAttributes<HTMLDivElement>>;
28
+ export {};
@@ -17,11 +17,6 @@ export interface ITabOwnProps {
17
17
  * @default false
18
18
  */
19
19
  disabled?: boolean;
20
- /**
21
- * The color of the component.
22
- * @default 'black'
23
- */
24
- color?: ('black' | 'white');
25
20
  /**
26
21
  * Callback fired when the value changes.
27
22
  */
@@ -37,3 +37,4 @@ export * from './styles';
37
37
  export * from './hooks';
38
38
  export * from './OverridableComponent';
39
39
  export * from './Flex';
40
+ export * from './SegmentedControls';
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@peculiar/react-components",
3
3
  "private": false,
4
- "version": "1.8.4",
4
+ "version": "1.8.6",
5
5
  "author": "PeculiarVentures Team",
6
6
  "description": "A simple and customizable component library to build faster, beautiful, and more accessible React applications.",
7
7
  "keywords": [
@@ -79,5 +79,5 @@
79
79
  "node": ">=18.x"
80
80
  },
81
81
  "license": "MIT",
82
- "gitHead": "f274216163603ba720803f74dd867cace70de9d6"
82
+ "gitHead": "f6324a9b51ef74464fed108ec8b4380fae16e3bf"
83
83
  }