oa-componentbook 1.0.1-stage.44 → 1.0.1-stage.440

package/build/widgets/oa-widget-notes/NotesWidget.js

@@ -14,6 +14,7 @@ var _CustomTable = _interopRequireDefault(require("../../components/oa-component
 var _CustomInput = _interopRequireDefault(require("../../components/oa-component-input/CustomInput"));
 var _styles = require("./styles");
 const _excluded = ["data-test", "disabled", "records", "tableBorder", "onBlur", "extraColumnData"];
+/* eslint-disable */
 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; }
@@ -22,7 +23,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 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; }
 function NotesWidget(_ref) {
   let {
-      'data-test': dataTest,
+      "data-test": dataTest,
       disabled,
       records,
       tableBorder,
@@ -30,32 +31,32 @@ function NotesWidget(_ref) {
       extraColumnData
     } = _ref,
     antDesignTableProps = _objectWithoutProperties(_ref, _excluded);
-  const [noteInputValue, setNoteInputValue] = (0, _react.useState)('');
+  const [noteInputValue, setNoteInputValue] = (0, _react.useState)("");
 
   /**
-  * Call to callback from props.
-  * Clearing the notes input, on blur.
-  */
+   * Call to callback from props.
+   * Clearing the notes input, on blur.
+   */
   const handleBlur = event => {
     // Call to callback from props.
     onBlur(event);
 
     // Clearing the notes input, on blur.
-    setNoteInputValue('');
+    setNoteInputValue("");
   };
 
   // Used a local variable to avoid mutating the passed prop.
   const mutatedRecords = [...records];
   if (!disabled) {
     mutatedRecords === null || mutatedRecords === void 0 || mutatedRecords.unshift({
-      key: '0'
+      key: "0"
     });
   }
   const extraColumns = Array.isArray(extraColumnData) && extraColumnData.map(column => ({
     title: column.title,
     dataIndex: column.dataIndex,
     key: column.key,
-    width: '20%'
+    width: "20%"
   }));
   const columns = [
   // {
@@ -65,9 +66,9 @@ function NotesWidget(_ref) {
   //   width: '20%',
   // },
   {
-    title: 'NOTES',
-    width: '40%',
-    dataIndex: 'notes',
+    title: "NOTES",
+    width: "40%",
+    dataIndex: "notes",
     render: (text, obj, index) => {
       if (!disabled && index === 0) {
         return /*#__PURE__*/_react.default.createElement(_CustomInput.default, {
@@ -76,35 +77,36 @@ function NotesWidget(_ref) {
           value: noteInputValue,
           onChange: event => setNoteInputValue(event.target.value),
           onBlur: handleBlur,
-          placeholder: "Type here .."
+          placeholder: "Type here ..",
+          maxLength: 500
         });
       }
       return /*#__PURE__*/_react.default.createElement("div", {
         style: {
-          overflow: 'auto'
+          overflow: "auto"
         }
       }, text);
     },
-    key: 'notes'
+    key: "notes"
   }, {
-    title: 'DATE AND TIME',
-    dataIndex: 'dateTime',
-    key: 'dateTime'
+    title: "DATE AND TIME",
+    dataIndex: "dateTime",
+    key: "dateTime"
   }, {
-    title: 'USER',
-    dataIndex: 'user',
-    key: 'user',
-    width: '20%'
+    title: "USER",
+    dataIndex: "user",
+    key: "user",
+    width: "20%"
   }, ...(extraColumns || [])];
   const tableStyle = {
-    borderTop: '1px solid var(--color-divider)',
-    borderRight: tableBorder ? '1px solid var(--color-divider)' : '0',
-    borderBottom: tableBorder ? '1px solid var(--color-divider)' : '0',
-    borderLeft: tableBorder ? '1px solid var(--color-divider)' : '0',
-    borderRadius: tableBorder ? '4px' : '0'
+    borderTop: "1px solid var(--color-divider)",
+    borderRight: tableBorder ? "1px solid var(--color-divider)" : "0",
+    borderBottom: tableBorder ? "1px solid var(--color-divider)" : "0",
+    borderLeft: tableBorder ? "1px solid var(--color-divider)" : "0",
+    borderRadius: tableBorder ? "4px" : "0"
     // visibility: (!(records.length > 0) && disabled) ? 'hidden' : undefined,
   };
-  return /*#__PURE__*/_react.default.createElement(_CustomTable.default, _extends({
+  return /*#__PURE__*/_react.default.createElement(_styles.NotesTable, null, /*#__PURE__*/_react.default.createElement(_CustomTable.default, _extends({
     style: tableStyle,
     columns: columns,
     dataSource: mutatedRecords,
@@ -112,10 +114,10 @@ function NotesWidget(_ref) {
     size: "small",
     emptyText: "No Notes Available",
     tableBorder: tableBorder
-  }, antDesignTableProps));
+  }, antDesignTableProps)));
 }
 NotesWidget.propTypes = {
-  'data-test': _propTypes.default.string,
+  "data-test": _propTypes.default.string,
   disabled: _propTypes.default.bool,
   records: _propTypes.default.arrayOf(_propTypes.default.objectOf(_propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]))),
   onBlur: _propTypes.default.func,
@@ -123,7 +125,7 @@ NotesWidget.propTypes = {
   extraColumnData: _propTypes.default.array
 };
 NotesWidget.defaultProps = {
-  'data-test': null,
+  "data-test": null,
   disabled: false,
   onBlur: () => {},
   records: [],

package/build/widgets/oa-widget-notes/styles.js

@@ -3,10 +3,11 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.NoNotesMessage = void 0;
+exports.default = exports.NotesTable = exports.NoNotesMessage = void 0;
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-var _templateObject;
+var _templateObject, _templateObject2;
 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 NoNotesMessage = exports.NoNotesMessage = _styledComponents.default.section(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translateX(-50%) translateY(-50%);\n  input{\n    height: 30px;\n  }\n"])));
+const NoNotesMessage = exports.NoNotesMessage = _styledComponents.default.section(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translateX(-50%) translateY(-50%);\n  input {\n    height: 30px;\n  }\n"])));
+const NotesTable = exports.NotesTable = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  table {\n    width: auto !important;\n  }\n"])));

package/build/widgets/oa-widget-profile-data/ProfileDataWidget.js

@@ -0,0 +1,165 @@
+"use strict";
+
+require("core-js/modules/es.weak-map.js");
+require("core-js/modules/web.dom-collections.iterator.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = ProfileDataWidget;
+require("core-js/modules/es.string.trim.js");
+var _react = _interopRequireWildcard(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _Typography = _interopRequireDefault(require("../../components/oa-component-typography/Typography"));
+var _CustomDropdown = _interopRequireDefault(require("../../components/oa-component-dropdown/CustomDropdown"));
+var _styles = require("./styles");
+var _CustomSelect = _interopRequireDefault(require("../../components/oa-component-select/CustomSelect"));
+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; }
+/* eslint-disable */
+
+function ProfileDataWidget(_ref) {
+  var _widget$jsxConfig, _widget$jsxConfig2, _widget$jsxConfig3;
+  let {
+    image,
+    title,
+    line1,
+    line2,
+    line3,
+    line4,
+    line5,
+    subtext,
+    widget,
+    alignProfile,
+    handleSwitchSelectItem
+  } = _ref;
+  // Determine what to display in the icon
+  const getIconContent = () => {
+    if (!(image !== null && image !== void 0 && image.visible)) return null;
+    if (image.imageType === "source" && image.imageFile) {
+      return /*#__PURE__*/_react.default.createElement("img", {
+        src: image.imageFile,
+        alt: "Profile",
+        style: {
+          width: "100%",
+          height: "100%",
+          borderRadius: "50%",
+          objectFit: "cover"
+        }
+      });
+    }
+    if (image.imageType === "letterIcon") {
+      const letter = title !== null && title !== void 0 && title.label ? title.label.charAt(0).toUpperCase() : "";
+      return letter;
+    }
+    return null;
+  };
+  const resolveToken = token => "var(--color-".concat(String(token || "").trim(), ")");
+  return /*#__PURE__*/_react.default.createElement(_styles.ProfileDataContainer, {
+    alignProfile: alignProfile
+  }, (image === null || image === void 0 ? void 0 : image.visible) && /*#__PURE__*/_react.default.createElement(_styles.ProfileIcon, {
+    style: {
+      backgroundColor: resolveToken(image === null || image === void 0 ? void 0 : image.bgColor),
+      color: resolveToken(image === null || image === void 0 ? void 0 : image.color)
+    }
+  }, getIconContent()), /*#__PURE__*/_react.default.createElement(_styles.ProfileInfo, null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
+    color: (title === null || title === void 0 ? void 0 : title.color) || "primary-content",
+    typography: (title === null || title === void 0 ? void 0 : title.typography) || "type-h3-500",
+    className: "company-name"
+  }, (title === null || title === void 0 ? void 0 : title.label) || ""), /*#__PURE__*/_react.default.createElement("div", {
+    className: "company-details"
+  }, line1 && /*#__PURE__*/_react.default.createElement(_Typography.default, {
+    color: line1.color || "secondary-content",
+    typography: line1.typography || "type-b1-400"
+  }, line1.label || ""), line2 && /*#__PURE__*/_react.default.createElement(_Typography.default, {
+    color: line2.color || "secondary-content",
+    typography: line2.typography || "type-b1-400"
+  }, line2.label || ""), line3 && /*#__PURE__*/_react.default.createElement(_Typography.default, {
+    color: line3.color || "secondary-content",
+    typography: line3.typography || "type-b1-400"
+  }, line3.label || ""), line4 && /*#__PURE__*/_react.default.createElement(_Typography.default, {
+    color: line4.color || "secondary-content",
+    typography: line4.typography || "type-b1-400"
+  }, line4.label || ""), line5 && /*#__PURE__*/_react.default.createElement(_Typography.default, {
+    color: line5.color || "secondary-content",
+    typography: line5.typography || "type-b1-400"
+  }, line5.label || "")), subtext && /*#__PURE__*/_react.default.createElement(_Typography.default, {
+    color: subtext.color || "primary-content",
+    typography: subtext.typography || "type-b2-400",
+    style: {
+      marginTop: "16px"
+    }
+  }, subtext.label || ""), (widget === null || widget === void 0 ? void 0 : widget.visible) && /*#__PURE__*/_react.default.createElement("div", null, widget.widgetType === "select" && /*#__PURE__*/_react.default.createElement(_CustomSelect.default, {
+    options: widget === null || widget === void 0 || (_widget$jsxConfig = widget.jsxConfig) === null || _widget$jsxConfig === void 0 ? void 0 : _widget$jsxConfig.value,
+    defaultValue: widget === null || widget === void 0 || (_widget$jsxConfig2 = widget.jsxConfig) === null || _widget$jsxConfig2 === void 0 ? void 0 : _widget$jsxConfig2.defaultValue,
+    placeholder: widget === null || widget === void 0 || (_widget$jsxConfig3 = widget.jsxConfig) === null || _widget$jsxConfig3 === void 0 ? void 0 : _widget$jsxConfig3.placeholder,
+    onChange: e => handleSwitchSelectItem(e, widget)
+  }))));
+}
+ProfileDataWidget.propTypes = {
+  image: _propTypes.default.shape({
+    visible: _propTypes.default.bool,
+    imageType: _propTypes.default.oneOf(["source", "letterIcon"]),
+    imageFile: _propTypes.default.string,
+    color: _propTypes.default.string,
+    bgColor: _propTypes.default.string
+  }),
+  title: _propTypes.default.shape({
+    label: _propTypes.default.string,
+    typography: _propTypes.default.string,
+    color: _propTypes.default.string
+  }),
+  line1: _propTypes.default.shape({
+    label: _propTypes.default.string,
+    typography: _propTypes.default.string,
+    color: _propTypes.default.string
+  }),
+  line2: _propTypes.default.shape({
+    label: _propTypes.default.string,
+    typography: _propTypes.default.string,
+    color: _propTypes.default.string
+  }),
+  line3: _propTypes.default.shape({
+    label: _propTypes.default.string,
+    typography: _propTypes.default.string,
+    color: _propTypes.default.string
+  }),
+  line4: _propTypes.default.shape({
+    label: _propTypes.default.string,
+    typography: _propTypes.default.string,
+    color: _propTypes.default.string
+  }),
+  line5: _propTypes.default.shape({
+    label: _propTypes.default.string,
+    typography: _propTypes.default.string,
+    color: _propTypes.default.string
+  }),
+  subtext: _propTypes.default.shape({
+    label: _propTypes.default.string,
+    typography: _propTypes.default.string,
+    color: _propTypes.default.string
+  }),
+  widget: _propTypes.default.shape({
+    visible: _propTypes.default.bool,
+    widgetType: _propTypes.default.oneOf(["select", "button", "input"]),
+    jsxConfig: _propTypes.default.shape({
+      value: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.shape({
+        id: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
+        label: _propTypes.default.string
+      })), _propTypes.default.string // For dynamic data like '{{enterpriseDropdownData}}'
+      ]),
+      selectedValue: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
+      name: _propTypes.default.string,
+      placeholder: _propTypes.default.string,
+      onChange: _propTypes.default.func,
+      onClick: _propTypes.default.func,
+      style: _propTypes.default.object,
+      dropdownStyle: _propTypes.default.object,
+      dropdownProps: _propTypes.default.object,
+      backgroundColor: _propTypes.default.string,
+      color: _propTypes.default.string,
+      inputType: _propTypes.default.string
+    })
+  }),
+  alignProfile: _propTypes.default.string
+};

package/build/widgets/oa-widget-profile-data/styles.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ProfileInfo = exports.ProfileIcon = exports.ProfileDataContainer = void 0;
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _templateObject, _templateObject2, _templateObject3;
+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 ProfileDataContainer = exports.ProfileDataContainer = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: flex-start;\n  gap: 24px;\n  padding: ", ";\n  background: ", ";\n  border-radius: ", ";\n  margin: ", ";\n  box-shadow: ", ";\n  border: ", ";\n  max-width: ", ";\n  justify-content: ", ";\n\n  @media (max-width: 768px) {\n    flex-direction: column;\n    align-items: center;\n    text-align: center;\n    gap: 16px;\n    margin: ", ";\n    padding: 24px;\n  }\n"])), props => props.alignProfile === 'center' ? '32px' : '32px', props => props.alignProfile === 'center' ? 'transparent' : '#ffffff', props => props.alignProfile === 'center' ? '0' : '12px', props => props.alignProfile === 'center' ? '24px auto' : '24px', props => props.alignProfile === 'center' ? 'none' : '0 2px 8px rgba(0, 0, 0, 0.1)', props => props.alignProfile === 'center' ? 'none' : '1px solid #f0f0f0', props => props.alignProfile === 'center' ? '600px' : 'none', props => props.alignProfile === 'center' ? 'center' : 'flex-start', props => props.alignProfile === 'center' ? '16px auto' : '16px');
+const ProfileIcon = exports.ProfileIcon = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  width: 96px;\n  height: 96px;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 48px;\n  font-weight: 700;\n  flex-shrink: 0;\n  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n\n  @media (max-width: 768px) {\n    width: 80px;\n    height: 80px;\n    font-size: 36px;\n  }\n"])));
+const ProfileInfo = exports.ProfileInfo = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n\n  .company-name {\n    margin-bottom: 4px;\n    font-size: 24px;\n    font-weight: 500;\n    color: #333333;\n  }\n\n  .company-details {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n\n    .ant-typography {\n      font-size: 14px;\n      line-height: 1.5;\n      color: #666666;\n    }\n  }\n"])));