oa-componentbook 0.0.0-sit1.1

package/build/widgets/oa-widget-view-history/ViewHistoryWidget.js

@@ -0,0 +1,181 @@
+"use strict";
+
+require("core-js/modules/es.object.assign.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = ViewHistoryWidget;
+require("core-js/modules/web.dom-collections.iterator.js");
+require("core-js/modules/es.array.sort.js");
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _CustomDrawer = _interopRequireDefault(require("../../components/oa-component-drawer/CustomDrawer"));
+var _CustomTable = _interopRequireDefault(require("../../components/oa-component-table/CustomTable"));
+var _UploadDownloadWidget = _interopRequireDefault(require("../oa-widget-upload-download/UploadDownloadWidget"));
+var _Typography = _interopRequireDefault(require("../../components/oa-component-typography/Typography"));
+var _styles = require("./styles");
+const _excluded = ["currentDocument", "data-test", "previousDocuments", "name", "onClose", "open"],
+  _excluded2 = ["key", "docDetails"],
+  _excluded3 = ["uploadedDocuments"];
+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); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+const columns = [{
+  title: 'File',
+  dataIndex: 'File',
+  key: 'docDetails',
+  // width: '155px',
+  width: '25%'
+}, {
+  title: 'Uploaded On',
+  dataIndex: 'dateUploaded',
+  key: 'dateUploaded',
+  render: text => /*#__PURE__*/_react.default.createElement(_Typography.default, {
+    typography: "type-b2-400"
+  }, text),
+  width: '25%'
+}
+// {
+//   title: 'Description',
+//   dataIndex: 'description',
+//   key: 'description',
+//   width: '25%',
+//   render: (text) => <Typography typography="type-b2-400">{text}</Typography>,
+// },
+// {
+//   title: 'Rejected By',
+//   dataIndex: 'rejectedBy',
+//   key: 'rejectedBy',
+//   width: '25%',
+//   render: (text) => <Typography typography="type-b2-400">{text}</Typography>,
+// },
+];
+
+/**
+ * @typedef {import('../../components/oa-component-drawer/CustomDrawer').CustomDrawerProps} CustomDrawerProps
+ * @typedef {import('../../components/oa-component-table/CustomTable').CustomTableProps} CustomTableProps
+ * @typedef {import('../../components/oa-component-upload-download/UploadDownloadWidget').UploadDownloadWidgetProps} UploadDownloadWidgetProps
+ *
+ * @typedef ViewHistoryWidgetProps
+ * @property {Object} currentDocument - The current document data.
+ * @property {UploadDownloadWidgetProps} currentDocument.docDetails - The docDetails property of currentDocument.
+ * @property {string} 'data-test' - The data-test attribute for the component.
+ * @property {Array<Object>} previousDocuments - The previous documents data.
+ * @property {UploadDownloadWidgetProps} previousDocuments.docDetails - The docDetails property of each element in previousDocuments.
+ * @property {string} name - The name of the document.
+ * @property {() => void} onClose - The callback to close the drawer.
+ * @property {boolean} open - Whether the drawer is open or not.
+ * @property {CustomDrawerProps & CustomTableProps} - All other props are passed to the CustomDrawer and CustomTable components.
+ *
+ * @summary A widget to view the history of a document.
+ */
+function ViewHistoryWidget(_ref) {
+  var _currentDocument$docD, _currentDocument$docD2;
+  let {
+      currentDocument,
+      'data-test': dataTest,
+      previousDocuments,
+      name,
+      onClose,
+      open
+    } = _ref,
+    props = _objectWithoutProperties(_ref, _excluded);
+  /*
+  Setting how to render the `File` column in the table,
+  based on whether a data-test attribute was passed to the `ViewHistoryWidget` or not
+  */
+  columns[0].render = (_, _ref2) => {
+    let {
+        key,
+        docDetails
+      } = _ref2,
+      otherColumnValues = _objectWithoutProperties(_ref2, _excluded2);
+    const {
+        uploadedDocuments
+      } = docDetails,
+      remainingProps = _objectWithoutProperties(docDetails, _excluded3);
+    return /*#__PURE__*/_react.default.createElement(_UploadDownloadWidget.default, _extends({
+      "data-test": dataTest ? "".concat(dataTest, "--upload-download-widget-").concat(key) : undefined,
+      uploadedDocuments: uploadedDocuments
+    }, remainingProps));
+  };
+  const copyOfPreviousDocuments = [...previousDocuments];
+
+  /**
+   * Sorts two documents in descending order of their `dateUploaded` field.
+   * @param {Object} document1 - The first document.
+   * @param {Object} document2 - The second document.
+   * @returns {number} The result of comparing the two dates.
+   */
+  const sortByDescendingDate = (document1, document2) => new Date(document2.dateUploaded) - new Date(document1.dateUploaded);
+  copyOfPreviousDocuments.sort(sortByDescendingDate);
+  return /*#__PURE__*/_react.default.createElement(_CustomDrawer.default, _extends({
+    "data-test": dataTest ? "".concat(dataTest, "--drawer") : undefined,
+    onClose: onClose,
+    open: open,
+    placement: "right",
+    title: "VIEW HISTORY",
+    width: "860"
+  }, props), /*#__PURE__*/_react.default.createElement(_Typography.default, {
+    color: "primary-content",
+    typography: "type-b1-400"
+  }, name ? "".concat(name, ": ") : null, "Current File"), /*#__PURE__*/_react.default.createElement(_styles.TableContainer, null, /*#__PURE__*/_react.default.createElement(_CustomTable.default, {
+    columns: columns,
+    dataSource: currentDocument !== null && currentDocument !== void 0 && (_currentDocument$docD = currentDocument.docDetails) !== null && _currentDocument$docD !== void 0 && (_currentDocument$docD = _currentDocument$docD.uploadedDocuments) !== null && _currentDocument$docD !== void 0 && (_currentDocument$docD = _currentDocument$docD[0]) !== null && _currentDocument$docD !== void 0 && _currentDocument$docD.name && currentDocument !== null && currentDocument !== void 0 && (_currentDocument$docD2 = currentDocument.docDetails) !== null && _currentDocument$docD2 !== void 0 && (_currentDocument$docD2 = _currentDocument$docD2.uploadedDocuments) !== null && _currentDocument$docD2 !== void 0 && (_currentDocument$docD2 = _currentDocument$docD2[0]) !== null && _currentDocument$docD2 !== void 0 && _currentDocument$docD2.onDownload ? [currentDocument] : [],
+    rowKey: "key",
+    size: "middle",
+    pagination: false
+  })), /*#__PURE__*/_react.default.createElement(_Typography.default, {
+    color: "primary-content",
+    typography: "type-b1-400"
+  }, "History"), /*#__PURE__*/_react.default.createElement(_styles.TableContainer, null, /*#__PURE__*/_react.default.createElement(_CustomTable.default, {
+    columns: columns,
+    dataSource: copyOfPreviousDocuments,
+    rowKey: "key",
+    size: "middle",
+    pagination: false
+  })));
+}
+ViewHistoryWidget.propTypes = {
+  currentDocument: _propTypes.default.shape({
+    docDetails: _propTypes.default.shape({
+      onUpload: _propTypes.default.func,
+      multiple: _propTypes.default.bool,
+      uploadedDocuments: _propTypes.default.arrayOf(_propTypes.default.shape({
+        name: _propTypes.default.string,
+        onDownload: _propTypes.default.func,
+        onDelete: _propTypes.default.func
+      }))
+    }),
+    dateUploaded: _propTypes.default.string.isRequired,
+    description: _propTypes.default.string,
+    rejectedBy: _propTypes.default.string
+  }),
+  'data-test': _propTypes.default.string,
+  previousDocuments: _propTypes.default.arrayOf(_propTypes.default.shape({
+    docDetails: _propTypes.default.shape({
+      onUpload: _propTypes.default.func,
+      multiple: _propTypes.default.bool,
+      uploadedDocuments: _propTypes.default.arrayOf(_propTypes.default.shape({
+        name: _propTypes.default.string,
+        onDownload: _propTypes.default.func,
+        onDelete: _propTypes.default.func
+      }))
+    }),
+    dateUploaded: _propTypes.default.string,
+    description: _propTypes.default.string,
+    rejectedBy: _propTypes.default.string
+  })),
+  name: _propTypes.default.string,
+  onClose: _propTypes.default.func,
+  open: _propTypes.default.bool
+};
+ViewHistoryWidget.defaultProps = {
+  currentDocument: null,
+  'data-test': null,
+  previousDocuments: [],
+  name: null,
+  onClose: () => {},
+  open: true
+};

package/build/widgets/oa-widget-view-history/styles.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.TableContainer = void 0;
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _templateObject;
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+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 TableContainer = exports.TableContainer = _styledComponents.default.section(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  padding: 16px 0 32px;\n"])));

package/build/widgets/oa-widget-view-previous-description/ViewPreviousDescriptionWidget.js

@@ -0,0 +1,188 @@
+"use strict";
+
+require("core-js/modules/es.object.assign.js");
+require("core-js/modules/es.weak-map.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = ViewPreviousDescriptionWidget;
+require("core-js/modules/web.dom-collections.iterator.js");
+require("core-js/modules/es.array.sort.js");
+require("core-js/modules/es.symbol.description.js");
+var _react = _interopRequireWildcard(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _utils = require("../../utils");
+var _CustomDrawer = _interopRequireDefault(require("../../components/oa-component-drawer/CustomDrawer"));
+var _Typography = _interopRequireDefault(require("../../components/oa-component-typography/Typography"));
+var _CustomToggle = _interopRequireDefault(require("../../components/oa-component-toggle/CustomToggle"));
+var _styles = require("./styles");
+const _excluded = ["currentDescription", "data-test", "previousDescriptions", "onClose", "onTranslate", "open", "translationDefaultValue"];
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+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); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+/**
+ * This component displays the current description and previous descriptions
+ * of an object. It also allows the user to toggle on/off the translation
+ * of the descriptions.
+ *
+ * @param {Object} currentDescription - The current description of the object.
+ * @param {string} currentDescription.description - The description of the object.
+ * @param {string} currentDescription.dateSubmitted - The date the description was submitted.
+ * @param {Object[]} previousDescriptions - The previous descriptions of the object.
+ * @param {string} previousDescriptions.description - The description of the object.
+ * @param {string} previousDescriptions.dateSubmitted - The date the description was submitted.
+ * @param {Function} onClose - The function to be called when the user closes the drawer.
+ * @param {Function} onTranslate - The function to be called when the user wants to translate the descriptions.
+ * @param {boolean} open - Whether the drawer is open or not.
+ * @param {boolean} translationDefaultValue - Whether the translation is on by default or not.
+ *
+ * @returns {ReactElement} A drawer containing the current and previous descriptions
+ * of the object, with the option to toggle on/off the translation.
+ */
+function ViewPreviousDescriptionWidget(_ref) {
+  var _translatedText$, _translatedText$2, _currentDescription$d;
+  let {
+      currentDescription,
+      'data-test': dataTest,
+      previousDescriptions,
+      onClose,
+      onTranslate,
+      open,
+      translationDefaultValue
+    } = _ref,
+    props = _objectWithoutProperties(_ref, _excluded);
+  const copyOfPreviousDescriptions = [...previousDescriptions];
+
+  /**
+   * Sorts two documents in descending order of their `dateUploaded` field.
+   * @param {Object} document1 - The first document.
+   * @param {Object} document2 - The second document.
+   * @returns {number} The result of comparing the two dates.
+   */
+  const sortByDescendingDate = (document1, document2) => new Date(document2.dateSubmitted) - new Date(document1.dateSubmitted);
+  copyOfPreviousDescriptions.sort(sortByDescendingDate);
+  const [isTranslationOn, setIsTranslationOn] = (0, _react.useState)(translationDefaultValue);
+  const [translatedText, setTranslatedText] = (0, _react.useState)([]);
+  // Initially setting the translated text as a 0 length array
+
+  // This is for when the translation toggle is clicked on.
+  (0, _react.useEffect)(() => {
+    if (isTranslationOn) {
+      // Passing an array of strings to this for translation,
+      // only if preferredLanguage is not 'english'
+
+      // API call for translation has NOT been made yet.
+      if (!(translatedText.length > 0)) {
+        var _onTranslate;
+        const payloadArr = copyOfPreviousDescriptions.map(prevDesc => prevDesc.description);
+        payloadArr.unshift(currentDescription.description);
+        (_onTranslate = onTranslate(payloadArr)) === null || _onTranslate === void 0 || _onTranslate.then(responseArr => setTranslatedText(responseArr),
+        // Setting the translated array as part of the state of the component.
+        () => setIsTranslationOn(false)
+        // Since the translation wasn't successful, set translation toggle back to off.
+        );
+      }
+    }
+  }, [isTranslationOn]);
+
+  // Set default value of translation
+  (0, _react.useEffect)(() => {
+    setIsTranslationOn(translationDefaultValue);
+  }, [translationDefaultValue]);
+
+  /*
+  This is for when any of the descriptions changes,
+  so fresh translations are made to represent the new descriptions.
+  */
+  (0, _react.useEffect)(() => {
+    if (onTranslate) {
+      var _onTranslate2;
+      // Passing an array of strings to this for translation,
+      // only if preferredLanguage is not 'english'
+
+      // API call for translation has NOT been made yet.
+      const payloadArr = copyOfPreviousDescriptions.map(prevDesc => prevDesc.description);
+      payloadArr.unshift(currentDescription.description);
+      (_onTranslate2 = onTranslate(payloadArr)) === null || _onTranslate2 === void 0 || (_onTranslate2 = _onTranslate2.then(responseArr => setTranslatedText(responseArr))
+      // Since the translation wasn't successful,
+      ) === null || _onTranslate2 === void 0 || _onTranslate2.catch(() => setIsTranslationOn(false));
+    }
+  }, [currentDescription === null || currentDescription === void 0 ? void 0 : currentDescription.description, ...previousDescriptions.map(prevDesc => prevDesc.description)]);
+  const onToggleChange = toggleValue => {
+    setIsTranslationOn(toggleValue);
+  };
+  return /*#__PURE__*/_react.default.createElement(_CustomDrawer.default, _extends({
+    "data-test": dataTest ? "".concat(dataTest, "--drawer") : undefined,
+    onClose: onClose,
+    open: open,
+    placement: "right",
+    title: "DESCRIPTION HISTORY",
+    width: "480"
+  }, props), onTranslate && /*#__PURE__*/_react.default.createElement(_styles.TranslateContainer, null, /*#__PURE__*/_react.default.createElement(_styles.ToggleContainer, null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
+    typography: "type-b2-400"
+  }, "Show translated text"), /*#__PURE__*/_react.default.createElement(_CustomToggle.default, {
+    "data-test": dataTest ? "".concat(dataTest, "--translate-toggle") : undefined,
+    checked: isTranslationOn,
+    onClick: onToggleChange,
+    size: "small"
+  })), isTranslationOn && /*#__PURE__*/_react.default.createElement("p", {
+    className: "type-b3-400"
+  }, "Note: These responses are auto-translated. Please read the answers carefully as there might be minor typo.")), /*#__PURE__*/_react.default.createElement(_styles.UnderlinedContainer, null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
+    color: "positive",
+    typography: "type-t1-500"
+  }, "Current Description"), /*#__PURE__*/_react.default.createElement(_styles.Descriptions, null, /*#__PURE__*/_react.default.createElement(_styles.Description, null, /*#__PURE__*/_react.default.createElement(_Typography.default
+  // This data-test attribute helps in checking if the translation took place
+  , {
+    "data-test": dataTest ? "".concat(dataTest, "--current-description") : undefined,
+    typography: "type-b2-400"
+  }, "".concat(isTranslationOn && ((_translatedText$ = translatedText[0]) === null || _translatedText$ === void 0 ? void 0 : _translatedText$.length) > 0 ? (_translatedText$2 = translatedText[0]) !== null && _translatedText$2 !== void 0 ? _translatedText$2 : 'No description submitted yet.' : (_currentDescription$d = currentDescription.description) !== null && _currentDescription$d !== void 0 ? _currentDescription$d : 'No description submitted yet.')), currentDescription.dateSubmitted && /*#__PURE__*/_react.default.createElement("p", {
+    className: "type-b2-400"
+  }, "Updated on:", ' ', "".concat(currentDescription.dateSubmitted)))), /*#__PURE__*/_react.default.createElement("hr", null)), /*#__PURE__*/_react.default.createElement(_styles.Container, null, /*#__PURE__*/_react.default.createElement("h3", {
+    className: "type-t1-500"
+  }, "Previous Descriptions"), /*#__PURE__*/_react.default.createElement(_styles.Descriptions, null, copyOfPreviousDescriptions.length > 0 ? copyOfPreviousDescriptions.filter(previousDescription => {
+    var _previousDescription$;
+    return (previousDescription === null || previousDescription === void 0 || (_previousDescription$ = previousDescription.description) === null || _previousDescription$ === void 0 ? void 0 : _previousDescription$.length) > 0;
+  }).map((previousDescription, index) => {
+    var _translatedText;
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, {
+      key: (0, _utils.getUUID)()
+    }, /*#__PURE__*/_react.default.createElement(_styles.Description, null, /*#__PURE__*/_react.default.createElement(_Typography.default
+    // This data-test attribute helps in checking if the translation took place
+    , {
+      "data-test": dataTest ? "".concat(dataTest, "--previous-description-").concat(index) : undefined,
+      typography: "type-b2-400"
+    }, "".concat(isTranslationOn && ((_translatedText = translatedText[index + 1]) === null || _translatedText === void 0 ? void 0 : _translatedText.length) > 0 ? translatedText[index + 1] : previousDescription.description)), previousDescription.dateSubmitted && /*#__PURE__*/_react.default.createElement(_Typography.default, {
+      color: "secondary-content",
+      typography: "type-b2-400"
+    }, "Updated on:", ' ', "".concat(previousDescription.dateSubmitted))));
+  }) : /*#__PURE__*/_react.default.createElement(_Typography.default, {
+    typography: "type-button-500"
+  }, "No more descriptions to display"))));
+}
+ViewPreviousDescriptionWidget.propTypes = {
+  currentDescription: _propTypes.default.shape({
+    dateSubmitted: _propTypes.default.string,
+    description: _propTypes.default.string
+  }),
+  'data-test': _propTypes.default.string,
+  previousDescriptions: _propTypes.default.arrayOf(_propTypes.default.shape({
+    dateSubmitted: _propTypes.default.string,
+    description: _propTypes.default.string
+  })),
+  onClose: _propTypes.default.func,
+  onTranslate: _propTypes.default.func,
+  open: _propTypes.default.bool,
+  translationDefaultValue: _propTypes.default.bool
+};
+ViewPreviousDescriptionWidget.defaultProps = {
+  currentDescription: {},
+  'data-test': null,
+  previousDescriptions: [],
+  onClose: () => {},
+  onTranslate: null,
+  open: true,
+  translationDefaultValue: false
+};

package/build/widgets/oa-widget-view-previous-description/styles.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.UnderlinedContainer = exports.TranslateContainer = exports.ToggleContainer = exports.Descriptions = exports.Description = exports.Container = void 0;
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+const Container = exports.Container = _styledComponents.default.section(_templateObject || (_templateObject = _taggedTemplateLiteral(["\nh3{\n    color: var(--color-primary-content);\n}\n"])));
+const UnderlinedContainer = exports.UnderlinedContainer = (0, _styledComponents.default)(Container)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    hr{\n        height: 1px;\n        background: var(--color-divider);\n        width: 100%;\n        margin: 16px 0 32px;\n        border: none;\n    }\n"])));
+const TranslateContainer = exports.TranslateContainer = (0, _styledComponents.default)(Container)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    \n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n    padding: 0 0 8px;\n    p{\n        color: var(--color-secondary-content);\n        padding: 0 0 32px;\n    }\n\n"])));
+const Descriptions = exports.Descriptions = _styledComponents.default.section(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    padding-top: 12px;\n    \n    display: flex;\n    flex-direction: column;\n    gap: 32px;\n"])));
+const Description = exports.Description = _styledComponents.default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n    p{\n        color: var(--color-secondary-content);\n    }\n"])));
+const ToggleContainer = exports.ToggleContainer = _styledComponents.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    display: flex;\n    gap: 8px;\n    align-items: center;\n"])));

package/package.json

@@ -0,0 +1,100 @@
+{
+  "name": "oa-componentbook",
+  "version": "0.0.0-sit1.1",
+  "private": false,
+  "description": "Reusable components",
+  "main": "build/index.js",
+  "module": "build/index.js",
+  "files": [
+    "build",
+    "README.md"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "@ant-design/icons": "^5.2.6",
+    "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
+    "@material-ui/system": "^4.12.2",
+    "@storybook/addon-actions": "^7.6.3",
+    "@storybook/addon-styling": "^1.3.7",
+    "@storybook/cli": "^7.6.3",
+    "antd": "^5.11.4",
+    "d3": "^7.8.5",
+    "dayjs": "^1.11.10",
+    "immer": "^10.1.1",
+    "pdfjs-dist": "^2.6.347",
+    "react-google-maps": "^9.4.5",
+    "react-intersection-observer": "^8.32.5",
+    "react-markdown": "^8.0.7",
+    "react-pattern-lock": "^12.0.12",
+    "react-pdf": "^5.3.0",
+    "react-zoom-pan-pinch": "^3.7.0"
+  },
+  "devDependencies": {
+    "@babel/cli": "^7.22.9",
+    "@babel/core": "^7.6.0",
+    "@babel/preset-env": "^7.6.0",
+    "@storybook/addon-essentials": "^7.6.3",
+    "@storybook/addon-interactions": "^7.6.3",
+    "@storybook/addon-links": "^7.6.3",
+    "@storybook/addon-mdx-gfm": "^7.6.3",
+    "@storybook/addon-onboarding": "^1.0.9",
+    "@storybook/blocks": "^7.6.3",
+    "@storybook/preset-create-react-app": "^7.6.3",
+    "@storybook/react": "^7.6.3",
+    "@storybook/react-webpack5": "^7.6.3",
+    "@storybook/testing-library": "^0.2.2",
+    "@webpack-cli/generators": "^3.0.7",
+    "babel-plugin-named-exports-order": "^0.0.2",
+    "eslint-config-airbnb": "^19.0.4",
+    "eslint-plugin-storybook": "^0.6.15",
+    "onchange": "^6.1.0",
+    "pre-commit": "^1.2.2",
+    "react-scripts": "^5.0.1",
+    "storybook": "^7.6.3",
+    "webpack": "^5.88.2",
+    "webpack-cli": "^5.1.4"
+  },
+  "peerDependencies": {
+    "@material-ui/core": "^4.12.4",
+    "@material-ui/icons": "^4.11.3",
+    "core-js": "^3.32.2",
+    "prop-types": "^15.8.1",
+    "react": "^16.9.0",
+    "react-dom": "^16.9.0",
+    "react-router-dom": "^5.3.4",
+    "styled-components": "^6.0.7"
+  },
+  "scripts": {
+    "start": "react-scripts start",
+    "build": "rm -rf build && NODE_ENV=production babel src/lib --out-dir build --copy-files",
+    "publish:local": "npm run build && yalc push --force",
+    "watch:publish": "onchange 'src/lib/**/*' -- npm run publish:local",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build",
+    "update-package-lock": "npm i --package-lock-only",
+    "lint": "eslint src/** --ext .js,.jsx",
+    "lint-fix": "npm run lint -- --fix",
+    "lint-fix-quiet": "npm run lint-fix -- --quiet",
+    "pre-commit": "./pre-commit.sh"
+  },
+  "pre-commit": {
+    "run": [
+      "pre-commit"
+    ],
+    "silent": true
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  }
+}