@zohodesk/library-platform 1.1.10-exp.2 → 1.1.10-temp-1

package/es/cc/fields/field/Types.js

@@ -1,4 +1,5 @@
 var Types = /*#__PURE__*/function (Types) {
+  Types["PrimaryField"] = "Primary";
   Types["CheckboxField"] = "Checkbox";
   Types["SwitchField"] = "Switch";
   Types["SingleLineField"] = "SingleLine";

package/es/cc/fields/name/Constants.js

@@ -0,0 +1,5 @@
+class Constants {
+  static NAME_FIELD_CLICKED = "NAME_FIELD#CLICKED";
+}
+
+export default Constants;

package/es/cc/fields/name/Events.js

@@ -0,0 +1,3 @@
+import FieldEvents from "../field/Events";
+const Events = FieldEvents;
+export default Events;

package/es/cc/fields/name/Model.js

@@ -0,0 +1,14 @@
+export default function NameFieldModel(_ref) {
+  let {
+    name,
+    value,
+    uiType,
+    appendToActionPayload
+  } = _ref;
+  return {
+    name,
+    appendToActionPayload,
+    type: uiType,
+    value
+  };
+}

package/es/cc/fields/name/Properties.js

@@ -0,0 +1,24 @@
+import FieldProperties from "../field/Properties";
+export default { ...FieldProperties,
+  value: {
+    required: true,
+    defaultValue: {},
+    typeMetadata: {
+      schema: {
+        type: 'object',
+        properties: {
+          id: {
+            type: 'string'
+          },
+          value: {
+            type: 'string'
+          },
+          url: {
+            type: 'string'
+          }
+        },
+        required: ['value', 'url']
+      }
+    }
+  }
+};

package/es/cc/table-connected/Properties.js

@@ -59,6 +59,18 @@ export default {
       }
     }
   },
+  nameFieldsConfig: {
+    required: false,
+    defaultValue: {
+      isEnabled: true,
+      constructUrl: null
+    },
+    typeMetadata: {
+      schema: {
+        type: 'object'
+      }
+    }
+  },
   reOrderConfig: {
     required: false,
     defaultValue: {

package/es/cc/table-list/Properties.js

@@ -17,6 +17,7 @@ import PhoneProperties from "../fields/phone/Properties";
 import PickListProperties from "../fields/pick-list/Properties";
 import TextProperties from "../fields/text/Properties";
 import UrlProperties from "../fields/url/Properties";
+import NameFieldProperties from "../fields/name/Properties";
 const TableListProperties = {
   isReOrderLoading: {
     required: false,
@@ -203,7 +204,7 @@ const TableListProperties = {
             required: ['id', 'name', 'text']
           },
           Column: {
-            anyOf: [PropertiesConverter.toJsonSchema(BooleanProperties), PropertiesConverter.toJsonSchema(CurrencyProperties), PropertiesConverter.toJsonSchema(DateProperties), PropertiesConverter.toJsonSchema(DatetimeProperties), PropertiesConverter.toJsonSchema(DecimalProperties), PropertiesConverter.toJsonSchema(EmailProperties), PropertiesConverter.toJsonSchema(LookupProperties), PropertiesConverter.toJsonSchema(MultiSelectProperties), PropertiesConverter.toJsonSchema(NumberProperties), PropertiesConverter.toJsonSchema(PercentProperties), PropertiesConverter.toJsonSchema(PhoneProperties), PropertiesConverter.toJsonSchema(PickListProperties), PropertiesConverter.toJsonSchema(TextProperties), PropertiesConverter.toJsonSchema(UrlProperties), // Below field is for the empty cell
+            anyOf: [PropertiesConverter.toJsonSchema(BooleanProperties), PropertiesConverter.toJsonSchema(CurrencyProperties), PropertiesConverter.toJsonSchema(DateProperties), PropertiesConverter.toJsonSchema(DatetimeProperties), PropertiesConverter.toJsonSchema(DecimalProperties), PropertiesConverter.toJsonSchema(EmailProperties), PropertiesConverter.toJsonSchema(LookupProperties), PropertiesConverter.toJsonSchema(MultiSelectProperties), PropertiesConverter.toJsonSchema(NumberProperties), PropertiesConverter.toJsonSchema(PercentProperties), PropertiesConverter.toJsonSchema(PhoneProperties), PropertiesConverter.toJsonSchema(PickListProperties), PropertiesConverter.toJsonSchema(TextProperties), PropertiesConverter.toJsonSchema(UrlProperties), PropertiesConverter.toJsonSchema(NameFieldProperties), // Below field is for the empty cell
             {
               type: 'object',
               properties: {

package/es/cc/table-primary-field/Constants.js

@@ -0,0 +1,5 @@
+class Constants {
+  static PRIMARY_FIELD_CLICKED = "PRIMARY_FIELD#CLICKED";
+}
+
+export default Constants;

package/es/cc/table-primary-field/Events.js

@@ -0,0 +1,4 @@
+import Constants from "./Constants";
+export default [{
+  type: Constants.PRIMARY_FIELD_CLICKED
+}];

package/es/cc/table-primary-field/Properties.js

@@ -0,0 +1,29 @@
+export default {
+  id: {
+    required: false,
+    defaultValue: false,
+    typeMetadata: {
+      schema: {
+        type: 'string'
+      }
+    }
+  },
+  value: {
+    required: false,
+    defaultValue: false,
+    typeMetadata: {
+      schema: {
+        type: 'string'
+      }
+    }
+  },
+  url: {
+    required: false,
+    defaultValue: false,
+    typeMetadata: {
+      schema: {
+        type: 'string'
+      }
+    }
+  }
+};

package/es/library/dot/components/form/frameworks/ui/css/Form.module.css

@@ -3,17 +3,17 @@
 }
 
 .field {
-    margin-top: 5px;
+    margin-top: var(--zd_size5) ;
 }
 
 .multiSelectField {
-    margin-top: 2px
+    margin-top: var(--zd_size2) 
 }
 
 .checkboxField {
     composes: dInflex alignFstart from '~@zohodesk/components/es/common/common.module.css';
-    max-width: 100%;
-    gap: 8px
+    max-width: 100% ;
+    gap: var(--zd_size8) 
 }
 
 .cursor_pointer {
@@ -27,36 +27,36 @@
 }
 
 [dir=ltr] .footer {
-    padding-right: 32px
+    padding-right: var(--zd_size32) 
 }
 
 [dir=rtl] .footer {
-    padding-left: 32px
+    padding-left: var(--zd_size32) 
 }
 
 /* Sections layout */
 
 .sectionsWrapper {
-    padding-bottom: 8px
+    padding-bottom: var(--zd_size8) 
 }
 
 .sectionsLayout, .sectionsTwoLayout {
-    margin: 0 auto
+    margin: 0 auto 
 }
 
 .sectionsLayout {
-    max-width: var(--local-form-layout-max-width, 1080px)
+    max-width: var(--local-form-layout-max-width, var(--zd_size1080))
 }
 
 .sectionsTwoLayout {
-    column-gap: 8px;
-    max-width: var(--local-form-layout-max-width, 1210px)
+    column-gap: var(--zd_size8) ;
+    max-width: var(--local-form-layout-max-width, var(--zd_size1210))
 }
 
 .rightPanel {
     height: var(--local-form-right-panel-height, 100%);
     position: -webkit-sticky;
     position: sticky;
-    top: 0;
-    padding: 8px 0
+    top: 0 ;
+    padding: var(--zd_size8) 0 
 }

package/es/library/dot/components/form-fields/field/css/FieldItem.module.css

@@ -1,7 +1,7 @@
 .fieldItem {
     position: relative;
-    min-width: 0;
-    min-height: 0
+    min-width: 0 ;
+    min-height: 0 
 }
 
 .largeSize {

package/es/library/dot/components/section/frameworks/ui/css/Section.module.css

@@ -1,3 +1,3 @@
 .fieldsContainer {
-    padding-top: 1px
+    padding-top: var(--zd_size1) 
 }

package/es/library/dot/components/table-list/frameworks/ui/css/TableList.module.css

@@ -137,18 +137,18 @@
 }
 
 .loader {
-    padding: 40px 0
+    padding: var(--zd_size40) 0 
 }
 
 .wrapper {
-    height: 100%;
-    width: 100%;
+    height: 100% ;
+    width: 100% ;
     z-index: 1;
     position: relative
 }
 
 .resizerSpace {
-    width: calc(var(--local_table_resizer_extra_space, 0) * 1px);
+    width: calc(var(--local_table_resizer_extra_space, 0) * var(--zd_size1));
     flex-shrink: 0
 }
 
@@ -157,32 +157,32 @@
 }
 
 [dir=ltr] .contentWrapper {
-    left: 0;
+    left: 0 ;
 }
 
 [dir=rtl] .contentWrapper {
-    right: 0;
+    right: 0 ;
 }
 
 .initialLoading {
-    height: calc(100% - 100px)
+    height: calc(100% - (var(--zd_size100)))
 }
 
 .emptyContent {
-    padding: 160px 0 60px
+    padding: var(--zd_size160) 0 var(--zd_size60) 
 }
 
 .errorContent {
-    padding: 60px 0
+    padding: var(--zd_size60) 0 
 }
 
 .headerWithActions,
 .fieldWithActions {
-    gap: 6px
+    gap: var(--zd_size6) 
 }
 
 .actions {
-    gap: 8px
+    gap: var(--zd_size8) 
 }
 
 .rowCursor_default {
@@ -250,8 +250,8 @@
 }
 
 .rowDropIndicator {
-    width: 100%;
-    height: 2px;
+    width: 100% ;
+    height: var(--zd_size2) ;
     /* css:theme-validation:ignore */
     position: absolute;
     z-index: 2;
@@ -259,11 +259,11 @@
 }
 
 .dropIndicatorTop {
-    top: 0;
+    top: 0 ;
 }
 
 .dropIndicatorBottom {
-    bottom: -3px;
+    bottom: calc( var(--zd_size3) * -1 ) ;
 }
 
 .row {

package/es/library/dot/legacy-to-new-arch/breadcrumb/frameworks/ui/css/Breadcrumb.module.css

@@ -1,19 +1,19 @@
 .wrapper, .itemContainer {
-    max-width: 100%
+    max-width: 100% 
 }
 
 .itemContainer {
-    column-gap: 4px;
+    column-gap: var(--zd_size4) ;
 }
 
 .separator {
     --separator_fontSize: 14px;
-    margin: 0 10px;
+    margin: 0 var(--zd_size10) ;
 }
 
 .buttonStyle {
     --button_font_size: 14px;
     --button_padding: 0px;
     --button_letter_spacing: 0px;
-    max-width: 100%;
+    max-width: 100% ;
 }

package/es/library/dot/legacy-to-new-arch/date/frameworks/ui/css/DateView.module.css

@@ -1,3 +1,3 @@
 .actionContainer {
-    margin-top: 2px;
+    margin-top: var(--zd_size2) ;
 }

package/es/library/dot/legacy-to-new-arch/label/frameworks/ui/css/Label.module.css

@@ -1,9 +1,9 @@
 .label {
     --label_cursor: inherit
 }[dir=ltr] .label {
-    padding-right: 6px
+    padding-right: var(--zd_size6) 
 }[dir=rtl] .label {
-    padding-left: 6px
+    padding-left: var(--zd_size6) 
 }
 
 .mandatory::after {
@@ -11,9 +11,9 @@
 }
 
 [dir=ltr] .mandatory::after {
-    padding-left: 2px
+    padding-left: var(--zd_size2) 
 }
 
 [dir=rtl] .mandatory::after {
-    padding-right: 2px
+    padding-right: var(--zd_size2) 
 }

package/es/library/dot/legacy-to-new-arch/multi-select/frameworks/ui/css/MultiSelectView.module.css

@@ -1,19 +1,19 @@
 .actionContainer {
-    margin-top: 4px;
+    margin-top: var(--zd_size4) ;
 }
 
 .custmInputWrapper {
     position: absolute;
-    top: 0;
-    width: 100%;
+    top: 0 ;
+    width: 100% ;
 }
 
 [dir=ltr] .custmInputWrapper {
-    left: 0;
+    left: 0 ;
 }
 
 [dir=rtl] .custmInputWrapper {
-    right: 0;
+    right: 0 ;
 }
 
 .clearIconContainer {
@@ -21,17 +21,17 @@
 }
 
 [dir=ltr] .paddingRight64 {
-    padding-right: 64px;
+    padding-right: var(--zd_size64) ;
 }
 
 [dir=rtl] .paddingRight64 {
-    padding-left: 64px;
+    padding-left: var(--zd_size64) ;
 }
 
 [dir=ltr] .paddingRight96 {
-    padding-right: 96px;
+    padding-right: var(--zd_size96) ;
 }
 
 [dir=rtl] .paddingRight96 {
-    padding-left: 96px;
+    padding-left: var(--zd_size96) ;
 }

package/es/library/dot/legacy-to-new-arch/table-column-chooser/frameworks/ui/TableColumnChooserView.module.css

@@ -0,0 +1,3 @@
+.container {
+    margin-top: var(--zd_size10) 
+}

package/es/library/dot/legacy-to-new-arch/table-column-chooser/frameworks/ui/css/TableColumnChooserView.module.css

@@ -0,0 +1,3 @@
+.textFlowOptions {
+    margin-top: var(--zd_size10) 
+}

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

@@ -1,4 +1,5 @@
 import FieldTypes from "../../../../cc/fields/field/Types";
+import PrimaryField from "./primary-field/frameworks/ui/PrimaryField";
 import CheckboxField from "./checkbox-field/frameworks/ui/CheckboxField";
 import SwitchField from "./switch-field/frameworks/ui/SwitchField";
 import SingleLineField from "./singleline-field/frameworks/ui/SingleLineField";
@@ -17,6 +18,7 @@ import NumberField from "./number-field/frameworks/ui/NumberField";
 import DecimalField from "./decimal-field/frameworks/ui/DecimalField";
 import MultiSelectField from "./multiselect-field/frameworks/ui/MultiSelectField";
 const FieldComponents = {
+  [FieldTypes.PrimaryField]: PrimaryField,
   [FieldTypes.CheckboxField]: CheckboxField,
   [FieldTypes.SwitchField]: SwitchField,
   // TODO: Need to register SwitchField

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

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

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

@@ -0,0 +1,12 @@
+import { createCustomComponent } from "../../../../../../custom-component";
+import NameFieldProperties from "../../../../../../../cc/fields/name/Properties";
+import NameFieldEvents from "../../../../../../../cc/fields/name/Events";
+import PrimaryFieldView from "./PrimaryFieldView";
+const PrimaryField = createCustomComponent({
+  name: 'PrimaryField',
+  View: PrimaryFieldView,
+  properties: NameFieldProperties,
+  events: NameFieldEvents,
+  eventHandlers: {}
+});
+export default PrimaryField;

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

@@ -0,0 +1,38 @@
+import React from 'react';
+import TableLink from "@zohodesk-private/desk-components/es/table/TableLink/TableLink";
+import FieldConstants from "../../../../../../../cc/fields/field/Constants";
+export default function PrimaryFieldView(_ref, ref) {
+  let {
+    state,
+    helpers
+  } = _ref;
+  let {
+    dispatch
+  } = helpers;
+  let {
+    value: propValue,
+    name: fieldName
+  } = state.properties;
+  let {
+    value,
+    url
+  } = propValue;
+  return /*#__PURE__*/React.createElement(TableLink, {
+    $customProps_link: {
+      ref
+    },
+    $data_text: value,
+    $data_url: url,
+    $data_target: "_self",
+    $flag_hoverableFromList: true,
+    $event_onClick: () => {
+      dispatch({
+        type: FieldConstants.FIELD_CLICKED,
+        payload: {
+          fieldName,
+          url
+        }
+      });
+    }
+  });
+}

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

@@ -4,37 +4,37 @@
 
 .rightPlaceholder {
     position: absolute;
-    bottom: 4px;
+    bottom: var(--zd_size4) ;
 }
 
 [dir=ltr] .rightPlaceholder {
-    right: 12px;
+    right: var(--zd_size12) ;
 }
 
 [dir=rtl] .rightPlaceholder {
-    left: 12px;
+    left: var(--zd_size12) ;
 }
 
 [dir=ltr] .paddingRight32 {
-    padding-right: 32px;
+    padding-right: var(--zd_size32) ;
 }
 
 [dir=rtl] .paddingRight32 {
-    padding-left: 32px;
+    padding-left: var(--zd_size32) ;
 }
 
 [dir=ltr] .paddingRight64 {
-    padding-right: 64px;
+    padding-right: var(--zd_size64) ;
 }
 
 [dir=rtl] .paddingRight64 {
-    padding-left: 64px;
+    padding-left: var(--zd_size64) ;
 }
 
 [dir=ltr] .paddingRight96 {
-    padding-right: 96px;
+    padding-right: var(--zd_size96) ;
 }
 
 [dir=rtl] .paddingRight96 {
-    padding-left: 96px;
+    padding-left: var(--zd_size96) ;
 }

package/es/platform/client-actions/cc/dynamic-action-component/Properties.js

@@ -0,0 +1,51 @@
+export const actionSchema = {
+  type: 'object',
+  properties: {
+    component: {
+      type: 'string'
+    },
+    id: {
+      type: 'string'
+    },
+    properties: {
+      type: 'object'
+    },
+    eventMappings: {
+      type: 'array',
+      minItems: 0,
+      items: {
+        type: 'object',
+        properties: {
+          action: {
+            type: 'object',
+            properties: {
+              event: {
+                type: 'string'
+              },
+              payload: {
+                type: 'object'
+              }
+            },
+            required: ['event', 'payload']
+          },
+          id: {
+            type: 'string'
+          },
+          sourceEvent: {
+            type: 'string'
+          }
+        },
+        required: ['id']
+      }
+    }
+  },
+  required: ['component', 'properties']
+};
+export default {
+  action: {
+    required: true,
+    typeMetadata: {
+      schema: actionSchema
+    }
+  }
+};

package/es/platform/client-actions/components/dynamic-component/domain/entities/interfaces/IState.js

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

package/es/platform/client-actions/components/dynamic-component/frameworks/ui/DynamicActionComponent.js

@@ -0,0 +1,9 @@
+import { createCustomComponent } from "../../../../../../library/custom-component";
+import DynamicActionComponentProperties from "../../../../cc/dynamic-action-component/Properties";
+import DynamicActionComponentView from "./DynamicActionComponentView";
+export default createCustomComponent({
+  name: 'DynamicActionComponent',
+  properties: DynamicActionComponentProperties,
+  eventHandlers: {},
+  View: DynamicActionComponentView
+});

package/es/platform/client-actions/components/dynamic-component/frameworks/ui/DynamicActionComponentView.js

@@ -0,0 +1,38 @@
+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); }
+
+import React from 'react';
+import ComponentRegistry from "../../../../../../library/custom-component/frameworks/ui/ComponentRegistry";
+import ActionComponentMapping from "../../../../../../library/dot/components/action-location/frameworks/ui/ActionComponentMapping";
+
+function DynamicComponentView(_ref, ref) {
+  let {
+    state
+  } = _ref;
+  const {
+    action
+  } = state.properties;
+  const {
+    component,
+    properties,
+    eventMappings,
+    id: actionId
+  } = action;
+  const Component = ComponentRegistry.get(component) || ActionComponentMapping[component];
+
+  if (!Component) {
+    return /*#__PURE__*/React.createElement("div", {
+      ref: ref
+    }, "Error");
+  }
+
+  return /*#__PURE__*/React.createElement(Component, _extends({
+    getRef: ref
+  }, properties, {
+    appendToActionPayload: {
+      eventMappings,
+      actionId
+    }
+  }));
+}
+
+export default DynamicComponentView;