akeneo-design-system 0.1.227 → 0.1.229
Sign up to get free protection for your applications and to get access to all the features.
- package/lib/components/Avatar/Avatar.d.ts +1 -8
- package/lib/components/Avatar/Avatar.js +1 -1
- package/lib/components/Avatar/Avatar.js.map +1 -1
- package/lib/components/Avatar/Avatars.d.ts +2 -1
- package/lib/components/Avatar/Avatars.js +19 -3
- package/lib/components/Avatar/Avatars.js.map +1 -1
- package/lib/components/Avatar/types.d.ts +11 -0
- package/lib/components/Avatar/types.js +3 -0
- package/lib/components/Avatar/types.js.map +1 -0
- package/lib/components/Dropdown/Dropdown.d.ts +1 -0
- package/lib/components/Dropdown/Item/Item.js +1 -1
- package/lib/components/Dropdown/Item/Item.js.map +1 -1
- package/lib/components/Dropdown/Surtitle/Surtitle.d.ts +1 -0
- package/lib/components/Input/MultiSelectInput/ChipInput.d.ts +1 -0
- package/lib/components/Input/MultiSelectInput/ChipInput.js +9 -7
- package/lib/components/Input/MultiSelectInput/ChipInput.js.map +1 -1
- package/lib/components/Input/MultiSelectInput/MultiSelectInput.d.ts +2 -1
- package/lib/components/Input/MultiSelectInput/MultiSelectInput.js +4 -4
- package/lib/components/Input/MultiSelectInput/MultiSelectInput.js.map +1 -1
- package/lib/components/KeyFigure/KeyFigure.js +1 -1
- package/lib/components/KeyFigure/KeyFigure.js.map +1 -1
- package/lib/components/Navigation/SubNavigationPanel/SubNavigationPanel.d.ts +2 -0
- package/lib/components/Navigation/SubNavigationPanel/SubNavigationPanel.js +28 -40
- package/lib/components/Navigation/SubNavigationPanel/SubNavigationPanel.js.map +1 -1
- package/lib/components/ProgressBar/ProgressBar.js +3 -3
- package/lib/components/ProgressBar/ProgressBar.js.map +1 -1
- package/lib/components/Tooltip/Tooltip.d.ts +4 -1
- package/lib/components/Tooltip/Tooltip.js +3 -1
- package/lib/components/Tooltip/Tooltip.js.map +1 -1
- package/package.json +1 -1
- package/src/__image_snapshots__/all-visual-tsx-visual-tests-renders-components-inputs-multi-select-input-locked-values-correctly-1-snap.png +0 -0
- package/src/__image_snapshots__/all-visual-tsx-visual-tests-renders-components-navigation-sub-navigation-panel-content-with-collapse-component-correctly-1-snap.png +0 -0
- package/src/__image_snapshots__/all-visual-tsx-visual-tests-renders-components-navigation-sub-navigation-panel-content-without-padding-correctly-1-snap.png +0 -0
- package/src/__image_snapshots__/all-visual-tsx-visual-tests-renders-components-navigation-sub-navigation-panel-scrollable-content-correctly-1-snap.png +0 -0
- package/src/__image_snapshots__/all-visual-tsx-visual-tests-renders-components-progress-bar-width-correctly-1-snap.png +0 -0
- package/src/__image_snapshots__/all-visual-tsx-visual-tests-renders-components-tooltip-with-title-correctly-1-snap.png +0 -0
- package/src/components/Avatar/Avatar.stories.mdx +1 -1
- package/src/components/Avatar/Avatar.tsx +2 -32
- package/src/components/Avatar/Avatars.tsx +27 -5
- package/src/components/Avatar/Avatars.unit.tsx +22 -2
- package/src/components/Avatar/types.ts +34 -0
- package/src/components/Dropdown/Item/Item.tsx +1 -0
- package/src/components/Dropdown/Surtitle/Surtitle.tsx +1 -1
- package/src/components/Input/MultiSelectInput/ChipInput.tsx +14 -4
- package/src/components/Input/MultiSelectInput/MultiSelectInput.stories.mdx +24 -0
- package/src/components/Input/MultiSelectInput/MultiSelectInput.tsx +7 -0
- package/src/components/Input/MultiSelectInput/MultiSelectInput.unit.tsx +20 -0
- package/src/components/KeyFigure/KeyFigure.stories.mdx +5 -1
- package/src/components/KeyFigure/KeyFigure.tsx +2 -0
- package/src/components/Navigation/SubNavigationPanel/SubNavigationPanel.stories.mdx +97 -25
- package/src/components/Navigation/SubNavigationPanel/SubNavigationPanel.tsx +58 -66
- package/src/components/Navigation/SubNavigationPanel/SubNavigationPanel.unit.tsx +3 -3
- package/src/components/ProgressBar/ProgressBar.tsx +1 -17
- package/src/components/Tooltip/Tooltip.stories.mdx +15 -0
- package/src/components/Tooltip/Tooltip.tsx +9 -1
|
@@ -1,12 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import {
|
|
3
|
-
declare type AvatarProps = Override<React.HTMLAttributes<HTMLSpanElement>, {
|
|
4
|
-
username: string;
|
|
5
|
-
firstName: string;
|
|
6
|
-
lastName: string;
|
|
7
|
-
avatarUrl?: string;
|
|
8
|
-
size?: 'default' | 'big';
|
|
9
|
-
}>;
|
|
2
|
+
import { AvatarProps } from './types';
|
|
10
3
|
declare const Avatar: ({ username, firstName, lastName, avatarUrl, size, ...rest }: AvatarProps) => React.JSX.Element;
|
|
11
4
|
export { Avatar };
|
|
12
5
|
export type { AvatarProps };
|
|
@@ -62,7 +62,7 @@ var Avatar = function (_a) {
|
|
|
62
62
|
var username = _a.username, firstName = _a.firstName, lastName = _a.lastName, avatarUrl = _a.avatarUrl, _b = _a.size, size = _b === void 0 ? 'default' : _b, rest = __rest(_a, ["username", "firstName", "lastName", "avatarUrl", "size"]);
|
|
63
63
|
var theme = (0, hooks_1.useTheme)();
|
|
64
64
|
var fallback = (firstName.trim().charAt(0) + lastName.trim().charAt(0) || username.substring(0, 2)).toLocaleUpperCase();
|
|
65
|
-
var title = (firstName + " " + lastName).trim() || username;
|
|
65
|
+
var title = ((firstName || '') + " " + (lastName || '')).trim() || username;
|
|
66
66
|
var backgroundColor = (0, react_1.useMemo)(function () {
|
|
67
67
|
var colorId = username.split('').reduce(function (s, l) { return s + l.charCodeAt(0); }, 0);
|
|
68
68
|
var colors = [
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../../../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAAqC;AACrC,qEAA8C;AAC9C,qCAAqC;
|
|
1
|
+
{"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../../../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":"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"}
|
|
@@ -2,7 +2,8 @@ import React from 'react';
|
|
|
2
2
|
import { Override } from '../../shared';
|
|
3
3
|
declare type AvatarsProps = Override<React.HTMLAttributes<HTMLDivElement>, {
|
|
4
4
|
max: number;
|
|
5
|
+
maxTitle?: number;
|
|
5
6
|
}>;
|
|
6
|
-
declare const Avatars:
|
|
7
|
+
declare const Avatars: React.FC<AvatarsProps>;
|
|
7
8
|
export { Avatars };
|
|
8
9
|
export type { AvatarsProps };
|
|
@@ -53,14 +53,30 @@ var react_1 = __importStar(require("react"));
|
|
|
53
53
|
var styled_components_1 = __importDefault(require("styled-components"));
|
|
54
54
|
var theme_1 = require("../../theme");
|
|
55
55
|
var AvatarListContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n flex-direction: row-reverse;\n justify-content: flex-end;\n & > * {\n margin-right: -4px;\n position: relative;\n }\n"], ["\n display: flex;\n flex-direction: row-reverse;\n justify-content: flex-end;\n & > * {\n margin-right: -4px;\n position: relative;\n }\n"])));
|
|
56
|
-
var RemainingAvatar = styled_components_1.default.span(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n height: 32px;\n width: 32px;\n
|
|
56
|
+
var RemainingAvatar = styled_components_1.default.span(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n height: 32px;\n width: 32px;\n border: 1px solid ", ";\n line-height: 32px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 15px;\n border-radius: 32px;\n background-color: ", ";\n"], ["\n height: 32px;\n width: 32px;\n border: 1px solid ", ";\n line-height: 32px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 15px;\n border-radius: 32px;\n background-color: ", ";\n"])), (0, theme_1.getColor)('grey', 10), (0, theme_1.getColor)('white'));
|
|
57
57
|
var Avatars = function (_a) {
|
|
58
|
-
var max = _a.max, children = _a.children, rest = __rest(_a, ["max", "children"]);
|
|
58
|
+
var max = _a.max, _b = _a.maxTitle, maxTitle = _b === void 0 ? 10 : _b, children = _a.children, rest = __rest(_a, ["max", "maxTitle", "children"]);
|
|
59
59
|
var childrenArray = react_1.Children.toArray(children);
|
|
60
60
|
var displayedChildren = childrenArray.slice(0, max);
|
|
61
|
+
var remainingChildren = childrenArray.slice(max, childrenArray.length + 1);
|
|
61
62
|
var remainingChildrenCount = childrenArray.length - max;
|
|
62
63
|
var reverseChildren = displayedChildren.reverse();
|
|
63
|
-
|
|
64
|
+
var remainingUsersTitle = (0, react_1.useMemo)(function () {
|
|
65
|
+
var remainingNames = remainingChildren
|
|
66
|
+
.map(function (child) {
|
|
67
|
+
if (!react_1.default.isValidElement(child))
|
|
68
|
+
return;
|
|
69
|
+
var _a = child.props, firstName = _a.firstName, lastName = _a.lastName, username = _a.username;
|
|
70
|
+
return ((firstName || '') + " " + (lastName || '')).trim() || username;
|
|
71
|
+
})
|
|
72
|
+
.slice(0, maxTitle)
|
|
73
|
+
.join('\n');
|
|
74
|
+
if (remainingChildren.length > maxTitle) {
|
|
75
|
+
return remainingNames.concat('\n', '...');
|
|
76
|
+
}
|
|
77
|
+
return remainingNames;
|
|
78
|
+
}, [maxTitle, remainingChildren]);
|
|
79
|
+
return (react_1.default.createElement(AvatarListContainer, __assign({ title: rest.title || remainingUsersTitle }, rest),
|
|
64
80
|
remainingChildrenCount > 0 && react_1.default.createElement(RemainingAvatar, null,
|
|
65
81
|
"+",
|
|
66
82
|
remainingChildrenCount),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Avatars.js","sourceRoot":"","sources":["../../../src/components/Avatar/Avatars.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,
|
|
1
|
+
{"version":3,"file":"Avatars.js","sourceRoot":"","sources":["../../../src/components/Avatar/Avatars.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA+C;AAC/C,wEAAuC;AAEvC,qCAAwD;AAGxD,IAAM,mBAAmB,GAAG,2BAAM,CAAC,GAAG,yNAAkC,sJAQvE,IAAA,CAAC;AAEF,IAAM,eAAe,GAAG,2BAAM,CAAC,IAAI,sSAAA,yDAGb,EAAoB,iKAOpB,EAAiB,KACtC,KARqB,IAAA,gBAAQ,EAAC,MAAM,EAAE,EAAE,CAAC,EAOpB,IAAA,gBAAQ,EAAC,OAAO,CAAC,CACtC,CAAC;AAUF,IAAM,OAAO,GAA2B,UAAC,EAAuC;IAAtC,IAAA,GAAG,SAAA,EAAE,gBAAa,EAAb,QAAQ,mBAAG,EAAE,KAAA,EAAE,QAAQ,cAAA,EAAK,IAAI,cAAtC,+BAAuC,CAAD;IAC7E,IAAM,aAAa,GAAG,gBAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;IACjD,IAAM,iBAAiB,GAAG,aAAa,CAAC,KAAK,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC;IACtD,IAAM,iBAAiB,GAAG,aAAa,CAAC,KAAK,CAAC,GAAG,EAAE,aAAa,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;IAC7E,IAAM,sBAAsB,GAAG,aAAa,CAAC,MAAM,GAAG,GAAG,CAAC;IAC1D,IAAM,eAAe,GAAG,iBAAiB,CAAC,OAAO,EAAE,CAAC;IAEpD,IAAM,mBAAmB,GAAG,IAAA,eAAO,EAAC;QAClC,IAAM,cAAc,GAAG,iBAAiB;aACrC,GAAG,CAAC,UAAA,KAAK;YACR,IAAI,CAAC,eAAK,CAAC,cAAc,CAAc,KAAK,CAAC;gBAAE,OAAO;YAChD,IAAA,KAAkC,KAAK,CAAC,KAAK,EAA5C,SAAS,eAAA,EAAE,QAAQ,cAAA,EAAE,QAAQ,cAAe,CAAC;YAEpD,OAAO,CAAA,CAAG,SAAS,IAAI,EAAE,WAAI,QAAQ,IAAI,EAAE,CAAE,CAAA,CAAC,IAAI,EAAE,IAAI,QAAQ,CAAC;QACnE,CAAC,CAAC;aACD,KAAK,CAAC,CAAC,EAAE,QAAQ,CAAC;aAClB,IAAI,CAAC,IAAI,CAAC,CAAC;QAEd,IAAI,iBAAiB,CAAC,MAAM,GAAG,QAAQ,EAAE;YACvC,OAAO,cAAc,CAAC,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;SAC3C;QAED,OAAO,cAAc,CAAC;IACxB,CAAC,EAAE,CAAC,QAAQ,EAAE,iBAAiB,CAAC,CAAC,CAAC;IAElC,OAAO,CACL,8BAAC,mBAAmB,aAAC,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,mBAAmB,IAAM,IAAI;QACpE,sBAAsB,GAAG,CAAC,IAAI,8BAAC,eAAe;;YAAG,sBAAsB,CAAmB;QAC1F,eAAe,CACI,CACvB,CAAC;AACJ,CAAC,CAAC;AAEM,0BAAO"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { Override } from '../../shared';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
export declare type User = {
|
|
4
|
+
username: string;
|
|
5
|
+
firstName: string;
|
|
6
|
+
lastName: string;
|
|
7
|
+
avatarUrl?: string;
|
|
8
|
+
};
|
|
9
|
+
export declare type AvatarProps = Override<React.HTMLAttributes<HTMLSpanElement>, User & {
|
|
10
|
+
size?: 'default' | 'big';
|
|
11
|
+
}>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/Avatar/types.ts"],"names":[],"mappings":""}
|
|
@@ -137,7 +137,7 @@ var Item = react_1.default.forwardRef(function (_a, forwardedRef) {
|
|
|
137
137
|
}
|
|
138
138
|
return child;
|
|
139
139
|
});
|
|
140
|
-
return (react_1.default.createElement(ItemContainer, __assign({ size: size, tabIndex: null === actionableRef.current && !disabled ? 0 : -1, onClick: handleClick, onKeyDown: handleKeyDown, disabled: disabled, "aria-disabled": disabled, isActive: isActive }, rest, { ref: forwardedRef }), decoratedChildren));
|
|
140
|
+
return (react_1.default.createElement(ItemContainer, __assign({ size: size, tabIndex: null === actionableRef.current && !disabled ? 0 : -1, onClick: handleClick, onKeyDown: handleKeyDown, disabled: disabled, "aria-disabled": disabled, isActive: isActive, title: title }, rest, { ref: forwardedRef }), decoratedChildren));
|
|
141
141
|
});
|
|
142
142
|
exports.Item = Item;
|
|
143
143
|
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Item.js","sourceRoot":"","sources":["../../../../src/components/Dropdown/Item/Item.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAAgH;AAChH,qEAA8C;AAC9C,wCAA2D;AAC3D,yDAAsD;AACtD,kEAA+D;AAC/D,sDAAmD;AACnD,0CAA8C;AAC9C,wCAAwC;AACxC,iDAA8C;AAE9C,IAAM,SAAS,GAAG,2BAAM,CAAC,IAAI,4JAAA,yFAK5B,IAAA,CAAC;
|
|
1
|
+
{"version":3,"file":"Item.js","sourceRoot":"","sources":["../../../../src/components/Dropdown/Item/Item.tsx"],"names":[],"mappings":"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"}
|
|
@@ -15,6 +15,7 @@ declare type ChipInputProps = {
|
|
|
15
15
|
onRemove: (chipCode: string) => void;
|
|
16
16
|
onSearchChange: (searchValue: string) => void;
|
|
17
17
|
onFocus?: () => void;
|
|
18
|
+
lockedValues?: string[];
|
|
18
19
|
};
|
|
19
20
|
declare const ChipInput: React.ForwardRefExoticComponent<ChipInputProps & React.RefAttributes<HTMLInputElement>>;
|
|
20
21
|
export { ChipInput };
|
|
@@ -51,18 +51,19 @@ var Chip = styled_components_1.default.li(templateObject_2 || (templateObject_2
|
|
|
51
51
|
var isSelected = _a.isSelected, isErrored = _a.isErrored;
|
|
52
52
|
return isErrored ? (0, theme_1.getColor)('red', 20) : isSelected ? (0, theme_1.getColor)('grey', 40) : (0, theme_1.getColor)('grey', 20);
|
|
53
53
|
}, function (_a) {
|
|
54
|
-
var readOnly = _a.readOnly, isErrored = _a.isErrored;
|
|
55
|
-
return isErrored ? (0, theme_1.getColor)('red', 100) : readOnly ? (0, theme_1.getColor)('grey', 100) : (0, theme_1.getColor)('grey', 140);
|
|
54
|
+
var readOnly = _a.readOnly, isErrored = _a.isErrored, isLocked = _a.isLocked;
|
|
55
|
+
return isErrored ? (0, theme_1.getColor)('red', 100) : readOnly || isLocked ? (0, theme_1.getColor)('grey', 100) : (0, theme_1.getColor)('grey', 140);
|
|
56
56
|
});
|
|
57
57
|
var Input = styled_components_1.default.input(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n border: 0;\n outline: 0;\n color: ", ";\n background-color: transparent;\n font-size: ", ";\n\n &::placeholder {\n opacity: 1;\n color: ", ";\n }\n"], ["\n width: 100%;\n height: 100%;\n border: 0;\n outline: 0;\n color: ", ";\n background-color: transparent;\n font-size: ", ";\n\n &::placeholder {\n opacity: 1;\n color: ", ";\n }\n"])), (0, theme_1.getColor)('grey', 120), (0, theme_1.getFontSize)('default'), (0, theme_1.getColor)('grey', 100));
|
|
58
58
|
var InputContainer = styled_components_1.default.li(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n list-style-type: none;\n color: ", ";\n border: 0;\n flex: 1;\n padding: 0;\n align-items: center;\n display: flex;\n\n :first-child > ", " {\n padding-left: 11px;\n }\n"], ["\n list-style-type: none;\n color: ", ";\n border: 0;\n flex: 1;\n padding: 0;\n align-items: center;\n display: flex;\n\n :first-child > ", " {\n padding-left: 11px;\n }\n"])), (0, theme_1.getColor)('grey', 120), Input);
|
|
59
59
|
var ReadOnlyIcon = (0, styled_components_1.default)(icons_1.LockIcon)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n position: absolute;\n right: 0;\n top: 0;\n margin: 11px;\n color: ", ";\n"], ["\n position: absolute;\n right: 0;\n top: 0;\n margin: 11px;\n color: ", ";\n"])), (0, theme_1.getColor)('grey', 100));
|
|
60
|
-
var
|
|
60
|
+
var LockedValueIcon = (0, styled_components_1.default)(icons_1.LockIcon)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n padding-right: 5px;\n"], ["\n padding-right: 5px;\n"])));
|
|
61
|
+
var RemoveButton = (0, styled_components_1.default)(IconButton_1.IconButton)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n background-color: transparent;\n margin-left: -3px;\n margin-right: 1px;\n color: ", ";\n"], ["\n background-color: transparent;\n margin-left: -3px;\n margin-right: 1px;\n color: ", ";\n"])), function (_a) {
|
|
61
62
|
var isErrored = _a.isErrored;
|
|
62
63
|
return (isErrored ? (0, theme_1.getColor)('red', 100) : (0, theme_1.getColor)('grey', 100));
|
|
63
64
|
});
|
|
64
65
|
var ChipInput = react_1.default.forwardRef(function (_a, forwardedRef) {
|
|
65
|
-
var id = _a.id, value = _a.value, invalidValue = _a.invalidValue, invalid = _a.invalid, readOnly = _a.readOnly, placeholder = _a.placeholder, searchValue = _a.searchValue, removeLabel = _a.removeLabel, onRemove = _a.onRemove, onSearchChange = _a.onSearchChange, onFocus = _a.onFocus;
|
|
66
|
+
var id = _a.id, value = _a.value, invalidValue = _a.invalidValue, invalid = _a.invalid, readOnly = _a.readOnly, placeholder = _a.placeholder, searchValue = _a.searchValue, removeLabel = _a.removeLabel, onRemove = _a.onRemove, onSearchChange = _a.onSearchChange, onFocus = _a.onFocus, lockedValues = _a.lockedValues;
|
|
66
67
|
var theme = (0, hooks_1.useTheme)();
|
|
67
68
|
var _b = (0, hooks_1.useBooleanState)(), isLastSelected = _b[0], selectLast = _b[1], unselectLast = _b[2];
|
|
68
69
|
var handleChange = function (event) { return onSearchChange(event.target.value); };
|
|
@@ -82,13 +83,14 @@ var ChipInput = react_1.default.forwardRef(function (_a, forwardedRef) {
|
|
|
82
83
|
}, [value, searchValue]);
|
|
83
84
|
(0, hooks_1.useShortcut)(shared_1.Key.Backspace, handleBackspace, forwardedRef);
|
|
84
85
|
return (react_1.default.createElement(Container, { invalid: invalid, readOnly: readOnly },
|
|
85
|
-
value.map(function (chip, index) { return (react_1.default.createElement(Chip, { key: chip.code, readOnly: readOnly, isErrored: invalidValue.includes(chip.code), isSelected: index === value.length - 1 && isLastSelected },
|
|
86
|
-
!readOnly && (react_1.default.createElement(RemoveButton, { title: removeLabel, ghost: "borderless", size: "small", level: "tertiary", icon: react_1.default.createElement(icons_1.CloseIcon, { color: invalidValue.includes(chip.code) ? theme.color.red100 : theme.color.grey100 }), onClick: function () { return onRemove(chip.code); }, isErrored: invalidValue.includes(chip.code) })),
|
|
86
|
+
value.map(function (chip, index) { return (react_1.default.createElement(Chip, { key: chip.code, readOnly: readOnly, isLocked: lockedValues === null || lockedValues === void 0 ? void 0 : lockedValues.includes(chip.code), isErrored: invalidValue.includes(chip.code), isSelected: index === value.length - 1 && isLastSelected },
|
|
87
|
+
!readOnly && !(lockedValues === null || lockedValues === void 0 ? void 0 : lockedValues.includes(chip.code)) && (react_1.default.createElement(RemoveButton, { title: removeLabel, ghost: "borderless", size: "small", level: "tertiary", icon: react_1.default.createElement(icons_1.CloseIcon, { color: invalidValue.includes(chip.code) ? theme.color.red100 : theme.color.grey100 }), onClick: function () { return onRemove(chip.code); }, isErrored: invalidValue.includes(chip.code) })),
|
|
88
|
+
(lockedValues === null || lockedValues === void 0 ? void 0 : lockedValues.includes(chip.code)) && react_1.default.createElement(LockedValueIcon, { size: 16 }),
|
|
87
89
|
chip.label)); }),
|
|
88
90
|
react_1.default.createElement(InputContainer, null,
|
|
89
91
|
react_1.default.createElement(Input, { type: "text", id: id, value: searchValue, ref: forwardedRef, placeholder: value.length === 0 ? placeholder : undefined, onChange: handleChange, onBlur: unselectLast, "aria-invalid": invalid, readOnly: readOnly, disabled: readOnly, onFocus: onFocus }),
|
|
90
92
|
readOnly && react_1.default.createElement(ReadOnlyIcon, { size: 16 }))));
|
|
91
93
|
});
|
|
92
94
|
exports.ChipInput = ChipInput;
|
|
93
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
|
|
95
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
|
|
94
96
|
//# sourceMappingURL=ChipInput.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChipInput.js","sourceRoot":"","sources":["../../../../src/components/Input/MultiSelectInput/ChipInput.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA4C;AAC5C,wEAAuC;AACvC,wCAAmD;AACnD,wCAAwE;AACxE,0DAAuD;AACvD,wCAAsE;AACtE,0CAAoC;AAEpC,IAAM,SAAS,GAAG,2BAAM,CAAC,EAAE,gXAAwC,wBAC7C,EAAsE,2KAQ5E,EAAqE,0FAKzD,EAAoB,UAE/C,KAfqB,UAAC,EAAS;QAAR,OAAO,aAAA;IAAM,OAAA,CAAC,OAAO,CAAC,CAAC,CAAC,IAAA,gBAAQ,EAAC,KAAK,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,IAAA,gBAAQ,EAAC,MAAM,EAAE,EAAE,CAAC,CAAC;AAAvD,CAAuD,EAQ5E,UAAC,EAAU;QAAT,QAAQ,cAAA;IAAM,OAAA,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAA,gBAAQ,EAAC,MAAM,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,IAAA,gBAAQ,EAAC,OAAO,CAAC,CAAC;AAArD,CAAqD,EAKzD,IAAA,gBAAQ,EAAC,MAAM,EAAE,EAAE,CAAC,CAE/C,CAAC;AAEF,IAAM,IAAI,GAAG,2BAAM,CAAC,EAAE,
|
|
1
|
+
{"version":3,"file":"ChipInput.js","sourceRoot":"","sources":["../../../../src/components/Input/MultiSelectInput/ChipInput.tsx"],"names":[],"mappings":"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"}
|
|
@@ -21,6 +21,7 @@ declare type MultiMultiSelectInputProps = Override<Override<React.InputHTMLAttri
|
|
|
21
21
|
invalid?: boolean;
|
|
22
22
|
children?: ReactElement<OptionProps>[] | ReactElement<OptionProps>;
|
|
23
23
|
verticalPosition?: VerticalPosition;
|
|
24
|
+
lockedValues?: string[];
|
|
24
25
|
onSubmit?: () => void;
|
|
25
26
|
} & ({
|
|
26
27
|
onNextPage?: () => void;
|
|
@@ -32,7 +33,7 @@ declare type MultiMultiSelectInputProps = Override<Override<React.InputHTMLAttri
|
|
|
32
33
|
disableInternalSearch: true;
|
|
33
34
|
})>;
|
|
34
35
|
declare const MultiSelectInput: {
|
|
35
|
-
({ id, placeholder, invalid, value, invalidValue, emptyResultLabel, children, onChange, removeLabel, onSubmit, openLabel, readOnly, verticalPosition, onNextPage, onSearchChange, disableInternalSearch, "aria-labelledby": ariaLabelledby, ...rest }: MultiMultiSelectInputProps): React.JSX.Element;
|
|
36
|
+
({ id, placeholder, invalid, value, invalidValue, emptyResultLabel, children, onChange, removeLabel, onSubmit, openLabel, readOnly, verticalPosition, onNextPage, onSearchChange, disableInternalSearch, lockedValues, "aria-labelledby": ariaLabelledby, ...rest }: MultiMultiSelectInputProps): React.JSX.Element;
|
|
36
37
|
Option: {
|
|
37
38
|
({ children, ...rest }: OptionProps): React.JSX.Element;
|
|
38
39
|
displayName: string;
|
|
@@ -85,9 +85,9 @@ var Option = function (_a) {
|
|
|
85
85
|
return react_1.default.createElement("span", __assign({}, rest), children);
|
|
86
86
|
};
|
|
87
87
|
var MultiSelectInput = function (_a) {
|
|
88
|
-
var id = _a.id, placeholder = _a.placeholder, invalid = _a.invalid, value = _a.value, _b = _a.invalidValue, invalidValue = _b === void 0 ? [] : _b, emptyResultLabel = _a.emptyResultLabel, _c = _a.children, children = _c === void 0 ? [] : _c, onChange = _a.onChange, removeLabel = _a.removeLabel, onSubmit = _a.onSubmit, openLabel = _a.openLabel, _d = _a.readOnly, readOnly = _d === void 0 ? false : _d, verticalPosition = _a.verticalPosition, onNextPage = _a.onNextPage, onSearchChange = _a.onSearchChange, _e = _a.disableInternalSearch, disableInternalSearch = _e === void 0 ? false : _e, ariaLabelledby = _a["aria-labelledby"], rest = __rest(_a, ["id", "placeholder", "invalid", "value", "invalidValue", "emptyResultLabel", "children", "onChange", "removeLabel", "onSubmit", "openLabel", "readOnly", "verticalPosition", "onNextPage", "onSearchChange", "disableInternalSearch", 'aria-labelledby']);
|
|
89
|
-
var
|
|
90
|
-
var
|
|
88
|
+
var id = _a.id, placeholder = _a.placeholder, invalid = _a.invalid, value = _a.value, _b = _a.invalidValue, invalidValue = _b === void 0 ? [] : _b, emptyResultLabel = _a.emptyResultLabel, _c = _a.children, children = _c === void 0 ? [] : _c, onChange = _a.onChange, removeLabel = _a.removeLabel, onSubmit = _a.onSubmit, openLabel = _a.openLabel, _d = _a.readOnly, readOnly = _d === void 0 ? false : _d, verticalPosition = _a.verticalPosition, onNextPage = _a.onNextPage, onSearchChange = _a.onSearchChange, _e = _a.disableInternalSearch, disableInternalSearch = _e === void 0 ? false : _e, _f = _a.lockedValues, lockedValues = _f === void 0 ? [] : _f, ariaLabelledby = _a["aria-labelledby"], rest = __rest(_a, ["id", "placeholder", "invalid", "value", "invalidValue", "emptyResultLabel", "children", "onChange", "removeLabel", "onSubmit", "openLabel", "readOnly", "verticalPosition", "onNextPage", "onSearchChange", "disableInternalSearch", "lockedValues", 'aria-labelledby']);
|
|
89
|
+
var _g = (0, react_1.useState)(''), searchValue = _g[0], setSearchValue = _g[1];
|
|
90
|
+
var _h = (0, hooks_1.useBooleanState)(), dropdownIsOpen = _h[0], openOverlay = _h[1], closeOverlay = _h[2];
|
|
91
91
|
var inputRef = (0, react_1.useRef)(null);
|
|
92
92
|
var containerRef = (0, react_1.useRef)(null);
|
|
93
93
|
var optionsContainerRef = (0, react_1.useRef)(null);
|
|
@@ -155,7 +155,7 @@ var MultiSelectInput = function (_a) {
|
|
|
155
155
|
(0, hooks_1.useShortcut)(shared_1.Key.Escape, handleBlur, inputRef);
|
|
156
156
|
return (react_1.default.createElement(MultiSelectInputContainer, __assign({ ref: containerRef, readOnly: readOnly, value: value }, rest),
|
|
157
157
|
react_1.default.createElement(InputContainer, null,
|
|
158
|
-
react_1.default.createElement(ChipInput_1.ChipInput, { ref: inputRef, id: id, placeholder: placeholder, value: value.map(function (chipCode) { var _a; return (_a = indexedChips[chipCode]) !== null && _a !== void 0 ? _a : { code: chipCode, label: chipCode }; }), invalidValue: invalidValue, searchValue: searchValue, removeLabel: removeLabel, readOnly: readOnly, invalid: invalid, onSearchChange: handleSearch, onRemove: handleRemove, onFocus: handleFocus }),
|
|
158
|
+
react_1.default.createElement(ChipInput_1.ChipInput, { ref: inputRef, id: id, placeholder: placeholder, value: value.map(function (chipCode) { var _a; return (_a = indexedChips[chipCode]) !== null && _a !== void 0 ? _a : { code: chipCode, label: chipCode }; }), invalidValue: invalidValue, searchValue: searchValue, removeLabel: removeLabel, readOnly: readOnly, invalid: invalid, onSearchChange: handleSearch, onRemove: handleRemove, onFocus: handleFocus, lockedValues: lockedValues }),
|
|
159
159
|
!readOnly && (react_1.default.createElement(ActionContainer, null,
|
|
160
160
|
react_1.default.createElement(components_1.IconButton, { ghost: "borderless", level: "tertiary", size: "small", icon: react_1.default.createElement(icons_1.ArrowDownIcon, null), title: openLabel, onClick: openOverlay, onFocus: handleBlur, tabIndex: 0 })))),
|
|
161
161
|
dropdownIsOpen && !readOnly && (react_1.default.createElement(common_1.Overlay, { parentRef: containerRef, onClose: handleBlur },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiSelectInput.js","sourceRoot":"","sources":["../../../../src/components/Input/MultiSelectInput/MultiSelectInput.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA4E;AAC5E,wEAAuC;AACvC,0CAA2D;AAC3D,oCAA8C;AAC9C,kDAA+C;AAC/C,wCAA8E;AAC9E,wCAA2D;AAC3D,wCAA6C;AAC7C,yCAAiD;AACjD,8DAA2D;AAE3D,IAAM,yBAAyB,GAAG,2BAAM,CAAC,GAAG,6MAA+D,4DAI7F,EAAsD,qBAClD,EAA0F,qDAM3G,KAPa,UAAC,EAAU;QAAT,QAAQ,cAAA;IAAM,OAAA,CAAC,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC;AAAtC,CAAsC,EAClD,UAAC,EAAiB;QAAhB,KAAK,WAAA,EAAE,QAAQ,cAAA;IAAM,OAAA,CAAC,IAAI,KAAK,KAAK,IAAI,QAAQ,CAAC,CAAC,CAAC,IAAA,gBAAQ,EAAC,MAAM,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,aAAa,CAAC;AAAnE,CAAmE,CAM3G,CAAC;AAEF,IAAM,cAAc,GAAG,2BAAM,CAAC,GAAG,8FAAA,2BAEhC,IAAA,CAAC;AAEF,IAAM,eAAe,GAAG,2BAAM,CAAC,GAAG,iMAAA,8HAQjC,IAAA,CAAC;AAEF,IAAM,eAAe,GAAG,2BAAM,CAAC,GAAG,8eAAA,kBAClB,EAAiB,sLAStB,EAAqB,qDAInB,EAAqB,uCAGhB,EAAoB,gBACzB,EAAsB,mCAGtB,EAAsB,4DAItB,EAAqB,UAEjC,KA1Be,IAAA,gBAAQ,EAAC,OAAO,CAAC,EAStB,IAAA,gBAAQ,EAAC,MAAM,EAAE,GAAG,CAAC,EAInB,IAAA,gBAAQ,EAAC,MAAM,EAAE,GAAG,CAAC,EAGhB,IAAA,gBAAQ,EAAC,MAAM,EAAE,EAAE,CAAC,EACzB,IAAA,gBAAQ,EAAC,OAAO,EAAE,GAAG,CAAC,EAGtB,IAAA,gBAAQ,EAAC,OAAO,EAAE,GAAG,CAAC,EAItB,IAAA,gBAAQ,EAAC,MAAM,EAAE,GAAG,CAAC,CAEjC,CAAC;AAEF,IAAM,oBAAoB,GAAG,2BAAM,CAAC,GAAG,+RAAA,kBACvB,EAAiB,oJAOtB,EAAqB,kDAG/B,KAVe,IAAA,gBAAQ,EAAC,OAAO,CAAC,EAOtB,IAAA,gBAAQ,EAAC,MAAM,EAAE,GAAG,CAAC,CAG/B,CAAC;AAEF,IAAM,gBAAgB,GAAG,2BAAM,CAAC,GAAG,kHAAA,+CAGlC,IAAA,CAAC;AAOF,IAAM,MAAM,GAAG,UAAC,EAAgC;IAA/B,IAAA,QAAQ,cAAA,EAAK,IAAI,cAAlB,YAAmB,CAAD;IAAmB,OAAA,mDAAU,IAAI,GAAG,QAAQ,CAAQ,CAAA;CAAA,CAAC;
|
|
1
|
+
{"version":3,"file":"MultiSelectInput.js","sourceRoot":"","sources":["../../../../src/components/Input/MultiSelectInput/MultiSelectInput.tsx"],"names":[],"mappings":"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"}
|
|
@@ -52,7 +52,7 @@ exports.KeyFigureGrid = exports.KeyFigure = void 0;
|
|
|
52
52
|
var react_1 = __importStar(require("react"));
|
|
53
53
|
var styled_components_1 = __importDefault(require("styled-components"));
|
|
54
54
|
var theme_1 = require("../../theme");
|
|
55
|
-
var FigureContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n color: ", ";\n font-size: 16px;\n margin: 0 15px 0 3px;\n\n :only-child {\n margin: 0;\n }\n"], ["\n color: ", ";\n font-size: 16px;\n margin: 0 15px 0 3px;\n\n :only-child {\n margin: 0;\n }\n"])), (0, theme_1.getColor)('brand', 100));
|
|
55
|
+
var FigureContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n color: ", ";\n font-size: 16px;\n margin: 0 15px 0 3px;\n display: flex;\n align-items: center;\n\n :only-child {\n margin: 0;\n }\n"], ["\n color: ", ";\n font-size: 16px;\n margin: 0 15px 0 3px;\n display: flex;\n align-items: center;\n\n :only-child {\n margin: 0;\n }\n"])), (0, theme_1.getColor)('brand', 100));
|
|
56
56
|
var Figure = function (_a) {
|
|
57
57
|
var label = _a.label, children = _a.children;
|
|
58
58
|
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"KeyFigure.js","sourceRoot":"","sources":["../../../src/components/KeyFigure/KeyFigure.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAAqE;AACrE,wEAAuC;AACvC,qCAAkD;AAQlD,IAAM,eAAe,GAAG,2BAAM,CAAC,GAAG,
|
|
1
|
+
{"version":3,"file":"KeyFigure.js","sourceRoot":"","sources":["../../../src/components/KeyFigure/KeyFigure.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAAqE;AACrE,wEAAuC;AACvC,qCAAkD;AAQlD,IAAM,eAAe,GAAG,2BAAM,CAAC,GAAG,sNAAA,aACvB,EAAsB,oIAShC,KATU,IAAA,gBAAQ,EAAC,OAAO,EAAE,GAAG,CAAC,CAShC,CAAC;AAEF,IAAM,MAAM,GAAG,UAAC,EAA8B;QAA7B,KAAK,WAAA,EAAE,QAAQ,cAAA;IAC9B,OAAO,CACL;QACG,KAAK,IAAO,KAAK,MAAG;QACrB,8BAAC,eAAe,QAAE,QAAQ,CAAmB,CAC5C,CACJ,CAAC;AACJ,CAAC,CAAC;AAQF,IAAM,kBAAkB,GAAG,2BAAM,CAAC,GAAG,iKAAA,uFAIrB,EAAiB,KAChC,KADe,IAAA,gBAAQ,EAAC,OAAO,CAAC,CAChC,CAAC;AAEF,IAAM,aAAa,GAAG,2BAAM,CAAC,GAAG,uPAAA,kHAKV,EAAoB,oDAI7B,EAAqB,UAEjC,KANqB,IAAA,gBAAQ,EAAC,MAAM,EAAE,EAAE,CAAC,EAI7B,IAAA,gBAAQ,EAAC,MAAM,EAAE,GAAG,CAAC,CAEjC,CAAC;AAEF,IAAM,gBAAgB,GAAG,2BAAM,CAAC,GAAG,6LAAA,0HAMlC,IAAA,CAAC;AAEF,IAAM,KAAK,GAAG,2BAAM,CAAC,GAAG,oLAAA,aACb,EAAqB,kBACjB,EAAkB,8EAIhC,KALU,IAAA,gBAAQ,EAAC,MAAM,EAAE,GAAG,CAAC,EACjB,IAAA,mBAAW,EAAC,KAAK,CAAC,CAIhC,CAAC;AACF,IAAM,MAAM,GAAG,2BAAM,CAAC,GAAG,6HAAA,+BAEd,EAAqB,yBAE/B,KAFU,IAAA,gBAAQ,EAAC,MAAM,EAAE,GAAG,CAAC,CAE/B,CAAC;AAEF,IAAM,SAAS,GAAG,UAAC,EAAiD;IAAhD,IAAA,IAAI,UAAA,EAAE,KAAK,WAAA,EAAE,QAAQ,cAAA,EAAK,KAAK,cAAhC,6BAAiC,CAAD;IACjD,IAAM,SAAS,GAAG,IAAA,sBAAc,EAAY,IAAI,CAAC,IAAI,eAAK,CAAC,YAAY,CAAC,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAC,CAAC,CAAC;IAE1F,OAAO,CACL,8BAAC,kBAAkB,eAAK,KAAK;QAC3B,8BAAC,aAAa,QAAE,SAAS,CAAiB;QAC1C,8BAAC,gBAAgB;YACf,8BAAC,KAAK,QAAE,KAAK,CAAS;YACtB,8BAAC,MAAM,QAAE,QAAQ,CAAU,CACV,CACA,CACtB,CAAC;AACJ,CAAC,CAAC;AAUM,8BAAS;AARjB,IAAM,aAAa,GAAG,2BAAM,CAAC,GAAG,uKAAA,oGAI/B,IAAA,CAAC;AAIiB,sCAAa;AAFhC,SAAS,CAAC,MAAM,GAAG,MAAM,CAAC"}
|
|
@@ -6,9 +6,11 @@ declare type SubNavigationPanelProps = {
|
|
|
6
6
|
close: () => void;
|
|
7
7
|
closeTitle?: string;
|
|
8
8
|
openTitle?: string;
|
|
9
|
+
noPadding?: boolean;
|
|
9
10
|
};
|
|
10
11
|
declare type SubNavigationPanelCompoundType = ForwardRefExoticComponent<PropsWithoutRef<SubNavigationPanelProps> & RefAttributes<HTMLDivElement>> & {
|
|
11
12
|
Collapsed?: any;
|
|
13
|
+
Section?: any;
|
|
12
14
|
};
|
|
13
15
|
declare const SubNavigationPanel: SubNavigationPanelCompoundType;
|
|
14
16
|
export { SubNavigationPanel };
|
|
@@ -49,62 +49,50 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
49
49
|
};
|
|
50
50
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
51
51
|
exports.SubNavigationPanel = void 0;
|
|
52
|
-
var react_1 =
|
|
53
|
-
var styled_components_1 =
|
|
52
|
+
var react_1 = __importStar(require("react"));
|
|
53
|
+
var styled_components_1 = __importDefault(require("styled-components"));
|
|
54
54
|
var icons_1 = require("../../../icons");
|
|
55
55
|
var theme_1 = require("../../../theme");
|
|
56
|
-
var
|
|
56
|
+
var Container = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n border-right: 1px solid ", ";\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n height: 100%;\n transition: width 0.3s linear;\n width: ", ";\n"], ["\n background-color: ", ";\n border-right: 1px solid ", ";\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n height: 100%;\n transition: width 0.3s linear;\n width: ", ";\n"])), (0, theme_1.getColor)('grey', 20), (0, theme_1.getColor)('grey', 80), function (_a) {
|
|
57
57
|
var isOpen = _a.isOpen;
|
|
58
|
-
return (isOpen ?
|
|
59
|
-
}, function (_a) {
|
|
60
|
-
var isOpen = _a.isOpen;
|
|
61
|
-
return !isOpen && (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n position: absolute;\n z-index: 0;\n "], ["\n position: absolute;\n z-index: 0;\n "])));
|
|
62
|
-
});
|
|
63
|
-
var Panel = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n height: calc(100% - 54px);\n width: 100%;\n position: absolute;\n overflow-y: ", ";\n overflow-x: hidden;\n"], ["\n display: flex;\n flex-direction: column;\n height: calc(100% - 54px);\n width: 100%;\n position: absolute;\n overflow-y: ", ";\n overflow-x: hidden;\n"])), function (_a) {
|
|
64
|
-
var isOpen = _a.isOpen;
|
|
65
|
-
return (isOpen ? 'auto' : 'hidden');
|
|
58
|
+
return (isOpen ? '280px' : '40px');
|
|
66
59
|
});
|
|
67
|
-
var
|
|
68
|
-
var isOpen = _a.isOpen;
|
|
69
|
-
return (isOpen ? '30px' : '10px 5px');
|
|
70
|
-
}, collapsableStyles);
|
|
71
|
-
var ToggleButton = styled_components_1.default.button(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n align-items: center;\n background: none;\n border: none;\n border-top: 1px solid ", ";\n cursor: pointer;\n height: 54px;\n margin: ", ";\n padding: ", ";\n transition: margin 0.3s ease-in-out, padding 0.3s ease-in-out;\n text-align: left;\n position: absolute;\n bottom: 0;\n width: ", ";\n\n svg {\n color: ", ";\n width: 15px;\n }\n"], ["\n align-items: center;\n background: none;\n border: none;\n border-top: 1px solid ", ";\n cursor: pointer;\n height: 54px;\n margin: ", ";\n padding: ", ";\n transition: margin 0.3s ease-in-out, padding 0.3s ease-in-out;\n text-align: left;\n position: absolute;\n bottom: 0;\n width: ", ";\n\n svg {\n color: ", ";\n width: 15px;\n }\n"])), (0, theme_1.getColor)('grey', 80), function (_a) {
|
|
60
|
+
var Content = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n overflow-x: hidden;\n overflow-y: auto;\n opacity: ", ";\n transition: ", ";\n padding: ", ";\n"], ["\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n overflow-x: hidden;\n overflow-y: auto;\n opacity: ", ";\n transition: ", ";\n padding: ", ";\n"])), function (_a) {
|
|
72
61
|
var isOpen = _a.isOpen;
|
|
73
|
-
return (isOpen ? '
|
|
62
|
+
return (isOpen ? '1' : '0');
|
|
74
63
|
}, function (_a) {
|
|
75
64
|
var isOpen = _a.isOpen;
|
|
76
|
-
return (isOpen ? '
|
|
65
|
+
return (isOpen ? 'opacity 300ms linear 300ms' : 'none');
|
|
77
66
|
}, function (_a) {
|
|
78
|
-
var
|
|
79
|
-
return (
|
|
80
|
-
}
|
|
81
|
-
var
|
|
82
|
-
|
|
83
|
-
return (isOpen ? '280px' : '40px');
|
|
84
|
-
}, (0, theme_1.getColor)('grey', 20), (0, theme_1.getColor)('grey', 80));
|
|
85
|
-
var Collapsed = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n flex-grow: 1;\n padding: 10px 5px;\n ", "\n"], ["\n flex-grow: 1;\n padding: 10px 5px;\n ", "\n"])), collapsableStyles);
|
|
86
|
-
Collapsed.displayName = 'Collapsed';
|
|
87
|
-
Collapsed.defaultProps = {
|
|
88
|
-
isOpen: false,
|
|
89
|
-
};
|
|
67
|
+
var noPadding = _a.noPadding;
|
|
68
|
+
return (noPadding ? '0' : '30px');
|
|
69
|
+
});
|
|
70
|
+
var ToggleButton = styled_components_1.default.button(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n align-items: center;\n background: none;\n border: none;\n border-top: 1px solid ", ";\n box-sizing: border-box;\n cursor: pointer;\n display: flex;\n flex: 0 0 auto;\n height: 54px;\n padding: 0;\n padding-left: 12.5px;\n\n svg {\n color: ", ";\n width: 15px;\n }\n"], ["\n align-items: center;\n background: none;\n border: none;\n border-top: 1px solid ", ";\n box-sizing: border-box;\n cursor: pointer;\n display: flex;\n flex: 0 0 auto;\n height: 54px;\n padding: 0;\n padding-left: 12.5px;\n\n svg {\n color: ", ";\n width: 15px;\n }\n"])), (0, theme_1.getColor)('grey', 80), (0, theme_1.getColor)('grey', 100));
|
|
71
|
+
var Collapsed = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n padding: 10px 5px;\n"], ["\n padding: 10px 5px;\n"])));
|
|
90
72
|
var SubNavigationPanel = react_1.default.forwardRef(function (_a, forwardedRef) {
|
|
91
|
-
var children = _a.children, _b = _a.isOpen, isOpen = _b === void 0 ? true : _b, open = _a.open, close = _a.close, _c = _a.closeTitle, closeTitle = _c === void 0 ? '' : _c, _d = _a.openTitle, openTitle = _d === void 0 ? '' : _d, rest = __rest(_a, ["children", "isOpen", "open", "close", "closeTitle", "openTitle"]);
|
|
92
|
-
var
|
|
93
|
-
var
|
|
73
|
+
var children = _a.children, _b = _a.isOpen, isOpen = _b === void 0 ? true : _b, open = _a.open, close = _a.close, _c = _a.closeTitle, closeTitle = _c === void 0 ? '' : _c, _d = _a.openTitle, openTitle = _d === void 0 ? '' : _d, _e = _a.noPadding, noPadding = _e === void 0 ? false : _e, rest = __rest(_a, ["children", "isOpen", "open", "close", "closeTitle", "openTitle", "noPadding"]);
|
|
74
|
+
var collapsedElements = [];
|
|
75
|
+
var contentElements = [];
|
|
94
76
|
react_1.default.Children.forEach(children, function (child) {
|
|
95
77
|
if (react_1.default.isValidElement(child) && child.type === Collapsed) {
|
|
96
|
-
|
|
97
|
-
|
|
78
|
+
collapsedElements.push(child);
|
|
79
|
+
}
|
|
80
|
+
else {
|
|
81
|
+
contentElements.push(child);
|
|
98
82
|
}
|
|
99
|
-
contentChildren.push(child);
|
|
100
83
|
});
|
|
84
|
+
var _f = react_1.default.useState(isOpen), isOpenTransition = _f[0], setIsOpenTransition = _f[1];
|
|
85
|
+
(0, react_1.useLayoutEffect)(function () {
|
|
86
|
+
setIsOpenTransition(isOpen);
|
|
87
|
+
}, [isOpen]);
|
|
101
88
|
return (react_1.default.createElement(Container, __assign({ ref: forwardedRef, isOpen: isOpen }, rest),
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
react_1.default.createElement(PanelContent, { isOpen: isOpen }, isOpen && contentChildren)),
|
|
89
|
+
!isOpen && collapsedElements,
|
|
90
|
+
react_1.default.createElement(Content, { isOpen: isOpenTransition, noPadding: noPadding }, isOpen && contentElements),
|
|
105
91
|
react_1.default.createElement(ToggleButton, { isOpen: isOpen, onClick: function () { return (isOpen ? close() : open()); }, title: isOpen ? closeTitle : openTitle, "data-testid": "open-subnavigation-button" }, isOpen ? react_1.default.createElement(icons_1.PanelCloseIcon, null) : react_1.default.createElement(icons_1.PanelOpenIcon, null))));
|
|
106
92
|
});
|
|
107
93
|
exports.SubNavigationPanel = SubNavigationPanel;
|
|
94
|
+
SubNavigationPanel.displayName = 'SubNavigationPanel';
|
|
95
|
+
Collapsed.displayName = 'SubNavigationPanel.Collapsed';
|
|
108
96
|
SubNavigationPanel.Collapsed = Collapsed;
|
|
109
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4
|
|
97
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
|
|
110
98
|
//# sourceMappingURL=SubNavigationPanel.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SubNavigationPanel.js","sourceRoot":"","sources":["../../../../src/components/Navigation/SubNavigationPanel/SubNavigationPanel.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,
|
|
1
|
+
{"version":3,"file":"SubNavigationPanel.js","sourceRoot":"","sources":["../../../../src/components/Navigation/SubNavigationPanel/SubNavigationPanel.tsx"],"names":[],"mappings":"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"}
|
|
@@ -52,9 +52,9 @@ var theme_1 = require("../../theme");
|
|
|
52
52
|
var hooks_1 = require("../../hooks");
|
|
53
53
|
var ProgressBarContainer = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n overflow: hidden;\n"], ["\n overflow: hidden;\n"])));
|
|
54
54
|
var progressBarAnimation = (0, styled_components_1.keyframes)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n from { background-position: 0 0; }\n to { background-position: 20px 0; }\n"], ["\n from { background-position: 0 0; }\n to { background-position: 20px 0; }\n"])));
|
|
55
|
-
var Header = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n
|
|
56
|
-
var Title = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n color: ", ";\n padding-right: 20px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n
|
|
57
|
-
var ProgressLabel = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n color: ", ";\n
|
|
55
|
+
var Header = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n font-size: ", ";\n justify-content: space-between;\n"], ["\n display: flex;\n font-size: ", ";\n justify-content: space-between;\n"])), (0, theme_1.getFontSize)('default'));
|
|
56
|
+
var Title = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n color: ", ";\n padding-right: 20px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n"], ["\n color: ", ";\n padding-right: 20px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n"])), (0, theme_1.getColor)('grey', 140));
|
|
57
|
+
var ProgressLabel = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n color: ", ";\n white-space: nowrap;\n"], ["\n color: ", ";\n white-space: nowrap;\n"])), (0, theme_1.getColor)('grey', 120));
|
|
58
58
|
var ProgressBarBackground = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n background: ", ";\n height: ", ";\n overflow: hidden;\n position: relative;\n"], ["\n background: ", ";\n height: ", ";\n overflow: hidden;\n position: relative;\n"])), (0, theme_1.getColor)('grey', 60), function (props) { return getHeightFromSize(props.size); });
|
|
59
59
|
var ProgressBarFill = styled_components_1.default.div.attrs(function (props) { return ({
|
|
60
60
|
style: { width: props.width + "%" },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProgressBar.js","sourceRoot":"","sources":["../../../src/components/ProgressBar/ProgressBar.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA6D;AAC7D,qEAAyD;AACzD,qCAA8F;AAC9F,qCAAkC;AAElC,IAAM,oBAAoB,GAAG,2BAAM,CAAC,GAAG,4FAAA,yBAEtC,IAAA,CAAC;AAEF,IAAM,oBAAoB,OAAG,6BAAS,qJAAA,iFAGrC,IAAA,CAAC;AAEF,IAAM,MAAM,GAAG,2BAAM,CAAC,GAAG,
|
|
1
|
+
{"version":3,"file":"ProgressBar.js","sourceRoot":"","sources":["../../../src/components/ProgressBar/ProgressBar.tsx"],"names":[],"mappings":"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"}
|
|
@@ -7,5 +7,8 @@ export declare type TooltipProps = Override<HTMLAttributes<HTMLDivElement>, {
|
|
|
7
7
|
children: ReactNode;
|
|
8
8
|
width?: number;
|
|
9
9
|
}>;
|
|
10
|
-
declare const Tooltip:
|
|
10
|
+
declare const Tooltip: {
|
|
11
|
+
({ direction, iconSize, width, children, ...rest }: TooltipProps): React.JSX.Element;
|
|
12
|
+
Title: import("styled-components").StyledComponent<"div", any, Record<string, unknown> & import("styled-components").ThemeProps<import("../../theme/theme").Theme>, never>;
|
|
13
|
+
};
|
|
11
14
|
export { Tooltip };
|
|
@@ -77,6 +77,7 @@ var TooltipContent = styled_components_1.default.div(templateObject_3 || (templa
|
|
|
77
77
|
var top = _a.top, left = _a.left;
|
|
78
78
|
return (-1 === top && -1 === left ? 0 : 1);
|
|
79
79
|
});
|
|
80
|
+
var TooltipTitle = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n color: ", ";\n font-weight: 700;\n margin-bottom: 5px;\n"], ["\n color: ", ";\n font-weight: 700;\n margin-bottom: 5px;\n"])), (0, theme_1.getColor)('blue', 120));
|
|
80
81
|
var computePosition = function (direction, parentRef, elementRef) {
|
|
81
82
|
if (undefined === parentRef ||
|
|
82
83
|
undefined === elementRef ||
|
|
@@ -125,5 +126,6 @@ var Tooltip = function (_a) {
|
|
|
125
126
|
(0, react_dom_1.createPortal)(react_1.default.createElement(TooltipContent, { ref: contentRef, direction: direction, width: width, top: top, left: left }, children), portalRef.current)));
|
|
126
127
|
};
|
|
127
128
|
exports.Tooltip = Tooltip;
|
|
128
|
-
|
|
129
|
+
Tooltip.Title = TooltipTitle;
|
|
130
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
|
|
129
131
|
//# sourceMappingURL=Tooltip.js.map
|