@synerise/ds-card-tabs 0.17.1 → 0.17.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -3,6 +3,25 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [0.17.3](https://github.com/Synerise/synerise-design/compare/@synerise/ds-card-tabs@0.17.2...@synerise/ds-card-tabs@0.17.3) (2024-11-28)
7
+
8
+ **Note:** Version bump only for package @synerise/ds-card-tabs
9
+
10
+
11
+
12
+
13
+
14
+ ## [0.17.2](https://github.com/Synerise/synerise-design/compare/@synerise/ds-card-tabs@0.17.1...@synerise/ds-card-tabs@0.17.2) (2024-11-21)
15
+
16
+
17
+ ### Bug Fixes
18
+
19
+ * **core:** onError fn types ([c34bdfe](https://github.com/Synerise/synerise-design/commit/c34bdfe9da898d7999c605f9fbcbba4716dfb6d4))
20
+
21
+
22
+
23
+
24
+
6
25
  ## [0.17.1](https://github.com/Synerise/synerise-design/compare/@synerise/ds-card-tabs@0.17.0...@synerise/ds-card-tabs@0.17.1) (2024-11-12)
7
26
 
8
27
  **Note:** Version bump only for package @synerise/ds-card-tabs
@@ -1,13 +1,8 @@
1
1
  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
2
-
3
2
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
4
-
5
3
  function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
6
-
7
4
  function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
8
-
9
5
  function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
10
-
11
6
  import React, { useState, useMemo, useCallback } from 'react';
12
7
  import Icon from '@synerise/ds-icon';
13
8
  import InlineEdit from '@synerise/ds-inline-edit/dist/InlineEdit';
@@ -17,42 +12,38 @@ import * as S from './CardTab.styles';
17
12
  import CardTabPrefix from './CardTabPrefix/CardTabPrefix';
18
13
  import CardTabActions from './CardTabActions/CardTabActions';
19
14
  import CardTabDropdown from './CardTabDropdown/CardTabDropdown';
20
-
21
15
  var CardTab = function CardTab(props) {
22
16
  var intl = props.intl,
23
- id = props.id,
24
- name = props.name,
25
- tag = props.tag,
26
- prefix = props.prefix,
27
- prefixIcon = props.prefixIcon,
28
- suffixIcon = props.suffixIcon,
29
- renderSuffix = props.renderSuffix,
30
- active = props.active,
31
- draggable = props.draggable,
32
- disabled = props.disabled,
33
- invalid = props.invalid,
34
- invalidName = props.invalidName,
35
- greyBackground = props.greyBackground,
36
- onChangeName = props.onChangeName,
37
- onSelectTab = props.onSelectTab,
38
- onDuplicateTab = props.onDuplicateTab,
39
- onRemoveTab = props.onRemoveTab,
40
- onPreviewTab = props.onPreviewTab,
41
- texts = props.texts,
42
- _props$color = props.color,
43
- color = _props$color === void 0 ? 'yellow' : _props$color,
44
- colorDot = props.colorDot,
45
- itemData = props.itemData,
46
- actionsAsDropdown = props.actionsAsDropdown;
47
-
17
+ id = props.id,
18
+ name = props.name,
19
+ tag = props.tag,
20
+ prefix = props.prefix,
21
+ prefixIcon = props.prefixIcon,
22
+ suffixIcon = props.suffixIcon,
23
+ renderSuffix = props.renderSuffix,
24
+ active = props.active,
25
+ draggable = props.draggable,
26
+ disabled = props.disabled,
27
+ invalid = props.invalid,
28
+ invalidName = props.invalidName,
29
+ greyBackground = props.greyBackground,
30
+ onChangeName = props.onChangeName,
31
+ onSelectTab = props.onSelectTab,
32
+ onDuplicateTab = props.onDuplicateTab,
33
+ onRemoveTab = props.onRemoveTab,
34
+ onPreviewTab = props.onPreviewTab,
35
+ texts = props.texts,
36
+ _props$color = props.color,
37
+ color = _props$color === void 0 ? 'yellow' : _props$color,
38
+ colorDot = props.colorDot,
39
+ itemData = props.itemData,
40
+ actionsAsDropdown = props.actionsAsDropdown;
48
41
  var _useState = useState(false),
49
- edited = _useState[0],
50
- setEdited = _useState[1];
51
-
42
+ edited = _useState[0],
43
+ setEdited = _useState[1];
52
44
  var _useState2 = useState(name),
53
- editedName = _useState2[0],
54
- setEditedName = _useState2[1];
55
-
45
+ editedName = _useState2[0],
46
+ setEditedName = _useState2[1];
56
47
  var getTexts = useMemo(function () {
57
48
  return _objectSpread({
58
49
  changeNameTooltip: intl.formatMessage({
@@ -85,7 +76,6 @@ var CardTab = function CardTab(props) {
85
76
  if (onChangeName === undefined) {
86
77
  return undefined;
87
78
  }
88
-
89
79
  return function (event) {
90
80
  !!event && event.stopPropagation();
91
81
  setEdited(true);
@@ -95,7 +85,6 @@ var CardTab = function CardTab(props) {
95
85
  if (onChangeName === undefined) {
96
86
  return undefined;
97
87
  }
98
-
99
88
  return function (event) {
100
89
  if (event) {
101
90
  var nameValue = event.target.value;
@@ -112,7 +101,6 @@ var CardTab = function CardTab(props) {
112
101
  if (onDuplicateTab === undefined) {
113
102
  return undefined;
114
103
  }
115
-
116
104
  return function (event) {
117
105
  event && event.stopPropagation();
118
106
  onDuplicateTab && onDuplicateTab(id);
@@ -122,17 +110,14 @@ var CardTab = function CardTab(props) {
122
110
  if (onRemoveTab === undefined) {
123
111
  return undefined;
124
112
  }
125
-
126
113
  return function (event) {
127
114
  event && event.stopPropagation();
128
115
  onRemoveTab && onRemoveTab(id);
129
116
  };
130
117
  }, [id, onRemoveTab]);
131
-
132
118
  var handlePreview = onPreviewTab && function () {
133
119
  return onPreviewTab(id);
134
120
  };
135
-
136
121
  var handleSelect = useCallback(function (event) {
137
122
  !!event && event.stopPropagation();
138
123
  !edited && onSelectTab && onSelectTab(id);
@@ -140,17 +125,14 @@ var CardTab = function CardTab(props) {
140
125
  var showCardActions = useCallback(function () {
141
126
  return (!!onChangeName || !!onDuplicateTab || !!onRemoveTab || !!onPreviewTab) && !suffixIcon && !renderSuffix;
142
127
  }, [onChangeName, onDuplicateTab, onRemoveTab, onPreviewTab, suffixIcon, renderSuffix]);
143
-
144
128
  var suffixProps = _objectSpread({}, props, {
145
129
  handleRemove: handleRemove,
146
130
  handleDuplicate: handleDuplicate,
147
131
  handleEditName: handleEditName,
148
132
  texts: getTexts
149
133
  });
150
-
151
134
  var cardSuffix = function () {
152
135
  var showActionsDropdownMenu = actionsAsDropdown && (onChangeName || handleDuplicate || handleRemove);
153
-
154
136
  if (showActionsDropdownMenu) {
155
137
  return /*#__PURE__*/React.createElement(CardTabDropdown, {
156
138
  editNameHandler: onChangeName ? handleEditName : undefined,
@@ -159,18 +141,15 @@ var CardTab = function CardTab(props) {
159
141
  texts: getTexts
160
142
  });
161
143
  }
162
-
163
144
  if (renderSuffix) {
164
145
  return renderSuffix(suffixProps);
165
146
  }
166
-
167
147
  if (suffixIcon) {
168
148
  return /*#__PURE__*/React.createElement(S.CardSuffixWrapper, null, /*#__PURE__*/React.createElement(Icon, {
169
149
  className: "ds-card-tabs__suffix-icon",
170
150
  component: suffixIcon
171
151
  }));
172
152
  }
173
-
174
153
  if (showCardActions()) {
175
154
  return /*#__PURE__*/React.createElement(CardTabActions, {
176
155
  onChangeName: onChangeName ? handleEditName : undefined,
@@ -180,10 +159,8 @@ var CardTab = function CardTab(props) {
180
159
  texts: getTexts
181
160
  });
182
161
  }
183
-
184
162
  return /*#__PURE__*/React.createElement(React.Fragment, null);
185
163
  }();
186
-
187
164
  return /*#__PURE__*/React.createElement(S.CardTabContainer, {
188
165
  edited: edited,
189
166
  active: Boolean(active),
@@ -225,5 +202,4 @@ var CardTab = function CardTab(props) {
225
202
  "data-testid": "card-tab-name"
226
203
  }, name))), cardSuffix);
227
204
  };
228
-
229
205
  export default injectIntl(CardTab);
@@ -61,10 +61,10 @@ export var CardTabContainer = styled.div.withConfig({
61
61
  componentId: "sc-1n86s98-10"
62
62
  })(["display:flex;flex-direction:row;align-items:center;justify-content:flex-start;padding:12px;width:168px;@media (max-width:588px){max-width:145px;}height:48px;user-select:none;background-color:", ";box-shadow:", ";border-radius:3px;border-width:", ";border-color:", ";border-style:solid;pointer-events:", ";", "{background-color:", ";color:", ";}", "{background-color:", ";}", "{height:", ";width:", ";border-width:", ";border-color:", ";border-style:solid;}", "{svg{color:", ";fill:", " !important;}}", "{svg{color:", " !important;fill:", " !important;}.remove{svg{color:", " !important;fill:", " !important;}}}&:hover{cursor:pointer;box-shadow:", ";background-color:", ";", "{display:", ";}", "{display:", ";}", "{color:", ";}", "{background-color:", ";color:", ";display:", ";}", "{svg{color:", ";fill:", ";}}", "{display:", ";svg{color:", ";fill:", " !important;}}", "{display:", ";}", "{display:", ";svg{color:", ";fill:", ";}}.ds-card-tabs__suffix-icon{svg{color:", ";fill:", " !important;}}}&:active{background-color:", ";}", "{input{color:", ";padding:0 !important;background-image:linear-gradient( to right,", " 0%,", " 33%,rgba(255,255,255,0) 34%,rgba(255,255,255,0) 100% ) !important;}}", "{color:", ";opacity:", ";}.ds-card-tabs__suffix-icon{svg{color:", ";fill:", ";}opacity:", ";}", "{opacity:", ";.ds-card-tabs__handle-icon{svg{color:", ";fill:", ";}}svg{color:", ";fill:", ";}", "{opacity:", ";}}"], function (_ref3) {
63
63
  var theme = _ref3.theme,
64
- active = _ref3.active,
65
- invalid = _ref3.invalid,
66
- color = _ref3.color,
67
- greyBackground = _ref3.greyBackground;
64
+ active = _ref3.active,
65
+ invalid = _ref3.invalid,
66
+ color = _ref3.color,
67
+ greyBackground = _ref3.greyBackground;
68
68
  if (invalid && active) return theme.palette['red-600'];
69
69
  if (active) return theme.palette["" + color];
70
70
  if (greyBackground) return theme.palette.white;
@@ -77,9 +77,9 @@ export var CardTabContainer = styled.div.withConfig({
77
77
  return greyBackground ? '0' : '1px';
78
78
  }, function (_ref6) {
79
79
  var theme = _ref6.theme,
80
- active = _ref6.active,
81
- invalid = _ref6.invalid,
82
- color = _ref6.color;
80
+ active = _ref6.active,
81
+ invalid = _ref6.invalid,
82
+ color = _ref6.color;
83
83
  if (invalid) return theme.palette['red-600'];
84
84
  return getColor(active, theme.palette["" + color], theme.palette['grey-300']);
85
85
  }, function (_ref7) {
@@ -87,73 +87,73 @@ export var CardTabContainer = styled.div.withConfig({
87
87
  return disabled ? 'none' : 'all';
88
88
  }, CardTabTag, function (_ref8) {
89
89
  var theme = _ref8.theme,
90
- active = _ref8.active,
91
- color = _ref8.color;
90
+ active = _ref8.active,
91
+ color = _ref8.color;
92
92
  return getColor(active, theme.palette.white, theme.palette["" + color]);
93
93
  }, function (_ref9) {
94
94
  var theme = _ref9.theme,
95
- active = _ref9.active,
96
- color = _ref9.color;
95
+ active = _ref9.active,
96
+ color = _ref9.color;
97
97
  return getColor(active, theme.palette["" + color], theme.palette.white);
98
98
  }, CardDot, function (_ref10) {
99
99
  var theme = _ref10.theme,
100
- active = _ref10.active,
101
- color = _ref10.color,
102
- invalid = _ref10.invalid;
100
+ active = _ref10.active,
101
+ color = _ref10.color,
102
+ invalid = _ref10.invalid;
103
103
  if (active && invalid) return theme.palette["" + color];
104
104
  return getColor(active, 'transparent', theme.palette["" + color]);
105
105
  }, CardDotPrefix, function (_ref11) {
106
106
  var active = _ref11.active,
107
- edited = _ref11.edited;
107
+ edited = _ref11.edited;
108
108
  return active && !edited ? '12px' : '24px';
109
109
  }, function (_ref12) {
110
110
  var active = _ref12.active,
111
- edited = _ref12.edited;
111
+ edited = _ref12.edited;
112
112
  return active && !edited ? '12px' : '24px';
113
113
  }, function (_ref13) {
114
114
  var active = _ref13.active,
115
- edited = _ref13.edited;
115
+ edited = _ref13.edited;
116
116
  return active && !edited ? '2px' : '0px';
117
117
  }, function (_ref14) {
118
118
  var theme = _ref14.theme,
119
- active = _ref14.active,
120
- edited = _ref14.edited;
119
+ active = _ref14.active,
120
+ edited = _ref14.edited;
121
121
  return active && !edited ? theme.palette.white : 'none';
122
122
  }, CardSuffixWrapper, function (_ref15) {
123
123
  var theme = _ref15.theme,
124
- active = _ref15.active;
124
+ active = _ref15.active;
125
125
  if (active) return theme.palette.white;
126
126
  return theme.palette['grey-600'];
127
127
  }, function (_ref16) {
128
128
  var theme = _ref16.theme,
129
- active = _ref16.active;
129
+ active = _ref16.active;
130
130
  if (active) return theme.palette.white;
131
131
  return theme.palette['grey-600'];
132
132
  }, CardTabSuffix, function (_ref17) {
133
133
  var theme = _ref17.theme,
134
- active = _ref17.active;
134
+ active = _ref17.active;
135
135
  return active ? theme.palette.white : theme.palette['grey-600'];
136
136
  }, function (_ref18) {
137
137
  var theme = _ref18.theme,
138
- active = _ref18.active;
138
+ active = _ref18.active;
139
139
  return active ? theme.palette.white : theme.palette['grey-600'];
140
140
  }, function (_ref19) {
141
141
  var theme = _ref19.theme,
142
- active = _ref19.active;
142
+ active = _ref19.active;
143
143
  return active ? theme.palette.white : theme.palette['red-600'];
144
144
  }, function (_ref20) {
145
145
  var theme = _ref20.theme,
146
- active = _ref20.active;
146
+ active = _ref20.active;
147
147
  return active ? theme.palette.white : theme.palette['red-600'];
148
148
  }, function (_ref21) {
149
149
  var greyBackground = _ref21.greyBackground;
150
150
  return greyBackground ? '0 4px 12px 0 rgba(35, 41, 54, 0.04)' : '';
151
151
  }, function (_ref22) {
152
152
  var theme = _ref22.theme,
153
- active = _ref22.active,
154
- invalid = _ref22.invalid,
155
- color = _ref22.color,
156
- greyBackground = _ref22.greyBackground;
153
+ active = _ref22.active,
154
+ invalid = _ref22.invalid,
155
+ color = _ref22.color,
156
+ greyBackground = _ref22.greyBackground;
157
157
  if (invalid && active) return theme.palette["" + getLighterColor('red-600')];
158
158
  if (active) return theme.palette["" + getLighterColor(color)];
159
159
  if (greyBackground && !active) return theme.palette.white;
@@ -166,31 +166,31 @@ export var CardTabContainer = styled.div.withConfig({
166
166
  return edited ? 'none' : 'flex';
167
167
  }, CardTabLabel, function (_ref25) {
168
168
  var theme = _ref25.theme,
169
- active = _ref25.active;
169
+ active = _ref25.active;
170
170
  if (active) return theme.palette.white;
171
171
  return theme.palette['grey-800'];
172
172
  }, CardTabTag, function (_ref26) {
173
173
  var theme = _ref26.theme,
174
- color = _ref26.color,
175
- active = _ref26.active;
174
+ color = _ref26.color,
175
+ active = _ref26.active;
176
176
  if (active) return theme.palette.white;
177
177
  return theme.palette["" + color];
178
178
  }, function (_ref27) {
179
179
  var theme = _ref27.theme,
180
- active = _ref27.active,
181
- color = _ref27.color;
180
+ active = _ref27.active,
181
+ color = _ref27.color;
182
182
  if (active) return theme.palette["" + color];
183
183
  return theme.palette.white;
184
184
  }, function (props) {
185
185
  return props.draggable ? 'none' : 'flex';
186
186
  }, CardTabPrefix, function (_ref28) {
187
187
  var theme = _ref28.theme,
188
- active = _ref28.active;
188
+ active = _ref28.active;
189
189
  if (active) return theme.palette.white;
190
190
  return theme.palette['grey-600'];
191
191
  }, function (_ref29) {
192
192
  var theme = _ref29.theme,
193
- active = _ref29.active;
193
+ active = _ref29.active;
194
194
  if (active) return theme.palette.white;
195
195
  return theme.palette['grey-600'];
196
196
  }, CardDragPrefix, function (_ref30) {
@@ -198,12 +198,12 @@ export var CardTabContainer = styled.div.withConfig({
198
198
  return edited ? 'none' : 'flex';
199
199
  }, function (_ref31) {
200
200
  var theme = _ref31.theme,
201
- active = _ref31.active;
201
+ active = _ref31.active;
202
202
  if (active) return theme.palette.white;
203
203
  return theme.palette['grey-600'];
204
204
  }, function (_ref32) {
205
205
  var theme = _ref32.theme,
206
- active = _ref32.active;
206
+ active = _ref32.active;
207
207
  if (active) return theme.palette.white;
208
208
  return theme.palette['grey-600'];
209
209
  }, CardDotPrefix, function (props) {
@@ -212,50 +212,50 @@ export var CardTabContainer = styled.div.withConfig({
212
212
  return props.draggable ? 'none' : 'flex';
213
213
  }, function (_ref33) {
214
214
  var theme = _ref33.theme,
215
- active = _ref33.active;
215
+ active = _ref33.active;
216
216
  return active ? theme.palette.white : theme.palette['grey-600'];
217
217
  }, function (_ref34) {
218
218
  var theme = _ref34.theme,
219
- active = _ref34.active;
219
+ active = _ref34.active;
220
220
  return active ? theme.palette.white : theme.palette['grey-600'];
221
221
  }, function (_ref35) {
222
222
  var theme = _ref35.theme,
223
- active = _ref35.active;
223
+ active = _ref35.active;
224
224
  if (active) return theme.palette.white;
225
225
  return theme.palette['grey-600'];
226
226
  }, function (_ref36) {
227
227
  var theme = _ref36.theme,
228
- active = _ref36.active;
228
+ active = _ref36.active;
229
229
  if (active) return theme.palette.white;
230
230
  return theme.palette['grey-600'];
231
231
  }, function (_ref37) {
232
232
  var theme = _ref37.theme,
233
- active = _ref37.active,
234
- invalid = _ref37.invalid,
235
- color = _ref37.color,
236
- greyBackground = _ref37.greyBackground;
233
+ active = _ref37.active,
234
+ invalid = _ref37.invalid,
235
+ color = _ref37.color,
236
+ greyBackground = _ref37.greyBackground;
237
237
  if (invalid && active) return theme.palette["" + getLighterColor('red-600')];
238
238
  if (active) return theme.palette["" + getLighterColor(color)];
239
239
  if (greyBackground && !active) return theme.palette.white;
240
240
  return theme.palette['grey-100'];
241
241
  }, InPlaceEditableInputContainer, function (_ref38) {
242
242
  var theme = _ref38.theme,
243
- active = _ref38.active;
243
+ active = _ref38.active;
244
244
  if (active) return theme.palette.white;
245
245
  return theme.palette['grey-800'];
246
246
  }, function (_ref39) {
247
247
  var theme = _ref39.theme,
248
- active = _ref39.active;
248
+ active = _ref39.active;
249
249
  if (active) return theme.palette.white;
250
250
  return theme.palette['grey-800'];
251
251
  }, function (_ref40) {
252
252
  var theme = _ref40.theme,
253
- active = _ref40.active;
253
+ active = _ref40.active;
254
254
  if (active) return theme.palette.white;
255
255
  return theme.palette['grey-800'];
256
256
  }, CardTabLabel, function (_ref41) {
257
257
  var theme = _ref41.theme,
258
- active = _ref41.active;
258
+ active = _ref41.active;
259
259
  if (active) return theme.palette.white;
260
260
  return theme.palette['grey-600'];
261
261
  }, function (_ref42) {
@@ -263,11 +263,11 @@ export var CardTabContainer = styled.div.withConfig({
263
263
  return disabled ? 0.4 : 1;
264
264
  }, function (_ref43) {
265
265
  var theme = _ref43.theme,
266
- active = _ref43.active;
266
+ active = _ref43.active;
267
267
  return getColor(active, theme.palette.white, theme.palette['grey-600']);
268
268
  }, function (_ref44) {
269
269
  var theme = _ref44.theme,
270
- active = _ref44.active;
270
+ active = _ref44.active;
271
271
  return getColor(active, theme.palette.white, theme.palette['grey-600']);
272
272
  }, function (_ref45) {
273
273
  var disabled = _ref45.disabled;
@@ -277,19 +277,19 @@ export var CardTabContainer = styled.div.withConfig({
277
277
  return disabled ? 0.4 : 1;
278
278
  }, function (_ref47) {
279
279
  var theme = _ref47.theme,
280
- active = _ref47.active;
280
+ active = _ref47.active;
281
281
  return getColor(active, theme.palette.white, theme.palette['grey-400']);
282
282
  }, function (_ref48) {
283
283
  var theme = _ref48.theme,
284
- active = _ref48.active;
284
+ active = _ref48.active;
285
285
  return getColor(active, theme.palette.white, theme.palette['grey-400']);
286
286
  }, function (_ref49) {
287
287
  var theme = _ref49.theme,
288
- active = _ref49.active;
288
+ active = _ref49.active;
289
289
  return getColor(active, theme.palette.white, theme.palette['grey-600']);
290
290
  }, function (_ref50) {
291
291
  var theme = _ref50.theme,
292
- active = _ref50.active;
292
+ active = _ref50.active;
293
293
  return getColor(active, theme.palette.white, theme.palette['grey-600']);
294
294
  }, CardTabSuffix, function (_ref51) {
295
295
  var disabled = _ref51.disabled;
@@ -1,5 +1,4 @@
1
1
  export var prefixType;
2
-
3
2
  (function (prefixType) {
4
3
  prefixType[prefixType["TAG"] = 0] = "TAG";
5
4
  prefixType[prefixType["ICON"] = 1] = "ICON";
@@ -1,14 +1,13 @@
1
1
  import React from 'react';
2
2
  import Cruds from '@synerise/ds-cruds';
3
3
  import * as S from '../CardTab.styles';
4
-
5
4
  var CardTabActions = function CardTabActions(_ref) {
6
5
  var onChangeName = _ref.onChangeName,
7
- enterEditNameMode = _ref.enterEditNameMode,
8
- onDuplicateTab = _ref.onDuplicateTab,
9
- onRemoveTab = _ref.onRemoveTab,
10
- onPreviewTab = _ref.onPreviewTab,
11
- texts = _ref.texts;
6
+ enterEditNameMode = _ref.enterEditNameMode,
7
+ onDuplicateTab = _ref.onDuplicateTab,
8
+ onRemoveTab = _ref.onRemoveTab,
9
+ onPreviewTab = _ref.onPreviewTab,
10
+ texts = _ref.texts;
12
11
  return /*#__PURE__*/React.createElement(S.CardTabSuffix, {
13
12
  "data-testid": "card-tab-suffix",
14
13
  className: "ds-card-tabs__suffix-nodrag"
@@ -23,5 +22,4 @@ var CardTabActions = function CardTabActions(_ref) {
23
22
  previewTooltip: texts == null ? void 0 : texts.previewTooltip
24
23
  }));
25
24
  };
26
-
27
25
  export default CardTabActions;
@@ -5,23 +5,19 @@ import Icon, { OptionVerticalM, EditM, DuplicateM, TrashM } from '@synerise/ds-i
5
5
  import Menu from '@synerise/ds-menu';
6
6
  import { theme } from '@synerise/ds-core';
7
7
  import * as S from '../CardTab.styles';
8
-
9
8
  var CardTabDropdown = function CardTabDropdown(_ref) {
10
9
  var editNameHandler = _ref.editNameHandler,
11
- duplicateHandler = _ref.duplicateHandler,
12
- removeHandler = _ref.removeHandler,
13
- texts = _ref.texts;
14
-
10
+ duplicateHandler = _ref.duplicateHandler,
11
+ removeHandler = _ref.removeHandler,
12
+ texts = _ref.texts;
15
13
  var _useState = useState(false),
16
- open = _useState[0],
17
- setOpen = _useState[1];
18
-
14
+ open = _useState[0],
15
+ setOpen = _useState[1];
19
16
  var ref = useRef(null);
20
17
  var menuItems = [];
21
18
  useOnClickOutside(ref, function () {
22
19
  setOpen(false);
23
20
  });
24
-
25
21
  if (editNameHandler) {
26
22
  menuItems.push({
27
23
  onClick: function onClick(event) {
@@ -35,7 +31,6 @@ var CardTabDropdown = function CardTabDropdown(_ref) {
35
31
  text: texts.changeNameMenuItem
36
32
  });
37
33
  }
38
-
39
34
  if (duplicateHandler) {
40
35
  menuItems.push({
41
36
  onClick: function onClick(event) {
@@ -49,7 +44,6 @@ var CardTabDropdown = function CardTabDropdown(_ref) {
49
44
  text: texts.duplicateMenuItem
50
45
  });
51
46
  }
52
-
53
47
  if (removeHandler) {
54
48
  menuItems.push({
55
49
  prefixel: /*#__PURE__*/React.createElement(Icon, {
@@ -64,7 +58,6 @@ var CardTabDropdown = function CardTabDropdown(_ref) {
64
58
  text: texts.removeMenuItem
65
59
  });
66
60
  }
67
-
68
61
  return /*#__PURE__*/React.createElement(S.CardTabSuffix, {
69
62
  "data-testid": "card-tab-suffix",
70
63
  className: "ds-card-tabs__suffix-nodrag"
@@ -89,5 +82,4 @@ var CardTabDropdown = function CardTabDropdown(_ref) {
89
82
  color: theme.palette['grey-600']
90
83
  })));
91
84
  };
92
-
93
85
  export default CardTabDropdown;
@@ -3,13 +3,12 @@ import Icon, { DragHandleM } from '@synerise/ds-icon';
3
3
  import { theme } from '@synerise/ds-core';
4
4
  import * as S from '../CardTab.styles';
5
5
  import { prefixType } from '../CardTab.types';
6
-
7
6
  var CardTabPrefix = function CardTabPrefix(_ref) {
8
7
  var prefix = _ref.prefix,
9
- draggable = _ref.draggable,
10
- tag = _ref.tag,
11
- prefixIcon = _ref.prefixIcon,
12
- colorDot = _ref.colorDot;
8
+ draggable = _ref.draggable,
9
+ tag = _ref.tag,
10
+ prefixIcon = _ref.prefixIcon,
11
+ colorDot = _ref.colorDot;
13
12
  var className = prefix === prefixType.HANDLE ? 'persistent' : '';
14
13
  return /*#__PURE__*/React.createElement(S.CardTabPrefix, {
15
14
  "data-testid": "card-tab-prefix"
@@ -28,5 +27,4 @@ var CardTabPrefix = function CardTabPrefix(_ref) {
28
27
  component: /*#__PURE__*/React.createElement(DragHandleM, null)
29
28
  }), ' '));
30
29
  };
31
-
32
30
  export default CardTabPrefix;
package/dist/CardTabs.js CHANGED
@@ -1,15 +1,9 @@
1
1
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
-
3
2
  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
4
-
5
3
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
6
-
7
4
  function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
8
-
9
5
  function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
10
-
11
6
  function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
12
-
13
7
  import React, { Children, cloneElement, isValidElement } from 'react';
14
8
  import { ReactSortable } from 'react-sortablejs';
15
9
  import Button from '@synerise/ds-button';
@@ -25,24 +19,20 @@ var SORTABLE_CONFIG = {
25
19
  if (ev1.related && ev1.related.classList.contains('ds-card-tabs-nodrag')) {
26
20
  return -1;
27
21
  }
28
-
29
22
  return true;
30
23
  }
31
24
  };
32
-
33
25
  var CardTabs = function CardTabs(_ref) {
34
26
  var className = _ref.className,
35
- onChangeOrder = _ref.onChangeOrder,
36
- onAddTab = _ref.onAddTab,
37
- maxTabsCount = _ref.maxTabsCount,
38
- _ref$children = _ref.children,
39
- children = _ref$children === void 0 ? [] : _ref$children,
40
- addTabLabel = _ref.addTabLabel;
41
-
27
+ onChangeOrder = _ref.onChangeOrder,
28
+ onAddTab = _ref.onAddTab,
29
+ maxTabsCount = _ref.maxTabsCount,
30
+ _ref$children = _ref.children,
31
+ children = _ref$children === void 0 ? [] : _ref$children,
32
+ addTabLabel = _ref.addTabLabel;
42
33
  var handleChangeOrder = function handleChangeOrder(newOrder) {
43
34
  onChangeOrder && onChangeOrder(newOrder);
44
35
  };
45
-
46
36
  var addTab = onAddTab ? /*#__PURE__*/React.createElement(S.CardTabsAddButton, {
47
37
  className: "ds-card-tabs-nodrag",
48
38
  "data-testid": "card-tabs-add-button"
@@ -55,7 +45,6 @@ var CardTabs = function CardTabs(_ref) {
55
45
  var childrenData = Children.map(children, function (child) {
56
46
  return child.props;
57
47
  });
58
-
59
48
  var renderChildren = function renderChildren() {
60
49
  return /*#__PURE__*/React.createElement(React.Fragment, null, Children.map(children, function (child, i) {
61
50
  var props = child.props;
@@ -66,7 +55,6 @@ var CardTabs = function CardTabs(_ref) {
66
55
  }));
67
56
  }));
68
57
  };
69
-
70
58
  return /*#__PURE__*/React.createElement(S.CardTabsContainer, {
71
59
  className: "ds-card-tabs " + (className || ''),
72
60
  "data-testid": "card-tabs-container"
@@ -80,5 +68,4 @@ var CardTabs = function CardTabs(_ref) {
80
68
  "data-testid": "card-tabs-static"
81
69
  }, renderChildren(), addTab));
82
70
  };
83
-
84
71
  export default CardTabs;
package/dist/utils.js CHANGED
@@ -6,12 +6,10 @@ export var getLighterColor = function getLighterColor(color) {
6
6
  if (color) {
7
7
  var levelRegex = /(\d){3}$/g;
8
8
  var matches = color.match(levelRegex);
9
-
10
9
  if (matches != null && matches.length) {
11
10
  var level = parseInt(matches[0], 10);
12
11
  return color.replace(levelRegex, (level - 100).toString());
13
12
  }
14
13
  }
15
-
16
14
  return color;
17
15
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@synerise/ds-card-tabs",
3
- "version": "0.17.1",
3
+ "version": "0.17.3",
4
4
  "description": "CardTabs UI Component for the Synerise Design System",
5
5
  "license": "ISC",
6
6
  "repository": "Synerise/synerise-design",
@@ -34,16 +34,15 @@
34
34
  ],
35
35
  "types": "dist/index.d.ts",
36
36
  "dependencies": {
37
- "@synerise/ds-button": "^0.21.18",
38
- "@synerise/ds-cruds": "^0.5.28",
39
- "@synerise/ds-dropdown": "^0.18.23",
40
- "@synerise/ds-icon": "^0.66.4",
41
- "@synerise/ds-inline-edit": "^0.9.0",
42
- "@synerise/ds-menu": "^0.20.5",
43
- "@synerise/ds-tooltip": "^0.14.48",
44
- "@synerise/ds-typography": "^0.16.5",
45
- "@synerise/ds-utils": "^0.31.1",
46
- "react-intl": "6.8.4",
37
+ "@synerise/ds-button": "^0.21.20",
38
+ "@synerise/ds-cruds": "^0.5.30",
39
+ "@synerise/ds-dropdown": "^0.18.25",
40
+ "@synerise/ds-icon": "^0.67.1",
41
+ "@synerise/ds-inline-edit": "^0.9.2",
42
+ "@synerise/ds-menu": "^0.20.7",
43
+ "@synerise/ds-tooltip": "^0.14.50",
44
+ "@synerise/ds-typography": "^0.16.7",
45
+ "@synerise/ds-utils": "^0.31.2",
47
46
  "react-sortablejs": "^6.0.0",
48
47
  "sortablejs": "1.15.1"
49
48
  },
@@ -51,7 +50,8 @@
51
50
  "@synerise/ds-core": "*",
52
51
  "antd": "4.7.0",
53
52
  "react": ">=16.9.0 <= 17.0.2",
53
+ "react-intl": ">=3.12.0 <= 6.8",
54
54
  "styled-components": "5.0.1"
55
55
  },
56
- "gitHead": "8d26191fc0475407e0691b9b183761ad3cd7c87d"
56
+ "gitHead": "4a56ee7ef816c22341ce704154dc7aa65b7d1dcc"
57
57
  }