oa-componentbook 0.6.0 → 0.8.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 (45) hide show
  1. package/build/components/ColorVariables.js +25 -0
  2. package/build/components/oa-component-button/CustomButton.js +60 -0
  3. package/build/components/oa-component-button/styles.js +37 -0
  4. package/build/components/{Wallet Service Details/basicQuestions.js → oa-component-checkbox/CustomCheckBox.js} +28 -22
  5. package/build/components/oa-component-colorUsage/ColorUsage.js +27 -0
  6. package/build/components/oa-component-colorUsage/styles.js +13 -0
  7. package/build/components/oa-component-cornerRadius/CornerRadius.js +25 -0
  8. package/build/components/oa-component-cornerRadius/styles.js +35 -0
  9. package/build/components/{Drawer.js → oa-component-drawer/CustomDrawer.js} +31 -30
  10. package/build/components/oa-component-notification/CustomNotification.js +89 -0
  11. package/build/components/oa-component-notification/styles.js +13 -0
  12. package/build/components/oa-component-radio/CustomRadio.jsx.js +46 -0
  13. package/build/components/oa-component-spacingScales/SpacingScales.js +27 -0
  14. package/build/components/oa-component-spacingScales/styles.js +49 -0
  15. package/build/components/{Table.js → oa-component-table/CustomTable.js} +18 -17
  16. package/build/components/{Button.js → oa-component-tabs/CustomTabs.js} +41 -27
  17. package/build/components/oa-component-toggle/CustomToggle.js +49 -0
  18. package/build/components/oa-component-toggle/styles.js +16 -0
  19. package/build/components/oa-component-typography/Typography.js +34 -0
  20. package/build/components/oa-component-typography/styles.js +13 -0
  21. package/build/index.js +52 -55
  22. package/build/widgets/oa-widget-approval.js +134 -0
  23. package/build/widgets/oa-widget-keyValueDataView/KeyValueDataView.js +67 -0
  24. package/build/widgets/oa-widget-keyValueDataView/styles.js +16 -0
  25. package/build/widgets/oa-widget-stagesTimeline/StageTimeline.js +49 -0
  26. package/build/widgets/oa-widget-stagesTimeline/styles.js +22 -0
  27. package/package.json +17 -6
  28. package/build/components/KeyValueDataView.js +0 -37
  29. package/build/components/Login.js +0 -80
  30. package/build/components/QuesAnsView.js +0 -35
  31. package/build/components/Tabs.js +0 -58
  32. package/build/components/Wallet Service Details/complaintDetail.js +0 -65
  33. package/build/components/Wallet Service Details/serviceDetailsTabView.js +0 -169
  34. package/build/components/Wallet Service Details/styles/styles.css +0 -99
  35. package/build/components/Wallet Service Details/viewMoreDetailsDrawer.js +0 -83
  36. package/build/components/Wallet Service Details/walletServiceDetails.js +0 -71
  37. package/build/components/peclaim-components/CloseClaim.js +0 -212
  38. package/build/components/peclaim-components/ComplaintsTable.js +0 -78
  39. package/build/components/peclaim-components/WorkflowSummaryNotesModal.js +0 -50
  40. package/build/components/peclaim-components/WorkflowSummaryTable.js +0 -75
  41. package/build/components/peclaim-components/compMain.js +0 -54
  42. package/build/components/peclaim-components/wf Main.js +0 -192
  43. package/build/components/style/css/Button.module.css +0 -38
  44. package/build/components/style/css/login.css +0 -335
  45. package/build/components/styles.js +0 -155
@@ -0,0 +1,25 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ var _styledComponents = require("styled-components");
8
+ var _templateObject;
9
+ function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
10
+ /*
11
+ ? Keep this at the top level of the app using any of these components.
12
+ * Do not add any children to it because this element does NOT render any of its children
13
+
14
+ * Instead, follow a syntax similar to this:
15
+ <>
16
+ <ColorVariables />
17
+ <App />
18
+ </>
19
+ */
20
+
21
+ // TODO: Figure out a way to make this work with storybook.
22
+ // Can be used to wrap the entire application, to make these styles available to every component
23
+ const ColorVariables = (0, _styledComponents.createGlobalStyle)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n:root {\n --color-blue-CTA: #014FC5;\n --color-blue-hover: #82A9E2;\n --color-darkblue-background: #003264;\n --color-lightblue-background: #DEF1FB;\n --color-green-success: #00875A;\n --color-lightgreen-success: #CCE7DE;\n --color-yellow-warning: #FF991F;\n --color-lightyellow-warning: #FFEBD2;\n --color-red-error: #DE350B;\n --color-red-hover: #E87254;\n --color-lightred-error: #F8D7CE;\n --color-primarygrey-text: #212121;\n --color-secondarygrey-text: #717171;\n --color-grey1-placeholder: #959595;\n --color-grey2-disabled: #BFBFBF;\n --color-grey3-disabled_divider: #E0E0E0;\n --color-grey4-background: #F6F6F6;\n --color-white-background: #FFFFFF;\n --color-grey5-overlay: rgba(0, 0, 0, 0.7);\n --color-sunyellow-tags: #F5C82D;\n} \n"])));
24
+ var _default = ColorVariables;
25
+ exports.default = _default;
@@ -0,0 +1,60 @@
1
+ "use strict";
2
+
3
+ require("core-js/modules/es.weak-map.js");
4
+ require("core-js/modules/web.dom-collections.iterator.js");
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.default = void 0;
9
+ require("core-js/modules/es.regexp.exec.js");
10
+ require("core-js/modules/es.string.replace.js");
11
+ var _react = _interopRequireDefault(require("react"));
12
+ var _propTypes = _interopRequireDefault(require("prop-types"));
13
+ var _icons = require("@ant-design/icons");
14
+ var _Typography = _interopRequireWildcard(require("../oa-component-typography/Typography"));
15
+ var _styles = _interopRequireDefault(require("./styles"));
16
+ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
17
+ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
18
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
19
+ function CustomButton(_ref) {
20
+ let {
21
+ className,
22
+ disabled,
23
+ onClick,
24
+ iconPosition,
25
+ size,
26
+ label,
27
+ type,
28
+ typography
29
+ } = _ref;
30
+ return /*#__PURE__*/_react.default.createElement(_styles.default, {
31
+ className: "\n ".concat(disabled ? "".concat(type.replace('danger-', ''), "-disabled") : type, " \n ").concat(className, "\n "),
32
+ disabled: disabled,
33
+ onClick: disabled ? null : onClick,
34
+ type: "button"
35
+ }, /*#__PURE__*/_react.default.createElement("div", {
36
+ className: "text-container"
37
+ }, iconPosition === 'left' && /*#__PURE__*/_react.default.createElement(_icons.SearchOutlined, null), /*#__PURE__*/_react.default.createElement(_Typography.default, {
38
+ typography: typography
39
+ }, label), iconPosition === 'right' && /*#__PURE__*/_react.default.createElement(_icons.SearchOutlined, null)));
40
+ }
41
+ CustomButton.propTypes = {
42
+ className: _propTypes.default.string,
43
+ disabled: _propTypes.default.bool,
44
+ onClick: _propTypes.default.func.isRequired,
45
+ size: _propTypes.default.oneOf(['small', 'medium', 'large']),
46
+ iconPosition: _propTypes.default.oneOf(['left', 'right', 'none']),
47
+ label: _propTypes.default.string.isRequired,
48
+ type: _propTypes.default.oneOf(['primary', 'secondary', 'text-only', 'danger-primary', 'danger-secondary', 'danger-text-only']),
49
+ typography: _propTypes.default.oneOf(_Typography.typographyOptions)
50
+ };
51
+ CustomButton.defaultProps = {
52
+ className: '',
53
+ disabled: false,
54
+ size: 'medium',
55
+ iconPosition: 'none',
56
+ type: 'primary',
57
+ typography: 'type-button-500'
58
+ };
59
+ var _default = CustomButton;
60
+ exports.default = _default;
@@ -0,0 +1,37 @@
1
+ "use strict";
2
+
3
+ require("core-js/modules/es.weak-map.js");
4
+ require("core-js/modules/web.dom-collections.iterator.js");
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.default = void 0;
9
+ var _styledComponents = _interopRequireWildcard(require("styled-components"));
10
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
11
+ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
12
+ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
13
+ function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
14
+ const getSizeStyles = size => {
15
+ switch (size) {
16
+ case 'small':
17
+ {
18
+ return (0, _styledComponents.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n min-width: 80px;\n padding: 10px 16px;\n "])));
19
+ }
20
+ case 'medium':
21
+ {
22
+ return (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n min-width: 100px;\n padding: 10px 16px; \n "])));
23
+ }
24
+ case 'large':
25
+ {
26
+ return (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n min-width: 136px;\n padding: 10px 24px;\n "])));
27
+ }
28
+ default:
29
+ {
30
+ return (0, _styledComponents.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n min-width: 100px;\n padding: 10px 16px; \n "])));
31
+ }
32
+ }
33
+ };
34
+ const StyledButton = _styledComponents.default.button(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n border-radius: 4px;\n cursor: pointer;\n\n .text-container {\n display: flex;\n align-items: center;\n justify-content: center;\n \n }\n\n .anticon-search {\n margin: 0 8px 0 0;\n }\n"])));
35
+ const ColoredStyledButton = (0, _styledComponents.default)(StyledButton)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n\n ", "\n\n &.primary {\n background: var(--color-blue-CTA);\n border: 1px solid var(--color-blue-CTA);\n color: var(--color-white-background);\n }\n &.primary:hover {\n background: var(--color-blue-hover);\n }\n\n &.primary-disabled {\n background: var(--color-grey2-disabled);\n cursor: not-allowed;\n color: var(--color-white-background);\n }\n\n &.secondary {\n background: var(--color-white-background);\n border: 1px solid var(--color-blue-CTA);\n color: var(--color-blue-CTA);\n }\n &.secondary:hover {\n border: 1px solid var(--color-blue-hover);\n color: var(--color-blue-hover);\n }\n\n &.secondary-disabled {\n background: var(--color-white-background);\n border: 1px solid var(--color-grey2-disabled);\n color: var(--color-grey2-disabled);\n cursor: not-allowed;\n }\n\n &.text-only {\n border: none;\n background: var(--color-white-background);\n color: var(--color-blue-CTA);\n }\n &.text-only:hover {\n color: var(--color-blue-hover);\n }\n\n &.text-only-disabled {\n border: none;\n background: var(--color-white-background);\n color: var(--color-grey2-disabled);\n cursor: not-allowed;\n }\n \n &.danger-primary {\n background: var(--color-red-error);\n color: var(--color-white-background);\n border: 1px solid var(--color-red-error);\n }\n &.danger-primary:hover {\n background: var(--color-red-hover);\n color: var(--color-white-background);\n border: 1px solid var(--color-red-hover);\n }\n\n &.danger-secondary {\n color: var(--color-red-error);\n border: 1px solid var(--color-red-error);\n background: var(--color-white-background);\n }\n &.danger-secondary:hover {\n color: var(--color-red-hover);\n border: 1px solid var(--color-red-hover);\n background: var(--color-white-background);\n }\n\n &.danger-text-only {\n border: none;\n color: var(--color-red-error);\n background: var(--color-white-background);\n }\n &.danger-text-only:hover {\n border: none;\n color: var(--color-red-hover);\n background: var(--color-white-background);\n }\n"])), props => getSizeStyles(props.size));
36
+ var _default = ColoredStyledButton;
37
+ exports.default = _default;
@@ -6,30 +6,36 @@ Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
8
  exports.default = void 0;
9
- var _react = _interopRequireWildcard(require("react"));
9
+ var _react = _interopRequireDefault(require("react"));
10
+ var _propTypes = _interopRequireDefault(require("prop-types"));
10
11
  var _antd = require("antd");
11
- require("./styles/styles.css");
12
- var _QuesAnsView = _interopRequireDefault(require("../QuesAnsView"));
13
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
12
+ var _Typography = _interopRequireWildcard(require("../oa-component-typography/Typography"));
14
13
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
15
14
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
16
- const BasicQuestions = () => {
17
- const data = [{
18
- questionName: 'Customer Name',
19
- customerAnwser: 'Test'
20
- }, {
21
- questionName: 'Customer Address',
22
- customerAnwser: 'GGN'
23
- }, {
24
- questionName: 'Loss Amount',
25
- customerAnwser: '120000'
26
- }, {
27
- questionName: 'When did you find out about the loss',
28
- customerAnwser: '28-Aug-2023'
29
- }];
30
- return /*#__PURE__*/_react.default.createElement(_QuesAnsView.default, {
31
- data: data
32
- });
15
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
16
+ function CustomCheckBox(_ref) {
17
+ let {
18
+ disabled,
19
+ onChange,
20
+ label,
21
+ typography
22
+ } = _ref;
23
+ return /*#__PURE__*/_react.default.createElement(_antd.Checkbox, {
24
+ disabled: disabled,
25
+ onChange: disabled ? null : onChange
26
+ }, /*#__PURE__*/_react.default.createElement(_Typography.default, {
27
+ typography: typography
28
+ }, label));
29
+ }
30
+ CustomCheckBox.propTypes = {
31
+ disabled: _propTypes.default.bool,
32
+ onChange: _propTypes.default.func.isRequired,
33
+ label: _propTypes.default.string.isRequired,
34
+ typography: _propTypes.default.oneOf(_Typography.typographyOptions)
35
+ };
36
+ CustomCheckBox.defaultProps = {
37
+ disabled: false,
38
+ typography: 'type-b2-400'
33
39
  };
34
- var _default = BasicQuestions;
40
+ var _default = CustomCheckBox;
35
41
  exports.default = _default;
@@ -0,0 +1,27 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = exports.colorOptions = void 0;
7
+ var _react = _interopRequireDefault(require("react"));
8
+ var _propTypes = _interopRequireDefault(require("prop-types"));
9
+ var _styles = _interopRequireDefault(require("./styles"));
10
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
+ // Import the styles from the separate file
12
+
13
+ const colorOptions = ['blue-CTA', 'darkblue-background', 'lightblue-background', 'blue-hover', 'green-success', 'lightgreen-success', 'yellow-warning', 'lightyellow-warning', 'red-error', 'red-hover', 'lightred-error', 'primarygrey-text', 'secondarygrey-text', 'grey1-placeholder', 'grey2-disabled', 'grey3-disabled_divider', 'grey4-background', 'white-background', 'grey5-overlay', 'sunyellow-tags'];
14
+ exports.colorOptions = colorOptions;
15
+ function ColorUsage(_ref) {
16
+ let {
17
+ color
18
+ } = _ref;
19
+ return /*#__PURE__*/_react.default.createElement(_styles.default, {
20
+ color: color
21
+ }, "--color-".concat(color));
22
+ }
23
+ ColorUsage.propTypes = {
24
+ color: _propTypes.default.oneOf(colorOptions).isRequired
25
+ };
26
+ var _default = ColorUsage;
27
+ exports.default = _default;
@@ -0,0 +1,13 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ var _styledComponents = _interopRequireDefault(require("styled-components"));
8
+ var _templateObject;
9
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
10
+ function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
11
+ const StyledColorUsage = _styledComponents.default.h1(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n background-color: var(--color-", ");\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100px;\n width: 450px;\n"])), props => props.color);
12
+ var _default = StyledColorUsage;
13
+ exports.default = _default;
@@ -0,0 +1,25 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ var _react = _interopRequireDefault(require("react"));
8
+ var _propTypes = _interopRequireDefault(require("prop-types"));
9
+ var _styles = require("./styles");
10
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
+ // Import the styles from the separate file
12
+
13
+ function CornerRadius(_ref) {
14
+ let {
15
+ type
16
+ } = _ref;
17
+ return /*#__PURE__*/_react.default.createElement(_styles.StyledCornerComponent, {
18
+ type: type
19
+ }, type);
20
+ }
21
+ CornerRadius.propTypes = {
22
+ type: _propTypes.default.oneOf(['border-radius-xlarge', 'border-radius-large', 'border-radius-medium', 'border-radius-small', 'border-radius-xsmall', 'border-radius-none', 'border-radius-full']).isRequired
23
+ };
24
+ var _default = CornerRadius;
25
+ exports.default = _default;
@@ -0,0 +1,35 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.getBorderSize = exports.StyledCornerComponent = void 0;
7
+ require("core-js/modules/es.regexp.exec.js");
8
+ require("core-js/modules/es.string.replace.js");
9
+ var _styledComponents = _interopRequireDefault(require("styled-components"));
10
+ var _templateObject; // CornerRadiusStyles.js
11
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
12
+ function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
13
+ const getBorderSize = type => {
14
+ switch (type.replace('border-radius-', '')) {
15
+ case 'full':
16
+ return 9999;
17
+ case 'xlarge':
18
+ return 16;
19
+ case 'large':
20
+ return 12;
21
+ case 'medium':
22
+ return 8;
23
+ case 'small':
24
+ return 4;
25
+ case 'xsmall':
26
+ return 2;
27
+ case 'none':
28
+ return 0;
29
+ default:
30
+ return 0;
31
+ }
32
+ };
33
+ exports.getBorderSize = getBorderSize;
34
+ const StyledCornerComponent = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n justify-content: center;\n align-items: center;\n height: 200px;\n width: 200px;\n background-color: blue;\n border-radius: ", "px; // Pass the 'type' prop to getBorderSize\n"])), props => getBorderSize(props.type));
35
+ exports.StyledCornerComponent = StyledCornerComponent;
@@ -7,47 +7,48 @@ Object.defineProperty(exports, "__esModule", {
7
7
  });
8
8
  exports.default = void 0;
9
9
  var _react = _interopRequireWildcard(require("react"));
10
- var _antd = require("antd");
11
10
  var _propTypes = _interopRequireDefault(require("prop-types"));
11
+ var _antd = require("antd");
12
12
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13
13
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
14
14
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
15
- const DrawerDesign = props => {
16
- const {
17
- title,
18
- placement,
15
+ function CustomDrawer(_ref) {
16
+ let {
19
17
  closable,
20
- visible,
21
18
  data,
19
+ height,
22
20
  onClose,
23
- width,
24
- height
25
- } = props;
26
- return /*#__PURE__*/_react.default.createElement("div", {
27
- className: true
28
- }, /*#__PURE__*/_react.default.createElement(_antd.Drawer, {
29
- title: title,
30
- placement: placement,
21
+ open,
22
+ placement,
23
+ title,
24
+ width
25
+ } = _ref;
26
+ return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_antd.Drawer, {
31
27
  closable: closable,
32
28
  onClose: onClose,
33
- visible: visible,
34
- width: width,
35
- height: height
29
+ open: open,
30
+ placement: placement,
31
+ title: title,
32
+ height: height,
33
+ width: width
36
34
  }, data));
35
+ }
36
+ CustomDrawer.propTypes = {
37
+ closable: _propTypes.default.bool,
38
+ data: _propTypes.default.node.isRequired,
39
+ onClose: _propTypes.default.func,
40
+ open: _propTypes.default.bool,
41
+ placement: _propTypes.default.oneOf(['top', 'right', 'bottom', 'left']),
42
+ title: _propTypes.default.string,
43
+ height: _propTypes.default.number.isRequired,
44
+ width: _propTypes.default.number.isRequired
37
45
  };
38
- DrawerDesign.propTypes = {
39
- tabPosition: _propTypes.default.oneOf(['top', 'right', 'bottom', 'left']),
40
- type: _propTypes.default.oneOf(['line', 'card', 'editable-card']),
41
- defaultActiveKey: _propTypes.default.string,
42
- width: _propTypes.default.number,
43
- height: _propTypes.default.number
44
- };
45
- DrawerDesign.defaultProps = {
46
- placement: 'right',
47
- title: '',
46
+ CustomDrawer.defaultProps = {
48
47
  closable: false,
49
- visible: true,
50
- data: ''
48
+ onClose: null,
49
+ open: true,
50
+ placement: 'right',
51
+ title: ''
51
52
  };
52
- var _default = DrawerDesign;
53
+ var _default = CustomDrawer;
53
54
  exports.default = _default;
@@ -0,0 +1,89 @@
1
+ "use strict";
2
+
3
+ require("core-js/modules/es.weak-map.js");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.notificationOptions = exports.default = void 0;
8
+ require("core-js/modules/es.symbol.description.js");
9
+ require("core-js/modules/web.dom-collections.iterator.js");
10
+ var _react = _interopRequireDefault(require("react"));
11
+ var _propTypes = _interopRequireDefault(require("prop-types"));
12
+ var _antd = require("antd");
13
+ var _icons = require("@ant-design/icons");
14
+ var _Typography = _interopRequireWildcard(require("../oa-component-typography/Typography"));
15
+ var _CustomButton = _interopRequireDefault(require("../oa-component-button/CustomButton"));
16
+ var _styles = _interopRequireDefault(require("./styles"));
17
+ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
18
+ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
19
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
20
+ // Import the styles from the separate file
21
+
22
+ const notificationOptions = ['green-success', 'red-error'];
23
+ exports.notificationOptions = notificationOptions;
24
+ function Notification(_ref) {
25
+ let {
26
+ description,
27
+ onChange,
28
+ placement,
29
+ title,
30
+ type,
31
+ typographies
32
+ } = _ref;
33
+ const [api, contextHolder] = _antd.notification.useNotification();
34
+ const openNotification = () => {
35
+ const titleColor = type === 'success' ? 'green-success' : 'red-error';
36
+ const descriptionColor = type === 'success' ? 'type-b3-400' : 'primarygrey-text';
37
+ const borderColor = type === 'success' ? 'var(--color-green-success)' : 'var(--color-red-error)';
38
+ const customNotification = /*#__PURE__*/_react.default.createElement(_styles.default, null, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
39
+ typography: typographies.title,
40
+ color: titleColor
41
+ }, /*#__PURE__*/_react.default.createElement("div", null, title)), /*#__PURE__*/_react.default.createElement(_Typography.default, {
42
+ color: descriptionColor,
43
+ typography: typographies.description
44
+ }, description)), /*#__PURE__*/_react.default.createElement(_icons.CloseOutlined, {
45
+ onClick: api.destroy('string')
46
+ }));
47
+ api.open({
48
+ message: customNotification,
49
+ closeIcon: false,
50
+ duration: 2000,
51
+ style: {
52
+ padding: '8px 16px 8px 16px',
53
+ borderRadius: '4px',
54
+ borderLeft: "4px solid ".concat(borderColor),
55
+ boxShadow: '0px 2px 8px 0px rgba(0, 0, 0, 0.12)'
56
+ },
57
+ placement
58
+ });
59
+ };
60
+ return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, contextHolder, /*#__PURE__*/_react.default.createElement(_CustomButton.default, {
61
+ typography: typographies.button,
62
+ label: "Trigger Notification",
63
+ onClick: openNotification,
64
+ size: "small",
65
+ type: "primary"
66
+ }));
67
+ }
68
+ Notification.propTypes = {
69
+ description: _propTypes.default.string.isRequired,
70
+ onChange: _propTypes.default.func.isRequired,
71
+ placement: _propTypes.default.oneOf(['topLeft', 'topRight', 'bottomLeft', 'bottomRight']),
72
+ title: _propTypes.default.string.isRequired,
73
+ type: _propTypes.default.oneOf(['success', 'failure']).isRequired,
74
+ typographies: _propTypes.default.shape({
75
+ button: _propTypes.default.oneOf(_Typography.typographyOptions),
76
+ description: _propTypes.default.oneOf(_Typography.typographyOptions),
77
+ title: _propTypes.default.oneOf(_Typography.typographyOptions)
78
+ })
79
+ };
80
+ Notification.defaultProps = {
81
+ placement: 'topRight',
82
+ typographies: {
83
+ button: 'type-button-500',
84
+ description: 'type-b3-400',
85
+ title: 'type-b2-400'
86
+ }
87
+ };
88
+ var _default = Notification;
89
+ exports.default = _default;
@@ -0,0 +1,13 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ var _styledComponents = _interopRequireDefault(require("styled-components"));
8
+ var _templateObject; // NotificationStyles.js
9
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
10
+ function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
11
+ const StyledNotification = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n justify-content: space-between;\n .anticon-close {\n cursor: pointer; \n margin: 0 0 0 8px;\n }\n"])));
12
+ var _default = StyledNotification;
13
+ exports.default = _default;
@@ -0,0 +1,46 @@
1
+ "use strict";
2
+
3
+ require("core-js/modules/es.weak-map.js");
4
+ require("core-js/modules/web.dom-collections.iterator.js");
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.default = void 0;
9
+ var _react = _interopRequireDefault(require("react"));
10
+ var _propTypes = _interopRequireDefault(require("prop-types"));
11
+ var _antd = require("antd");
12
+ var _Typography = _interopRequireWildcard(require("../oa-component-typography/Typography"));
13
+ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
14
+ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
15
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
16
+ function CustomRadio(_ref) {
17
+ let {
18
+ disabled,
19
+ onChange,
20
+ size,
21
+ label,
22
+ typography
23
+ } = _ref;
24
+ return /*#__PURE__*/_react.default.createElement(_antd.Radio, {
25
+ disabled: disabled,
26
+ onChange: disabled ? null : onChange,
27
+ size: size,
28
+ type: "radio1"
29
+ }, /*#__PURE__*/_react.default.createElement(_Typography.default, {
30
+ typography: typography
31
+ }, label));
32
+ }
33
+ CustomRadio.propTypes = {
34
+ disabled: _propTypes.default.bool,
35
+ onChange: _propTypes.default.func.isRequired,
36
+ size: _propTypes.default.oneOf(['small', 'middle', 'large']),
37
+ label: _propTypes.default.string.isRequired,
38
+ typography: _propTypes.default.oneOf(_Typography.typographyOptions)
39
+ };
40
+ CustomRadio.defaultProps = {
41
+ disabled: false,
42
+ size: 'middle',
43
+ typography: 'type-b1-400'
44
+ };
45
+ var _default = CustomRadio;
46
+ exports.default = _default;
@@ -0,0 +1,27 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ var _react = _interopRequireDefault(require("react"));
8
+ var _propTypes = _interopRequireDefault(require("prop-types"));
9
+ var _styles = _interopRequireDefault(require("./styles"));
10
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
+ // SpacingScales.js
12
+
13
+ // Import the styled component
14
+
15
+ function SpacingScales(_ref) {
16
+ let {
17
+ type
18
+ } = _ref;
19
+ return /*#__PURE__*/_react.default.createElement(_styles.default, {
20
+ type: type
21
+ }, ' `', type, "` on all sides");
22
+ }
23
+ SpacingScales.propTypes = {
24
+ type: _propTypes.default.oneOf(['spacing-4', 'spacing-8', 'spacing-12', 'spacing-16', 'spacing-24', 'spacing-32', 'spacing-40', 'spacing-48', 'spacing-56', 'spacing-64', 'spacing-72', 'spacing-80', 'spacing-96', 'spacing-108']).isRequired
25
+ };
26
+ var _default = SpacingScales;
27
+ exports.default = _default;
@@ -0,0 +1,49 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ var _styledComponents = _interopRequireDefault(require("styled-components"));
8
+ var _templateObject; // SpacingScalesStyles.js
9
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
10
+ function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
11
+ const SpacingScalesContainer = _styledComponents.default.h1(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n justify-content: center;\n align-items: center;\n background-color: red;\n ", ""])), _ref => {
12
+ let {
13
+ type
14
+ } = _ref;
15
+ switch (type) {
16
+ case 'spacing-4':
17
+ return 'padding: 4px; margin: 0;';
18
+ case 'spacing-8':
19
+ return 'padding: 8px; margin: 0;';
20
+ case 'spacing-12':
21
+ return 'padding: 12px; margin: 0;';
22
+ case 'spacing-16':
23
+ return 'padding: 16px; margin: 0;';
24
+ case 'spacing-24':
25
+ return 'padding: 24px; margin: 0;';
26
+ case 'spacing-32':
27
+ return 'padding: 32px; margin: 0;';
28
+ case 'spacing-40':
29
+ return 'padding: 40px; margin: 0;';
30
+ case 'spacing-48':
31
+ return 'padding: 48px; margin: 0;';
32
+ case 'spacing-56':
33
+ return 'padding: 56px; margin: 0;';
34
+ case 'spacing-64':
35
+ return 'padding: 64px; margin: 0;';
36
+ case 'spacing-72':
37
+ return 'padding: 72px; margin: 0;';
38
+ case 'spacing-80':
39
+ return 'padding: 80px; margin: 0;';
40
+ case 'spacing-96':
41
+ return 'padding: 96px; margin: 0;';
42
+ case 'spacing-108':
43
+ return 'padding: 108px; margin: 0;';
44
+ default:
45
+ return 'padding: 0; margin: 0;';
46
+ }
47
+ });
48
+ var _default = SpacingScalesContainer;
49
+ exports.default = _default;