@zohodesk/library-platform 1.2.2-exp.6 → 1.2.3

package/es/library/dot/components/form-fields/email/frameworks/ui/EmailView.js

@@ -21,8 +21,7 @@ function EmailView(_ref, ref) {
     uiConfig,
     labelActions,
     actions,
-    clientScripts,
-    context
+    clientScripts
   } = state.properties;
   const {
     size,
@@ -37,8 +36,7 @@ function EmailView(_ref, ref) {
     errorMessage: errorMessage,
     testId: "smart_form_field_email",
     size: size,
-    breakRow: breakRow,
-    context: context
+    breakRow: breakRow
   }, /*#__PURE__*/React.createElement("div", {
     className: style.field
   }, /*#__PURE__*/React.createElement(TextBox, {
@@ -50,8 +48,7 @@ function EmailView(_ref, ref) {
     readonly: readonly,
     required: required,
     actions: actions,
-    clientScripts: clientScripts,
-    context: context
+    clientScripts: clientScripts
   })));
 }
 

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

@@ -13,8 +13,7 @@ const FieldItem = /*#__PURE__*/forwardRef((props, ref) => {
     breakRow,
     errorMessage,
     testId,
-    children,
-    context
+    children
   } = props;
   const isLargeSize = size === 'large';
   return /*#__PURE__*/React.createElement("div", {
@@ -25,8 +24,7 @@ const FieldItem = /*#__PURE__*/forwardRef((props, ref) => {
     for: id,
     label: label,
     actions: labelActions,
-    isMandatory: required,
-    context: context
+    isMandatory: required
   }), !isLargeSize && breakRow ? /*#__PURE__*/React.createElement("div", {
     className: style.breakRow
   }, children) : children, errorMessage ? /*#__PURE__*/React.createElement(ErrorMessage, {

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/form-fields/lookup/frameworks/ui/LookupView.js

@@ -20,8 +20,7 @@ function TextBoxView(_ref, ref) {
     uiConfig,
     labelActions,
     actions,
-    clientScripts,
-    context
+    clientScripts
   } = state.properties;
   const {
     size,
@@ -36,8 +35,7 @@ function TextBoxView(_ref, ref) {
     errorMessage: errorMessage,
     testId: 'smart_form_field_lookup',
     size: size,
-    breakRow: breakRow,
-    context: context
+    breakRow: breakRow
   }, /*#__PURE__*/React.createElement("div", {
     className: style.field
   }, /*#__PURE__*/React.createElement(TextBox, {
@@ -48,8 +46,7 @@ function TextBoxView(_ref, ref) {
     disabled: disabled,
     readonly: readonly,
     actions: actions,
-    clientScripts: clientScripts,
-    context: context
+    clientScripts: clientScripts
   })));
 }
 

package/es/library/dot/components/form-fields/multi-select/frameworks/ui/MultiSelectView.js

@@ -26,8 +26,7 @@ function MultiSelectView(_ref, ref) {
     labelActions,
     actions,
     uiConfig,
-    clientScripts,
-    context
+    clientScripts
   } = state.properties;
   const {
     size,
@@ -40,10 +39,9 @@ function MultiSelectView(_ref, ref) {
     labelActions: labelActions,
     required: required,
     errorMessage: errorMessage,
-    testId: 'smart_form_field_multiselect',
+    testId: "smart_form_field_multiselect",
     size: size,
-    breakRow: breakRow,
-    context: context
+    breakRow: breakRow
   }, /*#__PURE__*/React.createElement(FieldController, {
     $ui_className: style.multiSelectField,
     $event_onFocus: () => dispatch({
@@ -60,8 +58,7 @@ function MultiSelectView(_ref, ref) {
     disabled: disabled,
     readonly: readonly,
     actions: actions,
-    clientScripts: clientScripts,
-    context: context
+    clientScripts: clientScripts
   })));
 }
 

package/es/library/dot/components/form-fields/number/frameworks/ui/NumberView.js

@@ -21,8 +21,7 @@ function NumberView(_ref, ref) {
     uiConfig,
     labelActions,
     actions,
-    clientScripts,
-    context
+    clientScripts
   } = state.properties;
   const {
     size,
@@ -37,8 +36,7 @@ function NumberView(_ref, ref) {
     errorMessage: errorMessage,
     testId: "smart_form_field_number",
     size: size,
-    breakRow: breakRow,
-    context: context
+    breakRow: breakRow
   }, /*#__PURE__*/React.createElement("div", {
     className: style.field
   }, /*#__PURE__*/React.createElement(TextBox, {
@@ -50,8 +48,7 @@ function NumberView(_ref, ref) {
     readonly: readonly,
     required: required,
     actions: actions,
-    clientScripts: clientScripts,
-    context: context
+    clientScripts: clientScripts
   })));
 }
 

package/es/library/dot/components/form-fields/percentage/frameworks/ui/PercentageView.js

@@ -20,8 +20,7 @@ function PercentageView(_ref, ref) {
     uiConfig,
     labelActions,
     actions,
-    clientScripts,
-    context
+    clientScripts
   } = state.properties;
   const {
     size,
@@ -34,10 +33,9 @@ function PercentageView(_ref, ref) {
     labelActions: labelActions,
     required: required,
     errorMessage: errorMessage,
-    testId: 'smart_form_field_percentage',
+    testId: "smart_form_field_percentage",
     size: size,
-    breakRow: breakRow,
-    context: context
+    breakRow: breakRow
   }, /*#__PURE__*/React.createElement("div", {
     className: style.field
   }, /*#__PURE__*/React.createElement(TextBox, {
@@ -48,8 +46,7 @@ function PercentageView(_ref, ref) {
     readonly: readonly,
     required: required,
     actions: actions,
-    clientScripts: clientScripts,
-    context: context
+    clientScripts: clientScripts
   })));
 }
 

package/es/library/dot/components/form-fields/phone/frameworks/ui/PhoneView.js

@@ -21,8 +21,7 @@ function PhoneView(_ref, ref) {
     uiConfig,
     labelActions,
     actions,
-    clientScripts,
-    context
+    clientScripts
   } = state.properties;
   const {
     size,
@@ -37,8 +36,7 @@ function PhoneView(_ref, ref) {
     errorMessage: errorMessage,
     testId: "smart_form_field_phone",
     size: size,
-    breakRow: breakRow,
-    context: context
+    breakRow: breakRow
   }, /*#__PURE__*/React.createElement("div", {
     className: style.field
   }, /*#__PURE__*/React.createElement(TextBox, {
@@ -50,8 +48,7 @@ function PhoneView(_ref, ref) {
     readonly: readonly,
     required: required,
     actions: actions,
-    clientScripts: clientScripts,
-    context: context
+    clientScripts: clientScripts
   })));
 }
 

package/es/library/dot/components/form-fields/pick-list/frameworks/ui/PickListView.js

@@ -26,8 +26,7 @@ function PickListView(_ref, ref) {
     labelActions,
     actions,
     uiConfig,
-    clientScripts,
-    context
+    clientScripts
   } = state.properties;
   const {
     size,
@@ -40,10 +39,9 @@ function PickListView(_ref, ref) {
     labelActions: labelActions,
     required: required,
     errorMessage: errorMessage,
-    testId: 'smart_form_field_picklist',
+    testId: "smart_form_field_picklist",
     size: size,
-    breakRow: breakRow,
-    context: context
+    breakRow: breakRow
   }, /*#__PURE__*/React.createElement(FieldController, {
     $ui_className: style.field,
     $event_onFocus: () => dispatch({
@@ -60,8 +58,7 @@ function PickListView(_ref, ref) {
     disabled: disabled,
     readonly: readonly,
     actions: actions,
-    clientScripts: clientScripts,
-    context: context
+    clientScripts: clientScripts
   })));
 }
 

package/es/library/dot/components/form-fields/textarea/frameworks/ui/TextAreaView.js

@@ -21,8 +21,7 @@ function TextAreaView(_ref, ref) {
     labelActions,
     actions,
     clientScripts,
-    maxLength,
-    context
+    maxLength
   } = state.properties;
   const {
     size,
@@ -37,8 +36,7 @@ function TextAreaView(_ref, ref) {
     errorMessage: errorMessage,
     testId: "smart_form_field_textarea",
     size: size,
-    breakRow: breakRow,
-    context: context
+    breakRow: breakRow
   }, /*#__PURE__*/React.createElement("div", {
     className: style.field
   }, /*#__PURE__*/React.createElement(TextArea, {
@@ -50,8 +48,7 @@ function TextAreaView(_ref, ref) {
     readonly: readonly,
     actions: actions,
     clientScripts: clientScripts,
-    maxLength: maxLength,
-    context: context
+    maxLength: maxLength
   })));
 }
 

package/es/library/dot/components/form-fields/textbox/frameworks/ui/TextBoxView.js

@@ -21,8 +21,7 @@ function TextBoxView(_ref, ref) {
     uiConfig,
     labelActions,
     actions,
-    clientScripts,
-    context
+    clientScripts
   } = state.properties;
   const {
     size,
@@ -37,8 +36,7 @@ function TextBoxView(_ref, ref) {
     errorMessage: errorMessage,
     testId: "smart_form_field_textbox",
     size: size,
-    breakRow: breakRow,
-    context: context
+    breakRow: breakRow
   }, /*#__PURE__*/React.createElement("div", {
     className: style.field
   }, /*#__PURE__*/React.createElement(TextBox, {
@@ -50,8 +48,7 @@ function TextBoxView(_ref, ref) {
     disabled: disabled,
     readonly: readonly,
     actions: actions,
-    clientScripts: clientScripts,
-    context: context
+    clientScripts: clientScripts
   })));
 }
 

package/es/library/dot/components/form-fields/url/frameworks/ui/UrlView.js

@@ -21,8 +21,7 @@ function UrlView(_ref, ref) {
     required,
     labelActions,
     actions,
-    clientScripts,
-    context
+    clientScripts
   } = state.properties;
   const {
     size,
@@ -37,8 +36,7 @@ function UrlView(_ref, ref) {
     size: size,
     breakRow: breakRow,
     errorMessage: errorMessage,
-    testId: "smart_form_field_url",
-    context: context
+    testId: "smart_form_field_url"
   }, /*#__PURE__*/React.createElement("div", {
     className: style.field
   }, /*#__PURE__*/React.createElement(TextBox, {
@@ -50,8 +48,7 @@ function UrlView(_ref, ref) {
     readonly: readonly,
     required: required,
     actions: actions,
-    clientScripts: clientScripts,
-    context: context
+    clientScripts: clientScripts
   })));
 }
 

package/es/library/dot/components/section/frameworks/ui/RenderField.js

@@ -5,7 +5,6 @@ import ComponentRegistry from "../../../../../custom-component/frameworks/ui/Com
 export function renderField(field, key, clientScripts) {
   const {
     type,
-    context,
     ...properties
   } = field;
   const Component = ComponentRegistry.get(type);
@@ -18,7 +17,6 @@ export function renderField(field, key, clientScripts) {
   return /*#__PURE__*/React.createElement(Component, _extends({
     key: key
   }, properties, {
-    clientScripts: clientScripts,
-    context: context
+    clientScripts: clientScripts
   }));
 }

package/es/library/dot/components/section/frameworks/ui/SectionView.js

@@ -1,13 +1,13 @@
 import React from 'react';
+import RowActionsRenderer from "../../../../../../platform/client-actions/components/row-actions-renderer/frameworks/ui/RowActions/RowActionsRenderer";
 import VelocityAnimationGroup from '@zohodesk/components/es/VelocityAnimation/VelocityAnimationGroup/VelocityAnimationGroup';
 import Flex from '@zohodesk/layout/es/Flex/Flex';
 import Section from '@zohodesk-private/desk-components/es/setup/SetupFormBox/SetupFormBox';
 import FieldsLayout from '@zohodesk-private/desk-components/es/form/FieldsLayout/FieldsLayout';
 import { renderField } from "./RenderField";
-import { ActionViewGap, Layout } from "../../../../../../platform/client-actions/components/interfaces/ActionViewModel"; // @ts-ignore
+import { ActionViewGap } from "../../../../../../platform/client-actions/components/interfaces/ActionViewModel"; // @ts-ignore
 
 import style from "./css/Section.module.css";
-import ClientActionsRenderer from "../../../../../../platform/client-actions/components/client-actions-renderer/frameworks/ui/client-actions-renderer/ClientActionsRenderer";
 
 function SectionView(_ref, ref) {
   let {
@@ -21,8 +21,7 @@ function SectionView(_ref, ref) {
     fields,
     titleActions,
     headerActions,
-    clientScripts,
-    context
+    clientScripts
   } = state.properties;
 
   const renderActions = actions => {
@@ -31,14 +30,10 @@ function SectionView(_ref, ref) {
       $ui_displayMode: "flex",
       $ui_alignItems: "center",
       $ui_className: style.actionContainer
-    }, /*#__PURE__*/React.createElement(ClientActionsRenderer, {
+    }, /*#__PURE__*/React.createElement(RowActionsRenderer, {
       actions: actions,
-      clientScripts: clientScripts,
-      context: context,
-      viewMeta: {
-        layout: Layout.HORIZONTAL,
-        gap: ActionViewGap.LARGE
-      }
+      gap: ActionViewGap.LARGE,
+      clientScripts: clientScripts
     }));
   };
 

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

@@ -1,11 +1,11 @@
 .fieldsContainer {
-    padding-top: 1px
+    padding-top: var(--zd_size1) 
 }
 
 [dir=ltr] .actionContainer {
-    margin-left: 8px;
+    margin-left: var(--zd_size8) ;
 }
 
 [dir=rtl] .actionContainer {
-    margin-right: 8px;
+    margin-right: var(--zd_size8) ;
 }

package/es/library/dot/components/table-list/frameworks/ui/TableListView.js

@@ -44,8 +44,7 @@ function TableListView(_ref2, _ref) {
   const {
     headers,
     rows,
-    clientScripts,
-    massActionsContext
+    clientScripts
   } = data;
   const {
     hasActions: hasRowActions,
@@ -101,8 +100,7 @@ function TableListView(_ref2, _ref) {
     hasRowActions,
     rowActionsColumnWidth,
     dispatch,
-    clientScripts,
-    massActionsContext
+    clientScripts
   }), renderBody({
     TableRef,
     dispatch,
@@ -151,8 +149,7 @@ function renderHeader(_ref3) {
     hasRowActions,
     rowActionsColumnWidth,
     dispatch,
-    clientScripts,
-    massActionsContext
+    clientScripts
   } = _ref3;
   return /*#__PURE__*/React.createElement(Header, {
     isReorderEnabled: isReorderEnabled,
@@ -169,8 +166,7 @@ function renderHeader(_ref3) {
     headers: headers,
     isMultiline: isMultiline,
     dispatch: dispatch,
-    clientScripts: clientScripts,
-    massActionsContext: massActionsContext
+    clientScripts: clientScripts
   });
 }
 

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

@@ -137,39 +137,39 @@
 }
 
 .paginationSpace {
-    padding-bottom: 70px;
+    padding-bottom: var(--zd_size70) ;
 }
 
 .loader {
-    padding: 20px 0
+    padding: var(--zd_size20) 0 
 }
 
 .wrapper {
-    height: 100%;
-    width: 100%;
+    height: 100% ;
+    width: 100% ;
     z-index: 1;
     position: relative;
 }
 
 .hiddenDummyRow {
-    height: 40px;
-    width: 0;
+    height: var(--zd_size40) ;
+    width: 0 ;
     position: absolute;
     z-index: -100;
-    top: 0;
+    top: 0 ;
     pointer-events: none;
 }
 
 [dir=ltr] .hiddenDummyRow {
-    left: 0;
+    left: 0 ;
 }
 
 [dir=rtl] .hiddenDummyRow {
-    right: 0;
+    right: 0 ;
 }
 
 .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
 }
 
@@ -178,32 +178,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 {
@@ -248,7 +248,7 @@
 }
 
 .dragHandleContainer {
-    height: 100%;
+    height: 100% ;
     opacity: 0;
     visibility: hidden;
 }
@@ -272,8 +272,8 @@
 }
 
 .rowDropIndicator {
-    width: 100%;
-    height: 2px;
+    width: 100% ;
+    height: var(--zd_size2) ;
     /* css:theme-validation:ignore */
     position: absolute;
     z-index: 2;
@@ -281,11 +281,11 @@
 }
 
 .dropIndicatorTop {
-    top: 0;
+    top: 0 ;
 }
 
 .dropIndicatorBottom {
-    bottom: -3px;
+    bottom: calc( var(--zd_size3) * -1 ) ;
 }
 
 .row {
@@ -341,13 +341,13 @@
 
 .pagination {
     composes: posab from '~@zohodesk/components/lib/common/common.module.css';
-    bottom: 20px;
+    bottom: var(--zd_size20) ;
 }
 
 [dir=ltr] .pagination {
-    right: 30px;
+    right: var(--zd_size30) ;
 }
 
 [dir=rtl] .pagination {
-    left: 30px;
+    left: var(--zd_size30) ;
 }

package/es/library/dot/components/table-list/frameworks/ui/sub-components/Header.js

@@ -26,8 +26,7 @@ function Header(_ref) {
     headers,
     isMultiline,
     dispatch,
-    clientScripts,
-    massActionsContext
+    clientScripts
   } = _ref;
 
   if (headers.length <= 0) {
@@ -49,16 +48,15 @@ function Header(_ref) {
     }
   }, /*#__PURE__*/React.createElement(TableHeaderRow, {
     $flag_autoHeight: isMultiline
-  }, renderReOrderColumn(isReorderEnabled), rendermassAction(isSelectionEnabled, isMultiline, actions, clientScripts, massActionsContext), renderHeaders(headers, isMultiline, currentlyResizingColumn, isResizerEnabled, isFlexibleColumns, dispatch, clientScripts), renderActionColumn(hasRowActions, rowActionsColumnWidth), renderResizerExtraSpace(isCurrentlyResizing, resizerExtraWidth)));
+  }, renderReOrderColumn(isReorderEnabled), rendermassAction(isSelectionEnabled, isMultiline, actions, clientScripts), renderHeaders(headers, isMultiline, currentlyResizingColumn, isResizerEnabled, isFlexibleColumns, dispatch, clientScripts), renderActionColumn(hasRowActions, rowActionsColumnWidth), renderResizerExtraSpace(isCurrentlyResizing, resizerExtraWidth)));
 }
 
-function rendermassAction(isSelectionEnabled, isMultiline, actions, clientScripts, massActionsContext) {
+function rendermassAction(isSelectionEnabled, isMultiline, actions, clientScripts) {
   return /*#__PURE__*/React.createElement(MassAction, {
     isSelectionEnabled: isSelectionEnabled,
     isMultiline: isMultiline,
     actions: actions,
-    clientScripts: clientScripts,
-    context: massActionsContext
+    clientScripts: clientScripts
   });
 }
 

package/es/library/dot/components/table-list/frameworks/ui/sub-components/header/HeaderData.js

@@ -2,11 +2,11 @@ import React from 'react';
 import TableHead from '@zohodesk-private/desk-components/es/table/TableHead/TableHead';
 import TableHeading from '@zohodesk-private/desk-components/es/table/TableHeading/TableHeading';
 import { AlignmentOfFlex } from "../../../../../../../../cc/table-list/data-types/Header";
-import { ActionViewGap, Layout } from "../../../../../../../../platform/client-actions/components/interfaces/ActionViewModel";
+import { ActionViewGap } from "../../../../../../../../platform/client-actions/components/interfaces/ActionViewModel";
 import ColumnResizer from "./ColumnResizer"; // @ts-ignore
 
 import style from "./../../css/TableList.module.css";
-import ClientActionsRenderer from "../../../../../../../../platform/client-actions/components/client-actions-renderer/frameworks/ui/client-actions-renderer/ClientActionsRenderer";
+import RowActionsRenderer from "../../../../../../../../platform/client-actions/components/row-actions-renderer/frameworks/ui/RowActions/RowActionsRenderer";
 
 function HeaderData(_ref) {
   let {
@@ -26,8 +26,7 @@ function HeaderData(_ref) {
     sortable,
     width,
     alignment,
-    actions,
-    context
+    actions
   } = header;
   const hasActions = Boolean(actions?.length);
   return (
@@ -51,14 +50,10 @@ function HeaderData(_ref) {
     }, /*#__PURE__*/React.createElement(TableHeading, {
       $i18n_text: text,
       $flag_wrapText: isMultiline
-    }), hasActions ? /*#__PURE__*/React.createElement(ClientActionsRenderer, {
+    }), hasActions ? /*#__PURE__*/React.createElement(RowActionsRenderer, {
       actions: actions,
-      clientScripts: clientScripts,
-      context: context,
-      viewMeta: {
-        layout: Layout.HORIZONTAL,
-        gap: ActionViewGap.SMALL
-      }
+      gap: ActionViewGap.SMALL,
+      clientScripts: clientScripts
     }) : null, /*#__PURE__*/React.createElement(ColumnResizer, {
       isResizerEnabled: isResizerEnabled,
       isResizing: isResizing,