@paygreen/pgui 2.4.0 → 2.5.0

package/dist/cjs/index.js

@@ -8685,7 +8685,7 @@ var DayPicker = function (props) {
 var FormGroup = function (_a) {
     var children = _a.children, errorMessage = _a.errorMessage, helper = _a.helper, id = _a.id, isRequired = _a.isRequired, label = _a.label, showError = _a.showError, props = __rest$2(_a, ["children", "errorMessage", "helper", "id", "isRequired", "label", "showError"]);
     return (React__default["default"].createElement(react.FormControl, __assign$2({ isInvalid: showError, isRequired: isRequired }, props),
-        !!label && React__default["default"].createElement(react.FormLabel, { htmlFor: id }, label),
+        !!label && (React__default["default"].createElement(react.FormLabel, { htmlFor: id, fontWeight: "bold" }, label)),
         children,
         !!helper && React__default["default"].createElement(react.FormHelperText, null, helper),
         !!errorMessage && (React__default["default"].createElement(react.FormErrorMessage, { id: "".concat(id, "-error") },
@@ -8784,6 +8784,25 @@ var InputDayPicker = function (_a) {
                 isOpen && (React__default["default"].createElement(DayPicker, __assign$2({ initialFocus: isOpen, defaultMonth: selectedDay, selected: selectedDay, onSelect: handleDaySelect }, dayPickerProps, { mode: "single" })))))));
 };
 
+var ModalResponsive = function (_a) {
+    var _b;
+    var isOpen = _a.isOpen, onClose = _a.onClose, finalFocusRef = _a.finalFocusRef, children = _a.children, rest = __rest$2(_a, ["isOpen", "onClose", "finalFocusRef", "children"]);
+    var isMobile = react.useBreakpointValue({ base: true, md: false });
+    var theme = react.useTheme();
+    if (isMobile) {
+        return (React__default["default"].createElement(react.Drawer, __assign$2({ isOpen: isOpen, placement: "bottom", onClose: onClose, finalFocusRef: finalFocusRef }, rest),
+            React__default["default"].createElement(react.DrawerOverlay, null),
+            React__default["default"].createElement(react.DrawerContent, { borderRadius: "".concat(((_b = theme === null || theme === void 0 ? void 0 : theme.radii) === null || _b === void 0 ? void 0 : _b.md) ? "".concat(theme.radii.md, " ").concat(theme.radii.md, " 0 0") : '0') },
+                React__default["default"].createElement(react.DrawerCloseButton, null),
+                children)));
+    }
+    return (React__default["default"].createElement(react.Modal, __assign$2({ isOpen: isOpen, onClose: onClose, finalFocusRef: finalFocusRef, isCentered: true }, rest),
+        React__default["default"].createElement(react.ModalOverlay, null),
+        React__default["default"].createElement(react.ModalContent, null,
+            React__default["default"].createElement(react.ModalCloseButton, null),
+            children)));
+};
+
 var getPaginationInfo = function (_a) {
     var _b = _a.page, page = _b === void 0 ? 1 : _b, _c = _a.pageSize, pageSize = _c === void 0 ? 10 : _c, _d = _a.totalItems, totalItems = _d === void 0 ? 0 : _d;
     var firstItemOnPage = (page - 1) * pageSize + 1;
@@ -51503,6 +51522,7 @@ exports.FormGroup = FormGroup;
 exports.InputDayPicker = InputDayPicker;
 exports.LayoutContainer = LayoutContainer;
 exports.MenuItem = MenuItem;
+exports.ModalResponsive = ModalResponsive;
 exports.Pagination = Pagination;
 exports.PaginationButtonFirstPage = PaginationButtonFirstPage;
 exports.PaginationButtonLastPage = PaginationButtonLastPage;