quicksnack 3.32.0 → 3.34.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.
Files changed (77) hide show
  1. package/dist/bundle.min.js +909 -0
  2. package/dist/index.d.ts +4 -3
  3. package/package.json +7 -3
  4. package/dist/UiProvider.js +0 -18
  5. package/dist/UiStateProvider.js +0 -47
  6. package/dist/UiWrapper.js +0 -23
  7. package/dist/animation/SlideInFromTop/SlideInFromTop.js +0 -38
  8. package/dist/animation/SlideOpen/SlideOpen.js +0 -52
  9. package/dist/components/Alert/Alert.js +0 -27
  10. package/dist/components/AnimatedCheckmark/AnimatedCheckmark.js +0 -50
  11. package/dist/components/Box/Box.js +0 -57
  12. package/dist/components/BreadCrumbs/BreadCrumbs.js +0 -14
  13. package/dist/components/CollapsiblePanel/CollapsiblePanel.js +0 -73
  14. package/dist/components/ConfirmButton/ConfirmButton.js +0 -44
  15. package/dist/components/ConfirmModal/ConfirmModal.js +0 -16
  16. package/dist/components/ConfirmModal/hooks/useConfirmModal.js +0 -26
  17. package/dist/components/Details/Details.js +0 -49
  18. package/dist/components/Dropdown/Dropdown.js +0 -79
  19. package/dist/components/Dropzone/Dropzone.js +0 -102
  20. package/dist/components/Feedback/Feedback.js +0 -31
  21. package/dist/components/Floater/Floater.js +0 -48
  22. package/dist/components/Floater/FloaterItem.js +0 -39
  23. package/dist/components/Footer/Footer.js +0 -21
  24. package/dist/components/HorizontalScroller/HorizontalScroller.js +0 -20
  25. package/dist/components/Menu/HamburgerButton.js +0 -15
  26. package/dist/components/Menu/Menu.js +0 -48
  27. package/dist/components/Menu/MenuCloseButton.js +0 -15
  28. package/dist/components/Menu/MenuSlideOpenIndicator.js +0 -22
  29. package/dist/components/Menu/SideBar.js +0 -59
  30. package/dist/components/Menu/SideBarHeader.js +0 -48
  31. package/dist/components/Menu/useCloseSidebarOnNavigate.js +0 -15
  32. package/dist/components/Menu/useToggleMobileMenu.js +0 -30
  33. package/dist/components/Modal/Modal.js +0 -51
  34. package/dist/components/Overlay/Overlay.js +0 -34
  35. package/dist/components/Paginator/Paginator.js +0 -41
  36. package/dist/components/Panel/Panel.js +0 -54
  37. package/dist/components/Section/Section.js +0 -22
  38. package/dist/components/Statistic/Statistic.js +0 -28
  39. package/dist/components/Table/Table.js +0 -83
  40. package/dist/components/Tabs/Tab.js +0 -70
  41. package/dist/components/Tabs/TabContent.js +0 -28
  42. package/dist/components/Tabs/Tabs.js +0 -14
  43. package/dist/components/Timeline/Timeline.js +0 -39
  44. package/dist/components/TopBar/TopBar.js +0 -24
  45. package/dist/fonts.js +0 -17
  46. package/dist/form/Button/Button.js +0 -85
  47. package/dist/form/Checkbox/Checkbox.js +0 -73
  48. package/dist/form/FileField/FileField.js +0 -98
  49. package/dist/form/PasswordStrengthField/PasswordStrenghField.js +0 -86
  50. package/dist/form/ScaffoldForm/FormGrid/FormGrid.js +0 -42
  51. package/dist/form/ScaffoldForm/FormGrid/FormGridCell.js +0 -69
  52. package/dist/form/ScaffoldForm/FormGrid/FormGridWrapper.js +0 -38
  53. package/dist/form/ScaffoldForm/ScaffoldField.js +0 -67
  54. package/dist/form/ScaffoldForm/ScaffoldForm.js +0 -44
  55. package/dist/form/ScaffoldForm/ScaffoldFormProvider.js +0 -13
  56. package/dist/form/ScaffoldForm/hooks/useScaffoldFormContext.js +0 -7
  57. package/dist/form/ScaffoldForm/scaffoldFormProps.js +0 -91
  58. package/dist/form/ScaffoldForm/scaffoldPasswordProps.js +0 -22
  59. package/dist/form/ScaffoldForm/types.js +0 -2
  60. package/dist/form/ScaffoldForm/utils/FormPositioner.js +0 -102
  61. package/dist/form/ScaffoldForm/utils/Grid.js +0 -64
  62. package/dist/form/ScaffoldForm/utils/Grid.test.js +0 -40
  63. package/dist/form/ScaffoldForm/utils/assertGridIsValid.js +0 -37
  64. package/dist/form/ScaffoldForm/utils/assertGridIsValid.test.js +0 -55
  65. package/dist/form/ScaffoldForm/utils/equalColumns.js +0 -20
  66. package/dist/form/Select/Select.js +0 -51
  67. package/dist/form/TextField/TextField.js +0 -68
  68. package/dist/index.js +0 -74
  69. package/dist/layouts/BasicLayout/BasicLayout.js +0 -47
  70. package/dist/layouts/FloatingPanelLayout/FloatingPanelLayout.js +0 -45
  71. package/dist/layouts/constants.js +0 -5
  72. package/dist/responsiveness/responsiveProps.js +0 -87
  73. package/dist/responsiveness/useResponsiveBreakpoints.js +0 -24
  74. package/dist/theme.js +0 -164
  75. package/dist/typography/Fonts.js +0 -19
  76. package/dist/typography/Header/Header.js +0 -79
  77. package/dist/typography/Paragraph/Paragraph.js +0 -13
@@ -1,79 +0,0 @@
1
- "use strict";
2
- var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
- if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
- return cooked;
5
- };
6
- var __assign = (this && this.__assign) || function () {
7
- __assign = Object.assign || function(t) {
8
- for (var s, i = 1, n = arguments.length; i < n; i++) {
9
- s = arguments[i];
10
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
11
- t[p] = s[p];
12
- }
13
- return t;
14
- };
15
- return __assign.apply(this, arguments);
16
- };
17
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
18
- if (k2 === undefined) k2 = k;
19
- var desc = Object.getOwnPropertyDescriptor(m, k);
20
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
21
- desc = { enumerable: true, get: function() { return m[k]; } };
22
- }
23
- Object.defineProperty(o, k2, desc);
24
- }) : (function(o, m, k, k2) {
25
- if (k2 === undefined) k2 = k;
26
- o[k2] = m[k];
27
- }));
28
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
29
- Object.defineProperty(o, "default", { enumerable: true, value: v });
30
- }) : function(o, v) {
31
- o["default"] = v;
32
- });
33
- var __importStar = (this && this.__importStar) || function (mod) {
34
- if (mod && mod.__esModule) return mod;
35
- var result = {};
36
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
37
- __setModuleDefault(result, mod);
38
- return result;
39
- };
40
- var __importDefault = (this && this.__importDefault) || function (mod) {
41
- return (mod && mod.__esModule) ? mod : { "default": mod };
42
- };
43
- Object.defineProperty(exports, "__esModule", { value: true });
44
- exports.Dropdown = exports.DropdownMenuItem = exports.DropdownMenu = void 0;
45
- var react_1 = __importStar(require("react"));
46
- var Button_1 = require("../../form/Button/Button");
47
- var styled_components_1 = __importStar(require("styled-components"));
48
- var SlideInFromTop_1 = require("../../animation/SlideInFromTop/SlideInFromTop");
49
- var is_prop_valid_1 = __importDefault(require("@emotion/is-prop-valid"));
50
- var Wrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n position: relative;\n"], ["\n position: relative;\n"])));
51
- var Dropper = styled_components_1.default.span.withConfig({ shouldForwardProp: is_prop_valid_1.default })(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n border-radius: 4px;\n border: 1px solid rgba(34,36,38,.15);\n position: absolute;\n box-shadow: 0 8px 8px 0 rgba(34,36,38,.15); \n background-color: ", ";\n z-index: 100;\n \n ", " \n"], ["\n border-radius: 4px;\n border: 1px solid rgba(34,36,38,.15);\n position: absolute;\n box-shadow: 0 8px 8px 0 rgba(34,36,38,.15); \n background-color: ", ";\n z-index: 100;\n \n ", " \n"])), function (props) { return props.theme.palette.common.white; }, function (props) { return props.align === 'right' ? (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["right: 0;"], ["right: 0;"]))) : (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["left: 0;"], ["left: 0;"]))); });
52
- exports.DropdownMenu = styled_components_1.default.ul(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n list-style: none;\n margin: 0;\n padding: ", "; \n"], ["\n list-style: none;\n margin: 0;\n padding: ", "; \n"])), function (props) { return props.theme.spacing(2, 0); });
53
- exports.DropdownMenuItem = styled_components_1.default.li(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n cursor: pointer;\n padding: ", ";\n &:hover {\n background-color: #ddd;\n }\n"], ["\n cursor: pointer;\n padding: ", ";\n &:hover {\n background-color: #ddd;\n }\n"])), function (props) { return props.theme.spacing(0, 3); });
54
- var Dropdown = function (_a) {
55
- var buttonProps = _a.buttonProps, align = _a.align, children = _a.children, stayOpenOnClick = _a.stayOpenOnClick;
56
- var dropper = (0, react_1.useRef)(null);
57
- var _b = (0, react_1.useState)(false), isOpen = _b[0], setIsOpen = _b[1];
58
- var handleOpen = (0, react_1.useCallback)(function () { return setIsOpen(true); }, [setIsOpen]);
59
- var handleClose = (0, react_1.useCallback)(function (e) {
60
- var _a;
61
- if (stayOpenOnClick && ((_a = dropper.current) === null || _a === void 0 ? void 0 : _a.contains(e.target)))
62
- return;
63
- setIsOpen(false);
64
- }, [setIsOpen, stayOpenOnClick]);
65
- react_1.default.useEffect(function () {
66
- if (isOpen) {
67
- setTimeout(function () { return document.addEventListener('click', handleClose); }, 1);
68
- }
69
- return function () {
70
- document.removeEventListener('click', handleClose);
71
- };
72
- }, [isOpen, handleClose]);
73
- return (react_1.default.createElement(Wrapper, null,
74
- react_1.default.createElement(Button_1.Button, __assign({}, buttonProps, { onClick: handleOpen })),
75
- isOpen && (react_1.default.createElement(SlideInFromTop_1.SlideInFromTop, { speed: '.1s' },
76
- react_1.default.createElement(Dropper, { ref: dropper, align: align || 'left' }, children)))));
77
- };
78
- exports.Dropdown = Dropdown;
79
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
@@ -1,102 +0,0 @@
1
- "use strict";
2
- var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
- if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
- return cooked;
5
- };
6
- var __assign = (this && this.__assign) || function () {
7
- __assign = Object.assign || function(t) {
8
- for (var s, i = 1, n = arguments.length; i < n; i++) {
9
- s = arguments[i];
10
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
11
- t[p] = s[p];
12
- }
13
- return t;
14
- };
15
- return __assign.apply(this, arguments);
16
- };
17
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
18
- if (k2 === undefined) k2 = k;
19
- var desc = Object.getOwnPropertyDescriptor(m, k);
20
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
21
- desc = { enumerable: true, get: function() { return m[k]; } };
22
- }
23
- Object.defineProperty(o, k2, desc);
24
- }) : (function(o, m, k, k2) {
25
- if (k2 === undefined) k2 = k;
26
- o[k2] = m[k];
27
- }));
28
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
29
- Object.defineProperty(o, "default", { enumerable: true, value: v });
30
- }) : function(o, v) {
31
- o["default"] = v;
32
- });
33
- var __importStar = (this && this.__importStar) || function (mod) {
34
- if (mod && mod.__esModule) return mod;
35
- var result = {};
36
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
37
- __setModuleDefault(result, mod);
38
- return result;
39
- };
40
- var __rest = (this && this.__rest) || function (s, e) {
41
- var t = {};
42
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
43
- t[p] = s[p];
44
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
45
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
46
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
47
- t[p[i]] = s[p[i]];
48
- }
49
- return t;
50
- };
51
- var __importDefault = (this && this.__importDefault) || function (mod) {
52
- return (mod && mod.__esModule) ? mod : { "default": mod };
53
- };
54
- Object.defineProperty(exports, "__esModule", { value: true });
55
- exports.Dropzone = void 0;
56
- var react_1 = __importDefault(require("react"));
57
- var styled_components_1 = __importStar(require("styled-components"));
58
- var Box_1 = require("../Box/Box");
59
- var Button_1 = require("../../form/Button/Button");
60
- var is_prop_valid_1 = __importDefault(require("@emotion/is-prop-valid"));
61
- var HiddenInput = styled_components_1.default.input(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: none;\n"], ["\n display: none;\n"])));
62
- var StyledDropZone = styled_components_1.default.div.withConfig({ shouldForwardProp: is_prop_valid_1.default })(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n border-radius: 4px;\n height: ", ";\n \n border-radius: 4px;\n border: 1px solid rgba(34,36,38,.15);\n \n & > * {\n pointerEvents: none;\n }\n \n ", "\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n border-radius: 4px;\n height: ", ";\n \n border-radius: 4px;\n border: 1px solid rgba(34,36,38,.15);\n \n & > * {\n pointerEvents: none;\n }\n \n ", "\n"])), function (props) { return props.theme.spacing(25); }, function (props) { return props.isReadyToDrop && (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n background-color: #FAFAFA; \n "], ["\n background-color: #FAFAFA; \n "]))); });
63
- var Dropzone = function (_a) {
64
- var onChange = _a.onChange, icon = _a.icon, label = _a.label, rest = __rest(_a, ["onChange", "icon", "label"]);
65
- var fileInput = react_1.default.useRef(null);
66
- var dropzone = react_1.default.useRef(null);
67
- var _b = react_1.default.useState(false), isReadyToDrop = _b[0], setIsReadyToDrop = _b[1];
68
- var handleChange = react_1.default.useCallback(function (fileList) {
69
- if (fileList && onChange) {
70
- onChange(Array.from(fileList));
71
- }
72
- }, [onChange]);
73
- var handleDragOver = react_1.default.useCallback(function (e) {
74
- e.preventDefault();
75
- setIsReadyToDrop(true);
76
- }, []);
77
- var handleDragLeave = react_1.default.useCallback(function (e) {
78
- e.preventDefault();
79
- setIsReadyToDrop(false);
80
- }, []);
81
- var handleDrop = react_1.default.useCallback(function (e) {
82
- var _a;
83
- e.preventDefault();
84
- setIsReadyToDrop(false);
85
- handleChange((_a = e.dataTransfer) === null || _a === void 0 ? void 0 : _a.files);
86
- }, [handleChange]);
87
- var handleClick = react_1.default.useCallback(function () {
88
- var _a;
89
- // We trigger the 'file pick' dialog by delegating the click to a hidden file-input.
90
- (_a = fileInput.current) === null || _a === void 0 ? void 0 : _a.click();
91
- }, [fileInput]);
92
- var handleInputChange = react_1.default.useCallback(function () {
93
- var _a;
94
- handleChange((_a = fileInput === null || fileInput === void 0 ? void 0 : fileInput.current) === null || _a === void 0 ? void 0 : _a.files);
95
- }, [fileInput, handleChange]);
96
- return (react_1.default.createElement(StyledDropZone, __assign({ ref: dropzone, onDragOver: handleDragOver, onDragLeave: handleDragLeave, onDrop: handleDrop, onClick: handleClick, isReadyToDrop: isReadyToDrop }, rest),
97
- react_1.default.createElement(HiddenInput, { "data-testid": "dropzone-file-input", type: "file", ref: fileInput, onChange: handleInputChange, multiple: true }),
98
- react_1.default.createElement(Box_1.Box, null,
99
- react_1.default.createElement(Button_1.Button, { variant: "text", color: "secondary", type: "button", icon: icon }, label))));
100
- };
101
- exports.Dropzone = Dropzone;
102
- var templateObject_1, templateObject_2, templateObject_3;
@@ -1,31 +0,0 @@
1
- "use strict";
2
- var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
- if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
- return cooked;
5
- };
6
- var __importDefault = (this && this.__importDefault) || function (mod) {
7
- return (mod && mod.__esModule) ? mod : { "default": mod };
8
- };
9
- Object.defineProperty(exports, "__esModule", { value: true });
10
- exports.Feedback = void 0;
11
- var react_1 = __importDefault(require("react"));
12
- var Box_1 = require("../Box/Box");
13
- var Header_1 = require("../../typography/Header/Header");
14
- var AnimatedCheckmark_1 = require("../AnimatedCheckmark/AnimatedCheckmark");
15
- var Button_1 = require("../../form/Button/Button");
16
- var Modal_1 = require("../Modal/Modal");
17
- var styled_components_1 = __importDefault(require("styled-components"));
18
- var StyledBox = (0, styled_components_1.default)(Box_1.Box)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n width: 300px; \n"], ["\n width: 300px; \n"])));
19
- var Feedback = function (_a) {
20
- var onConfirm = _a.onConfirm, buttonLabel = _a.buttonLabel, buttonIcon = _a.buttonIcon, title = _a.title, subtitle = _a.subtitle;
21
- return (react_1.default.createElement(Modal_1.Modal, { handleClickOverlay: onConfirm, buttons: react_1.default.createElement(Button_1.Button, { "data-testid": 'confirm', stretch: true, icon: buttonIcon, variant: 'secondary', onClick: onConfirm }, buttonLabel) },
22
- react_1.default.createElement(StyledBox, { pt: 3, pb: 3 },
23
- react_1.default.createElement(Box_1.Box, { pb: 5, textAlign: "center" },
24
- react_1.default.createElement(Header_1.Header, null, title),
25
- subtitle && react_1.default.createElement(Box_1.Box, { pt: 5 },
26
- react_1.default.createElement(Header_1.Header, { level: 5 }, subtitle))),
27
- react_1.default.createElement(Box_1.Box, { pt: 5, pb: 5, pl: 7, pr: 7 },
28
- react_1.default.createElement(AnimatedCheckmark_1.AnimatedCheckmark, null)))));
29
- };
30
- exports.Feedback = Feedback;
31
- var templateObject_1;
@@ -1,48 +0,0 @@
1
- "use strict";
2
- var __assign = (this && this.__assign) || function () {
3
- __assign = Object.assign || function(t) {
4
- for (var s, i = 1, n = arguments.length; i < n; i++) {
5
- s = arguments[i];
6
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
- t[p] = s[p];
8
- }
9
- return t;
10
- };
11
- return __assign.apply(this, arguments);
12
- };
13
- var __rest = (this && this.__rest) || function (s, e) {
14
- var t = {};
15
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
16
- t[p] = s[p];
17
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
18
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
19
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
20
- t[p[i]] = s[p[i]];
21
- }
22
- return t;
23
- };
24
- var __importDefault = (this && this.__importDefault) || function (mod) {
25
- return (mod && mod.__esModule) ? mod : { "default": mod };
26
- };
27
- Object.defineProperty(exports, "__esModule", { value: true });
28
- exports.Floater = void 0;
29
- var Box_1 = require("../Box/Box");
30
- var react_1 = __importDefault(require("react"));
31
- var FloaterItem_1 = require("./FloaterItem");
32
- var horizontalMargin = { laptop: -1 };
33
- var verticalMargin = { mobile: -1, laptop: 0 };
34
- var display = { mobile: "block", laptop: "flex" };
35
- var hasElement = function (item) {
36
- return !!item.element;
37
- };
38
- var Floater = function (_a) {
39
- var items = _a.items, _b = _a.forceEqualWidth, forceEqualWidth = _b === void 0 ? false : _b, _c = _a.stretch, stretch = _c === void 0 ? false : _c, props = __rest(_a, ["items", "forceEqualWidth", "stretch"]);
40
- return react_1.default.createElement(Box_1.Box, __assign({ mb: verticalMargin, mt: verticalMargin, ml: horizontalMargin, mr: horizontalMargin, display: display }, props), items
41
- .filter(Boolean)
42
- .map(function (item, i) {
43
- return hasElement(item)
44
- ? (react_1.default.createElement(FloaterItem_1.FloaterItem, { key: i, laptopWidth: item.forceEqualWidth ? "".concat(100 / items.length, "%") : undefined, stretch: item.stretch || false }, item.element))
45
- : react_1.default.createElement(FloaterItem_1.FloaterItem, { key: i, laptopWidth: forceEqualWidth ? "".concat(100 / items.length, "%") : undefined, stretch: stretch }, item);
46
- }));
47
- };
48
- exports.Floater = Floater;
@@ -1,39 +0,0 @@
1
- "use strict";
2
- var __assign = (this && this.__assign) || function () {
3
- __assign = Object.assign || function(t) {
4
- for (var s, i = 1, n = arguments.length; i < n; i++) {
5
- s = arguments[i];
6
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
- t[p] = s[p];
8
- }
9
- return t;
10
- };
11
- return __assign.apply(this, arguments);
12
- };
13
- var __rest = (this && this.__rest) || function (s, e) {
14
- var t = {};
15
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
16
- t[p] = s[p];
17
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
18
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
19
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
20
- t[p[i]] = s[p[i]];
21
- }
22
- return t;
23
- };
24
- var __importDefault = (this && this.__importDefault) || function (mod) {
25
- return (mod && mod.__esModule) ? mod : { "default": mod };
26
- };
27
- Object.defineProperty(exports, "__esModule", { value: true });
28
- exports.FloaterItem = void 0;
29
- var Box_1 = require("../Box/Box");
30
- var react_1 = __importDefault(require("react"));
31
- var horizontalPadding = { laptop: 1 };
32
- var verticalPadding = { mobile: 1, laptop: 0 };
33
- var flexGrow = { laptop: 1 };
34
- var FloaterItem = function (_a) {
35
- var stretch = _a.stretch, laptopWidth = _a.laptopWidth, props = __rest(_a, ["stretch", "laptopWidth"]);
36
- var width = react_1.default.useMemo(function () { return ({ laptop: laptopWidth }); }, [laptopWidth]);
37
- return react_1.default.createElement(Box_1.Box, __assign({ flexGrow: stretch ? flexGrow : undefined, width: width, pt: verticalPadding, pb: verticalPadding, pl: horizontalPadding, pr: horizontalPadding }, props));
38
- };
39
- exports.FloaterItem = FloaterItem;
@@ -1,21 +0,0 @@
1
- "use strict";
2
- var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
- if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
- return cooked;
5
- };
6
- var __importDefault = (this && this.__importDefault) || function (mod) {
7
- return (mod && mod.__esModule) ? mod : { "default": mod };
8
- };
9
- Object.defineProperty(exports, "__esModule", { value: true });
10
- exports.Footer = void 0;
11
- var react_1 = __importDefault(require("react"));
12
- var styled_components_1 = __importDefault(require("styled-components"));
13
- var Box_1 = require("../Box/Box");
14
- var SideBar_1 = require("../Menu/SideBar");
15
- var StyledBox = (0, styled_components_1.default)(Box_1.Box)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n border-top: 1px solid #DDDDDD;\n box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.04); \n box-sizing: border-box;\n"], ["\n background-color: ", ";\n border-top: 1px solid #DDDDDD;\n box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.04); \n box-sizing: border-box;\n"])), function (props) { return props.theme.palette.common.white; });
16
- var Footer = function (_a) {
17
- var children = _a.children;
18
- return (react_1.default.createElement(StyledBox, { pt: 2, pb: 2, pr: 5, pl: { mobile: 5, laptop: SideBar_1.SIDEBAR_COLLAPSED_WIDTH + 5 } }, children));
19
- };
20
- exports.Footer = Footer;
21
- var templateObject_1;
@@ -1,20 +0,0 @@
1
- "use strict";
2
- var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
- if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
- return cooked;
5
- };
6
- var __importDefault = (this && this.__importDefault) || function (mod) {
7
- return (mod && mod.__esModule) ? mod : { "default": mod };
8
- };
9
- Object.defineProperty(exports, "__esModule", { value: true });
10
- exports.HorizontalScroller = void 0;
11
- var react_1 = __importDefault(require("react"));
12
- var Box_1 = require("../Box/Box");
13
- var styled_components_1 = __importDefault(require("styled-components"));
14
- var Scroller = (0, styled_components_1.default)(Box_1.Box)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n overflow-x: auto;\n overflow-y: hidden;\n"], ["\n overflow-x: auto;\n overflow-y: hidden;\n"])));
15
- var HorizontalScroller = function (_a) {
16
- var children = _a.children;
17
- return (react_1.default.createElement(Scroller, null, children));
18
- };
19
- exports.HorizontalScroller = HorizontalScroller;
20
- var templateObject_1;
@@ -1,15 +0,0 @@
1
- "use strict";
2
- var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
- if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
- return cooked;
5
- };
6
- var __importDefault = (this && this.__importDefault) || function (mod) {
7
- return (mod && mod.__esModule) ? mod : { "default": mod };
8
- };
9
- Object.defineProperty(exports, "__esModule", { value: true });
10
- exports.HamburgerButton = void 0;
11
- var styled_components_1 = __importDefault(require("styled-components"));
12
- var Button_1 = require("../../form/Button/Button");
13
- var responsiveProps_1 = require("../../responsiveness/responsiveProps");
14
- exports.HamburgerButton = (0, styled_components_1.default)(Button_1.Button)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n margin-right: ", "; \n ", " \n"], ["\n margin-right: ", "; \n ", " \n"])), function (props) { return props.theme.spacing(3); }, (0, responsiveProps_1.mq)("laptop", "display: none;"));
15
- var templateObject_1;
@@ -1,48 +0,0 @@
1
- "use strict";
2
- var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
- if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
- return cooked;
5
- };
6
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
7
- if (k2 === undefined) k2 = k;
8
- var desc = Object.getOwnPropertyDescriptor(m, k);
9
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
10
- desc = { enumerable: true, get: function() { return m[k]; } };
11
- }
12
- Object.defineProperty(o, k2, desc);
13
- }) : (function(o, m, k, k2) {
14
- if (k2 === undefined) k2 = k;
15
- o[k2] = m[k];
16
- }));
17
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
18
- Object.defineProperty(o, "default", { enumerable: true, value: v });
19
- }) : function(o, v) {
20
- o["default"] = v;
21
- });
22
- var __importStar = (this && this.__importStar) || function (mod) {
23
- if (mod && mod.__esModule) return mod;
24
- var result = {};
25
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
26
- __setModuleDefault(result, mod);
27
- return result;
28
- };
29
- var __importDefault = (this && this.__importDefault) || function (mod) {
30
- return (mod && mod.__esModule) ? mod : { "default": mod };
31
- };
32
- Object.defineProperty(exports, "__esModule", { value: true });
33
- exports.MenuItem = exports.Menu = void 0;
34
- var styled_components_1 = __importStar(require("styled-components"));
35
- var react_1 = __importDefault(require("react"));
36
- var SlideOpen_1 = require("../../animation/SlideOpen/SlideOpen");
37
- var is_prop_valid_1 = __importDefault(require("@emotion/is-prop-valid"));
38
- exports.Menu = styled_components_1.default.ul(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n padding: 0;\n margin: 0;\n list-style: none;\n"], ["\n padding: 0;\n margin: 0;\n list-style: none;\n"])));
39
- var StyledMenuItem = styled_components_1.default.li.withConfig({ shouldForwardProp: is_prop_valid_1.default })(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n padding: ", ";\n \n ", "\n \n & button:hover, & button:active, & button:focus {\n color: ", " !important;\n }\n \n & button {\n width: 100%;\n }\n \n ", " \n"], ["\n padding: ", ";\n \n ", "\n \n & button:hover, & button:active, & button:focus {\n color: ", " !important;\n }\n \n & button {\n width: 100%;\n }\n \n ", " \n"])), function (props) { return props.theme.spacing(.5, 5); }, function (props) { return props.isOpen && (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject([" \n border-left: ", " solid ", "; \n background: #293846;\n \n & > * {\n margin-left: ", ";\n }\n "], [" \n border-left: ", " solid ", "; \n background: #293846;\n \n & > * {\n margin-left: ", ";\n }\n "])), props.theme.spacing(1), props.theme.palette.colors.blue, props.theme.spacing(-1)); }, function (props) { return props.theme.palette.common.white; }, function (props) { return props.isActive && (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n & button { \n color: ", ";\n }\n "], ["\n & button { \n color: ", ";\n }\n "])), props.theme.palette.common.white); });
40
- var MenuItem = function (_a) {
41
- var item = _a.item, isOpen = _a.isOpen, isActive = _a.isActive, children = _a.children;
42
- var _b = react_1.default.useState(!!isOpen), isDelayedOpen = _b[0], setDelayedOpen = _b[1];
43
- return (react_1.default.createElement(StyledMenuItem, { isOpen: isDelayedOpen, isActive: !!isActive },
44
- item,
45
- children && (react_1.default.createElement(SlideOpen_1.SlideOpen, { onChange: setDelayedOpen, isOpen: !!isOpen, duration: .25 }, children))));
46
- };
47
- exports.MenuItem = MenuItem;
48
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
@@ -1,15 +0,0 @@
1
- "use strict";
2
- var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
- if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
- return cooked;
5
- };
6
- var __importDefault = (this && this.__importDefault) || function (mod) {
7
- return (mod && mod.__esModule) ? mod : { "default": mod };
8
- };
9
- Object.defineProperty(exports, "__esModule", { value: true });
10
- exports.MenuCloseButton = void 0;
11
- var styled_components_1 = __importDefault(require("styled-components"));
12
- var Button_1 = require("../../form/Button/Button");
13
- var responsiveProps_1 = require("../../responsiveness/responsiveProps");
14
- exports.MenuCloseButton = (0, styled_components_1.default)(Button_1.Button)(templateObject_1 || (templateObject_1 = __makeTemplateObject([" \n ", " \n"], [" \n ", " \n"])), (0, responsiveProps_1.mq)("laptop", "display: none;"));
15
- var templateObject_1;
@@ -1,22 +0,0 @@
1
- "use strict";
2
- var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
- if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
- return cooked;
5
- };
6
- var __importDefault = (this && this.__importDefault) || function (mod) {
7
- return (mod && mod.__esModule) ? mod : { "default": mod };
8
- };
9
- Object.defineProperty(exports, "__esModule", { value: true });
10
- exports.MenuSlideOpenIndicator = void 0;
11
- var react_1 = __importDefault(require("react"));
12
- var styled_components_1 = __importDefault(require("styled-components"));
13
- var responsiveProps_1 = require("../../responsiveness/responsiveProps");
14
- var SideBar_1 = require("./SideBar");
15
- var Box_1 = require("../Box/Box");
16
- var StyledBox = (0, styled_components_1.default)(Box_1.Box)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: none;\n ", "\n \n height: 100%;\n flex-direction: row;\n align-items: center;\n \n width: ", "; \n \n & > svg {\n margin: 0 auto; \n }\n \n ", ":hover & {\n display:none;\n }\n"], ["\n display: none;\n ", "\n \n height: 100%;\n flex-direction: row;\n align-items: center;\n \n width: ", "; \n \n & > svg {\n margin: 0 auto; \n }\n \n ", ":hover & {\n display:none;\n }\n"])), (0, responsiveProps_1.mq)("laptop", "display: flex;"), function (props) { return props.theme.spacing(SideBar_1.SIDEBAR_COLLAPSED_WIDTH); }, SideBar_1.StyledSidebar);
17
- var MenuSlideOpenIndicator = function (_a) {
18
- var children = _a.children;
19
- return (react_1.default.createElement(StyledBox, null, children));
20
- };
21
- exports.MenuSlideOpenIndicator = MenuSlideOpenIndicator;
22
- var templateObject_1;
@@ -1,59 +0,0 @@
1
- "use strict";
2
- var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
- if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
- return cooked;
5
- };
6
- var __assign = (this && this.__assign) || function () {
7
- __assign = Object.assign || function(t) {
8
- for (var s, i = 1, n = arguments.length; i < n; i++) {
9
- s = arguments[i];
10
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
11
- t[p] = s[p];
12
- }
13
- return t;
14
- };
15
- return __assign.apply(this, arguments);
16
- };
17
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
18
- if (k2 === undefined) k2 = k;
19
- var desc = Object.getOwnPropertyDescriptor(m, k);
20
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
21
- desc = { enumerable: true, get: function() { return m[k]; } };
22
- }
23
- Object.defineProperty(o, k2, desc);
24
- }) : (function(o, m, k, k2) {
25
- if (k2 === undefined) k2 = k;
26
- o[k2] = m[k];
27
- }));
28
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
29
- Object.defineProperty(o, "default", { enumerable: true, value: v });
30
- }) : function(o, v) {
31
- o["default"] = v;
32
- });
33
- var __importStar = (this && this.__importStar) || function (mod) {
34
- if (mod && mod.__esModule) return mod;
35
- var result = {};
36
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
37
- __setModuleDefault(result, mod);
38
- return result;
39
- };
40
- var __importDefault = (this && this.__importDefault) || function (mod) {
41
- return (mod && mod.__esModule) ? mod : { "default": mod };
42
- };
43
- Object.defineProperty(exports, "__esModule", { value: true });
44
- exports.SideBar = exports.StyledSidebar = exports.SIDEBAR_COLLAPSED_WIDTH = void 0;
45
- var styled_components_1 = __importStar(require("styled-components"));
46
- var Box_1 = require("../Box/Box");
47
- var responsiveProps_1 = require("../../responsiveness/responsiveProps");
48
- var react_1 = __importDefault(require("react"));
49
- var UiStateProvider_1 = require("../../UiStateProvider");
50
- exports.SIDEBAR_COLLAPSED_WIDTH = 15;
51
- exports.StyledSidebar = (0, styled_components_1.default)(Box_1.Box)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n float: left;\n \n height: 100%;\n width: 100%; \n \n background-color: #243646;\n \n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n \n z-index: 900;\n \n display: ", "; \n pointer-events: auto;\n \n ", " \n"], ["\n float: left;\n \n height: 100%;\n width: 100%; \n \n background-color: #243646;\n \n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n \n z-index: 900;\n \n display: ", "; \n pointer-events: auto;\n \n ", " \n"])), function (props) { return props.isMobileMenuOpen ? 'block' : 'none'; }, (0, responsiveProps_1.mq)("laptop", (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n position: static; \n display: block;\n width: auto;\n min-width: ", ";\n box-shadow: 2px 0px 6px -1px rgba(0,0,0,0.74);\n \n transition: transform .1s ease-out;\n transform: ", "; \n \n & ul {\n opacity: ", ";\n } \n "], ["\n position: static; \n display: block;\n width: auto;\n min-width: ", ";\n box-shadow: 2px 0px 6px -1px rgba(0,0,0,0.74);\n \n transition: transform .1s ease-out;\n transform: ", "; \n \n & ul {\n opacity: ", ";\n } \n "])), function (props) { var _a; return props.theme.spacing((_a = props.minWidth) !== null && _a !== void 0 ? _a : 75); }, function (props) { return props.isDesktopMenuOpen
52
- ? 'transform: translateX(0);'
53
- : (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["translateX(calc(-100% + ", "));"], ["translateX(calc(-100% + ", "));"])), function (props) { return props.theme.spacing(exports.SIDEBAR_COLLAPSED_WIDTH); }); }, function (props) { return props.isDesktopMenuOpen ? '1' : '0'; })));
54
- var SideBar = function (props) {
55
- var _a = (0, UiStateProvider_1.useUiStateContext)(), closeSideMenu = _a.closeSideMenu, openSideMenu = _a.openSideMenu, isSideMenuOpen = _a.isSideMenuOpen;
56
- return react_1.default.createElement(exports.StyledSidebar, __assign({ isDesktopMenuOpen: isSideMenuOpen }, props, { onMouseEnter: openSideMenu, onMouseLeave: closeSideMenu }));
57
- };
58
- exports.SideBar = SideBar;
59
- var templateObject_1, templateObject_2, templateObject_3;
@@ -1,48 +0,0 @@
1
- "use strict";
2
- var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
- if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
- return cooked;
5
- };
6
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
7
- if (k2 === undefined) k2 = k;
8
- var desc = Object.getOwnPropertyDescriptor(m, k);
9
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
10
- desc = { enumerable: true, get: function() { return m[k]; } };
11
- }
12
- Object.defineProperty(o, k2, desc);
13
- }) : (function(o, m, k, k2) {
14
- if (k2 === undefined) k2 = k;
15
- o[k2] = m[k];
16
- }));
17
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
18
- Object.defineProperty(o, "default", { enumerable: true, value: v });
19
- }) : function(o, v) {
20
- o["default"] = v;
21
- });
22
- var __importStar = (this && this.__importStar) || function (mod) {
23
- if (mod && mod.__esModule) return mod;
24
- var result = {};
25
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
26
- __setModuleDefault(result, mod);
27
- return result;
28
- };
29
- var __importDefault = (this && this.__importDefault) || function (mod) {
30
- return (mod && mod.__esModule) ? mod : { "default": mod };
31
- };
32
- Object.defineProperty(exports, "__esModule", { value: true });
33
- exports.SideBarHeader = void 0;
34
- var react_1 = __importDefault(require("react"));
35
- var styled_components_1 = __importStar(require("styled-components"));
36
- var Box_1 = require("../Box/Box");
37
- var constants_1 = require("../../layouts/constants");
38
- var responsiveProps_1 = require("../../responsiveness/responsiveProps");
39
- var StyledBox = (0, styled_components_1.default)(Box_1.Box)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n box-sizing: border-box; \n color: ", ";\n font-weight: bold; \n \n display: flex; \n text-align: center;\n \n font-size: 14px;\n font-weight: bold;\n letter-spacing: 1px; \n line-height: 1em;\n \n background-color: rgba(0,0,0,.2);\n \n ", " \n"], ["\n box-sizing: border-box; \n color: ", ";\n font-weight: bold; \n \n display: flex; \n text-align: center;\n \n font-size: 14px;\n font-weight: bold;\n letter-spacing: 1px; \n line-height: 1em;\n \n background-color: rgba(0,0,0,.2);\n \n ", " \n"])), function (props) { return props.theme.palette.button.text.idle.text; }, (0, responsiveProps_1.mq)('laptop', (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n min-height: ", ";\n "], ["\n min-height: ", ";\n "])), function (props) { return props.theme.spacing(12); })));
40
- var SideBarHeader = function (_a) {
41
- var children = _a.children, right = _a.right;
42
- return (react_1.default.createElement(StyledBox, { mb: constants_1.VerticalRhythmLaptop },
43
- react_1.default.createElement(Box_1.Box, { flexGrow: 1, display: "flex" },
44
- react_1.default.createElement(Box_1.Box, { flexGrow: 1, display: "flex", flexDirection: "column", justifyContent: "center" }, children)),
45
- right && react_1.default.createElement(Box_1.Box, null, right)));
46
- };
47
- exports.SideBarHeader = SideBarHeader;
48
- var templateObject_1, templateObject_2;
@@ -1,15 +0,0 @@
1
- "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
- Object.defineProperty(exports, "__esModule", { value: true });
6
- exports.useCloseSidebarOnNavigate = void 0;
7
- var UiStateProvider_1 = require("../../UiStateProvider");
8
- var react_1 = __importDefault(require("react"));
9
- var useCloseSidebarOnNavigate = function (pathName) {
10
- var closeSideMenu = (0, UiStateProvider_1.useUiStateContext)().closeSideMenu;
11
- react_1.default.useEffect(function () {
12
- closeSideMenu();
13
- }, [pathName, closeSideMenu]);
14
- };
15
- exports.useCloseSidebarOnNavigate = useCloseSidebarOnNavigate;
@@ -1,30 +0,0 @@
1
- "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
- Object.defineProperty(exports, "__esModule", { value: true });
6
- exports.useToggleMobileMenu = void 0;
7
- var react_1 = __importDefault(require("react"));
8
- var useToggleMobileMenu = function (_a) {
9
- var currentRoute = _a.currentRoute;
10
- var _b = react_1.default.useState(false), isOpen = _b[0], setIsOpen = _b[1];
11
- var toggle = react_1.default.useCallback(function () {
12
- setIsOpen(function (val) { return !val; });
13
- }, []);
14
- var open = react_1.default.useCallback(function () {
15
- setIsOpen(true);
16
- }, []);
17
- var close = react_1.default.useCallback(function () {
18
- setIsOpen(false);
19
- }, []);
20
- react_1.default.useEffect(function () {
21
- close();
22
- }, [currentRoute, close]);
23
- return {
24
- isOpen: isOpen,
25
- open: open,
26
- close: close,
27
- toggle: toggle
28
- };
29
- };
30
- exports.useToggleMobileMenu = useToggleMobileMenu;