no-frills-ui 0.0.14-alpha.5 → 0.0.14-alpha.6
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/index.js +2365 -3152
- package/dist/index.js.map +1 -1
- package/lib-esm/components/Accordion/Accordion.d.ts +0 -1
- package/lib-esm/components/Accordion/Accordion.js +26 -26
- package/lib-esm/components/Accordion/AccordionStep.d.ts +0 -1
- package/lib-esm/components/Accordion/AccordionStep.js +98 -96
- package/lib-esm/components/Accordion/index.d.ts +0 -1
- package/lib-esm/components/Badge/Badge.d.ts +0 -1
- package/lib-esm/components/Badge/Badge.js +32 -38
- package/lib-esm/components/Badge/index.d.ts +0 -1
- package/lib-esm/components/Button/ActionButton.d.ts +0 -1
- package/lib-esm/components/Button/ActionButton.js +6 -39
- package/lib-esm/components/Button/Button.d.ts +0 -1
- package/lib-esm/components/Button/Button.js +8 -44
- package/lib-esm/components/Button/IconButton.d.ts +0 -1
- package/lib-esm/components/Button/IconButton.js +6 -43
- package/lib-esm/components/Button/LinkButton.d.ts +0 -1
- package/lib-esm/components/Button/LinkButton.js +6 -34
- package/lib-esm/components/Button/RaisedButton.d.ts +0 -1
- package/lib-esm/components/Button/RaisedButton.js +6 -47
- package/lib-esm/components/Button/index.d.ts +0 -1
- package/lib-esm/components/Card/Card.d.ts +0 -1
- package/lib-esm/components/Card/Card.js +8 -13
- package/lib-esm/components/Card/index.d.ts +0 -1
- package/lib-esm/components/Chip/Chip.d.ts +0 -1
- package/lib-esm/components/Chip/Chip.js +35 -43
- package/lib-esm/components/Chip/index.d.ts +0 -1
- package/lib-esm/components/ChipInput/ChipInput.d.ts +0 -1
- package/lib-esm/components/ChipInput/ChipInput.js +102 -162
- package/lib-esm/components/ChipInput/index.d.ts +0 -1
- package/lib-esm/components/Dialog/AlertDialog.d.ts +0 -1
- package/lib-esm/components/Dialog/AlertDialog.js +45 -26
- package/lib-esm/components/Dialog/ConfirmDialog.d.ts +0 -1
- package/lib-esm/components/Dialog/ConfirmDialog.js +49 -31
- package/lib-esm/components/Dialog/Dialog.d.ts +1 -1
- package/lib-esm/components/Dialog/Dialog.js +76 -106
- package/lib-esm/components/Dialog/PromptDialog.d.ts +0 -1
- package/lib-esm/components/Dialog/PromptDialog.js +82 -44
- package/lib-esm/components/Dialog/index.d.ts +0 -1
- package/lib-esm/components/DragAndDrop/DragAndDrop.d.ts +0 -1
- package/lib-esm/components/DragAndDrop/DragAndDrop.js +66 -71
- package/lib-esm/components/DragAndDrop/DragItem.d.ts +0 -1
- package/lib-esm/components/DragAndDrop/DragItem.js +106 -118
- package/lib-esm/components/DragAndDrop/index.d.ts +0 -1
- package/lib-esm/components/DragAndDrop/types.d.ts +0 -1
- package/lib-esm/components/DragAndDrop/types.js +7 -5
- package/lib-esm/components/Drawer/Drawer.d.ts +0 -1
- package/lib-esm/components/Drawer/Drawer.js +143 -197
- package/lib-esm/components/Drawer/index.d.ts +0 -1
- package/lib-esm/components/Groups/Group.d.ts +0 -1
- package/lib-esm/components/Groups/Group.js +28 -86
- package/lib-esm/components/Groups/GroupLabel.d.ts +0 -1
- package/lib-esm/components/Groups/GroupLabel.js +7 -17
- package/lib-esm/components/Groups/index.d.ts +0 -1
- package/lib-esm/components/Input/Checkbox.d.ts +0 -1
- package/lib-esm/components/Input/Checkbox.js +39 -115
- package/lib-esm/components/Input/Dropdown.d.ts +0 -1
- package/lib-esm/components/Input/Dropdown.js +74 -37
- package/lib-esm/components/Input/Input.d.ts +0 -1
- package/lib-esm/components/Input/Input.js +52 -110
- package/lib-esm/components/Input/Radio.d.ts +0 -1
- package/lib-esm/components/Input/Radio.js +31 -92
- package/lib-esm/components/Input/RadioButton.d.ts +0 -1
- package/lib-esm/components/Input/RadioButton.js +30 -67
- package/lib-esm/components/Input/Select.d.ts +0 -1
- package/lib-esm/components/Input/Select.js +65 -123
- package/lib-esm/components/Input/TextArea.d.ts +0 -1
- package/lib-esm/components/Input/TextArea.js +51 -108
- package/lib-esm/components/Input/Toggle.d.ts +0 -1
- package/lib-esm/components/Input/Toggle.js +29 -80
- package/lib-esm/components/Input/index.d.ts +0 -1
- package/lib-esm/components/Menu/Menu.d.ts +0 -1
- package/lib-esm/components/Menu/Menu.js +47 -62
- package/lib-esm/components/Menu/MenuContext.d.ts +0 -1
- package/lib-esm/components/Menu/MenuContext.js +4 -2
- package/lib-esm/components/Menu/MenuItem.d.ts +0 -1
- package/lib-esm/components/Menu/MenuItem.js +34 -49
- package/lib-esm/components/Menu/index.d.ts +0 -1
- package/lib-esm/components/Modal/Modal.d.ts +0 -1
- package/lib-esm/components/Modal/Modal.js +117 -154
- package/lib-esm/components/Modal/index.d.ts +0 -1
- package/lib-esm/components/Notification/Notification.d.ts +0 -1
- package/lib-esm/components/Notification/Notification.js +54 -66
- package/lib-esm/components/Notification/NotificationManager.d.ts +4 -1
- package/lib-esm/components/Notification/NotificationManager.js +157 -100
- package/lib-esm/components/Notification/index.d.ts +0 -1
- package/lib-esm/components/Notification/style.d.ts +0 -1
- package/lib-esm/components/Notification/style.js +51 -145
- package/lib-esm/components/Notification/types.d.ts +0 -1
- package/lib-esm/components/Notification/types.js +8 -9
- package/lib-esm/components/Popover/Popover.d.ts +0 -1
- package/lib-esm/components/Popover/Popover.js +135 -115
- package/lib-esm/components/Popover/index.d.ts +0 -1
- package/lib-esm/components/Spinner/Spinner.d.ts +0 -1
- package/lib-esm/components/Spinner/Spinner.js +19 -39
- package/lib-esm/components/Spinner/index.d.ts +0 -1
- package/lib-esm/components/Stepper/Step.d.ts +0 -1
- package/lib-esm/components/Stepper/Step.js +15 -22
- package/lib-esm/components/Stepper/Stepper.d.ts +0 -1
- package/lib-esm/components/Stepper/Stepper.js +98 -119
- package/lib-esm/components/Stepper/index.d.ts +0 -1
- package/lib-esm/components/Tabs/Tab.d.ts +0 -1
- package/lib-esm/components/Tabs/Tab.js +11 -10
- package/lib-esm/components/Tabs/Tabs.d.ts +0 -1
- package/lib-esm/components/Tabs/Tabs.js +80 -75
- package/lib-esm/components/Tabs/index.d.ts +0 -1
- package/lib-esm/components/Toast/Toast.d.ts +5 -1
- package/lib-esm/components/Toast/Toast.js +127 -135
- package/lib-esm/components/Toast/ToastStory.d.ts +0 -1
- package/lib-esm/components/Toast/index.d.ts +0 -1
- package/lib-esm/components/Tooltip/Tooltip.d.ts +0 -1
- package/lib-esm/components/Tooltip/Tooltip.js +57 -69
- package/lib-esm/components/Tooltip/index.d.ts +0 -1
- package/lib-esm/components/index.d.ts +0 -1
- package/lib-esm/components/index.js +42 -21
- package/lib-esm/icons/CheckCircle.d.ts +0 -1
- package/lib-esm/icons/CheckCircle.js +21 -4
- package/lib-esm/icons/Close.d.ts +0 -1
- package/lib-esm/icons/Close.js +21 -4
- package/lib-esm/icons/DragIndicator.d.ts +0 -1
- package/lib-esm/icons/DragIndicator.js +21 -4
- package/lib-esm/icons/ErrorOutline.d.ts +0 -1
- package/lib-esm/icons/ErrorOutline.js +15 -4
- package/lib-esm/icons/ExpandMore.d.ts +0 -1
- package/lib-esm/icons/ExpandMore.js +21 -4
- package/lib-esm/icons/FiberManualRecord.d.ts +0 -1
- package/lib-esm/icons/FiberManualRecord.js +23 -4
- package/lib-esm/icons/Info.d.ts +0 -1
- package/lib-esm/icons/Info.js +21 -4
- package/lib-esm/icons/ReportProblem.d.ts +0 -1
- package/lib-esm/icons/ReportProblem.js +21 -4
- package/lib-esm/icons/index.d.ts +0 -1
- package/lib-esm/index.d.ts +0 -1
- package/lib-esm/shared/LayerManager.d.ts +3 -1
- package/lib-esm/shared/LayerManager.js +105 -96
- package/lib-esm/shared/constants.d.ts +0 -1
- package/lib-esm/shared/constants.js +33 -61
- package/lib-esm/shared/styles.d.ts +0 -1
- package/lib-esm/shared/styles.js +20 -26
- package/package.json +15 -5
- package/lib-esm/components/Accordion/Accordion.d.ts.map +0 -1
- package/lib-esm/components/Accordion/Accordion.js.map +0 -1
- package/lib-esm/components/Accordion/AccordionStep.d.ts.map +0 -1
- package/lib-esm/components/Accordion/AccordionStep.js.map +0 -1
- package/lib-esm/components/Accordion/index.d.ts.map +0 -1
- package/lib-esm/components/Accordion/index.js +0 -3
- package/lib-esm/components/Accordion/index.js.map +0 -1
- package/lib-esm/components/Badge/Badge.d.ts.map +0 -1
- package/lib-esm/components/Badge/Badge.js.map +0 -1
- package/lib-esm/components/Badge/index.d.ts.map +0 -1
- package/lib-esm/components/Badge/index.js +0 -2
- package/lib-esm/components/Badge/index.js.map +0 -1
- package/lib-esm/components/Button/ActionButton.d.ts.map +0 -1
- package/lib-esm/components/Button/ActionButton.js.map +0 -1
- package/lib-esm/components/Button/Button.d.ts.map +0 -1
- package/lib-esm/components/Button/Button.js.map +0 -1
- package/lib-esm/components/Button/IconButton.d.ts.map +0 -1
- package/lib-esm/components/Button/IconButton.js.map +0 -1
- package/lib-esm/components/Button/LinkButton.d.ts.map +0 -1
- package/lib-esm/components/Button/LinkButton.js.map +0 -1
- package/lib-esm/components/Button/RaisedButton.d.ts.map +0 -1
- package/lib-esm/components/Button/RaisedButton.js.map +0 -1
- package/lib-esm/components/Button/index.d.ts.map +0 -1
- package/lib-esm/components/Button/index.js +0 -6
- package/lib-esm/components/Button/index.js.map +0 -1
- package/lib-esm/components/Card/Card.d.ts.map +0 -1
- package/lib-esm/components/Card/Card.js.map +0 -1
- package/lib-esm/components/Card/index.d.ts.map +0 -1
- package/lib-esm/components/Card/index.js +0 -3
- package/lib-esm/components/Card/index.js.map +0 -1
- package/lib-esm/components/Chip/Chip.d.ts.map +0 -1
- package/lib-esm/components/Chip/Chip.js.map +0 -1
- package/lib-esm/components/Chip/index.d.ts.map +0 -1
- package/lib-esm/components/Chip/index.js +0 -2
- package/lib-esm/components/Chip/index.js.map +0 -1
- package/lib-esm/components/ChipInput/ChipInput.d.ts.map +0 -1
- package/lib-esm/components/ChipInput/ChipInput.js.map +0 -1
- package/lib-esm/components/ChipInput/index.d.ts.map +0 -1
- package/lib-esm/components/ChipInput/index.js +0 -2
- package/lib-esm/components/ChipInput/index.js.map +0 -1
- package/lib-esm/components/Dialog/AlertDialog.d.ts.map +0 -1
- package/lib-esm/components/Dialog/AlertDialog.js.map +0 -1
- package/lib-esm/components/Dialog/ConfirmDialog.d.ts.map +0 -1
- package/lib-esm/components/Dialog/ConfirmDialog.js.map +0 -1
- package/lib-esm/components/Dialog/Dialog.d.ts.map +0 -1
- package/lib-esm/components/Dialog/Dialog.js.map +0 -1
- package/lib-esm/components/Dialog/PromptDialog.d.ts.map +0 -1
- package/lib-esm/components/Dialog/PromptDialog.js.map +0 -1
- package/lib-esm/components/Dialog/index.d.ts.map +0 -1
- package/lib-esm/components/Dialog/index.js +0 -5
- package/lib-esm/components/Dialog/index.js.map +0 -1
- package/lib-esm/components/DragAndDrop/DragAndDrop.d.ts.map +0 -1
- package/lib-esm/components/DragAndDrop/DragAndDrop.js.map +0 -1
- package/lib-esm/components/DragAndDrop/DragItem.d.ts.map +0 -1
- package/lib-esm/components/DragAndDrop/DragItem.js.map +0 -1
- package/lib-esm/components/DragAndDrop/index.d.ts.map +0 -1
- package/lib-esm/components/DragAndDrop/index.js +0 -3
- package/lib-esm/components/DragAndDrop/index.js.map +0 -1
- package/lib-esm/components/DragAndDrop/types.d.ts.map +0 -1
- package/lib-esm/components/DragAndDrop/types.js.map +0 -1
- package/lib-esm/components/Drawer/Drawer.d.ts.map +0 -1
- package/lib-esm/components/Drawer/Drawer.js.map +0 -1
- package/lib-esm/components/Drawer/index.d.ts.map +0 -1
- package/lib-esm/components/Drawer/index.js +0 -2
- package/lib-esm/components/Drawer/index.js.map +0 -1
- package/lib-esm/components/Groups/Group.d.ts.map +0 -1
- package/lib-esm/components/Groups/Group.js.map +0 -1
- package/lib-esm/components/Groups/GroupLabel.d.ts.map +0 -1
- package/lib-esm/components/Groups/GroupLabel.js.map +0 -1
- package/lib-esm/components/Groups/index.d.ts.map +0 -1
- package/lib-esm/components/Groups/index.js +0 -3
- package/lib-esm/components/Groups/index.js.map +0 -1
- package/lib-esm/components/Input/Checkbox.d.ts.map +0 -1
- package/lib-esm/components/Input/Checkbox.js.map +0 -1
- package/lib-esm/components/Input/Dropdown.d.ts.map +0 -1
- package/lib-esm/components/Input/Dropdown.js.map +0 -1
- package/lib-esm/components/Input/Input.d.ts.map +0 -1
- package/lib-esm/components/Input/Input.js.map +0 -1
- package/lib-esm/components/Input/Radio.d.ts.map +0 -1
- package/lib-esm/components/Input/Radio.js.map +0 -1
- package/lib-esm/components/Input/RadioButton.d.ts.map +0 -1
- package/lib-esm/components/Input/RadioButton.js.map +0 -1
- package/lib-esm/components/Input/Select.d.ts.map +0 -1
- package/lib-esm/components/Input/Select.js.map +0 -1
- package/lib-esm/components/Input/TextArea.d.ts.map +0 -1
- package/lib-esm/components/Input/TextArea.js.map +0 -1
- package/lib-esm/components/Input/Toggle.d.ts.map +0 -1
- package/lib-esm/components/Input/Toggle.js.map +0 -1
- package/lib-esm/components/Input/index.d.ts.map +0 -1
- package/lib-esm/components/Input/index.js +0 -9
- package/lib-esm/components/Input/index.js.map +0 -1
- package/lib-esm/components/Menu/Menu.d.ts.map +0 -1
- package/lib-esm/components/Menu/Menu.js.map +0 -1
- package/lib-esm/components/Menu/MenuContext.d.ts.map +0 -1
- package/lib-esm/components/Menu/MenuContext.js.map +0 -1
- package/lib-esm/components/Menu/MenuItem.d.ts.map +0 -1
- package/lib-esm/components/Menu/MenuItem.js.map +0 -1
- package/lib-esm/components/Menu/index.d.ts.map +0 -1
- package/lib-esm/components/Menu/index.js +0 -3
- package/lib-esm/components/Menu/index.js.map +0 -1
- package/lib-esm/components/Modal/Modal.d.ts.map +0 -1
- package/lib-esm/components/Modal/Modal.js.map +0 -1
- package/lib-esm/components/Modal/index.d.ts.map +0 -1
- package/lib-esm/components/Modal/index.js +0 -2
- package/lib-esm/components/Modal/index.js.map +0 -1
- package/lib-esm/components/Notification/Notification.d.ts.map +0 -1
- package/lib-esm/components/Notification/Notification.js.map +0 -1
- package/lib-esm/components/Notification/NotificationManager.d.ts.map +0 -1
- package/lib-esm/components/Notification/NotificationManager.js.map +0 -1
- package/lib-esm/components/Notification/index.d.ts.map +0 -1
- package/lib-esm/components/Notification/index.js +0 -3
- package/lib-esm/components/Notification/index.js.map +0 -1
- package/lib-esm/components/Notification/style.d.ts.map +0 -1
- package/lib-esm/components/Notification/style.js.map +0 -1
- package/lib-esm/components/Notification/types.d.ts.map +0 -1
- package/lib-esm/components/Notification/types.js.map +0 -1
- package/lib-esm/components/Popover/Popover.d.ts.map +0 -1
- package/lib-esm/components/Popover/Popover.js.map +0 -1
- package/lib-esm/components/Popover/index.d.ts.map +0 -1
- package/lib-esm/components/Popover/index.js +0 -2
- package/lib-esm/components/Popover/index.js.map +0 -1
- package/lib-esm/components/Spinner/Spinner.d.ts.map +0 -1
- package/lib-esm/components/Spinner/Spinner.js.map +0 -1
- package/lib-esm/components/Spinner/index.d.ts.map +0 -1
- package/lib-esm/components/Spinner/index.js +0 -2
- package/lib-esm/components/Spinner/index.js.map +0 -1
- package/lib-esm/components/Stepper/Step.d.ts.map +0 -1
- package/lib-esm/components/Stepper/Step.js.map +0 -1
- package/lib-esm/components/Stepper/Stepper.d.ts.map +0 -1
- package/lib-esm/components/Stepper/Stepper.js.map +0 -1
- package/lib-esm/components/Stepper/index.d.ts.map +0 -1
- package/lib-esm/components/Stepper/index.js +0 -4
- package/lib-esm/components/Stepper/index.js.map +0 -1
- package/lib-esm/components/Tabs/Tab.d.ts.map +0 -1
- package/lib-esm/components/Tabs/Tab.js.map +0 -1
- package/lib-esm/components/Tabs/Tabs.d.ts.map +0 -1
- package/lib-esm/components/Tabs/Tabs.js.map +0 -1
- package/lib-esm/components/Tabs/index.d.ts.map +0 -1
- package/lib-esm/components/Tabs/index.js +0 -3
- package/lib-esm/components/Tabs/index.js.map +0 -1
- package/lib-esm/components/Toast/Toast.d.ts.map +0 -1
- package/lib-esm/components/Toast/Toast.js.map +0 -1
- package/lib-esm/components/Toast/ToastStory.d.ts.map +0 -1
- package/lib-esm/components/Toast/ToastStory.js +0 -35
- package/lib-esm/components/Toast/ToastStory.js.map +0 -1
- package/lib-esm/components/Toast/index.d.ts.map +0 -1
- package/lib-esm/components/Toast/index.js +0 -2
- package/lib-esm/components/Toast/index.js.map +0 -1
- package/lib-esm/components/Tooltip/Tooltip.d.ts.map +0 -1
- package/lib-esm/components/Tooltip/Tooltip.js.map +0 -1
- package/lib-esm/components/Tooltip/index.d.ts.map +0 -1
- package/lib-esm/components/Tooltip/index.js +0 -2
- package/lib-esm/components/Tooltip/index.js.map +0 -1
- package/lib-esm/components/index.d.ts.map +0 -1
- package/lib-esm/components/index.js.map +0 -1
- package/lib-esm/icons/CheckCircle.d.ts.map +0 -1
- package/lib-esm/icons/CheckCircle.js.map +0 -1
- package/lib-esm/icons/Close.d.ts.map +0 -1
- package/lib-esm/icons/Close.js.map +0 -1
- package/lib-esm/icons/DragIndicator.d.ts.map +0 -1
- package/lib-esm/icons/DragIndicator.js.map +0 -1
- package/lib-esm/icons/ErrorOutline.d.ts.map +0 -1
- package/lib-esm/icons/ErrorOutline.js.map +0 -1
- package/lib-esm/icons/ExpandMore.d.ts.map +0 -1
- package/lib-esm/icons/ExpandMore.js.map +0 -1
- package/lib-esm/icons/FiberManualRecord.d.ts.map +0 -1
- package/lib-esm/icons/FiberManualRecord.js.map +0 -1
- package/lib-esm/icons/Info.d.ts.map +0 -1
- package/lib-esm/icons/Info.js.map +0 -1
- package/lib-esm/icons/ReportProblem.d.ts.map +0 -1
- package/lib-esm/icons/ReportProblem.js.map +0 -1
- package/lib-esm/icons/index.d.ts.map +0 -1
- package/lib-esm/icons/index.js +0 -9
- package/lib-esm/icons/index.js.map +0 -1
- package/lib-esm/index.d.ts.map +0 -1
- package/lib-esm/index.js +0 -2
- package/lib-esm/index.js.map +0 -1
- package/lib-esm/shared/LayerManager.d.ts.map +0 -1
- package/lib-esm/shared/LayerManager.js.map +0 -1
- package/lib-esm/shared/constants.d.ts.map +0 -1
- package/lib-esm/shared/constants.js.map +0 -1
- package/lib-esm/shared/styles.d.ts.map +0 -1
- package/lib-esm/shared/styles.js.map +0 -1
|
@@ -1,11 +1,10 @@
|
|
|
1
|
-
import { jsx
|
|
1
|
+
import { jsx } from '@emotion/react/jsx-runtime';
|
|
2
2
|
import React, { useEffect } from 'react';
|
|
3
3
|
import ReactDOM from 'react-dom';
|
|
4
4
|
import styled from '@emotion/styled';
|
|
5
|
-
import { getThemeValue, THEME_NAME } from './constants';
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
(function (LAYER_POSITION) {
|
|
5
|
+
import { getThemeValue, THEME_NAME } from './constants.js';
|
|
6
|
+
|
|
7
|
+
/** Enums for layer position on screen. */ var LAYER_POSITION = /*#__PURE__*/ function(LAYER_POSITION) {
|
|
9
8
|
LAYER_POSITION[LAYER_POSITION["TOP_LEFT"] = 0] = "TOP_LEFT";
|
|
10
9
|
LAYER_POSITION[LAYER_POSITION["TOP_CENTER"] = 1] = "TOP_CENTER";
|
|
11
10
|
LAYER_POSITION[LAYER_POSITION["TOP_RIGHT"] = 2] = "TOP_RIGHT";
|
|
@@ -13,55 +12,40 @@ export var LAYER_POSITION;
|
|
|
13
12
|
LAYER_POSITION[LAYER_POSITION["BOTTOM_CENTER"] = 4] = "BOTTOM_CENTER";
|
|
14
13
|
LAYER_POSITION[LAYER_POSITION["BOTTOM_RIGHT"] = 5] = "BOTTOM_RIGHT";
|
|
15
14
|
LAYER_POSITION[LAYER_POSITION["DIALOG"] = 6] = "DIALOG";
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
const defaultConfig = {
|
|
15
|
+
return LAYER_POSITION;
|
|
16
|
+
}({});
|
|
17
|
+
/** Default value of config */ const defaultConfig = {
|
|
19
18
|
closeOnEsc: true,
|
|
20
19
|
overlay: false,
|
|
21
|
-
position:
|
|
20
|
+
position: 0,
|
|
22
21
|
component: null,
|
|
23
22
|
exitDelay: 0,
|
|
24
23
|
closeOnOverlayClick: true,
|
|
25
|
-
alwaysOnTop: false
|
|
24
|
+
alwaysOnTop: false
|
|
26
25
|
};
|
|
27
|
-
/** Styles for each position */
|
|
28
|
-
|
|
29
|
-
[
|
|
30
|
-
[
|
|
31
|
-
[
|
|
32
|
-
[
|
|
33
|
-
[
|
|
34
|
-
[
|
|
35
|
-
[LAYER_POSITION.DIALOG]: 'top: 0; left: 0; justify-content: center; align-items: center;',
|
|
26
|
+
/** Styles for each position */ const POSITION_STYLE = {
|
|
27
|
+
[0]: 'top: 0; left: 0;',
|
|
28
|
+
[1]: 'top: 0; left: 50%; justify-content: center;',
|
|
29
|
+
[2]: 'top: 0; right: 0; justify-content: flex-end;',
|
|
30
|
+
[3]: 'bottom: 0; left: 0;',
|
|
31
|
+
[4]: 'bottom: 0; left: 50%; justify-content: center;',
|
|
32
|
+
[5]: 'bottom: 0; right: 0; justify-content: flex-end;',
|
|
33
|
+
[6]: 'top: 0; left: 0; justify-content: center; align-items: center;'
|
|
36
34
|
};
|
|
37
|
-
/** Layer container component. */
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
opacity: 0;
|
|
42
|
-
transition: opacity 0.3s ease;
|
|
43
|
-
${(props) => POSITION_STYLE[props.position]}
|
|
44
|
-
${(props) => props.overlay &&
|
|
45
|
-
`
|
|
35
|
+
/** Layer container component. */ const Container = /*#__PURE__*/ styled("div", {
|
|
36
|
+
target: "euaj5y50",
|
|
37
|
+
label: "Container"
|
|
38
|
+
})("position:fixed;display:flex;opacity:0;transition:opacity 0.3s ease;", (props)=>POSITION_STYLE[props.position], " ", (props)=>props.overlay && `
|
|
46
39
|
width: 100%;
|
|
47
40
|
height: 100vh;
|
|
48
41
|
background-color: ${getThemeValue(THEME_NAME.BACKDROP_COLOR)};
|
|
49
42
|
backdrop-filter: blur(0px);
|
|
50
43
|
pointer-events: all;
|
|
51
|
-
`
|
|
52
|
-
z-index: ${(props) => props.zIndex};
|
|
53
|
-
|
|
54
|
-
.nf-layer-enter & {
|
|
55
|
-
opacity: 1;
|
|
56
|
-
${(props) => props.overlay &&
|
|
57
|
-
`
|
|
44
|
+
`, " z-index:", (props)=>props.zIndex, ";.nf-layer-enter &{opacity:1;", (props)=>props.overlay && `
|
|
58
45
|
backdrop-filter: blur(3px);
|
|
59
|
-
`}
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
/** Key code for different keys. */
|
|
63
|
-
const KEY_CODES = {
|
|
64
|
-
ESC: 27,
|
|
46
|
+
`, "}", "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvbm8tZnJpbGxzLXVpL25vLWZyaWxscy11aS9zcmMvc2hhcmVkL0xheWVyTWFuYWdlci50c3giLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL25vLWZyaWxscy11aS9uby1mcmlsbHMtdWkvc3JjL3NoYXJlZC9MYXllck1hbmFnZXIudHN4Il0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCwgeyBSZWFjdFBvcnRhbCwgdXNlRWZmZWN0IH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IFJlYWN0RE9NIGZyb20gJ3JlYWN0LWRvbSc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBnZXRUaGVtZVZhbHVlLCBUSEVNRV9OQU1FIH0gZnJvbSAnLi9jb25zdGFudHMnO1xuXG4vKiogRW51bXMgZm9yIGxheWVyIHBvc2l0aW9uIG9uIHNjcmVlbi4gKi9cbmV4cG9ydCBlbnVtIExBWUVSX1BPU0lUSU9OIHtcbiAgICBUT1BfTEVGVCxcbiAgICBUT1BfQ0VOVEVSLFxuICAgIFRPUF9SSUdIVCxcbiAgICBCT1RUT01fTEVGVCxcbiAgICBCT1RUT01fQ0VOVEVSLFxuICAgIEJPVFRPTV9SSUdIVCxcbiAgICBESUFMT0csXG59XG5cbmludGVyZmFjZSBMYXllckNvbmZpZyB7XG4gICAgLyoqIFNob3cgYW4gb3ZlcmxheSAqL1xuICAgIG92ZXJsYXk/OiBib29sZWFuO1xuICAgIC8qKiBFbGVtZW50IHRvIHJlbmRlciBpbnNpZGUgdGhlIGxheWVyLiAqL1xuICAgIGNvbXBvbmVudDogSlNYLkVsZW1lbnQ7XG4gICAgLyoqIFBvc2l0aW9uIG9mIHRoZSBsYXllciAqL1xuICAgIHBvc2l0aW9uPzogTEFZRVJfUE9TSVRJT047XG4gICAgLyoqIERlbGF5IGZvciBleGl0ICovXG4gICAgZXhpdERlbGF5PzogbnVtYmVyO1xuICAgIC8qKiBDbG9zZSBsYXllciBvbiBgZXNjYCBrZXkgcHJlc3MuICovXG4gICAgY2xvc2VPbkVzYz86IGJvb2xlYW47XG4gICAgLyoqIENsb3NlIGxheWVyIG92ZXJsYXkgaXMgY2xpY2tlZC4gKi9cbiAgICBjbG9zZU9uT3ZlcmxheUNsaWNrPzogYm9vbGVhbjtcbiAgICAvKiogQ2FsbGJhY2sgY2FsbGVkIHdoZW4gbW9kYWwgY2xvc2VzICovXG4gICAgY2xvc2VDYWxsYmFjaz86IDxUPihyZXNwOiBUKSA9PiB2b2lkO1xuICAgIC8qKiBMYXllciBpcyBjcmVhdGVkIHdpdGggbWF4IHotaW5kZXggKi9cbiAgICBhbHdheXNPblRvcD86IGJvb2xlYW47XG59XG5cbi8qKiBEZWZhdWx0IHZhbHVlIG9mIGNvbmZpZyAqL1xuY29uc3QgZGVmYXVsdENvbmZpZzogTGF5ZXJDb25maWcgPSB7XG4gICAgY2xvc2VPbkVzYzogdHJ1ZSxcbiAgICBvdmVybGF5OiBmYWxzZSxcbiAgICBwb3NpdGlvbjogTEFZRVJfUE9TSVRJT04uVE9QX0xFRlQsXG4gICAgY29tcG9uZW50OiBudWxsLFxuICAgIGV4aXREZWxheTogMCxcbiAgICBjbG9zZU9uT3ZlcmxheUNsaWNrOiB0cnVlLFxuICAgIGFsd2F5c09uVG9wOiBmYWxzZSxcbn07XG5cbi8qKiBNZXRhZGF0YSBvZiBlYWNoIGxheWVyICovXG5pbnRlcmZhY2UgTGF5ZXIge1xuICAgIGlkOiBzdHJpbmc7XG4gICAgY29uZmlnOiBMYXllckNvbmZpZztcbiAgICBlbGVtZW50OiBIVE1MRGl2RWxlbWVudDtcbn1cblxuLyoqIFN0eWxlcyBmb3IgZWFjaCBwb3NpdGlvbiAqL1xuY29uc3QgUE9TSVRJT05fU1RZTEUgPSB7XG4gICAgW0xBWUVSX1BPU0lUSU9OLlRPUF9MRUZUXTogJ3RvcDogMDsgbGVmdDogMDsnLFxuICAgIFtMQVlFUl9QT1NJVElPTi5UT1BfQ0VOVEVSXTogJ3RvcDogMDsgbGVmdDogNTAlOyBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjsnLFxuICAgIFtMQVlFUl9QT1NJVElPTi5UT1BfUklHSFRdOiAndG9wOiAwOyByaWdodDogMDsganVzdGlmeS1jb250ZW50OiBmbGV4LWVuZDsnLFxuICAgIFtMQVlFUl9QT1NJVElPTi5CT1RUT01fTEVGVF06ICdib3R0b206IDA7IGxlZnQ6IDA7JyxcbiAgICBbTEFZRVJfUE9TSVRJT04uQk9UVE9NX0NFTlRFUl06ICdib3R0b206IDA7IGxlZnQ6IDUwJTsganVzdGlmeS1jb250ZW50OiBjZW50ZXI7JyxcbiAgICBbTEFZRVJfUE9TSVRJT04uQk9UVE9NX1JJR0hUXTogJ2JvdHRvbTogMDsgcmlnaHQ6IDA7IGp1c3RpZnktY29udGVudDogZmxleC1lbmQ7JyxcbiAgICBbTEFZRVJfUE9TSVRJT04uRElBTE9HXTogJ3RvcDogMDsgbGVmdDogMDsganVzdGlmeS1jb250ZW50OiBjZW50ZXI7IGFsaWduLWl0ZW1zOiBjZW50ZXI7Jyxcbn07XG5cbi8qKiBMYXllciBjb250YWluZXIgY29tcG9uZW50LiAqL1xuY29uc3QgQ29udGFpbmVyID0gc3R5bGVkLmRpdjxMYXllckNvbmZpZyAmIHsgekluZGV4OiBudW1iZXIgfT5gXG4gICAgcG9zaXRpb246IGZpeGVkO1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgb3BhY2l0eTogMDtcbiAgICB0cmFuc2l0aW9uOiBvcGFjaXR5IDAuM3MgZWFzZTtcbiAgICAkeyhwcm9wcykgPT4gUE9TSVRJT05fU1RZTEVbcHJvcHMucG9zaXRpb25dfVxuICAgICR7KHByb3BzKSA9PlxuICAgICAgICBwcm9wcy5vdmVybGF5ICYmXG4gICAgICAgIGBcbiAgICAgICAgd2lkdGg6IDEwMCU7XG4gICAgICAgIGhlaWdodDogMTAwdmg7XG4gICAgICAgIGJhY2tncm91bmQtY29sb3I6ICR7Z2V0VGhlbWVWYWx1ZShUSEVNRV9OQU1FLkJBQ0tEUk9QX0NPTE9SKX07XG4gICAgICAgIGJhY2tkcm9wLWZpbHRlcjogYmx1cigwcHgpO1xuICAgICAgICBwb2ludGVyLWV2ZW50czogYWxsO1xuICAgIGB9XG4gICAgei1pbmRleDogJHsocHJvcHMpID0+IHByb3BzLnpJbmRleH07XG5cbiAgICAubmYtbGF5ZXItZW50ZXIgJiB7XG4gICAgICAgIG9wYWNpdHk6IDE7XG4gICAgICAgICR7KHByb3BzKSA9PlxuICAgICAgICAgICAgcHJvcHMub3ZlcmxheSAmJlxuICAgICAgICAgICAgYFxuICAgICAgICAgICAgYmFja2Ryb3AtZmlsdGVyOiBibHVyKDNweCk7XG4gICAgICAgIGB9XG4gICAgfVxuYDtcblxuLyoqIEtleSBjb2RlIGZvciBkaWZmZXJlbnQga2V5cy4gKi9cbmNvbnN0IEtFWV9DT0RFUyA9IHtcbiAgICBFU0M6IDI3LFxufTtcblxuLyoqXG4gKiBUaGlzIGlzIGEgc2hhcmVkIGhlbHBlciBjbGFzcyB3aGljaCBtYW5hZ2VzIHRoZSB6LWluZGV4IG9mIGVhY2ggbGF5ZXIuXG4gKiBJZiBhIGNvbXBvbmVudCBuZWVkcyB0byBiZSByZW5kZXJlZCBpbiBhIGRpZmZlcmVudCBsYXllciB0aGVuIHRoaXMgY2xhc3NcbiAqIHNob3VsZCBiZSB1c2VkLiBJdCBpbnRlcm5hbGx5IG1haW50YWlucyB0aGUgc3RhY2sgb2Ygb3BlbmVkIGxheWVyIGFuZCBlYWNoXG4gKiBgcmVuZGVyTGF5ZXJgIGNhbGwgd2lsbCBwdXNoIGEgbmV3IGxheWVyIGluIHN0YWNrLlxuICpcbiAqIFRoaXMgd2F5IHdlIG5lZWQgbm90IHdvcnJ5IGFib3V0IHRoZSB6LWluZGV4IGFuZCBjYW4gZnJlZWx5IGtlZXAgb24gY3JlYXRpbmdcbiAqIG5ldyBsYXllcnMuIFRoZSBzdGFyaW5nIGxheWVyIHotaW5kZXggaXMgMTAwMDAuIExlYXZpbmcgZW5vdWdoIHotaW5kZXggZm9yIHRoZVxuICogdXNlciBpZiB0aGV5IGRlc2lyZXMgc28uXG4gKlxuICogQGltcG9ydGFudCBVc2FnZSBQYXR0ZXJuXG4gKiBUbyBhdm9pZCBjcmVhdGluZyBkdXBsaWNhdGUgbGF5ZXJzIChlc3BlY2lhbGx5IGluIFJlYWN0IFN0cmljdCBNb2RlIG9yIE5leHQuanMpLFxuICogYWx3YXlzIGNhbGwgYHJlbmRlckxheWVyYCBvbmx5IG9uY2UgLSBlaXRoZXIgaW4gYSBsaWZlY3ljbGUgbWV0aG9kIChsaWtlIGBjb21wb25lbnREaWRVcGRhdGVgKVxuICogb3IgaW4gYW4gaW1wZXJhdGl2ZSBtZXRob2QgKGxpa2UgYG9wZW4oKWApLlxuICpcbiAqIEBleGFtcGxlXG4gKiAvLyDinYwgRG9uJ3QgY2FsbCByZW5kZXJMYXllciBpbiByZW5kZXIoKSBtZXRob2RcbiAqIHJlbmRlcigpIHtcbiAqICAgaWYgKHRoaXMuc3RhdGUuc2hvdykge1xuICogICAgIGNvbnN0IFtDb21wb25lbnQsIGNsb3NlRm5dID0gTGF5ZXJNYW5hZ2VyLnJlbmRlckxheWVyKHsgLi4uIH0pOyAvLyBDcmVhdGVzIG5ldyBsYXllciBvbiBldmVyeSByZW5kZXJcbiAqICAgICByZXR1cm4gPENvbXBvbmVudCAvPjtcbiAqICAgfVxuICogfVxuICpcbiAqIEBleGFtcGxlXG4gKiAvLyDinIUgRG8gY2FsbCByZW5kZXJMYXllciBvbmNlIGluIGEgbWV0aG9kIGFuZCBzdG9yZSB0aGUgY29tcG9uZW50XG4gKiBvcGVuKCkge1xuICogICBjb25zdCBbQ29tcG9uZW50LCBjbG9zZUZuXSA9IExheWVyTWFuYWdlci5yZW5kZXJMYXllcih7IC4uLiB9KTtcbiAqICAgdGhpcy5zZXRTdGF0ZSh7IExheWVyQ29tcG9uZW50OiBDb21wb25lbnQgfSk7XG4gKiB9XG4gKlxuICogcmVuZGVyKCkge1xuICogICBjb25zdCB7IExheWVyQ29tcG9uZW50IH0gPSB0aGlzLnN0YXRlO1xuICogICByZXR1cm4gTGF5ZXJDb21wb25lbnQgPyA8TGF5ZXJDb21wb25lbnQgLz4gOiBudWxsO1xuICogfVxuICovXG5jbGFzcyBMYXllck1hbmFnZXIge1xuICAgIC8qKiBMYXllciBzdGFjayAqL1xuICAgIHByaXZhdGUgbGF5ZXJzOiBMYXllcltdID0gW107XG4gICAgLyoqIHotaW5kZXggb2YgdGhlIG5leHQgbGF5ZXIgKi9cbiAgICBwcml2YXRlIG5leHRJbmRleCA9IDEwMDAwO1xuICAgIHByaXZhdGUga2V5dXBIYW5kbGVyOiAoZTogS2V5Ym9hcmRFdmVudCkgPT4gdm9pZDtcbiAgICBwcml2YXRlIHRpbWVvdXRJZHMgPSBuZXcgTWFwPHN0cmluZywgbnVtYmVyPigpOyAvLyBUcmFjayB0aW1lb3V0c1xuXG4gICAgLyoqXG4gICAgICogQ29uc3RydWN0b3Igc2ltcGx5IHJlZ2lzdGVycyBhIGV2ZW50IGxpc3RlbmVyIG9uIGJvZHkgdG9cbiAgICAgKiByZWFjdCB0byBlc2Mga2V5IHByZXNzLlxuICAgICAqL1xuICAgIGNvbnN0cnVjdG9yKCkge1xuICAgICAgICBpZiAodHlwZW9mIGRvY3VtZW50ICE9PSAndW5kZWZpbmVkJykge1xuICAgICAgICAgICAgLy8gU3RvcmUgaGFuZGxlciByZWZlcmVuY2UgZm9yIGNsZWFudXBcbiAgICAgICAgICAgIHRoaXMua2V5dXBIYW5kbGVyID0gKGUpID0+IHtcbiAgICAgICAgICAgICAgICBpZiAodGhpcy5sYXllcnMubGVuZ3RoICYmIGUua2V5Q29kZSA9PT0gS0VZX0NPREVTLkVTQykge1xuICAgICAgICAgICAgICAgICAgICBjb25zdCBsYXN0TGF5ZXIgPSB0aGlzLmxheWVycy5zbGljZSgtMSlbMF07XG4gICAgICAgICAgICAgICAgICAgIGlmIChsYXN0TGF5ZXIuY29uZmlnLmNsb3NlT25Fc2MgIT09IGZhbHNlKSB7XG4gICAgICAgICAgICAgICAgICAgICAgICB0aGlzLnVubW91bnQobGFzdExheWVyKTtcbiAgICAgICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgIH07XG4gICAgICAgICAgICBkb2N1bWVudC5ib2R5LmFkZEV2ZW50TGlzdGVuZXIoJ2tleXVwJywgdGhpcy5rZXl1cEhhbmRsZXIpO1xuICAgICAgICB9XG4gICAgfVxuXG4gICAgLy8gQWRkIGNsZWFudXAgbWV0aG9kXG4gICAgcHVibGljIGRlc3Ryb3kgPSAoKSA9PiB7XG4gICAgICAgIGlmICh0eXBlb2YgZG9jdW1lbnQgIT09ICd1bmRlZmluZWQnICYmIHRoaXMua2V5dXBIYW5kbGVyKSB7XG4gICAgICAgICAgICBkb2N1bWVudC5ib2R5LnJlbW92ZUV2ZW50TGlzdGVuZXIoJ2tleXVwJywgdGhpcy5rZXl1cEhhbmRsZXIpO1xuICAgICAgICB9XG4gICAgICAgIC8vIENsZWFyIGFsbCBwZW5kaW5nIHRpbWVvdXRzXG4gICAgICAgIHRoaXMudGltZW91dElkcy5mb3JFYWNoKChpZCkgPT4gY2xlYXJUaW1lb3V0KGlkKSk7XG4gICAgICAgIHRoaXMudGltZW91dElkcy5jbGVhcigpO1xuICAgICAgICAvLyBDbGVhbiB1cCByZW1haW5pbmcgbGF5ZXJzXG4gICAgICAgIHRoaXMubGF5ZXJzLmZvckVhY2goKGxheWVyKSA9PiB7XG4gICAgICAgICAgICBpZiAoZG9jdW1lbnQuYm9keS5jb250YWlucyhsYXllci5lbGVtZW50KSkge1xuICAgICAgICAgICAgICAgIGRvY3VtZW50LmJvZHkucmVtb3ZlQ2hpbGQobGF5ZXIuZWxlbWVudCk7XG4gICAgICAgICAgICB9XG4gICAgICAgIH0pO1xuICAgICAgICB0aGlzLmxheWVycyA9IFtdO1xuICAgIH07XG5cbiAgICAvKipcbiAgICAgKiBVbi1tb3VudHMgYSBsYXllci5cbiAgICAgKlxuICAgICAqIEl0IGZpcnN0IGFkZHMgYSBjbGFzcyAnbmYtbGF5ZXItZXhpdCcgYW5kIHRoZW4gdW4tbW91bnRzIHRoZVxuICAgICAqIGxheWVyIGFmdGVyIHRoZSBgZXhpdERlbGF5YCBtZW50aW9uZWQgaW4gdGhlIGxheWVyIGNvbmZpZy5cbiAgICAgKiBUaGlzIGNsYXNzIHdpbGwgaGVscCBjb21wb25lbnQgaW4gdHJpZ2dlcmluZyB0aGUgZW50cnkgYW5pbWF0aW9uLlxuICAgICAqXG4gICAgICogQHBhcmFtIGxheWVyXG4gICAgICovXG4gICAgcHJpdmF0ZSB1bm1vdW50ID0gKGxheWVyOiBMYXllciwgcmVzcD86IHVua25vd24pID0+IHtcbiAgICAgICAgbGF5ZXIuZWxlbWVudC5zZXRBdHRyaWJ1dGUoJ2NsYXNzJywgJ25mLWxheWVyLWV4aXQnKTtcbiAgICAgICAgY29uc3QgaW5kZXggPSB0aGlzLmxheWVycy5maW5kSW5kZXgoKGl0ZW0pID0+IGl0ZW0gPT09IGxheWVyKTtcbiAgICAgICAgaWYgKGluZGV4ICE9PSAtMSkge1xuICAgICAgICAgICAgdGhpcy5sYXllcnMuc3BsaWNlKGluZGV4LCAxKTtcbiAgICAgICAgfVxuXG4gICAgICAgIGNvbnN0IHRpbWVvdXRJZCA9IHdpbmRvdy5zZXRUaW1lb3V0KCgpID0+IHtcbiAgICAgICAgICAgIHRoaXMudGltZW91dElkcy5kZWxldGUobGF5ZXIuaWQpO1xuICAgICAgICAgICAgdHJ5IHtcbiAgICAgICAgICAgICAgICBsYXllci5jb25maWcuY2xvc2VDYWxsYmFjaz8uKHJlc3ApO1xuICAgICAgICAgICAgfSBjYXRjaCAoZSkge1xuICAgICAgICAgICAgICAgIGNvbnNvbGUud2FybihlLm1lc3NhZ2UpO1xuICAgICAgICAgICAgfVxuICAgICAgICAgICAgLy8gQ2xlYXIgcmVmZXJlbmNlIHRvIGhlbHAgR0NcbiAgICAgICAgICAgIGxheWVyLmNvbmZpZy5jb21wb25lbnQgPSBudWxsO1xuICAgICAgICB9LCBsYXllci5jb25maWcuZXhpdERlbGF5KTtcblxuICAgICAgICB0aGlzLnRpbWVvdXRJZHMuc2V0KGxheWVyLmlkLCB0aW1lb3V0SWQpO1xuICAgIH07XG5cbiAgICAvKipcbiAgICAgKiBSZW5kZXJzIGEgbGF5ZXIuXG4gICAgICogQHBhcmFtIGNvbmZpZ1xuICAgICAqL1xuICAgIHB1YmxpYyByZW5kZXJMYXllciA9IChcbiAgICAgICAgY29uZmlnOiBMYXllckNvbmZpZyxcbiAgICApOiBbKCkgPT4gUmVhY3QuUmVhY3RQb3J0YWwgfCBudWxsLCAocmVzcD86IHVua25vd24pID0+IHZvaWRdID0+IHtcbiAgICAgICAgLy8gU1NSIGd1YXJkXG4gICAgICAgIGlmICh0eXBlb2YgZG9jdW1lbnQgPT09ICd1bmRlZmluZWQnKSB7XG4gICAgICAgICAgICByZXR1cm4gWygpID0+IG51bGwsICgpID0+IHt9XTtcbiAgICAgICAgfVxuXG4gICAgICAgIC8vIE1lcmdlIGRlZmF1bHQgY29uZmlnIHdpdGggdGhlIHByb3ZpZGVkIGNvbmZpZy5cbiAgICAgICAgY29uc3QgbGF5ZXJDb25maWcgPSB7XG4gICAgICAgICAgICAuLi5kZWZhdWx0Q29uZmlnLFxuICAgICAgICAgICAgLi4uY29uZmlnLFxuICAgICAgICB9O1xuXG4gICAgICAgIC8vIEdldCB0aGUgei1pbmRleCBmb3IgdGhlIG5ldyBsYXllclxuICAgICAgICBjb25zdCBjdXJyZW50SW5kZXggPSBsYXllckNvbmZpZy5hbHdheXNPblRvcCA/IDIxNDc0ODM2NDcgOiB0aGlzLm5leHRJbmRleCsrO1xuICAgICAgICBjb25zdCBjbGFzc05hbWUgPSBsYXllckNvbmZpZy5hbHdheXNPblRvcCA/ICduZi1sYXllci1tYW5hZ2VyLXRvcCcgOiAnbmYtbGF5ZXItbWFuYWdlcic7XG5cbiAgICAgICAgLy8gQ3JlYXRlIGEgdW5pcXVlIElEIGZvciB0cmFja2luZyB0aGlzIGxheWVyXG4gICAgICAgIGNvbnN0IGxheWVySWQgPSBgbmYtbGF5ZXItbWFuYWdlci0ke2N1cnJlbnRJbmRleH1gO1xuXG4gICAgICAgIGNvbnN0IG92ZXJsYXlDbGlja0hhbmRsZXIgPSAoKSA9PiB7XG4gICAgICAgICAgICBjb25zdCBsYXllciA9IHRoaXMubGF5ZXJzLmZpbmQoKGwpID0+IGwuaWQgPT09IGxheWVySWQpO1xuICAgICAgICAgICAgaWYgKGxheWVyICYmIGxheWVyLmNvbmZpZy5jbG9zZU9uT3ZlcmxheUNsaWNrICE9PSBmYWxzZSkge1xuICAgICAgICAgICAgICAgIHRoaXMudW5tb3VudChsYXllcik7XG4gICAgICAgICAgICB9XG4gICAgICAgIH07XG5cbiAgICAgICAgY29uc3QgY2xvc2VGbiA9IChyZXNwPzogdW5rbm93bikgPT4ge1xuICAgICAgICAgICAgY29uc3QgbGF5ZXIgPSB0aGlzLmxheWVycy5maW5kKChsKSA9PiBsLmlkID09PSBsYXllcklkKTtcbiAgICAgICAgICAgIGlmIChsYXllcikge1xuICAgICAgICAgICAgICAgIHRoaXMudW5tb3VudChsYXllciwgcmVzcCk7XG4gICAgICAgICAgICB9XG4gICAgICAgIH07XG5cbiAgICAgICAgLy8gUmV0dXJuIGNhbGxiYWNrIHdoaWNoIHdpbGwgdHJpZ2dlciB0aGUgdW4tbW91bnQuXG4gICAgICAgIHJldHVybiBbXG4gICAgICAgICAgICAoKTogUmVhY3RQb3J0YWwgfCBudWxsID0+IHtcbiAgICAgICAgICAgICAgICBjb25zdCBbZGl2RWxlbWVudCwgc2V0RGl2RWxlbWVudF0gPSBSZWFjdC51c2VTdGF0ZTxIVE1MRGl2RWxlbWVudCB8IG51bGw+KG51bGwpO1xuXG4gICAgICAgICAgICAgICAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICAgICAgICAgICAgICAgICAgLy8gQ3JlYXRlIHRoZSBkaXYgZWxlbWVudCBvbmx5IG9uY2Ugd2hlbiBjb21wb25lbnQgbW91bnRzXG4gICAgICAgICAgICAgICAgICAgIGNvbnN0IGRpdiA9IGRvY3VtZW50LmNyZWF0ZUVsZW1lbnQoJ2RpdicpO1xuICAgICAgICAgICAgICAgICAgICBkaXYuc2V0QXR0cmlidXRlKCdjbGFzcycsIGNsYXNzTmFtZSk7XG4gICAgICAgICAgICAgICAgICAgIGRpdi5zZXRBdHRyaWJ1dGUoJ2lkJywgbGF5ZXJJZCk7XG4gICAgICAgICAgICAgICAgICAgIGRvY3VtZW50LmJvZHkuYXBwZW5kQ2hpbGQoZGl2KTtcblxuICAgICAgICAgICAgICAgICAgICAvLyBBZGQgbGF5ZXIgdG8gc3RhY2tcbiAgICAgICAgICAgICAgICAgICAgY29uc3QgY3VycmVudExheWVyID0ge1xuICAgICAgICAgICAgICAgICAgICAgICAgaWQ6IGxheWVySWQsXG4gICAgICAgICAgICAgICAgICAgICAgICBjb25maWc6IGxheWVyQ29uZmlnLFxuICAgICAgICAgICAgICAgICAgICAgICAgZWxlbWVudDogZGl2LFxuICAgICAgICAgICAgICAgICAgICB9O1xuICAgICAgICAgICAgICAgICAgICB0aGlzLmxheWVycy5wdXNoKGN1cnJlbnRMYXllcik7XG5cbiAgICAgICAgICAgICAgICAgICAgc2V0RGl2RWxlbWVudChkaXYpO1xuICAgICAgICAgICAgICAgICAgICAvLyBBZGQgZW50cnkgYW5pbWF0aW9uIGNsYXNzIGFmdGVyIGEgc2hvcnQgZGVsYXlcbiAgICAgICAgICAgICAgICAgICAgc2V0VGltZW91dCgoKSA9PiB7XG4gICAgICAgICAgICAgICAgICAgICAgICBkaXYuc2V0QXR0cmlidXRlKCdjbGFzcycsICduZi1sYXllci1lbnRlcicpO1xuICAgICAgICAgICAgICAgICAgICB9LCAxMCk7XG5cbiAgICAgICAgICAgICAgICAgICAgLy8gVHJhY2sgZWxlbWVudHMgbW9kaWZpZWQgZm9yIGFjY2Vzc2liaWxpdHlcbiAgICAgICAgICAgICAgICAgICAgY29uc3QgbW9kaWZpZWRFbGVtZW50czogQXJyYXk8e1xuICAgICAgICAgICAgICAgICAgICAgICAgZWxlbWVudDogRWxlbWVudDtcbiAgICAgICAgICAgICAgICAgICAgICAgIGhhZEFyaWFIaWRkZW46IGJvb2xlYW47XG4gICAgICAgICAgICAgICAgICAgICAgICBwcmV2aW91c1ZhbHVlOiBzdHJpbmcgfCBudWxsO1xuICAgICAgICAgICAgICAgICAgICB9PiA9IFtdO1xuICAgICAgICAgICAgICAgICAgICBsZXQgb3JpZ2luYWxCb2R5T3ZlcmZsb3c6IHN0cmluZyB8IG51bGwgPSBudWxsO1xuICAgICAgICAgICAgICAgICAgICBsZXQgb3JpZ2luYWxCb2R5UG9zaXRpb246IHN0cmluZyB8IG51bGwgPSBudWxsO1xuICAgICAgICAgICAgICAgICAgICBsZXQgb3JpZ2luYWxCb2R5V2lkdGg6IHN0cmluZyB8IG51bGwgPSBudWxsO1xuICAgICAgICAgICAgICAgICAgICBsZXQgb3JpZ2luYWxCb2R5VG9wOiBzdHJpbmcgfCBudWxsID0gbnVsbDtcbiAgICAgICAgICAgICAgICAgICAgbGV0IHNjcm9sbFkgPSAwO1xuXG4gICAgICAgICAgICAgICAgICAgIC8vIEFwcGx5IGFyaWEtaGlkZGVuIHRvIHNpYmxpbmdzIGFuZCBib2R5IHNjcm9sbCBsb2NrIGZvciBvdmVybGF5IG1vZGFsc1xuICAgICAgICAgICAgICAgICAgICBpZiAobGF5ZXJDb25maWcub3ZlcmxheSkge1xuICAgICAgICAgICAgICAgICAgICAgICAgLy8gSGlkZSBhbGwgYm9keSBjaGlsZHJlbiBleGNlcHQgdGhpcyBsYXllciBwb3J0YWwsIHNjcmlwdHMsIGFuZCBzdHlsZXNcbiAgICAgICAgICAgICAgICAgICAgICAgIGNvbnN0IGJvZHlDaGlsZHJlbiA9IEFycmF5LmZyb20oZG9jdW1lbnQuYm9keS5jaGlsZHJlbik7XG4gICAgICAgICAgICAgICAgICAgICAgICBib2R5Q2hpbGRyZW4uZm9yRWFjaCgoY2hpbGQpID0+IHtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICBpZiAoXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGNoaWxkICE9PSBkaXYgJiZcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgY2hpbGQuY2xhc3NOYW1lICE9PSAnbmYtbGF5ZXItbWFuYWdlci10b3AnICYmXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGNoaWxkLnRhZ05hbWUgIT09ICdTQ1JJUFQnICYmXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGNoaWxkLnRhZ05hbWUgIT09ICdTVFlMRSdcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICApIHtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgY29uc3QgaGFkQXJpYUhpZGRlbiA9IGNoaWxkLmhhc0F0dHJpYnV0ZSgnYXJpYS1oaWRkZW4nKTtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgY29uc3QgcHJldmlvdXNWYWx1ZSA9IGNoaWxkLmdldEF0dHJpYnV0ZSgnYXJpYS1oaWRkZW4nKTtcblxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAvLyBPbmx5IHNldCBhcmlhLWhpZGRlbiBpZiBub3QgYWxyZWFkeSBoaWRkZW5cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgaWYgKHByZXZpb3VzVmFsdWUgIT09ICd0cnVlJykge1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgY2hpbGQuc2V0QXR0cmlidXRlKCdhcmlhLWhpZGRlbicsICd0cnVlJyk7XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBtb2RpZmllZEVsZW1lbnRzLnB1c2goe1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGVsZW1lbnQ6IGNoaWxkLFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGhhZEFyaWFIaWRkZW4sXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgcHJldmlvdXNWYWx1ZSxcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIH0pO1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICAgICAgICAgICAgfSk7XG5cbiAgICAgICAgICAgICAgICAgICAgICAgIC8vIFByZXZlbnQgYm9keSBzY3JvbGwgb24gaU9TXG4gICAgICAgICAgICAgICAgICAgICAgICBzY3JvbGxZID0gd2luZG93LnNjcm9sbFk7XG4gICAgICAgICAgICAgICAgICAgICAgICBvcmlnaW5hbEJvZHlPdmVyZmxvdyA9IGRvY3VtZW50LmJvZHkuc3R5bGUub3ZlcmZsb3c7XG4gICAgICAgICAgICAgICAgICAgICAgICBvcmlnaW5hbEJvZHlQb3NpdGlvbiA9IGRvY3VtZW50LmJvZHkuc3R5bGUucG9zaXRpb247XG4gICAgICAgICAgICAgICAgICAgICAgICBvcmlnaW5hbEJvZHlXaWR0aCA9IGRvY3VtZW50LmJvZHkuc3R5bGUud2lkdGg7XG4gICAgICAgICAgICAgICAgICAgICAgICBvcmlnaW5hbEJvZHlUb3AgPSBkb2N1bWVudC5ib2R5LnN0eWxlLnRvcDtcblxuICAgICAgICAgICAgICAgICAgICAgICAgZG9jdW1lbnQuYm9keS5zdHlsZS5vdmVyZmxvdyA9ICdoaWRkZW4nO1xuICAgICAgICAgICAgICAgICAgICAgICAgZG9jdW1lbnQuYm9keS5zdHlsZS5wb3NpdGlvbiA9ICdmaXhlZCc7XG4gICAgICAgICAgICAgICAgICAgICAgICBkb2N1bWVudC5ib2R5LnN0eWxlLndpZHRoID0gJzEwMCUnO1xuICAgICAgICAgICAgICAgICAgICAgICAgZG9jdW1lbnQuYm9keS5zdHlsZS50b3AgPSBgLSR7c2Nyb2xsWX1weGA7XG4gICAgICAgICAgICAgICAgICAgIH1cblxuICAgICAgICAgICAgICAgICAgICAvLyBDbGVhbnVwIGZ1bmN0aW9uIC0gcmVtb3ZlIGRpdiB3aGVuIGNvbXBvbmVudCB1bm1vdW50c1xuICAgICAgICAgICAgICAgICAgICByZXR1cm4gKCkgPT4ge1xuICAgICAgICAgICAgICAgICAgICAgICAgLy8gUmVzdG9yZSBhcmlhLWhpZGRlbiBhdHRyaWJ1dGVzXG4gICAgICAgICAgICAgICAgICAgICAgICBtb2RpZmllZEVsZW1lbnRzLmZvckVhY2goKHsgZWxlbWVudCwgaGFkQXJpYUhpZGRlbiwgcHJldmlvdXNWYWx1ZSB9KSA9PiB7XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgaWYgKGRvY3VtZW50LmJvZHkuY29udGFpbnMoZWxlbWVudCkpIHtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgaWYgKGhhZEFyaWFIaWRkZW4gJiYgcHJldmlvdXNWYWx1ZSAhPT0gbnVsbCkge1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgZWxlbWVudC5zZXRBdHRyaWJ1dGUoJ2FyaWEtaGlkZGVuJywgcHJldmlvdXNWYWx1ZSk7XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIH0gZWxzZSB7XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBlbGVtZW50LnJlbW92ZUF0dHJpYnV0ZSgnYXJpYS1oaWRkZW4nKTtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgICAgICAgICAgICAgIH0pO1xuXG4gICAgICAgICAgICAgICAgICAgICAgICAvLyBSZXN0b3JlIGJvZHkgc2Nyb2xsXG4gICAgICAgICAgICAgICAgICAgICAgICBpZiAobGF5ZXJDb25maWcub3ZlcmxheSkge1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgIGRvY3VtZW50LmJvZHkuc3R5bGUub3ZlcmZsb3cgPSBvcmlnaW5hbEJvZHlPdmVyZmxvdyB8fCAnJztcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICBkb2N1bWVudC5ib2R5LnN0eWxlLnBvc2l0aW9uID0gb3JpZ2luYWxCb2R5UG9zaXRpb24gfHwgJyc7XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgZG9jdW1lbnQuYm9keS5zdHlsZS53aWR0aCA9IG9yaWdpbmFsQm9keVdpZHRoIHx8ICcnO1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgIGRvY3VtZW50LmJvZHkuc3R5bGUudG9wID0gb3JpZ2luYWxCb2R5VG9wIHx8ICcnO1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgIHdpbmRvdy5zY3JvbGxUbygwLCBzY3JvbGxZKTtcbiAgICAgICAgICAgICAgICAgICAgICAgIH1cblxuICAgICAgICAgICAgICAgICAgICAgICAgaWYgKGRvY3VtZW50LmJvZHkuY29udGFpbnMoZGl2KSkge1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgIGRvY3VtZW50LmJvZHkucmVtb3ZlQ2hpbGQoZGl2KTtcbiAgICAgICAgICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgICAgICAgICAgICAgIC8vIFJlbW92ZSBmcm9tIGxheWVycyBhcnJheVxuICAgICAgICAgICAgICAgICAgICAgICAgY29uc3QgaW5kZXggPSB0aGlzLmxheWVycy5maW5kSW5kZXgoKGxheWVyKSA9PiBsYXllci5pZCA9PT0gbGF5ZXJJZCk7XG4gICAgICAgICAgICAgICAgICAgICAgICBpZiAoaW5kZXggIT09IC0xKSB7XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgdGhpcy5sYXllcnMuc3BsaWNlKGluZGV4LCAxKTtcbiAgICAgICAgICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgICAgICAgICAgfTtcbiAgICAgICAgICAgICAgICB9LCBbXSk7IC8vIEVtcHR5IGRlcGVuZGVuY3kgYXJyYXkgLSBydW4gb25seSBvbmNlXG5cbiAgICAgICAgICAgICAgICBpZiAoIWRpdkVsZW1lbnQpIHtcbiAgICAgICAgICAgICAgICAgICAgcmV0dXJuIG51bGw7XG4gICAgICAgICAgICAgICAgfVxuXG4gICAgICAgICAgICAgICAgcmV0dXJuIFJlYWN0RE9NLmNyZWF0ZVBvcnRhbChcbiAgICAgICAgICAgICAgICAgICAgPENvbnRhaW5lciBvbkNsaWNrPXtvdmVybGF5Q2xpY2tIYW5kbGVyfSB6SW5kZXg9e2N1cnJlbnRJbmRleH0gey4uLmxheWVyQ29uZmlnfT5cbiAgICAgICAgICAgICAgICAgICAgICAgIHtsYXllckNvbmZpZy5jb21wb25lbnR9XG4gICAgICAgICAgICAgICAgICAgIDwvQ29udGFpbmVyPixcbiAgICAgICAgICAgICAgICAgICAgZGl2RWxlbWVudCxcbiAgICAgICAgICAgICAgICApO1xuICAgICAgICAgICAgfSxcbiAgICAgICAgICAgIGNsb3NlRm4sXG4gICAgICAgIF07XG4gICAgfTtcbn1cblxuLy8gUmV0dXJuIHRoZSBpbnN0YW5jZSBvZiB0aGUgY2xhc3MgdG8gY3JlYXRlIGEgU2luZ2xldG9uLlxuZXhwb3J0IGRlZmF1bHQgbmV3IExheWVyTWFuYWdlcigpO1xuIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWlFa0IifQ== */");
|
|
47
|
+
/** Key code for different keys. */ const KEY_CODES = {
|
|
48
|
+
ESC: 27
|
|
65
49
|
};
|
|
66
50
|
/**
|
|
67
51
|
* This is a shared helper class which manages the z-index of each layer.
|
|
@@ -98,73 +82,94 @@ const KEY_CODES = {
|
|
|
98
82
|
* const { LayerComponent } = this.state;
|
|
99
83
|
* return LayerComponent ? <LayerComponent /> : null;
|
|
100
84
|
* }
|
|
101
|
-
*/
|
|
102
|
-
class LayerManager {
|
|
85
|
+
*/ class LayerManager {
|
|
103
86
|
/**
|
|
104
87
|
* Constructor simply registers a event listener on body to
|
|
105
88
|
* react to esc key press.
|
|
106
|
-
*/
|
|
107
|
-
|
|
108
|
-
/**
|
|
109
|
-
this.
|
|
110
|
-
|
|
111
|
-
this.
|
|
89
|
+
*/ constructor(){
|
|
90
|
+
/** Layer stack */ this.layers = [];
|
|
91
|
+
/** z-index of the next layer */ this.nextIndex = 10000;
|
|
92
|
+
this.timeoutIds = new Map(); // Track timeouts
|
|
93
|
+
// Add cleanup method
|
|
94
|
+
this.destroy = ()=>{
|
|
95
|
+
if (typeof document !== 'undefined' && this.keyupHandler) {
|
|
96
|
+
document.body.removeEventListener('keyup', this.keyupHandler);
|
|
97
|
+
}
|
|
98
|
+
// Clear all pending timeouts
|
|
99
|
+
this.timeoutIds.forEach((id)=>clearTimeout(id));
|
|
100
|
+
this.timeoutIds.clear();
|
|
101
|
+
// Clean up remaining layers
|
|
102
|
+
this.layers.forEach((layer)=>{
|
|
103
|
+
if (document.body.contains(layer.element)) {
|
|
104
|
+
document.body.removeChild(layer.element);
|
|
105
|
+
}
|
|
106
|
+
});
|
|
107
|
+
this.layers = [];
|
|
108
|
+
};
|
|
112
109
|
/**
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
this.unmount = (layer, resp) => {
|
|
110
|
+
* Un-mounts a layer.
|
|
111
|
+
*
|
|
112
|
+
* It first adds a class 'nf-layer-exit' and then un-mounts the
|
|
113
|
+
* layer after the `exitDelay` mentioned in the layer config.
|
|
114
|
+
* This class will help component in triggering the entry animation.
|
|
115
|
+
*
|
|
116
|
+
* @param layer
|
|
117
|
+
*/ this.unmount = (layer, resp)=>{
|
|
122
118
|
layer.element.setAttribute('class', 'nf-layer-exit');
|
|
123
|
-
this.layers.
|
|
124
|
-
|
|
125
|
-
|
|
119
|
+
const index = this.layers.findIndex((item)=>item === layer);
|
|
120
|
+
if (index !== -1) {
|
|
121
|
+
this.layers.splice(index, 1);
|
|
122
|
+
}
|
|
123
|
+
const timeoutId = window.setTimeout(()=>{
|
|
124
|
+
this.timeoutIds.delete(layer.id);
|
|
126
125
|
try {
|
|
127
|
-
|
|
128
|
-
}
|
|
129
|
-
catch (e) {
|
|
130
|
-
// Error in callback function. Ignore and proceed.
|
|
126
|
+
layer.config.closeCallback?.(resp);
|
|
127
|
+
} catch (e) {
|
|
131
128
|
console.warn(e.message);
|
|
132
129
|
}
|
|
130
|
+
// Clear reference to help GC
|
|
131
|
+
layer.config.component = null;
|
|
133
132
|
}, layer.config.exitDelay);
|
|
133
|
+
this.timeoutIds.set(layer.id, timeoutId);
|
|
134
134
|
};
|
|
135
135
|
/**
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
this.renderLayer = (config) => {
|
|
136
|
+
* Renders a layer.
|
|
137
|
+
* @param config
|
|
138
|
+
*/ this.renderLayer = (config)=>{
|
|
140
139
|
// SSR guard
|
|
141
140
|
if (typeof document === 'undefined') {
|
|
142
|
-
return [
|
|
141
|
+
return [
|
|
142
|
+
()=>null,
|
|
143
|
+
()=>{}
|
|
144
|
+
];
|
|
143
145
|
}
|
|
144
146
|
// Merge default config with the provided config.
|
|
145
|
-
const layerConfig =
|
|
147
|
+
const layerConfig = {
|
|
148
|
+
...defaultConfig,
|
|
149
|
+
...config
|
|
150
|
+
};
|
|
146
151
|
// Get the z-index for the new layer
|
|
147
152
|
const currentIndex = layerConfig.alwaysOnTop ? 2147483647 : this.nextIndex++;
|
|
148
153
|
const className = layerConfig.alwaysOnTop ? 'nf-layer-manager-top' : 'nf-layer-manager';
|
|
149
154
|
// Create a unique ID for tracking this layer
|
|
150
155
|
const layerId = `nf-layer-manager-${currentIndex}`;
|
|
151
|
-
const overlayClickHandler = ()
|
|
152
|
-
const layer = this.layers.find((l)
|
|
156
|
+
const overlayClickHandler = ()=>{
|
|
157
|
+
const layer = this.layers.find((l)=>l.id === layerId);
|
|
153
158
|
if (layer && layer.config.closeOnOverlayClick !== false) {
|
|
154
159
|
this.unmount(layer);
|
|
155
160
|
}
|
|
156
161
|
};
|
|
157
|
-
const closeFn = (resp)
|
|
158
|
-
const layer = this.layers.find((l)
|
|
162
|
+
const closeFn = (resp)=>{
|
|
163
|
+
const layer = this.layers.find((l)=>l.id === layerId);
|
|
159
164
|
if (layer) {
|
|
160
165
|
this.unmount(layer, resp);
|
|
161
166
|
}
|
|
162
167
|
};
|
|
163
168
|
// Return callback which will trigger the un-mount.
|
|
164
169
|
return [
|
|
165
|
-
()
|
|
170
|
+
()=>{
|
|
166
171
|
const [divElement, setDivElement] = React.useState(null);
|
|
167
|
-
useEffect(()
|
|
172
|
+
useEffect(()=>{
|
|
168
173
|
// Create the div element only once when component mounts
|
|
169
174
|
const div = document.createElement('div');
|
|
170
175
|
div.setAttribute('class', className);
|
|
@@ -174,12 +179,12 @@ class LayerManager {
|
|
|
174
179
|
const currentLayer = {
|
|
175
180
|
id: layerId,
|
|
176
181
|
config: layerConfig,
|
|
177
|
-
element: div
|
|
182
|
+
element: div
|
|
178
183
|
};
|
|
179
184
|
this.layers.push(currentLayer);
|
|
180
185
|
setDivElement(div);
|
|
181
186
|
// Add entry animation class after a short delay
|
|
182
|
-
setTimeout(()
|
|
187
|
+
setTimeout(()=>{
|
|
183
188
|
div.setAttribute('class', 'nf-layer-enter');
|
|
184
189
|
}, 10);
|
|
185
190
|
// Track elements modified for accessibility
|
|
@@ -193,11 +198,8 @@ class LayerManager {
|
|
|
193
198
|
if (layerConfig.overlay) {
|
|
194
199
|
// Hide all body children except this layer portal, scripts, and styles
|
|
195
200
|
const bodyChildren = Array.from(document.body.children);
|
|
196
|
-
bodyChildren.forEach((child)
|
|
197
|
-
if (child !== div &&
|
|
198
|
-
child.className !== 'nf-layer-manager-top' &&
|
|
199
|
-
child.tagName !== 'SCRIPT' &&
|
|
200
|
-
child.tagName !== 'STYLE') {
|
|
201
|
+
bodyChildren.forEach((child)=>{
|
|
202
|
+
if (child !== div && child.className !== 'nf-layer-manager-top' && child.tagName !== 'SCRIPT' && child.tagName !== 'STYLE') {
|
|
201
203
|
const hadAriaHidden = child.hasAttribute('aria-hidden');
|
|
202
204
|
const previousValue = child.getAttribute('aria-hidden');
|
|
203
205
|
// Only set aria-hidden if not already hidden
|
|
@@ -206,7 +208,7 @@ class LayerManager {
|
|
|
206
208
|
modifiedElements.push({
|
|
207
209
|
element: child,
|
|
208
210
|
hadAriaHidden,
|
|
209
|
-
previousValue
|
|
211
|
+
previousValue
|
|
210
212
|
});
|
|
211
213
|
}
|
|
212
214
|
}
|
|
@@ -223,14 +225,13 @@ class LayerManager {
|
|
|
223
225
|
document.body.style.top = `-${scrollY}px`;
|
|
224
226
|
}
|
|
225
227
|
// Cleanup function - remove div when component unmounts
|
|
226
|
-
return ()
|
|
228
|
+
return ()=>{
|
|
227
229
|
// Restore aria-hidden attributes
|
|
228
|
-
modifiedElements.forEach(({ element, hadAriaHidden, previousValue })
|
|
230
|
+
modifiedElements.forEach(({ element, hadAriaHidden, previousValue })=>{
|
|
229
231
|
if (document.body.contains(element)) {
|
|
230
232
|
if (hadAriaHidden && previousValue !== null) {
|
|
231
233
|
element.setAttribute('aria-hidden', previousValue);
|
|
232
|
-
}
|
|
233
|
-
else {
|
|
234
|
+
} else {
|
|
234
235
|
element.removeAttribute('aria-hidden');
|
|
235
236
|
}
|
|
236
237
|
}
|
|
@@ -247,7 +248,7 @@ class LayerManager {
|
|
|
247
248
|
document.body.removeChild(div);
|
|
248
249
|
}
|
|
249
250
|
// Remove from layers array
|
|
250
|
-
const index = this.layers.findIndex((layer)
|
|
251
|
+
const index = this.layers.findIndex((layer)=>layer.id === layerId);
|
|
251
252
|
if (index !== -1) {
|
|
252
253
|
this.layers.splice(index, 1);
|
|
253
254
|
}
|
|
@@ -256,23 +257,31 @@ class LayerManager {
|
|
|
256
257
|
if (!divElement) {
|
|
257
258
|
return null;
|
|
258
259
|
}
|
|
259
|
-
return ReactDOM.createPortal(
|
|
260
|
+
return /*#__PURE__*/ ReactDOM.createPortal(/*#__PURE__*/ jsx(Container, {
|
|
261
|
+
onClick: overlayClickHandler,
|
|
262
|
+
zIndex: currentIndex,
|
|
263
|
+
...layerConfig,
|
|
264
|
+
children: layerConfig.component
|
|
265
|
+
}), divElement);
|
|
260
266
|
},
|
|
261
|
-
closeFn
|
|
267
|
+
closeFn
|
|
262
268
|
];
|
|
263
269
|
};
|
|
264
270
|
if (typeof document !== 'undefined') {
|
|
265
|
-
|
|
271
|
+
// Store handler reference for cleanup
|
|
272
|
+
this.keyupHandler = (e)=>{
|
|
266
273
|
if (this.layers.length && e.keyCode === KEY_CODES.ESC) {
|
|
267
274
|
const lastLayer = this.layers.slice(-1)[0];
|
|
268
275
|
if (lastLayer.config.closeOnEsc !== false) {
|
|
269
276
|
this.unmount(lastLayer);
|
|
270
277
|
}
|
|
271
278
|
}
|
|
272
|
-
}
|
|
279
|
+
};
|
|
280
|
+
document.body.addEventListener('keyup', this.keyupHandler);
|
|
273
281
|
}
|
|
274
282
|
}
|
|
275
283
|
}
|
|
276
284
|
// Return the instance of the class to create a Singleton.
|
|
277
|
-
|
|
278
|
-
|
|
285
|
+
var LayerManager$1 = new LayerManager();
|
|
286
|
+
|
|
287
|
+
export { LAYER_POSITION, LayerManager$1 as default };
|
|
@@ -1,34 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
(function (THEME_CONSTANTS) {
|
|
3
|
-
THEME_CONSTANTS["PRIMARY"] = "#1f7ac5";
|
|
4
|
-
THEME_CONSTANTS["PRIMARY_LIGHT"] = "#64baff";
|
|
5
|
-
THEME_CONSTANTS["PRIMARY_LIGHTER"] = "#cfe9ff";
|
|
6
|
-
THEME_CONSTANTS["BACKDROP_COLOR"] = "#2681da80";
|
|
7
|
-
THEME_CONSTANTS["INFO"] = "#1f7ac5ff";
|
|
8
|
-
THEME_CONSTANTS["INFO_LIGHT"] = "#64baffff";
|
|
9
|
-
THEME_CONSTANTS["SUCCESS"] = "#1a835f";
|
|
10
|
-
THEME_CONSTANTS["SUCCESS_LIGHT"] = "#80eac6";
|
|
11
|
-
THEME_CONSTANTS["WARNING"] = "#916b01";
|
|
12
|
-
THEME_CONSTANTS["WARNING_LIGHT"] = "#ffba00";
|
|
13
|
-
THEME_CONSTANTS["ERROR"] = "#bb2828";
|
|
14
|
-
THEME_CONSTANTS["ERROR_LIGHT"] = "#f1a5a5";
|
|
15
|
-
THEME_CONSTANTS["BORDER_COLOR"] = "#555555";
|
|
16
|
-
THEME_CONSTANTS["TOAST"] = "#5f5f5f";
|
|
17
|
-
THEME_CONSTANTS["TOOLTIP_COLOR"] = "rgba(0,0,0,0.6)";
|
|
18
|
-
THEME_CONSTANTS["BORDER_LIGHT_COLOR"] = "#eeeeee";
|
|
19
|
-
THEME_CONSTANTS["BACKGROUND"] = "#ffffff";
|
|
20
|
-
THEME_CONSTANTS["DISABLED_BACKGROUND"] = "#fafafa";
|
|
21
|
-
THEME_CONSTANTS["DISABLED_BORDER"] = "#aaa";
|
|
22
|
-
THEME_CONSTANTS["LIGHT_GREY"] = "#ccc";
|
|
23
|
-
THEME_CONSTANTS["DISABLED"] = "#737373";
|
|
24
|
-
THEME_CONSTANTS["TEXT_COLOR_LIGHT"] = "#fff";
|
|
25
|
-
THEME_CONSTANTS["TEXT_COLOR_DARK"] = "#000";
|
|
26
|
-
THEME_CONSTANTS["SHADOW"] = "0px 1px 3px 0px rgba(0,0,0,0.1), 0px 1px 2px 0px rgba(0,0,0,0.06)";
|
|
27
|
-
THEME_CONSTANTS["HOVER_SHADOW"] = "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)";
|
|
28
|
-
THEME_CONSTANTS["MODAL_SHADOW"] = "0px 8px 17px 2px rgba(0,0,0,0.14), 0px 3px 14px 2px rgba(0,0,0,0.12), 0px 5px 5px -3px rgba(0,0,0,0.2)";
|
|
29
|
-
})(THEME_CONSTANTS || (THEME_CONSTANTS = {}));
|
|
30
|
-
export var THEME_NAME;
|
|
31
|
-
(function (THEME_NAME) {
|
|
1
|
+
var THEME_NAME = /*#__PURE__*/ function(THEME_NAME) {
|
|
32
2
|
THEME_NAME["PRIMARY"] = "--nfui-primary";
|
|
33
3
|
THEME_NAME["PRIMARY_LIGHT"] = "--nfui-primary-light";
|
|
34
4
|
THEME_NAME["PRIMARY_LIGHTER"] = "--nfui-primary-lighter";
|
|
@@ -55,36 +25,38 @@ export var THEME_NAME;
|
|
|
55
25
|
THEME_NAME["HOVER_SHADOW"] = "--nfui-hover-shadow";
|
|
56
26
|
THEME_NAME["MODAL_SHADOW"] = "--nfui-modal-shadow";
|
|
57
27
|
THEME_NAME["BACKDROP_COLOR"] = "--nfui-backdrop-color";
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
[
|
|
62
|
-
[
|
|
63
|
-
[
|
|
64
|
-
[
|
|
65
|
-
[
|
|
66
|
-
[
|
|
67
|
-
[
|
|
68
|
-
[
|
|
69
|
-
[
|
|
70
|
-
[
|
|
71
|
-
[
|
|
72
|
-
[
|
|
73
|
-
[
|
|
74
|
-
[
|
|
75
|
-
[
|
|
76
|
-
[
|
|
77
|
-
[
|
|
78
|
-
[
|
|
79
|
-
[
|
|
80
|
-
[
|
|
81
|
-
[
|
|
82
|
-
[
|
|
83
|
-
[
|
|
84
|
-
[
|
|
85
|
-
[
|
|
28
|
+
return THEME_NAME;
|
|
29
|
+
}({});
|
|
30
|
+
const themeNameMap = {
|
|
31
|
+
["--nfui-primary"]: "#1f7ac5",
|
|
32
|
+
["--nfui-primary-light"]: "#64baff",
|
|
33
|
+
["--nfui-primary-lighter"]: "#cfe9ff",
|
|
34
|
+
["--nfui-info"]: "#1f7ac5ff",
|
|
35
|
+
["--nfui-info-light"]: "#64baffff",
|
|
36
|
+
["--nfui-success"]: "#1a835f",
|
|
37
|
+
["--nfui-success-light"]: "#80eac6",
|
|
38
|
+
["--nfui-warning"]: "#916b01",
|
|
39
|
+
["--nfui-warning-light"]: "#ffba00",
|
|
40
|
+
["--nfui-error"]: "#bb2828",
|
|
41
|
+
["--nfui-error-light"]: "#f1a5a5",
|
|
42
|
+
["--nfui-backdrop-color"]: "#2681da80",
|
|
43
|
+
["--nfui-border-color"]: "#555555",
|
|
44
|
+
["--nfui-toast"]: "#5f5f5f",
|
|
45
|
+
["--nfui-tooltip-color"]: "rgba(0,0,0,0.6)",
|
|
46
|
+
["--nfui-border-light-color"]: "#eeeeee",
|
|
47
|
+
["--nfui-background"]: "#ffffff",
|
|
48
|
+
["--nfui-disabled-background"]: "#fafafa",
|
|
49
|
+
["--nfui-disabled-border"]: "#aaa",
|
|
50
|
+
["--nfui-light-grey"]: "#ccc",
|
|
51
|
+
["--nfui-disabled"]: "#737373",
|
|
52
|
+
["--nfui-text-color-light"]: "#fff",
|
|
53
|
+
["--nfui-text-color-dark"]: "#000",
|
|
54
|
+
["--nfui-shadow"]: "0px 1px 3px 0px rgba(0,0,0,0.1), 0px 1px 2px 0px rgba(0,0,0,0.06)",
|
|
55
|
+
["--nfui-hover-shadow"]: "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
|
|
56
|
+
["--nfui-modal-shadow"]: "0px 8px 17px 2px rgba(0,0,0,0.14), 0px 3px 14px 2px rgba(0,0,0,0.12), 0px 5px 5px -3px rgba(0,0,0,0.2)"
|
|
86
57
|
};
|
|
87
|
-
|
|
58
|
+
const getThemeValue = (key)=>{
|
|
88
59
|
return `var(${key}, ${themeNameMap[key]})`;
|
|
89
60
|
};
|
|
90
|
-
|
|
61
|
+
|
|
62
|
+
export { THEME_NAME, getThemeValue, themeNameMap };
|
|
@@ -14,4 +14,3 @@ export declare const Footer: import("@emotion/styled").StyledComponent<{
|
|
|
14
14
|
theme?: import("@emotion/react").Theme;
|
|
15
15
|
as?: React.ElementType;
|
|
16
16
|
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
17
|
-
//# sourceMappingURL=styles.d.ts.map
|
package/lib-esm/shared/styles.js
CHANGED
|
@@ -1,27 +1,21 @@
|
|
|
1
1
|
import styled from '@emotion/styled';
|
|
2
|
-
import { getThemeValue, THEME_NAME } from './constants';
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
export
|
|
22
|
-
padding: 10px 15px;
|
|
23
|
-
border-top: 1px solid ${getThemeValue(THEME_NAME.BORDER_LIGHT_COLOR)};
|
|
24
|
-
display: flex;
|
|
25
|
-
justify-content: flex-end;
|
|
26
|
-
`;
|
|
27
|
-
//# sourceMappingURL=styles.js.map
|
|
2
|
+
import { getThemeValue, THEME_NAME } from './constants.js';
|
|
3
|
+
|
|
4
|
+
const Ellipsis = /*#__PURE__*/ styled("span", {
|
|
5
|
+
target: "e126ntv90",
|
|
6
|
+
label: "Ellipsis"
|
|
7
|
+
})("white-space:nowrap;text-overflow:ellipsis;overflow:hidden;flex:1;", "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvbm8tZnJpbGxzLXVpL25vLWZyaWxscy11aS9zcmMvc2hhcmVkL3N0eWxlcy50cyIsInNvdXJjZXMiOlsiL2hvbWUvcnVubmVyL3dvcmsvbm8tZnJpbGxzLXVpL25vLWZyaWxscy11aS9zcmMvc2hhcmVkL3N0eWxlcy50cyJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBnZXRUaGVtZVZhbHVlLCBUSEVNRV9OQU1FIH0gZnJvbSAnLi9jb25zdGFudHMnO1xuXG5leHBvcnQgY29uc3QgRWxsaXBzaXMgPSBzdHlsZWQuc3BhbmBcbiAgICB3aGl0ZS1zcGFjZTogbm93cmFwO1xuICAgIHRleHQtb3ZlcmZsb3c6IGVsbGlwc2lzO1xuICAgIG92ZXJmbG93OiBoaWRkZW47XG4gICAgZmxleDogMTtcbmA7XG5cbmV4cG9ydCBjb25zdCBIZWFkZXIgPSBzdHlsZWQuaDFgXG4gICAgcGFkZGluZzogMTBweCAxNXB4O1xuICAgIGxpbmUtaGVpZ2h0OiAyNnB4O1xuICAgIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCAke2dldFRoZW1lVmFsdWUoVEhFTUVfTkFNRS5CT1JERVJfTElHSFRfQ09MT1IpfTtcbiAgICBmb250LXNpemU6IDE2cHg7XG4gICAgZm9udC13ZWlnaHQ6IGJvbGQ7XG5gO1xuXG5leHBvcnQgY29uc3QgQm9keSA9IHN0eWxlZC5kaXZgXG4gICAgcGFkZGluZzogMjBweCAxNXB4O1xuICAgIGZsZXg6IDE7XG4gICAgb3ZlcmZsb3c6IGF1dG87XG5gO1xuXG5leHBvcnQgY29uc3QgRm9vdGVyID0gc3R5bGVkLmRpdmBcbiAgICBwYWRkaW5nOiAxMHB4IDE1cHg7XG4gICAgYm9yZGVyLXRvcDogMXB4IHNvbGlkICR7Z2V0VGhlbWVWYWx1ZShUSEVNRV9OQU1FLkJPUkRFUl9MSUdIVF9DT0xPUil9O1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAganVzdGlmeS1jb250ZW50OiBmbGV4LWVuZDtcbmA7XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBR3dCIn0= */");
|
|
8
|
+
const Header = /*#__PURE__*/ styled("h1", {
|
|
9
|
+
target: "e126ntv91",
|
|
10
|
+
label: "Header"
|
|
11
|
+
})("padding:10px 15px;line-height:26px;border-bottom:1px solid ", getThemeValue(THEME_NAME.BORDER_LIGHT_COLOR), ";font-size:16px;font-weight:bold;", "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvbm8tZnJpbGxzLXVpL25vLWZyaWxscy11aS9zcmMvc2hhcmVkL3N0eWxlcy50cyIsInNvdXJjZXMiOlsiL2hvbWUvcnVubmVyL3dvcmsvbm8tZnJpbGxzLXVpL25vLWZyaWxscy11aS9zcmMvc2hhcmVkL3N0eWxlcy50cyJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBnZXRUaGVtZVZhbHVlLCBUSEVNRV9OQU1FIH0gZnJvbSAnLi9jb25zdGFudHMnO1xuXG5leHBvcnQgY29uc3QgRWxsaXBzaXMgPSBzdHlsZWQuc3BhbmBcbiAgICB3aGl0ZS1zcGFjZTogbm93cmFwO1xuICAgIHRleHQtb3ZlcmZsb3c6IGVsbGlwc2lzO1xuICAgIG92ZXJmbG93OiBoaWRkZW47XG4gICAgZmxleDogMTtcbmA7XG5cbmV4cG9ydCBjb25zdCBIZWFkZXIgPSBzdHlsZWQuaDFgXG4gICAgcGFkZGluZzogMTBweCAxNXB4O1xuICAgIGxpbmUtaGVpZ2h0OiAyNnB4O1xuICAgIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCAke2dldFRoZW1lVmFsdWUoVEhFTUVfTkFNRS5CT1JERVJfTElHSFRfQ09MT1IpfTtcbiAgICBmb250LXNpemU6IDE2cHg7XG4gICAgZm9udC13ZWlnaHQ6IGJvbGQ7XG5gO1xuXG5leHBvcnQgY29uc3QgQm9keSA9IHN0eWxlZC5kaXZgXG4gICAgcGFkZGluZzogMjBweCAxNXB4O1xuICAgIGZsZXg6IDE7XG4gICAgb3ZlcmZsb3c6IGF1dG87XG5gO1xuXG5leHBvcnQgY29uc3QgRm9vdGVyID0gc3R5bGVkLmRpdmBcbiAgICBwYWRkaW5nOiAxMHB4IDE1cHg7XG4gICAgYm9yZGVyLXRvcDogMXB4IHNvbGlkICR7Z2V0VGhlbWVWYWx1ZShUSEVNRV9OQU1FLkJPUkRFUl9MSUdIVF9DT0xPUil9O1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAganVzdGlmeS1jb250ZW50OiBmbGV4LWVuZDtcbmA7XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBVXNCIn0= */");
|
|
12
|
+
const Body = /*#__PURE__*/ styled("div", {
|
|
13
|
+
target: "e126ntv92",
|
|
14
|
+
label: "Body"
|
|
15
|
+
})("padding:20px 15px;flex:1;overflow:auto;", "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvbm8tZnJpbGxzLXVpL25vLWZyaWxscy11aS9zcmMvc2hhcmVkL3N0eWxlcy50cyIsInNvdXJjZXMiOlsiL2hvbWUvcnVubmVyL3dvcmsvbm8tZnJpbGxzLXVpL25vLWZyaWxscy11aS9zcmMvc2hhcmVkL3N0eWxlcy50cyJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBnZXRUaGVtZVZhbHVlLCBUSEVNRV9OQU1FIH0gZnJvbSAnLi9jb25zdGFudHMnO1xuXG5leHBvcnQgY29uc3QgRWxsaXBzaXMgPSBzdHlsZWQuc3BhbmBcbiAgICB3aGl0ZS1zcGFjZTogbm93cmFwO1xuICAgIHRleHQtb3ZlcmZsb3c6IGVsbGlwc2lzO1xuICAgIG92ZXJmbG93OiBoaWRkZW47XG4gICAgZmxleDogMTtcbmA7XG5cbmV4cG9ydCBjb25zdCBIZWFkZXIgPSBzdHlsZWQuaDFgXG4gICAgcGFkZGluZzogMTBweCAxNXB4O1xuICAgIGxpbmUtaGVpZ2h0OiAyNnB4O1xuICAgIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCAke2dldFRoZW1lVmFsdWUoVEhFTUVfTkFNRS5CT1JERVJfTElHSFRfQ09MT1IpfTtcbiAgICBmb250LXNpemU6IDE2cHg7XG4gICAgZm9udC13ZWlnaHQ6IGJvbGQ7XG5gO1xuXG5leHBvcnQgY29uc3QgQm9keSA9IHN0eWxlZC5kaXZgXG4gICAgcGFkZGluZzogMjBweCAxNXB4O1xuICAgIGZsZXg6IDE7XG4gICAgb3ZlcmZsb3c6IGF1dG87XG5gO1xuXG5leHBvcnQgY29uc3QgRm9vdGVyID0gc3R5bGVkLmRpdmBcbiAgICBwYWRkaW5nOiAxMHB4IDE1cHg7XG4gICAgYm9yZGVyLXRvcDogMXB4IHNvbGlkICR7Z2V0VGhlbWVWYWx1ZShUSEVNRV9OQU1FLkJPUkRFUl9MSUdIVF9DT0xPUil9O1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAganVzdGlmeS1jb250ZW50OiBmbGV4LWVuZDtcbmA7XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBa0JvQiJ9 */");
|
|
16
|
+
const Footer = /*#__PURE__*/ styled("div", {
|
|
17
|
+
target: "e126ntv93",
|
|
18
|
+
label: "Footer"
|
|
19
|
+
})("padding:10px 15px;border-top:1px solid ", getThemeValue(THEME_NAME.BORDER_LIGHT_COLOR), ";display:flex;justify-content:flex-end;", "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvbm8tZnJpbGxzLXVpL25vLWZyaWxscy11aS9zcmMvc2hhcmVkL3N0eWxlcy50cyIsInNvdXJjZXMiOlsiL2hvbWUvcnVubmVyL3dvcmsvbm8tZnJpbGxzLXVpL25vLWZyaWxscy11aS9zcmMvc2hhcmVkL3N0eWxlcy50cyJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBnZXRUaGVtZVZhbHVlLCBUSEVNRV9OQU1FIH0gZnJvbSAnLi9jb25zdGFudHMnO1xuXG5leHBvcnQgY29uc3QgRWxsaXBzaXMgPSBzdHlsZWQuc3BhbmBcbiAgICB3aGl0ZS1zcGFjZTogbm93cmFwO1xuICAgIHRleHQtb3ZlcmZsb3c6IGVsbGlwc2lzO1xuICAgIG92ZXJmbG93OiBoaWRkZW47XG4gICAgZmxleDogMTtcbmA7XG5cbmV4cG9ydCBjb25zdCBIZWFkZXIgPSBzdHlsZWQuaDFgXG4gICAgcGFkZGluZzogMTBweCAxNXB4O1xuICAgIGxpbmUtaGVpZ2h0OiAyNnB4O1xuICAgIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCAke2dldFRoZW1lVmFsdWUoVEhFTUVfTkFNRS5CT1JERVJfTElHSFRfQ09MT1IpfTtcbiAgICBmb250LXNpemU6IDE2cHg7XG4gICAgZm9udC13ZWlnaHQ6IGJvbGQ7XG5gO1xuXG5leHBvcnQgY29uc3QgQm9keSA9IHN0eWxlZC5kaXZgXG4gICAgcGFkZGluZzogMjBweCAxNXB4O1xuICAgIGZsZXg6IDE7XG4gICAgb3ZlcmZsb3c6IGF1dG87XG5gO1xuXG5leHBvcnQgY29uc3QgRm9vdGVyID0gc3R5bGVkLmRpdmBcbiAgICBwYWRkaW5nOiAxMHB4IDE1cHg7XG4gICAgYm9yZGVyLXRvcDogMXB4IHNvbGlkICR7Z2V0VGhlbWVWYWx1ZShUSEVNRV9OQU1FLkJPUkRFUl9MSUdIVF9DT0xPUil9O1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAganVzdGlmeS1jb250ZW50OiBmbGV4LWVuZDtcbmA7XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBd0JzQiJ9 */");
|
|
20
|
+
|
|
21
|
+
export { Body, Ellipsis, Footer, Header };
|
package/package.json
CHANGED
|
@@ -1,19 +1,27 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "no-frills-ui",
|
|
3
|
-
"version": "0.0.14-alpha.
|
|
3
|
+
"version": "0.0.14-alpha.6",
|
|
4
4
|
"description": "React components that are made of styled native components. Mostly!",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
|
-
"module": "lib-esm/index.js",
|
|
7
|
-
"jsnext:main": "lib-esm/index.js",
|
|
8
|
-
"types": "lib-esm/index.d.ts",
|
|
6
|
+
"module": "lib-esm/components/index.js",
|
|
7
|
+
"jsnext:main": "lib-esm/components/index.js",
|
|
8
|
+
"types": "lib-esm/components/index.d.ts",
|
|
9
9
|
"sideEffects": false,
|
|
10
|
+
"exports": {
|
|
11
|
+
".": {
|
|
12
|
+
"types": "./lib-esm/components/index.d.ts",
|
|
13
|
+
"import": "./lib-esm/components/index.js",
|
|
14
|
+
"require": "./dist/index.js"
|
|
15
|
+
}
|
|
16
|
+
},
|
|
10
17
|
"files": [
|
|
11
18
|
"dist",
|
|
12
19
|
"lib-esm"
|
|
13
20
|
],
|
|
14
21
|
"scripts": {
|
|
15
22
|
"clean": "shx rm -rf dist lib-esm",
|
|
16
|
-
"build": "tsc && rollup -c",
|
|
23
|
+
"build": "NODE_ENV=production tsc --emitDeclarationOnly && rollup -c",
|
|
24
|
+
"build:dev": "NODE_ENV=development tsc --emitDeclarationOnly && rollup -c",
|
|
17
25
|
"test": "echo \"Warning: No tests implemented yet\" && exit 0",
|
|
18
26
|
"lint": "eslint . --ext .js,.jsx,.mjs,.ts,.tsx",
|
|
19
27
|
"lint:fix": "eslint . --ext .js,.jsx,.mjs,.ts,.tsx --fix",
|
|
@@ -47,6 +55,8 @@
|
|
|
47
55
|
},
|
|
48
56
|
"devDependencies": {
|
|
49
57
|
"@rollup/plugin-node-resolve": "^8.0.1",
|
|
58
|
+
"@rollup/plugin-swc": "^0.4.0",
|
|
59
|
+
"@rollup/plugin-terser": "^0.4.4",
|
|
50
60
|
"@storybook/addon-docs": "^10.0.2",
|
|
51
61
|
"@storybook/addon-links": "^10.0.2",
|
|
52
62
|
"@storybook/addon-webpack5-compiler-swc": "^4.0.1",
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAoC,iBAAiB,EAAkB,MAAM,OAAO,CAAC;AAC5F,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,iBAAS,SAAS,CAAC,KAAK,EAAE,iBAAiB,CAAC,cAAc,CAAC,oDA6B1D;kBA7BQ,SAAS;;QAkCd,4BAA4B;;QAE5B,wCAAwC;;;;;;;AAL5C,KAAK,cAAc,GAAG,SAAS,CAAC,UAAU,CAAC,OAAO,SAAS,CAAC,SAAS,CAAC,CAAC;AAavE,eAAe,SAAS,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Accordion.js","sourceRoot":"","sources":["../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,YAAY,EAAqB,cAAc,EAAE,MAAM,OAAO,CAAC;AAC5F,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,SAAS,SAAS,CAAC,KAAwC;IACvD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;IAEnD,MAAM,WAAW,GAAG,CAAC,KAAa,EAAE,QAAiB,EAAE,EAAE,CAAC,GAAG,EAAE;QAC3D,IAAI,QAAQ,EAAE,CAAC;YACX,OAAO;QACX,CAAC;QAED,MAAM,QAAQ,GAAG,KAAK,KAAK,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAC/C,IAAI,KAAK,CAAC,WAAW,EAAE,CAAC;YACpB,KAAK,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC;QAChC,CAAC;aAAM,CAAC;YACJ,SAAS,CAAC,QAAQ,CAAC,CAAC;QACxB,CAAC;IACL,CAAC,CAAC;IAEF,OAAO,CACH,4BACK,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE;YAC3C,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,CAAC;gBACzB,OAAO,KAAK,CAAC;YACjB,CAAC;YACD,OAAO,YAAY,CAAC,KAAK,EAAE;gBACvB,IAAI,EAAE,MAAM,KAAK,KAAK;gBACtB,WAAW,EAAE,WAAW,CAAC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,QAAQ,CAAC;aACzB,CAAC,CAAC;QACtC,CAAC,CAAC,GACH,CACN,CAAC;AACN,CAAC;AAID,SAAS,CAAC,SAAS,GAAG;IAClB,4BAA4B;IAC5B,MAAM,EAAE,SAAS,CAAC,MAAM;IACxB,wCAAwC;IACxC,WAAW,EAAE,SAAS,CAAC,IAAI;CAC9B,CAAC;AAEF,SAAS,CAAC,YAAY,GAAG;IACrB,MAAM,EAAE,CAAC,CAAC;CACb,CAAC;AAEF,eAAe,SAAS,CAAC","sourcesContent":["import { useState, Children, cloneElement, PropsWithChildren, isValidElement } from 'react';\nimport PropTypes from 'prop-types';\n\nfunction Accordion(props: PropsWithChildren<AccordionProps>) {\n const [active, setActive] = useState(props.active);\n\n const onStepClick = (index: number, disabled: boolean) => () => {\n if (disabled) {\n return;\n }\n\n const newIndex = index !== active ? index : -1;\n if (props.onStepClick) {\n props.onStepClick(newIndex);\n } else {\n setActive(newIndex);\n }\n };\n\n return (\n <>\n {Children.map(props.children, (child, index) => {\n if (!isValidElement(child)) {\n return child;\n }\n return cloneElement(child, {\n open: active === index,\n onStepClick: onStepClick(index, child.props.disabled),\n } as Partial<typeof child.props>);\n })}\n </>\n );\n}\n\ntype AccordionProps = PropTypes.InferProps<typeof Accordion.propTypes>;\n\nAccordion.propTypes = {\n /** Currently opened step */\n active: PropTypes.number,\n /** Handler for click event on a step */\n onStepClick: PropTypes.func,\n};\n\nAccordion.defaultProps = {\n active: -1,\n};\n\nexport default Accordion;\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"AccordionStep.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/AccordionStep.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0B,MAAM,OAAO,CAAC;AAC/C,OAAO,SAAS,MAAM,YAAY,CAAC;AAkFnC,eAAO,MAAM,iBAAiB;;SAlEY,MAAQ,WAAU;qFAoE3D,CAAC;AAEF,eAAO,MAAM,mBAAmB;;SAtEU,MAAQ,WAAU;qFA2E3D,CAAC;AAEF,iBAAwB,aAAa,CAAC,KAAK,EAAE,KAAK,CAAC,iBAAiB,CAAC,kBAAkB,CAAC,oDAmDvF;kBAnDuB,aAAa;;QAsDjC,+BAA+B;;QAE/B,8BAA8B;;QAE9B,4CAA4C;;QAE5C,8BAA8B;;;;;;;;eA5DV,aAAa;AAqErC,KAAK,kBAAkB,GAAG,SAAS,CAAC,UAAU,CAAC,OAAO,aAAa,CAAC,SAAS,CAAC,GAAG;IAC7E,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;CAC5B,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"AccordionStep.js","sourceRoot":"","sources":["../../../src/components/Accordion/AccordionStep.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useState, useId } from 'react';\nimport PropTypes from 'prop-types';\nimport { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { FiberManualRecord, ExpandMore } from '../../icons';\nimport { THEME_NAME, getThemeValue } from '../../shared/constants';\nimport { Ellipsis } from '../../shared/styles';\nimport { Badge, BADGE_TYPE } from '../Badge';\nimport { Card } from '../Card';\n\nconst Step = styled(Card)<AccordionStepProps>`\n transition: all 0.6s ease;\n overflow: visible;\n\n ${(props) => props.open && `margin: 20px 5px;`}\n`;\n\nconst StepHeader = styled.button<{ open: boolean; disabled: boolean }>`\n padding: 20px 15px;\n display: flex;\n justify-content: space-between;\n background: none;\n border: none;\n border-radius: 10px;\n width: 100%;\n font-size: inherit;\n color: ${getThemeValue(THEME_NAME.TEXT_COLOR_DARK)};\n\n &:focus-visible {\n box-shadow: 0 0 0 4px ${getThemeValue(THEME_NAME.PRIMARY_LIGHT)};\n }\n\n & input {\n appearance: none;\n margin: 0;\n }\n\n ${(props) =>\n props.open && `border-bottom: 1px solid ${getThemeValue(THEME_NAME.BORDER_LIGHT_COLOR)};`}\n\n ${(props) => props.disabled && `color: ${getThemeValue(THEME_NAME.DISABLED)};`}\n`;\n\nconst HeaderContainer = styled.div<{ open: boolean; completed: boolean }>`\n display: flex;\n align-items: center;\n min-width: 40px;\n\n & svg {\n vertical-align: top;\n margin-right: 10px;\n fill: ${(props) =>\n props.open\n ? getThemeValue(THEME_NAME.PRIMARY)\n : props.completed\n ? getThemeValue(THEME_NAME.SUCCESS)\n : getThemeValue(THEME_NAME.LIGHT_GREY)};\n transform: ${(props) => (props.open ? 'scale(0.8)' : 'scale(0.6)')};\n transition: all 0.3s ease;\n min-width: 24px;\n }\n`;\n\nconst ExpandContainer = styled.div<{ open: boolean }>`\n display: flex;\n align-items: center;\n\n & svg {\n vertical-align: top;\n margin-right: 10px;\n transition: all 0.6s ease;\n fill: currentColor;\n }\n\n ${(props) => (props.open ? `& svg { transform: rotate(180deg); }` : '')}\n`;\n\nconst StepBody = styled.div<{ height: number }>`\n transition: all 0.6s ease;\n overflow: hidden;\n height: ${(props) => props.height || 0}px;\n`;\n\nexport const AccordionStepBody = styled.div`\n padding: 20px 15px;\n`;\n\nexport const AccordionStepFooter = styled.div`\n display: flex;\n justify-content: flex-end;\n padding: 10px 15px;\n border-top: 1px solid ${getThemeValue(THEME_NAME.BORDER_LIGHT_COLOR)};\n`;\n\nexport default function AccordionStep(props: React.PropsWithChildren<AccordionStepProps>) {\n const [height, setHeight] = useState(0);\n const { open, disabled, header, errorText, completed, onStepClick } = props;\n\n // Generate unique IDs for ARIA relationships\n const headerId = useId();\n const regionId = useId();\n\n const ref = (el?: HTMLDivElement) => setHeight(el?.scrollHeight || 0);\n\n return (\n <Step {...props} elevated={props.open}>\n <StepHeader\n open={open}\n disabled={disabled}\n onClick={onStepClick}\n aria-expanded={open ? 'true' : 'false'}\n aria-controls={regionId}\n id={headerId}\n >\n <HeaderContainer open={open} completed={completed}>\n <FiberManualRecord aria-hidden=\"true\" />\n <Ellipsis>{header}</Ellipsis>\n </HeaderContainer>\n <ExpandContainer open={open}>\n {errorText && (\n <Badge\n css={css`\n margin-right: 15px;\n `}\n inline\n type={BADGE_TYPE.DANGER}\n >\n {errorText}\n </Badge>\n )}\n <ExpandMore aria-hidden=\"true\" />\n </ExpandContainer>\n </StepHeader>\n <StepBody\n ref={ref}\n height={open ? height : 0}\n role=\"region\"\n id={regionId}\n aria-labelledby={headerId}\n aria-hidden={open ? 'false' : 'true'}\n >\n {open && props.children}\n </StepBody>\n </Step>\n );\n}\n\nAccordionStep.propTypes = {\n /** Header text for the step */\n header: PropTypes.string.isRequired,\n /** Error text for the step */\n errorText: PropTypes.string,\n /** If steps has been marked as completed */\n completed: PropTypes.bool,\n /** If the step is disabled */\n disabled: PropTypes.bool,\n};\n\nAccordionStep.defaultProps = {\n completed: false,\n disabled: false,\n};\n\ntype AccordionStepProps = PropTypes.InferProps<typeof AccordionStep.propTypes> & {\n open?: boolean;\n completed: boolean;\n onStepClick?: () => void;\n};\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC"}
|