@spothero/ui 22.3.2 → 22.3.9-beta.0
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.cjs.js +54151 -0
- package/dist/index.cjs.js.map +1 -0
- package/dist/index.esm.js +53999 -0
- package/dist/index.esm.js.map +1 -0
- package/package.json +39 -40
- package/dist/components/Accordion/Accordion.stories.js +0 -91
- package/dist/components/Accordion/AccordionActionButton.js +0 -29
- package/dist/components/Accordion/index.js +0 -44
- package/dist/components/Accordion/styles/index.js +0 -76
- package/dist/components/Alert/Alert.js +0 -83
- package/dist/components/Alert/Alert.stories.js +0 -49
- package/dist/components/Alert/index.js +0 -13
- package/dist/components/AutoSuggestSelect/AutoSuggestSelect.js +0 -148
- package/dist/components/AutoSuggestSelect/AutoSuggestSelect.stories.js +0 -19
- package/dist/components/AutoSuggestSelect/index.js +0 -13
- package/dist/components/Badge/Badge.js +0 -12
- package/dist/components/Badge/Badge.stories.js +0 -28
- package/dist/components/Badge/styles/index.js +0 -32
- package/dist/components/Button/Button.js +0 -36
- package/dist/components/Button/Button.spec.js +0 -25
- package/dist/components/Button/Button.styles.js +0 -164
- package/dist/components/Button/button-props.js +0 -71
- package/dist/components/Button/index.js +0 -20
- package/dist/components/Button/stories/button.js +0 -45
- package/dist/components/Button/stories/index.stories.js +0 -94
- package/dist/components/Button/stories/overview.js +0 -63
- package/dist/components/Card/Card.js +0 -22
- package/dist/components/Card/Card.stories.js +0 -29
- package/dist/components/Checkbox/Checkbox.js +0 -38
- package/dist/components/Checkbox/Checkbox.stories.js +0 -65
- package/dist/components/Checkbox/index.js +0 -13
- package/dist/components/Checkbox/styles/index.js +0 -89
- package/dist/components/Container/Container.js +0 -17
- package/dist/components/Container/Container.stories.js +0 -43
- package/dist/components/Container/Container.styles.js +0 -16
- package/dist/components/CreatableSelect/CreatableSelect.js +0 -124
- package/dist/components/CreatableSelect/CreatableSelect.stories.js +0 -55
- package/dist/components/CreatableSelect/index.js +0 -13
- package/dist/components/Divider/Divider.js +0 -29
- package/dist/components/Divider/Divider.stories.js +0 -35
- package/dist/components/Divider/Divider.styles.js +0 -20
- package/dist/components/Drawer/Drawer.js +0 -24
- package/dist/components/Drawer/Drawer.stories.js +0 -39
- package/dist/components/Drawer/index.js +0 -56
- package/dist/components/Drawer/styles/index.js +0 -104
- package/dist/components/FormControl/FormControl.js +0 -67
- package/dist/components/Grid/Grid.js +0 -28
- package/dist/components/Grid/Grid.stories.js +0 -100
- package/dist/components/Grid/Grid.styles.js +0 -17
- package/dist/components/Grid/GridItem.js +0 -17
- package/dist/components/Grid/GridItem.styles.js +0 -13
- package/dist/components/Grid/index.js +0 -20
- package/dist/components/Heading/Heading.js +0 -27
- package/dist/components/Heading/Heading.stories.js +0 -41
- package/dist/components/Heading/Heading.styles.js +0 -63
- package/dist/components/Icon/Icon.js +0 -12
- package/dist/components/Icon/Icon.stories.js +0 -36
- package/dist/components/Image/Image.js +0 -73
- package/dist/components/Image/Image.spec.js +0 -77
- package/dist/components/Image/Image.stories.js +0 -74
- package/dist/components/Input/Input.js +0 -44
- package/dist/components/Input/Input.stories.js +0 -59
- package/dist/components/Input/index.js +0 -13
- package/dist/components/Input/styles/index.js +0 -64
- package/dist/components/Link/Link.js +0 -12
- package/dist/components/Link/Link.stories.js +0 -49
- package/dist/components/Link/Link.styles.js +0 -44
- package/dist/components/List/List.js +0 -61
- package/dist/components/List/List.stories.js +0 -75
- package/dist/components/List/index.js +0 -20
- package/dist/components/List/styles/index.js +0 -16
- package/dist/components/List/styles/item.styles.js +0 -10
- package/dist/components/Loader/Loader.js +0 -44
- package/dist/components/Loader/Loader.stories.js +0 -116
- package/dist/components/Menu/Menu.js +0 -16
- package/dist/components/Menu/Menu.stories.js +0 -159
- package/dist/components/Menu/Menu.styles.js +0 -173
- package/dist/components/Menu/index.js +0 -56
- package/dist/components/Modal/Modal.js +0 -42
- package/dist/components/Modal/Modal.stories.js +0 -184
- package/dist/components/Modal/index.js +0 -32
- package/dist/components/Modal/styles/body.js +0 -30
- package/dist/components/Modal/styles/closeButton.js +0 -24
- package/dist/components/Modal/styles/dialog.js +0 -22
- package/dist/components/Modal/styles/dialogContainer.js +0 -19
- package/dist/components/Modal/styles/footer.js +0 -11
- package/dist/components/Modal/styles/header.js +0 -17
- package/dist/components/Modal/styles/index.js +0 -53
- package/dist/components/Modal/styles/overlay.js +0 -10
- package/dist/components/Popover/Popover.js +0 -26
- package/dist/components/Popover/Popover.stories.js +0 -80
- package/dist/components/Popover/PopoverArrow.js +0 -19
- package/dist/components/Popover/PopoverCloseButton.js +0 -19
- package/dist/components/Popover/PopoverContent.js +0 -38
- package/dist/components/Popover/index.js +0 -40
- package/dist/components/Popover/styles/index.js +0 -24
- package/dist/components/Popover/styles/popover-arrow.js +0 -12
- package/dist/components/Popover/styles/popover-body.js +0 -10
- package/dist/components/Popover/styles/popover-close-button.js +0 -26
- package/dist/components/Popover/styles/popover-content.js +0 -26
- package/dist/components/Popover/styles/popover-header.js +0 -11
- package/dist/components/Popover/styles/popper.js +0 -10
- package/dist/components/Progress/Progress.js +0 -37
- package/dist/components/Progress/Progress.stories.js +0 -79
- package/dist/components/Progress/Progress.styles.js +0 -122
- package/dist/components/Radio/Radio.js +0 -37
- package/dist/components/Radio/Radio.stories.js +0 -138
- package/dist/components/Radio/RadioGroup.js +0 -47
- package/dist/components/Radio/index.js +0 -20
- package/dist/components/Radio/styles/index.js +0 -118
- package/dist/components/RefreshedInput/Button/Button.js +0 -67
- package/dist/components/RefreshedInput/Button/Button.stories.js +0 -79
- package/dist/components/RefreshedInput/Button/index.js +0 -13
- package/dist/components/RefreshedInput/Button/styles/index.js +0 -25
- package/dist/components/RefreshedInput/FormControl/index.js +0 -167
- package/dist/components/RefreshedInput/Input/Input.js +0 -61
- package/dist/components/RefreshedInput/Input/Input.stories.js +0 -74
- package/dist/components/RefreshedInput/Input/index.js +0 -13
- package/dist/components/RefreshedInput/Input/styles/index.js +0 -23
- package/dist/components/RefreshedInput/Select/Select.js +0 -65
- package/dist/components/RefreshedInput/Select/Select.stories.js +0 -80
- package/dist/components/RefreshedInput/Select/index.js +0 -13
- package/dist/components/RefreshedInput/Select/styles/index.js +0 -26
- package/dist/components/RefreshedInput/index.js +0 -34
- package/dist/components/RefreshedInput/storyAid/index.js +0 -19
- package/dist/components/Select/Select.js +0 -50
- package/dist/components/Select/Select.stories.js +0 -63
- package/dist/components/Select/index.js +0 -13
- package/dist/components/Select/styles/index.js +0 -46
- package/dist/components/SelectionCard/SelectionCard.js +0 -61
- package/dist/components/SelectionCard/SelectionCard.stories.js +0 -90
- package/dist/components/SelectionCard/index.js +0 -13
- package/dist/components/Skeleton/Skeleton.stories.js +0 -23
- package/dist/components/Skeleton/Skeleton.styles.js +0 -9
- package/dist/components/Skeleton/index.js +0 -24
- package/dist/components/Spinner/Spinner.js +0 -29
- package/dist/components/Spinner/Spinner.stories.js +0 -98
- package/dist/components/Spinner/Spinner.styles.js +0 -85
- package/dist/components/Switch/Switch.js +0 -40
- package/dist/components/Switch/Switch.stories.js +0 -76
- package/dist/components/Switch/index.js +0 -13
- package/dist/components/Switch/styles/index.js +0 -32
- package/dist/components/Table/Table.js +0 -12
- package/dist/components/Table/Table.stories.js +0 -69
- package/dist/components/Table/Table.styles.js +0 -66
- package/dist/components/Table/index.js +0 -62
- package/dist/components/Tabs/Tabs.js +0 -35
- package/dist/components/Tabs/Tabs.stories.js +0 -39
- package/dist/components/Tabs/combineSizeWithVariant.js +0 -36
- package/dist/components/Tabs/index.js +0 -38
- package/dist/components/Tabs/styles/index.js +0 -70
- package/dist/components/Text/Text.js +0 -33
- package/dist/components/Text/Text.stories.js +0 -42
- package/dist/components/Text/Text.styles.js +0 -45
- package/dist/components/Text/combineAsWithVariant.js +0 -100
- package/dist/components/Text/options.js +0 -8
- package/dist/components/Textarea/Textarea.js +0 -44
- package/dist/components/Textarea/Textarea.stories.js +0 -59
- package/dist/components/Textarea/index.js +0 -13
- package/dist/components/Textarea/styles/index.js +0 -64
- package/dist/components/ThemeProvider/ThemeProvider.js +0 -39
- package/dist/components/ThemeProvider/ThemeProvider.stories.js +0 -51
- package/dist/components/Toast/Toast.stories.js +0 -77
- package/dist/components/ToggleButtonGroup/ToggleButtonGroup.js +0 -59
- package/dist/components/ToggleButtonGroup/ToggleButtonGroup.stories.js +0 -53
- package/dist/components/ToggleButtonGroup/index.js +0 -13
- package/dist/components/ToggleButtonGroup/styles/index.js +0 -47
- package/dist/components/index.js +0 -785
- package/dist/components/styles.js +0 -188
- package/dist/theme/base/breakpoints.js +0 -23
- package/dist/theme/base/colors.js +0 -138
- package/dist/theme/base/index.js +0 -79
- package/dist/theme/base/notifications.js +0 -198
- package/dist/theme/base/shadows.js +0 -15
- package/dist/theme/base/sizes.js +0 -88
- package/dist/theme/base/typography.js +0 -38
- package/dist/theme/base/zindices.js +0 -33
- package/dist/theme/global.js +0 -110
- package/dist/theme/index.js +0 -33
- package/dist/utils/Spaces.js +0 -16
|
@@ -1,173 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.default = void 0;
|
|
8
|
-
var _merge = _interopRequireDefault(require("lodash/merge"));
|
|
9
|
-
var _theme = _interopRequireDefault(require("@chakra-ui/theme"));
|
|
10
|
-
const baseStyle = {
|
|
11
|
-
button: {
|
|
12
|
-
px: 8,
|
|
13
|
-
py: 3,
|
|
14
|
-
fontSize: 'base',
|
|
15
|
-
fontFamily: 'body',
|
|
16
|
-
lineHeight: 0.875,
|
|
17
|
-
fontWeight: 'semibold',
|
|
18
|
-
borderWidth: '1px',
|
|
19
|
-
borderStyle: 'solid',
|
|
20
|
-
borderRadius: 'base',
|
|
21
|
-
textTransform: 'capitalize',
|
|
22
|
-
transition: 'all normal ease',
|
|
23
|
-
_hover: {
|
|
24
|
-
bg: 'gray.50',
|
|
25
|
-
borderColor: 'gray.200'
|
|
26
|
-
},
|
|
27
|
-
_disabled: {
|
|
28
|
-
cursor: 'not-allowed',
|
|
29
|
-
opacity: 1,
|
|
30
|
-
bg: 'gray.200',
|
|
31
|
-
borderColor: 'gray.200',
|
|
32
|
-
color: 'gray.600'
|
|
33
|
-
},
|
|
34
|
-
_focus: {
|
|
35
|
-
zIndex: 1,
|
|
36
|
-
boxShadow: 'outline'
|
|
37
|
-
}
|
|
38
|
-
},
|
|
39
|
-
list: {
|
|
40
|
-
bg: 'white',
|
|
41
|
-
boxShadow: 'base',
|
|
42
|
-
padding: 6,
|
|
43
|
-
zIndex: 'layer1',
|
|
44
|
-
width: 64
|
|
45
|
-
},
|
|
46
|
-
item: {
|
|
47
|
-
paddingX: 2,
|
|
48
|
-
paddingY: 1.5,
|
|
49
|
-
_focus: {
|
|
50
|
-
zIndex: 1,
|
|
51
|
-
boxShadow: 'outline'
|
|
52
|
-
}
|
|
53
|
-
},
|
|
54
|
-
groupTitle: {
|
|
55
|
-
fontWeight: 'semibold',
|
|
56
|
-
color: 'gray.600',
|
|
57
|
-
padding: 2
|
|
58
|
-
},
|
|
59
|
-
command: {
|
|
60
|
-
// this will style the text defined by the command
|
|
61
|
-
// prop in the MenuItem and MenuItemOption components
|
|
62
|
-
opacity: '0.8',
|
|
63
|
-
fontFamily: 'mono',
|
|
64
|
-
fontSize: 'sm',
|
|
65
|
-
letterSpacing: 'tighter',
|
|
66
|
-
paddingL: 4
|
|
67
|
-
},
|
|
68
|
-
divider: {
|
|
69
|
-
marginY: 2,
|
|
70
|
-
borderColor: 'gray.200'
|
|
71
|
-
}
|
|
72
|
-
};
|
|
73
|
-
const variants = {
|
|
74
|
-
basic: {
|
|
75
|
-
button: {
|
|
76
|
-
bg: 'primary.default',
|
|
77
|
-
borderColor: 'primary.default',
|
|
78
|
-
color: 'white',
|
|
79
|
-
_hover: {
|
|
80
|
-
bg: 'primary.600',
|
|
81
|
-
borderColor: 'primary.600',
|
|
82
|
-
color: 'white',
|
|
83
|
-
_disabled: {
|
|
84
|
-
bg: 'gray.200',
|
|
85
|
-
borderColor: 'gray.200',
|
|
86
|
-
color: 'gray.600'
|
|
87
|
-
}
|
|
88
|
-
}
|
|
89
|
-
},
|
|
90
|
-
list: {
|
|
91
|
-
bg: 'white',
|
|
92
|
-
boxShadow: 'base',
|
|
93
|
-
zIndex: 'layer1',
|
|
94
|
-
borderColor: 'gray.100',
|
|
95
|
-
borderWidth: '1px',
|
|
96
|
-
borderStyle: 'solid',
|
|
97
|
-
borderRadius: 'base',
|
|
98
|
-
padding: 4,
|
|
99
|
-
width: 64
|
|
100
|
-
},
|
|
101
|
-
groupTitle: {
|
|
102
|
-
fontWeight: 'semibold',
|
|
103
|
-
fontSize: 'md',
|
|
104
|
-
color: 'gray.600',
|
|
105
|
-
padding: 2
|
|
106
|
-
},
|
|
107
|
-
item: {
|
|
108
|
-
fontWeight: 'semibold',
|
|
109
|
-
_hover: {
|
|
110
|
-
color: 'gray.600'
|
|
111
|
-
}
|
|
112
|
-
}
|
|
113
|
-
},
|
|
114
|
-
full: {
|
|
115
|
-
button: {
|
|
116
|
-
height: 8,
|
|
117
|
-
fontSize: 'sm',
|
|
118
|
-
fontWeight: 'semibold',
|
|
119
|
-
color: 'black',
|
|
120
|
-
borderColor: 'white',
|
|
121
|
-
backgroundColor: 'white',
|
|
122
|
-
borderRadius: 'base',
|
|
123
|
-
paddingX: 3,
|
|
124
|
-
paddingY: 'auto',
|
|
125
|
-
_hover: {
|
|
126
|
-
color: 'black',
|
|
127
|
-
backgroundColor: 'gray.50',
|
|
128
|
-
borderColor: 'gray.50'
|
|
129
|
-
},
|
|
130
|
-
_active: {
|
|
131
|
-
color: 'primary.default',
|
|
132
|
-
backgroundColor: 'gray.50',
|
|
133
|
-
borderColor: 'gray.50',
|
|
134
|
-
_hover: {
|
|
135
|
-
color: 'primary.600',
|
|
136
|
-
backgroundColor: 'gray.50',
|
|
137
|
-
borderColor: 'gray.50'
|
|
138
|
-
}
|
|
139
|
-
}
|
|
140
|
-
},
|
|
141
|
-
list: {
|
|
142
|
-
height: '30rem',
|
|
143
|
-
width: '100vw',
|
|
144
|
-
padding: 8,
|
|
145
|
-
backgroundColor: 'white'
|
|
146
|
-
},
|
|
147
|
-
groupTitle: {
|
|
148
|
-
fontSize: 'sm',
|
|
149
|
-
weight: 'normal',
|
|
150
|
-
color: 'gray.600'
|
|
151
|
-
},
|
|
152
|
-
item: {
|
|
153
|
-
display: 'block',
|
|
154
|
-
paddingX: 3.5,
|
|
155
|
-
paddingY: 2.5,
|
|
156
|
-
marginBottom: 2,
|
|
157
|
-
_last: {
|
|
158
|
-
marginBottom: 0
|
|
159
|
-
},
|
|
160
|
-
_hover: {
|
|
161
|
-
backgroundColor: 'gray.50'
|
|
162
|
-
},
|
|
163
|
-
_focus: {
|
|
164
|
-
boxShadow: 'none',
|
|
165
|
-
backgroundColor: 'gray.50'
|
|
166
|
-
}
|
|
167
|
-
}
|
|
168
|
-
}
|
|
169
|
-
};
|
|
170
|
-
var _default = exports.default = (0, _merge.default)(_theme.default.components.Menu, {
|
|
171
|
-
baseStyle,
|
|
172
|
-
variants
|
|
173
|
-
});
|
|
@@ -1,56 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
Object.defineProperty(exports, "MenuButton", {
|
|
8
|
-
enumerable: true,
|
|
9
|
-
get: function () {
|
|
10
|
-
return _react.MenuButton;
|
|
11
|
-
}
|
|
12
|
-
});
|
|
13
|
-
Object.defineProperty(exports, "MenuDivider", {
|
|
14
|
-
enumerable: true,
|
|
15
|
-
get: function () {
|
|
16
|
-
return _react.MenuDivider;
|
|
17
|
-
}
|
|
18
|
-
});
|
|
19
|
-
Object.defineProperty(exports, "MenuGroup", {
|
|
20
|
-
enumerable: true,
|
|
21
|
-
get: function () {
|
|
22
|
-
return _react.MenuGroup;
|
|
23
|
-
}
|
|
24
|
-
});
|
|
25
|
-
Object.defineProperty(exports, "MenuItem", {
|
|
26
|
-
enumerable: true,
|
|
27
|
-
get: function () {
|
|
28
|
-
return _react.MenuItem;
|
|
29
|
-
}
|
|
30
|
-
});
|
|
31
|
-
Object.defineProperty(exports, "MenuItemOption", {
|
|
32
|
-
enumerable: true,
|
|
33
|
-
get: function () {
|
|
34
|
-
return _react.MenuItemOption;
|
|
35
|
-
}
|
|
36
|
-
});
|
|
37
|
-
Object.defineProperty(exports, "MenuList", {
|
|
38
|
-
enumerable: true,
|
|
39
|
-
get: function () {
|
|
40
|
-
return _react.MenuList;
|
|
41
|
-
}
|
|
42
|
-
});
|
|
43
|
-
Object.defineProperty(exports, "MenuOptionGroup", {
|
|
44
|
-
enumerable: true,
|
|
45
|
-
get: function () {
|
|
46
|
-
return _react.MenuOptionGroup;
|
|
47
|
-
}
|
|
48
|
-
});
|
|
49
|
-
Object.defineProperty(exports, "default", {
|
|
50
|
-
enumerable: true,
|
|
51
|
-
get: function () {
|
|
52
|
-
return _Menu.default;
|
|
53
|
-
}
|
|
54
|
-
});
|
|
55
|
-
var _Menu = _interopRequireDefault(require("./Menu"));
|
|
56
|
-
var _react = require("@chakra-ui/react");
|
|
@@ -1,42 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.default = void 0;
|
|
8
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
|
|
9
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
10
|
-
var _react2 = require("@chakra-ui/react");
|
|
11
|
-
var _header = _interopRequireDefault(require("./styles/header"));
|
|
12
|
-
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); }
|
|
13
|
-
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 && Object.prototype.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; }
|
|
14
|
-
/**
|
|
15
|
-
* @param {boolean} isMobile - Whether or not the Modal is opened in a mobile viewport
|
|
16
|
-
* @param {boolean} isOpen - Whether or not the Modal is open
|
|
17
|
-
* @param {React.ReactNode} children - The header text of the modal
|
|
18
|
-
* @param {()=>void} [onClose] - Callback invoked to close the Modal. Not required, but strongly suggested.
|
|
19
|
-
* @param {('sm'|'md'|'lg')} [size] - The size of the modal. If unspecified, uses "md" styles.
|
|
20
|
-
* @param {object} [contentStyling] - Style props to be passed into the modal content
|
|
21
|
-
* @param {object} [overlayProps] - Props to be passed into the ModalOverlay component. See: https://github.com/chakra-ui/chakra-ui/blob/main/packages/components/modal/src/modal-overlay.tsx
|
|
22
|
-
* @param {boolean} [hasHeader] - Whether or not ModalHeader is a child. Will change the styling
|
|
23
|
-
* @param {boolean} [hasFooter] - Whether or not ModalFooter is a child. Will change the styling
|
|
24
|
-
* @param {React.ReactNode} [hideCloseButton] - Whether or not to show the close button
|
|
25
|
-
* @returns {React.ReactElement} - The Modal component
|
|
26
|
-
*/
|
|
27
|
-
const Modal = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
|
|
28
|
-
const {
|
|
29
|
-
children,
|
|
30
|
-
isMobile,
|
|
31
|
-
hideCloseButton,
|
|
32
|
-
hasHeader,
|
|
33
|
-
contentStyling = {},
|
|
34
|
-
overlayProps = {}
|
|
35
|
-
} = props;
|
|
36
|
-
return /*#__PURE__*/_react.default.createElement(_react2.Modal, (0, _extends2.default)({
|
|
37
|
-
motionPreset: isMobile ? 'slideInBottom' : 'scale'
|
|
38
|
-
}, props, {
|
|
39
|
-
ref: ref
|
|
40
|
-
}), /*#__PURE__*/_react.default.createElement(_react2.ModalOverlay, overlayProps), /*#__PURE__*/_react.default.createElement(_react2.ModalContent, contentStyling, !hasHeader ? /*#__PURE__*/_react.default.createElement(_react2.Box, (0, _header.default)(props)) : null, hideCloseButton ? null : /*#__PURE__*/_react.default.createElement(_react2.ModalCloseButton, null), children));
|
|
41
|
-
});
|
|
42
|
-
var _default = exports.default = Modal;
|
|
@@ -1,184 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.default = exports.TransactionalWithExpandingContent = exports.Transactional = exports.Passive = exports.NoHeader = void 0;
|
|
8
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
|
|
9
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
10
|
-
var _react2 = require("@chakra-ui/react");
|
|
11
|
-
var _disableArgs = _interopRequireDefault(require("storybook/utils/disable-args"));
|
|
12
|
-
var _createControl = require("storybook/utils/create-control");
|
|
13
|
-
var _index = require("./index");
|
|
14
|
-
var _Button = _interopRequireDefault(require("../Button/Button"));
|
|
15
|
-
var _Text = _interopRequireDefault(require("../Text/Text"));
|
|
16
|
-
var _Heading = _interopRequireDefault(require("../Heading/Heading"));
|
|
17
|
-
var _Accordion = require("../Accordion");
|
|
18
|
-
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); }
|
|
19
|
-
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 && Object.prototype.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; }
|
|
20
|
-
var _default = exports.default = {
|
|
21
|
-
title: 'v2/Modal',
|
|
22
|
-
component: _index.Modal,
|
|
23
|
-
parameters: {
|
|
24
|
-
importBy: 'Modal',
|
|
25
|
-
removeBaseHtmlClass: true,
|
|
26
|
-
chakraLink: 'https://chakra-ui.com/docs/overlay/Modal'
|
|
27
|
-
},
|
|
28
|
-
argTypes: {
|
|
29
|
-
...(0, _createControl.createSelectControl)('size', ['sm', 'md', 'lg']),
|
|
30
|
-
...(0, _disableArgs.default)(['isOpen', 'onClose']),
|
|
31
|
-
hideCloseButton: {
|
|
32
|
-
control: {
|
|
33
|
-
type: 'boolean'
|
|
34
|
-
}
|
|
35
|
-
},
|
|
36
|
-
children: {
|
|
37
|
-
control: {
|
|
38
|
-
type: 'text'
|
|
39
|
-
}
|
|
40
|
-
}
|
|
41
|
-
},
|
|
42
|
-
args: {
|
|
43
|
-
size: 'md'
|
|
44
|
-
}
|
|
45
|
-
};
|
|
46
|
-
const Transactional = props => {
|
|
47
|
-
const [open, setOpen] = (0, _react.useState)(false);
|
|
48
|
-
const isMobile = (0, _react2.useBreakpointValue)({
|
|
49
|
-
base: true,
|
|
50
|
-
tablet: false
|
|
51
|
-
});
|
|
52
|
-
return /*#__PURE__*/_react.default.createElement(_react2.Box, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
|
|
53
|
-
marginBottom: 2
|
|
54
|
-
}, "A \"Transactional\" modal just refers to one with a footer. Be sure to use the ", /*#__PURE__*/_react.default.createElement("code", null, "hasFooter"), " prop for the styling to be right when a ModalFooter is present. Same goes with ", /*#__PURE__*/_react.default.createElement("code", null, "hasHeader"), "."), /*#__PURE__*/_react.default.createElement(_Button.default, {
|
|
55
|
-
onClick: () => setOpen(true)
|
|
56
|
-
}, "Open Modal"), /*#__PURE__*/_react.default.createElement(_index.Modal, (0, _extends2.default)({}, props, {
|
|
57
|
-
isMobile: isMobile,
|
|
58
|
-
isOpen: open,
|
|
59
|
-
hasHeader: true,
|
|
60
|
-
hasFooter: true,
|
|
61
|
-
onClose: () => setOpen(false)
|
|
62
|
-
}), /*#__PURE__*/_react.default.createElement(_index.ModalHeader, null, "Transactional"), /*#__PURE__*/_react.default.createElement(_index.ModalBody, null, props.children), /*#__PURE__*/_react.default.createElement(_index.ModalFooter, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
|
|
63
|
-
onClick: () => setOpen(false),
|
|
64
|
-
variant: "secondary",
|
|
65
|
-
marginRight: 4
|
|
66
|
-
}, "Cancel"), /*#__PURE__*/_react.default.createElement(_Button.default, {
|
|
67
|
-
onClick: () => setOpen(false),
|
|
68
|
-
variant: "primary"
|
|
69
|
-
}, "Submit"))));
|
|
70
|
-
};
|
|
71
|
-
exports.Transactional = Transactional;
|
|
72
|
-
Transactional.args = {
|
|
73
|
-
header: 'Transactional',
|
|
74
|
-
children: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent tincidunt lectus et mauris viverra, nec tincidunt arcu rhoncus. Duis pellentesque vestibulum orci ut mattis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Duis vel malesuada ligula. Cras dapibus enim sem. Suspendisse potenti. Mauris tempus non tortor eu placerat. Pellentesque faucibus dui vitae purus iaculis, ac convallis turpis gravida. Ut ac massa pretium, finibus quam vitae, aliquet libero. orci ut mattis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Duis vel malesuada ligula. Cras dapibus enim sem. Suspendisse potenti. Mauris tempus non tortor eu placerat. Pellentesque faucibus dui vitae purus iaculis, ac convallis turpis gravida. Ut ac massa pretium, finibus quam vitae, aliquet libero.'
|
|
75
|
-
};
|
|
76
|
-
const Passive = props => {
|
|
77
|
-
const [open, setOpen] = (0, _react.useState)(false);
|
|
78
|
-
const isMobile = (0, _react2.useBreakpointValue)({
|
|
79
|
-
base: true,
|
|
80
|
-
tablet: false
|
|
81
|
-
});
|
|
82
|
-
return /*#__PURE__*/_react.default.createElement(_react2.Box, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
|
|
83
|
-
marginBottom: 2
|
|
84
|
-
}, "A \"Passive\" modal just refers to one with no footer."), /*#__PURE__*/_react.default.createElement(_Button.default, {
|
|
85
|
-
onClick: () => setOpen(true)
|
|
86
|
-
}, "Open Modal"), /*#__PURE__*/_react.default.createElement(_index.Modal, (0, _extends2.default)({}, props, {
|
|
87
|
-
isMobile: isMobile,
|
|
88
|
-
isOpen: open,
|
|
89
|
-
hasHeader: true,
|
|
90
|
-
hasFooter: false,
|
|
91
|
-
onClose: () => setOpen(false)
|
|
92
|
-
}), /*#__PURE__*/_react.default.createElement(_index.ModalHeader, null, "Passive"), /*#__PURE__*/_react.default.createElement(_index.ModalBody, null, props.children)));
|
|
93
|
-
};
|
|
94
|
-
exports.Passive = Passive;
|
|
95
|
-
Passive.args = {
|
|
96
|
-
children: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent tincidunt lectus et mauris viverra, nec tincidunt arcu rhoncus. Duis pellentesque vestibulum orci ut mattis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Duis vel malesuada ligula. Cras dapibus enim sem. Suspendisse potenti. Mauris tempus non tortor eu placerat. Pellentesque faucibus dui vitae purus iaculis, ac convallis turpis gravida. Ut ac massa pretium, finibus quam vitae, aliquet libero. orci ut mattis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Duis vel malesuada ligula. Cras dapibus enim sem. Suspendisse potenti. Mauris tempus non tortor eu placerat. Pellentesque faucibus dui vitae purus iaculis, ac convallis turpis gravida. Ut ac massa pretium, finibus quam vitae, aliquet libero.'
|
|
97
|
-
};
|
|
98
|
-
const NoHeader = props => {
|
|
99
|
-
const [open, setOpen] = (0, _react.useState)(false);
|
|
100
|
-
const isMobile = (0, _react2.useBreakpointValue)({
|
|
101
|
-
base: true,
|
|
102
|
-
tablet: false
|
|
103
|
-
});
|
|
104
|
-
return /*#__PURE__*/_react.default.createElement(_react2.Box, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
|
|
105
|
-
marginBottom: 2
|
|
106
|
-
}, "A modal with no header"), /*#__PURE__*/_react.default.createElement(_Button.default, {
|
|
107
|
-
onClick: () => setOpen(true)
|
|
108
|
-
}, "Open Modal"), /*#__PURE__*/_react.default.createElement(_index.Modal, (0, _extends2.default)({}, props, {
|
|
109
|
-
isMobile: isMobile,
|
|
110
|
-
hasHeader: false,
|
|
111
|
-
hasFooter: false,
|
|
112
|
-
isOpen: open,
|
|
113
|
-
onClose: () => setOpen(false)
|
|
114
|
-
}), /*#__PURE__*/_react.default.createElement(_index.ModalBody, null, props.children)));
|
|
115
|
-
};
|
|
116
|
-
exports.NoHeader = NoHeader;
|
|
117
|
-
NoHeader.args = {
|
|
118
|
-
children: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent tincidunt lectus et mauris viverra, nec tincidunt arcu rhoncus. Duis pellentesque vestibulum orci ut mattis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Duis vel malesuada ligula. Cras dapibus enim sem. Suspendisse potenti. Mauris tempus non tortor eu placerat. Pellentesque faucibus dui vitae purus iaculis, ac convallis turpis gravida. Ut ac massa pretium, finibus quam vitae, aliquet libero. orci ut mattis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Duis vel malesuada ligula. Cras dapibus enim sem. Suspendisse potenti. Mauris tempus non tortor eu placerat. Pellentesque faucibus dui vitae purus iaculis, ac convallis turpis gravida. Ut ac massa pretium, finibus quam vitae, aliquet libero.'
|
|
119
|
-
};
|
|
120
|
-
const TransactionalWithExpandingContent = props => {
|
|
121
|
-
const [open, setOpen] = (0, _react.useState)(false);
|
|
122
|
-
const accordionRefs = [/*#__PURE__*/_react.default.createRef(), /*#__PURE__*/_react.default.createRef()];
|
|
123
|
-
const isMobile = (0, _react2.useBreakpointValue)({
|
|
124
|
-
base: true,
|
|
125
|
-
tablet: false
|
|
126
|
-
});
|
|
127
|
-
const handleAccordionChange = index => {
|
|
128
|
-
if (accordionRefs[index]) {
|
|
129
|
-
// Timeout so that scroll doesn't happen until accordion animation complete
|
|
130
|
-
setTimeout(() => {
|
|
131
|
-
accordionRefs[index].current.scrollIntoView({
|
|
132
|
-
behavior: 'smooth',
|
|
133
|
-
block: 'start'
|
|
134
|
-
});
|
|
135
|
-
}, 150);
|
|
136
|
-
}
|
|
137
|
-
};
|
|
138
|
-
return /*#__PURE__*/_react.default.createElement(_react2.Box, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
|
|
139
|
-
marginBottom: 2
|
|
140
|
-
}, "When content inside a modal dynamically expands, the modal should scroll to that new content."), /*#__PURE__*/_react.default.createElement(_Text.default, {
|
|
141
|
-
marginBottom: 2
|
|
142
|
-
}, "However, this is something we'll need to implement on a case by case basis when it applies."), /*#__PURE__*/_react.default.createElement(_Text.default, {
|
|
143
|
-
marginBottom: 2
|
|
144
|
-
}, "Feel free to check the code of this demo to see an example of how we might do that."), /*#__PURE__*/_react.default.createElement(_Button.default, {
|
|
145
|
-
onClick: () => setOpen(true)
|
|
146
|
-
}, "Open Modal"), /*#__PURE__*/_react.default.createElement(_index.Modal, (0, _extends2.default)({}, props, {
|
|
147
|
-
isMobile: isMobile,
|
|
148
|
-
hasHeader: true,
|
|
149
|
-
hasFooter: true,
|
|
150
|
-
isOpen: open,
|
|
151
|
-
onClose: () => setOpen(false)
|
|
152
|
-
}), /*#__PURE__*/_react.default.createElement(_index.ModalHeader, null, "Transactional with Expanding Content"), /*#__PURE__*/_react.default.createElement(_index.ModalBody, null, /*#__PURE__*/_react.default.createElement(_react2.Box, null, /*#__PURE__*/_react.default.createElement(_Text.default, {
|
|
153
|
-
marginBottom: 2
|
|
154
|
-
}, "Try opening an Accordion when it is at the very bottom of the modal."), /*#__PURE__*/_react.default.createElement(_Text.default, {
|
|
155
|
-
marginBottom: 2
|
|
156
|
-
}, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent tincidunt lectus et mauris viverra, nec tincidunt arcu rhoncus. Duis pellentesque vestibulum orci ut mattis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Duis vel malesuada ligula. Cras dapibus enim sem. Suspendisse potenti. Mauris tempus non tortor eu placerat. Pellentesque faucibus dui vitae purus iaculis, ac convallis turpis gravida. Ut ac massa pretium, finibus quam vitae, aliquet libero. orci ut mattis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Duis vel malesuada ligula. Cras dapibus enim sem. Suspendisse potenti. Mauris tempus non tortor eu placerat. Pellentesque faucibus dui vitae purus iaculis, ac convallis turpis gravida. Ut ac massa pretium, finibus quam vitae, aliquet libero."), /*#__PURE__*/_react.default.createElement(_Accordion.Accordion, {
|
|
157
|
-
onChange: handleAccordionChange,
|
|
158
|
-
allowToggle: true
|
|
159
|
-
}, /*#__PURE__*/_react.default.createElement(_Accordion.AccordionItem, {
|
|
160
|
-
ref: accordionRefs[0]
|
|
161
|
-
}, /*#__PURE__*/_react.default.createElement(_Heading.default, {
|
|
162
|
-
as: "h3"
|
|
163
|
-
}, /*#__PURE__*/_react.default.createElement(_Accordion.AccordionButton, null, /*#__PURE__*/_react.default.createElement(_react2.Box, {
|
|
164
|
-
flex: "1",
|
|
165
|
-
textAlign: "left"
|
|
166
|
-
}, "Accordion 1"), /*#__PURE__*/_react.default.createElement(_Accordion.AccordionIcon, null))), /*#__PURE__*/_react.default.createElement(_Accordion.AccordionPanel, null, /*#__PURE__*/_react.default.createElement(_Text.default, null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent tincidunt lectus et mauris viverra, nec tincidunt arcu rhoncus. Duis pellentesque vestibulum orci ut mattis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Duis vel malesuada ligula. Cras dapibus enim sem. Suspendisse potenti. Mauris tempus non tortor eu placerat. Pellentesque faucibus dui vitae purus iaculis, ac convallis turpis gravida. Ut ac massa pretium, finibus quam vitae, aliquet libero. Aliquam et urna condimentum, sagittis nisl hendrerit, elementum velit. Nullam quis nisl dictum, suscipit ligula nec, elementum libero. Nullam eu lorem convallis, dictum nisl in, condimentum dui. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Viva"))), /*#__PURE__*/_react.default.createElement(_Accordion.AccordionItem, {
|
|
167
|
-
ref: accordionRefs[1]
|
|
168
|
-
}, /*#__PURE__*/_react.default.createElement(_Heading.default, {
|
|
169
|
-
as: "h3"
|
|
170
|
-
}, /*#__PURE__*/_react.default.createElement(_Accordion.AccordionButton, null, /*#__PURE__*/_react.default.createElement(_react2.Box, {
|
|
171
|
-
flex: "1",
|
|
172
|
-
textAlign: "left"
|
|
173
|
-
}, "Accordion 2"), /*#__PURE__*/_react.default.createElement(_Accordion.AccordionIcon, null))), /*#__PURE__*/_react.default.createElement(_Accordion.AccordionPanel, null, /*#__PURE__*/_react.default.createElement(_Text.default, null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent tincidunt lectus et mauris viverra, nec tincidunt arcu rhoncus. Duis pellentesque vestibulum orci ut mattis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Duis vel malesuada ligula. Cras dapibus enim sem. Suspendisse potenti. Mauris tempus non tortor eu placerat. Pellentesque faucibus dui vitae purus iaculis, ac convallis turpis gravida. Ut ac massa pretium, finibus quam vitae, aliquet libero. Aliquam et urna condimentum, sagittis nisl hendrerit, elementum velit. Nullam quis nisl dictum, suscipit ligula nec, elementum libero. Nullam eu lorem convallis, dictum nisl in, condimentum dui. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Viva")))))), /*#__PURE__*/_react.default.createElement(_index.ModalFooter, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
|
|
174
|
-
onClick: () => setOpen(false),
|
|
175
|
-
variant: "secondary",
|
|
176
|
-
marginRight: 4
|
|
177
|
-
}, "Cancel"), /*#__PURE__*/_react.default.createElement(_Button.default, {
|
|
178
|
-
variant: "primary"
|
|
179
|
-
}, "Submit"))));
|
|
180
|
-
};
|
|
181
|
-
exports.TransactionalWithExpandingContent = TransactionalWithExpandingContent;
|
|
182
|
-
TransactionalWithExpandingContent.argTypes = {
|
|
183
|
-
...(0, _disableArgs.default)(['children', 'hasHeader', 'hasFooter'])
|
|
184
|
-
};
|
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
Object.defineProperty(exports, "Modal", {
|
|
8
|
-
enumerable: true,
|
|
9
|
-
get: function () {
|
|
10
|
-
return _Modal.default;
|
|
11
|
-
}
|
|
12
|
-
});
|
|
13
|
-
Object.defineProperty(exports, "ModalBody", {
|
|
14
|
-
enumerable: true,
|
|
15
|
-
get: function () {
|
|
16
|
-
return _react.ModalBody;
|
|
17
|
-
}
|
|
18
|
-
});
|
|
19
|
-
Object.defineProperty(exports, "ModalFooter", {
|
|
20
|
-
enumerable: true,
|
|
21
|
-
get: function () {
|
|
22
|
-
return _react.ModalFooter;
|
|
23
|
-
}
|
|
24
|
-
});
|
|
25
|
-
Object.defineProperty(exports, "ModalHeader", {
|
|
26
|
-
enumerable: true,
|
|
27
|
-
get: function () {
|
|
28
|
-
return _react.ModalHeader;
|
|
29
|
-
}
|
|
30
|
-
});
|
|
31
|
-
var _react = require("@chakra-ui/react");
|
|
32
|
-
var _Modal = _interopRequireDefault(require("./Modal"));
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
var _default = ({
|
|
8
|
-
hasFooter,
|
|
9
|
-
hasHeader,
|
|
10
|
-
hideCloseButton
|
|
11
|
-
}) => {
|
|
12
|
-
const scrollingHeaderStyles = hasHeader || !hideCloseButton ? {
|
|
13
|
-
// The following adapted from https://lea.verou.me/2012/04/background-attachment-local/
|
|
14
|
-
background: 'linear-gradient(white 30%, white), linear-gradient(rgb(0 0 0 / 10%) 0%, white)',
|
|
15
|
-
backgroundRepeat: 'no-repeat',
|
|
16
|
-
backgroundColor: 'white',
|
|
17
|
-
backgroundSize: '100% 30px, 100% 10px',
|
|
18
|
-
backgroundAttachment: 'local, scroll'
|
|
19
|
-
} : {};
|
|
20
|
-
return {
|
|
21
|
-
borderBottomRadius: hasFooter ? null : 'md',
|
|
22
|
-
paddingX: 4,
|
|
23
|
-
paddingBottom: 4,
|
|
24
|
-
flex: 1,
|
|
25
|
-
overflow: 'auto',
|
|
26
|
-
display: 'flex',
|
|
27
|
-
...scrollingHeaderStyles
|
|
28
|
-
};
|
|
29
|
-
};
|
|
30
|
-
exports.default = _default;
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
var _default = ({
|
|
8
|
-
hasHeader
|
|
9
|
-
}) => ({
|
|
10
|
-
position: 'absolute',
|
|
11
|
-
top: hasHeader ? 4 : 2,
|
|
12
|
-
insetEnd: hasHeader ? 4 : 2,
|
|
13
|
-
color: 'gray.dark',
|
|
14
|
-
borderRadius: 'sm',
|
|
15
|
-
width: 8,
|
|
16
|
-
height: 8,
|
|
17
|
-
_focus: {
|
|
18
|
-
boxShadow: 'outline'
|
|
19
|
-
},
|
|
20
|
-
_hover: {
|
|
21
|
-
bg: 'gray.50'
|
|
22
|
-
}
|
|
23
|
-
});
|
|
24
|
-
exports.default = _default;
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
var _default = ({
|
|
8
|
-
hasFooter
|
|
9
|
-
}) => ({
|
|
10
|
-
borderRadius: 'md',
|
|
11
|
-
borderBottomRadius: {
|
|
12
|
-
base: '0',
|
|
13
|
-
tablet: 'md'
|
|
14
|
-
},
|
|
15
|
-
background: 'white',
|
|
16
|
-
color: 'inherit',
|
|
17
|
-
marginY: 0,
|
|
18
|
-
zIndex: 'layer8',
|
|
19
|
-
boxShadow: 'lg',
|
|
20
|
-
paddingBottom: hasFooter ? 0 : 4
|
|
21
|
-
});
|
|
22
|
-
exports.default = _default;
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
var _default = exports.default = {
|
|
8
|
-
display: 'flex',
|
|
9
|
-
zIndex: 'layer8',
|
|
10
|
-
justifyContent: 'center',
|
|
11
|
-
alignItems: {
|
|
12
|
-
base: 'flex-end',
|
|
13
|
-
tablet: 'center'
|
|
14
|
-
},
|
|
15
|
-
height: '100%',
|
|
16
|
-
minHeight: '-moz-available',
|
|
17
|
-
minHeight: '-webkit-fill-available',
|
|
18
|
-
minHeight: 'fill-available'
|
|
19
|
-
};
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
var _default = ({
|
|
8
|
-
hideCloseButton,
|
|
9
|
-
hasHeader
|
|
10
|
-
}) => ({
|
|
11
|
-
padding: !hideCloseButton || hasHeader ? 4 : 2,
|
|
12
|
-
fontSize: 'xl',
|
|
13
|
-
fontWeight: 'semibold',
|
|
14
|
-
// If just close button, still have 'header' section at top
|
|
15
|
-
minHeight: hasHeader || hideCloseButton ? null : 12
|
|
16
|
-
});
|
|
17
|
-
exports.default = _default;
|