@cashub/ui 0.48.6 → 0.48.8
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/Tab/TabList.js +26 -38
- package/Tab/TabPanel.js +20 -13
- package/Tab/TabTab.js +24 -36
- package/Tab/index.js +6 -3
- package/Tab/subComponent/TabListV2.js +18 -11
- package/Tab/subComponent/TabPanelV2.js +20 -16
- package/Tab/subComponent/TabTabV2.js +21 -33
- package/VerticalTab/TabList.js +18 -13
- package/VerticalTab/TabPanel.js +20 -16
- package/VerticalTab/TabTab.js +21 -40
- package/VerticalTab/VerticalTab.js +4 -8
- package/alert/Alert.js +5 -12
- package/animate/Collapse.js +7 -5
- package/animate/Loader.js +7 -18
- package/animate/PulseRing.js +5 -18
- package/animate/Spinner.js +3 -8
- package/backdrop/BaseBackdrop.js +3 -9
- package/backdrop/LoadingBackdrop.js +3 -7
- package/backdrop/ModalBackdrop.js +3 -5
- package/badge/Badge.js +3 -15
- package/badge/BadgeDot.js +3 -8
- package/badge/BadgeFill.js +6 -24
- package/badge/BadgeWithText.js +3 -13
- package/billing/BarChart.js +1 -1
- package/breadcrumb/Breadcrumb.js +3 -42
- package/button/Button.js +20 -88
- package/button/ButtonGroup.js +9 -33
- package/button/IconButton.js +10 -37
- package/button/ScrollToTopButton.js +4 -12
- package/callout/Callout.js +8 -37
- package/chart/BarChart.js +27 -11
- package/chart/DoughnutChart.js +20 -34
- package/chart/LineChart.js +22 -13
- package/chart/SingleBarChart.js +5 -22
- package/chart/utils/centerTextPlugin.js +2 -2
- package/chart/utils/customTooltip.js +8 -8
- package/chart/utils/htmlLegendPlugin.js +1 -1
- package/chart/utils/yAxisTopTitlePlugin.js +1 -1
- package/container/FlexContainer.js +7 -15
- package/cropper/Cropper.js +2 -1
- package/datetimePicker/DatePicker.js +26 -80
- package/datetimePicker/DatePickerV2.js +36 -95
- package/datetimePicker/DatetimePicker.js +11 -174
- package/datetimePicker/DatetimePickerV2.js +33 -87
- package/datetimePicker/DatetimePickerV3.js +11 -174
- package/datetimePicker/TimeInput.js +10 -35
- package/datetimePicker/TimePicker.js +22 -77
- package/datetimePicker/TimePickerStyle.js +3 -53
- package/datetimePicker/TimePickerV2.js +21 -54
- package/datetimePicker/accordion/Month.js +16 -93
- package/datetimePicker/accordion/Year.js +18 -96
- package/datetimePicker/hooks/useChangeNumber.js +6 -3
- package/datetimePicker/hooks/useDecrease.js +6 -3
- package/datetimePicker/hooks/useIncrease.js +6 -3
- package/datetimePicker/subComponent/Accordion.js +20 -101
- package/descriptionList/DescriptionDetail.js +4 -15
- package/descriptionList/DescriptionList.js +4 -12
- package/descriptionList/DescriptionTerm.js +3 -5
- package/divider/Divider.js +6 -15
- package/dropdown/DropdownButtonOption.js +6 -22
- package/dropdown/DropdownContent.js +15 -29
- package/dropdown/DropdownDivOption.js +3 -17
- package/dropdown/DropdownLinkOption.js +3 -14
- package/dropdown/DropdownToggle.js +15 -7
- package/dropzone/FileDropzone.js +22 -121
- package/dropzone/ImageDropzone.js +14 -83
- package/dropzone/subComponent/Message.js +4 -11
- package/figure/IconFigure.js +7 -16
- package/figure/ImageFigure.js +6 -19
- package/file/HiddenFileInput.js +3 -3
- package/form/Checkbox.js +13 -74
- package/form/Fieldset.js +3 -9
- package/form/FormItem.js +5 -10
- package/form/Input.js +7 -40
- package/form/Label.js +10 -34
- package/form/MutedText.js +4 -8
- package/form/PasswordInput.js +13 -20
- package/form/RadioButton.js +8 -55
- package/form/SearchSelect.js +12 -64
- package/form/Searchbox.js +19 -45
- package/form/Slider.js +10 -28
- package/form/SwitchButton.js +14 -48
- package/form/Textarea.js +3 -30
- package/form/TreeView.js +6 -13
- package/grid/Column.js +10 -23
- package/grid/Grid.js +6 -14
- package/heading/Heading1.js +4 -8
- package/heading/Heading2.js +5 -11
- package/heading/Heading3.js +8 -20
- package/iconbox/ApplicationIconBox.js +12 -48
- package/iconbox/IconBox.js +7 -31
- package/iconbox/IconBoxV2.js +8 -33
- package/iconbox/subComponent/IconBoxFigure.js +9 -17
- package/iconbox/subComponent/IconBoxImage.js +8 -21
- package/image/ImageFluid.js +3 -7
- package/image/UploadImage.js +18 -66
- package/jsoneditor/JsonEditor.js +15 -121
- package/keyframe/Pulse.js +3 -13
- package/keyframe/Spin.js +3 -5
- package/layout/Aside.js +5 -30
- package/layout/Backdrop.js +4 -8
- package/layout/Container.js +5 -21
- package/layout/Footer.js +7 -26
- package/link/LinkSpan.js +19 -37
- package/map/GoogleMap.js +7 -3
- package/map/GoogleReverseGeolocation.js +3 -6
- package/map/LeafletMap.js +2 -2
- package/map/subComponent/GoogleMapContainer.js +4 -16
- package/map/subComponent/GoogleMapPopup.js +10 -7
- package/map/subComponent/GoogleMapWrapper.js +15 -8
- package/map/subComponent/LeafletDrawControl.js +7 -9
- package/map/subComponent/LeafletMapContainer.js +4 -159
- package/modal/StateModal.js +28 -49
- package/modal/TitleModal.js +29 -70
- package/package.json +1 -1
- package/page/Disclaimer.js +3 -119
- package/paginate/Paginate.js +12 -54
- package/popover/Popover.js +25 -30
- package/qrcode/QRCode.js +6 -20
- package/qrcode/QRCodeContainter.js +4 -12
- package/ribbon/Ribbon.js +4 -29
- package/section/Section.js +20 -68
- package/section/SectionBody.js +8 -29
- package/section/SectionHeader.js +11 -36
- package/section/SectionToolbar.js +3 -9
- package/section/SectionToolbarItem.js +3 -8
- package/select/InputSelect.js +23 -16
- package/select/Select.js +43 -112
- package/select/subComponent/Checkbox.js +5 -24
- package/select/subComponent/Footer.js +3 -4
- package/select/subComponent/ListBox.js +5 -12
- package/select/subComponent/Option.js +7 -27
- package/select/subComponent/OptionGroup.js +3 -13
- package/select/subComponent/Options.js +5 -18
- package/select/subComponent/SearchBox.js +12 -34
- package/select/subComponent/SelectedMultipleTags.js +3 -21
- package/select/subComponent/SelectedMultipleText.js +4 -20
- package/select/subComponent/SelectedSingle.js +3 -7
- package/styles/GlobalStyle.js +45 -156
- package/styles/mixin/backgroundColor.js +8 -16
- package/styles/mixin/borderColor.js +7 -13
- package/styles/mixin/color.js +7 -13
- package/styles/mixin/colorOnBackground.js +7 -13
- package/styles/mixin/inputPlaceholder.js +3 -20
- package/styles/mixin/media.js +3 -5
- package/styles/mixin/rounded.js +6 -10
- package/styles/mixin/scrollbar.js +3 -13
- package/styles/theme/dark.theme.js +14 -15
- package/styles/theme/light.theme.js +14 -15
- package/styles/theme/white.theme.js +14 -15
- package/table/GridTable.js +33 -71
- package/table/ImageBox.js +5 -15
- package/table/InfiniteGridTable.js +46 -92
- package/table/PermissionTable.js +10 -32
- package/table/SimpleGridTable.js +17 -52
- package/table/Table.js +48 -198
- package/table/__mock__/columns.js +1 -1
- package/table/subComponent/BaseTableHeadCell.js +8 -37
- package/table/subComponent/GridTableFooter.js +4 -10
- package/table/subComponent/GridTableHeadCell.js +4 -6
- package/table/subComponent/Resizer.js +4 -19
- package/table/subComponent/TableFooter.js +6 -15
- package/table/subComponent/TableFooterInfo.js +3 -4
- package/table/subComponent/TableFooterPager.js +6 -19
- package/table/subComponent/TableHeadCell.js +3 -9
- package/table/subComponent/TableSort.js +7 -17
- package/tagify/TagifyStyle.js +3 -49
- package/tagify/Tags.js +21 -37
- package/tagify/templates/getCreateButtonTemplate.js +2 -5
- package/text/Paragraph.js +12 -50
- package/timeline/Timeline.js +17 -94
- package/toast/CustomToastContainer.js +3 -35
- package/toast/MessageContainer.js +4 -22
- package/tooltip/Tooltip.js +19 -47
- package/treeView/TreeViewV2.js +1 -1
- package/treeView/TreeflexStyle.js +3 -38
- package/wizard/Wizard.js +6 -115
|
@@ -11,9 +11,11 @@ var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
|
11
11
|
var _utils = require("@cashub/utils");
|
|
12
12
|
var _scrollbar = _interopRequireDefault(require("../../styles/mixin/scrollbar"));
|
|
13
13
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
14
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
|
|
14
15
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
15
16
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
16
17
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
18
|
+
function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
|
|
17
19
|
const monthArr = [{
|
|
18
20
|
number: '01',
|
|
19
21
|
name: 'Jan'
|
|
@@ -79,7 +81,8 @@ const Accordion = _ref => {
|
|
|
79
81
|
if (type === 'year') {
|
|
80
82
|
return selectedYear ? selectedYear : new Date().getFullYear();
|
|
81
83
|
} else if (type === 'month') {
|
|
82
|
-
|
|
84
|
+
var _monthArr;
|
|
85
|
+
return (_monthArr = monthArr[selectedMonth ? selectedMonth : new Date().getMonth()]) === null || _monthArr === void 0 ? void 0 : _monthArr.name;
|
|
83
86
|
}
|
|
84
87
|
};
|
|
85
88
|
const handleChangeMonth = (0, _react.useCallback)(month => {
|
|
@@ -173,7 +176,7 @@ const Accordion = _ref => {
|
|
|
173
176
|
}
|
|
174
177
|
}, [fixedYear, selectedYear]);
|
|
175
178
|
const scroll = (0, _react.useCallback)(() => {
|
|
176
|
-
if (bodyRef
|
|
179
|
+
if (bodyRef !== null && bodyRef !== void 0 && bodyRef.current && selectedYearRef !== null && selectedYearRef !== void 0 && selectedYearRef.current) {
|
|
177
180
|
const body = bodyRef.current;
|
|
178
181
|
if (body.scrollTop < 200) {
|
|
179
182
|
body.removeEventListener('scroll', scroll);
|
|
@@ -208,7 +211,7 @@ const Accordion = _ref => {
|
|
|
208
211
|
setDisplay(currentDisplayType === type);
|
|
209
212
|
}, [currentDisplayType, type]);
|
|
210
213
|
(0, _react.useEffect)(() => {
|
|
211
|
-
if (display && bodyRef
|
|
214
|
+
if (display && bodyRef !== null && bodyRef !== void 0 && bodyRef.current && currentDisplayType === 'year' && selectedYearRef !== null && selectedYearRef !== void 0 && selectedYearRef.current) {
|
|
212
215
|
bodyRef.current.scrollTo({
|
|
213
216
|
top: selectedYearRef.current.offsetTop - bodyRef.current.offsetTop
|
|
214
217
|
});
|
|
@@ -245,129 +248,45 @@ const Accordion = _ref => {
|
|
|
245
248
|
})]
|
|
246
249
|
});
|
|
247
250
|
};
|
|
248
|
-
const IconButton = _styledComponents.default.button
|
|
249
|
-
width: 36px;
|
|
250
|
-
height: 36px;
|
|
251
|
-
background: var(--color-background1);
|
|
252
|
-
border: none;
|
|
253
|
-
color: var(--font-on-background);
|
|
254
|
-
padding: 0;
|
|
255
|
-
transition: 0.3s;
|
|
256
|
-
|
|
257
|
-
&:hover {
|
|
258
|
-
color: var(--color-primary);
|
|
259
|
-
}
|
|
260
|
-
|
|
261
|
-
${_ref2 => {
|
|
251
|
+
const IconButton = _styledComponents.default.button(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n width: 36px;\n height: 36px;\n background: var(--color-background1);\n border: none;\n color: var(--font-on-background);\n padding: 0;\n transition: 0.3s;\n\n &:hover {\n color: var(--color-primary);\n }\n\n ", "\n\n ", "\n"])), _ref2 => {
|
|
262
252
|
let {
|
|
263
253
|
disabled
|
|
264
254
|
} = _ref2;
|
|
265
|
-
return disabled && (0, _styledComponents.css)
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
&:hover {
|
|
269
|
-
color: var(--font-on-background);
|
|
270
|
-
}
|
|
271
|
-
`;
|
|
272
|
-
}}
|
|
273
|
-
|
|
274
|
-
${_ref3 => {
|
|
255
|
+
return disabled && (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n opacity: 0.5;\n\n &:hover {\n color: var(--font-on-background);\n }\n "])));
|
|
256
|
+
}, _ref3 => {
|
|
275
257
|
let {
|
|
276
258
|
right,
|
|
277
259
|
$display
|
|
278
260
|
} = _ref3;
|
|
279
|
-
return right &&
|
|
280
|
-
|
|
281
|
-
right:
|
|
282
|
-
|
|
283
|
-
transform: rotate(180deg);
|
|
284
|
-
`}
|
|
285
|
-
`;
|
|
286
|
-
}}
|
|
287
|
-
`;
|
|
288
|
-
const Header = _styledComponents.default.div`
|
|
289
|
-
display: flex;
|
|
290
|
-
justify-content: center;
|
|
291
|
-
align-content: center;
|
|
292
|
-
position: relative;
|
|
293
|
-
|
|
294
|
-
> div {
|
|
295
|
-
width: 72px;
|
|
296
|
-
line-height: 36px;
|
|
297
|
-
text-align: center;
|
|
298
|
-
}
|
|
299
|
-
|
|
300
|
-
&::before {
|
|
301
|
-
content: '';
|
|
302
|
-
border-bottom: var(--border-width) solid var(--border-color);
|
|
303
|
-
position: absolute;
|
|
304
|
-
width: 300px;
|
|
305
|
-
bottom: 0;
|
|
306
|
-
z-index: 1;
|
|
307
|
-
right: -16px;
|
|
308
|
-
}
|
|
309
|
-
`;
|
|
310
|
-
const Body = _styledComponents.default.div`
|
|
311
|
-
flex-wrap: wrap;
|
|
312
|
-
height: 0;
|
|
313
|
-
width: 100%;
|
|
314
|
-
display: ${_ref4 => {
|
|
261
|
+
return right && "\n position: absolute;\n right: 0;\n ".concat($display && (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n transform: rotate(180deg);\n "]))), "\n ");
|
|
262
|
+
});
|
|
263
|
+
const Header = _styledComponents.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n display: flex;\n justify-content: center;\n align-content: center;\n position: relative;\n\n > div {\n width: 72px;\n line-height: 36px;\n text-align: center;\n }\n\n &::before {\n content: '';\n border-bottom: var(--border-width) solid var(--border-color);\n position: absolute;\n width: 300px;\n bottom: 0;\n z-index: 1;\n right: -16px;\n }\n"])));
|
|
264
|
+
const Body = _styledComponents.default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n flex-wrap: wrap;\n height: 0;\n width: 100%;\n display: ", ";\n ", "\n\n transition: 0.3s;\n"])), _ref4 => {
|
|
315
265
|
let {
|
|
316
266
|
$display
|
|
317
267
|
} = _ref4;
|
|
318
268
|
return $display ? 'flex' : 'none';
|
|
319
|
-
}
|
|
320
|
-
${_ref5 => {
|
|
269
|
+
}, _ref5 => {
|
|
321
270
|
let {
|
|
322
271
|
type,
|
|
323
272
|
fixedYear
|
|
324
273
|
} = _ref5;
|
|
325
|
-
return type && (0, _styledComponents.css)
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
${type === 'year' && (0, _styledComponents.css)`
|
|
330
|
-
overflow-y: scroll;
|
|
331
|
-
gap: 12px 0;
|
|
332
|
-
${_scrollbar.default}
|
|
333
|
-
`};
|
|
334
|
-
`;
|
|
335
|
-
}}
|
|
336
|
-
|
|
337
|
-
transition: 0.3s;
|
|
338
|
-
`;
|
|
339
|
-
const Item = _styledComponents.default.button`
|
|
340
|
-
width: 84px;
|
|
341
|
-
height: 36px;
|
|
342
|
-
line-height: 36px;
|
|
343
|
-
text-align: center;
|
|
344
|
-
border-radius: var(--border-radius-s);
|
|
345
|
-
padding: 0;
|
|
346
|
-
border: none;
|
|
347
|
-
color: var(--font-on-background);
|
|
348
|
-
background: var(--color-background1);
|
|
349
|
-
|
|
350
|
-
&:hover {
|
|
351
|
-
${_ref6 => {
|
|
274
|
+
return type && (0, _styledComponents.css)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n min-height: ", "px};\n transition: .3s;\n \n ", ";\n "])), type === 'year' ? '197' : fixedYear ? '144' : '192', type === 'year' && (0, _styledComponents.css)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n overflow-y: scroll;\n gap: 12px 0;\n ", "\n "])), _scrollbar.default));
|
|
275
|
+
});
|
|
276
|
+
const Item = _styledComponents.default.button(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n width: 84px;\n height: 36px;\n line-height: 36px;\n text-align: center;\n border-radius: var(--border-radius-s);\n padding: 0;\n border: none;\n color: var(--font-on-background);\n background: var(--color-background1);\n\n &:hover {\n ", "\n }\n\n ", "\n\n ", "\n"])), _ref6 => {
|
|
352
277
|
let {
|
|
353
278
|
disabled
|
|
354
279
|
} = _ref6;
|
|
355
280
|
return !disabled && 'background: var(--color-primary)';
|
|
356
|
-
}
|
|
357
|
-
}
|
|
358
|
-
|
|
359
|
-
${_ref7 => {
|
|
281
|
+
}, _ref7 => {
|
|
360
282
|
let {
|
|
361
283
|
disabled
|
|
362
284
|
} = _ref7;
|
|
363
285
|
return disabled && 'color: var(--font-on-mute)';
|
|
364
|
-
}
|
|
365
|
-
|
|
366
|
-
${_ref8 => {
|
|
286
|
+
}, _ref8 => {
|
|
367
287
|
let {
|
|
368
288
|
selected
|
|
369
289
|
} = _ref8;
|
|
370
290
|
return selected && 'background: var(--color-hover)';
|
|
371
|
-
}
|
|
372
|
-
`;
|
|
291
|
+
});
|
|
373
292
|
var _default = exports.default = Accordion;
|
|
@@ -5,24 +5,13 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
7
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
8
|
+
var _templateObject;
|
|
8
9
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
9
|
-
|
|
10
|
-
font-size: var(--font-h3)
|
|
11
|
-
line-height: 1.25;
|
|
12
|
-
font-weight: bold;
|
|
13
|
-
color: var(--font-on-background);
|
|
14
|
-
word-break: break-all;
|
|
15
|
-
white-space: pre-line;
|
|
16
|
-
|
|
17
|
-
> a {
|
|
18
|
-
color: var(--color-primary);
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
${_ref => {
|
|
10
|
+
function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
|
|
11
|
+
const DescriptionDetail = _styledComponents.default.dd(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n font-size: var(--font-h3);\n line-height: 1.25;\n font-weight: bold;\n color: var(--font-on-background);\n word-break: break-all;\n white-space: pre-line;\n\n > a {\n color: var(--color-primary);\n }\n\n ", "\n"])), _ref => {
|
|
22
12
|
let {
|
|
23
13
|
fontNormal
|
|
24
14
|
} = _ref;
|
|
25
15
|
return fontNormal && 'font-weight: normal;';
|
|
26
|
-
}
|
|
27
|
-
`;
|
|
16
|
+
});
|
|
28
17
|
var _default = exports.default = DescriptionDetail;
|
|
@@ -5,21 +5,13 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
7
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
8
|
+
var _templateObject;
|
|
8
9
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
9
|
-
|
|
10
|
-
flex: 1
|
|
11
|
-
|
|
12
|
-
&:not(:last-child) {
|
|
13
|
-
border-right: var(--border-width) solid var(--border-color);
|
|
14
|
-
margin-right: var(--spacing);
|
|
15
|
-
padding-right: var(--spacing);
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
${_ref => {
|
|
10
|
+
function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
|
|
11
|
+
const DescriptionList = _styledComponents.default.dl(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n flex: 1;\n\n &:not(:last-child) {\n border-right: var(--border-width) solid var(--border-color);\n margin-right: var(--spacing);\n padding-right: var(--spacing);\n }\n\n ", "\n"])), _ref => {
|
|
19
12
|
let {
|
|
20
13
|
invisible
|
|
21
14
|
} = _ref;
|
|
22
15
|
return invisible && 'visibility: hidden';
|
|
23
|
-
}
|
|
24
|
-
`;
|
|
16
|
+
});
|
|
25
17
|
var _default = exports.default = DescriptionList;
|
|
@@ -5,10 +5,8 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
7
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
8
|
+
var _templateObject;
|
|
8
9
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
9
|
-
|
|
10
|
-
font-size: var(--font-h3);
|
|
11
|
-
color: var(--font-on-mute);
|
|
12
|
-
padding-bottom: var(--spacing-xs);
|
|
13
|
-
`;
|
|
10
|
+
function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
|
|
11
|
+
const DescriptionTerm = _styledComponents.default.dt(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n font-size: var(--font-h3);\n color: var(--font-on-mute);\n padding-bottom: var(--spacing-xs);\n"])));
|
|
14
12
|
var _default = exports.default = DescriptionTerm;
|
package/divider/Divider.js
CHANGED
|
@@ -5,27 +5,18 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
7
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
8
|
+
var _templateObject;
|
|
8
9
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
9
|
-
|
|
10
|
-
border: none
|
|
11
|
-
border-top: 1px solid var(--border-color);
|
|
12
|
-
margin: var(--spacing-s);
|
|
13
|
-
|
|
14
|
-
${_ref => {
|
|
10
|
+
function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
|
|
11
|
+
const Divider = _styledComponents.default.hr(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n border: none;\n border-top: 1px solid var(--border-color);\n margin: var(--spacing-s);\n\n ", "\n\n ", "\n"])), _ref => {
|
|
15
12
|
let {
|
|
16
13
|
noMarginX
|
|
17
14
|
} = _ref;
|
|
18
|
-
return noMarginX &&
|
|
19
|
-
|
|
20
|
-
margin-right: 0;
|
|
21
|
-
`;
|
|
22
|
-
}}
|
|
23
|
-
|
|
24
|
-
${_ref2 => {
|
|
15
|
+
return noMarginX && "\n margin-left: 0;\n margin-right: 0;\n ";
|
|
16
|
+
}, _ref2 => {
|
|
25
17
|
let {
|
|
26
18
|
dashed
|
|
27
19
|
} = _ref2;
|
|
28
20
|
return dashed && 'border-top-style: dashed;';
|
|
29
|
-
}
|
|
30
|
-
`;
|
|
21
|
+
});
|
|
31
22
|
var _default = exports.default = Divider;
|
|
@@ -5,39 +5,23 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
7
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
8
|
+
var _templateObject;
|
|
8
9
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
9
|
-
|
|
10
|
-
display: flex
|
|
11
|
-
padding: 12px var(--spacing-s);
|
|
12
|
-
color: var(--font-on-background);
|
|
13
|
-
background: var(--color-background2);
|
|
14
|
-
width: 100%;
|
|
15
|
-
border: none;
|
|
16
|
-
cursor: ${_ref => {
|
|
10
|
+
function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
|
|
11
|
+
const DropdownButtonOption = _styledComponents.default.button(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n padding: 12px var(--spacing-s);\n color: var(--font-on-background);\n background: var(--color-background2);\n width: 100%;\n border: none;\n cursor: ", ";\n\n &:hover {\n ", "\n }\n\n > svg {\n margin-right: var(--spacing-s);\n }\n\n ", "\n"])), _ref => {
|
|
17
12
|
let {
|
|
18
13
|
disabled
|
|
19
14
|
} = _ref;
|
|
20
15
|
return disabled ? 'no-drop' : 'pointer';
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
&:hover {
|
|
24
|
-
${_ref2 => {
|
|
16
|
+
}, _ref2 => {
|
|
25
17
|
let {
|
|
26
18
|
disabled
|
|
27
19
|
} = _ref2;
|
|
28
20
|
return !disabled && 'background: var(--color-hover);';
|
|
29
|
-
}
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
> svg {
|
|
33
|
-
margin-right: var(--spacing-s);
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
${_ref3 => {
|
|
21
|
+
}, _ref3 => {
|
|
37
22
|
let {
|
|
38
23
|
disabled
|
|
39
24
|
} = _ref3;
|
|
40
25
|
return disabled && 'opacity: 0.5';
|
|
41
|
-
}
|
|
42
|
-
`;
|
|
26
|
+
});
|
|
43
27
|
var _default = exports.default = DropdownButtonOption;
|
|
@@ -9,7 +9,14 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
|
9
9
|
var _DropdownContext = _interopRequireDefault(require("./subComponent/DropdownContext"));
|
|
10
10
|
var _scrollbar = _interopRequireDefault(require("../styles/mixin/scrollbar"));
|
|
11
11
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
12
|
+
var _templateObject;
|
|
12
13
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
14
|
+
function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
|
|
15
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
16
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
17
|
+
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
18
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
|
|
19
|
+
function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
13
20
|
const DropdownContent = _ref => {
|
|
14
21
|
let {
|
|
15
22
|
children,
|
|
@@ -46,45 +53,24 @@ const DropdownContent = _ref => {
|
|
|
46
53
|
update();
|
|
47
54
|
}
|
|
48
55
|
}, [update, children]);
|
|
49
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(Wrapper, {
|
|
56
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(Wrapper, _objectSpread(_objectSpread({
|
|
50
57
|
ref: setContentElement,
|
|
51
58
|
$display: display,
|
|
52
|
-
style: styles.popper
|
|
53
|
-
|
|
59
|
+
style: styles.popper
|
|
60
|
+
}, attributes.popper), {}, {
|
|
54
61
|
showScrollbar: showScrollbar,
|
|
55
62
|
children: children
|
|
56
|
-
});
|
|
63
|
+
}));
|
|
57
64
|
};
|
|
58
|
-
const Wrapper = _styledComponents.default.div
|
|
59
|
-
visibility: ${_ref2 => {
|
|
65
|
+
const Wrapper = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n visibility: ", ";\n min-width: 160px;\n max-width: 320px;\n border: 1px solid var(--border-color);\n color: var(--font-on-background);\n background: var(--color-background2);\n box-shadow: var(--box-shadow);\n border-radius: var(--border-radius);\n padding: var(--spacing-s) 0;\n z-index: 20;\n margin: 0 !important;\n\n ", "\n\n ", "\n"])), _ref2 => {
|
|
60
66
|
let {
|
|
61
67
|
$display
|
|
62
68
|
} = _ref2;
|
|
63
69
|
return $display === true ? 'visible' : 'hidden';
|
|
64
|
-
}
|
|
65
|
-
min-width: 160px;
|
|
66
|
-
max-width: 320px;
|
|
67
|
-
border: 1px solid var(--border-color);
|
|
68
|
-
color: var(--font-on-background);
|
|
69
|
-
background: var(--color-background2);
|
|
70
|
-
box-shadow: var(--box-shadow);
|
|
71
|
-
border-radius: var(--border-radius);
|
|
72
|
-
padding: var(--spacing-s) 0;
|
|
73
|
-
z-index: 20;
|
|
74
|
-
margin: 0 !important;
|
|
75
|
-
|
|
76
|
-
${_scrollbar.default}
|
|
77
|
-
|
|
78
|
-
${_ref3 => {
|
|
70
|
+
}, _scrollbar.default, _ref3 => {
|
|
79
71
|
let {
|
|
80
72
|
showScrollbar
|
|
81
73
|
} = _ref3;
|
|
82
|
-
return showScrollbar &&
|
|
83
|
-
|
|
84
|
-
overflow-x: hidden;
|
|
85
|
-
max-height: min(320px, ((50vh - 36px) - 20px) - 36px);
|
|
86
|
-
|
|
87
|
-
`;
|
|
88
|
-
}}
|
|
89
|
-
`;
|
|
74
|
+
return showScrollbar && "\n overflow-y: auto;\n overflow-x: hidden;\n max-height: min(320px, ((50vh - 36px) - 20px) - 36px);\n\n ";
|
|
75
|
+
});
|
|
90
76
|
var _default = exports.default = DropdownContent;
|
|
@@ -5,22 +5,8 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
7
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
8
|
+
var _templateObject;
|
|
8
9
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
9
|
-
|
|
10
|
-
display: flex;
|
|
11
|
-
padding: 12px var(--spacing-s);
|
|
12
|
-
color: var(--font-on-background);
|
|
13
|
-
background: var(--color-background2);
|
|
14
|
-
width: 100%;
|
|
15
|
-
border: none;
|
|
16
|
-
cursor: pointer;
|
|
17
|
-
|
|
18
|
-
&:hover {
|
|
19
|
-
background: var(--color-hover);
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
> svg {
|
|
23
|
-
margin-right: var(--spacing-s);
|
|
24
|
-
}
|
|
25
|
-
`;
|
|
10
|
+
function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
|
|
11
|
+
const DropdownDivOption = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n padding: 12px var(--spacing-s);\n color: var(--font-on-background);\n background: var(--color-background2);\n width: 100%;\n border: none;\n cursor: pointer;\n\n &:hover {\n background: var(--color-hover);\n }\n\n > svg {\n margin-right: var(--spacing-s);\n }\n"])));
|
|
26
12
|
var _default = exports.default = DropdownDivOption;
|
|
@@ -6,19 +6,8 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.default = void 0;
|
|
7
7
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
8
8
|
var _reactRouterDom = require("react-router-dom");
|
|
9
|
+
var _templateObject;
|
|
9
10
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
10
|
-
|
|
11
|
-
display: flex;
|
|
12
|
-
padding: 12px var(--spacing-s);
|
|
13
|
-
color: var(--font-on-background);
|
|
14
|
-
background: var(--color-background2);
|
|
15
|
-
|
|
16
|
-
&:hover {
|
|
17
|
-
background: var(--color-hover);
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
> svg {
|
|
21
|
-
margin-right: var(--spacing-s);
|
|
22
|
-
}
|
|
23
|
-
`;
|
|
11
|
+
function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
|
|
12
|
+
const DropdownLinkOption = (0, _styledComponents.default)(_reactRouterDom.Link)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n padding: 12px var(--spacing-s);\n color: var(--font-on-background);\n background: var(--color-background2);\n\n &:hover {\n background: var(--color-hover);\n }\n\n > svg {\n margin-right: var(--spacing-s);\n }\n"])));
|
|
24
13
|
var _default = exports.default = DropdownLinkOption;
|
|
@@ -7,12 +7,20 @@ exports.default = void 0;
|
|
|
7
7
|
var _react = require("react");
|
|
8
8
|
var _DropdownContext = _interopRequireDefault(require("./subComponent/DropdownContext"));
|
|
9
9
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
10
|
+
const _excluded = ["children"];
|
|
10
11
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
12
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
13
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
14
|
+
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
15
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
|
|
16
|
+
function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
17
|
+
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
|
18
|
+
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }
|
|
11
19
|
const DropdownToggle = _ref => {
|
|
12
20
|
let {
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
21
|
+
children
|
|
22
|
+
} = _ref,
|
|
23
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
16
24
|
const {
|
|
17
25
|
display,
|
|
18
26
|
setDisplay,
|
|
@@ -27,12 +35,12 @@ const DropdownToggle = _ref => {
|
|
|
27
35
|
update();
|
|
28
36
|
}
|
|
29
37
|
};
|
|
30
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
31
|
-
onClick: handleToggle
|
|
32
|
-
|
|
38
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({
|
|
39
|
+
onClick: handleToggle
|
|
40
|
+
}, props), {}, {
|
|
33
41
|
children: /*#__PURE__*/(0, _react.cloneElement)(children, {
|
|
34
42
|
ref: setToggleElement
|
|
35
43
|
})
|
|
36
|
-
});
|
|
44
|
+
}));
|
|
37
45
|
};
|
|
38
46
|
var _default = exports.default = DropdownToggle;
|