@chayns-components/core 5.0.0-beta.16 → 5.0.0-beta.162
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/README.md +3 -9
- package/lib/components/accordion/Accordion.d.ts +41 -2
- package/lib/components/accordion/Accordion.js +73 -75
- package/lib/components/accordion/Accordion.js.map +1 -1
- package/lib/components/accordion/Accordion.styles.d.ts +3 -2
- package/lib/components/accordion/Accordion.styles.js +67 -26
- package/lib/components/accordion/Accordion.styles.js.map +1 -1
- package/lib/components/accordion/accordion-body/AccordionBody.d.ts +13 -2
- package/lib/components/accordion/accordion-body/AccordionBody.js +19 -11
- package/lib/components/accordion/accordion-body/AccordionBody.js.map +1 -1
- package/lib/components/accordion/accordion-body/AccordionBody.styles.d.ts +4 -1
- package/lib/components/accordion/accordion-body/AccordionBody.styles.js +15 -10
- package/lib/components/accordion/accordion-body/AccordionBody.styles.js.map +1 -1
- package/lib/components/accordion/accordion-content/AccordionContent.d.ts +16 -2
- package/lib/components/accordion/accordion-content/AccordionContent.js +13 -11
- package/lib/components/accordion/accordion-content/AccordionContent.js.map +1 -1
- package/lib/components/accordion/accordion-content/AccordionContent.styles.d.ts +2 -1
- package/lib/components/accordion/accordion-content/AccordionContent.styles.js +24 -14
- package/lib/components/accordion/accordion-content/AccordionContent.styles.js.map +1 -1
- package/lib/components/accordion/accordion-group/AccordionGroup.d.ts +10 -2
- package/lib/components/accordion/accordion-group/AccordionGroup.js +31 -44
- package/lib/components/accordion/accordion-group/AccordionGroup.js.map +1 -1
- package/lib/components/accordion/accordion-head/AccordionHead.d.ts +5 -2
- package/lib/components/accordion/accordion-head/AccordionHead.js +74 -58
- package/lib/components/accordion/accordion-head/AccordionHead.js.map +1 -1
- package/lib/components/accordion/accordion-head/AccordionHead.styles.d.ts +9 -1
- package/lib/components/accordion/accordion-head/AccordionHead.styles.js +138 -45
- package/lib/components/accordion/accordion-head/AccordionHead.styles.js.map +1 -1
- package/lib/components/accordion/accordion-intro/AccordionIntro.d.ts +9 -0
- package/lib/components/accordion/accordion-intro/AccordionIntro.js +21 -0
- package/lib/components/accordion/accordion-intro/AccordionIntro.js.map +1 -0
- package/lib/components/accordion/accordion-intro/AccordionIntro.styles.d.ts +1 -0
- package/lib/components/accordion/accordion-intro/AccordionIntro.styles.js +13 -0
- package/lib/components/accordion/accordion-intro/AccordionIntro.styles.js.map +1 -0
- package/lib/components/accordion/utils.js +10 -12
- package/lib/components/accordion/utils.js.map +1 -1
- package/lib/components/amount-control/AmountControl.d.ts +21 -0
- package/lib/components/amount-control/AmountControl.js +102 -0
- package/lib/components/amount-control/AmountControl.js.map +1 -0
- package/lib/components/amount-control/AmountControl.styles.d.ts +11 -0
- package/lib/components/amount-control/AmountControl.styles.js +50 -0
- package/lib/components/amount-control/AmountControl.styles.js.map +1 -0
- package/lib/components/amount-control/utils/amountControl.d.ts +7 -0
- package/lib/components/amount-control/utils/amountControl.js +22 -0
- package/lib/components/amount-control/utils/amountControl.js.map +1 -0
- package/lib/components/badge/Badge.d.ts +9 -1
- package/lib/components/badge/Badge.js +12 -12
- package/lib/components/badge/Badge.js.map +1 -1
- package/lib/components/badge/Badge.styles.d.ts +4 -1
- package/lib/components/badge/Badge.styles.js +22 -15
- package/lib/components/badge/Badge.styles.js.map +1 -1
- package/lib/components/button/Button.d.ts +2 -2
- package/lib/components/button/Button.js +12 -20
- package/lib/components/button/Button.js.map +1 -1
- package/lib/components/button/Button.styles.js +46 -23
- package/lib/components/button/Button.styles.js.map +1 -1
- package/lib/components/checkbox/Checkbox.d.ts +25 -0
- package/lib/components/checkbox/Checkbox.js +44 -0
- package/lib/components/checkbox/Checkbox.js.map +1 -0
- package/lib/components/checkbox/Checkbox.styles.d.ts +6 -0
- package/lib/components/checkbox/Checkbox.styles.js +131 -0
- package/lib/components/checkbox/Checkbox.styles.js.map +1 -0
- package/lib/components/color-scheme-provider/ColorSchemeProvider.d.ts +2 -2
- package/lib/components/color-scheme-provider/ColorSchemeProvider.js +44 -81
- package/lib/components/color-scheme-provider/ColorSchemeProvider.js.map +1 -1
- package/lib/components/color-scheme-provider/font.d.ts +6 -0
- package/lib/components/color-scheme-provider/font.js +59 -0
- package/lib/components/color-scheme-provider/font.js.map +1 -0
- package/lib/components/combobox/ComboBox.d.ts +25 -0
- package/lib/components/combobox/ComboBox.js +129 -0
- package/lib/components/combobox/ComboBox.js.map +1 -0
- package/lib/components/combobox/ComboBox.styles.d.ts +12 -0
- package/lib/components/combobox/ComboBox.styles.js +103 -0
- package/lib/components/combobox/ComboBox.styles.js.map +1 -0
- package/lib/components/combobox/combobox-item/ComboBoxItem.d.ts +18 -0
- package/lib/components/combobox/combobox-item/ComboBoxItem.js +30 -0
- package/lib/components/combobox/combobox-item/ComboBoxItem.js.map +1 -0
- package/lib/components/combobox/combobox-item/ComboBoxItem.styles.d.ts +4 -0
- package/lib/components/combobox/combobox-item/ComboBoxItem.styles.js +24 -0
- package/lib/components/combobox/combobox-item/ComboBoxItem.styles.js.map +1 -0
- package/lib/components/combobox/utils.d.ts +1 -0
- package/lib/components/combobox/utils.js +23 -0
- package/lib/components/combobox/utils.js.map +1 -0
- package/lib/components/context-menu/ContextMenu.d.ts +51 -0
- package/lib/components/context-menu/ContextMenu.js +157 -0
- package/lib/components/context-menu/ContextMenu.js.map +1 -0
- package/lib/components/context-menu/ContextMenu.styles.d.ts +1 -0
- package/lib/components/context-menu/ContextMenu.styles.js +13 -0
- package/lib/components/context-menu/ContextMenu.styles.js.map +1 -0
- package/lib/components/context-menu/constants/alignment.d.ts +8 -0
- package/lib/components/context-menu/constants/alignment.js +17 -0
- package/lib/components/context-menu/constants/alignment.js.map +1 -0
- package/lib/components/context-menu/context-menu-content/ContextMenuContent.d.ts +10 -0
- package/lib/components/context-menu/context-menu-content/ContextMenuContent.js +78 -0
- package/lib/components/context-menu/context-menu-content/ContextMenuContent.js.map +1 -0
- package/lib/components/context-menu/context-menu-content/ContextMenuContent.styles.d.ts +11 -0
- package/lib/components/context-menu/context-menu-content/ContextMenuContent.styles.js +117 -0
- package/lib/components/context-menu/context-menu-content/ContextMenuContent.styles.js.map +1 -0
- package/lib/components/grid-image/GridImage.d.ts +2 -2
- package/lib/components/grid-image/GridImage.js +15 -52
- package/lib/components/grid-image/GridImage.js.map +1 -1
- package/lib/components/grid-image/GridImage.styles.d.ts +3 -3
- package/lib/components/grid-image/GridImage.styles.js +82 -38
- package/lib/components/grid-image/GridImage.styles.js.map +1 -1
- package/lib/components/icon/Icon.d.ts +3 -3
- package/lib/components/icon/Icon.js +22 -34
- package/lib/components/icon/Icon.js.map +1 -1
- package/lib/components/icon/Icon.styles.d.ts +1 -1
- package/lib/components/icon/Icon.styles.js +61 -39
- package/lib/components/icon/Icon.styles.js.map +1 -1
- package/lib/components/icon/utils.js +2 -5
- package/lib/components/icon/utils.js.map +1 -1
- package/lib/components/input/Input.d.ts +37 -0
- package/lib/components/input/Input.js +75 -0
- package/lib/components/input/Input.js.map +1 -0
- package/lib/components/input/Input.styles.d.ts +7 -0
- package/lib/components/input/Input.styles.js +71 -0
- package/lib/components/input/Input.styles.js.map +1 -0
- package/lib/components/list/List.d.ts +1 -1
- package/lib/components/list/List.js +26 -63
- package/lib/components/list/List.js.map +1 -1
- package/lib/components/list/list-item/ListItem.d.ts +11 -2
- package/lib/components/list/list-item/ListItem.js +36 -52
- package/lib/components/list/list-item/ListItem.js.map +1 -1
- package/lib/components/list/list-item/ListItem.styles.js +44 -26
- package/lib/components/list/list-item/ListItem.styles.js.map +1 -1
- package/lib/components/list/list-item/list-item-body/ListItemBody.js +8 -8
- package/lib/components/list/list-item/list-item-body/ListItemBody.js.map +1 -1
- package/lib/components/list/list-item/list-item-body/ListItemBody.styles.js +3 -9
- package/lib/components/list/list-item/list-item-body/ListItemBody.styles.js.map +1 -1
- package/lib/components/list/list-item/list-item-content/ListItemContent.js +4 -7
- package/lib/components/list/list-item/list-item-content/ListItemContent.js.map +1 -1
- package/lib/components/list/list-item/list-item-content/ListItemContent.styles.js +8 -11
- package/lib/components/list/list-item/list-item-content/ListItemContent.styles.js.map +1 -1
- package/lib/components/list/list-item/list-item-head/ListItemHead.d.ts +3 -2
- package/lib/components/list/list-item/list-item-head/ListItemHead.js +45 -91
- package/lib/components/list/list-item/list-item-head/ListItemHead.js.map +1 -1
- package/lib/components/list/list-item/list-item-head/ListItemHead.styles.d.ts +2 -11
- package/lib/components/list/list-item/list-item-head/ListItemHead.styles.js +89 -79
- package/lib/components/list/list-item/list-item-head/ListItemHead.styles.js.map +1 -1
- package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.d.ts +6 -0
- package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.js +23 -0
- package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.js.map +1 -0
- package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.styles.d.ts +1 -0
- package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.styles.js +32 -0
- package/lib/components/list/list-item/list-item-head/list-item-icon/ListItemIcon.styles.js.map +1 -0
- package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.d.ts +7 -0
- package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.js +44 -0
- package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.js.map +1 -0
- package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.styles.d.ts +10 -0
- package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.styles.js +52 -0
- package/lib/components/list/list-item/list-item-head/list-item-image/ListItemImage.styles.js.map +1 -0
- package/lib/components/mention-finder/MentionFinder.d.ts +31 -0
- package/lib/components/mention-finder/MentionFinder.js +141 -0
- package/lib/components/mention-finder/MentionFinder.js.map +1 -0
- package/lib/components/mention-finder/MentionFinder.styles.d.ts +5 -0
- package/lib/components/mention-finder/MentionFinder.styles.js +94 -0
- package/lib/components/mention-finder/MentionFinder.styles.js.map +1 -0
- package/lib/components/mention-finder/constants/alignment.d.ts +4 -0
- package/lib/components/mention-finder/constants/alignment.js +13 -0
- package/lib/components/mention-finder/constants/alignment.js.map +1 -0
- package/lib/components/mention-finder/mention-finder-item/MentionFinderItem.d.ts +10 -0
- package/lib/components/mention-finder/mention-finder-item/MentionFinderItem.js +32 -0
- package/lib/components/mention-finder/mention-finder-item/MentionFinderItem.js.map +1 -0
- package/lib/components/mention-finder/mention-finder-item/MentionFinderItem.styles.d.ts +8 -0
- package/lib/components/mention-finder/mention-finder-item/MentionFinderItem.styles.js +100 -0
- package/lib/components/mention-finder/mention-finder-item/MentionFinderItem.styles.js.map +1 -0
- package/lib/components/sharing-bar/SharingBar.d.ts +9 -0
- package/lib/components/sharing-bar/SharingBar.js +111 -0
- package/lib/components/sharing-bar/SharingBar.js.map +1 -0
- package/lib/components/sharing-bar/SharingBar.styles.d.ts +3 -0
- package/lib/components/sharing-bar/SharingBar.styles.js +20 -0
- package/lib/components/sharing-bar/SharingBar.styles.js.map +1 -0
- package/lib/components/slider/Slider.d.ts +21 -0
- package/lib/components/slider/Slider.js +59 -0
- package/lib/components/slider/Slider.js.map +1 -0
- package/lib/components/slider/Slider.styles.d.ts +8 -0
- package/lib/components/slider/Slider.styles.js +76 -0
- package/lib/components/slider/Slider.styles.js.map +1 -0
- package/lib/components/small-wait-cursor/SmallWaitCursor.d.ts +22 -0
- package/lib/components/small-wait-cursor/SmallWaitCursor.js +34 -0
- package/lib/components/small-wait-cursor/SmallWaitCursor.js.map +1 -0
- package/lib/components/small-wait-cursor/SmallWaitCursor.styles.d.ts +13 -0
- package/lib/components/small-wait-cursor/SmallWaitCursor.styles.js +72 -0
- package/lib/components/small-wait-cursor/SmallWaitCursor.styles.js.map +1 -0
- package/lib/hooks/uuid.js +2 -21
- package/lib/hooks/uuid.js.map +1 -1
- package/lib/index.d.ts +14 -0
- package/lib/index.js +96 -23
- package/lib/index.js.map +1 -1
- package/lib/types/chayns.d.ts +59 -0
- package/lib/types/chayns.js +14 -0
- package/lib/types/chayns.js.map +1 -0
- package/package.json +22 -18
|
@@ -1,65 +1,158 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
|
|
4
|
-
|
|
5
3
|
Object.defineProperty(exports, "__esModule", {
|
|
6
4
|
value: true
|
|
7
5
|
});
|
|
8
|
-
exports.
|
|
9
|
-
|
|
6
|
+
exports.StyledRightWrapper = exports.StyledMotionTitleWrapper = exports.StyledMotionTitleElementWrapper = exports.StyledMotionTitle = exports.StyledMotionRightInputIconWrapper = exports.StyledMotionRightInput = exports.StyledMotionRightElementWrapper = exports.StyledMotionIconWrapper = exports.StyledMotionContentWrapper = exports.StyledMotionAccordionHead = void 0;
|
|
10
7
|
var _framerMotion = require("framer-motion");
|
|
11
|
-
|
|
12
8
|
var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
var StyledMotionAccordionHead = (0, _styledComponents.default)(_framerMotion.motion.div)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n align-items: center;\n color: ", ";\n display: flex;\n overflow: hidden;\n padding: 4px 0;\n"])), function (_ref) {
|
|
23
|
-
var theme = _ref.theme;
|
|
9
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
10
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
11
|
+
const StyledMotionAccordionHead = (0, _styledComponents.default)(_framerMotion.motion.div)`
|
|
12
|
+
align-items: center;
|
|
13
|
+
color: ${_ref => {
|
|
14
|
+
let {
|
|
15
|
+
theme
|
|
16
|
+
} = _ref;
|
|
24
17
|
return theme.text;
|
|
25
|
-
}
|
|
18
|
+
}};
|
|
19
|
+
display: flex;
|
|
20
|
+
overflow: hidden;
|
|
21
|
+
padding: 4px 0;
|
|
22
|
+
`;
|
|
26
23
|
exports.StyledMotionAccordionHead = StyledMotionAccordionHead;
|
|
27
|
-
|
|
28
|
-
|
|
24
|
+
const StyledMotionIconWrapper = (0, _styledComponents.default)(_framerMotion.motion.div)`
|
|
25
|
+
align-items: center;
|
|
26
|
+
cursor: ${_ref2 => {
|
|
27
|
+
let {
|
|
28
|
+
onClick
|
|
29
|
+
} = _ref2;
|
|
29
30
|
return typeof onClick === 'function' ? 'pointer' : 'default';
|
|
30
|
-
}
|
|
31
|
+
}};
|
|
32
|
+
display: flex;
|
|
33
|
+
flex: 0 0 auto;
|
|
34
|
+
height: 25px;
|
|
35
|
+
justify-content: center;
|
|
36
|
+
width: 25px;
|
|
37
|
+
`;
|
|
31
38
|
exports.StyledMotionIconWrapper = StyledMotionIconWrapper;
|
|
32
|
-
|
|
33
|
-
|
|
39
|
+
const StyledMotionContentWrapper = (0, _styledComponents.default)(_framerMotion.motion.div)`
|
|
40
|
+
align-self: flex-start;
|
|
41
|
+
cursor: ${_ref3 => {
|
|
42
|
+
let {
|
|
43
|
+
onClick
|
|
44
|
+
} = _ref3;
|
|
34
45
|
return typeof onClick === 'function' ? 'pointer' : 'default';
|
|
35
|
-
}
|
|
46
|
+
}};
|
|
47
|
+
display: flex;
|
|
48
|
+
flex: 1 1 auto;
|
|
49
|
+
height: 100%;
|
|
50
|
+
overflow: hidden;
|
|
51
|
+
margin-right: 10px;
|
|
52
|
+
`;
|
|
53
|
+
exports.StyledMotionContentWrapper = StyledMotionContentWrapper;
|
|
54
|
+
const StyledMotionTitleWrapper = (0, _styledComponents.default)(_framerMotion.motion.div)`
|
|
55
|
+
display: grid;
|
|
56
|
+
flex: 0 1 auto;
|
|
57
|
+
grid-template-areas: 'header';
|
|
58
|
+
`;
|
|
36
59
|
exports.StyledMotionTitleWrapper = StyledMotionTitleWrapper;
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
60
|
+
const StyledMotionTitle = (0, _styledComponents.default)(_framerMotion.motion.div)`
|
|
61
|
+
font-size: ${_ref4 => {
|
|
62
|
+
let {
|
|
63
|
+
isOpen,
|
|
64
|
+
isWrapped
|
|
65
|
+
} = _ref4;
|
|
40
66
|
return isOpen && !isWrapped ? '1.3rem' : undefined;
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
|
|
67
|
+
}};
|
|
68
|
+
font-weight: ${_ref5 => {
|
|
69
|
+
let {
|
|
70
|
+
isOpen,
|
|
71
|
+
isWrapped
|
|
72
|
+
} = _ref5;
|
|
44
73
|
return isOpen && isWrapped ? 700 : 'normal';
|
|
45
|
-
}
|
|
46
|
-
|
|
74
|
+
}};
|
|
75
|
+
grid-area: header;
|
|
76
|
+
height: ${_ref6 => {
|
|
77
|
+
let {
|
|
78
|
+
isWrapped
|
|
79
|
+
} = _ref6;
|
|
47
80
|
return isWrapped ? '100%' : undefined;
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
|
|
81
|
+
}};
|
|
82
|
+
overflow: hidden;
|
|
83
|
+
text-overflow: ellipsis;
|
|
84
|
+
transform-origin: top left;
|
|
85
|
+
user-select: none;
|
|
86
|
+
white-space: ${_ref7 => {
|
|
87
|
+
let {
|
|
88
|
+
isOpen,
|
|
89
|
+
isWrapped
|
|
90
|
+
} = _ref7;
|
|
51
91
|
return isOpen && !isWrapped ? 'normal' : 'nowrap';
|
|
52
|
-
}
|
|
53
|
-
var isWrapped = _ref8.isWrapped;
|
|
54
|
-
return isWrapped && (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n align-items: center;\n display: flex;\n "])));
|
|
55
|
-
});
|
|
56
|
-
exports.StyledMotionTitle = StyledMotionTitle;
|
|
57
|
-
|
|
58
|
-
var StyledTitleElementWrapper = _styledComponents.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n align-items: center;\n display: flex;\n margin-left: 8px;\n"])));
|
|
59
|
-
|
|
60
|
-
exports.StyledTitleElementWrapper = StyledTitleElementWrapper;
|
|
61
|
-
|
|
62
|
-
var StyledRightWrapper = _styledComponents.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n display: flex;\n flex: 0 0 auto;\n flex-direction: column;\n justify-content: center;\n margin-right: 5px;\n overflow: hidden;\n"])));
|
|
92
|
+
}};
|
|
63
93
|
|
|
94
|
+
${_ref8 => {
|
|
95
|
+
let {
|
|
96
|
+
isWrapped
|
|
97
|
+
} = _ref8;
|
|
98
|
+
return isWrapped && (0, _styledComponents.css)`
|
|
99
|
+
align-items: center;
|
|
100
|
+
display: flex;
|
|
101
|
+
`;
|
|
102
|
+
}}
|
|
103
|
+
`;
|
|
104
|
+
exports.StyledMotionTitle = StyledMotionTitle;
|
|
105
|
+
const StyledMotionTitleElementWrapper = (0, _styledComponents.default)(_framerMotion.motion.div)`
|
|
106
|
+
align-items: center;
|
|
107
|
+
display: flex;
|
|
108
|
+
margin-left: 8px;
|
|
109
|
+
`;
|
|
110
|
+
exports.StyledMotionTitleElementWrapper = StyledMotionTitleElementWrapper;
|
|
111
|
+
const StyledRightWrapper = _styledComponents.default.div`
|
|
112
|
+
display: grid;
|
|
113
|
+
flex: 0 0 auto;
|
|
114
|
+
grid-template-areas: 'right';
|
|
115
|
+
margin-right: 5px;
|
|
116
|
+
overflow: hidden;
|
|
117
|
+
position: relative;
|
|
118
|
+
`;
|
|
64
119
|
exports.StyledRightWrapper = StyledRightWrapper;
|
|
120
|
+
const StyledMotionRightElementWrapper = (0, _styledComponents.default)(_framerMotion.motion.div)`
|
|
121
|
+
align-items: center;
|
|
122
|
+
display: flex;
|
|
123
|
+
grid-area: header;
|
|
124
|
+
justify-content: flex-end;
|
|
125
|
+
`;
|
|
126
|
+
exports.StyledMotionRightElementWrapper = StyledMotionRightElementWrapper;
|
|
127
|
+
const StyledMotionRightInput = (0, _styledComponents.default)(_framerMotion.motion.input)`
|
|
128
|
+
background-color: transparent;
|
|
129
|
+
border: 1px solid transparent;
|
|
130
|
+
border-bottom-color: rgba(
|
|
131
|
+
${_ref9 => {
|
|
132
|
+
let {
|
|
133
|
+
theme
|
|
134
|
+
} = _ref9;
|
|
135
|
+
return theme['headline-rgb'];
|
|
136
|
+
}},
|
|
137
|
+
0.45
|
|
138
|
+
);
|
|
139
|
+
grid-area: header;
|
|
140
|
+
padding: ${_ref10 => {
|
|
141
|
+
let {
|
|
142
|
+
hasIcon
|
|
143
|
+
} = _ref10;
|
|
144
|
+
return hasIcon ? '5px 23px 5px 1px' : '5px 1px';
|
|
145
|
+
}};
|
|
146
|
+
`;
|
|
147
|
+
exports.StyledMotionRightInput = StyledMotionRightInput;
|
|
148
|
+
const StyledMotionRightInputIconWrapper = (0, _styledComponents.default)(_framerMotion.motion.div)`
|
|
149
|
+
align-items: center;
|
|
150
|
+
display: flex;
|
|
151
|
+
height: 100%;
|
|
152
|
+
justify-content: center;
|
|
153
|
+
position: absolute;
|
|
154
|
+
right: 4px;
|
|
155
|
+
top: 0;
|
|
156
|
+
`;
|
|
157
|
+
exports.StyledMotionRightInputIconWrapper = StyledMotionRightInputIconWrapper;
|
|
65
158
|
//# sourceMappingURL=AccordionHead.styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"AccordionHead.styles.js","names":["_framerMotion","require","_styledComponents","_interopRequireWildcard","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","StyledMotionAccordionHead","styled","motion","div","_ref","theme","text","exports","StyledMotionIconWrapper","_ref2","onClick","StyledMotionContentWrapper","_ref3","StyledMotionTitleWrapper","StyledMotionTitle","_ref4","isOpen","isWrapped","undefined","_ref5","_ref6","_ref7","_ref8","css","StyledMotionTitleElementWrapper","StyledRightWrapper","StyledMotionRightElementWrapper","StyledMotionRightInput","input","_ref9","_ref10","hasIcon","StyledMotionRightInputIconWrapper"],"sources":["../../../../src/components/accordion/accordion-head/AccordionHead.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type { WithTheme } from '../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledMotionAccordionHeadProps = WithTheme<unknown>;\n\nexport const StyledMotionAccordionHead = styled(motion.div)`\n align-items: center;\n color: ${({ theme }: StyledMotionAccordionHeadProps) => theme.text};\n display: flex;\n overflow: hidden;\n padding: 4px 0;\n`;\n\nexport const StyledMotionIconWrapper = styled(motion.div)`\n align-items: center;\n cursor: ${({ onClick }) => (typeof onClick === 'function' ? 'pointer' : 'default')};\n display: flex;\n flex: 0 0 auto;\n height: 25px;\n justify-content: center;\n width: 25px;\n`;\n\nexport const StyledMotionContentWrapper = styled(motion.div)`\n align-self: flex-start;\n cursor: ${({ onClick }) => (typeof onClick === 'function' ? 'pointer' : 'default')};\n display: flex;\n flex: 1 1 auto;\n height: 100%;\n overflow: hidden;\n margin-right: 10px;\n`;\n\nexport const StyledMotionTitleWrapper = styled(motion.div)`\n display: grid;\n flex: 0 1 auto;\n grid-template-areas: 'header';\n`;\n\ninterface StyledMotionTitleProps {\n isOpen: boolean;\n isWrapped: boolean;\n}\n\nexport const StyledMotionTitle = styled(motion.div)<StyledMotionTitleProps>`\n font-size: ${({ isOpen, isWrapped }) => (isOpen && !isWrapped ? '1.3rem' : undefined)};\n font-weight: ${({ isOpen, isWrapped }) => (isOpen && isWrapped ? 700 : 'normal')};\n grid-area: header;\n height: ${({ isWrapped }) => (isWrapped ? '100%' : undefined)};\n overflow: hidden;\n text-overflow: ellipsis;\n transform-origin: top left;\n user-select: none;\n white-space: ${({ isOpen, isWrapped }) => (isOpen && !isWrapped ? 'normal' : 'nowrap')};\n\n ${({ isWrapped }) =>\n isWrapped &&\n css`\n align-items: center;\n display: flex;\n `}\n`;\n\nexport const StyledMotionTitleElementWrapper = styled(motion.div)`\n align-items: center;\n display: flex;\n margin-left: 8px;\n`;\n\nexport const StyledRightWrapper = styled.div`\n display: grid;\n flex: 0 0 auto;\n grid-template-areas: 'right';\n margin-right: 5px;\n overflow: hidden;\n position: relative;\n`;\n\nexport const StyledMotionRightElementWrapper = styled(motion.div)`\n align-items: center;\n display: flex;\n grid-area: header;\n justify-content: flex-end;\n`;\n\ntype StyledMotionRightInputProps = WithTheme<{\n hasIcon: boolean;\n}>;\n\nexport const StyledMotionRightInput = styled(motion.input)<StyledMotionRightInputProps>`\n background-color: transparent;\n border: 1px solid transparent;\n border-bottom-color: rgba(\n ${({ theme }: StyledMotionRightInputProps) => theme['headline-rgb']},\n 0.45\n );\n grid-area: header;\n padding: ${({ hasIcon }) => (hasIcon ? '5px 23px 5px 1px' : '5px 1px')};\n`;\n\nexport const StyledMotionRightInputIconWrapper = styled(motion.div)`\n align-items: center;\n display: flex;\n height: 100%;\n justify-content: center;\n position: absolute;\n right: 4px;\n top: 0;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,uBAAA,CAAAF,OAAA;AAAgD,SAAAG,yBAAAC,WAAA,eAAAC,OAAA,kCAAAC,iBAAA,OAAAD,OAAA,QAAAE,gBAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,WAAA,WAAAA,WAAA,GAAAG,gBAAA,GAAAD,iBAAA,KAAAF,WAAA;AAAA,SAAAF,wBAAAM,GAAA,EAAAJ,WAAA,SAAAA,WAAA,IAAAI,GAAA,IAAAA,GAAA,CAAAC,UAAA,WAAAD,GAAA,QAAAA,GAAA,oBAAAA,GAAA,wBAAAA,GAAA,4BAAAE,OAAA,EAAAF,GAAA,UAAAG,KAAA,GAAAR,wBAAA,CAAAC,WAAA,OAAAO,KAAA,IAAAA,KAAA,CAAAC,GAAA,CAAAJ,GAAA,YAAAG,KAAA,CAAAE,GAAA,CAAAL,GAAA,SAAAM,MAAA,WAAAC,qBAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,GAAA,IAAAX,GAAA,QAAAW,GAAA,kBAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAd,GAAA,EAAAW,GAAA,SAAAI,IAAA,GAAAR,qBAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAV,GAAA,EAAAW,GAAA,cAAAI,IAAA,KAAAA,IAAA,CAAAV,GAAA,IAAAU,IAAA,CAAAC,GAAA,KAAAR,MAAA,CAAAC,cAAA,CAAAH,MAAA,EAAAK,GAAA,EAAAI,IAAA,YAAAT,MAAA,CAAAK,GAAA,IAAAX,GAAA,CAAAW,GAAA,SAAAL,MAAA,CAAAJ,OAAA,GAAAF,GAAA,MAAAG,KAAA,IAAAA,KAAA,CAAAa,GAAA,CAAAhB,GAAA,EAAAM,MAAA,YAAAA,MAAA;AAKzC,MAAMW,yBAAyB,GAAG,IAAAC,yBAAM,EAACC,oBAAM,CAACC,GAAG,CAAE;AAC5D;AACA,aAAaC,IAAA;EAAA,IAAC;IAAEC;EAAsC,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAACC,IAAI;AAAA,CAAC;AACvE;AACA;AACA;AACA,CAAC;AAACC,OAAA,CAAAP,yBAAA,GAAAA,yBAAA;AAEK,MAAMQ,uBAAuB,GAAG,IAAAP,yBAAM,EAACC,oBAAM,CAACC,GAAG,CAAE;AAC1D;AACA,cAAcM,KAAA;EAAA,IAAC;IAAEC;EAAQ,CAAC,GAAAD,KAAA;EAAA,OAAM,OAAOC,OAAO,KAAK,UAAU,GAAG,SAAS,GAAG,SAAS;AAAA,CAAE;AACvF;AACA;AACA;AACA;AACA;AACA,CAAC;AAACH,OAAA,CAAAC,uBAAA,GAAAA,uBAAA;AAEK,MAAMG,0BAA0B,GAAG,IAAAV,yBAAM,EAACC,oBAAM,CAACC,GAAG,CAAE;AAC7D;AACA,cAAcS,KAAA;EAAA,IAAC;IAAEF;EAAQ,CAAC,GAAAE,KAAA;EAAA,OAAM,OAAOF,OAAO,KAAK,UAAU,GAAG,SAAS,GAAG,SAAS;AAAA,CAAE;AACvF;AACA;AACA;AACA;AACA;AACA,CAAC;AAACH,OAAA,CAAAI,0BAAA,GAAAA,0BAAA;AAEK,MAAME,wBAAwB,GAAG,IAAAZ,yBAAM,EAACC,oBAAM,CAACC,GAAG,CAAE;AAC3D;AACA;AACA;AACA,CAAC;AAACI,OAAA,CAAAM,wBAAA,GAAAA,wBAAA;AAOK,MAAMC,iBAAiB,GAAG,IAAAb,yBAAM,EAACC,oBAAM,CAACC,GAAG,CAA0B;AAC5E,iBAAiBY,KAAA;EAAA,IAAC;IAAEC,MAAM;IAAEC;EAAU,CAAC,GAAAF,KAAA;EAAA,OAAMC,MAAM,IAAI,CAACC,SAAS,GAAG,QAAQ,GAAGC,SAAS;AAAA,CAAE;AAC1F,mBAAmBC,KAAA;EAAA,IAAC;IAAEH,MAAM;IAAEC;EAAU,CAAC,GAAAE,KAAA;EAAA,OAAMH,MAAM,IAAIC,SAAS,GAAG,GAAG,GAAG,QAAQ;AAAA,CAAE;AACrF;AACA,cAAcG,KAAA;EAAA,IAAC;IAAEH;EAAU,CAAC,GAAAG,KAAA;EAAA,OAAMH,SAAS,GAAG,MAAM,GAAGC,SAAS;AAAA,CAAE;AAClE;AACA;AACA;AACA;AACA,mBAAmBG,KAAA;EAAA,IAAC;IAAEL,MAAM;IAAEC;EAAU,CAAC,GAAAI,KAAA;EAAA,OAAML,MAAM,IAAI,CAACC,SAAS,GAAG,QAAQ,GAAG,QAAQ;AAAA,CAAE;AAC3F;AACA,MAAMK,KAAA;EAAA,IAAC;IAAEL;EAAU,CAAC,GAAAK,KAAA;EAAA,OACZL,SAAS,IACT,IAAAM,qBAAG,CAAC;AACZ;AACA;AACA,SAAS;AAAA,CAAC;AACV,CAAC;AAAChB,OAAA,CAAAO,iBAAA,GAAAA,iBAAA;AAEK,MAAMU,+BAA+B,GAAG,IAAAvB,yBAAM,EAACC,oBAAM,CAACC,GAAG,CAAE;AAClE;AACA;AACA;AACA,CAAC;AAACI,OAAA,CAAAiB,+BAAA,GAAAA,+BAAA;AAEK,MAAMC,kBAAkB,GAAGxB,yBAAM,CAACE,GAAI;AAC7C;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAACI,OAAA,CAAAkB,kBAAA,GAAAA,kBAAA;AAEK,MAAMC,+BAA+B,GAAG,IAAAzB,yBAAM,EAACC,oBAAM,CAACC,GAAG,CAAE;AAClE;AACA;AACA;AACA;AACA,CAAC;AAACI,OAAA,CAAAmB,+BAAA,GAAAA,+BAAA;AAMK,MAAMC,sBAAsB,GAAG,IAAA1B,yBAAM,EAACC,oBAAM,CAAC0B,KAAK,CAA+B;AACxF;AACA;AACA;AACA,UAAUC,KAAA;EAAA,IAAC;IAAExB;EAAmC,CAAC,GAAAwB,KAAA;EAAA,OAAKxB,KAAK,CAAC,cAAc,CAAC;AAAA,CAAC;AAC5E;AACA;AACA;AACA,eAAeyB,MAAA;EAAA,IAAC;IAAEC;EAAQ,CAAC,GAAAD,MAAA;EAAA,OAAMC,OAAO,GAAG,kBAAkB,GAAG,SAAS;AAAA,CAAE;AAC3E,CAAC;AAACxB,OAAA,CAAAoB,sBAAA,GAAAA,sBAAA;AAEK,MAAMK,iCAAiC,GAAG,IAAA/B,yBAAM,EAACC,oBAAM,CAACC,GAAG,CAAE;AACpE;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAACI,OAAA,CAAAyB,iCAAA,GAAAA,iCAAA"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
|
+
var _AccordionIntro = require("./AccordionIntro.styles");
|
|
9
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
10
|
+
const AccordionIntro = _ref => {
|
|
11
|
+
let {
|
|
12
|
+
children
|
|
13
|
+
} = _ref;
|
|
14
|
+
return /*#__PURE__*/_react.default.createElement(_AccordionIntro.StyledAccordionIntro, {
|
|
15
|
+
className: "beta-chayns-accordion-intro"
|
|
16
|
+
}, children);
|
|
17
|
+
};
|
|
18
|
+
AccordionIntro.displayName = 'AccordionIntro';
|
|
19
|
+
var _default = AccordionIntro;
|
|
20
|
+
exports.default = _default;
|
|
21
|
+
//# sourceMappingURL=AccordionIntro.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AccordionIntro.js","names":["_react","_interopRequireDefault","require","_AccordionIntro","obj","__esModule","default","AccordionIntro","_ref","children","createElement","StyledAccordionIntro","className","displayName","_default","exports"],"sources":["../../../../src/components/accordion/accordion-intro/AccordionIntro.tsx"],"sourcesContent":["import React, { FC, ReactNode } from 'react';\nimport { StyledAccordionIntro } from './AccordionIntro.styles';\n\nexport type AccordionIntroProps = {\n /**\n * The content of the accordion content element\n */\n children: ReactNode;\n};\n\nconst AccordionIntro: FC<AccordionIntroProps> = ({ children }) => (\n <StyledAccordionIntro className=\"beta-chayns-accordion-intro\">{children}</StyledAccordionIntro>\n);\n\nAccordionIntro.displayName = 'AccordionIntro';\n\nexport default AccordionIntro;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,eAAA,GAAAD,OAAA;AAA+D,SAAAD,uBAAAG,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAS/D,MAAMG,cAAuC,GAAGC,IAAA;EAAA,IAAC;IAAEC;EAAS,CAAC,GAAAD,IAAA;EAAA,oBACzDR,MAAA,CAAAM,OAAA,CAAAI,aAAA,CAACP,eAAA,CAAAQ,oBAAoB;IAACC,SAAS,EAAC;EAA6B,GAAEH,QAA+B,CAAC;AAAA,CAClG;AAEDF,cAAc,CAACM,WAAW,GAAG,gBAAgB;AAAC,IAAAC,QAAA,GAE/BP,cAAc;AAAAQ,OAAA,CAAAT,OAAA,GAAAQ,QAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const StyledAccordionIntro: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.StyledAccordionIntro = void 0;
|
|
7
|
+
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
8
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
9
|
+
const StyledAccordionIntro = _styledComponents.default.div`
|
|
10
|
+
padding: 0 9px 6px;
|
|
11
|
+
`;
|
|
12
|
+
exports.StyledAccordionIntro = StyledAccordionIntro;
|
|
13
|
+
//# sourceMappingURL=AccordionIntro.styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AccordionIntro.styles.js","names":["_styledComponents","_interopRequireDefault","require","obj","__esModule","default","StyledAccordionIntro","styled","div","exports"],"sources":["../../../../src/components/accordion/accordion-intro/AccordionIntro.styles.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const StyledAccordionIntro = styled.div`\n padding: 0 9px 6px;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAuC,SAAAD,uBAAAE,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAEhC,MAAMG,oBAAoB,GAAGC,yBAAM,CAACC,GAAI;AAC/C;AACA,CAAC;AAACC,OAAA,CAAAH,oBAAA,GAAAA,oBAAA"}
|
|
@@ -4,35 +4,33 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.getAccordionHeadHeight = void 0;
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
7
|
+
const getAccordionHeadHeight = _ref => {
|
|
8
|
+
let {
|
|
9
|
+
isWrapped,
|
|
10
|
+
title,
|
|
11
|
+
width
|
|
12
|
+
} = _ref;
|
|
13
|
+
const element = document.createElement('div');
|
|
13
14
|
element.style.fontSize = '1rem';
|
|
14
15
|
element.style.opacity = '0';
|
|
15
16
|
element.style.pointerEvents = 'none';
|
|
16
17
|
element.style.whiteSpace = 'nowrap';
|
|
17
|
-
element.style.width =
|
|
18
|
+
element.style.width = `${width}px`;
|
|
18
19
|
element.innerText = title;
|
|
19
20
|
document.body.appendChild(element);
|
|
20
|
-
|
|
21
|
-
|
|
21
|
+
const closedHeight = Math.max(element.clientHeight + 8, isWrapped ? 40 : 33);
|
|
22
22
|
if (isWrapped) {
|
|
23
23
|
element.style.fontWeight = 'bold';
|
|
24
24
|
} else {
|
|
25
25
|
element.style.fontSize = '1.3rem';
|
|
26
26
|
}
|
|
27
|
-
|
|
28
27
|
element.style.whiteSpace = 'normal';
|
|
29
|
-
|
|
28
|
+
const openHeight = Math.max(element.clientHeight + 8, isWrapped ? 40 : 33);
|
|
30
29
|
document.body.removeChild(element);
|
|
31
30
|
return {
|
|
32
31
|
closed: closedHeight,
|
|
33
32
|
open: openHeight
|
|
34
33
|
};
|
|
35
34
|
};
|
|
36
|
-
|
|
37
35
|
exports.getAccordionHeadHeight = getAccordionHeadHeight;
|
|
38
36
|
//# sourceMappingURL=utils.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"utils.js","names":["getAccordionHeadHeight","_ref","isWrapped","title","width","element","document","createElement","style","fontSize","opacity","pointerEvents","whiteSpace","innerText","body","appendChild","closedHeight","Math","max","clientHeight","fontWeight","openHeight","removeChild","closed","open","exports"],"sources":["../../../src/components/accordion/utils.ts"],"sourcesContent":["interface GetAccordionHeadHeightOptions {\n isWrapped?: boolean;\n title: string;\n width: number;\n}\n\ninterface GetAccordionHeadHeightResult {\n closed: number;\n open: number;\n}\n\nexport const getAccordionHeadHeight = ({\n isWrapped,\n title,\n width,\n}: GetAccordionHeadHeightOptions): GetAccordionHeadHeightResult => {\n const element = document.createElement('div');\n\n element.style.fontSize = '1rem';\n element.style.opacity = '0';\n element.style.pointerEvents = 'none';\n element.style.whiteSpace = 'nowrap';\n element.style.width = `${width}px`;\n\n element.innerText = title;\n\n document.body.appendChild(element);\n\n const closedHeight = Math.max(element.clientHeight + 8, isWrapped ? 40 : 33);\n\n if (isWrapped) {\n element.style.fontWeight = 'bold';\n } else {\n element.style.fontSize = '1.3rem';\n }\n\n element.style.whiteSpace = 'normal';\n\n const openHeight = Math.max(element.clientHeight + 8, isWrapped ? 40 : 33);\n\n document.body.removeChild(element);\n\n return { closed: closedHeight, open: openHeight };\n};\n"],"mappings":";;;;;;AAWO,MAAMA,sBAAsB,GAAGC,IAAA,IAI6B;EAAA,IAJ5B;IACnCC,SAAS;IACTC,KAAK;IACLC;EAC2B,CAAC,GAAAH,IAAA;EAC5B,MAAMI,OAAO,GAAGC,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;EAE7CF,OAAO,CAACG,KAAK,CAACC,QAAQ,GAAG,MAAM;EAC/BJ,OAAO,CAACG,KAAK,CAACE,OAAO,GAAG,GAAG;EAC3BL,OAAO,CAACG,KAAK,CAACG,aAAa,GAAG,MAAM;EACpCN,OAAO,CAACG,KAAK,CAACI,UAAU,GAAG,QAAQ;EACnCP,OAAO,CAACG,KAAK,CAACJ,KAAK,GAAI,GAAEA,KAAM,IAAG;EAElCC,OAAO,CAACQ,SAAS,GAAGV,KAAK;EAEzBG,QAAQ,CAACQ,IAAI,CAACC,WAAW,CAACV,OAAO,CAAC;EAElC,MAAMW,YAAY,GAAGC,IAAI,CAACC,GAAG,CAACb,OAAO,CAACc,YAAY,GAAG,CAAC,EAAEjB,SAAS,GAAG,EAAE,GAAG,EAAE,CAAC;EAE5E,IAAIA,SAAS,EAAE;IACXG,OAAO,CAACG,KAAK,CAACY,UAAU,GAAG,MAAM;EACrC,CAAC,MAAM;IACHf,OAAO,CAACG,KAAK,CAACC,QAAQ,GAAG,QAAQ;EACrC;EAEAJ,OAAO,CAACG,KAAK,CAACI,UAAU,GAAG,QAAQ;EAEnC,MAAMS,UAAU,GAAGJ,IAAI,CAACC,GAAG,CAACb,OAAO,CAACc,YAAY,GAAG,CAAC,EAAEjB,SAAS,GAAG,EAAE,GAAG,EAAE,CAAC;EAE1EI,QAAQ,CAACQ,IAAI,CAACQ,WAAW,CAACjB,OAAO,CAAC;EAElC,OAAO;IAAEkB,MAAM,EAAEP,YAAY;IAAEQ,IAAI,EAAEH;EAAW,CAAC;AACrD,CAAC;AAACI,OAAA,CAAAzB,sBAAA,GAAAA,sBAAA"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
export type AmountControlProps = {
|
|
3
|
+
/**
|
|
4
|
+
* The amount that should be displayed.
|
|
5
|
+
*/
|
|
6
|
+
amount?: number;
|
|
7
|
+
/**
|
|
8
|
+
* The maximum allowed amount.
|
|
9
|
+
*/
|
|
10
|
+
maxAmount?: number;
|
|
11
|
+
/**
|
|
12
|
+
* The minimum allowed amount.
|
|
13
|
+
*/
|
|
14
|
+
minAmount?: number;
|
|
15
|
+
/**
|
|
16
|
+
* A Function that is executed when the amount is changed
|
|
17
|
+
*/
|
|
18
|
+
onChange?: (amount: number) => void;
|
|
19
|
+
};
|
|
20
|
+
declare const AmountControl: FC<AmountControlProps>;
|
|
21
|
+
export default AmountControl;
|
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _Icon = _interopRequireDefault(require("../icon/Icon"));
|
|
9
|
+
var _AmountControl = require("./AmountControl.styles");
|
|
10
|
+
var _amountControl = require("./utils/amountControl");
|
|
11
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
12
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
13
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
14
|
+
const AmountControl = _ref => {
|
|
15
|
+
let {
|
|
16
|
+
amount,
|
|
17
|
+
maxAmount,
|
|
18
|
+
minAmount = 0,
|
|
19
|
+
onChange
|
|
20
|
+
} = _ref;
|
|
21
|
+
const [amountValue, setAmountValue] = (0, _react.useState)(0);
|
|
22
|
+
const [inputValue, setInputValue] = (0, _react.useState)('0');
|
|
23
|
+
|
|
24
|
+
/**
|
|
25
|
+
* Function that sets the amountValue to the amount
|
|
26
|
+
*/
|
|
27
|
+
(0, _react.useEffect)(() => {
|
|
28
|
+
if (!amount) {
|
|
29
|
+
return;
|
|
30
|
+
}
|
|
31
|
+
setAmountValue((0, _amountControl.checkForValidAmount)({
|
|
32
|
+
amount,
|
|
33
|
+
maxAmount,
|
|
34
|
+
minAmount
|
|
35
|
+
}));
|
|
36
|
+
setInputValue((0, _amountControl.checkForValidAmount)({
|
|
37
|
+
amount,
|
|
38
|
+
maxAmount,
|
|
39
|
+
minAmount
|
|
40
|
+
}).toString());
|
|
41
|
+
}, [amount, maxAmount, minAmount]);
|
|
42
|
+
|
|
43
|
+
/**
|
|
44
|
+
* Function that updates the onChange event
|
|
45
|
+
*/
|
|
46
|
+
(0, _react.useEffect)(() => {
|
|
47
|
+
if (onChange) {
|
|
48
|
+
onChange(amountValue);
|
|
49
|
+
}
|
|
50
|
+
}, [amountValue, onChange]);
|
|
51
|
+
const handleAmountAdd = () => {
|
|
52
|
+
setAmountValue(prevState => prevState + 1);
|
|
53
|
+
setInputValue(prevState => (Number(prevState) + 1).toString());
|
|
54
|
+
};
|
|
55
|
+
const handleAmountRemove = () => {
|
|
56
|
+
setAmountValue(prevState => prevState - 1);
|
|
57
|
+
setInputValue(prevState => (Number(prevState) - 1).toString());
|
|
58
|
+
};
|
|
59
|
+
const handleInputBlur = (0, _react.useCallback)(() => {
|
|
60
|
+
setAmountValue(inputValue === '' ? 0 : Number(inputValue));
|
|
61
|
+
if (inputValue === '') {
|
|
62
|
+
setInputValue('0');
|
|
63
|
+
}
|
|
64
|
+
}, [inputValue]);
|
|
65
|
+
const handleInputChange = (0, _react.useCallback)(event => {
|
|
66
|
+
const valueBeforeCheck = Number(event.target.value);
|
|
67
|
+
const checkedValue = (0, _amountControl.checkForValidAmount)({
|
|
68
|
+
minAmount,
|
|
69
|
+
maxAmount,
|
|
70
|
+
amount: Number(event.target.value)
|
|
71
|
+
});
|
|
72
|
+
if (valueBeforeCheck < minAmount && minAmount === 0) {
|
|
73
|
+
setInputValue('0');
|
|
74
|
+
return;
|
|
75
|
+
}
|
|
76
|
+
setInputValue(checkedValue === 0 ? '' : checkedValue.toString());
|
|
77
|
+
}, [maxAmount, minAmount]);
|
|
78
|
+
return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_AmountControl.StyledAmountControl, null, /*#__PURE__*/_react.default.createElement(_AmountControl.StyledAmountControlButton, {
|
|
79
|
+
onClick: handleAmountRemove,
|
|
80
|
+
disabled: amountValue <= minAmount
|
|
81
|
+
}, /*#__PURE__*/_react.default.createElement(_Icon.default, {
|
|
82
|
+
icons: ['fa fa-minus'],
|
|
83
|
+
size: 15,
|
|
84
|
+
color: "red"
|
|
85
|
+
})), /*#__PURE__*/_react.default.createElement(_AmountControl.StyledAmountControlInput, {
|
|
86
|
+
onBlur: handleInputBlur,
|
|
87
|
+
onChange: handleInputChange,
|
|
88
|
+
value: inputValue,
|
|
89
|
+
type: "number"
|
|
90
|
+
}), /*#__PURE__*/_react.default.createElement(_AmountControl.StyledAmountControlButton, {
|
|
91
|
+
onClick: handleAmountAdd,
|
|
92
|
+
disabled: maxAmount ? amountValue >= maxAmount : false
|
|
93
|
+
}, /*#__PURE__*/_react.default.createElement(_Icon.default, {
|
|
94
|
+
icons: ['fa fa-plus'],
|
|
95
|
+
size: 15,
|
|
96
|
+
color: "green"
|
|
97
|
+
}))), [amountValue, handleInputBlur, handleInputChange, inputValue, maxAmount, minAmount]);
|
|
98
|
+
};
|
|
99
|
+
AmountControl.displayName = 'AmountControl';
|
|
100
|
+
var _default = AmountControl;
|
|
101
|
+
exports.default = _default;
|
|
102
|
+
//# sourceMappingURL=AmountControl.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AmountControl.js","names":["_react","_interopRequireWildcard","require","_Icon","_interopRequireDefault","_AmountControl","_amountControl","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","AmountControl","_ref","amount","maxAmount","minAmount","onChange","amountValue","setAmountValue","useState","inputValue","setInputValue","useEffect","checkForValidAmount","toString","handleAmountAdd","prevState","Number","handleAmountRemove","handleInputBlur","useCallback","handleInputChange","event","valueBeforeCheck","target","value","checkedValue","useMemo","createElement","StyledAmountControl","StyledAmountControlButton","onClick","disabled","icons","size","color","StyledAmountControlInput","onBlur","type","displayName","_default","exports"],"sources":["../../../src/components/amount-control/AmountControl.tsx"],"sourcesContent":["import React, { ChangeEvent, FC, useCallback, useEffect, useMemo, useState } from 'react';\nimport Icon from '../icon/Icon';\nimport {\n StyledAmountControl,\n StyledAmountControlButton,\n StyledAmountControlInput,\n} from './AmountControl.styles';\nimport { checkForValidAmount } from './utils/amountControl';\n\nexport type AmountControlProps = {\n /**\n * The amount that should be displayed.\n */\n amount?: number;\n /**\n * The maximum allowed amount.\n */\n maxAmount?: number;\n /**\n * The minimum allowed amount.\n */\n minAmount?: number;\n /**\n * A Function that is executed when the amount is changed\n */\n onChange?: (amount: number) => void;\n};\n\nconst AmountControl: FC<AmountControlProps> = ({ amount, maxAmount, minAmount = 0, onChange }) => {\n const [amountValue, setAmountValue] = useState(0);\n const [inputValue, setInputValue] = useState('0');\n\n /**\n * Function that sets the amountValue to the amount\n */\n useEffect(() => {\n if (!amount) {\n return;\n }\n\n setAmountValue(checkForValidAmount({ amount, maxAmount, minAmount }));\n setInputValue(checkForValidAmount({ amount, maxAmount, minAmount }).toString());\n }, [amount, maxAmount, minAmount]);\n\n /**\n * Function that updates the onChange event\n */\n useEffect(() => {\n if (onChange) {\n onChange(amountValue);\n }\n }, [amountValue, onChange]);\n\n const handleAmountAdd = () => {\n setAmountValue((prevState) => prevState + 1);\n setInputValue((prevState) => (Number(prevState) + 1).toString());\n };\n\n const handleAmountRemove = () => {\n setAmountValue((prevState) => prevState - 1);\n setInputValue((prevState) => (Number(prevState) - 1).toString());\n };\n\n const handleInputBlur = useCallback(() => {\n setAmountValue(inputValue === '' ? 0 : Number(inputValue));\n\n if (inputValue === '') {\n setInputValue('0');\n }\n }, [inputValue]);\n\n const handleInputChange = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n const valueBeforeCheck = Number(event.target.value);\n\n const checkedValue = checkForValidAmount({\n minAmount,\n maxAmount,\n amount: Number(event.target.value),\n });\n\n if (valueBeforeCheck < minAmount && minAmount === 0) {\n setInputValue('0');\n\n return;\n }\n\n setInputValue(checkedValue === 0 ? '' : checkedValue.toString());\n },\n [maxAmount, minAmount]\n );\n\n return useMemo(\n () => (\n <StyledAmountControl>\n <StyledAmountControlButton\n onClick={handleAmountRemove}\n disabled={amountValue <= minAmount}\n >\n <Icon icons={['fa fa-minus']} size={15} color=\"red\" />\n </StyledAmountControlButton>\n <StyledAmountControlInput\n onBlur={handleInputBlur}\n onChange={handleInputChange}\n value={inputValue}\n type=\"number\"\n />\n <StyledAmountControlButton\n onClick={handleAmountAdd}\n disabled={maxAmount ? amountValue >= maxAmount : false}\n >\n <Icon icons={['fa fa-plus']} size={15} color=\"green\" />\n </StyledAmountControlButton>\n </StyledAmountControl>\n ),\n [amountValue, handleInputBlur, handleInputChange, inputValue, maxAmount, minAmount]\n );\n};\n\nAmountControl.displayName = 'AmountControl';\n\nexport default AmountControl;\n"],"mappings":"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"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export declare const StyledAmountControl: import("styled-components").StyledComponent<"div", any, {
|
|
2
|
+
theme: import("../color-scheme-provider/ColorSchemeProvider").Theme;
|
|
3
|
+
}, never>;
|
|
4
|
+
export declare const StyledAmountControlInput: import("styled-components").StyledComponent<"input", any, {
|
|
5
|
+
theme: import("../color-scheme-provider/ColorSchemeProvider").Theme;
|
|
6
|
+
}, never>;
|
|
7
|
+
export declare const StyledAmountControlButton: import("styled-components").StyledComponent<"button", any, {
|
|
8
|
+
disabled: boolean;
|
|
9
|
+
} & {
|
|
10
|
+
theme: import("../color-scheme-provider/ColorSchemeProvider").Theme;
|
|
11
|
+
}, never>;
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.StyledAmountControlInput = exports.StyledAmountControlButton = exports.StyledAmountControl = void 0;
|
|
7
|
+
var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
8
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
9
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
10
|
+
const StyledAmountControl = _styledComponents.default.div`
|
|
11
|
+
background-color: ${_ref => {
|
|
12
|
+
let {
|
|
13
|
+
theme
|
|
14
|
+
} = _ref;
|
|
15
|
+
return theme['202'];
|
|
16
|
+
}};
|
|
17
|
+
display: flex;
|
|
18
|
+
width: fit-content;
|
|
19
|
+
border-radius: 3px;
|
|
20
|
+
`;
|
|
21
|
+
exports.StyledAmountControl = StyledAmountControl;
|
|
22
|
+
const StyledAmountControlInput = _styledComponents.default.input`
|
|
23
|
+
background-color: ${_ref2 => {
|
|
24
|
+
let {
|
|
25
|
+
theme
|
|
26
|
+
} = _ref2;
|
|
27
|
+
return theme['202'];
|
|
28
|
+
}};
|
|
29
|
+
border: none;
|
|
30
|
+
height: 28px;
|
|
31
|
+
width: 95px;
|
|
32
|
+
text-align: center;
|
|
33
|
+
`;
|
|
34
|
+
exports.StyledAmountControlInput = StyledAmountControlInput;
|
|
35
|
+
const StyledAmountControlButton = _styledComponents.default.button`
|
|
36
|
+
background-color: rgba(255, 255, 255, 0.2);
|
|
37
|
+
height: 28px;
|
|
38
|
+
width: 40px;
|
|
39
|
+
|
|
40
|
+
${_ref3 => {
|
|
41
|
+
let {
|
|
42
|
+
disabled
|
|
43
|
+
} = _ref3;
|
|
44
|
+
return disabled && (0, _styledComponents.css)`
|
|
45
|
+
opacity: 0.5;
|
|
46
|
+
`;
|
|
47
|
+
}}
|
|
48
|
+
`;
|
|
49
|
+
exports.StyledAmountControlButton = StyledAmountControlButton;
|
|
50
|
+
//# sourceMappingURL=AmountControl.styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AmountControl.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","StyledAmountControl","styled","div","_ref","theme","exports","StyledAmountControlInput","input","_ref2","StyledAmountControlButton","button","_ref3","disabled","css"],"sources":["../../../src/components/amount-control/AmountControl.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledAmountControlProps = WithTheme<unknown>;\n\nexport const StyledAmountControl = styled.div<StyledAmountControlProps>`\n background-color: ${({ theme }: StyledAmountControlProps) => theme['202']};\n display: flex;\n width: fit-content;\n border-radius: 3px;\n`;\n\ntype StyledAmountControlInputProps = WithTheme<unknown>;\n\nexport const StyledAmountControlInput = styled.input<StyledAmountControlInputProps>`\n background-color: ${({ theme }: StyledAmountControlInputProps) => theme['202']};\n border: none;\n height: 28px;\n width: 95px;\n text-align: center;\n`;\n\ntype StyledAmountControlButtonProps = WithTheme<{\n disabled: boolean;\n}>;\n\nexport const StyledAmountControlButton = styled.button<StyledAmountControlButtonProps>`\n background-color: rgba(255, 255, 255, 0.2);\n height: 28px;\n width: 40px;\n\n ${({ disabled }) =>\n disabled &&\n css`\n opacity: 0.5;\n `}\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAAgD,SAAAC,yBAAAC,WAAA,eAAAC,OAAA,kCAAAC,iBAAA,OAAAD,OAAA,QAAAE,gBAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,WAAA,WAAAA,WAAA,GAAAG,gBAAA,GAAAD,iBAAA,KAAAF,WAAA;AAAA,SAAAH,wBAAAO,GAAA,EAAAJ,WAAA,SAAAA,WAAA,IAAAI,GAAA,IAAAA,GAAA,CAAAC,UAAA,WAAAD,GAAA,QAAAA,GAAA,oBAAAA,GAAA,wBAAAA,GAAA,4BAAAE,OAAA,EAAAF,GAAA,UAAAG,KAAA,GAAAR,wBAAA,CAAAC,WAAA,OAAAO,KAAA,IAAAA,KAAA,CAAAC,GAAA,CAAAJ,GAAA,YAAAG,KAAA,CAAAE,GAAA,CAAAL,GAAA,SAAAM,MAAA,WAAAC,qBAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,GAAA,IAAAX,GAAA,QAAAW,GAAA,kBAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAd,GAAA,EAAAW,GAAA,SAAAI,IAAA,GAAAR,qBAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAV,GAAA,EAAAW,GAAA,cAAAI,IAAA,KAAAA,IAAA,CAAAV,GAAA,IAAAU,IAAA,CAAAC,GAAA,KAAAR,MAAA,CAAAC,cAAA,CAAAH,MAAA,EAAAK,GAAA,EAAAI,IAAA,YAAAT,MAAA,CAAAK,GAAA,IAAAX,GAAA,CAAAW,GAAA,SAAAL,MAAA,CAAAJ,OAAA,GAAAF,GAAA,MAAAG,KAAA,IAAAA,KAAA,CAAAa,GAAA,CAAAhB,GAAA,EAAAM,MAAA,YAAAA,MAAA;AAKzC,MAAMW,mBAAmB,GAAGC,yBAAM,CAACC,GAA8B;AACxE,wBAAwBC,IAAA;EAAA,IAAC;IAAEC;EAAgC,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAAC,KAAK,CAAC;AAAA,CAAC;AAC9E;AACA;AACA;AACA,CAAC;AAACC,OAAA,CAAAL,mBAAA,GAAAA,mBAAA;AAIK,MAAMM,wBAAwB,GAAGL,yBAAM,CAACM,KAAqC;AACpF,wBAAwBC,KAAA;EAAA,IAAC;IAAEJ;EAAqC,CAAC,GAAAI,KAAA;EAAA,OAAKJ,KAAK,CAAC,KAAK,CAAC;AAAA,CAAC;AACnF;AACA;AACA;AACA;AACA,CAAC;AAACC,OAAA,CAAAC,wBAAA,GAAAA,wBAAA;AAMK,MAAMG,yBAAyB,GAAGR,yBAAM,CAACS,MAAuC;AACvF;AACA;AACA;AACA;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEC;EAAS,CAAC,GAAAD,KAAA;EAAA,OACXC,QAAQ,IACR,IAAAC,qBAAG,CAAC;AACZ;AACA,SAAS;AAAA,CAAC;AACV,CAAC;AAACR,OAAA,CAAAI,yBAAA,GAAAA,yBAAA"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.checkForValidAmount = void 0;
|
|
7
|
+
const checkForValidAmount = _ref => {
|
|
8
|
+
let {
|
|
9
|
+
amount,
|
|
10
|
+
maxAmount,
|
|
11
|
+
minAmount
|
|
12
|
+
} = _ref;
|
|
13
|
+
if (maxAmount && amount > maxAmount) {
|
|
14
|
+
return maxAmount;
|
|
15
|
+
}
|
|
16
|
+
if (amount < minAmount) {
|
|
17
|
+
return minAmount;
|
|
18
|
+
}
|
|
19
|
+
return amount;
|
|
20
|
+
};
|
|
21
|
+
exports.checkForValidAmount = checkForValidAmount;
|
|
22
|
+
//# sourceMappingURL=amountControl.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"amountControl.js","names":["checkForValidAmount","_ref","amount","maxAmount","minAmount","exports"],"sources":["../../../../src/components/amount-control/utils/amountControl.ts"],"sourcesContent":["interface CheckForValidAmount {\n amount: number;\n maxAmount?: number;\n minAmount: number;\n}\n\nexport const checkForValidAmount = ({ amount, maxAmount, minAmount }: CheckForValidAmount) => {\n if (maxAmount && amount > maxAmount) {\n return maxAmount;\n }\n\n if (amount < minAmount) {\n return minAmount;\n }\n\n return amount;\n};\n"],"mappings":";;;;;;AAMO,MAAMA,mBAAmB,GAAGC,IAAA,IAA2D;EAAA,IAA1D;IAAEC,MAAM;IAAEC,SAAS;IAAEC;EAA+B,CAAC,GAAAH,IAAA;EACrF,IAAIE,SAAS,IAAID,MAAM,GAAGC,SAAS,EAAE;IACjC,OAAOA,SAAS;EACpB;EAEA,IAAID,MAAM,GAAGE,SAAS,EAAE;IACpB,OAAOA,SAAS;EACpB;EAEA,OAAOF,MAAM;AACjB,CAAC;AAACG,OAAA,CAAAL,mBAAA,GAAAA,mBAAA"}
|