quicksnack 3.4.0 → 3.5.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 (6) hide show
  1. package/dist/components/CollapsiblePanel/CollapsiblePanel.js +4 -6
  2. package/dist/components/ConfirmModal/hooks/useConfirmModal.js +5 -1
  3. package/dist/components/Menu/Menu.js +1 -1
  4. package/dist/components/Panel/Panel.js +1 -1
  5. package/dist/form/Button/Button.js +1 -1
  6. package/package.json +17 -17
package/dist/components/CollapsiblePanel/CollapsiblePanel.js CHANGED
@@ -44,24 +44,22 @@ var __rest = (this && this.__rest) || function (s, e) {
44
44
  }
45
45
  return t;
46
46
  };
47
- var __importDefault = (this && this.__importDefault) || function (mod) {
48
- return (mod && mod.__esModule) ? mod : { "default": mod };
49
- };
50
47
  Object.defineProperty(exports, "__esModule", { value: true });
51
48
  exports.CollapsiblePanel = void 0;
52
49
  var react_1 = __importStar(require("react"));
53
- var styled_components_1 = __importDefault(require("styled-components"));
50
+ var styled_components_1 = __importStar(require("styled-components"));
54
51
  var Panel_1 = require("../Panel/Panel");
55
52
  var SlideOpen_1 = require("../../animation/SlideOpen/SlideOpen");
56
53
  var Box_1 = require("../Box/Box");
57
54
  var TitleActionWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n transform: scaleY( ", " );\n"], ["\n transform: scaleY( ", " );\n"])), function (props) { return props.isOpen ? '-1' : '1'; });
55
+ var StyledPanel = (0, styled_components_1.default)(Panel_1.Panel)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) { return !props.isOpen && (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["border-bottom: 0;"], ["border-bottom: 0;"]))); });
58
56
  var CollapsiblePanel = function (_a) {
59
57
  var isInitiallyOpen = _a.isInitiallyOpen, children = _a.children, titleAction = _a.titleAction, rest = __rest(_a, ["isInitiallyOpen", "children", "titleAction"]);
60
58
  var _b = (0, react_1.useState)(isInitiallyOpen), isOpen = _b[0], setIsOpen = _b[1];
61
59
  var toggleOpen = (0, react_1.useCallback)(function () { return setIsOpen(!isOpen); }, [setIsOpen, isOpen]);
62
- return (react_1.default.createElement(Panel_1.Panel, __assign({}, rest, { onClickTitle: toggleOpen, p: 0, titleAction: react_1.default.createElement(TitleActionWrapper, { isOpen: isOpen }, titleAction) }),
60
+ return (react_1.default.createElement(StyledPanel, __assign({}, rest, { isOpen: isOpen, onClickTitle: toggleOpen, p: 0, titleAction: react_1.default.createElement(TitleActionWrapper, { isOpen: isOpen }, titleAction) }),
63
61
  react_1.default.createElement(SlideOpen_1.SlideOpen, { isOpen: isOpen },
64
62
  react_1.default.createElement(Box_1.Box, { p: 3 }, children))));
65
63
  };
66
64
  exports.CollapsiblePanel = CollapsiblePanel;
67
- var templateObject_1;
65
+ var templateObject_1, templateObject_2, templateObject_3;
package/dist/components/ConfirmModal/hooks/useConfirmModal.js CHANGED
@@ -10,10 +10,14 @@ var useConfirmModal = function (_a) {
10
10
  var _b = react_1.default.useState(false), isOpen = _b[0], setIsOpen = _b[1];
11
11
  var onCancel = function () { return setIsOpen(false); };
12
12
  var handleOpen = function () { return setIsOpen(true); };
13
+ var handleConfirm = function () {
14
+ onConfirm();
15
+ setIsOpen(false);
16
+ };
13
17
  return [
14
18
  {
15
19
  onCancel: onCancel,
16
- onConfirm: onConfirm,
20
+ onConfirm: handleConfirm,
17
21
  isOpen: isOpen,
18
22
  },
19
23
  handleOpen,
package/dist/components/Menu/Menu.js CHANGED
@@ -31,7 +31,7 @@ var styled_components_1 = __importStar(require("styled-components"));
31
31
  var react_1 = __importDefault(require("react"));
32
32
  var SlideOpen_1 = require("../../animation/SlideOpen/SlideOpen");
33
33
  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"])));
34
- var StyledMenuItem = styled_components_1.default.li(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n padding: ", ";\n \n ", "\n \n & button:hover, & button:active, & button:focus {\n color: ", ";\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: ", ";\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: 4px solid ", ";\n background: #293846;\n "], [" \n border-left: 4px solid ", ";\n background: #293846;\n "])), props.theme.palette.colors.blue); }, 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); });
34
+ var StyledMenuItem = styled_components_1.default.li(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: 4px solid ", ";\n background: #293846;\n "], [" \n border-left: 4px solid ", ";\n background: #293846;\n "])), props.theme.palette.colors.blue); }, 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); });
35
35
  var MenuItem = function (_a) {
36
36
  var item = _a.item, isOpen = _a.isOpen, isActive = _a.isActive, children = _a.children;
37
37
  var _b = react_1.default.useState(!!isOpen), isDelayedOpen = _b[0], setDelayedOpen = _b[1];
package/dist/components/Panel/Panel.js CHANGED
@@ -31,7 +31,7 @@ var react_1 = __importDefault(require("react"));
31
31
  var styled_components_1 = __importStar(require("styled-components"));
32
32
  var Box_1 = require("../Box/Box");
33
33
  var Header_1 = require("../../typography/Header/Header");
34
- var Wrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([" \n background-color: ", "; \n"], [" \n background-color: ", "; \n"])), function (props) { return props.theme.palette.common.white; });
34
+ var Wrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([" \n background-color: ", ";\n border-bottom: 1px solid rgba(34,36,38,.15); \n"], [" \n background-color: ", ";\n border-bottom: 1px solid rgba(34,36,38,.15); \n"])), function (props) { return props.theme.palette.common.white; });
35
35
  var Meta = (0, styled_components_1.default)(Box_1.Box)(templateObject_2 || (templateObject_2 = __makeTemplateObject([" \n font-size: 12px;\n font-style: italic; \n"], [" \n font-size: 12px;\n font-style: italic; \n"])));
36
36
  var Title = (0, styled_components_1.default)(Box_1.Box)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n ", "\n \n ", " \n"], ["\n ", "\n \n ", " \n"])), function (props) { return props.panelHasChildren && (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n border-radius: 4px; \n border-bottom: 1px solid rgba(34,36,38,.15);\n "], ["\n border-radius: 4px; \n border-bottom: 1px solid rgba(34,36,38,.15);\n "]))); }, function (props) { return !!props.onClick && (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n cursor: pointer;\n user-select: none;\n "], ["\n cursor: pointer;\n user-select: none;\n "]))); });
37
37
  var Footer = (0, styled_components_1.default)(Box_1.Box)(templateObject_6 || (templateObject_6 = __makeTemplateObject([" \n border-radius: 4px; \n background-color: #FFF;\n border-top: 1px solid rgba(34,36,38,.15);\n"], [" \n border-radius: 4px; \n background-color: #FFF;\n border-top: 1px solid rgba(34,36,38,.15);\n"])));
package/dist/form/Button/Button.js CHANGED
@@ -65,7 +65,7 @@ var StyledButton = styled_components_1.default.button(templateObject_8 || (templ
65
65
  }, function (props) {
66
66
  var _a;
67
67
  var _b = theme_1.theme.palette.button[(_a = props.variant) !== null && _a !== void 0 ? _a : 'default'], idle = _b.idle, hover = _b.hover, active = _b.active;
68
- return "\n color: ".concat(idle.text, ";\n background-color: ").concat(idle.background, "; \n \n &:hover:not(:disabled), &:focus {\n color: ").concat(hover.text, ";\n background-color: ").concat(hover.background, "; \n } \n\n &:active {\n color: ").concat(active.text, ";\n background-color: ").concat(active.background, "; \n } \n ");
68
+ return "\n color: ".concat(idle.text, ";\n background-color: ").concat(idle.background, "; \n \n &:not(:disabled) {\n &:hover, &:focus {\n color: ").concat(hover.text, ";\n background-color: ").concat(hover.background, "; \n } \n \n &:active {\n color: ").concat(active.text, ";\n background-color: ").concat(active.background, "; \n } \n }\n \n ");
69
69
  });
70
70
  var IconWrapper = styled_components_1.default.span(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n ", "\n \n ", " \n"], ["\n ", "\n \n ", " \n"])), function (props) { return props.variant !== "text" && (0, styled_components_1.css)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n min-width: ", ";\n "], ["\n min-width: ", ";\n "])), props.theme.spacing(10)); }, function (props) { return props.variant === "text"
71
71
  ? props.hasChildren && (0, styled_components_1.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n padding-right: ", ";\n "], ["\n padding-right: ", ";\n "])), props.theme.spacing(2))
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "quicksnack",
3
3
  "description": "Quickly create beautiful admin layouts using react",
4
- "version": "3.4.0",
4
+ "version": "3.5.0",
5
5
  "private": false,
6
6
  "files": [
7
7
  "dist/**"
@@ -41,9 +41,9 @@
41
41
  },
42
42
  "dependencies": {
43
43
  "clsx": "1.1.1",
44
- "immer": "9.0.7",
44
+ "immer": "9.0.12",
45
45
  "lodash.difference": "4.5.0",
46
- "polished": "4.1.3"
46
+ "polished": "4.1.4"
47
47
  },
48
48
  "peerDependencies": {
49
49
  "react": "^17.0.1",
@@ -53,31 +53,31 @@
53
53
  "devDependencies": {
54
54
  "@semantic-release/git": "10.0.1",
55
55
  "@semantic-release/gitlab": "7.0.4",
56
- "@semantic-release/npm": "8.0.3",
57
- "@storybook/addon-actions": "6.4.10",
58
- "@storybook/addon-essentials": "6.4.10",
59
- "@storybook/addon-links": "6.4.10",
60
- "@storybook/builder-webpack5": "^6.4.10",
61
- "@storybook/manager-webpack5": "^6.4.10",
62
- "@storybook/node-logger": "6.4.10",
56
+ "@semantic-release/npm": "9.0.0",
57
+ "@storybook/addon-actions": "6.4.18",
58
+ "@storybook/addon-essentials": "6.4.18",
59
+ "@storybook/addon-links": "6.4.18",
60
+ "@storybook/builder-webpack5": "6.4.18",
61
+ "@storybook/manager-webpack5": "6.4.18",
62
+ "@storybook/node-logger": "6.4.18",
63
63
  "@storybook/preset-create-react-app": "4.0.0",
64
- "@storybook/react": "6.4.10",
65
- "@testing-library/jest-dom": "5.16.1",
64
+ "@storybook/react": "6.4.18",
65
+ "@testing-library/jest-dom": "5.16.2",
66
66
  "@testing-library/react": "12.1.2",
67
67
  "@testing-library/user-event": "13.5.0",
68
68
  "@types/jest": "27.4.0",
69
69
  "@types/lodash": "4.14.178",
70
- "@types/node": "16.11.17",
71
- "@types/react": "17.0.38",
70
+ "@types/node": "16.11.22",
71
+ "@types/react": "17.0.39",
72
72
  "@types/react-dom": "17.0.11",
73
- "@types/styled-components": "5.1.19",
73
+ "@types/styled-components": "5.1.21",
74
74
  "babel-loader": "8.2.3",
75
75
  "react": "17.0.2",
76
76
  "react-dom": "17.0.2",
77
77
  "react-icons": "4.3.1",
78
78
  "react-scripts": "5.0.0",
79
- "semantic-release": "18.0.1",
79
+ "semantic-release": "19.0.2",
80
80
  "styled-components": "5.3.3",
81
- "typescript": "4.5.4"
81
+ "typescript": "4.5.5"
82
82
  }
83
83
  }