@zohodesk/library-platform 1.1.12 → 1.2.0

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

@@ -8,10 +8,10 @@ export class EventHandlersFactory {
         dispatch
       } = input;
       const {
-        name: fieldName,
-        value: currentValue
+        fieldName,
+        checked
       } = state.properties;
-      const toggledValue = !currentValue;
+      const toggledValue = !checked;
       dispatch({
         type: FieldConstants.FIELD_CHANGED,
         payload: {

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

@@ -1,13 +1,23 @@
 import { createCustomComponent } from "../../../../../../custom-component";
-import BooleanProperties from "../../../../../../../cc/fields/boolean/Properties";
-import BooleanEvents from "../../../../../../../cc/fields/boolean/Events";
+import SwitchProperties from "../../../../../../../cc/switch/Properties";
+import BooleanFieldEvents from "../../../../../../../cc/fields/boolean/Events";
 import SwitchFieldView from "./SwitchFieldView";
 import { EventHandlersFactory } from "./EventHandlersFactory";
 const SwitchField = createCustomComponent({
   name: 'SwitchField',
   View: SwitchFieldView,
-  properties: BooleanProperties,
-  events: BooleanEvents,
+  properties: { ...SwitchProperties,
+    fieldName: {
+      required: false,
+      defaultValue: '',
+      typeMetadata: {
+        schema: {
+          type: 'string'
+        }
+      }
+    }
+  },
+  events: BooleanFieldEvents,
   eventHandlers: EventHandlersFactory.create()
 });
 export default SwitchField;

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

@@ -5,12 +5,16 @@ export default function SwitchFieldView(_ref, ref) {
     state
   } = _ref;
   const {
-    value
+    checked,
+    disabled,
+    size,
+    tooltip
   } = state.properties;
   return /*#__PURE__*/React.createElement(Switch, {
     getRef: ref,
-    checked: value,
-    disabled: false,
-    tooltip: ""
+    checked: checked,
+    disabled: disabled,
+    size: size,
+    tooltip: tooltip
   });
 }

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

@@ -0,0 +1,26 @@
+import TagConstants from "../../../../../../../cc/tag/Constants";
+import FieldConstants from "../../../../../../../cc/fields/field/Constants";
+export class EventHandlersFactory {
+  static create() {
+    const clickHandler = input => {
+      const {
+        state,
+        dispatch
+      } = input;
+      const {
+        fieldName
+      } = state.properties;
+      dispatch({
+        type: FieldConstants.FIELD_CLICKED,
+        payload: {
+          fieldName
+        }
+      });
+    };
+
+    return {
+      [TagConstants.TAG_CLICKED]: clickHandler
+    };
+  }
+
+}

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

@@ -0,0 +1,23 @@
+import { createCustomComponent } from "../../../../../../custom-component";
+import TagProperties from "../../../../../../../cc/tag/Properties";
+import FieldEvents from "../../../../../../../cc/fields/field/Events";
+import TagFieldView from "./TagFieldView";
+import { EventHandlersFactory } from "./EventHandlersFactory";
+const TagField = createCustomComponent({
+  name: 'TagField',
+  View: TagFieldView,
+  properties: { ...TagProperties,
+    fieldName: {
+      required: false,
+      defaultValue: '',
+      typeMetadata: {
+        schema: {
+          type: 'string'
+        }
+      }
+    }
+  },
+  events: FieldEvents,
+  eventHandlers: EventHandlersFactory.create()
+});
+export default TagField;

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

@@ -0,0 +1,34 @@
+import React from 'react';
+import Tag from "../../../../tag/frameworks/ui/Tag";
+export default function TagFieldView(_ref, ref) {
+  let {
+    state
+  } = _ref;
+  const {
+    id,
+    label,
+    color,
+    isDisabled,
+    iconName,
+    imageAltText,
+    imageSrc,
+    isRemovable,
+    cursor,
+    size,
+    tooltip
+  } = state.properties;
+  return /*#__PURE__*/React.createElement(Tag, {
+    getRef: ref,
+    id: id,
+    label: label,
+    color: color,
+    isDisabled: isDisabled,
+    iconName: iconName,
+    imageAltText: imageAltText,
+    imageSrc: imageSrc,
+    isRemovable: isRemovable,
+    cursor: cursor,
+    size: size,
+    tooltip: tooltip
+  });
+}

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

@@ -0,0 +1,26 @@
+import TagsConstants from "../../../../../../../cc/tags/Constants";
+import FieldConstants from "../../../../../../../cc/fields/field/Constants";
+export class EventHandlersFactory {
+  static create() {
+    const clickHandler = input => {
+      const {
+        state,
+        dispatch
+      } = input;
+      const {
+        fieldName
+      } = state.properties;
+      dispatch({
+        type: FieldConstants.FIELD_CLICKED,
+        payload: {
+          fieldName
+        }
+      });
+    };
+
+    return {
+      [TagsConstants.TAG_CLICKED]: clickHandler
+    };
+  }
+
+}

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

@@ -0,0 +1,23 @@
+import { createCustomComponent } from "../../../../../../custom-component";
+import TagsProperties from "../../../../../../../cc/tags/Properties";
+import FieldEvents from "../../../../../../../cc/fields/field/Events";
+import TagsFieldView from "./TagsFieldView";
+import { EventHandlersFactory } from "./EventHandlersFactory";
+const TagsField = createCustomComponent({
+  name: 'TagsField',
+  View: TagsFieldView,
+  properties: { ...TagsProperties,
+    fieldName: {
+      required: false,
+      defaultValue: '',
+      typeMetadata: {
+        schema: {
+          type: 'string'
+        }
+      }
+    }
+  },
+  events: FieldEvents,
+  eventHandlers: EventHandlersFactory.create()
+});
+export default TagsField;

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

@@ -0,0 +1,18 @@
+import React from 'react';
+import Tags from "../../../../tags/frameworks/ui/Tags";
+export default function TagsFieldView(_ref, ref) {
+  let {
+    state
+  } = _ref;
+  const {
+    title,
+    tags,
+    isWrapped
+  } = state.properties;
+  return /*#__PURE__*/React.createElement(Tags, {
+    getRef: ref,
+    title: title,
+    tags: tags,
+    isWrapped: isWrapped
+  });
+}

package/es/library/dot/legacy-to-new-arch/table-field-components/tags-list-dropdown-field/frameworks/ui/TagsListDropdownField.js

@@ -0,0 +1,44 @@
+import { createCustomComponent } from "../../../../../../custom-component";
+import TagsListDropdownProperties from "../../../../../../../cc/tags-list-dropdown/Properties";
+import FieldEvents from "../../../../../../../cc/fields/field/Events";
+import TagsListDropdownFieldView from "./TagsListDropdownFieldView";
+import SearchBehaviourFactory from "../../../../../../behaviours/search/frameworks/ui/SearchStringStoreBehaviourFactory";
+import Constants from "../../../../../../../cc/tags-list-dropdown/Constants";
+import { SEARCH_REQUESTED } from "../../../../../../../bc/search/Constants";
+import SearchTranslator from "../../../../../../behaviours/search/adapters/presenter/SearchTranslator";
+const TagsListDropdownField = createCustomComponent({
+  name: 'TagsListDropdownField',
+  View: TagsListDropdownFieldView,
+  transformState,
+  behaviours: [SearchBehaviourFactory.create()],
+  properties: TagsListDropdownProperties,
+  events: FieldEvents,
+  eventHandlers: {
+    [Constants.TAG_LIST_DROPDOWN_SEARCHED]: _ref => {
+      let {
+        dispatch,
+        action
+      } = _ref;
+      dispatch({
+        type: SEARCH_REQUESTED,
+        payload: {
+          searchString: action.payload.value
+        }
+      });
+    }
+  }
+});
+
+function transformState(state) {
+  const {
+    searchString
+  } = state.behaviours.search;
+  return { ...state,
+    viewModel: { ...state.properties,
+      ...state.viewModel,
+      tags: SearchTranslator(searchString, 'label', state.properties.tags)
+    }
+  };
+}
+
+export default TagsListDropdownField;

package/es/library/dot/legacy-to-new-arch/table-field-components/tags-list-dropdown-field/frameworks/ui/TagsListDropdownFieldView.js

@@ -0,0 +1,24 @@
+import React from 'react';
+import TagsListDropdown from "../../../../tags-list-dropdown/frameworks/ui/TagsListDropdown";
+export default function TagsListDropdownFieldView(_ref, ref) {
+  let {
+    state
+  } = _ref;
+  const {
+    tags,
+    hasSearch,
+    searchPlaceholder,
+    text,
+    dropdownHeading,
+    emptyMessage
+  } = state.viewModel;
+  return /*#__PURE__*/React.createElement(TagsListDropdown, {
+    getRef: ref,
+    tags: tags,
+    text: text,
+    hasSearch: hasSearch,
+    searchPlaceholder: searchPlaceholder,
+    dropdownHeading: dropdownHeading,
+    emptyMessage: emptyMessage
+  });
+}

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

@@ -0,0 +1,26 @@
+import TextConstants from "../../../../../../../cc/text/Constants";
+import FieldConstants from "../../../../../../../cc/fields/field/Constants";
+export class EventHandlersFactory {
+  static create() {
+    const clickHandler = input => {
+      const {
+        state,
+        dispatch
+      } = input;
+      const {
+        fieldName
+      } = state.properties;
+      dispatch({
+        type: FieldConstants.FIELD_CLICKED,
+        payload: {
+          fieldName
+        }
+      });
+    };
+
+    return {
+      [TextConstants.TEXT_CLICKED]: clickHandler
+    };
+  }
+
+}

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

@@ -0,0 +1,23 @@
+import { createCustomComponent } from "../../../../../../custom-component";
+import TextProperties from "../../../../../../../cc/text/Properties";
+import FieldEvents from "../../../../../../../cc/fields/field/Events";
+import TextFieldView from "./TextFieldView";
+import { EventHandlersFactory } from "./EventHandlersFactory";
+const TextField = createCustomComponent({
+  name: 'TextField',
+  View: TextFieldView,
+  properties: { ...TextProperties,
+    fieldName: {
+      required: false,
+      defaultValue: '',
+      typeMetadata: {
+        schema: {
+          type: 'string'
+        }
+      }
+    }
+  },
+  events: FieldEvents,
+  eventHandlers: EventHandlersFactory.create()
+});
+export default TextField;

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

@@ -0,0 +1,40 @@
+import React from 'react';
+import { Text } from "../../../..";
+export default function TextFieldView(_ref, ref) {
+  let {
+    state
+  } = _ref;
+  const {
+    text,
+    size,
+    display,
+    decoration,
+    textAlign,
+    lineClamp,
+    lineHeight,
+    transform,
+    whiteSpace,
+    wordWrap,
+    wordBreak,
+    weight,
+    isDotted,
+    tooltip
+  } = state.properties;
+  return /*#__PURE__*/React.createElement(Text, {
+    getRef: ref,
+    text: text,
+    size: size,
+    display: display,
+    decoration: decoration,
+    textAlign: textAlign,
+    lineClamp: lineClamp,
+    lineHeight: lineHeight,
+    transform: transform,
+    whiteSpace: whiteSpace,
+    wordWrap: wordWrap,
+    wordBreak: isDotted ? wordBreak : 'breakWord',
+    tooltip: tooltip,
+    weight: weight,
+    isDotted: isDotted
+  });
+}

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

@@ -11,7 +11,7 @@ export function UrlFieldView(_ref, ref) {
   } = state.properties;
   return /*#__PURE__*/React.createElement(Link, {
     getRef: ref,
-    label: value,
+    text: value,
     href: value,
     variant: "secondary",
     weight: isRead ? undefined : 'bold',

package/es/library/dot/legacy-to-new-arch/tag/frameworks/ui/Tag.js

@@ -0,0 +1,11 @@
+import { createCustomComponent } from "../../../../../custom-component";
+import { TagProperties, TagEvents } from "../../../../../../cc/tag";
+import TagView from "./TagView";
+let Tag = createCustomComponent({
+  name: "Tag",
+  View: TagView,
+  properties: TagProperties,
+  events: TagEvents,
+  eventHandlers: {}
+});
+export default Tag;

package/es/library/dot/legacy-to-new-arch/tag/frameworks/ui/Tag.module.css

@@ -0,0 +1,8 @@
+
+.cursor_pointer {
+    cursor: pointer;
+}
+
+.cursor_default {
+    cursor: default;
+}

package/es/library/dot/legacy-to-new-arch/tag/frameworks/ui/TagView.js

@@ -0,0 +1,96 @@
+import React from 'react';
+import { TagConstants } from "../../../../../../cc/tag";
+import Tag from '@zohodesk/components/es/Tag/Tag';
+import ColoredTag from '@zohodesk-private/desk-components/es/ColoredTag/ColoredTag'; // @ts-ignore
+
+import style from "./Tag.module.css";
+
+function TagView(_ref, ref) {
+  let {
+    state,
+    helpers
+  } = _ref;
+  let {
+    dispatch
+  } = helpers;
+  let {
+    id,
+    label,
+    color,
+    isDisabled,
+    iconName,
+    imageAltText,
+    imageSrc,
+    isRemovable,
+    cursor,
+    size,
+    tooltip
+  } = state.properties;
+
+  if (!!color) {
+    return /*#__PURE__*/React.createElement(ColoredTag, {
+      $data_id: id,
+      $data_text: label,
+      $data_color: color,
+      $event_onClick: id => {
+        dispatch({
+          type: TagConstants.TAG_CLICKED,
+          payload: {
+            id
+          }
+        });
+      },
+      $event_onRemove: isRemovable ? id => {
+        dispatch({
+          type: TagConstants.TAG_REMOVED,
+          payload: {
+            id
+          }
+        });
+      } : undefined,
+      customStyle: {
+        chip: cursor && !isDisabled ? style[`cursor_${cursor}`] : ''
+      },
+      $customProps_tag: {
+        getRef: ref,
+        disabled: isDisabled,
+        size,
+        tooltip
+      }
+    });
+  }
+
+  return /*#__PURE__*/React.createElement(Tag, {
+    getRef: ref,
+    id: id,
+    text: label,
+    imageURL: imageSrc,
+    initial: imageAltText || label,
+    hasAvatar: !!imageSrc || !!imageAltText,
+    iconName: iconName,
+    size: size,
+    tooltip: tooltip,
+    disabled: isDisabled,
+    customClass: {
+      customTag: cursor && !isDisabled ? style[`cursor_${cursor}`] : ''
+    },
+    onSelectTag: id => {
+      dispatch({
+        type: TagConstants.TAG_CLICKED,
+        payload: {
+          id
+        }
+      });
+    },
+    onRemove: isRemovable ? id => {
+      dispatch({
+        type: TagConstants.TAG_REMOVED,
+        payload: {
+          id
+        }
+      });
+    } : undefined
+  });
+}
+
+export default TagView;

package/es/library/dot/legacy-to-new-arch/tags-list-dropdown/frameworks/ui/TagContractAdapter.js

@@ -0,0 +1,24 @@
+export default function TagContractAdapter(tag) {
+  const {
+    id,
+    label,
+    imageSrc,
+    imageAltText,
+    iconName,
+    iconSize,
+    disabled,
+    tooltip
+  } = tag;
+  return {
+    id,
+    text: label,
+    name: imageAltText,
+    imageUrl: imageSrc,
+    iconName,
+    iconSize,
+    customProps: {
+      disabled,
+      tooltip
+    }
+  };
+}

package/es/library/dot/legacy-to-new-arch/tags-list-dropdown/frameworks/ui/TagsListDropdown.js

@@ -0,0 +1,12 @@
+import { createCustomComponent } from "../../../../../custom-component";
+import TagsListDropdownProperties from "../../../../../../cc/tags-list-dropdown/Properties";
+import TagsListDropdownEvents from "../../../../../../cc/tags-list-dropdown/Events";
+import TagsListDropdownView from "./TagsListDropdownView";
+let TagsListDropdown = createCustomComponent({
+  name: "TagsListDropdown",
+  View: TagsListDropdownView,
+  properties: TagsListDropdownProperties,
+  events: TagsListDropdownEvents,
+  eventHandlers: {}
+});
+export default TagsListDropdown;

package/es/library/dot/legacy-to-new-arch/tags-list-dropdown/frameworks/ui/TagsListDropdownView.js

@@ -0,0 +1,42 @@
+import React from 'react';
+import TagsListDropdown from '@zohodesk-private/desk-components/es/TagsListDropdown/TagsListDropdown';
+import Constants from "../../../../../../cc/tags-list-dropdown/Constants";
+import TagContractAdapter from "./TagContractAdapter";
+
+function TagsListDropdownView(_ref, ref) {
+  let {
+    state,
+    helpers
+  } = _ref;
+  let {
+    dispatch
+  } = helpers;
+  let {
+    tags,
+    hasSearch,
+    searchPlaceholder,
+    text,
+    dropdownHeading,
+    emptyMessage
+  } = state.properties;
+  let tagsList = tags.map(TagContractAdapter);
+  return /*#__PURE__*/React.createElement(TagsListDropdown, {
+    getRef: ref,
+    listData: tagsList,
+    hasSearch: hasSearch,
+    searchPlaceholder: searchPlaceholder,
+    text: text,
+    dropdownHeading: dropdownHeading,
+    emptyMessage: emptyMessage,
+    onSearch: value => {
+      dispatch({
+        type: Constants.TAG_LIST_DROPDOWN_SEARCHED,
+        payload: {
+          value
+        }
+      });
+    }
+  });
+}
+
+export default TagsListDropdownView;

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

@@ -5,7 +5,7 @@ let WrapText = createCustomComponent({
   name: "TableText",
   View: TextView,
   properties: TextProperties,
-  actions: TextActions,
-  actionHandlers: {}
+  events: TextActions,
+  eventHandlers: {}
 });
 export default WrapText;

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

@@ -12,7 +12,18 @@ function TextView(_ref, ref) {
   } = helpers;
   let {
     text,
+    size,
+    display,
+    decoration,
+    textAlign,
+    lineClamp,
+    lineHeight,
+    letterSpacing,
+    transform,
+    whiteSpace,
+    wordWrap,
     weight,
+    wordBreak,
     tooltip,
     isDotted
   } = state.properties;
@@ -27,9 +38,19 @@ function TextView(_ref, ref) {
         });
       }
     },
-    $ui_size: "14",
+    $ui_size: size,
     $flag_dotted: isDotted,
+    $ui_display: display,
+    $ui_decoration: decoration,
     $ui_weight: weight,
+    $ui_textAlign: textAlign,
+    $ui_wordBreak: wordBreak,
+    $ui_lineClamp: lineClamp,
+    $ui_letterSpacing: letterSpacing,
+    $ui_lineHeight: lineHeight,
+    $ui_transform: transform,
+    $ui_whiteSpace: whiteSpace,
+    $ui_wordWrap: wordWrap,
     $i18n_dataTitle: tooltip || text
   }, text);
 }

package/es/platform/app-context-behaviour/adapters/controllers/AbstractController.js

@@ -0,0 +1,9 @@
+class AbstractController {
+  constructor(service) {
+    this.service = service;
+    this.handle = this.handle.bind(this);
+  }
+
+}
+
+export default AbstractController;