@synerise/ds-card-tabs 1.4.3 → 1.4.5
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 +651 -2086
- package/README.md +32 -32
- package/dist/CardTab/CardTab.d.ts +1 -1
- package/dist/CardTab/CardTab.js +3 -3
- package/dist/CardTab/CardTab.styles.js +79 -27
- package/dist/CardTab/CardTab.types.d.ts +1 -1
- package/dist/CardTab/CardTabActions/CardTabActions.types.d.ts +2 -2
- package/dist/CardTab/CardTabDropdown/CardTabDropdown.d.ts +2 -2
- package/dist/CardTab/CardTabDropdown/CardTabDropdown.js +3 -3
- package/dist/CardTab/CardTabPrefix/CardTabPrefix.d.ts +1 -1
- package/dist/CardTab/CardTabPrefix/CardTabPrefix.js +1 -1
- package/dist/CardTab/CardTabPrefix/CardTabPrefix.types.d.ts +1 -1
- package/dist/CardTab/CardTabPrefix/CardTabPrefix.utils.d.ts +1 -1
- package/dist/CardTabs.d.ts +1 -1
- package/dist/CardTabs.js +1 -1
- package/dist/CardTabs.types.d.ts +2 -2
- package/dist/index.d.ts +2 -3
- package/dist/utils.js +3 -1
- package/package.json +12 -12
package/README.md
CHANGED
|
@@ -79,41 +79,41 @@ import CardTabs from '@synerise/ds-card-tabs'
|
|
|
79
79
|
|
|
80
80
|
### CardTab Component
|
|
81
81
|
|
|
82
|
-
| Property
|
|
83
|
-
|
|
|
84
|
-
| id
|
|
85
|
-
| index
|
|
86
|
-
| name
|
|
87
|
-
| tag
|
|
88
|
-
| addTabLabel
|
|
89
|
-
| active
|
|
90
|
-
| greyBackground
|
|
91
|
-
| prefixIcon
|
|
92
|
-
| suffixIcon
|
|
93
|
-
| disabled
|
|
94
|
-
| invalid
|
|
95
|
-
| invalidName
|
|
96
|
-
| draggable
|
|
97
|
-
| onSelectTab
|
|
98
|
-
| onPreviewTab
|
|
99
|
-
| onRemoveTab
|
|
100
|
-
| onDuplicateTab
|
|
101
|
-
| onChangeName
|
|
102
|
-
| texts
|
|
103
|
-
| color
|
|
104
|
-
| colorDot
|
|
105
|
-
| itemData
|
|
106
|
-
| renderSuffix
|
|
107
|
-
| actionsAsDropdown | render crud actions in dropdown instead of icons
|
|
82
|
+
| Property | Description | Type | Default |
|
|
83
|
+
| ----------------- | ------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------ | -------- |
|
|
84
|
+
| id | Id of tab | number | - |
|
|
85
|
+
| index | Position of tab | number | - |
|
|
86
|
+
| name | Name of tab | string | - |
|
|
87
|
+
| tag | Single letter (tag) of tab | string | - |
|
|
88
|
+
| addTabLabel | set text into add tab button | string | - |
|
|
89
|
+
| active | Flag of active tab | boolean | `false` |
|
|
90
|
+
| greyBackground | Change default color of tabs, use when background will be different then white | boolean | `false` |
|
|
91
|
+
| prefixIcon | Icon visible on the left side of the tab | SVG Icon | null |
|
|
92
|
+
| suffixIcon | Icon visible on the right side of the tab, when set action icons will be hidden | SVG Icon | null |
|
|
93
|
+
| disabled | Flag of disabled tabs | boolean | `false` |
|
|
94
|
+
| invalid | Flag of tabs with some errors | boolean | `false` |
|
|
95
|
+
| invalidName | Flag of tabs with invalid name | boolean | `false` |
|
|
96
|
+
| draggable | Shows drag handler on the left side of tab | boolean | `false` |
|
|
97
|
+
| onSelectTab | Callback fired when user clicks on the tab | (id: number) => void | - |
|
|
98
|
+
| onPreviewTab | Callback fired when user clicks on the preview tab icon | (id: number) => void | - |
|
|
99
|
+
| onRemoveTab | Callback fired when user clicks on the remove tab icon | (id: number) => void | - |
|
|
100
|
+
| onDuplicateTab | Callback fired when user clicks on the duplicate tab icon | (id: number) => void | - |
|
|
101
|
+
| onChangeName | Callback fired when the edit name input blur | (id: number, newName: string) | - |
|
|
102
|
+
| texts | Translations of CrudButtons tooltips | CardTabTexts | - |
|
|
103
|
+
| color | Color of CardTab | `red`/ `green`/ `grey`/ `yellow`/ `blue`/ `pink`/ `mars`/ `orange`/ `fern`/ `cyan`/ `purple`/ `violet` | `yellow` |
|
|
104
|
+
| colorDot | single color dot | React.ReactNode | - |
|
|
105
|
+
| itemData | Additional item data | any | - |
|
|
106
|
+
| renderSuffix | render custom suffix instead of cruds, dropdown menu or icon | (props: CardTabSuffixProps) => ReactNode | - |
|
|
107
|
+
| actionsAsDropdown | render crud actions in dropdown instead of icons | boolean | `false` |
|
|
108
108
|
|
|
109
109
|
#### CardTabTexts
|
|
110
110
|
|
|
111
|
-
| Property
|
|
112
|
-
|
|
|
113
|
-
| changeNameTooltip
|
|
114
|
-
| duplicateTooltip
|
|
115
|
-
| previewTooltip
|
|
116
|
-
| removeTooltip
|
|
111
|
+
| Property | Description | Type | Default |
|
|
112
|
+
| ------------------ | -------------------- | ------------------------ | ----------- |
|
|
113
|
+
| changeNameTooltip | Rename tooltip | string / React.ReactNode | 'Rename' |
|
|
114
|
+
| duplicateTooltip | Duplicate tooltip | string / React.ReactNode | 'Duplicate' |
|
|
115
|
+
| previewTooltip | Remove tooltip | string / React.ReactNode | 'Remove' |
|
|
116
|
+
| removeTooltip | Remove tooltip | string / React.ReactNode | 'Remove' |
|
|
117
117
|
| changeNameMenuItem | Rename menu label | string / React.ReactNode | 'Rename' |
|
|
118
118
|
| duplicateMenuItem | Duplicate menu label | string / React.ReactNode | 'Duplicate' |
|
|
119
119
|
| removeMenuItem | Remove menu label | string / React.ReactNode | 'Remove' |
|
package/dist/CardTab/CardTab.js
CHANGED
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
var _excluded = ["id", "name", "suffixIcon", "renderSuffix", "active", "draggable", "disabled", "invalid", "invalidName", "greyBackground", "onChangeName", "onSelectTab", "onDuplicateTab", "onRemoveTab", "onPreviewTab", "texts", "color", "itemData", "dragHandleProps", "actionsAsDropdown", "intl"];
|
|
2
2
|
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
3
3
|
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
4
|
-
import React, {
|
|
4
|
+
import React, { useCallback, useMemo, useState } from 'react';
|
|
5
|
+
import { useIntl } from 'react-intl';
|
|
5
6
|
import Icon from '@synerise/ds-icon';
|
|
6
7
|
import InlineEdit from '@synerise/ds-inline-edit';
|
|
7
|
-
import { useIntl } from 'react-intl';
|
|
8
8
|
import Tooltip from '@synerise/ds-tooltip';
|
|
9
9
|
import * as S from './CardTab.styles';
|
|
10
|
-
import CardTabPrefix from './CardTabPrefix/CardTabPrefix';
|
|
11
10
|
import CardTabActions from './CardTabActions/CardTabActions';
|
|
12
11
|
import CardTabDropdown from './CardTabDropdown/CardTabDropdown';
|
|
12
|
+
import CardTabPrefix from './CardTabPrefix/CardTabPrefix';
|
|
13
13
|
var CardTab = function CardTab(props) {
|
|
14
14
|
var id = props.id,
|
|
15
15
|
name = props.name,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import styled from 'styled-components';
|
|
2
|
-
import { macro } from '@synerise/ds-typography';
|
|
3
2
|
import { InPlaceEditableInputContainer } from '@synerise/ds-inline-edit/dist/InlineEdit.styles';
|
|
3
|
+
import { macro } from '@synerise/ds-typography';
|
|
4
4
|
import { getColor, getLighterColor } from '../utils';
|
|
5
5
|
export var CardTabSuffix = styled.div.withConfig({
|
|
6
6
|
displayName: "CardTabstyles__CardTabSuffix",
|
|
@@ -67,9 +67,15 @@ export var CardTabContainer = styled.div.withConfig({
|
|
|
67
67
|
invalid = _ref3.invalid,
|
|
68
68
|
color = _ref3.color,
|
|
69
69
|
greyBackground = _ref3.greyBackground;
|
|
70
|
-
if (invalid && active)
|
|
71
|
-
|
|
72
|
-
|
|
70
|
+
if (invalid && active) {
|
|
71
|
+
return theme.palette['red-600'];
|
|
72
|
+
}
|
|
73
|
+
if (active) {
|
|
74
|
+
return theme.palette["" + color];
|
|
75
|
+
}
|
|
76
|
+
if (greyBackground) {
|
|
77
|
+
return theme.palette.white;
|
|
78
|
+
}
|
|
73
79
|
return theme.palette['grey-050'];
|
|
74
80
|
}, function (_ref4) {
|
|
75
81
|
var greyBackground = _ref4.greyBackground;
|
|
@@ -82,7 +88,9 @@ export var CardTabContainer = styled.div.withConfig({
|
|
|
82
88
|
active = _ref6.active,
|
|
83
89
|
invalid = _ref6.invalid,
|
|
84
90
|
color = _ref6.color;
|
|
85
|
-
if (invalid)
|
|
91
|
+
if (invalid) {
|
|
92
|
+
return theme.palette['red-600'];
|
|
93
|
+
}
|
|
86
94
|
return getColor(active, theme.palette["" + color], theme.palette['grey-300']);
|
|
87
95
|
}, function (_ref7) {
|
|
88
96
|
var disabled = _ref7.disabled;
|
|
@@ -102,7 +110,9 @@ export var CardTabContainer = styled.div.withConfig({
|
|
|
102
110
|
active = _ref10.active,
|
|
103
111
|
color = _ref10.color,
|
|
104
112
|
invalid = _ref10.invalid;
|
|
105
|
-
if (active && invalid)
|
|
113
|
+
if (active && invalid) {
|
|
114
|
+
return theme.palette["" + color];
|
|
115
|
+
}
|
|
106
116
|
return getColor(active, 'transparent', theme.palette["" + color]);
|
|
107
117
|
}, CardDotPrefix, function (_ref11) {
|
|
108
118
|
var active = _ref11.active,
|
|
@@ -124,12 +134,16 @@ export var CardTabContainer = styled.div.withConfig({
|
|
|
124
134
|
}, CardSuffixWrapper, function (_ref15) {
|
|
125
135
|
var theme = _ref15.theme,
|
|
126
136
|
active = _ref15.active;
|
|
127
|
-
if (active)
|
|
137
|
+
if (active) {
|
|
138
|
+
return theme.palette.white;
|
|
139
|
+
}
|
|
128
140
|
return theme.palette['grey-600'];
|
|
129
141
|
}, function (_ref16) {
|
|
130
142
|
var theme = _ref16.theme,
|
|
131
143
|
active = _ref16.active;
|
|
132
|
-
if (active)
|
|
144
|
+
if (active) {
|
|
145
|
+
return theme.palette.white;
|
|
146
|
+
}
|
|
133
147
|
return theme.palette['grey-600'];
|
|
134
148
|
}, CardTabSuffix, function (_ref17) {
|
|
135
149
|
var theme = _ref17.theme,
|
|
@@ -156,9 +170,15 @@ export var CardTabContainer = styled.div.withConfig({
|
|
|
156
170
|
invalid = _ref22.invalid,
|
|
157
171
|
color = _ref22.color,
|
|
158
172
|
greyBackground = _ref22.greyBackground;
|
|
159
|
-
if (invalid && active)
|
|
160
|
-
|
|
161
|
-
|
|
173
|
+
if (invalid && active) {
|
|
174
|
+
return theme.palette["" + getLighterColor('red-600')];
|
|
175
|
+
}
|
|
176
|
+
if (active) {
|
|
177
|
+
return theme.palette["" + getLighterColor(color)];
|
|
178
|
+
}
|
|
179
|
+
if (greyBackground && !active) {
|
|
180
|
+
return theme.palette.white;
|
|
181
|
+
}
|
|
162
182
|
return theme.palette['grey-050'];
|
|
163
183
|
}, CardTabSuffix, function (_ref23) {
|
|
164
184
|
var edited = _ref23.edited;
|
|
@@ -169,31 +189,41 @@ export var CardTabContainer = styled.div.withConfig({
|
|
|
169
189
|
}, CardTabLabel, function (_ref25) {
|
|
170
190
|
var theme = _ref25.theme,
|
|
171
191
|
active = _ref25.active;
|
|
172
|
-
if (active)
|
|
192
|
+
if (active) {
|
|
193
|
+
return theme.palette.white;
|
|
194
|
+
}
|
|
173
195
|
return theme.palette['grey-800'];
|
|
174
196
|
}, CardTabTag, function (_ref26) {
|
|
175
197
|
var theme = _ref26.theme,
|
|
176
198
|
color = _ref26.color,
|
|
177
199
|
active = _ref26.active;
|
|
178
|
-
if (active)
|
|
200
|
+
if (active) {
|
|
201
|
+
return theme.palette.white;
|
|
202
|
+
}
|
|
179
203
|
return theme.palette["" + color];
|
|
180
204
|
}, function (_ref27) {
|
|
181
205
|
var theme = _ref27.theme,
|
|
182
206
|
active = _ref27.active,
|
|
183
207
|
color = _ref27.color;
|
|
184
|
-
if (active)
|
|
208
|
+
if (active) {
|
|
209
|
+
return theme.palette["" + color];
|
|
210
|
+
}
|
|
185
211
|
return theme.palette.white;
|
|
186
212
|
}, function (props) {
|
|
187
213
|
return props.isDraggable ? 'none' : 'flex';
|
|
188
214
|
}, CardTabPrefix, function (_ref28) {
|
|
189
215
|
var theme = _ref28.theme,
|
|
190
216
|
active = _ref28.active;
|
|
191
|
-
if (active)
|
|
217
|
+
if (active) {
|
|
218
|
+
return theme.palette.white;
|
|
219
|
+
}
|
|
192
220
|
return theme.palette['grey-600'];
|
|
193
221
|
}, function (_ref29) {
|
|
194
222
|
var theme = _ref29.theme,
|
|
195
223
|
active = _ref29.active;
|
|
196
|
-
if (active)
|
|
224
|
+
if (active) {
|
|
225
|
+
return theme.palette.white;
|
|
226
|
+
}
|
|
197
227
|
return theme.palette['grey-600'];
|
|
198
228
|
}, CardDragPrefix, function (_ref30) {
|
|
199
229
|
var edited = _ref30.edited;
|
|
@@ -201,12 +231,16 @@ export var CardTabContainer = styled.div.withConfig({
|
|
|
201
231
|
}, function (_ref31) {
|
|
202
232
|
var theme = _ref31.theme,
|
|
203
233
|
active = _ref31.active;
|
|
204
|
-
if (active)
|
|
234
|
+
if (active) {
|
|
235
|
+
return theme.palette.white;
|
|
236
|
+
}
|
|
205
237
|
return theme.palette['grey-600'];
|
|
206
238
|
}, function (_ref32) {
|
|
207
239
|
var theme = _ref32.theme,
|
|
208
240
|
active = _ref32.active;
|
|
209
|
-
if (active)
|
|
241
|
+
if (active) {
|
|
242
|
+
return theme.palette.white;
|
|
243
|
+
}
|
|
210
244
|
return theme.palette['grey-600'];
|
|
211
245
|
}, CardDotPrefix, function (props) {
|
|
212
246
|
return props.isDraggable ? 'none' : 'flex';
|
|
@@ -223,12 +257,16 @@ export var CardTabContainer = styled.div.withConfig({
|
|
|
223
257
|
}, function (_ref35) {
|
|
224
258
|
var theme = _ref35.theme,
|
|
225
259
|
active = _ref35.active;
|
|
226
|
-
if (active)
|
|
260
|
+
if (active) {
|
|
261
|
+
return theme.palette.white;
|
|
262
|
+
}
|
|
227
263
|
return theme.palette['grey-600'];
|
|
228
264
|
}, function (_ref36) {
|
|
229
265
|
var theme = _ref36.theme,
|
|
230
266
|
active = _ref36.active;
|
|
231
|
-
if (active)
|
|
267
|
+
if (active) {
|
|
268
|
+
return theme.palette.white;
|
|
269
|
+
}
|
|
232
270
|
return theme.palette['grey-600'];
|
|
233
271
|
}, function (_ref37) {
|
|
234
272
|
var theme = _ref37.theme,
|
|
@@ -236,29 +274,43 @@ export var CardTabContainer = styled.div.withConfig({
|
|
|
236
274
|
invalid = _ref37.invalid,
|
|
237
275
|
color = _ref37.color,
|
|
238
276
|
greyBackground = _ref37.greyBackground;
|
|
239
|
-
if (invalid && active)
|
|
240
|
-
|
|
241
|
-
|
|
277
|
+
if (invalid && active) {
|
|
278
|
+
return theme.palette["" + getLighterColor('red-600')];
|
|
279
|
+
}
|
|
280
|
+
if (active) {
|
|
281
|
+
return theme.palette["" + getLighterColor(color)];
|
|
282
|
+
}
|
|
283
|
+
if (greyBackground && !active) {
|
|
284
|
+
return theme.palette.white;
|
|
285
|
+
}
|
|
242
286
|
return theme.palette['grey-100'];
|
|
243
287
|
}, InPlaceEditableInputContainer, function (_ref38) {
|
|
244
288
|
var theme = _ref38.theme,
|
|
245
289
|
active = _ref38.active;
|
|
246
|
-
if (active)
|
|
290
|
+
if (active) {
|
|
291
|
+
return theme.palette.white;
|
|
292
|
+
}
|
|
247
293
|
return theme.palette['grey-800'];
|
|
248
294
|
}, function (_ref39) {
|
|
249
295
|
var theme = _ref39.theme,
|
|
250
296
|
active = _ref39.active;
|
|
251
|
-
if (active)
|
|
297
|
+
if (active) {
|
|
298
|
+
return theme.palette.white;
|
|
299
|
+
}
|
|
252
300
|
return theme.palette['grey-800'];
|
|
253
301
|
}, function (_ref40) {
|
|
254
302
|
var theme = _ref40.theme,
|
|
255
303
|
active = _ref40.active;
|
|
256
|
-
if (active)
|
|
304
|
+
if (active) {
|
|
305
|
+
return theme.palette.white;
|
|
306
|
+
}
|
|
257
307
|
return theme.palette['grey-800'];
|
|
258
308
|
}, CardTabLabel, function (_ref41) {
|
|
259
309
|
var theme = _ref41.theme,
|
|
260
310
|
active = _ref41.active;
|
|
261
|
-
if (active)
|
|
311
|
+
if (active) {
|
|
312
|
+
return theme.palette.white;
|
|
313
|
+
}
|
|
262
314
|
return theme.palette['grey-600'];
|
|
263
315
|
}, function (_ref42) {
|
|
264
316
|
var disabled = _ref42.disabled;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { KeyboardEvent, MouseEvent, ReactNode } from 'react';
|
|
2
2
|
import type { IntlShape } from 'react-intl';
|
|
3
3
|
import type { DefaultColor } from '@synerise/ds-core';
|
|
4
4
|
import type { DragHandlePropType } from '@synerise/ds-sortable';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { MouseEvent } from 'react';
|
|
2
|
-
import { CardTabTexts } from '../CardTab.types';
|
|
1
|
+
import { type MouseEvent } from 'react';
|
|
2
|
+
import { type CardTabTexts } from '../CardTab.types';
|
|
3
3
|
export type CardTabActionsProps = {
|
|
4
4
|
onChangeName?: (event?: MouseEvent<HTMLElement>) => void;
|
|
5
5
|
/** @deprecated */
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { CardTabDropdownProps } from './CardTabDropdown.types';
|
|
3
|
-
declare const CardTabDropdown: ({ editNameHandler, duplicateHandler, removeHandler, texts }: CardTabDropdownProps) => React.JSX.Element;
|
|
2
|
+
import { type CardTabDropdownProps } from './CardTabDropdown.types';
|
|
3
|
+
declare const CardTabDropdown: ({ editNameHandler, duplicateHandler, removeHandler, texts, }: CardTabDropdownProps) => React.JSX.Element;
|
|
4
4
|
export default CardTabDropdown;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import React, {
|
|
1
|
+
import React, { useRef, useState } from 'react';
|
|
2
2
|
import Dropdown from '@synerise/ds-dropdown';
|
|
3
|
-
import {
|
|
4
|
-
import Icon, { OptionVerticalM, EditM, DuplicateM, TrashM } from '@synerise/ds-icon';
|
|
3
|
+
import Icon, { DuplicateM, EditM, OptionVerticalM, TrashM } from '@synerise/ds-icon';
|
|
5
4
|
import Menu from '@synerise/ds-menu';
|
|
5
|
+
import { useOnClickOutside } from '@synerise/ds-utils';
|
|
6
6
|
import * as S from '../CardTab.styles';
|
|
7
7
|
var CardTabDropdown = function CardTabDropdown(_ref) {
|
|
8
8
|
var editNameHandler = _ref.editNameHandler,
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { CardTabPrefixProps } from './CardTabPrefix.types';
|
|
2
|
+
import { type CardTabPrefixProps } from './CardTabPrefix.types';
|
|
3
3
|
declare const CardTabPrefix: ({ draggable, dragHandleProps, ...rest }: CardTabPrefixProps) => React.JSX.Element;
|
|
4
4
|
export default CardTabPrefix;
|
|
@@ -5,7 +5,7 @@ import React, { useMemo } from 'react';
|
|
|
5
5
|
import Icon, { DragHandleM } from '@synerise/ds-icon';
|
|
6
6
|
import * as S from '../CardTab.styles';
|
|
7
7
|
import { prefixType } from '../CardTab.types';
|
|
8
|
-
import {
|
|
8
|
+
import { isDotPrefix, isHandlePrefix, isIconPrefix, isTagPrefix } from './CardTabPrefix.utils';
|
|
9
9
|
var CardTabPrefix = function CardTabPrefix(_ref) {
|
|
10
10
|
var draggable = _ref.draggable,
|
|
11
11
|
dragHandleProps = _ref.dragHandleProps,
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { type DotPrefixProps, type HandlePrefixProps, type IconPrefixProps, type PrefixProps, type TagPrefixProps } from '../CardTab.types';
|
|
2
2
|
export declare const isTagPrefix: (props: PrefixProps) => props is TagPrefixProps;
|
|
3
3
|
export declare const isDotPrefix: (props: PrefixProps) => props is DotPrefixProps;
|
|
4
4
|
export declare const isIconPrefix: (props: PrefixProps) => props is IconPrefixProps;
|
package/dist/CardTabs.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { CardTabsProps } from './CardTabs.types';
|
|
2
|
+
import { type CardTabsProps } from './CardTabs.types';
|
|
3
3
|
declare const CardTabs: <IdType extends string | number>({ className, onChangeOrder, onAddTab, maxTabsCount, children, addTabLabel, ...htmlAttributes }: CardTabsProps<IdType>) => React.JSX.Element;
|
|
4
4
|
export default CardTabs;
|
package/dist/CardTabs.js
CHANGED
|
@@ -5,8 +5,8 @@ import React, { Children, cloneElement, isValidElement } from 'react';
|
|
|
5
5
|
import Button from '@synerise/ds-button';
|
|
6
6
|
import { defaultColorsOrder } from '@synerise/ds-core';
|
|
7
7
|
import Sortable from '@synerise/ds-sortable';
|
|
8
|
-
import * as S from './CardTabs.styles';
|
|
9
8
|
import CardTab from './CardTab/CardTab';
|
|
9
|
+
import * as S from './CardTabs.styles';
|
|
10
10
|
var CardTabs = function CardTabs(_ref) {
|
|
11
11
|
var className = _ref.className,
|
|
12
12
|
onChangeOrder = _ref.onChangeOrder,
|
package/dist/CardTabs.types.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
1
|
+
import { type ReactElement } from 'react';
|
|
2
|
+
import { type WithHTMLAttributes } from '@synerise/ds-utils';
|
|
3
3
|
import type { CardTabProps } from './CardTab/CardTab.types';
|
|
4
4
|
export type CardTabsPropsBase<IdType extends string | number> = {
|
|
5
5
|
onChangeOrder?: (newOrder: CardTabProps<IdType>[]) => void;
|
package/dist/index.d.ts
CHANGED
|
@@ -2,11 +2,10 @@ import * as CardTabStyles from './CardTab/CardTab.styles';
|
|
|
2
2
|
import * as MainCardTabsStyles from './CardTabs.styles';
|
|
3
3
|
export { default } from './CardTabs';
|
|
4
4
|
export { default as CardTab } from './CardTab/CardTab';
|
|
5
|
-
export { prefixType } from './CardTab/CardTab.types';
|
|
5
|
+
export { prefixType, type CardTabProps } from './CardTab/CardTab.types';
|
|
6
6
|
export { CardDot } from './CardTab/CardTab.styles';
|
|
7
7
|
export declare const CardTabsStyles: {
|
|
8
8
|
CardTabs: typeof MainCardTabsStyles;
|
|
9
9
|
CardTab: typeof CardTabStyles;
|
|
10
10
|
};
|
|
11
|
-
export type { CardTabsItem, CardTabsProps, CardTabsPropsBase } from './CardTabs.types';
|
|
12
|
-
export type { CardTabProps } from './CardTab/CardTab.types';
|
|
11
|
+
export type { CardTabsItem, CardTabsProps, CardTabsPropsBase, } from './CardTabs.types';
|
package/dist/utils.js
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@synerise/ds-card-tabs",
|
|
3
|
-
"version": "1.4.
|
|
3
|
+
"version": "1.4.5",
|
|
4
4
|
"description": "CardTabs UI Component for the Synerise Design System",
|
|
5
5
|
"license": "ISC",
|
|
6
6
|
"repository": "Synerise/synerise-design",
|
|
@@ -34,16 +34,16 @@
|
|
|
34
34
|
],
|
|
35
35
|
"types": "dist/index.d.ts",
|
|
36
36
|
"dependencies": {
|
|
37
|
-
"@synerise/ds-button": "^1.4.
|
|
38
|
-
"@synerise/ds-cruds": "^1.0.
|
|
39
|
-
"@synerise/ds-dropdown": "^1.0.
|
|
40
|
-
"@synerise/ds-icon": "^1.5.
|
|
41
|
-
"@synerise/ds-inline-edit": "^1.0.
|
|
42
|
-
"@synerise/ds-menu": "^1.0.
|
|
43
|
-
"@synerise/ds-sortable": "^1.3.
|
|
44
|
-
"@synerise/ds-tooltip": "^1.1.
|
|
45
|
-
"@synerise/ds-typography": "^1.0.
|
|
46
|
-
"@synerise/ds-utils": "^1.3.
|
|
37
|
+
"@synerise/ds-button": "^1.4.2",
|
|
38
|
+
"@synerise/ds-cruds": "^1.0.13",
|
|
39
|
+
"@synerise/ds-dropdown": "^1.0.15",
|
|
40
|
+
"@synerise/ds-icon": "^1.5.4",
|
|
41
|
+
"@synerise/ds-inline-edit": "^1.0.17",
|
|
42
|
+
"@synerise/ds-menu": "^1.0.14",
|
|
43
|
+
"@synerise/ds-sortable": "^1.3.1",
|
|
44
|
+
"@synerise/ds-tooltip": "^1.1.12",
|
|
45
|
+
"@synerise/ds-typography": "^1.0.13",
|
|
46
|
+
"@synerise/ds-utils": "^1.3.1"
|
|
47
47
|
},
|
|
48
48
|
"peerDependencies": {
|
|
49
49
|
"@synerise/ds-core": "*",
|
|
@@ -52,5 +52,5 @@
|
|
|
52
52
|
"react-intl": ">=3.12.0 <= 6.8",
|
|
53
53
|
"styled-components": "^5.3.3"
|
|
54
54
|
},
|
|
55
|
-
"gitHead": "
|
|
55
|
+
"gitHead": "4512641033ba3581a3df208143c547fcfed45895"
|
|
56
56
|
}
|