oa-componentbook 1.0.1-stage.80 → 1.0.1-stage.81
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.
|
@@ -7,5 +7,5 @@ exports.default = void 0;
|
|
|
7
7
|
var _styledComponents = require("styled-components");
|
|
8
8
|
var _templateObject;
|
|
9
9
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
10
|
-
const CommonStyles = (0, _styledComponents.createGlobalStyle)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.tooltip-grid {\n display: flex;\n
|
|
10
|
+
const CommonStyles = (0, _styledComponents.createGlobalStyle)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.tooltip-grid {\n display: flex;\n align-items: flex-start;\n padding: 8px 0 0;\n row-gap: 32px;\n}\n\n.tooltip-column {\n display: flex;\n flex-direction: column;\n width: 280px;\n}\n\n\n.multipleDocumentTooltip .ant-tooltip-inner{\n padding: 24px 16px;\n background: #fff;\n color: #212121;\n box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);\n width: max-content;\n border-radius: 12px;\n min-width: 300px;\n\n}\n .multipleDocumentTooltip .ant-tooltip-arrow:before{\n background: #fff;\n }\n .multipleDocumentTooltip li.tooltip-item{\n display: flex;\n gap: 8px;\n align-items: flex-start;\n color: #212121;\n font-size: 14px;\n font-weight: 400;\n line-height: 20px; \n padding: 8px 0;\n // width: max-content;\n }\n .tooltip-item p{\n margin: 0;\n }\n .multipleDocumentTooltip ul .headingName{\n color: #717171;\n font-size: 12px;\n font-style: normal;\n font-weight: 700;\n line-height: 16px; \n letter-spacing: 0.24px;\n text-transform: uppercase;\n padding: 0 0 16px;\n }\n .multipleDocumentTooltip .flexWrap{\n display: flex;\n flex-wrap: wrap;\n column-count: 1;\n column-gap: 8px;\n list-style: none;\n justify-content: space-between;\n }\n.ant-modal .ant-modal-content {\n padding: 24px 24px 32px;\n border-radius: 12px;\n }\n .ant-select-dropdown .ant-select-item{\n min-height: auto !important;\n }\n .ant-notification .ant-notification-notice-wrapper .ant-notification-notice-message{\n margin-bottom: 0 !important;\n }\n .ant-notification .ant-notification-notice-wrapper{\n background: transparent;\n }\n .ant-notification .ant-notification-notice-wrapper .ant-notification-notice-close{\n position: inherit !important;\n width: 24px !important;\n height: 24px !important;\n }\n .ant-notification .ant-notification-notice-wrapper .ant-notification-notice-closable .ant-notification-notice-message {\n padding-inline-end: 0px !important;\n}\n .ant-notification-notice-close > button{\n width: 24px !important;\n height: 24px !important;\n }\n .ant-notification .ant-notification-notice-wrapper .ant-notification-notice {\n display: flex;\n align-items: center;\n gap: 12px;\n justify-content: space-between;\n }\n .documentDrawer .ant-drawer-body{\n overflow: hidden;\n padding: 0;\n }\n .documentDrawer .rightContSection {\n overflow-y: scroll;\n height: calc(100vh - 114px);\n }\n .documentDrawer .ant-radio-group{\n display: flex;\n white-space: nowrap;\n }\n @media (max-width: 372px) {\n .ant-picker-date-panel .ant-picker-body{\n padding: 8px !important;\n }\n }\n@media (max-width: 600px) {\n .ant-drawer .ant-drawer-header,.ant-drawer .ant-drawer-body{\n padding: 16px !important;\n }\n .ant-drawer .ant-drawer-footer {\n padding: 12px 16px;\n }\n .ant-picker-dropdown .ant-picker-date-panel{\n width: 100%;\n }\n .ant-picker-dropdown .ant-picker-time-panel-column {\n overflow-y: auto;\n}\n.ant-picker-dropdown .ant-picker-time-panel-column::-webkit-scrollbar {\n width: 2px;\n }\n\n .ant-modal-root .ant-modal-wrap {\n position: fixed;\n overflow: inherit;\n }\n .ant-modal-root .ant-modal-centered .ant-modal{\n vertical-align: middle;\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100% !important;\n max-width: 100%!important;\n // transform-origin: bottom !important;\n //animation-duration: 0s !important;\n animation-name: slideUp;\n animation-duration: 0.2s;\n transition: .3s ease-in-out;\n animation-timing-function: ease-in;\n }\n @keyframes slideUp {\n 0%,\n 50% {\n transform: translateY(100%);\n opacity: 0;\n }\n \n 60%,\n 100% {\n transform: translateY(0);\n opacity: 1;\n \n }\n }\n .ant-modal .ant-modal-content {\n bottom: -8px;\n left: 0;\n position: absolute;\n right: 0;\n border-bottom-left-radius: 0px;\n border-bottom-right-radius: 0px;\n }\n .ant-modal .ant-modal-body{\n max-height: calc(90vh - 126px);\n overflow: auto;\n padding-right: 16px;\n }\n .ant-modal-footer{\n padding-right: 16px !important;\n }\n .ant-modal .ant-modal-content{\n padding: 24px 16px 32px;\n padding-right: 0;\n }\n}\n\n.ant-dropdown .ant-dropdown-menu .ant-dropdown-menu-item{\n padding: 12px 24px;\n}\n.ant-dropdown-menu{\n min-width: 256px;\n top: 4px;\n}\n.ant-space-item span{\n line-height: 0 !important;\n display: flex;\n}\n.ant-select-dropdown{border-radius: 4px; padding:8px 0 !important;\n background: var(--color-primary-background) ;\n box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);}\n\n.ant-select-dropdown .ant-select-item { \n min-height: auto;\n padding: 12px 16px;\n color: var(--color-primary-content) ;\n line-height: 20px;\n border-radius: 0px;\n}\n\n.label-date-dropdown {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n gap: 16px;\n}\n\n.ant-select-dropdown .ant-select-item-option-active span{ color: var(--color-primary) !important;}\n.ant-picker-range {opacity: 0;}\n.ant-picker-dropdown-range { padding: 0; }\n\n.fadeImg{\n position: relative;\n width: 100%;\n max-height: 300px;\n overflow-x: auto;\n}\n.overLayImg{\n background: rgb(0 0 0 / 40%);\n border-radius: 12px 12px 0px 0px;\n overflow: hidden;\n}\n \n.OaTooltip .ant-tooltip-inner{\n padding: 24px 16px;\n background: #fff;\n color: #212121;\n box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);\n width: 348px;\n border-radius: 12px;\n}\n.OaTooltip .ant-tooltip-arrow:before{\n background: #fff !important;\n}\n.OaFooterBtn{\n display: flex;\n justify-content: end;\n}\n.OaTooltip{\n max-width: 348px !important;\n}\n.paddingBot .ant-drawer-body{\n padding-bottom: 100px !important;\n}\n.react-transform-component,.react-transform-wrapper,.react-transform-component > div{\n width: 100%;\n}\n.ascCollapse .ant-collapse-arrow{\n transform: rotate(90deg);\n color: var(--color-primary) !important;\n font-size: 14px !important;\n}\n.gappingIcons{\n display: flex;\n gap: 16px;\n}\n.imageZoom .ant-modal-body > div{\n height: 350px;\n overflow-y: auto;\n margin: 30px 0px 0px;\n padding: 0px 8px 0 0;;\n \n}\n/* width */\n.imageZoom ::-webkit-scrollbar {\n width: 8px;\n height: 100px;\n border-radius: 8px;\n}\n\n/* Track */\n.imageZoom ::-webkit-scrollbar-track {\n background: #f6f6f6; \n border-radius: 8px;\n}\n \n/* Handle */\n.imageZoom ::-webkit-scrollbar-thumb {\n background: #888; \n border-radius: 8px;\n height: 100px;\n}\n\n/* Handle on hover */\n.imageZoom ::-webkit-scrollbar-thumb:hover {\n background: #555; \n}\n .modalImg{\n width: 100%;\n }\n.overflowScroll{\n position: relative;\n}\n.ascCollapse .ant-collapse-header{\n border-radius: 4px !important;\n background: var(--color-secondary-background);\n}\n.ascCollapse,.ant-collapse{\n overflow: hidden;\n}\n.ascCollapse .totalVal{\n display: flex;\n gap: 12px;\n}\n.ascCollapse.ant-collapse-item-active .ant-collapse-arrow{\n transform: rotate(180deg) !important;\n}.mobilesIcons li.ant-dropdown-menu-item > svg {\n display: none\n}\n .ant-notification-notice-close svg{\n font-size: 24px !important;\n height: auto;\n }\n @media only screen and (max-width: 574px) {\n .ant-steps-item-tail{\n inset-inline-start: 78px !important;\n \n }\n}\n @media only screen and (max-width: 480px) {\n .ant-steps-item-tail{\n inset-inline-start: 60px !important;\n \n }\n}\n@media only screen and (max-width: 600px) {\n \n .ant-picker-dropdown .ant-picker-date-panel .ant-picker-body {\n padding: 8px;\n }\n .ant-picker-dropdown { width: 100%; left: 0 !important; }\n .mobilesIcons li.ant-dropdown-menu-item > svg {\n display: block;\n}\n.imageZoom .ant-modal-body>div{\n height: auto;\n overflow-y: auto;\n}\n.imageZoom .ant-modal-footer{\n padding-right: 16px !important;\n}\n .fadeImg{\n max-height: auto;\n }\n .ant-picker-dropdown .ant-picker-date-panel .ant-picker-content th {\n width: 24px; font-size: 12px; font-weight: bold; }\n\n .ant-picker-dropdown .ant-picker-content th {\n height: 24px;\n }\n .ant-picker-dropdown .ant-picker-content td {\n font-size: 12px;\n }\n .ant-picker-dropdown .ant-picker-date-panel .ant-picker-content {\n width: 100%;\n }\n\n}\n.ant-picker .ant-picker-clear{\n font-size: 20px;\n}\n\n"])));
|
|
11
11
|
var _default = exports.default = CommonStyles;
|
|
@@ -168,7 +168,6 @@ function ApprovalWidget(_ref) {
|
|
|
168
168
|
className: "tooltip-grid",
|
|
169
169
|
style: {
|
|
170
170
|
display: "flex",
|
|
171
|
-
gap: "16px",
|
|
172
171
|
flexDirection: totalItems === 1 ? "column" : "row",
|
|
173
172
|
// Make it single column if only 1 item
|
|
174
173
|
width: totalItems === 1 ? "100%" : "auto" // Full width if only 1 item
|
|
@@ -115,8 +115,8 @@ function MembershipCard(_ref) {
|
|
|
115
115
|
color: "secondary-content"
|
|
116
116
|
}, titleInfo)), primaryInfo && /*#__PURE__*/_react.default.createElement("div", {
|
|
117
117
|
className: "primary-info padding-top-8"
|
|
118
|
-
}, /*#__PURE__*/_react.default.createElement("label", null,
|
|
119
|
-
color: primaryInfo.type ===
|
|
118
|
+
}, /*#__PURE__*/_react.default.createElement("label", null, ' ', /*#__PURE__*/_react.default.createElement(_Typography.default, {
|
|
119
|
+
color: primaryInfo.type === 'success' ? 'positive' : 'negative',
|
|
120
120
|
className: "type-t2-700"
|
|
121
121
|
}, primaryInfo.label)))), /*#__PURE__*/_react.default.createElement("div", {
|
|
122
122
|
className: "imgBg"
|
|
@@ -126,7 +126,7 @@ function MembershipCard(_ref) {
|
|
|
126
126
|
}))), itemsToShow.length > 0 && /*#__PURE__*/_react.default.createElement("p", null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
|
|
127
127
|
className: "type-b1-400",
|
|
128
128
|
color: "primary-content"
|
|
129
|
-
}, itemsToShow.join(
|
|
129
|
+
}, itemsToShow.join(', '), remainingItems.length > 0 && /*#__PURE__*/_react.default.createElement("span", {
|
|
130
130
|
role: "button",
|
|
131
131
|
tabIndex: 0
|
|
132
132
|
}, "...+".concat(remainingItems.length, " more")))), tag && /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_CustomTag.default, {
|
|
@@ -135,7 +135,7 @@ function MembershipCard(_ref) {
|
|
|
135
135
|
})), primaryPanel && /*#__PURE__*/_react.default.createElement("div", {
|
|
136
136
|
onClick: primaryPanel.name,
|
|
137
137
|
onKeyDown: e => {
|
|
138
|
-
if (e.key ===
|
|
138
|
+
if (e.key === 'Enter') primaryPanel.name();
|
|
139
139
|
},
|
|
140
140
|
tabIndex: 0,
|
|
141
141
|
role: "button",
|
|
@@ -144,7 +144,7 @@ function MembershipCard(_ref) {
|
|
|
144
144
|
className: "paraWithIcon"
|
|
145
145
|
}, /*#__PURE__*/_react.default.createElement(_CustomIcon.default, {
|
|
146
146
|
style: {
|
|
147
|
-
width:
|
|
147
|
+
width: '24px'
|
|
148
148
|
},
|
|
149
149
|
alt: "phone img",
|
|
150
150
|
src: _offer.default
|
|
@@ -158,8 +158,8 @@ function MembershipCard(_ref) {
|
|
|
158
158
|
icon: _ArrowForwardIos.default
|
|
159
159
|
}))), alert.length > 0 && alert.map((item, i) => {
|
|
160
160
|
var _item$description, _item$description2, _item$description3, _item$description4, _item$description5, _item$description6;
|
|
161
|
-
return ((item === null || item === void 0 ? void 0 : item.subHeading) !==
|
|
162
|
-
className: item !== null && item !== void 0 && (_item$description2 = item.description) !== null && _item$description2 !== void 0 && _item$description2.text && (item === null || item === void 0 || (_item$description3 = item.description) === null || _item$description3 === void 0 ? void 0 : _item$description3.text) !==
|
|
161
|
+
return ((item === null || item === void 0 ? void 0 : item.subHeading) !== '' || (item === null || item === void 0 ? void 0 : item.heading) !== '' || (item === null || item === void 0 || (_item$description = item.description) === null || _item$description === void 0 ? void 0 : _item$description.text) !== undefined) && /*#__PURE__*/_react.default.createElement("div", {
|
|
162
|
+
className: item !== null && item !== void 0 && (_item$description2 = item.description) !== null && _item$description2 !== void 0 && _item$description2.text && (item === null || item === void 0 || (_item$description3 = item.description) === null || _item$description3 === void 0 ? void 0 : _item$description3.text) !== '' ? "toolTipInfo ".concat(item.type) : "toolTipInfo ".concat(item.type, " flexChangeBody")
|
|
163
163
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
164
164
|
className: "toolTip"
|
|
165
165
|
}, item.tooltip && /*#__PURE__*/_react.default.createElement(_CustomTooltip.default, {
|
|
@@ -192,7 +192,7 @@ function MembershipCard(_ref) {
|
|
|
192
192
|
icon: _ArrowForwardIosSharp.default,
|
|
193
193
|
size: 16
|
|
194
194
|
}),
|
|
195
|
-
position:
|
|
195
|
+
position: 'right'
|
|
196
196
|
}
|
|
197
197
|
}))));
|
|
198
198
|
})), footer && (footer === null || footer === void 0 || (_footer$actions = footer.actions) === null || _footer$actions === void 0 ? void 0 : _footer$actions.length) > 0 && /*#__PURE__*/_react.default.createElement(_styles.CardFooter, null, actions && actions.map((action, index) => /*#__PURE__*/_react.default.createElement(_CustomButton.default, {
|