@zohodesk/dot 1.1.0 → 1.2.1

package/lib/v1/NewStar/NewStar.js

@@ -0,0 +1,74 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _icons = require("@zohodesk/icons");
+
+var _Layout = require("@zohodesk/components/lib/Layout");
+
+var _defaultProps = require("../../NewStar/props/defaultProps");
+
+var _propTypes = require("../../NewStar/props/propTypes");
+
+var _NewStarModule = _interopRequireDefault(require("../../NewStar/NewStar.module.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var NewStar = function NewStar(props) {
+  var palette = props.palette,
+      customClass = props.customClass,
+      position = props.position;
+  var alignPosition = {
+    topRight: {
+      className: _NewStarModule["default"].topRight // align: 'right',
+      // alignBox: 'row',
+      // reverse: 'wrap'
+
+    },
+    topLeft: {
+      className: _NewStarModule["default"].topLeft // align: 'left',
+      // alignBox: 'row',
+      // reverse: 'wrap'
+
+    },
+    bottomLeft: {
+      className: _NewStarModule["default"].bottomLeft // align: 'left',
+      // alignBox: 'column-reverse',
+      // reverse: 'wrap'
+
+    },
+    bottomRight: {
+      className: _NewStarModule["default"].bottomRight // align: 'right',
+      // alignBox: 'column',
+      // reverse: 'wrap-reverse'
+
+    }
+  };
+  return /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
+    alignBox: "row",
+    isCover: false,
+    className: "".concat(_NewStarModule["default"].star, " ").concat(alignPosition[position].className, " ").concat(customClass)
+  }, /*#__PURE__*/_react["default"].createElement(_icons.Icon, {
+    name: "ZD-snippetStar",
+    iconClass: "".concat(_NewStarModule["default"][palette], " ").concat(_NewStarModule["default"].starOne),
+    size: "10"
+  }), /*#__PURE__*/_react["default"].createElement(_icons.Icon, {
+    name: "ZD-snippetStar",
+    iconClass: "".concat(_NewStarModule["default"][palette], " ").concat(_NewStarModule["default"].starTwo),
+    size: "10"
+  }), /*#__PURE__*/_react["default"].createElement(_icons.Icon, {
+    name: "ZD-snippetStar",
+    iconClass: "".concat(_NewStarModule["default"][palette], " ").concat(_NewStarModule["default"].starThree),
+    size: "10"
+  }));
+};
+
+NewStar.propTypes = _propTypes.propTypes;
+NewStar.defaultProps = _defaultProps.defaultProps;
+var _default = NewStar;
+exports["default"] = _default;

package/lib/v1/TagWithIcon/TagWithIcon.js

@@ -0,0 +1,53 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = TagWithIcon;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _defaultProps = require("../../TagWithIcon/props/defaultProps");
+
+var _propTypes = require("../../TagWithIcon/props/propTypes");
+
+var _Layout = require("@zohodesk/components/es/Layout");
+
+var _Icon = _interopRequireDefault(require("@zohodesk/icons/es/Icon"));
+
+var _TagWithIconModule = _interopRequireDefault(require("../../TagWithIcon/TagWithIcon.module.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function TagWithIcon(props) {
+  var text = props.text,
+      iconName = props.iconName,
+      iconSize = props.iconSize,
+      palette = props.palette,
+      iconClass = props.iconClass,
+      isBold = props.isBold,
+      size = props.size,
+      dataId = props.dataId,
+      className = props.className,
+      title = props.title;
+  return /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
+    isInline: true,
+    alignBox: "row",
+    align: "vertical",
+    isCover: false,
+    className: "".concat(_TagWithIconModule["default"].wrapper, " ").concat(_TagWithIconModule["default"][palette], " ").concat(_TagWithIconModule["default"][size], " ").concat(className),
+    dataId: dataId,
+    title: title
+  }, iconName ? /*#__PURE__*/_react["default"].createElement(_Icon["default"], {
+    name: iconName,
+    size: iconSize,
+    iconClass: "".concat(text ? _TagWithIconModule["default"].iconSpace : '', " ").concat(iconClass, " ")
+  }) : null, text ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
+    shrink: true,
+    "data-title": text,
+    className: "".concat(_TagWithIconModule["default"].text, " ").concat(_TagWithIconModule["default"][size], "_text ").concat(isBold ? _TagWithIconModule["default"].bold : '')
+  }, text) : null);
+}
+
+TagWithIcon.propTypes = _propTypes.propTypes;
+TagWithIcon.defaultProps = _defaultProps.defaultProps;

package/lib/v1/alert/AlertHeader/AlertHeader.js

@@ -0,0 +1,86 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = AlertHeader;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _defaultProps = require("../../../alert/AlertHeader/props/defaultProps");
+
+var _propTypes = require("../../../alert/AlertHeader/props/propTypes");
+
+var _icons = require("@zohodesk/icons");
+
+var _Layout = require("@zohodesk/components/lib/Layout");
+
+var _Title = _interopRequireDefault(require("../../../lookup/header/Title/Title"));
+
+var _Close = _interopRequireDefault(require("../../../lookup/header/Close/Close"));
+
+var _AlertHeaderModule = _interopRequireDefault(require("../../../alert/AlertHeader/AlertHeader.module.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function AlertHeader(props) {
+  var title = props.title,
+      palette = props.palette,
+      needIcon = props.needIcon,
+      iconType = props.iconType,
+      onClose = props.onClose,
+      iconName = props.iconName,
+      iconSize = props.iconSize,
+      closeTitle = props.closeTitle,
+      children = props.children,
+      breakChildren = props.breakChildren,
+      dataId = props.dataId,
+      iconClass = props.iconClass;
+  var iconObj = {
+    "delete": 'ZD-socialDelete',
+    alert: 'ZD-exclamationThincircle',
+    remoteAssist: 'ZD-taskDemo',
+    splitTicket: 'ZD-splitNew',
+    update: 'ZD-update'
+  };
+  return /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
+    align: "vertical",
+    alignBox: "row",
+    className: "".concat(_AlertHeaderModule["default"].container, " ").concat(_AlertHeaderModule["default"][palette]),
+    isCover: false,
+    wrap: "wrap"
+  }, needIcon ? /*#__PURE__*/_react["default"].createElement("div", {
+    className: _AlertHeaderModule["default"].iconContainer
+  }, /*#__PURE__*/_react["default"].createElement(_icons.Icon, {
+    size: iconSize,
+    name: iconName ? iconName : iconObj[iconType] ? iconObj[iconType] : iconName,
+    iconClass: "".concat(_AlertHeaderModule["default"].iconStyle, " ").concat(iconObj[iconType] && !iconSize ? _AlertHeaderModule["default"]["icon_".concat(iconType)] : '', " ").concat(_AlertHeaderModule["default"]["text_".concat(palette)], " ").concat(iconClass)
+  })) : null, /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
+    flexible: true
+  }, /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
+    alignBox: "row",
+    align: "vertical",
+    wrap: breakChildren ? 'wrap' : null
+  }, /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
+    className: _AlertHeaderModule["default"].title,
+    shrink: true
+  }, /*#__PURE__*/_react["default"].createElement(_Title["default"], {
+    text: title,
+    palette: palette
+  })), children ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
+    adjust: true,
+    flexible: true
+  }, children) : null)), onClose ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, null, /*#__PURE__*/_react["default"].createElement(_Close["default"], {
+    onClose: onClose,
+    title: closeTitle,
+    dataId: "".concat(dataId, "_close")
+  })) : null);
+}
+
+AlertHeader.propTypes = _propTypes.propTypes;
+AlertHeader.defaultProps = _defaultProps.defaultProps; // if (__DOCS__) {
+//   AlertHeader.docs = {
+//     componentGroup: 'AlertHeader',
+//     folderName: 'Alert'
+//   };
+// }

package/lib/v1/alert/AlertLookup/AlertLookup.js

@@ -0,0 +1,118 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = AlertLookup;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _defaultProps = require("../../../alert/AlertLookup/props/defaultProps");
+
+var _propTypes = require("../../../alert/AlertLookup/props/propTypes");
+
+var _Button = _interopRequireDefault(require("@zohodesk/components/lib/Button/Button"));
+
+var _AlertHeader = _interopRequireDefault(require("../AlertHeader/AlertHeader"));
+
+var _Lookup = _interopRequireDefault(require("../../../lookup/Lookup/Lookup"));
+
+var _Section = _interopRequireDefault(require("../../../lookup/Section/Section"));
+
+var _FormAction = _interopRequireDefault(require("../../../FormAction/FormAction"));
+
+var _AlertLookupModule = _interopRequireDefault(require("../../../alert/AlertLookup/AlertLookup.module.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+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); }
+
+function AlertLookup(props) {
+  var isActive = props.isActive,
+      palette = props.palette,
+      size = props.size,
+      type = props.type,
+      title = props.title,
+      message = props.message,
+      confirmationMessage = props.confirmationMessage,
+      submitText = props.submitText,
+      cancelText = props.cancelText,
+      onSubmitClick = props.onSubmitClick,
+      onCancelClick = props.onCancelClick,
+      children = props.children,
+      forwardRef = props.forwardRef,
+      onClose = props.onClose,
+      headerChildren = props.headerChildren,
+      wrapHeader = props.wrapHeader,
+      sectionClassName = props.sectionClassName,
+      dataId = props.dataId,
+      onLookupClick = props.onLookupClick,
+      customClass = props.customClass,
+      needIcon = props.needIcon,
+      iconName = props.iconName,
+      iconClass = props.iconClass,
+      iconSize = props.iconSize,
+      customProps = props.customProps,
+      isHtmlContent = props.isHtmlContent,
+      onEsc = props.onEsc;
+  var _customProps$LookupPr = customProps.LookupProps,
+      LookupProps = _customProps$LookupPr === void 0 ? {} : _customProps$LookupPr,
+      _customProps$AlertHea = customProps.AlertHeaderProps,
+      AlertHeaderProps = _customProps$AlertHea === void 0 ? {} : _customProps$AlertHea,
+      _customProps$PrimaryB = customProps.PrimaryButtonProps,
+      PrimaryButtonProps = _customProps$PrimaryB === void 0 ? {} : _customProps$PrimaryB,
+      _customProps$Secondar = customProps.SecondaryButtonProps,
+      SecondaryButtonProps = _customProps$Secondar === void 0 ? {} : _customProps$Secondar;
+  return /*#__PURE__*/_react["default"].createElement(_Lookup["default"], _extends({
+    needFocusScope: true,
+    onClose: onEsc == 'close' ? onClose : onCancelClick,
+    isActive: isActive,
+    size: size,
+    dataId: dataId,
+    forwardRef: forwardRef,
+    onClick: onLookupClick,
+    customClass: customClass
+  }, LookupProps), /*#__PURE__*/_react["default"].createElement(_AlertHeader["default"], _extends({
+    title: title,
+    palette: palette,
+    iconType: type,
+    needIcon: Boolean(type) || needIcon,
+    onClose: onClose,
+    breakChildren: wrapHeader,
+    iconName: iconName,
+    iconClass: iconClass,
+    iconSize: iconSize
+  }, AlertHeaderProps), headerChildren ? headerChildren() : null), /*#__PURE__*/_react["default"].createElement(_Section["default"], {
+    alignBox: "row",
+    className: _AlertLookupModule["default"].section
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "".concat(_AlertLookupModule["default"].innerSection, " ").concat(sectionClassName)
+  }, children ? children : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, isHtmlContent && message ? /*#__PURE__*/_react["default"].createElement("div", {
+    dangerouslySetInnerHTML: {
+      __html: message
+    }
+  }) : /*#__PURE__*/_react["default"].createElement("div", null, message), confirmationMessage && /*#__PURE__*/_react["default"].createElement("div", {
+    className: _AlertLookupModule["default"].text
+  }, confirmationMessage))), submitText || onSubmitClick || cancelText || onCancelClick ? /*#__PURE__*/_react["default"].createElement(_FormAction["default"], {
+    size: "small",
+    paddingLeftSize: "xsmall"
+  }, /*#__PURE__*/_react["default"].createElement(_Button["default"], _extends({
+    text: submitText,
+    dataId: dataId === 'alertPopup' ? 'alertConfirmButton' : "".concat(dataId, "_confirmButton"),
+    onClick: onSubmitClick,
+    palette: palette === 'primary' ? 'primaryFilled' : 'dangerFilled'
+  }, PrimaryButtonProps)), cancelText && /*#__PURE__*/_react["default"].createElement(_Button["default"], _extends({
+    dataId: dataId === 'alertPopup' ? 'alertCancelButton' : "".concat(dataId, "_cancelButton"),
+    text: cancelText,
+    onClick: onCancelClick,
+    palette: "secondary"
+  }, SecondaryButtonProps))) : null));
+}
+
+AlertLookup.propTypes = _propTypes.propTypes;
+AlertLookup.defaultProps = _defaultProps.defaultProps; // if (__DOCS__) {
+//   AlertLookup.docs = {
+//     componentGroup: 'AlertLookup',
+//     folderName: 'Alert'
+//   };
+// }

package/lib/v1/emptystate/CommonEmptyState/CommonEmptyState.js

@@ -0,0 +1,76 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = CommonEmptyState;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _defaultProps = require("../../../emptystate/CommonEmptyState/props/defaultProps");
+
+var _propTypes = require("../../../emptystate/CommonEmptyState/props/propTypes");
+
+var _Link = _interopRequireDefault(require("../../Link/Link"));
+
+var _CommonEmptyStateModule = _interopRequireDefault(require("../../../emptystate/CommonEmptyState/CommonEmptyState.module.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function CommonEmptyState(props) {
+  var title = props.title,
+      description = props.description,
+      linkDescription = props.linkDescription,
+      linkUrl = props.linkUrl,
+      linkText = props.linkText,
+      linkTarget = props.linkTarget,
+      onUrlClick = props.onUrlClick,
+      getEmptyState = props.getEmptyState,
+      className = props.className,
+      dataId = props.dataId,
+      isFluid = props.isFluid,
+      children = props.children,
+      size = props.size,
+      palette = props.palette,
+      customClass = props.customClass;
+  var _customClass$titleCla = customClass.titleClass,
+      titleClass = _customClass$titleCla === void 0 ? '' : _customClass$titleCla,
+      _customClass$descript = customClass.descriptionClass,
+      descriptionClass = _customClass$descript === void 0 ? '' : _customClass$descript;
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: "".concat(_CommonEmptyStateModule["default"].container, " ").concat(_CommonEmptyStateModule["default"][size], " ").concat(className, " ").concat(!isFluid ? _CommonEmptyStateModule["default"].fluid : '', " ").concat(_CommonEmptyStateModule["default"][palette]),
+    "data-id": dataId,
+    "data-test-id": dataId
+  }, getEmptyState ? getEmptyState() : null, title ? /*#__PURE__*/_react["default"].createElement("div", {
+    className: "".concat(_CommonEmptyStateModule["default"].title, " ").concat(titleClass)
+  }, title) : null, description ? /*#__PURE__*/_react["default"].createElement("div", {
+    className: _CommonEmptyStateModule["default"].linkWrapper
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "".concat(_CommonEmptyStateModule["default"].desc, " ").concat(descriptionClass)
+  }, description), !linkDescription && linkText ? /*#__PURE__*/_react["default"].createElement(_Link["default"], {
+    href: linkUrl,
+    className: _CommonEmptyStateModule["default"].link,
+    target: linkTarget,
+    onClick: onUrlClick,
+    dataId: "".concat(dataId, "_primarylink")
+  }, linkText) : null) : null, linkDescription || !description && !linkDescription && linkText ? /*#__PURE__*/_react["default"].createElement("div", {
+    className: _CommonEmptyStateModule["default"].linkDescWrapper
+  }, linkDescription ? /*#__PURE__*/_react["default"].createElement("span", {
+    className: "".concat(_CommonEmptyStateModule["default"].linkDesc)
+  }, linkDescription) : null, linkText ? /*#__PURE__*/_react["default"].createElement(_Link["default"], {
+    href: linkUrl,
+    className: _CommonEmptyStateModule["default"].link,
+    target: linkTarget,
+    onClick: onUrlClick,
+    dataId: "".concat(dataId, "_secondarylink")
+  }, linkText) : null) : null, children ? /*#__PURE__*/_react["default"].createElement("div", {
+    className: _CommonEmptyStateModule["default"].children
+  }, children) : null);
+}
+
+CommonEmptyState.propTypes = _propTypes.propTypes;
+CommonEmptyState.defaultProps = _defaultProps.defaultProps; // if (__DOCS__) {
+//   CommonEmptyState.docs = {
+//     componentGroup: 'EmptyState'
+//   };
+// }

package/lib/v1/emptystate/EditionPage/EditionPage.js

@@ -0,0 +1,64 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = EditionPage;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _defaultProps = require("../../../emptystate/EditionPage/props/defaultProps");
+
+var _propTypes = require("../../../emptystate/EditionPage/props/propTypes");
+
+var _EmptyCrmPotential = _interopRequireDefault(require("@zohodesk/svg/lib/v1/emptystate/version3/EmptyCrmPotential"));
+
+var _EditionPage = _interopRequireDefault(require("../../../emptystate/EditionPage/EditionPage.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function EditionPage(props) {
+  var title = props.title,
+      subtitle = props.subtitle,
+      information = props.information,
+      dataId = props.dataId,
+      footerText = props.footerText,
+      onButtonClick = props.onButtonClick,
+      butttonText = props.butttonText,
+      children = props.children;
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: _EditionPage["default"].editionContainer,
+    "data-id": dataId,
+    "data-test-id": dataId
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: _EditionPage["default"].svg
+  }, /*#__PURE__*/_react["default"].createElement(_EmptyCrmPotential["default"], null)), /*#__PURE__*/_react["default"].createElement("div", {
+    className: _EditionPage["default"].header
+  }, title), subtitle ? /*#__PURE__*/_react["default"].createElement("div", {
+    className: _EditionPage["default"].description
+  }, subtitle) : null, /*#__PURE__*/_react["default"].createElement("div", {
+    className: _EditionPage["default"].description
+  }, information ? "".concat(information, " ") : null, butttonText ? /*#__PURE__*/_react["default"].createElement("span", {
+    className: _EditionPage["default"].button,
+    "data-id": "".concat(dataId, "_button"),
+    "data-test-id": "".concat(dataId, "_button"),
+    onClick: onButtonClick
+  }, butttonText) : null), children ? /*#__PURE__*/_react["default"].createElement("div", {
+    className: _EditionPage["default"].content
+  }, children) : null, footerText ? /*#__PURE__*/_react["default"].createElement("div", {
+    "data-id": "".concat(dataId, "_footerText"),
+    "data-test-id": "".concat(dataId, "_footerText"),
+    className: _EditionPage["default"].footer
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    dangerouslySetInnerHTML: {
+      __html: footerText
+    }
+  })) : null);
+}
+
+EditionPage.defaultProps = _defaultProps.defaultProps;
+EditionPage.propTypes = _propTypes.propTypes; // if (__DOCS__) {
+//   EditionPage.docs = {
+//     componentGroup: 'EmptyState'
+//   };
+// }

package/lib/v1/lookup/Lookup/Lookup.js

@@ -0,0 +1,130 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = Lookup;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _defaultProps = require("../../../lookup/Lookup/props/defaultProps");
+
+var _propTypes = require("../../../lookup/Lookup/props/propTypes");
+
+var _FreezeLayer = _interopRequireDefault(require("../../../FreezeLayer/FreezeLayer"));
+
+var _Layout = require("@zohodesk/components/lib/Layout");
+
+var _FocusScope = _interopRequireDefault(require("@zohodesk/a11y/es/FocusScope/FocusScope"));
+
+var _LookupModule = _interopRequireDefault(require("../../../lookup/Lookup/Lookup.module.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+/*** Libraries ***/
+
+/*** Components ***/
+
+/*** CSS ***/
+
+/*eslint-disable react/forbid-component-props */
+function Lookup(props) {
+  var isActive = props.isActive,
+      children = props.children,
+      size = props.size,
+      dataId = props.dataId,
+      forwardRef = props.forwardRef,
+      onClick = props.onClick,
+      customClass = props.customClass,
+      htmlId = props.htmlId,
+      a11y = props.a11y,
+      childAnimationName = props.childAnimationName,
+      onClose = props.onClose,
+      needFocusScope = props.needFocusScope,
+      customProps = props.customProps,
+      onKeyDown = props.onKeyDown;
+  var _a11y$role = a11y.role,
+      role = _a11y$role === void 0 ? 'dialog' : _a11y$role,
+      ariaLabelledby = a11y.ariaLabelledby,
+      ariaDescribedby = a11y.ariaDescribedby,
+      _a11y$ariaModal = a11y.ariaModal,
+      ariaModal = _a11y$ariaModal === void 0 ? isActive ? true : undefined : _a11y$ariaModal;
+  var _customProps$focusSco = customProps.focusScopeProps,
+      focusScopeProps = _customProps$focusSco === void 0 ? {} : _customProps$focusSco;
+  var _focusScopeProps$auto = focusScopeProps.autoFocus,
+      autoFocus = _focusScopeProps$auto === void 0 ? true : _focusScopeProps$auto,
+      _focusScopeProps$rest = focusScopeProps.restoreFocus,
+      restoreFocus = _focusScopeProps$rest === void 0 ? true : _focusScopeProps$rest,
+      _focusScopeProps$need = focusScopeProps.needArrowLoop,
+      needArrowLoop = _focusScopeProps$need === void 0 ? false : _focusScopeProps$need,
+      _focusScopeProps$need2 = focusScopeProps.needTabLoop,
+      needTabLoop = _focusScopeProps$need2 === void 0 ? true : _focusScopeProps$need2,
+      _focusScopeProps$enab = focusScopeProps.enableEnterAction,
+      enableEnterAction = _focusScopeProps$enab === void 0 ? false : _focusScopeProps$enab;
+  var createRef = (0, _react.useRef)(null);
+  var handleKeyDown = (0, _react.useCallback)(function (e) {
+    onKeyDown && onKeyDown(e);
+  }, [onKeyDown]);
+  useEffect(function () {
+    if (isActive) {
+      document.addEventListener('keydown', handleKeyDown);
+    } else {
+      document.removeEventListener('keydown', handleKeyDown);
+    }
+  }, [isActive]);
+  useEffect(function () {
+    return function () {
+      document.removeEventListener('keydown', handleKeyDown);
+    };
+  }, []);
+
+  var content = /*#__PURE__*/_react["default"].createElement("div", {
+    ref: createRef,
+    tabIndex: "-1",
+    "data-a11y-need-focus-style": "false",
+    role: role,
+    "aria-labelledby": ariaLabelledby,
+    "aria-describedby": ariaDescribedby,
+    "aria-modal": ariaModal,
+    id: htmlId,
+    className: "".concat(_LookupModule["default"].box, " ").concat(_LookupModule["default"]["".concat(size, "Size")]),
+    "data-id": dataId,
+    "data-test-id": dataId
+  }, children);
+
+  return /*#__PURE__*/_react["default"].createElement(_FreezeLayer["default"], {
+    align: "horizontal",
+    animationName: "fade",
+    childAnimationName: childAnimationName,
+    isActive: isActive,
+    palette: "snow",
+    forwardRef: forwardRef,
+    onClick: onClick,
+    customClass: customClass
+  }, /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
+    alignBox: "row",
+    className: _LookupModule["default"].container,
+    dataId: "fldValue"
+  }, needFocusScope ? /*#__PURE__*/_react["default"].createElement(_FocusScope["default"], {
+    needTabLoop: needTabLoop,
+    needArrowLoop: needArrowLoop,
+    elementRef: createRef,
+    autoFocus: autoFocus,
+    restoreFocus: restoreFocus,
+    onClose: onClose,
+    enableEnterAction: enableEnterAction
+  }, content) : content));
+}
+
+Lookup.propTypes = _propTypes.propTypes;
+Lookup.defaultProps = _defaultProps.defaultProps; // if (__DOCS__) {
+//   Lookup.docs = {
+//     componentGroup: 'Lookup'
+//   };
+// }

package/lib/v1/lookup/header/Close/Close.js

@@ -0,0 +1,47 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _defaultProps = require("../../../../lookup/header/Close/props/defaultProps");
+
+var _propTypes = require("../../../../lookup/header/Close/props/propTypes");
+
+var _IconButton = _interopRequireDefault(require("./../../../IconButton/IconButton"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+/*** Libraries ***/
+
+/*** FontIcons ***/
+function Close(props) {
+  var onClose = props.onClose,
+      dataId = props.dataId,
+      title = props.title;
+  return /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+    dataId: dataId,
+    onClick: onClose,
+    iconName: "ZD-cross",
+    iconSize: "11",
+    title: title
+  });
+}
+
+Close.propTypes = _propTypes.propTypes;
+Close.defaultProps = _defaultProps.defaultProps;
+var MemoizedClose = /*#__PURE__*/(0, _react.memo)(Close);
+MemoizedClose.propTypes = _propTypes.propTypes;
+MemoizedClose.defaultProps = _defaultProps.defaultProps;
+MemoizedClose.displayName = 'Close';
+var _default = MemoizedClose;
+exports["default"] = _default;