@zohodesk/library-platform 1.1.1 → 1.1.2-exp.1

package/es/library/dot/legacy-to-new-arch/table-field-components/coloured-multiselect-field/frameworks/ui/ColouredMultiSelectField.js

@@ -0,0 +1,12 @@
+import { createCustomComponent } from "../../../../../../custom-component";
+import ColouredMultiSelectProperties from "../../../../../../../cc/fields/coloured-multi-select/Properties";
+import ColouredMultiSelectEvents from "../../../../../../../cc/fields/coloured-multi-select/Events";
+import { ColouredMultiSelectFieldView } from "./ColouredMultiSelectFieldView";
+const ColouredMultiSelectField = createCustomComponent({
+  name: 'ColouredMultiSelectField',
+  View: ColouredMultiSelectFieldView,
+  properties: ColouredMultiSelectProperties,
+  events: ColouredMultiSelectEvents,
+  eventHandlers: {}
+});
+export default ColouredMultiSelectField;

package/es/library/dot/legacy-to-new-arch/table-field-components/coloured-multiselect-field/frameworks/ui/ColouredMultiSelectFieldView.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import { Tags } from "../../../..";
+export function ColouredMultiSelectFieldView(_ref, ref) {
+  let {
+    state
+  } = _ref;
+  const {
+    value,
+    options
+  } = state.properties;
+  const selectedOptions = value.map(item => {
+    const option = options.find(opt => opt.value === item);
+    return {
+      id: option.value,
+      label: option.value,
+      color: option.colorCode
+    };
+  });
+  return /*#__PURE__*/React.createElement(Tags, {
+    getRef: ref,
+    tags: selectedOptions
+  });
+}

package/es/library/dot/legacy-to-new-arch/table-field-components/coloured-picklist-field/frameworks/ui/ColouredPickListField.js

@@ -0,0 +1,14 @@
+import { createCustomComponent } from "../../../../../../custom-component";
+import ColouredPickListProperties from "../../../../../../../cc/fields/coloured-pick-list/Properties";
+import ColouredPickListEvents from "../../../../../../../cc/fields/coloured-pick-list/Events";
+import TextToFieldClickBehaviourFactory from "../../../../../../behaviours/text-to-field-click/frameworks/ui/TextToFieldClickBehaviourFactory";
+import { ColouredPickListFieldView } from "./ColouredPickListFieldView";
+const ColouredPickListField = createCustomComponent({
+  name: 'ColouredPickListField',
+  View: ColouredPickListFieldView,
+  properties: ColouredPickListProperties,
+  behaviours: [TextToFieldClickBehaviourFactory.create()],
+  events: ColouredPickListEvents,
+  eventHandlers: {}
+});
+export default ColouredPickListField;

package/es/library/dot/legacy-to-new-arch/table-field-components/coloured-picklist-field/frameworks/ui/ColouredPickListFieldView.js

@@ -0,0 +1,33 @@
+import React from 'react';
+import ColoredTag from '@zohodesk-private/desk-components/es/ColoredTag/ColoredTag';
+import { TagsConstants } from "../../../../../../../cc/tags";
+export function ColouredPickListFieldView(_ref, ref) {
+  let {
+    state,
+    helpers
+  } = _ref;
+  let {
+    dispatch
+  } = helpers;
+  const {
+    value,
+    options
+  } = state.properties;
+  const selectedOption = options.find(option => option.value === value);
+  return /*#__PURE__*/React.createElement(ColoredTag, {
+    $data_id: value,
+    $data_text: value,
+    $data_color: selectedOption.colorCode || '',
+    $event_onClick: id => {
+      dispatch({
+        type: TagsConstants.TAG_CLICKED,
+        payload: {
+          id
+        }
+      });
+    },
+    $customProps_tag: {
+      getRef: ref
+    }
+  });
+}

package/es/library/dot/legacy-to-new-arch/table-field-components/index.js

@@ -8,6 +8,8 @@ import PhoneField from "./phone-field/frameworks/ui/PhoneField";
 import CurrencyField from "./currency-field/frameworks/ui/CurrencyField";
 import LookUpField from "./lookup-field/frameworks/ui/LookupField";
 import PickListField from "./picklist-field/frameworks/ui/PickListField";
+import ColouredPickListField from "./coloured-picklist-field/frameworks/ui/ColouredPickListField";
+import ColouredMultiSelectField from "./coloured-multiselect-field/frameworks/ui/ColouredMultiSelectField";
 import PercentageField from "./percentage-field/frameworks/ui/PercentageField";
 import DateField from "./date-field/frameworks/ui/DateField";
 import DateTimeField from "./datetime-field/frameworks/ui/DateTimeField";
@@ -24,6 +26,8 @@ const FieldComponents = {
   [FieldTypes.CurrencyField]: CurrencyField,
   [FieldTypes.LookUpField]: LookUpField,
   [FieldTypes.PickListField]: PickListField,
+  [FieldTypes.ColouredPickListField]: ColouredPickListField,
+  [FieldTypes.ColouredMultiSelectField]: ColouredMultiSelectField,
   [FieldTypes.PercentageField]: PercentageField,
   [FieldTypes.DateField]: DateField,
   [FieldTypes.DateTimeField]: DateTimeField,

package/es/library/dot/legacy-to-new-arch/table-field-components/lookup-field/frameworks/ui/LookupFieldView.js

@@ -1,19 +1,17 @@
 import React from 'react';
-import Tag from '@zohodesk/components/es/Tag/Tag';
+import Link from "../../../../link/frameworks/ui/Link";
 export function LookupFieldView(_ref, ref) {
   let {
     state
   } = _ref;
   const {
     name,
-    photoURL
+    url
   } = state.properties.value;
-  return /*#__PURE__*/React.createElement(Tag, {
+  return /*#__PURE__*/React.createElement(Link, {
     getRef: ref,
-    text: name,
-    hasAvatar: true,
-    initial: name,
-    imageURL: photoURL,
-    tooltip: name
+    label: name,
+    variant: "secondary",
+    href: url
   });
 }

package/es/library/dot/legacy-to-new-arch/text-area/frameworks/ui/TextArea.js

@@ -0,0 +1,11 @@
+import { createCustomComponent } from "../../../../../custom-component";
+import { TextAreaProperties, TextAreaEvents } from "../../../../../../cc";
+import TextAreaView from "./TextAreaView";
+let TextArea = createCustomComponent({
+  name: "TextArea",
+  View: TextAreaView,
+  properties: TextAreaProperties,
+  events: TextAreaEvents,
+  eventHandlers: {}
+});
+export default TextArea;

package/es/library/dot/legacy-to-new-arch/text-area/frameworks/ui/TextAreaView.js

@@ -0,0 +1,52 @@
+import React from "react";
+import Textarea from '@zohodesk/components/es/Textarea/Textarea';
+import TextAreaConstants from "../../../../../../cc/textarea/Constants";
+
+function TextAreaView(_ref, ref) {
+  let {
+    state,
+    helpers
+  } = _ref;
+  let {
+    dispatch
+  } = helpers;
+  let {
+    id,
+    maxLength,
+    placeholder,
+    value,
+    required,
+    disabled,
+    readonly
+  } = state.properties;
+  return /*#__PURE__*/React.createElement(Textarea, {
+    getRef: ref,
+    htmlId: id,
+    maxLength: maxLength,
+    placeHolder: placeholder,
+    text: value,
+    isReadOnly: readonly,
+    isDisabled: disabled,
+    animated: true,
+    size: "xsmall",
+    customAttributes: {
+      required
+    },
+    onFocus: () => dispatch({
+      type: TextAreaConstants.TEXTAREA_FOCUSED
+    }),
+    onBlur: () => dispatch({
+      type: TextAreaConstants.TEXTAREA_BLURED
+    }),
+    onChange: value => {
+      dispatch({
+        type: TextAreaConstants.TEXTAREA_CHANGED,
+        payload: {
+          value
+        }
+      });
+    }
+  });
+}
+
+export default TextAreaView;

package/es/library/dot/legacy-to-new-arch/textbox/frameworks/ui/TextBox.js

@@ -0,0 +1,12 @@
+import { createCustomComponent } from "../../../../../custom-component";
+import TextBoxProperties from "../../../../../../cc/textbox/Properties";
+import TextBoxEvents from "../../../../../../cc/textbox/Events";
+import TextBoxView from "./TextBoxView";
+let TextBox = createCustomComponent({
+  name: "TextBox",
+  View: TextBoxView,
+  properties: TextBoxProperties,
+  events: TextBoxEvents,
+  eventHandlers: {}
+});
+export default TextBox;

package/es/library/dot/legacy-to-new-arch/textbox/frameworks/ui/TextBoxView.js

@@ -0,0 +1,55 @@
+import React from "react";
+import TextBox from "@zohodesk/components/es/TextBoxIcon/TextBoxIcon";
+import TextBoxConstants from "../../../../../../cc/textbox/Constants";
+
+function TextBoxView(_ref, ref) {
+  let {
+    state,
+    helpers
+  } = _ref;
+  const {
+    dispatch
+  } = helpers;
+  const {
+    id,
+    name,
+    type,
+    maxLength,
+    placeholder,
+    value,
+    required,
+    disabled,
+    readonly
+  } = state.properties;
+  return /*#__PURE__*/React.createElement(TextBox, {
+    inputRef: ref,
+    htmlId: id,
+    name: name,
+    type: type,
+    maxLength: maxLength,
+    placeHolder: placeholder,
+    value: value,
+    isReadOnly: readonly,
+    isDisabled: disabled,
+    size: "xmedium",
+    onFocus: () => dispatch({
+      type: TextBoxConstants.TEXTBOX_FOCUSED
+    }),
+    onBlur: () => dispatch({
+      type: TextBoxConstants.TEXTBOX_BLURED
+    }),
+    customProps: {
+      TextBoxProps: {
+        required
+      }
+    },
+    onChange: value => dispatch({
+      type: TextBoxConstants.TEXTBOX_CHANGED,
+      payload: {
+        value
+      }
+    })
+  });
+}
+
+export default TextBoxView;

package/es/library/index.js

@@ -1,3 +1,8 @@
 export { default as ComponentRegistry } from "./custom-component/frameworks/ui/ComponentRegistry";
 export { default as createCustomComponent } from "./custom-component/frameworks/ui/CreateCustomComponent";
-export { default as TableList } from "./dot/components/table-list/frameworks/ui/TableList";
+export { default as TableList } from "./dot/components/table-list/frameworks/ui/TableList";
+export { default as Form } from "./dot/components/form/frameworks/ui/Form";
+export { default as Section } from "./dot/components/section/frameworks/ui/Section";
+import * as _FormLibraryFields from "./dot/components/form-fields";
+export { _FormLibraryFields as FormLibraryFields };
+export { ConvertSlotToComponent } from "./slot";

package/es/library/slot/frameworks/ui/ConvertSlotToComponent.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import ComponentRegistry from "../../../custom-component/frameworks/ui/ComponentRegistry";
+export default function ConvertSlotToComponent(slot) {
+  if (Array.isArray(slot) === false) {
+    return null;
+  }
+
+  return slot.map((component, index) => {
+    if (component == null) {
+      return null;
+    }
+
+    const {
+      type,
+      properties
+    } = component;
+    const Child = ComponentRegistry.get(type);
+    return /*#__PURE__*/React.createElement(Child, {
+      key: index,
+      ...properties
+    });
+  });
+}

package/es/library/slot/index.js

@@ -0,0 +1 @@
+export { default as ConvertSlotToComponent } from "./frameworks/ui/ConvertSlotToComponent";

package/es/library/translator-common/adapters/presenter/TransFormState.js

@@ -0,0 +1,6 @@
+/* eslint-disable @zohodesk/architecturerules/return-void */
+export default function TransFormState(state) {
+  return { ...state,
+    viewModel: state.properties
+  };
+}

package/es/library/translator-common/index.js

@@ -0,0 +1 @@
+export { default as TransFormState } from "./adapters/presenter/TransFormState";

package/es/platform/client-actions/components/row-actions-renderer/frameworks/ui/RowActionsRenderer.module.css

@@ -1,9 +1,3 @@
-[dir=ltr] .actions {
-    padding-left: var(--zd_size4) 
-}[dir=rtl] .actions {
-    padding-right: var(--zd_size4) 
-}
-
 .gap_small {
     gap: var(--zd_size4) 
 }

package/es/platform/client-actions/components/row-actions-renderer/frameworks/ui/RowActionsRendererView.js

@@ -17,7 +17,7 @@ function RowActionsRendererView(_ref, ref) {
     ref: ref,
     $ui_displayMode: "inline",
     $ui_alignItems: "center",
-    $ui_className: `${style.actions} ${gap !== ActionViewGap.NONE ? style[`gap_${gap}`] : ''}`
+    $ui_className: `${gap !== ActionViewGap.NONE ? style[`gap_${gap}`] : ''}`
   }, actions.map((action, index) => {
     return /*#__PURE__*/React.createElement(DynamicActionComponent, {
       action: action,

package/es/platform/column-chooser/adapters/controllers/AbstractController.js

@@ -0,0 +1,10 @@
+class AbstractController {
+  constructor(service) {
+    this.service = service;
+    this.handle = this.handle.bind(this);
+  } // TODO: Add event type
+
+
+}
+
+export default AbstractController;

package/es/platform/column-chooser/adapters/controllers/ColumnChooserCloseController.js

@@ -0,0 +1,21 @@
+import AbstractController from "./AbstractController";
+
+class ColumnChooserCloseController extends AbstractController {
+  handle(event) {
+    const {
+      state,
+      updateState,
+      dispatch
+    } = event;
+    const {
+      columnChooserCloseUseCase
+    } = this.service;
+    columnChooserCloseUseCase.updateDependencies(state, updateState);
+    columnChooserCloseUseCase.execute({
+      dispatch
+    });
+  }
+
+}
+
+export default ColumnChooserCloseController;

package/es/platform/column-chooser/adapters/controllers/ColumnChooserOpenController.js

@@ -0,0 +1,26 @@
+import AbstractController from "./AbstractController";
+
+class ColumnChooserOpenController extends AbstractController {
+  handle(event) {
+    const {
+      state,
+      action,
+      updateState
+    } = event;
+    const {
+      order,
+      selectedArray
+    } = action.payload;
+    const {
+      columnChooserOpenUseCase
+    } = this.service;
+    columnChooserOpenUseCase.updateDependencies(state, updateState);
+    columnChooserOpenUseCase.execute({
+      order,
+      selectedArray
+    });
+  }
+
+}
+
+export default ColumnChooserOpenController;

package/es/platform/column-chooser/adapters/controllers/ColumnChooserReorderController.js

@@ -0,0 +1,26 @@
+import AbstractController from "./AbstractController";
+
+class ColumnChooserReorderController extends AbstractController {
+  handle(event) {
+    const {
+      state,
+      action,
+      updateState
+    } = event;
+    const {
+      oldIndex: fromIndex,
+      newIndex: toIndex
+    } = action.payload.reOrderedIndex;
+    const {
+      columnChooserReorderUseCase
+    } = this.service;
+    columnChooserReorderUseCase.updateDependencies(state, updateState);
+    columnChooserReorderUseCase.execute({
+      fromIndex,
+      toIndex
+    });
+  }
+
+}
+
+export default ColumnChooserReorderController;

package/es/platform/column-chooser/adapters/controllers/ColumnChooserSaveController.js

@@ -0,0 +1,21 @@
+import AbstractController from "./AbstractController";
+
+class ColumnChooserSaveController extends AbstractController {
+  handle(event) {
+    const {
+      state,
+      updateState,
+      dispatch
+    } = event;
+    const {
+      columnChooserSaveUseCase
+    } = this.service;
+    columnChooserSaveUseCase.updateDependencies(state, updateState);
+    columnChooserSaveUseCase.execute({
+      dispatch
+    });
+  }
+
+}
+
+export default ColumnChooserSaveController;

package/es/platform/column-chooser/adapters/controllers/ColumnChooserSearchController.js

@@ -0,0 +1,24 @@
+import AbstractController from "./AbstractController";
+
+class ColumnChooserSearchController extends AbstractController {
+  handle(event) {
+    const {
+      state,
+      action,
+      updateState
+    } = event;
+    const {
+      searchString: searchText
+    } = action.payload;
+    const {
+      columnChooserSearchUseCase
+    } = this.service;
+    columnChooserSearchUseCase.updateDependencies(state, updateState);
+    columnChooserSearchUseCase.execute({
+      searchText
+    });
+  }
+
+}
+
+export default ColumnChooserSearchController;

package/es/platform/column-chooser/adapters/controllers/ColumnChooserSelectController.js

@@ -0,0 +1,26 @@
+import AbstractController from "./AbstractController";
+
+class ColumnChooserSelectController extends AbstractController {
+  handle(event) {
+    const {
+      state,
+      action,
+      updateState
+    } = event;
+    const {
+      id: columnId,
+      isChecked
+    } = action.payload.data;
+    const {
+      columnChooserSelectUseCase
+    } = this.service;
+    columnChooserSelectUseCase.updateDependencies(state, updateState);
+    columnChooserSelectUseCase.execute({
+      columnId,
+      isChecked
+    });
+  }
+
+}
+
+export default ColumnChooserSelectController;

package/es/platform/column-chooser/adapters/gateways/Repository.js

@@ -0,0 +1,38 @@
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+import { DEFAULT_COLUMN_CHOOSE_MAX_COUNT } from "../../../../bc/column-chooser/Constants";
+import ColumnChooserImp from "../../domain/entities/ColumnChooserImp";
+import ReorderEntityImp from "../../domain/entities/ReorderEntityImp";
+import SearchEntityImp from "../../domain/entities/SearchEntityImp";
+import SelectEntityImp from "../../domain/entities/SelectEntityImp";
+
+class Repository {
+  constructor() {
+    _defineProperty(this, "state", void 0);
+  }
+
+  init(state) {
+    this.state = state;
+  }
+
+  getColumnChooser() {
+    const {
+      columnChooser
+    } = this.state.behaviours;
+    const reorderEntity = new ReorderEntityImp(columnChooser.order);
+    const searchEntity = this.createSearchEntity();
+    const selectEntity = new SelectEntityImp(columnChooser.selected, DEFAULT_COLUMN_CHOOSE_MAX_COUNT);
+    return new ColumnChooserImp(columnChooser.isSaved, reorderEntity, searchEntity, selectEntity);
+  }
+
+  createSearchEntity() {
+    const {
+      columnChooser,
+      zfield
+    } = this.state.behaviours;
+    return new SearchEntityImp(columnChooser.searchText, fieldName => zfield.fields.find(f => f.name === fieldName).i18NLabel);
+  }
+
+}
+
+export default Repository;

package/es/platform/column-chooser/adapters/gateways/Service.js

@@ -0,0 +1,34 @@
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+import ColumnChooserOpenUseCase from "../../applications/usecases/ColumnChooserOpenUseCase";
+import ColumnChooserSelectUseCase from "../../applications/usecases/ColumnChooserSelectUseCase";
+import ColumnChooserReorderUseCase from "../../applications/usecases/ColumnChooserReorderUseCase";
+import ColumnChooserSearchUseCase from "../../applications/usecases/ColumnChooserSearchUseCase";
+import ColumnChooserSaveUseCase from "../../applications/usecases/ColumnChooserSaveUseCase";
+import ColumnChooserCloseUseCase from "../../applications/usecases/ColumnChooserCloseUseCase";
+
+class Service {
+  constructor(dependencies) {
+    _defineProperty(this, "columnChooserOpenUseCase", void 0);
+
+    _defineProperty(this, "columnChooserSelectUseCase", void 0);
+
+    _defineProperty(this, "columnChooserReorderUseCase", void 0);
+
+    _defineProperty(this, "columnChooserSearchUseCase", void 0);
+
+    _defineProperty(this, "columnChooserSaveUseCase", void 0);
+
+    _defineProperty(this, "columnChooserCloseUseCase", void 0);
+
+    this.columnChooserOpenUseCase = new ColumnChooserOpenUseCase(dependencies);
+    this.columnChooserSelectUseCase = new ColumnChooserSelectUseCase(dependencies);
+    this.columnChooserReorderUseCase = new ColumnChooserReorderUseCase(dependencies);
+    this.columnChooserSearchUseCase = new ColumnChooserSearchUseCase(dependencies);
+    this.columnChooserSaveUseCase = new ColumnChooserSaveUseCase(dependencies);
+    this.columnChooserCloseUseCase = new ColumnChooserCloseUseCase(dependencies);
+  }
+
+}
+
+export default Service;

package/es/platform/column-chooser/adapters/gateways/State.js

@@ -0,0 +1 @@
+export {};

package/es/platform/column-chooser/adapters/presenters/Presenter.js

@@ -0,0 +1,25 @@
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+class Presenter {
+  constructor() {
+    _defineProperty(this, "updateState", void 0);
+
+    _defineProperty(this, "state", void 0);
+  }
+
+  updateDependencies(state, updateState) {
+    this.state = state;
+    this.updateState = updateState;
+  }
+
+  updateView(view) {
+    this.updateState({ ...this.state,
+      behaviours: { ...this.state.behaviours,
+        columnChooser: view
+      }
+    });
+  }
+
+}
+
+export default Presenter;

package/es/platform/column-chooser/applications/interfaces/UsecaseDependencies.js

@@ -0,0 +1 @@
+export {};

package/es/platform/column-chooser/applications/interfaces/gateways/IRepository.js

@@ -0,0 +1 @@
+export {};

package/es/platform/column-chooser/applications/interfaces/gateways/IService.js

@@ -0,0 +1 @@
+export {};

package/es/platform/column-chooser/applications/interfaces/input/ColumnChooserCloseInput.js

@@ -0,0 +1 @@
+export {};

package/es/platform/column-chooser/applications/interfaces/input/ColumnChooserOpenInput.js

@@ -0,0 +1 @@
+export {};

package/es/platform/column-chooser/applications/interfaces/input/ColumnChooserReorderInput.js

@@ -0,0 +1 @@
+export {};

package/es/platform/column-chooser/applications/interfaces/input/ColumnChooserSaveInput.js

@@ -0,0 +1 @@
+export {};

package/es/platform/column-chooser/applications/interfaces/input/ColumnChooserSearchInput.js

@@ -0,0 +1 @@
+export {};

package/es/platform/column-chooser/applications/interfaces/input/ColumnChooserSelectInput.js

@@ -0,0 +1 @@
+export {};

package/es/platform/column-chooser/applications/interfaces/output/BehaviourState.js

@@ -0,0 +1 @@
+export {};

package/es/platform/column-chooser/applications/interfaces/output/IPresenter.js

@@ -0,0 +1 @@
+export {};

package/es/platform/column-chooser/applications/usecases/AbstractUseCase.js

@@ -0,0 +1,18 @@
+class AbstractUseCase {
+  constructor(dependencies) {
+    this.dependencies = dependencies;
+  }
+
+  // TODO: Add type for state and updateState
+  updateDependencies(state, updateState) {
+    const {
+      repository,
+      presenter
+    } = this.dependencies;
+    repository.init(state);
+    presenter.updateDependencies(state, updateState);
+  }
+
+}
+
+export default AbstractUseCase;