@zohodesk/library-platform 1.1.9 → 1.1.10

package/es/library/dot/components/form-fields/date/adapters/presenter/TransformState.js

@@ -0,0 +1,22 @@
+export function TransformState(state) {
+  const {
+    tooltip
+  } = state.properties;
+  let actions = [];
+
+  if (tooltip) {
+    actions.push({
+      type: 'InfoIcon',
+      eventMappings: [],
+      properties: {
+        tooltip
+      }
+    });
+  }
+
+  return { ...state,
+    viewModel: { ...state.properties,
+      actions
+    }
+  };
+}

package/es/library/dot/components/form-fields/datetime/adapters/presenter/TransformState.js

@@ -0,0 +1,22 @@
+export function TransformState(state) {
+  const {
+    tooltip
+  } = state.properties;
+  let actions = [];
+
+  if (tooltip) {
+    actions.push({
+      type: 'InfoIcon',
+      eventMappings: [],
+      properties: {
+        tooltip
+      }
+    });
+  }
+
+  return { ...state,
+    viewModel: { ...state.properties,
+      actions
+    }
+  };
+}

package/es/library/dot/components/form-fields/decimal/adapters/presenter/TransformState.js

@@ -0,0 +1,31 @@
+export function TransformState(state) {
+  const {
+    ePHI,
+    tooltip
+  } = state.properties;
+  let actions = [];
+
+  if (tooltip) {
+    actions.push({
+      type: 'InfoIcon',
+      eventMappings: [],
+      properties: {
+        tooltip
+      }
+    });
+  }
+
+  if (ePHI) {
+    actions.push({
+      type: 'EPHITag',
+      properties: {},
+      eventMappings: []
+    });
+  }
+
+  return { ...state,
+    viewModel: { ...state.properties,
+      actions
+    }
+  };
+}

package/es/library/dot/components/form-fields/email/adapters/presenter/TransformState.js

@@ -0,0 +1,23 @@
+// import TransFormState from '../../adapters/presenter/TransFormState';
+export function TransformState(state) {
+  const {
+    tooltip
+  } = state.properties;
+  let actions = [];
+
+  if (tooltip) {
+    actions.push({
+      type: 'InfoIcon',
+      eventMappings: [],
+      properties: {
+        tooltip
+      }
+    });
+  }
+
+  return { ...state,
+    properties: { ...state.properties,
+      actions
+    }
+  };
+}

package/es/library/dot/components/form-fields/ephi-tag/frameworks/ui/EPHITag.js

@@ -0,0 +1,10 @@
+import { createCustomComponent } from "../../../../../../custom-component";
+import EPHITagView from "./EPHITagView";
+const EPHITag = createCustomComponent({
+  name: 'EPHITag',
+  View: EPHITagView,
+  properties: {},
+  eventHandlers: {},
+  behaviours: []
+});
+export default EPHITag;

package/es/library/dot/components/form-fields/ephi-tag/frameworks/ui/EPHITagView.js

@@ -0,0 +1,21 @@
+import React from 'react';
+import Tag from '@zohodesk-private/desk-components/es/table/StatusBox/StatusBox'; // @ts-ignore
+
+import style from "./css/EPHITag.module.css";
+
+function EPHITagView(_, ref) {
+  const ephiTooltip = 'ePHI is individually identifiable protected health information sent or stored electronically.';
+  return /*#__PURE__*/React.createElement(Tag, {
+    $customProps_container: {
+      ref
+    },
+    customStyle: {
+      container: style.tag
+    },
+    $ui_color: "green",
+    $i18n_text: 'ePHI',
+    $i18n_tooltip: ephiTooltip
+  });
+}
+
+export default EPHITagView;

package/es/library/dot/components/form-fields/ephi-tag/frameworks/ui/css/EPHITag.module.css

@@ -0,0 +1,3 @@
+.tag {
+    cursor: default
+}

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

@@ -1,3 +1,5 @@
+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 { render, fireEvent, screen, cleanup, waitFor } from '@testing-library/react';
 import '@testing-library/jest-dom/extend-expect';
@@ -17,9 +19,9 @@ export function testEPHIFieldVisibility(Component, props) {
   it('should display ePHI tag for ePHI-enabled fields', () => {
     const {
       getByText
-    } = render( /*#__PURE__*/React.createElement(Component, { ...props,
+    } = render( /*#__PURE__*/React.createElement(Component, _extends({}, props, {
       ePHI: true
-    }));
+    })));
     const ePHITag = getByText('ePHI');
     expect(ePHITag).toBeInTheDocument();
   });
@@ -38,9 +40,9 @@ export function testCommonFieldAttributes(Component, props) {
   it('should display the correct label', () => {
     const {
       getByLabelText
-    } = render( /*#__PURE__*/React.createElement(Component, { ...props,
+    } = render( /*#__PURE__*/React.createElement(Component, _extends({}, props, {
       label: "Test Label"
-    }));
+    })));
     const label = getByLabelText('Test Label');
     expect(label).toBeInTheDocument();
   });
@@ -51,9 +53,9 @@ export function testFieldErrorMessage(Component, props) {
   it('should display the correct error message', () => {
     const {
       getByRole
-    } = render( /*#__PURE__*/React.createElement(Component, { ...props,
+    } = render( /*#__PURE__*/React.createElement(Component, _extends({}, props, {
       errorMessage: "Error occurred"
-    }));
+    })));
     const errorMessage = getByRole('alert');
     expect(errorMessage).toHaveTextContent('Error occurred');
   });
@@ -65,9 +67,9 @@ export function testFieldTooltip(Component, props) {
     const {
       getByText,
       container
-    } = render( /*#__PURE__*/React.createElement(AppContainer, null, /*#__PURE__*/React.createElement(Component, { ...props,
+    } = render( /*#__PURE__*/React.createElement(AppContainer, null, /*#__PURE__*/React.createElement(Component, _extends({}, props, {
       tooltip: tooltipText
-    })));
+    }))));
     const infoIcon = container.querySelector(`[data-title="${tooltipText}"]`);
     expect(infoIcon).toBeInTheDocument();
     fireEvent.mouseEnter(infoIcon);
@@ -86,9 +88,9 @@ export function testRequiredTextKindFieldAttributes(Component, props) {
   it('should be required when required prop is true', () => {
     const {
       getByRole
-    } = render( /*#__PURE__*/React.createElement(Component, { ...props,
+    } = render( /*#__PURE__*/React.createElement(Component, _extends({}, props, {
       required: true
-    }));
+    })));
     const input = getByRole('textbox');
     expect(input).toBeRequired();
   });
@@ -97,9 +99,9 @@ export function testDisabledTextKindFieldAttributes(Component, props) {
   it('should be disabled when disabled prop is true', () => {
     const {
       getByRole
-    } = render( /*#__PURE__*/React.createElement(Component, { ...props,
+    } = render( /*#__PURE__*/React.createElement(Component, _extends({}, props, {
       disabled: true
-    }));
+    })));
     const input = getByRole('textbox');
     expect(input).toBeDisabled();
   });
@@ -108,9 +110,9 @@ export function testReadOnlyTextKindFieldAttributes(Component, props) {
   it('should be readonly when readonly prop is true', () => {
     const {
       getByRole
-    } = render( /*#__PURE__*/React.createElement(Component, { ...props,
+    } = render( /*#__PURE__*/React.createElement(Component, _extends({}, props, {
       readonly: true
-    }));
+    })));
     const input = getByRole('textbox');
     expect(input).toHaveAttribute('readonly');
   });
@@ -145,10 +147,10 @@ export function testFieldValueChange(_ref2) {
     const Parent = createCustomComponent({
       name: 'Parent',
       View: (_, ref) => {
-        return /*#__PURE__*/React.createElement(Component, { ...props,
+        return /*#__PURE__*/React.createElement(Component, _extends({}, props, {
           name: "fieldDetails",
           getRef: ref
-        });
+        }));
       },
       properties: {},
       eventHandlers: {

package/es/library/dot/components/form-fields/index.js

@@ -12,4 +12,5 @@ export { default as Number } from "./number/frameworks/ui/Number";
 export { default as Decimal } from "./decimal/frameworks/ui/Decimal";
 export { default as Date } from "./date/frameworks/ui/Date";
 export { default as DateTime } from "./datetime/frameworks/ui/DateTime";
-export { default as Checkbox } from "./checkbox/frameworks/ui/Checkbox";
+export { default as Checkbox } from "./checkbox/frameworks/ui/Checkbox";
+export { default as LookUp } from "./lookup/frameworks/ui/Lookup";

package/es/library/dot/components/form-fields/info-icon/frameworks/ui/InfoIcon.js

@@ -0,0 +1,10 @@
+import { createCustomComponent } from "../../../../../../custom-component";
+import InfoIconProperties from "../../../../../../../cc/info-icon/Properties";
+import InfoIconView from "./InfoIconView";
+const InfoIcon = createCustomComponent({
+  name: 'InfoIcon',
+  View: InfoIconView,
+  properties: InfoIconProperties,
+  eventHandlers: {}
+});
+export default InfoIcon;

package/es/library/dot/components/form-fields/info-icon/frameworks/ui/InfoIconView.js

@@ -0,0 +1,21 @@
+import React from 'react';
+import ActionIcon from '@zohodesk-private/desk-components/es/ActionIcon/ActionIcon'; // @ts-ignore
+
+import style from "./css/InfoIcon.module.css";
+export default function InfoIconView(_ref, ref) {
+  let {
+    state
+  } = _ref;
+  const {
+    tooltip
+  } = state.properties;
+  return /*#__PURE__*/React.createElement(ActionIcon, {
+    ref: ref,
+    $ui_iconName: "ZD-GN-info",
+    $ui_hoverVariant: "default",
+    $i18n_tooltip: tooltip,
+    customStyle: {
+      icon: style.icon
+    }
+  });
+}

package/es/library/dot/components/form-fields/info-icon/frameworks/ui/css/InfoIcon.module.css

@@ -0,0 +1,3 @@
+.icon {
+    padding: 0 
+}

package/es/library/dot/components/form-fields/lookup/frameworks/ui/EventHandlerFactory.js

@@ -0,0 +1,70 @@
+import { TextBoxConstants } from "../../../../../../../cc/textbox";
+import FieldConstants from "../../../../../../../cc/fields/field/Constants";
+
+class EventHandlersFactory {
+  static create() {
+    return {
+      [TextBoxConstants.TEXTBOX_FOCUSED]: this.handleTextBoxFocused,
+      [TextBoxConstants.TEXTBOX_BLURED]: this.handleTextBoxBlurred,
+      [TextBoxConstants.TEXTBOX_CHANGED]: this.handleTextBoxChanged
+    };
+  }
+
+  static handleTextBoxFocused(_ref) {
+    let {
+      state,
+      dispatch
+    } = _ref;
+    const {
+      name
+    } = state.properties;
+    dispatch({
+      type: FieldConstants.FIELD_FOCUSED,
+      payload: {
+        fieldName: name
+      },
+      metaData: {}
+    });
+  }
+
+  static handleTextBoxBlurred(_ref2) {
+    let {
+      state,
+      dispatch
+    } = _ref2;
+    const {
+      name
+    } = state.properties;
+    dispatch({
+      type: FieldConstants.FIELD_BLURRED,
+      payload: {
+        fieldName: name
+      }
+    });
+  }
+
+  static handleTextBoxChanged(_ref3) {
+    let {
+      state,
+      dispatch,
+      action
+    } = _ref3;
+    const {
+      value
+    } = action.payload;
+    const {
+      name
+    } = state.properties;
+    dispatch({
+      type: FieldConstants.FIELD_CHANGED,
+      payload: {
+        fieldName: name,
+        value
+      },
+      metaData: {}
+    });
+  }
+
+}
+
+export default EventHandlersFactory;

package/es/library/dot/components/form-fields/lookup/frameworks/ui/Lookup.js

@@ -0,0 +1,13 @@
+import { createCustomComponent } from "../../../../../../custom-component";
+import LookupFieldProperties from "../../../../../../../cc/fields/text/Properties";
+import FocusFieldBehaviourFactory from "../../../../../../behaviours/field-focus/frameworks/ui/FocusFieldBehaviourFactory";
+import LookupView from "./LookupView";
+import EventHandlersFactory from "./EventHandlerFactory";
+let Lookup = createCustomComponent({
+  name: 'FormLookUpField',
+  View: LookupView,
+  properties: LookupFieldProperties,
+  eventHandlers: EventHandlersFactory.create(),
+  behaviours: [FocusFieldBehaviourFactory.create()]
+});
+export default Lookup;

package/es/library/dot/components/form-fields/lookup/frameworks/ui/LookupView.js

@@ -0,0 +1,51 @@
+import React from 'react';
+import TextBox from "../../../../../legacy-to-new-arch/textbox/frameworks/ui/TextBox";
+import FieldItem from "../../../field/FieldItem"; // @ts-ignore
+
+import style from "../../../../form/frameworks/ui/css/Form.module.css";
+
+function TextBoxView(_ref, ref) {
+  let {
+    state
+  } = _ref;
+  const {
+    id,
+    label,
+    value,
+    placeholder,
+    errorMessage,
+    disabled,
+    readonly,
+    required,
+    uiConfig,
+    labelActions,
+    actions
+  } = state.properties;
+  const {
+    size,
+    breakRow
+  } = uiConfig;
+  return /*#__PURE__*/React.createElement(FieldItem, {
+    ref: ref,
+    id: id,
+    label: label,
+    labelActions: labelActions,
+    required: required,
+    errorMessage: errorMessage,
+    testId: 'smart_form_field_lookup',
+    size: size,
+    breakRow: breakRow
+  }, /*#__PURE__*/React.createElement("div", {
+    className: style.field
+  }, /*#__PURE__*/React.createElement(TextBox, {
+    id: id,
+    placeholder: placeholder,
+    value: value,
+    required: required,
+    disabled: disabled,
+    readonly: readonly,
+    actions: actions
+  })));
+}
+
+export default TextBoxView;

package/es/library/dot/components/form-fields/multi-select/adapters/presenter/TransformState.js

@@ -0,0 +1,31 @@
+export function TransformState(state) {
+  const {
+    tooltip,
+    ePHI
+  } = state.properties;
+  let actions = [];
+
+  if (tooltip) {
+    actions.push({
+      type: 'InfoIcon',
+      eventMappings: [],
+      properties: {
+        tooltip
+      }
+    });
+  }
+
+  if (ePHI) {
+    actions.push({
+      type: 'EPHITag',
+      properties: {},
+      eventMappings: []
+    });
+  }
+
+  return { ...state,
+    properties: { ...state.properties,
+      actions
+    }
+  };
+}

package/es/library/dot/components/form-fields/number/adapters/presenter/TransformState.js

@@ -0,0 +1,31 @@
+export function TransformState(state) {
+  const {
+    ePHI,
+    tooltip
+  } = state.properties;
+  let actions = [];
+
+  if (tooltip) {
+    actions.push({
+      type: 'InfoIcon',
+      eventMappings: [],
+      properties: {
+        tooltip
+      }
+    });
+  }
+
+  if (ePHI) {
+    actions.push({
+      type: 'EPHITag',
+      properties: {},
+      eventMappings: []
+    });
+  }
+
+  return { ...state,
+    viewModel: { ...state.properties,
+      actions
+    }
+  };
+}

package/es/library/dot/components/form-fields/percentage/adapters/presenter/TransformState.js

@@ -0,0 +1,31 @@
+export function TransformState(state) {
+  const {
+    ePHI,
+    tooltip
+  } = state.properties;
+  let actions = [];
+
+  if (tooltip) {
+    actions.push({
+      type: 'InfoIcon',
+      eventMappings: [],
+      properties: {
+        tooltip
+      }
+    });
+  }
+
+  if (ePHI) {
+    actions.push({
+      type: 'EPHITag',
+      properties: {},
+      eventMappings: []
+    });
+  }
+
+  return { ...state,
+    viewModel: { ...state.properties,
+      actions
+    }
+  };
+}

package/es/library/dot/components/form-fields/phone/adapters/presenter/TransformState.js

@@ -0,0 +1,31 @@
+export function TransformState(state) {
+  const {
+    ePHI,
+    tooltip
+  } = state.properties;
+  let actions = [];
+
+  if (tooltip) {
+    actions.push({
+      type: 'InfoIcon',
+      eventMappings: [],
+      properties: {
+        tooltip
+      }
+    });
+  }
+
+  if (ePHI) {
+    actions.push({
+      type: 'EPHITag',
+      properties: {},
+      eventMappings: []
+    });
+  }
+
+  return { ...state,
+    viewModel: { ...state.properties,
+      actions
+    }
+  };
+}

package/es/library/dot/components/form-fields/pick-list/adapters/presenter/TransformState.js

@@ -0,0 +1,23 @@
+// import TransFormState from '../../adapters/presenter/TransFormState';
+export function TransformState(state) {
+  const {
+    tooltip
+  } = state.properties;
+  let actions = [];
+
+  if (tooltip) {
+    actions.push({
+      type: 'InfoIcon',
+      eventMappings: [],
+      properties: {
+        tooltip
+      }
+    });
+  }
+
+  return { ...state,
+    properties: { ...state.properties,
+      actions
+    }
+  };
+}

package/es/library/dot/components/form-fields/textarea/adapters/presenter/TransformState.js

@@ -0,0 +1,23 @@
+// import TransFormState from '../../adapters/presenter/TransFormState';
+export function TransformState(state) {
+  const {
+    tooltip
+  } = state.properties;
+  let actions = [];
+
+  if (tooltip) {
+    actions.push({
+      type: 'InfoIcon',
+      eventMappings: [],
+      properties: {
+        tooltip
+      }
+    });
+  }
+
+  return { ...state,
+    properties: { ...state.properties,
+      actions
+    }
+  };
+}

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

@@ -18,7 +18,8 @@ function TextAreaView(_ref, ref) {
     readonly,
     required,
     uiConfig,
-    labelActions
+    labelActions,
+    actions
   } = state.properties;
   const {
     size,
@@ -42,7 +43,8 @@ function TextAreaView(_ref, ref) {
     value: value,
     required: required,
     disabled: disabled,
-    readonly: readonly
+    readonly: readonly,
+    actions: actions
   })));
 }
 

package/es/library/dot/components/form-fields/textbox/adapters/presenter/TransformState.js

@@ -0,0 +1,32 @@
+// import TransFormState from '../../adapters/presenter/TransFormState';
+export function TransformState(state) {
+  const {
+    ePHI,
+    tooltip
+  } = state.properties;
+  let actions = [];
+
+  if (tooltip) {
+    actions.push({
+      type: 'InfoIcon',
+      eventMappings: [],
+      properties: {
+        tooltip
+      }
+    });
+  }
+
+  if (ePHI) {
+    actions.push({
+      type: 'EPHITag',
+      properties: {},
+      eventMappings: []
+    });
+  }
+
+  return { ...state,
+    properties: { ...state.properties,
+      actions
+    }
+  };
+}

package/es/library/dot/components/form-fields/url/adapters/presenter/TransformState.js

@@ -0,0 +1,31 @@
+export function TransformState(state) {
+  const {
+    ePHI,
+    tooltip
+  } = state.properties;
+  let actions = [];
+
+  if (tooltip) {
+    actions.push({
+      type: 'InfoIcon',
+      eventMappings: [],
+      properties: {
+        tooltip
+      }
+    });
+  }
+
+  if (ePHI) {
+    actions.push({
+      type: 'EPHITag',
+      properties: {},
+      eventMappings: []
+    });
+  }
+
+  return { ...state,
+    viewModel: { ...state.properties,
+      actions
+    }
+  };
+}