@laerdal/life-react-components 1.8.0-dev.6.full → 1.8.0-dev.9
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/dist/Popover/Popover.cjs +249 -0
- package/dist/Popover/Popover.cjs.map +1 -0
- package/dist/Popover/Popover.d.ts +26 -0
- package/dist/Popover/Popover.js +214 -0
- package/dist/Popover/Popover.js.map +1 -0
- package/dist/Popover/index.cjs +16 -0
- package/dist/Popover/index.cjs.map +1 -0
- package/dist/Popover/index.d.ts +1 -0
- package/dist/Popover/index.js +2 -0
- package/dist/Popover/index.js.map +1 -0
- package/dist/index.cjs +14 -0
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.js +1 -0
- package/dist/index.js.map +1 -1
- package/dist/styles/z-indexes.cjs +2 -1
- package/dist/styles/z-indexes.cjs.map +1 -1
- package/dist/styles/z-indexes.d.ts +1 -0
- package/dist/styles/z-indexes.js +2 -1
- package/dist/styles/z-indexes.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,249 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
+
|
|
7
|
+
Object.defineProperty(exports, "__esModule", {
|
|
8
|
+
value: true
|
|
9
|
+
});
|
|
10
|
+
exports.default = void 0;
|
|
11
|
+
|
|
12
|
+
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
13
|
+
|
|
14
|
+
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
15
|
+
|
|
16
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
17
|
+
|
|
18
|
+
var React = _interopRequireWildcard(require("react"));
|
|
19
|
+
|
|
20
|
+
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
21
|
+
|
|
22
|
+
var _ = require("..");
|
|
23
|
+
|
|
24
|
+
var _Button = require("../Button");
|
|
25
|
+
|
|
26
|
+
var _icons = require("../icons");
|
|
27
|
+
|
|
28
|
+
var _styles = require("../styles");
|
|
29
|
+
|
|
30
|
+
var _types = require("../types");
|
|
31
|
+
|
|
32
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
33
|
+
|
|
34
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
|
|
35
|
+
|
|
36
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
37
|
+
|
|
38
|
+
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; }
|
|
39
|
+
|
|
40
|
+
var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n height: ", ";\n width: ", ";\n border-radius: 4px;\n background: ", ";\n cursor: default;\n box-shadow: ", ";\n\n position: absolute; \n visibility: hidden;\n opacity: 0;\n z-index: ", ";\n\n ", "\n ", "\n\n ", "\n ", "\n\n &::after {\n height: 16px;\n width: 16px;\n content: \"\";\n position: absolute;\n background: ", ";\n\n ", "\n ", "\n\n ", "\n ", "\n"])), function (props) {
|
|
41
|
+
return props.size === _types.Size.Small ? '240px' : props.size === _types.Size.Large ? '480px' : '360px';
|
|
42
|
+
}, function (props) {
|
|
43
|
+
return props.size === _types.Size.Small ? '344px' : props.size === _types.Size.Large ? '624px' : '464px';
|
|
44
|
+
}, _.COLORS.white, _styles.BOXSHADOWS.BOXSHADOW_CENTERED, _styles.Z_INDEXES.popover, function (props) {
|
|
45
|
+
return props.position == 'bottom' ? 'right: 50%; top: calc(100% + 8px); transform: translateX(50%);' : '';
|
|
46
|
+
}, function (props) {
|
|
47
|
+
return props.position == 'top' ? 'right: 50%; bottom: calc(100% + 8px); transform: translateX(50%);' : '';
|
|
48
|
+
}, function (props) {
|
|
49
|
+
return props.position == 'left' ? 'bottom: 50%; right: calc(100% + 8px); transform: translateY(50%);' : '';
|
|
50
|
+
}, function (props) {
|
|
51
|
+
return props.position == 'right' ? 'bottom: 50%; left: calc(100% + 8px); transform: translateY(50%);' : '';
|
|
52
|
+
}, _.COLORS.white, function (props) {
|
|
53
|
+
return props.position == 'bottom' ? 'right: 50%; bottom: 100%; transform: translateY(50%) rotate(45deg);' : '';
|
|
54
|
+
}, function (props) {
|
|
55
|
+
return props.position == 'top' ? 'right: 50%; top: 100%; transform: translateY(-50%) rotate(45deg);' : '';
|
|
56
|
+
}, function (props) {
|
|
57
|
+
return props.position == 'left' ? 'bottom: 50%; left: 100%; transform: translateX(-50%) rotate(45deg);' : '';
|
|
58
|
+
}, function (props) {
|
|
59
|
+
return props.position == 'right' ? 'bottom: 50%; right: 100%; transform: translateX(50%) rotate(45deg);' : '';
|
|
60
|
+
});
|
|
61
|
+
|
|
62
|
+
var TopContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n height: ", ";\n width: ", ";\n display: flex;\n"])), function (props) {
|
|
63
|
+
return props.size === _types.Size.Small ? '56px' : props.size === _types.Size.Large ? '72px' : '64px';
|
|
64
|
+
}, function (props) {
|
|
65
|
+
return props.size === _types.Size.Small ? '344px' : props.size === _types.Size.Large ? '624px' : '464px';
|
|
66
|
+
});
|
|
67
|
+
|
|
68
|
+
var MiddleContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n height: ", ";\n width: ", ";\n padding: ", ";\n overflow-y: auto;\n ", "\n"])), function (props) {
|
|
69
|
+
return props.size === _types.Size.Small ? '104px' : props.size === _types.Size.Large ? '304px' : '208px';
|
|
70
|
+
}, function (props) {
|
|
71
|
+
return props.size === _types.Size.Small ? '312px' : props.size === _types.Size.Large ? '576px' : '424px';
|
|
72
|
+
}, function (props) {
|
|
73
|
+
return props.size === _types.Size.Small ? '8px 16px' : props.size === _types.Size.Large ? '8px 24px' : '8px 20px';
|
|
74
|
+
}, function (props) {
|
|
75
|
+
return (0, _styles.scrollBarStyling)(props.size === _types.Size.Small ? _types.Size.Small : _types.Size.Medium);
|
|
76
|
+
});
|
|
77
|
+
|
|
78
|
+
var BottomContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n height: ", ";\n width: ", ";\n display: flex;\n\n .bottom-flex {\n flex: 1;\n }\n"])), function (props) {
|
|
79
|
+
return props.size === _types.Size.Small ? '64px' : props.size === _types.Size.Large ? '88px' : '72px';
|
|
80
|
+
}, function (props) {
|
|
81
|
+
return props.size === _types.Size.Small ? '344px' : props.size === _types.Size.Large ? '624px' : '464px';
|
|
82
|
+
});
|
|
83
|
+
|
|
84
|
+
var TextContainer = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: column;\n margin: ", ";\n flex-grow: 1;\n"])), function (props) {
|
|
85
|
+
return renderMargins(props.note, props.size);
|
|
86
|
+
});
|
|
87
|
+
|
|
88
|
+
var NoteContainer = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n ", "\n"])), function (props) {
|
|
89
|
+
return props.size === _types.Size.Small ? (0, _styles.ComponentXXSStyling)(_.ComponentTextStyle.Regular, _.COLORS.neutral_600) : props.size === _types.Size.Large ? (0, _styles.ComponentSStyling)(_.ComponentTextStyle.Regular, _.COLORS.neutral_600) : (0, _.ComponentXSStyling)(_.ComponentTextStyle.Regular, _.COLORS.neutral_600);
|
|
90
|
+
});
|
|
91
|
+
|
|
92
|
+
var LabelContainer = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n ", "\n"])), function (props) {
|
|
93
|
+
return props.size === _types.Size.Small ? (0, _styles.ComponentSStyling)(_.ComponentTextStyle.Bold, null) : props.size === _types.Size.Large ? (0, _styles.ComponentLStyling)(_.ComponentTextStyle.Bold, null) : (0, _styles.ComponentMStyling)(_.ComponentTextStyle.Bold, null);
|
|
94
|
+
});
|
|
95
|
+
|
|
96
|
+
var CloseButtonContainer = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n margin: ", ";\n"])), function (props) {
|
|
97
|
+
return props.size === _types.Size.Small ? '4px 16px 4px 0' : props.size === _types.Size.Large ? '12px 24px 12px 0' : '8px 20px 8px 0';
|
|
98
|
+
});
|
|
99
|
+
|
|
100
|
+
var TextButtonContainer = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n margin: ", ";\n"])), function (props) {
|
|
101
|
+
return props.size === _types.Size.Small ? '8px 0 8px 16px' : props.size === _types.Size.Large ? '16px 0 16px 24px' : '12px 0 12px 20px';
|
|
102
|
+
});
|
|
103
|
+
|
|
104
|
+
var IconButtonContainer = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n margin: ", ";\n display: flex;\n"])), function (props) {
|
|
105
|
+
return props.size === _types.Size.Small ? '8px 16px 8px 0' : props.size === _types.Size.Large ? '16px 24px 16px 0' : '12px 20px 12px 0';
|
|
106
|
+
});
|
|
107
|
+
|
|
108
|
+
var Wrapper = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n position: relative;\n\n .pointer-space {\n height: ", ";\n width: ", ";\n position: absolute;\n\n ", ";\n ", ";\n\n ", ";\n ", ";\n }\n\n ", "\n"])), function (props) {
|
|
109
|
+
return props.position === 'top' || props.position === 'bottom' ? '8px' : '100%';
|
|
110
|
+
}, function (props) {
|
|
111
|
+
return props.position === 'left' || props.position === 'right' ? '8px' : '100%';
|
|
112
|
+
}, function (props) {
|
|
113
|
+
return props.position === 'left' ? 'right:100%; bottom: 0%' : '';
|
|
114
|
+
}, function (props) {
|
|
115
|
+
return props.position === 'right' ? 'left:100%; bottom: 0%' : '';
|
|
116
|
+
}, function (props) {
|
|
117
|
+
return props.position === 'top' ? 'bottom: 100%' : '';
|
|
118
|
+
}, function (props) {
|
|
119
|
+
return props.position === 'bottom' ? 'top: 100%' : '';
|
|
120
|
+
}, function (props) {
|
|
121
|
+
return props.showOnClick ? "".concat(Container, " {\n visibility: ").concat(props.showPopover ? 'visible' : 'hidden', ";\n opacity: ").concat(props.showPopover ? '1' : '0', ";\n }\n cursor: pointer;") : "&:hover {\n ".concat(Container, " {\n visibility: visible;\n opacity: 1;\n }\n }");
|
|
122
|
+
});
|
|
123
|
+
|
|
124
|
+
var renderMargins = function renderMargins(isNotePresent, size) {
|
|
125
|
+
if (isNotePresent) {
|
|
126
|
+
return size === _types.Size.Small ? '10px 16px' : size === _types.Size.Large ? '14px 24px' : '12px 20px';
|
|
127
|
+
} else {
|
|
128
|
+
return size === _types.Size.Small ? '18px 16px' : size === _types.Size.Large ? '24px' : '20px';
|
|
129
|
+
}
|
|
130
|
+
};
|
|
131
|
+
|
|
132
|
+
var Popover = function Popover(_ref) {
|
|
133
|
+
var _bottomSectionProps$t, _bottomSectionProps$i;
|
|
134
|
+
|
|
135
|
+
var _ref$size = _ref.size,
|
|
136
|
+
size = _ref$size === void 0 ? _types.Size.Medium : _ref$size,
|
|
137
|
+
topSectionProps = _ref.topSectionProps,
|
|
138
|
+
bottomSectionProps = _ref.bottomSectionProps,
|
|
139
|
+
mainContent = _ref.mainContent,
|
|
140
|
+
children = _ref.children,
|
|
141
|
+
position = _ref.position,
|
|
142
|
+
_ref$showOnClick = _ref.showOnClick,
|
|
143
|
+
showOnClick = _ref$showOnClick === void 0 ? false : _ref$showOnClick;
|
|
144
|
+
|
|
145
|
+
var _React$useState = React.useState(false),
|
|
146
|
+
_React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
|
|
147
|
+
showPopover = _React$useState2[0],
|
|
148
|
+
setShowPopover = _React$useState2[1];
|
|
149
|
+
|
|
150
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Wrapper, {
|
|
151
|
+
position: position,
|
|
152
|
+
showOnClick: showOnClick,
|
|
153
|
+
showPopover: showPopover,
|
|
154
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(Container, {
|
|
155
|
+
size: size,
|
|
156
|
+
position: position,
|
|
157
|
+
children: [!!topSectionProps && /*#__PURE__*/(0, _jsxRuntime.jsxs)(TopContainer, {
|
|
158
|
+
size: size,
|
|
159
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(TextContainer, {
|
|
160
|
+
note: !!(topSectionProps !== null && topSectionProps !== void 0 && topSectionProps.note),
|
|
161
|
+
size: size,
|
|
162
|
+
children: [(topSectionProps === null || topSectionProps === void 0 ? void 0 : topSectionProps.note) && /*#__PURE__*/(0, _jsxRuntime.jsx)(NoteContainer, {
|
|
163
|
+
size: size,
|
|
164
|
+
children: topSectionProps.note
|
|
165
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(LabelContainer, {
|
|
166
|
+
size: size,
|
|
167
|
+
children: topSectionProps === null || topSectionProps === void 0 ? void 0 : topSectionProps.text
|
|
168
|
+
})]
|
|
169
|
+
}), showOnClick && /*#__PURE__*/(0, _jsxRuntime.jsx)(CloseButtonContainer, {
|
|
170
|
+
size: size,
|
|
171
|
+
"data-testid": 'closeBtn',
|
|
172
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, {
|
|
173
|
+
action: function action() {
|
|
174
|
+
return setShowPopover(false);
|
|
175
|
+
},
|
|
176
|
+
useTransparentBackground: true,
|
|
177
|
+
iconColor: _.COLORS.neutral_600,
|
|
178
|
+
variant: "secondary",
|
|
179
|
+
shape: "circular",
|
|
180
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.Close, {})
|
|
181
|
+
})
|
|
182
|
+
})]
|
|
183
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(MiddleContainer, {
|
|
184
|
+
size: size,
|
|
185
|
+
children: mainContent
|
|
186
|
+
}), !!bottomSectionProps && /*#__PURE__*/(0, _jsxRuntime.jsxs)(BottomContainer, {
|
|
187
|
+
size: size,
|
|
188
|
+
children: [!!(bottomSectionProps !== null && bottomSectionProps !== void 0 && (_bottomSectionProps$t = bottomSectionProps.textButton) !== null && _bottomSectionProps$t !== void 0 && _bottomSectionProps$t.icon) && /*#__PURE__*/(0, _jsxRuntime.jsx)(TextButtonContainer, {
|
|
189
|
+
size: size,
|
|
190
|
+
"data-testid": 'textBtn',
|
|
191
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.Button, {
|
|
192
|
+
size: size,
|
|
193
|
+
variant: "secondary",
|
|
194
|
+
icon: bottomSectionProps.textButton.icon,
|
|
195
|
+
onClick: bottomSectionProps.textButton.action,
|
|
196
|
+
children: bottomSectionProps.textButton.label
|
|
197
|
+
})
|
|
198
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
199
|
+
className: "bottom-flex"
|
|
200
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(IconButtonContainer, {
|
|
201
|
+
size: size,
|
|
202
|
+
"data-testid": 'iconBtn',
|
|
203
|
+
children: bottomSectionProps === null || bottomSectionProps === void 0 ? void 0 : (_bottomSectionProps$i = bottomSectionProps.iconButtons) === null || _bottomSectionProps$i === void 0 ? void 0 : _bottomSectionProps$i.map(function (iconButton) {
|
|
204
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, {
|
|
205
|
+
action: iconButton.action,
|
|
206
|
+
variant: "secondary",
|
|
207
|
+
shape: "circular",
|
|
208
|
+
useTransparentBackground: true,
|
|
209
|
+
children: iconButton.icon
|
|
210
|
+
});
|
|
211
|
+
})
|
|
212
|
+
})]
|
|
213
|
+
})]
|
|
214
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
215
|
+
onClick: function onClick() {
|
|
216
|
+
return showOnClick && setShowPopover(!showPopover);
|
|
217
|
+
},
|
|
218
|
+
children: [children, /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
219
|
+
className: "pointer-space"
|
|
220
|
+
})]
|
|
221
|
+
})]
|
|
222
|
+
});
|
|
223
|
+
};
|
|
224
|
+
|
|
225
|
+
Popover.propTypes = {
|
|
226
|
+
topSectionProps: _propTypes.default.shape({
|
|
227
|
+
text: _propTypes.default.string.isRequired,
|
|
228
|
+
note: _propTypes.default.string
|
|
229
|
+
}),
|
|
230
|
+
bottomSectionProps: _propTypes.default.shape({
|
|
231
|
+
iconButtons: _propTypes.default.arrayOf(_propTypes.default.shape({
|
|
232
|
+
icon: _propTypes.default.node.isRequired,
|
|
233
|
+
action: _propTypes.default.func.isRequired,
|
|
234
|
+
label: _propTypes.default.string
|
|
235
|
+
})),
|
|
236
|
+
textButton: _propTypes.default.shape({
|
|
237
|
+
icon: _propTypes.default.node.isRequired,
|
|
238
|
+
action: _propTypes.default.func.isRequired,
|
|
239
|
+
label: _propTypes.default.string
|
|
240
|
+
})
|
|
241
|
+
}),
|
|
242
|
+
mainContent: _propTypes.default.node.isRequired,
|
|
243
|
+
children: _propTypes.default.node.isRequired,
|
|
244
|
+
position: _propTypes.default.oneOf(['top', 'bottom', 'right', 'left']).isRequired,
|
|
245
|
+
showOnClick: _propTypes.default.bool.isRequired
|
|
246
|
+
};
|
|
247
|
+
var _default = Popover;
|
|
248
|
+
exports.default = _default;
|
|
249
|
+
//# sourceMappingURL=Popover.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Popover/Popover.tsx"],"names":["Container","styled","div","props","size","Size","Small","Large","COLORS","white","BOXSHADOWS","BOXSHADOW_CENTERED","Z_INDEXES","popover","position","TopContainer","MiddleContainer","Medium","BottomContainer","TextContainer","renderMargins","note","NoteContainer","ComponentTextStyle","Regular","neutral_600","LabelContainer","Bold","CloseButtonContainer","TextButtonContainer","IconButtonContainer","Wrapper","showOnClick","showPopover","isNotePresent","Popover","topSectionProps","bottomSectionProps","mainContent","children","React","useState","setShowPopover","text","textButton","icon","action","label","iconButtons","map","iconButton"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { COLORS, ComponentTextStyle, ComponentXSStyling } from '..';\nimport { Button, IconButton } from '../Button';\nimport { SystemIcons } from '../icons';\nimport { BOXSHADOWS, ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentXXSStyling, scrollBarStyling, Z_INDEXES } from '../styles';\nimport { Size } from '../types';\n\nconst Container = styled.div<{size: Size, position: string}>`\n height: ${props=>props.size===Size.Small ? '240px' : (props.size===Size.Large ? '480px' : '360px')};\n width: ${props=>props.size===Size.Small ? '344px' : (props.size===Size.Large ? '624px' : '464px')};\n border-radius: 4px;\n background: ${COLORS.white};\n cursor: default;\n box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\n\n position: absolute; \n visibility: hidden;\n opacity: 0;\n z-index: ${Z_INDEXES.popover};\n\n ${props => (props.position == 'bottom' ? 'right: 50%; top: calc(100% + 8px); transform: translateX(50%);' : '')}\n ${props => (props.position == 'top' ? 'right: 50%; bottom: calc(100% + 8px); transform: translateX(50%);' : '')}\n\n ${props => (props.position == 'left' ? 'bottom: 50%; right: calc(100% + 8px); transform: translateY(50%);' : '')}\n ${props => (props.position == 'right' ? 'bottom: 50%; left: calc(100% + 8px); transform: translateY(50%);' : '')}\n\n &::after {\n height: 16px;\n width: 16px;\n content: \"\";\n position: absolute;\n background: ${COLORS.white};\n\n ${props => (props.position == 'bottom' ? 'right: 50%; bottom: 100%; transform: translateY(50%) rotate(45deg);' : '')}\n ${props => (props.position == 'top' ? 'right: 50%; top: 100%; transform: translateY(-50%) rotate(45deg);' : '')}\n\n ${props => (props.position == 'left' ? 'bottom: 50%; left: 100%; transform: translateX(-50%) rotate(45deg);' : '')}\n ${props => (props.position == 'right' ? 'bottom: 50%; right: 100%; transform: translateX(50%) rotate(45deg);' : '')}\n`;\n\nconst TopContainer = styled.div<{size: Size}>`\n height: ${props=>props.size===Size.Small ? '56px' : (props.size===Size.Large ? '72px' : '64px')};\n width: ${props=>props.size===Size.Small ? '344px' : (props.size===Size.Large ? '624px' : '464px')};\n display: flex;\n`;\n\nconst MiddleContainer = styled.div<{size: Size}>`\n height: ${props=>props.size===Size.Small ? '104px' : (props.size===Size.Large ? '304px' : '208px')};\n width: ${props=>props.size===Size.Small ? '312px' : (props.size===Size.Large ? '576px' : '424px')};\n padding: ${props=>props.size===Size.Small ? '8px 16px' : (props.size===Size.Large ? '8px 24px' : '8px 20px')};\n overflow-y: auto;\n ${props=>scrollBarStyling(props.size===Size.Small?Size.Small:Size.Medium)}\n`;\n\nconst BottomContainer = styled.div<{size: Size}>`\n height: ${props=>props.size===Size.Small ? '64px' : (props.size===Size.Large ? '88px' : '72px')};\n width: ${props=>props.size===Size.Small ? '344px' : (props.size===Size.Large ? '624px' : '464px')};\n display: flex;\n\n .bottom-flex {\n flex: 1;\n }\n`;\n\nconst TextContainer = styled.div<{note: boolean, size: Size}>`\n display: flex;\n flex-direction: column;\n margin: ${props=>renderMargins(props.note, props.size)};\n flex-grow: 1;\n`;\n\nconst NoteContainer = styled.div<{size: Size}>`\n ${props=>props.size===Size.Small ? ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600) : (props.size===Size.Large ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.neutral_600) : ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600))}\n`;\n\nconst LabelContainer = styled.div<{size: Size}>`\n ${props=>props.size===Size.Small ? ComponentSStyling(ComponentTextStyle.Bold, null) : (props.size===Size.Large ? ComponentLStyling(ComponentTextStyle.Bold, null) : ComponentMStyling(ComponentTextStyle.Bold, null))}\n`;\n\nconst CloseButtonContainer = styled.div<{size: Size}>`\n margin: ${props=>props.size===Size.Small ? '4px 16px 4px 0' : (props.size===Size.Large ? '12px 24px 12px 0' : '8px 20px 8px 0')};\n`;\n\nconst TextButtonContainer = styled.div<{size: Size}>`\n margin: ${props=>props.size===Size.Small ? '8px 0 8px 16px' : (props.size===Size.Large ? '16px 0 16px 24px' : '12px 0 12px 20px')};\n`;\n\nconst IconButtonContainer = styled.div<{size: Size}>`\n margin: ${props=>props.size===Size.Small ? '8px 16px 8px 0' : (props.size===Size.Large ? '16px 24px 16px 0' : '12px 20px 12px 0')};\n display: flex;\n`;\n\nconst Wrapper = styled.div<{position: string, showOnClick: boolean, showPopover: boolean}>`\n position: relative;\n\n .pointer-space {\n height: ${props=>props.position==='top' || props.position==='bottom' ? '8px' : '100%'};\n width: ${props=>props.position==='left' || props.position==='right' ? '8px' : '100%'};\n position: absolute;\n\n ${props=>props.position==='left' ? 'right:100%; bottom: 0%' : ''};\n ${props=>props.position==='right' ? 'left:100%; bottom: 0%' : ''};\n\n ${props=>props.position==='top' ? 'bottom: 100%' : ''};\n ${props=>props.position==='bottom' ? 'top: 100%' : ''};\n }\n\n ${props=>props.showOnClick ? \n `${Container} {\n visibility: ${props.showPopover ? 'visible' : 'hidden'};\n opacity: ${props.showPopover ? '1' : '0'};\n }\n cursor: pointer;` \n : \n `&:hover {\n ${Container} {\n visibility: visible;\n opacity: 1;\n }\n }`\n }\n`;\n\nconst renderMargins = (isNotePresent: boolean, size: Size): string => {\n if(isNotePresent){\n return (size===Size.Small ? '10px 16px' : (size===Size.Large ? '14px 24px' : '12px 20px'));\n }\n else{\n return (size===Size.Small ? '18px 16px' : (size===Size.Large ? '24px' : '20px'));\n }\n}\n\ntype topSectionProps = {\n text: string;\n note?: string;\n}\n\ntype actionButtonProps = {\n icon: React.ReactNode;\n action: ()=>void;\n label?: string;\n}\n\ntype bottomSectionProps = {\n iconButtons?: actionButtonProps[];\n textButton?: actionButtonProps;\n}\n\ntype PopoverProps = {\n size?: Size.Small | Size.Medium | Size.Large;\n topSectionProps?: topSectionProps;\n bottomSectionProps?: bottomSectionProps;\n mainContent: React.ReactNode;\n children: React.ReactNode;\n position: 'top' | 'bottom' | 'right' | 'left';\n showOnClick: boolean;\n}\n\nconst Popover: React.FunctionComponent<PopoverProps> = \n({\n size=Size.Medium,\n topSectionProps,\n bottomSectionProps,\n mainContent,\n children,\n position,\n showOnClick=false\n}) => {\n\n const [showPopover, setShowPopover] = React.useState(false);\n\n return (\n <Wrapper position={position} showOnClick={showOnClick} showPopover={showPopover}>\n <Container size={size} position={position}>\n {!!topSectionProps && \n <TopContainer size={size}>\n <TextContainer note={!!topSectionProps?.note} size={size}>\n {topSectionProps?.note && \n <NoteContainer size={size}>\n {topSectionProps.note}\n </NoteContainer>\n }\n <LabelContainer size={size}>\n {topSectionProps?.text}\n </LabelContainer>\n </TextContainer>\n\n {showOnClick && \n <CloseButtonContainer size={size} data-testid={'closeBtn'}>\n <IconButton action={()=>setShowPopover(false)} useTransparentBackground iconColor={COLORS.neutral_600} variant='secondary' shape='circular'>\n <SystemIcons.Close />\n </IconButton>\n </CloseButtonContainer>\n }\n </TopContainer>\n }\n\n <MiddleContainer size={size}>\n {mainContent}\n </MiddleContainer>\n\n {!!bottomSectionProps && \n <BottomContainer size={size}>\n {!!bottomSectionProps?.textButton?.icon && \n <TextButtonContainer size={size} data-testid={'textBtn'}>\n <Button size={size} variant='secondary' icon={bottomSectionProps.textButton.icon} onClick={bottomSectionProps.textButton.action}>\n {bottomSectionProps.textButton.label}\n </Button>\n </TextButtonContainer>\n }\n\n <div className='bottom-flex'/>\n \n <IconButtonContainer size={size} data-testid={'iconBtn'}>\n {bottomSectionProps?.iconButtons?.map((iconButton) =>\n \n <IconButton action={iconButton.action} variant='secondary' shape='circular' useTransparentBackground>\n {iconButton.icon}\n </IconButton> \n )}\n </IconButtonContainer>\n </BottomContainer>\n }\n </Container>\n\n <div onClick={()=>showOnClick && setShowPopover(!showPopover)}>\n {children}\n\n <div className='pointer-space'/>\n </div>\n\n </Wrapper>\n );\n};\n\nexport default Popover;"],"file":"Popover.cjs"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { Size } from '../types';
|
|
3
|
+
declare type topSectionProps = {
|
|
4
|
+
text: string;
|
|
5
|
+
note?: string;
|
|
6
|
+
};
|
|
7
|
+
declare type actionButtonProps = {
|
|
8
|
+
icon: React.ReactNode;
|
|
9
|
+
action: () => void;
|
|
10
|
+
label?: string;
|
|
11
|
+
};
|
|
12
|
+
declare type bottomSectionProps = {
|
|
13
|
+
iconButtons?: actionButtonProps[];
|
|
14
|
+
textButton?: actionButtonProps;
|
|
15
|
+
};
|
|
16
|
+
declare type PopoverProps = {
|
|
17
|
+
size?: Size.Small | Size.Medium | Size.Large;
|
|
18
|
+
topSectionProps?: topSectionProps;
|
|
19
|
+
bottomSectionProps?: bottomSectionProps;
|
|
20
|
+
mainContent: React.ReactNode;
|
|
21
|
+
children: React.ReactNode;
|
|
22
|
+
position: 'top' | 'bottom' | 'right' | 'left';
|
|
23
|
+
showOnClick: boolean;
|
|
24
|
+
};
|
|
25
|
+
declare const Popover: React.FunctionComponent<PopoverProps>;
|
|
26
|
+
export default Popover;
|
|
@@ -0,0 +1,214 @@
|
|
|
1
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
2
|
+
import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
|
|
3
|
+
import _pt from "prop-types";
|
|
4
|
+
|
|
5
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
|
|
6
|
+
|
|
7
|
+
import * as React from 'react';
|
|
8
|
+
import styled from 'styled-components';
|
|
9
|
+
import { COLORS, ComponentTextStyle, ComponentXSStyling } from '..';
|
|
10
|
+
import { Button, IconButton } from '../Button';
|
|
11
|
+
import { SystemIcons } from '../icons';
|
|
12
|
+
import { BOXSHADOWS, ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentXXSStyling, scrollBarStyling, Z_INDEXES } from '../styles';
|
|
13
|
+
import { Size } from '../types';
|
|
14
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
15
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
16
|
+
var Container = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n height: ", ";\n width: ", ";\n border-radius: 4px;\n background: ", ";\n cursor: default;\n box-shadow: ", ";\n\n position: absolute; \n visibility: hidden;\n opacity: 0;\n z-index: ", ";\n\n ", "\n ", "\n\n ", "\n ", "\n\n &::after {\n height: 16px;\n width: 16px;\n content: \"\";\n position: absolute;\n background: ", ";\n\n ", "\n ", "\n\n ", "\n ", "\n"])), function (props) {
|
|
17
|
+
return props.size === Size.Small ? '240px' : props.size === Size.Large ? '480px' : '360px';
|
|
18
|
+
}, function (props) {
|
|
19
|
+
return props.size === Size.Small ? '344px' : props.size === Size.Large ? '624px' : '464px';
|
|
20
|
+
}, COLORS.white, BOXSHADOWS.BOXSHADOW_CENTERED, Z_INDEXES.popover, function (props) {
|
|
21
|
+
return props.position == 'bottom' ? 'right: 50%; top: calc(100% + 8px); transform: translateX(50%);' : '';
|
|
22
|
+
}, function (props) {
|
|
23
|
+
return props.position == 'top' ? 'right: 50%; bottom: calc(100% + 8px); transform: translateX(50%);' : '';
|
|
24
|
+
}, function (props) {
|
|
25
|
+
return props.position == 'left' ? 'bottom: 50%; right: calc(100% + 8px); transform: translateY(50%);' : '';
|
|
26
|
+
}, function (props) {
|
|
27
|
+
return props.position == 'right' ? 'bottom: 50%; left: calc(100% + 8px); transform: translateY(50%);' : '';
|
|
28
|
+
}, COLORS.white, function (props) {
|
|
29
|
+
return props.position == 'bottom' ? 'right: 50%; bottom: 100%; transform: translateY(50%) rotate(45deg);' : '';
|
|
30
|
+
}, function (props) {
|
|
31
|
+
return props.position == 'top' ? 'right: 50%; top: 100%; transform: translateY(-50%) rotate(45deg);' : '';
|
|
32
|
+
}, function (props) {
|
|
33
|
+
return props.position == 'left' ? 'bottom: 50%; left: 100%; transform: translateX(-50%) rotate(45deg);' : '';
|
|
34
|
+
}, function (props) {
|
|
35
|
+
return props.position == 'right' ? 'bottom: 50%; right: 100%; transform: translateX(50%) rotate(45deg);' : '';
|
|
36
|
+
});
|
|
37
|
+
var TopContainer = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n height: ", ";\n width: ", ";\n display: flex;\n"])), function (props) {
|
|
38
|
+
return props.size === Size.Small ? '56px' : props.size === Size.Large ? '72px' : '64px';
|
|
39
|
+
}, function (props) {
|
|
40
|
+
return props.size === Size.Small ? '344px' : props.size === Size.Large ? '624px' : '464px';
|
|
41
|
+
});
|
|
42
|
+
var MiddleContainer = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n height: ", ";\n width: ", ";\n padding: ", ";\n overflow-y: auto;\n ", "\n"])), function (props) {
|
|
43
|
+
return props.size === Size.Small ? '104px' : props.size === Size.Large ? '304px' : '208px';
|
|
44
|
+
}, function (props) {
|
|
45
|
+
return props.size === Size.Small ? '312px' : props.size === Size.Large ? '576px' : '424px';
|
|
46
|
+
}, function (props) {
|
|
47
|
+
return props.size === Size.Small ? '8px 16px' : props.size === Size.Large ? '8px 24px' : '8px 20px';
|
|
48
|
+
}, function (props) {
|
|
49
|
+
return scrollBarStyling(props.size === Size.Small ? Size.Small : Size.Medium);
|
|
50
|
+
});
|
|
51
|
+
var BottomContainer = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n height: ", ";\n width: ", ";\n display: flex;\n\n .bottom-flex {\n flex: 1;\n }\n"])), function (props) {
|
|
52
|
+
return props.size === Size.Small ? '64px' : props.size === Size.Large ? '88px' : '72px';
|
|
53
|
+
}, function (props) {
|
|
54
|
+
return props.size === Size.Small ? '344px' : props.size === Size.Large ? '624px' : '464px';
|
|
55
|
+
});
|
|
56
|
+
var TextContainer = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n margin: ", ";\n flex-grow: 1;\n"])), function (props) {
|
|
57
|
+
return renderMargins(props.note, props.size);
|
|
58
|
+
});
|
|
59
|
+
var NoteContainer = styled.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n ", "\n"])), function (props) {
|
|
60
|
+
return props.size === Size.Small ? ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600) : props.size === Size.Large ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.neutral_600) : ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600);
|
|
61
|
+
});
|
|
62
|
+
var LabelContainer = styled.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n ", "\n"])), function (props) {
|
|
63
|
+
return props.size === Size.Small ? ComponentSStyling(ComponentTextStyle.Bold, null) : props.size === Size.Large ? ComponentLStyling(ComponentTextStyle.Bold, null) : ComponentMStyling(ComponentTextStyle.Bold, null);
|
|
64
|
+
});
|
|
65
|
+
var CloseButtonContainer = styled.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n margin: ", ";\n"])), function (props) {
|
|
66
|
+
return props.size === Size.Small ? '4px 16px 4px 0' : props.size === Size.Large ? '12px 24px 12px 0' : '8px 20px 8px 0';
|
|
67
|
+
});
|
|
68
|
+
var TextButtonContainer = styled.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n margin: ", ";\n"])), function (props) {
|
|
69
|
+
return props.size === Size.Small ? '8px 0 8px 16px' : props.size === Size.Large ? '16px 0 16px 24px' : '12px 0 12px 20px';
|
|
70
|
+
});
|
|
71
|
+
var IconButtonContainer = styled.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n margin: ", ";\n display: flex;\n"])), function (props) {
|
|
72
|
+
return props.size === Size.Small ? '8px 16px 8px 0' : props.size === Size.Large ? '16px 24px 16px 0' : '12px 20px 12px 0';
|
|
73
|
+
});
|
|
74
|
+
var Wrapper = styled.div(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n position: relative;\n\n .pointer-space {\n height: ", ";\n width: ", ";\n position: absolute;\n\n ", ";\n ", ";\n\n ", ";\n ", ";\n }\n\n ", "\n"])), function (props) {
|
|
75
|
+
return props.position === 'top' || props.position === 'bottom' ? '8px' : '100%';
|
|
76
|
+
}, function (props) {
|
|
77
|
+
return props.position === 'left' || props.position === 'right' ? '8px' : '100%';
|
|
78
|
+
}, function (props) {
|
|
79
|
+
return props.position === 'left' ? 'right:100%; bottom: 0%' : '';
|
|
80
|
+
}, function (props) {
|
|
81
|
+
return props.position === 'right' ? 'left:100%; bottom: 0%' : '';
|
|
82
|
+
}, function (props) {
|
|
83
|
+
return props.position === 'top' ? 'bottom: 100%' : '';
|
|
84
|
+
}, function (props) {
|
|
85
|
+
return props.position === 'bottom' ? 'top: 100%' : '';
|
|
86
|
+
}, function (props) {
|
|
87
|
+
return props.showOnClick ? "".concat(Container, " {\n visibility: ").concat(props.showPopover ? 'visible' : 'hidden', ";\n opacity: ").concat(props.showPopover ? '1' : '0', ";\n }\n cursor: pointer;") : "&:hover {\n ".concat(Container, " {\n visibility: visible;\n opacity: 1;\n }\n }");
|
|
88
|
+
});
|
|
89
|
+
|
|
90
|
+
var renderMargins = function renderMargins(isNotePresent, size) {
|
|
91
|
+
if (isNotePresent) {
|
|
92
|
+
return size === Size.Small ? '10px 16px' : size === Size.Large ? '14px 24px' : '12px 20px';
|
|
93
|
+
} else {
|
|
94
|
+
return size === Size.Small ? '18px 16px' : size === Size.Large ? '24px' : '20px';
|
|
95
|
+
}
|
|
96
|
+
};
|
|
97
|
+
|
|
98
|
+
var Popover = function Popover(_ref) {
|
|
99
|
+
var _bottomSectionProps$t, _bottomSectionProps$i;
|
|
100
|
+
|
|
101
|
+
var _ref$size = _ref.size,
|
|
102
|
+
size = _ref$size === void 0 ? Size.Medium : _ref$size,
|
|
103
|
+
topSectionProps = _ref.topSectionProps,
|
|
104
|
+
bottomSectionProps = _ref.bottomSectionProps,
|
|
105
|
+
mainContent = _ref.mainContent,
|
|
106
|
+
children = _ref.children,
|
|
107
|
+
position = _ref.position,
|
|
108
|
+
_ref$showOnClick = _ref.showOnClick,
|
|
109
|
+
showOnClick = _ref$showOnClick === void 0 ? false : _ref$showOnClick;
|
|
110
|
+
|
|
111
|
+
var _React$useState = React.useState(false),
|
|
112
|
+
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
113
|
+
showPopover = _React$useState2[0],
|
|
114
|
+
setShowPopover = _React$useState2[1];
|
|
115
|
+
|
|
116
|
+
return /*#__PURE__*/_jsxs(Wrapper, {
|
|
117
|
+
position: position,
|
|
118
|
+
showOnClick: showOnClick,
|
|
119
|
+
showPopover: showPopover,
|
|
120
|
+
children: [/*#__PURE__*/_jsxs(Container, {
|
|
121
|
+
size: size,
|
|
122
|
+
position: position,
|
|
123
|
+
children: [!!topSectionProps && /*#__PURE__*/_jsxs(TopContainer, {
|
|
124
|
+
size: size,
|
|
125
|
+
children: [/*#__PURE__*/_jsxs(TextContainer, {
|
|
126
|
+
note: !!(topSectionProps !== null && topSectionProps !== void 0 && topSectionProps.note),
|
|
127
|
+
size: size,
|
|
128
|
+
children: [(topSectionProps === null || topSectionProps === void 0 ? void 0 : topSectionProps.note) && /*#__PURE__*/_jsx(NoteContainer, {
|
|
129
|
+
size: size,
|
|
130
|
+
children: topSectionProps.note
|
|
131
|
+
}), /*#__PURE__*/_jsx(LabelContainer, {
|
|
132
|
+
size: size,
|
|
133
|
+
children: topSectionProps === null || topSectionProps === void 0 ? void 0 : topSectionProps.text
|
|
134
|
+
})]
|
|
135
|
+
}), showOnClick && /*#__PURE__*/_jsx(CloseButtonContainer, {
|
|
136
|
+
size: size,
|
|
137
|
+
"data-testid": 'closeBtn',
|
|
138
|
+
children: /*#__PURE__*/_jsx(IconButton, {
|
|
139
|
+
action: function action() {
|
|
140
|
+
return setShowPopover(false);
|
|
141
|
+
},
|
|
142
|
+
useTransparentBackground: true,
|
|
143
|
+
iconColor: COLORS.neutral_600,
|
|
144
|
+
variant: "secondary",
|
|
145
|
+
shape: "circular",
|
|
146
|
+
children: /*#__PURE__*/_jsx(SystemIcons.Close, {})
|
|
147
|
+
})
|
|
148
|
+
})]
|
|
149
|
+
}), /*#__PURE__*/_jsx(MiddleContainer, {
|
|
150
|
+
size: size,
|
|
151
|
+
children: mainContent
|
|
152
|
+
}), !!bottomSectionProps && /*#__PURE__*/_jsxs(BottomContainer, {
|
|
153
|
+
size: size,
|
|
154
|
+
children: [!!(bottomSectionProps !== null && bottomSectionProps !== void 0 && (_bottomSectionProps$t = bottomSectionProps.textButton) !== null && _bottomSectionProps$t !== void 0 && _bottomSectionProps$t.icon) && /*#__PURE__*/_jsx(TextButtonContainer, {
|
|
155
|
+
size: size,
|
|
156
|
+
"data-testid": 'textBtn',
|
|
157
|
+
children: /*#__PURE__*/_jsx(Button, {
|
|
158
|
+
size: size,
|
|
159
|
+
variant: "secondary",
|
|
160
|
+
icon: bottomSectionProps.textButton.icon,
|
|
161
|
+
onClick: bottomSectionProps.textButton.action,
|
|
162
|
+
children: bottomSectionProps.textButton.label
|
|
163
|
+
})
|
|
164
|
+
}), /*#__PURE__*/_jsx("div", {
|
|
165
|
+
className: "bottom-flex"
|
|
166
|
+
}), /*#__PURE__*/_jsx(IconButtonContainer, {
|
|
167
|
+
size: size,
|
|
168
|
+
"data-testid": 'iconBtn',
|
|
169
|
+
children: bottomSectionProps === null || bottomSectionProps === void 0 ? void 0 : (_bottomSectionProps$i = bottomSectionProps.iconButtons) === null || _bottomSectionProps$i === void 0 ? void 0 : _bottomSectionProps$i.map(function (iconButton) {
|
|
170
|
+
return /*#__PURE__*/_jsx(IconButton, {
|
|
171
|
+
action: iconButton.action,
|
|
172
|
+
variant: "secondary",
|
|
173
|
+
shape: "circular",
|
|
174
|
+
useTransparentBackground: true,
|
|
175
|
+
children: iconButton.icon
|
|
176
|
+
});
|
|
177
|
+
})
|
|
178
|
+
})]
|
|
179
|
+
})]
|
|
180
|
+
}), /*#__PURE__*/_jsxs("div", {
|
|
181
|
+
onClick: function onClick() {
|
|
182
|
+
return showOnClick && setShowPopover(!showPopover);
|
|
183
|
+
},
|
|
184
|
+
children: [children, /*#__PURE__*/_jsx("div", {
|
|
185
|
+
className: "pointer-space"
|
|
186
|
+
})]
|
|
187
|
+
})]
|
|
188
|
+
});
|
|
189
|
+
};
|
|
190
|
+
|
|
191
|
+
Popover.propTypes = {
|
|
192
|
+
topSectionProps: _pt.shape({
|
|
193
|
+
text: _pt.string.isRequired,
|
|
194
|
+
note: _pt.string
|
|
195
|
+
}),
|
|
196
|
+
bottomSectionProps: _pt.shape({
|
|
197
|
+
iconButtons: _pt.arrayOf(_pt.shape({
|
|
198
|
+
icon: _pt.node.isRequired,
|
|
199
|
+
action: _pt.func.isRequired,
|
|
200
|
+
label: _pt.string
|
|
201
|
+
})),
|
|
202
|
+
textButton: _pt.shape({
|
|
203
|
+
icon: _pt.node.isRequired,
|
|
204
|
+
action: _pt.func.isRequired,
|
|
205
|
+
label: _pt.string
|
|
206
|
+
})
|
|
207
|
+
}),
|
|
208
|
+
mainContent: _pt.node.isRequired,
|
|
209
|
+
children: _pt.node.isRequired,
|
|
210
|
+
position: _pt.oneOf(['top', 'bottom', 'right', 'left']).isRequired,
|
|
211
|
+
showOnClick: _pt.bool.isRequired
|
|
212
|
+
};
|
|
213
|
+
export default Popover;
|
|
214
|
+
//# sourceMappingURL=Popover.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Popover/Popover.tsx"],"names":["React","styled","COLORS","ComponentTextStyle","ComponentXSStyling","Button","IconButton","SystemIcons","BOXSHADOWS","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentXXSStyling","scrollBarStyling","Z_INDEXES","Size","Container","div","props","size","Small","Large","white","BOXSHADOW_CENTERED","popover","position","TopContainer","MiddleContainer","Medium","BottomContainer","TextContainer","renderMargins","note","NoteContainer","Regular","neutral_600","LabelContainer","Bold","CloseButtonContainer","TextButtonContainer","IconButtonContainer","Wrapper","showOnClick","showPopover","isNotePresent","Popover","topSectionProps","bottomSectionProps","mainContent","children","useState","setShowPopover","text","textButton","icon","action","label","iconButtons","map","iconButton"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { COLORS, ComponentTextStyle, ComponentXSStyling } from '..';\nimport { Button, IconButton } from '../Button';\nimport { SystemIcons } from '../icons';\nimport { BOXSHADOWS, ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentXXSStyling, scrollBarStyling, Z_INDEXES } from '../styles';\nimport { Size } from '../types';\n\nconst Container = styled.div<{size: Size, position: string}>`\n height: ${props=>props.size===Size.Small ? '240px' : (props.size===Size.Large ? '480px' : '360px')};\n width: ${props=>props.size===Size.Small ? '344px' : (props.size===Size.Large ? '624px' : '464px')};\n border-radius: 4px;\n background: ${COLORS.white};\n cursor: default;\n box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\n\n position: absolute; \n visibility: hidden;\n opacity: 0;\n z-index: ${Z_INDEXES.popover};\n\n ${props => (props.position == 'bottom' ? 'right: 50%; top: calc(100% + 8px); transform: translateX(50%);' : '')}\n ${props => (props.position == 'top' ? 'right: 50%; bottom: calc(100% + 8px); transform: translateX(50%);' : '')}\n\n ${props => (props.position == 'left' ? 'bottom: 50%; right: calc(100% + 8px); transform: translateY(50%);' : '')}\n ${props => (props.position == 'right' ? 'bottom: 50%; left: calc(100% + 8px); transform: translateY(50%);' : '')}\n\n &::after {\n height: 16px;\n width: 16px;\n content: \"\";\n position: absolute;\n background: ${COLORS.white};\n\n ${props => (props.position == 'bottom' ? 'right: 50%; bottom: 100%; transform: translateY(50%) rotate(45deg);' : '')}\n ${props => (props.position == 'top' ? 'right: 50%; top: 100%; transform: translateY(-50%) rotate(45deg);' : '')}\n\n ${props => (props.position == 'left' ? 'bottom: 50%; left: 100%; transform: translateX(-50%) rotate(45deg);' : '')}\n ${props => (props.position == 'right' ? 'bottom: 50%; right: 100%; transform: translateX(50%) rotate(45deg);' : '')}\n`;\n\nconst TopContainer = styled.div<{size: Size}>`\n height: ${props=>props.size===Size.Small ? '56px' : (props.size===Size.Large ? '72px' : '64px')};\n width: ${props=>props.size===Size.Small ? '344px' : (props.size===Size.Large ? '624px' : '464px')};\n display: flex;\n`;\n\nconst MiddleContainer = styled.div<{size: Size}>`\n height: ${props=>props.size===Size.Small ? '104px' : (props.size===Size.Large ? '304px' : '208px')};\n width: ${props=>props.size===Size.Small ? '312px' : (props.size===Size.Large ? '576px' : '424px')};\n padding: ${props=>props.size===Size.Small ? '8px 16px' : (props.size===Size.Large ? '8px 24px' : '8px 20px')};\n overflow-y: auto;\n ${props=>scrollBarStyling(props.size===Size.Small?Size.Small:Size.Medium)}\n`;\n\nconst BottomContainer = styled.div<{size: Size}>`\n height: ${props=>props.size===Size.Small ? '64px' : (props.size===Size.Large ? '88px' : '72px')};\n width: ${props=>props.size===Size.Small ? '344px' : (props.size===Size.Large ? '624px' : '464px')};\n display: flex;\n\n .bottom-flex {\n flex: 1;\n }\n`;\n\nconst TextContainer = styled.div<{note: boolean, size: Size}>`\n display: flex;\n flex-direction: column;\n margin: ${props=>renderMargins(props.note, props.size)};\n flex-grow: 1;\n`;\n\nconst NoteContainer = styled.div<{size: Size}>`\n ${props=>props.size===Size.Small ? ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600) : (props.size===Size.Large ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.neutral_600) : ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600))}\n`;\n\nconst LabelContainer = styled.div<{size: Size}>`\n ${props=>props.size===Size.Small ? ComponentSStyling(ComponentTextStyle.Bold, null) : (props.size===Size.Large ? ComponentLStyling(ComponentTextStyle.Bold, null) : ComponentMStyling(ComponentTextStyle.Bold, null))}\n`;\n\nconst CloseButtonContainer = styled.div<{size: Size}>`\n margin: ${props=>props.size===Size.Small ? '4px 16px 4px 0' : (props.size===Size.Large ? '12px 24px 12px 0' : '8px 20px 8px 0')};\n`;\n\nconst TextButtonContainer = styled.div<{size: Size}>`\n margin: ${props=>props.size===Size.Small ? '8px 0 8px 16px' : (props.size===Size.Large ? '16px 0 16px 24px' : '12px 0 12px 20px')};\n`;\n\nconst IconButtonContainer = styled.div<{size: Size}>`\n margin: ${props=>props.size===Size.Small ? '8px 16px 8px 0' : (props.size===Size.Large ? '16px 24px 16px 0' : '12px 20px 12px 0')};\n display: flex;\n`;\n\nconst Wrapper = styled.div<{position: string, showOnClick: boolean, showPopover: boolean}>`\n position: relative;\n\n .pointer-space {\n height: ${props=>props.position==='top' || props.position==='bottom' ? '8px' : '100%'};\n width: ${props=>props.position==='left' || props.position==='right' ? '8px' : '100%'};\n position: absolute;\n\n ${props=>props.position==='left' ? 'right:100%; bottom: 0%' : ''};\n ${props=>props.position==='right' ? 'left:100%; bottom: 0%' : ''};\n\n ${props=>props.position==='top' ? 'bottom: 100%' : ''};\n ${props=>props.position==='bottom' ? 'top: 100%' : ''};\n }\n\n ${props=>props.showOnClick ? \n `${Container} {\n visibility: ${props.showPopover ? 'visible' : 'hidden'};\n opacity: ${props.showPopover ? '1' : '0'};\n }\n cursor: pointer;` \n : \n `&:hover {\n ${Container} {\n visibility: visible;\n opacity: 1;\n }\n }`\n }\n`;\n\nconst renderMargins = (isNotePresent: boolean, size: Size): string => {\n if(isNotePresent){\n return (size===Size.Small ? '10px 16px' : (size===Size.Large ? '14px 24px' : '12px 20px'));\n }\n else{\n return (size===Size.Small ? '18px 16px' : (size===Size.Large ? '24px' : '20px'));\n }\n}\n\ntype topSectionProps = {\n text: string;\n note?: string;\n}\n\ntype actionButtonProps = {\n icon: React.ReactNode;\n action: ()=>void;\n label?: string;\n}\n\ntype bottomSectionProps = {\n iconButtons?: actionButtonProps[];\n textButton?: actionButtonProps;\n}\n\ntype PopoverProps = {\n size?: Size.Small | Size.Medium | Size.Large;\n topSectionProps?: topSectionProps;\n bottomSectionProps?: bottomSectionProps;\n mainContent: React.ReactNode;\n children: React.ReactNode;\n position: 'top' | 'bottom' | 'right' | 'left';\n showOnClick: boolean;\n}\n\nconst Popover: React.FunctionComponent<PopoverProps> = \n({\n size=Size.Medium,\n topSectionProps,\n bottomSectionProps,\n mainContent,\n children,\n position,\n showOnClick=false\n}) => {\n\n const [showPopover, setShowPopover] = React.useState(false);\n\n return (\n <Wrapper position={position} showOnClick={showOnClick} showPopover={showPopover}>\n <Container size={size} position={position}>\n {!!topSectionProps && \n <TopContainer size={size}>\n <TextContainer note={!!topSectionProps?.note} size={size}>\n {topSectionProps?.note && \n <NoteContainer size={size}>\n {topSectionProps.note}\n </NoteContainer>\n }\n <LabelContainer size={size}>\n {topSectionProps?.text}\n </LabelContainer>\n </TextContainer>\n\n {showOnClick && \n <CloseButtonContainer size={size} data-testid={'closeBtn'}>\n <IconButton action={()=>setShowPopover(false)} useTransparentBackground iconColor={COLORS.neutral_600} variant='secondary' shape='circular'>\n <SystemIcons.Close />\n </IconButton>\n </CloseButtonContainer>\n }\n </TopContainer>\n }\n\n <MiddleContainer size={size}>\n {mainContent}\n </MiddleContainer>\n\n {!!bottomSectionProps && \n <BottomContainer size={size}>\n {!!bottomSectionProps?.textButton?.icon && \n <TextButtonContainer size={size} data-testid={'textBtn'}>\n <Button size={size} variant='secondary' icon={bottomSectionProps.textButton.icon} onClick={bottomSectionProps.textButton.action}>\n {bottomSectionProps.textButton.label}\n </Button>\n </TextButtonContainer>\n }\n\n <div className='bottom-flex'/>\n \n <IconButtonContainer size={size} data-testid={'iconBtn'}>\n {bottomSectionProps?.iconButtons?.map((iconButton) =>\n \n <IconButton action={iconButton.action} variant='secondary' shape='circular' useTransparentBackground>\n {iconButton.icon}\n </IconButton> \n )}\n </IconButtonContainer>\n </BottomContainer>\n }\n </Container>\n\n <div onClick={()=>showOnClick && setShowPopover(!showPopover)}>\n {children}\n\n <div className='pointer-space'/>\n </div>\n\n </Wrapper>\n );\n};\n\nexport default Popover;"],"file":"Popover.js"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
Object.defineProperty(exports, "Popover", {
|
|
9
|
+
enumerable: true,
|
|
10
|
+
get: function get() {
|
|
11
|
+
return _Popover.default;
|
|
12
|
+
}
|
|
13
|
+
});
|
|
14
|
+
|
|
15
|
+
var _Popover = _interopRequireDefault(require("./Popover"));
|
|
16
|
+
//# sourceMappingURL=index.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Popover/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;AAAA","sourcesContent":["export { default as Popover } from './Popover';"],"file":"index.cjs"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default as Popover } from './Popover';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Popover/index.ts"],"names":["default","Popover"],"mappings":"AAAA,SAASA,OAAO,IAAIC,OAApB,QAAmC,WAAnC","sourcesContent":["export { default as Popover } from './Popover';"],"file":"index.js"}
|
package/dist/index.cjs
CHANGED
|
@@ -560,4 +560,18 @@ Object.keys(_Tile).forEach(function (key) {
|
|
|
560
560
|
});
|
|
561
561
|
|
|
562
562
|
var _assets = require("./assets");
|
|
563
|
+
|
|
564
|
+
var _Popover = require("./Popover");
|
|
565
|
+
|
|
566
|
+
Object.keys(_Popover).forEach(function (key) {
|
|
567
|
+
if (key === "default" || key === "__esModule") return;
|
|
568
|
+
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
569
|
+
if (key in exports && exports[key] === _Popover[key]) return;
|
|
570
|
+
Object.defineProperty(exports, key, {
|
|
571
|
+
enumerable: true,
|
|
572
|
+
get: function get() {
|
|
573
|
+
return _Popover[key];
|
|
574
|
+
}
|
|
575
|
+
});
|
|
576
|
+
});
|
|
563
577
|
//# sourceMappingURL=index.cjs.map
|
package/dist/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA","sourcesContent":["export * from './styles';\nexport * from './icons';\nexport * from './types';\nexport * from './AuthPage';\nexport * from './Button';\nexport * from './Breadcrumb';\nexport * from './Chips';\nexport * from './SkipToContent';\nexport * from './Footer';\nexport * from './LoadingIndicator';\nexport * from './MiniProductCard';\nexport * from './NavItem';\nexport * from './Layouts';\nexport * from './GlobalNavigationBar';\nexport * from './Tabs';\nexport * from './Banners';\nexport * from './Toasters';\nexport * from './InputFields';\nexport * from './Dropdown';\nexport * from './Switcher';\nexport * from './LoadingPage';\nexport * from './List';\nexport * from './Modals';\nexport * from './Paginator';\nexport * from './Table';\nexport * from './Toggles';\nexport * from './HyperLink';\nexport * from './NotificationDot';\nexport * from './Accordion';\nexport * from './Tooltips';\nexport * from './common';\nexport * from './QuizButton';\nexport * from './LinearProgress';\nexport * from './SegmentControl';\nexport * from './Card';\nexport * from './Tag';\nexport * from './Image';\nexport * from './ChipsInput';\nexport * from './Tile';\nexport {LaerdalLogo} from './assets';\
|
|
1
|
+
{"version":3,"sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["export * from './styles';\nexport * from './icons';\nexport * from './types';\nexport * from './AuthPage';\nexport * from './Button';\nexport * from './Breadcrumb';\nexport * from './Chips';\nexport * from './SkipToContent';\nexport * from './Footer';\nexport * from './LoadingIndicator';\nexport * from './MiniProductCard';\nexport * from './NavItem';\nexport * from './Layouts';\nexport * from './GlobalNavigationBar';\nexport * from './Tabs';\nexport * from './Banners';\nexport * from './Toasters';\nexport * from './InputFields';\nexport * from './Dropdown';\nexport * from './Switcher';\nexport * from './LoadingPage';\nexport * from './List';\nexport * from './Modals';\nexport * from './Paginator';\nexport * from './Table';\nexport * from './Toggles';\nexport * from './HyperLink';\nexport * from './NotificationDot';\nexport * from './Accordion';\nexport * from './Tooltips';\nexport * from './common';\nexport * from './QuizButton';\nexport * from './LinearProgress';\nexport * from './SegmentControl';\nexport * from './Card';\nexport * from './Tag';\nexport * from './Image';\nexport * from './ChipsInput';\nexport * from './Tile';\nexport {LaerdalLogo} from './assets';\nexport * from './Popover';"],"file":"index.cjs"}
|
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts"],"names":["LaerdalLogo"],"mappings":"AAAA,cAAc,UAAd;AACA,cAAc,SAAd;AACA,cAAc,SAAd;AACA,cAAc,YAAd;AACA,cAAc,UAAd;AACA,cAAc,cAAd;AACA,cAAc,SAAd;AACA,cAAc,iBAAd;AACA,cAAc,UAAd;AACA,cAAc,oBAAd;AACA,cAAc,mBAAd;AACA,cAAc,WAAd;AACA,cAAc,WAAd;AACA,cAAc,uBAAd;AACA,cAAc,QAAd;AACA,cAAc,WAAd;AACA,cAAc,YAAd;AACA,cAAc,eAAd;AACA,cAAc,YAAd;AACA,cAAc,YAAd;AACA,cAAc,eAAd;AACA,cAAc,QAAd;AACA,cAAc,UAAd;AACA,cAAc,aAAd;AACA,cAAc,SAAd;AACA,cAAc,WAAd;AACA,cAAc,aAAd;AACA,cAAc,mBAAd;AACA,cAAc,aAAd;AACA,cAAc,YAAd;AACA,cAAc,UAAd;AACA,cAAc,cAAd;AACA,cAAc,kBAAd;AACA,cAAc,kBAAd;AACA,cAAc,QAAd;AACA,cAAc,OAAd;AACA,cAAc,SAAd;AACA,cAAc,cAAd;AACA,cAAc,QAAd;AACA,SAAQA,WAAR,QAA0B,UAA1B","sourcesContent":["export * from './styles';\nexport * from './icons';\nexport * from './types';\nexport * from './AuthPage';\nexport * from './Button';\nexport * from './Breadcrumb';\nexport * from './Chips';\nexport * from './SkipToContent';\nexport * from './Footer';\nexport * from './LoadingIndicator';\nexport * from './MiniProductCard';\nexport * from './NavItem';\nexport * from './Layouts';\nexport * from './GlobalNavigationBar';\nexport * from './Tabs';\nexport * from './Banners';\nexport * from './Toasters';\nexport * from './InputFields';\nexport * from './Dropdown';\nexport * from './Switcher';\nexport * from './LoadingPage';\nexport * from './List';\nexport * from './Modals';\nexport * from './Paginator';\nexport * from './Table';\nexport * from './Toggles';\nexport * from './HyperLink';\nexport * from './NotificationDot';\nexport * from './Accordion';\nexport * from './Tooltips';\nexport * from './common';\nexport * from './QuizButton';\nexport * from './LinearProgress';\nexport * from './SegmentControl';\nexport * from './Card';\nexport * from './Tag';\nexport * from './Image';\nexport * from './ChipsInput';\nexport * from './Tile';\nexport {LaerdalLogo} from './assets';\
|
|
1
|
+
{"version":3,"sources":["../src/index.ts"],"names":["LaerdalLogo"],"mappings":"AAAA,cAAc,UAAd;AACA,cAAc,SAAd;AACA,cAAc,SAAd;AACA,cAAc,YAAd;AACA,cAAc,UAAd;AACA,cAAc,cAAd;AACA,cAAc,SAAd;AACA,cAAc,iBAAd;AACA,cAAc,UAAd;AACA,cAAc,oBAAd;AACA,cAAc,mBAAd;AACA,cAAc,WAAd;AACA,cAAc,WAAd;AACA,cAAc,uBAAd;AACA,cAAc,QAAd;AACA,cAAc,WAAd;AACA,cAAc,YAAd;AACA,cAAc,eAAd;AACA,cAAc,YAAd;AACA,cAAc,YAAd;AACA,cAAc,eAAd;AACA,cAAc,QAAd;AACA,cAAc,UAAd;AACA,cAAc,aAAd;AACA,cAAc,SAAd;AACA,cAAc,WAAd;AACA,cAAc,aAAd;AACA,cAAc,mBAAd;AACA,cAAc,aAAd;AACA,cAAc,YAAd;AACA,cAAc,UAAd;AACA,cAAc,cAAd;AACA,cAAc,kBAAd;AACA,cAAc,kBAAd;AACA,cAAc,QAAd;AACA,cAAc,OAAd;AACA,cAAc,SAAd;AACA,cAAc,cAAd;AACA,cAAc,QAAd;AACA,SAAQA,WAAR,QAA0B,UAA1B;AACA,cAAc,WAAd","sourcesContent":["export * from './styles';\nexport * from './icons';\nexport * from './types';\nexport * from './AuthPage';\nexport * from './Button';\nexport * from './Breadcrumb';\nexport * from './Chips';\nexport * from './SkipToContent';\nexport * from './Footer';\nexport * from './LoadingIndicator';\nexport * from './MiniProductCard';\nexport * from './NavItem';\nexport * from './Layouts';\nexport * from './GlobalNavigationBar';\nexport * from './Tabs';\nexport * from './Banners';\nexport * from './Toasters';\nexport * from './InputFields';\nexport * from './Dropdown';\nexport * from './Switcher';\nexport * from './LoadingPage';\nexport * from './List';\nexport * from './Modals';\nexport * from './Paginator';\nexport * from './Table';\nexport * from './Toggles';\nexport * from './HyperLink';\nexport * from './NotificationDot';\nexport * from './Accordion';\nexport * from './Tooltips';\nexport * from './common';\nexport * from './QuizButton';\nexport * from './LinearProgress';\nexport * from './SegmentControl';\nexport * from './Card';\nexport * from './Tag';\nexport * from './Image';\nexport * from './ChipsInput';\nexport * from './Tile';\nexport {LaerdalLogo} from './assets';\nexport * from './Popover';"],"file":"index.js"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/styles/z-indexes.ts"],"names":["Z_INDEXES","hover","active","focus","badge","dropdown","sticky_menu","fixed_menu","backdrop","off_canvas","modal","toast","tooltip"],"mappings":";;;;;;AAAO,IAAMA,SAAS,GAAG;AACvBC,EAAAA,KAAK,EAAE,GADgB;AAEvBC,EAAAA,MAAM,EAAE,GAFe;AAGvBC,EAAAA,KAAK,EAAE,GAHgB;AAKvBC,EAAAA,KAAK,EAAE,IALgB;AAQvBC,EAAAA,QAAQ,EAAE,MARa;AASvBC,EAAAA,WAAW,EAAE,MATU;AAUvBC,EAAAA,UAAU,EAAE,MAVW;AAWvBC,EAAAA,QAAQ,EAAE,MAXa;AAYvBC,EAAAA,UAAU,EAAE,MAZW;AAavBC,EAAAA,KAAK,EAAE,MAbgB;AAcvBC,EAAAA,KAAK,EAAE,MAdgB;AAevBC,EAAAA,OAAO,EAAE;
|
|
1
|
+
{"version":3,"sources":["../../src/styles/z-indexes.ts"],"names":["Z_INDEXES","hover","active","focus","badge","dropdown","sticky_menu","fixed_menu","backdrop","off_canvas","modal","toast","tooltip","popover"],"mappings":";;;;;;AAAO,IAAMA,SAAS,GAAG;AACvBC,EAAAA,KAAK,EAAE,GADgB;AAEvBC,EAAAA,MAAM,EAAE,GAFe;AAGvBC,EAAAA,KAAK,EAAE,GAHgB;AAKvBC,EAAAA,KAAK,EAAE,IALgB;AAQvBC,EAAAA,QAAQ,EAAE,MARa;AASvBC,EAAAA,WAAW,EAAE,MATU;AAUvBC,EAAAA,UAAU,EAAE,MAVW;AAWvBC,EAAAA,QAAQ,EAAE,MAXa;AAYvBC,EAAAA,UAAU,EAAE,MAZW;AAavBC,EAAAA,KAAK,EAAE,MAbgB;AAcvBC,EAAAA,KAAK,EAAE,MAdgB;AAevBC,EAAAA,OAAO,EAAE,MAfc;AAgBvBC,EAAAA,OAAO,EAAE;AAhBc,CAAlB","sourcesContent":["export const Z_INDEXES = {\n hover: '1',\n active: '2',\n focus: '3',\n\n badge: '10',\n\n\n dropdown: '1000',\n sticky_menu: '1020',\n fixed_menu: '1030',\n backdrop: '1040',\n off_canvas: '1050',\n modal: '1060',\n toast: '1070',\n tooltip: '1080',\n popover: '1070'\n}\n"],"file":"z-indexes.cjs"}
|
package/dist/styles/z-indexes.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/styles/z-indexes.ts"],"names":["Z_INDEXES","hover","active","focus","badge","dropdown","sticky_menu","fixed_menu","backdrop","off_canvas","modal","toast","tooltip"],"mappings":"AAAA,OAAO,IAAMA,SAAS,GAAG;AACvBC,EAAAA,KAAK,EAAE,GADgB;AAEvBC,EAAAA,MAAM,EAAE,GAFe;AAGvBC,EAAAA,KAAK,EAAE,GAHgB;AAKvBC,EAAAA,KAAK,EAAE,IALgB;AAQvBC,EAAAA,QAAQ,EAAE,MARa;AASvBC,EAAAA,WAAW,EAAE,MATU;AAUvBC,EAAAA,UAAU,EAAE,MAVW;AAWvBC,EAAAA,QAAQ,EAAE,MAXa;AAYvBC,EAAAA,UAAU,EAAE,MAZW;AAavBC,EAAAA,KAAK,EAAE,MAbgB;AAcvBC,EAAAA,KAAK,EAAE,MAdgB;AAevBC,EAAAA,OAAO,EAAE;
|
|
1
|
+
{"version":3,"sources":["../../src/styles/z-indexes.ts"],"names":["Z_INDEXES","hover","active","focus","badge","dropdown","sticky_menu","fixed_menu","backdrop","off_canvas","modal","toast","tooltip","popover"],"mappings":"AAAA,OAAO,IAAMA,SAAS,GAAG;AACvBC,EAAAA,KAAK,EAAE,GADgB;AAEvBC,EAAAA,MAAM,EAAE,GAFe;AAGvBC,EAAAA,KAAK,EAAE,GAHgB;AAKvBC,EAAAA,KAAK,EAAE,IALgB;AAQvBC,EAAAA,QAAQ,EAAE,MARa;AASvBC,EAAAA,WAAW,EAAE,MATU;AAUvBC,EAAAA,UAAU,EAAE,MAVW;AAWvBC,EAAAA,QAAQ,EAAE,MAXa;AAYvBC,EAAAA,UAAU,EAAE,MAZW;AAavBC,EAAAA,KAAK,EAAE,MAbgB;AAcvBC,EAAAA,KAAK,EAAE,MAdgB;AAevBC,EAAAA,OAAO,EAAE,MAfc;AAgBvBC,EAAAA,OAAO,EAAE;AAhBc,CAAlB","sourcesContent":["export const Z_INDEXES = {\n hover: '1',\n active: '2',\n focus: '3',\n\n badge: '10',\n\n\n dropdown: '1000',\n sticky_menu: '1020',\n fixed_menu: '1030',\n backdrop: '1040',\n off_canvas: '1050',\n modal: '1060',\n toast: '1070',\n tooltip: '1080',\n popover: '1070'\n}\n"],"file":"z-indexes.js"}
|