@hexure/ui 1.6.5 → 1.6.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.js +17 -5
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/types/components/Drawer/Drawer.d.ts +2 -0
- package/dist/esm/index.js +17 -5
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/types/components/Drawer/Drawer.d.ts +2 -0
- package/dist/index.d.ts +2 -0
- package/package.json +1 -1
package/dist/cjs/index.js
CHANGED
|
@@ -2684,20 +2684,32 @@ var DatePicker = function (_a) {
|
|
|
2684
2684
|
};
|
|
2685
2685
|
var templateObject_1$f, templateObject_2$d;
|
|
2686
2686
|
|
|
2687
|
-
var Scrim$1 = styled.div(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n position:
|
|
2687
|
+
var Scrim$1 = styled.div(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n position: ", ";\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: ", ";\n background: ", ";\n"], ["\n position: ", ";\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: ", ";\n background: ", ";\n"])), function (_a) {
|
|
2688
|
+
var $position = _a.$position;
|
|
2689
|
+
return $position;
|
|
2690
|
+
}, function (_a) {
|
|
2691
|
+
var $position = _a.$position;
|
|
2692
|
+
return ($position === 'fixed' ? 9998 : 10);
|
|
2693
|
+
}, function (_a) {
|
|
2688
2694
|
var $scrim = _a.$scrim;
|
|
2689
2695
|
return ($scrim === 'dark' ? 'rgba(0,0,0,0.8)' : 'transparent');
|
|
2690
2696
|
});
|
|
2691
|
-
var Container$2 = styled.div(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n z-index:
|
|
2697
|
+
var Container$2 = styled.div(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n z-index: ", ";\n min-width: 400px;\n width: ", ";\n overflow: hidden;\n box-shadow: 0px 10px 30px -15px rgba(0, 0, 0, 0.2);\n outline: none;\n border: none;\n position: ", ";\n top: 0;\n right: 0;\n bottom: 0;\n padding: 0px;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n background: #fff;\n"], ["\n z-index: ", ";\n min-width: 400px;\n width: ", ";\n overflow: hidden;\n box-shadow: 0px 10px 30px -15px rgba(0, 0, 0, 0.2);\n outline: none;\n border: none;\n position: ", ";\n top: 0;\n right: 0;\n bottom: 0;\n padding: 0px;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n background: #fff;\n"])), function (_a) {
|
|
2698
|
+
var $position = _a.$position;
|
|
2699
|
+
return ($position === 'fixed' ? 9998 : 11);
|
|
2700
|
+
}, function (_a) {
|
|
2692
2701
|
var $width = _a.$width;
|
|
2693
2702
|
return $width || '400px';
|
|
2703
|
+
}, function (_a) {
|
|
2704
|
+
var $position = _a.$position;
|
|
2705
|
+
return $position;
|
|
2694
2706
|
});
|
|
2695
2707
|
var Header$2 = styled.div(templateObject_3$b || (templateObject_3$b = __makeTemplateObject(["\n padding: 30px 20px;\n display: flex;\n align-items: flex-start;\n box-sizing: border-box;\n flex-shrink: 0;\n background: #fff;\n"], ["\n padding: 30px 20px;\n display: flex;\n align-items: flex-start;\n box-sizing: border-box;\n flex-shrink: 0;\n background: #fff;\n"])));
|
|
2696
2708
|
var Close$1 = styled.div(templateObject_4$7 || (templateObject_4$7 = __makeTemplateObject(["\n margin-left: auto;\n display: flex;\n align-items: center;\n padding-left: 20px;\n cursor: pointer;\n"], ["\n margin-left: auto;\n display: flex;\n align-items: center;\n padding-left: 20px;\n cursor: pointer;\n"])));
|
|
2697
2709
|
var ContentWrapper$1 = styled.div(templateObject_5$5 || (templateObject_5$5 = __makeTemplateObject(["\n overflow-x: hidden;\n overflow-y: auto;\n box-sizing: border-box;\n flex: 1;\n background: #fff;\n"], ["\n overflow-x: hidden;\n overflow-y: auto;\n box-sizing: border-box;\n flex: 1;\n background: #fff;\n"])));
|
|
2698
2710
|
var ButtonBar$1 = styled.div(templateObject_6$3 || (templateObject_6$3 = __makeTemplateObject(["\n padding: 20px;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n box-sizing: border-box;\n gap: 10px;\n flex-shrink: 0;\n background: #fff;\n"], ["\n padding: 20px;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n box-sizing: border-box;\n gap: 10px;\n flex-shrink: 0;\n background: #fff;\n"])));
|
|
2699
2711
|
var Drawer = function (_a) {
|
|
2700
|
-
var children = _a.children, description = _a.description, title = _a.title, onClose = _a.onClose, primaryButton = _a.primaryButton, secondaryButton = _a.secondaryButton, tertiaryButton = _a.tertiaryButton,
|
|
2712
|
+
var children = _a.children, description = _a.description, title = _a.title, onClose = _a.onClose, primaryButton = _a.primaryButton, _b = _a.position, position = _b === void 0 ? 'fixed' : _b, secondaryButton = _a.secondaryButton, tertiaryButton = _a.tertiaryButton, _c = _a.scrim, scrim = _c === void 0 ? 'dark' : _c, width = _a.width, accessibleProps = __rest(_a, ["children", "description", "title", "onClose", "primaryButton", "position", "secondaryButton", "tertiaryButton", "scrim", "width"]);
|
|
2701
2713
|
React.useEffect(function () {
|
|
2702
2714
|
document.onkeydown = function (e) {
|
|
2703
2715
|
if (e.key === 'Escape') {
|
|
@@ -2709,7 +2721,7 @@ var Drawer = function (_a) {
|
|
|
2709
2721
|
};
|
|
2710
2722
|
}, []);
|
|
2711
2723
|
return (React.createElement(React.Fragment, null,
|
|
2712
|
-
React.createElement(Container$2, __assign({}, accessibleProps, { "$width": width }),
|
|
2724
|
+
React.createElement(Container$2, __assign({}, accessibleProps, { "$position": position, "$width": width }),
|
|
2713
2725
|
React.createElement(Header$2, null,
|
|
2714
2726
|
React.createElement("div", null,
|
|
2715
2727
|
title ? React.createElement(Heading, { type: 'secondary' }, title) : null,
|
|
@@ -2721,7 +2733,7 @@ var Drawer = function (_a) {
|
|
|
2721
2733
|
tertiaryButton ? React.createElement(Button, __assign({}, tertiaryButton, { format: 'secondary' })) : null,
|
|
2722
2734
|
secondaryButton ? React.createElement(Button, __assign({}, secondaryButton, { format: 'secondary' })) : null,
|
|
2723
2735
|
primaryButton ? React.createElement(Button, __assign({}, primaryButton, { format: 'primary' })) : null)) : null),
|
|
2724
|
-
scrim ? React.createElement(Scrim$1, { "$scrim": scrim, onClick: onClose }) : null));
|
|
2736
|
+
scrim ? React.createElement(Scrim$1, { "$position": position, "$scrim": scrim, onClick: onClose }) : null));
|
|
2725
2737
|
};
|
|
2726
2738
|
var templateObject_1$e, templateObject_2$c, templateObject_3$b, templateObject_4$7, templateObject_5$5, templateObject_6$3;
|
|
2727
2739
|
|