oa-componentbook 0.18.373 → 0.18.374

package/build/components/oa-component-accordion/styles.js

@@ -10,4 +10,4 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 var _default = exports.default = {};
 const SmallText = exports.SmallText = _styledComponents.default.small(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  font-size: 18px;\n  color: #e21616;\n  margin: 0 0 0 4px;\n"])));
-const CollapseStyle = exports.CollapseStyle = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  .ant-collapse .ant-collapse-item-disabled {\n    background: var(--color-disabled-button);\n  }\n  /* .ant-collapse-item-active .ant-collapse-expand-icon{\n    transform: rotate(180deg);\n  } */\n  /* .ant-collapse-expand-icon{\n    padding-inline-start: 0 !important;\n  } */\n  .ant-collapse-header-text {\n    color: var(--color-primary-content);\n  }\n  /* .ant-collapse-arrow{\n    color: var(--color-secondary-content) !important;\n  } */\n  .ant-collapse > .ant-collapse-item:last-child,\n  .ant-collapse > .ant-collapse-item:last-child > .ant-collapse-header,\n  .ant-collapse .ant-collapse-item:last-child > .ant-collapse-content {\n    border-radius: 0 0 4px 4px;\n  }\n  .ant-collapse > .ant-collapse-item {\n    border: none;\n  }\n  .ant-collapse {\n    border: 1px solid var(--color-divider);\n    border-radius: 4px;\n    overflow: hidden;\n  }\n\n  .ant-collapse > .ant-collapse-item > .ant-collapse-header {\n    padding: 12px 24px;\n  }\n\n  /* New styles for header content layout */\n  .header-content {\n    display: flex;\n    align-items: flex-start;\n    justify-content: space-between;\n    width: 100%;\n  }\n\n  .header-main {\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n    flex: 1;\n    gap: 8px;\n  }\n\n  .header-tag {\n    margin-bottom: 4px;\n  }\n\n  .header-text {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n  }\n\n  .header-subtext {\n    margin-top: 4px;\n    color: var(--color-secondary-content);\n  }\n\n  /* Custom body styles */\n  .custom-body-item {\n    margin-bottom: 24px;\n  }\n\n  .custom-body-item:last-child {\n    margin-bottom: 0;\n  }\n\n  .custom-body-heading {\n    margin-bottom: 16px;\n  }\n\n  .custom-body-content {\n    // margin-top: 8px;\n  }\n\n  .custom-body-button {\n    margin-top: 16px;\n    display: flex;\n    justify-content: flex-end;\n  }\n\n  .gst-details-keyvalue {\n    .key-value-item {\n      margin-bottom: 4px;\n    }\n\n    .key {\n      font-weight: 400;\n      color: var(--color-primary-content);\n    }\n\n    .value {\n      font-weight: 700;\n      color: var(--color-primary-content);\n    }\n  }\n\n  @media only screen and (max-width: 600px) {\n    .ant-collapse .ant-collapse-content > .ant-collapse-content-box {\n      padding: 16px;\n    }\n    .ant-collapse > .ant-collapse-item > .ant-collapse-header {\n      padding: 12px 16px;\n    }\n  }\n\n  .custom-body-content-titleSubtitle {\n    display: flex;\n    flex-direction: column;\n    gap: 16px; /* spacing between each item */\n  }\n\n  .title-subtitle-item {\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-start;\n  }\n\n  .title-subtitle-item .user-details {\n    flex: 1;\n    display: flex; /* \uD83D\uDC48 add this */\n    flex-direction: column; /* stack name & email vertically */\n    gap: 2px; /* optional: tighten spacing between name & email */\n  }\n"])));
+const CollapseStyle = exports.CollapseStyle = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  .ant-collapse .ant-collapse-item-disabled {\n    background: var(--color-disabled-button);\n  }\n  /* .ant-collapse-item-active .ant-collapse-expand-icon{\n    transform: rotate(180deg);\n  } */\n  /* .ant-collapse-expand-icon{\n    padding-inline-start: 0 !important;\n  } */\n  .ant-collapse-header-text {\n    color: var(--color-primary-content);\n  }\n  /* .ant-collapse-arrow{\n    color: var(--color-secondary-content) !important;\n  } */\n  .ant-collapse > .ant-collapse-item:last-child,\n  .ant-collapse > .ant-collapse-item:last-child > .ant-collapse-header,\n  .ant-collapse .ant-collapse-item:last-child > .ant-collapse-content {\n    border-radius: 0 0 4px 4px;\n  }\n  .ant-collapse > .ant-collapse-item {\n    border: none;\n  }\n  .ant-collapse {\n    border: 1px solid var(--color-divider);\n    border-radius: 4px;\n    overflow: hidden;\n  }\n\n  .ant-collapse > .ant-collapse-item > .ant-collapse-header {\n    padding: 12px 12px;\n  }\n\n  /* New styles for header content layout */\n  .header-content {\n    display: flex;\n    align-items: flex-start;\n    justify-content: space-between;\n    width: 100%;\n  }\n\n  .header-main {\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n    flex: 1;\n    gap: 8px;\n  }\n\n  .header-tag {\n    margin-bottom: 4px;\n  }\n\n  .header-text {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n  }\n\n  .header-subtext {\n    margin-top: 4px;\n    color: var(--color-secondary-content);\n  }\n\n  /* Custom body styles */\n  .custom-body-item {\n    margin-bottom: 24px;\n  }\n\n  .custom-body-item:last-child {\n    margin-bottom: 0;\n  }\n\n  .custom-body-heading {\n    margin-bottom: 16px;\n  }\n\n  .custom-body-content {\n    // margin-top: 8px;\n  }\n\n  .custom-body-button {\n    margin-top: 16px;\n    display: flex;\n    justify-content: flex-end;\n  }\n\n  .gst-details-keyvalue {\n    .key-value-item {\n      margin-bottom: 4px;\n    }\n\n    .key {\n      font-weight: 400;\n      color: var(--color-primary-content);\n    }\n\n    .value {\n      font-weight: 700;\n      color: var(--color-primary-content);\n    }\n  }\n\n  @media only screen and (max-width: 600px) {\n    .ant-collapse .ant-collapse-content > .ant-collapse-content-box {\n      padding: 16px;\n    }\n    .ant-collapse > .ant-collapse-item > .ant-collapse-header {\n      padding: 12px 16px;\n    }\n  }\n\n  .custom-body-content-titleSubtitle {\n    display: flex;\n    flex-direction: column;\n    gap: 16px; /* spacing between each item */\n  }\n\n  .title-subtitle-item {\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-start;\n  }\n\n  .title-subtitle-item .user-details {\n    flex: 1;\n    display: flex; /* \uD83D\uDC48 add this */\n    flex-direction: column; /* stack name & email vertically */\n    gap: 2px; /* optional: tighten spacing between name & email */\n  }\n"])));

package/build/components/oa-component-modal/CustomModal.js

@@ -14,7 +14,7 @@ var _Typography = _interopRequireDefault(require("../oa-component-typography/Typ
 var _typographyOptions = require("../../global-css/typography-options");
 var _utils = require("../../utils");
 var _styles = require("./styles");
-const _excluded = ["buttonConfig", "children", "data-test", "imgSrc", "onCancel", "open", "title", "typographies", "width", "bgColor", "showCloseIcon"];
+const _excluded = ["buttonConfig", "children", "data-test", "imgSrc", "onCancel", "open", "title", "typographies", "width", "bgColor", "showCloseIcon", "maskClosable"];
 /* eslint-disable */
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -63,7 +63,9 @@ function CustomModal(_ref) {
       typographies,
       width,
       bgColor,
-      showCloseIcon = true // Add this prop with default value
+      showCloseIcon = true,
+      // Add this prop with default value
+      maskClosable = true // Control whether clicking mask closes modal
     } = _ref,
     props = _objectWithoutProperties(_ref, _excluded);
   /*
@@ -107,7 +109,8 @@ function CustomModal(_ref) {
     }), /*#__PURE__*/_react.default.createElement(_Typography.default, {
       typography: typographies.title
     }, title)),
-    width: width
+    width: width,
+    maskClosable: maskClosable
   }, props), children && /*#__PURE__*/_react.default.createElement(_styles.DescriptionContainer, null,
   // The label is a string or a number
   ((0, _utils.isString)(children) || (0, _utils.isNumber)(children)) && /*#__PURE__*/_react.default.createElement(_Typography.default, {

package/build/layout/EntityOverviewLayout/EntityOverviewLayout.js

@@ -9,6 +9,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = EntityOverviewLayout;
 require("core-js/modules/web.dom-collections.iterator.js");
 require("core-js/modules/es.promise.js");
+require("core-js/modules/es.json.stringify.js");
 var _react = _interopRequireWildcard(require("react"));
 var _entityOverviewLayoutReducer = require("./reducer/entityOverviewLayoutReducer");
 var _GlobalCss = _interopRequireDefault(require("../../global-css/GlobalCss"));
@@ -43,7 +44,8 @@ function EntityOverviewLayout(_ref) {
       addUserClick,
       deleteUserClick,
       editUserClick,
-      handleDrawerData
+      handleDrawerData,
+      handleSwitchSelectItem
     }
   } = _ref;
   const [state, dispatch] = (0, _react.useReducer)(_entityOverviewLayoutReducer.entityOverviewLayoutReducer, config !== null && config !== void 0 ? config : _entityOverviewLayoutReducer.initialState);
@@ -125,6 +127,30 @@ function EntityOverviewLayout(_ref) {
       type: _entityOverviewLayoutReducer.actionTypes.CLOSE_DRAWER
     });
   };
+  const handleSwitchSelectItemInternal = async (selectedValue, config) => {
+    if (selectedValue) {
+      var _data$listData;
+      // Call the external handler to get new data based on selected value
+      const {
+        error,
+        data
+      } = await (handleSwitchSelectItem === null || handleSwitchSelectItem === void 0 ? void 0 : handleSwitchSelectItem(selectedValue));
+      let selectedItem = data === null || data === void 0 ? void 0 : data.data;
+      const selectedData = data === null || data === void 0 || (_data$listData = data.listData) === null || _data$listData === void 0 ? void 0 : _data$listData.find(item => item.value === selectedValue);
+      {
+        (config === null || config === void 0 ? void 0 : config.storageType) == "sessionStorage" && (config === null || config === void 0 ? void 0 : config.storageKey) && sessionStorage.setItem(config === null || config === void 0 ? void 0 : config.storageKey, JSON.stringify(selectedData));
+      }
+      showSuccessNotification(config === null || config === void 0 ? void 0 : config.successMessage);
+      if (error) {
+        showErrorNotification(error);
+      } else {
+        dispatch({
+          type: _entityOverviewLayoutReducer.actionTypes.UPDATE_PROFILE_DATA,
+          payload: selectedItem
+        });
+      }
+    }
+  };
   const handleActionClick = (actionType, actionData) => {
     var _config$drawer, _drawerDetailData$dat, _state$drawer;
     switch (actionType) {
@@ -186,7 +212,8 @@ function EntityOverviewLayout(_ref) {
       rows: 1
     }
   }, /*#__PURE__*/_react.default.createElement(_ProfileDataWidget.default, _extends({}, profileData === null || profileData === void 0 ? void 0 : profileData.data, {
-    alignProfile: profileData === null || profileData === void 0 ? void 0 : profileData.alignProfile
+    alignProfile: profileData === null || profileData === void 0 ? void 0 : profileData.alignProfile,
+    handleSwitchSelectItem: handleSwitchSelectItemInternal
   }))), (accordionData === null || accordionData === void 0 ? void 0 : accordionData.visible) && Array.isArray(accordionData === null || accordionData === void 0 ? void 0 : accordionData.data) && /*#__PURE__*/_react.default.createElement(_antd.Skeleton, {
     loading: state === null || state === void 0 ? void 0 : state.isLoading,
     active: true,

package/build/layout/EntityOverviewLayout/reducer/entityOverviewLayoutReducer.js

@@ -18,7 +18,8 @@ const actionTypes = exports.actionTypes = {
   SET_MISC: 'SET_MISC',
   SET_DRAWER: 'SET_DRAWER',
   TOGGLE_DRAWER: 'TOGGLE_DRAWER',
-  CLOSE_DRAWER: 'CLOSE_DRAWER'
+  CLOSE_DRAWER: 'CLOSE_DRAWER',
+  UPDATE_PROFILE_DATA: 'UPDATE_PROFILE_DATA'
 };
 const initialState = exports.initialState = {};
 const entityOverviewLayoutReducer = (state, action) => {
@@ -33,6 +34,10 @@ const entityOverviewLayoutReducer = (state, action) => {
       return _objectSpread(_objectSpread({}, state), {}, {
         profileData: _objectSpread(_objectSpread({}, state.profileData), action.payload)
       });
+    case actionTypes.UPDATE_PROFILE_DATA:
+      return _objectSpread(_objectSpread({}, state), {}, {
+        profileData: action.payload
+      });
     case actionTypes.SET_MISC:
       return _objectSpread(_objectSpread({}, state), {}, {
         misc: _objectSpread(_objectSpread({}, state.misc), action.payload)