@zohodesk/dot 1.2.0 → 1.2.2

package/lib/list/Icons/SmartIcon.js

@@ -15,6 +15,8 @@ var _IconsModule = _interopRequireDefault(require("./Icons.module.css"));
 
 var _icons = require("@zohodesk/icons");
 
+var _semanticButtonModule = _interopRequireDefault(require("@zohodesk/components/lib/semantic/Button/semanticButton.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); }
@@ -61,12 +63,13 @@ var SmartIcon = /*#__PURE__*/function (_Component) {
           dataTitle = _this$props.dataTitle,
           iconClass = _this$props.iconClass,
           className = _this$props.className;
-      return /*#__PURE__*/_react["default"].createElement("span", {
+      return /*#__PURE__*/_react["default"].createElement("button", {
         onClick: onClick,
-        className: "".concat(_IconsModule["default"].iconStyle, " ").concat(_IconsModule["default"].blueHover, " ").concat(className ? className : ''),
+        className: "".concat(_IconsModule["default"].iconStyle, " ").concat(_IconsModule["default"].blueHover, " ").concat(className ? className : '', "  ").concat(_semanticButtonModule["default"].buttonReset),
         "data-id": dataId,
         "data-test-id": dataId,
-        "data-title": dataTitle
+        "data-title": dataTitle,
+        "aria-label": dataTitle
       }, /*#__PURE__*/_react["default"].createElement(_icons.Icon, {
         name: "ZD-TK-peek",
         iconClass: iconClass ? iconClass : ''

package/lib/list/Icons/props/propTypes.js

@@ -64,9 +64,7 @@ var SmartIcon_propTypes = {
   className: _propTypes["default"].string,
   dataId: _propTypes["default"].string,
   dataTitle: _propTypes["default"].string,
-  features: _propTypes["default"].array,
   iconClass: _propTypes["default"].string,
-  module: _propTypes["default"].string,
   onClick: _propTypes["default"].func
 };
 exports.SmartIcon_propTypes = SmartIcon_propTypes;

package/lib/list/ListLayout/ListLayout.module.css

@@ -1,58 +1,74 @@
 .varClass {
   --listBorder: var(--zdt_listLayout_border)
 }
+
 .container {
   position: relative;
   composes: varClass;
 }
-.listHover:hover, .hoveredStyle{
+
+.listHover:hover, .hoveredStyle, .listHover:focus-within, .hoveredStyle:focus-within {
   background-color: var(--zdt_listLayout_hover_bg);
 }
+
 .active, .active:hover {
   background-color: var(--zdt_listLayout_active_bg);
 }
-.cursorPointer{
+
+.cursorPointer {
   cursor: pointer
 }
+
 /* View */
 .classic .innerContainer {
   min-height: var(--zd_size70) ;
   padding: var(--zd_size13) 0 ;
 }
+
 .compact .innerContainer {
   min-height: var(--zd_size41) ;
   padding: var(--zd_size5) 0 ;
 }
+
 .superCompact .innerContainer {
   min-height: var(--zd_size35) ;
   padding: var(--zd_size2) 0 ;
 }
+
 .compact .innerContainer, .classic .innerContainer, .superCompact .innerContainer {
   border-bottom: 1px dotted var(--listBorder);
 }
+
 [dir=ltr] .compact, [dir=ltr] .classic, [dir=ltr] .superCompact {
   border-left: var(--zd_size2) solid transparent;
 }
+
 [dir=rtl] .compact, [dir=rtl] .classic, [dir=rtl] .superCompact {
   border-right: var(--zd_size2) solid transparent;
 }
-[dir=ltr] .keyboardActive, [dir=ltr] .active{
+
+[dir=ltr] .keyboardActive, [dir=ltr] .active {
   border-top-left-radius: var(--zd_size5);
   border-bottom-left-radius: var(--zd_size5);
 }
-[dir=rtl] .keyboardActive, [dir=rtl] .active{
+
+[dir=rtl] .keyboardActive, [dir=rtl] .active {
   border-top-right-radius: var(--zd_size5);
   border-bottom-right-radius: var(--zd_size5);
 }
-[dir=ltr] .keyboardActive{
+
+[dir=ltr] .keyboardActive {
   border-left-color: var(--zdt_listLayout_keyboard_active_border);
 }
-[dir=rtl] .keyboardActive{
+
+[dir=rtl] .keyboardActive {
   border-right-color: var(--zdt_listLayout_keyboard_active_border);
 }
-[dir=ltr] .active{
+
+[dir=ltr] .active {
   border-left-color: var(--zdt_listLayout_active_border);
 }
-[dir=rtl] .active{
+
+[dir=rtl] .active {
   border-right-color: var(--zdt_listLayout_active_border);
 }

package/lib/list/SecondaryText/props/propTypes.js

@@ -41,7 +41,6 @@ var ContactName_propTypes = {
   isPaidUser: _propTypes["default"].bool,
   notAccessible: _propTypes["default"].bool,
   onClick: _propTypes["default"].func,
-  sentimentTitle: _propTypes["default"].string,
   sentimentType: _propTypes["default"].oneOf(['positive', 'negative', 'neutral']),
   text: _propTypes["default"].string,
   urlData: _propTypes["default"].object,

package/lib/list/UserTime/props/propTypes.js

@@ -20,6 +20,10 @@ var propTypes = {
   later: _propTypes["default"].string,
   textClass: _propTypes["default"].string,
   title: _propTypes["default"].string,
-  to: _propTypes["default"].string
+  to: _propTypes["default"].string,
+  type: _propTypes["default"].string,
+  page: _propTypes["default"].string,
+  isNeedTime: _propTypes["default"].bool,
+  isOverdue: _propTypes["default"].bool
 };
 exports.propTypes = propTypes;

package/lib/list/listCommon.module.css

@@ -2,59 +2,77 @@
   display: inline-block;
   vertical-align: middle;
 }
+
 .inlineFlex {
   composes: dInflex alignVertical from '~@zohodesk/components/lib/common/common.module.css';
 }
+
 [dir=ltr] .avatarMargin {
   margin-right: var(--zd_size25) ;
 }
+
 [dir=rtl] .avatarMargin {
   margin-left: var(--zd_size25) ;
 }
+
 .subject {
   composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
   font-size: var(--zd_font_size16) ;
 }
+
 .secondaryPanel {
   line-height: var(--zd_size18);
   composes: dflex alignVertical flexwrap from '~@zohodesk/components/lib/common/common.module.css';
 }
+
 .statusColumn {
   composes: inlineBlockMiddle;
 }
+
 [dir=ltr] .statusColumn {
   text-align: right;
 }
+
 [dir=rtl] .statusColumn {
   text-align: left;
 }
+
 .classic .floatingIconContainer {
   display: none;
 }
+
 .compact .floatingIconContainer,
 .superCompact .floatingIconContainer,
 .listContainer:hover .classic .floatingIconContainer,
-.hoveredStyle .classic .floatingIconContainer {
+.hoveredStyle .classic .floatingIconContainer,
+.compact:focus-within .floatingIconContainer,
+.superCompact:focus-within .floatingIconContainer,
+.listContainer:focus-within .classic .floatingIconContainer,
+.hoveredStyle .classic:focus-within .floatingIconContainer {
   display: inline-flex;
   align-items: center;
 }
+
 .compact .floatingIconContainer,
 .superCompact .floatingIconContainer {
   opacity: 0;
   visibility: hidden;
 }
+
 .floatingIcons {
   font-size: var(--zd_font_size15) ;
 }
-.listContainer, .listLayoutContainer {
+
+.listContainer,
+.listLayoutContainer {
   position: relative;
   transition: var(--zd_transition3) all ease;
 }
+
 .listContainer:hover .compact .floatingIconContainer,
 .listContainer:hover .superCompact .floatingIconContainer,
 .hoveredStyle .compact .floatingIconContainer,
-.hoveredStyle .superCompact .floatingIconContainer 
- {
+.hoveredStyle .superCompact .floatingIconContainer {
   opacity: 1;
   visibility: visible;
-}
+}

package/lib/list/status/StatusDropdown/StatusDropdown.js

@@ -378,7 +378,13 @@ var StatusDropdown = /*#__PURE__*/function (_React$Component) {
           needExternalPopupState = _this$props7$needExte === void 0 ? false : _this$props7$needExte,
           _this$props7$isPopupA = _this$props7.isPopupActive,
           isPopupActive = _this$props7$isPopupA === void 0 ? false : _this$props7$isPopupA,
-          needMultiLineText = _this$props7.needMultiLineText;
+          needMultiLineText = _this$props7.needMultiLineText,
+          _this$props7$a11y = _this$props7.a11y,
+          a11y = _this$props7$a11y === void 0 ? {} : _this$props7$a11y;
+      var _a11y$tabIndex = a11y.tabIndex,
+          tabIndex = _a11y$tabIndex === void 0 ? 0 : _a11y$tabIndex,
+          ariaLabelledby = a11y.ariaLabelledby,
+          ariaLabel = a11y.ariaLabel;
       var isPopupOpen = needExternalPopupState ? isPopupActive && isOpen : isOpen;
       var searchString = this.state.searchString;
       var containerClass = "".concat(className ? className : '', " ").concat(isPopupReady ? activeStyle ? activeStyle : '' : showIconOnHover ? _StatusDropdownModule["default"].hoverIcon : '', " ").concat(isDisabled ? _commonModule["default"].disabled : isReadOnly ? _StatusDropdownModule["default"].readOnly : !isEditable ? _StatusDropdownModule["default"].cursorDefault : !showOnHover ? "".concat(_StatusDropdownModule["default"].cursor, " ").concat(hoverStyle ? hoverStyle : '') : "".concat(hoverStyle ? hoverStyle : '', " ").concat(_StatusDropdownModule["default"].cursorDefault));
@@ -399,7 +405,11 @@ var StatusDropdown = /*#__PURE__*/function (_React$Component) {
         onClick: removeClose,
         disabled: isDisabled || isReadOnly ? true : false,
         "aria-haspopup": true,
-        "aria-expanded": isPopupOpen && isEditable ? true : false
+        "aria-expanded": isPopupOpen && isEditable ? true : false,
+        tabIndex: tabIndex,
+        "aria-labelledby": ariaLabelledby,
+        "aria-label": ariaLabel,
+        "aria-disabled": isDisabled || isReadOnly
       }, isEditable ? /*#__PURE__*/_react["default"].createElement("div", {
         className: _StatusDropdownModule["default"].hiddenInput
       }, /*#__PURE__*/_react["default"].createElement(_TextBox["default"], {

package/lib/list/status/StatusDropdown/props/propTypes.js

@@ -30,5 +30,5 @@ var propTypes = (_propTypes = {
   idName: _propTypes2["default"].string,
   isArrow: _propTypes2["default"].bool,
   isDataLoaded: _propTypes2["default"].bool
-}, _defineProperty(_propTypes, "isDataLoaded", _propTypes2["default"].bool), _defineProperty(_propTypes, "isDisabled", _propTypes2["default"].bool), _defineProperty(_propTypes, "isEditable", _propTypes2["default"].bool), _defineProperty(_propTypes, "isNextOptions", _propTypes2["default"].bool), _defineProperty(_propTypes, "isPopupActive", _propTypes2["default"].bool), _defineProperty(_propTypes, "isPopupOpen", _propTypes2["default"].bool), _defineProperty(_propTypes, "isPopupReady", _propTypes2["default"].bool), _defineProperty(_propTypes, "isReadOnly", _propTypes2["default"].bool), _defineProperty(_propTypes, "isSearch", _propTypes2["default"].bool), _defineProperty(_propTypes, "keyName", _propTypes2["default"].string), _defineProperty(_propTypes, "left", _propTypes2["default"].number), _defineProperty(_propTypes, "needExternalPopupState", _propTypes2["default"].bool), _defineProperty(_propTypes, "needResponsive", _propTypes2["default"].bool), _defineProperty(_propTypes, "needTick", _propTypes2["default"].bool), _defineProperty(_propTypes, "onClick", _propTypes2["default"].func), _defineProperty(_propTypes, "onTogglePopup", _propTypes2["default"].func), _defineProperty(_propTypes, "options", _propTypes2["default"].array.isRequired), _defineProperty(_propTypes, "placeHolderText", _propTypes2["default"].string), _defineProperty(_propTypes, "position", _propTypes2["default"].string), _defineProperty(_propTypes, "removeClose", _propTypes2["default"].func), _defineProperty(_propTypes, "right", _propTypes2["default"].number), _defineProperty(_propTypes, "searchBoxSize", _propTypes2["default"].oneOf(['small', 'medium', 'xmedium'])), _defineProperty(_propTypes, "searchEmptyHint", _propTypes2["default"].string), _defineProperty(_propTypes, "searchErrorText", _propTypes2["default"].string), _defineProperty(_propTypes, "showIconOnHover", _propTypes2["default"].bool), _defineProperty(_propTypes, "showOnHover", _propTypes2["default"].bool), _defineProperty(_propTypes, "statusColor", _propTypes2["default"].string), _defineProperty(_propTypes, "targetAlign", _propTypes2["default"].oneOf(['vertical', 'horizontal', 'both', 'top', 'right', 'bottom', 'left', 'between', 'around'])), _defineProperty(_propTypes, "title", _propTypes2["default"].string), _defineProperty(_propTypes, "togglePopup", _propTypes2["default"].func), _defineProperty(_propTypes, "value", _propTypes2["default"].node), _defineProperty(_propTypes, "needMultiLineText", _propTypes2["default"].bool), _propTypes);
+}, _defineProperty(_propTypes, "isDataLoaded", _propTypes2["default"].bool), _defineProperty(_propTypes, "isDisabled", _propTypes2["default"].bool), _defineProperty(_propTypes, "isEditable", _propTypes2["default"].bool), _defineProperty(_propTypes, "isNextOptions", _propTypes2["default"].bool), _defineProperty(_propTypes, "isPopupActive", _propTypes2["default"].bool), _defineProperty(_propTypes, "isPopupOpen", _propTypes2["default"].bool), _defineProperty(_propTypes, "isPopupReady", _propTypes2["default"].bool), _defineProperty(_propTypes, "isReadOnly", _propTypes2["default"].bool), _defineProperty(_propTypes, "isSearch", _propTypes2["default"].bool), _defineProperty(_propTypes, "keyName", _propTypes2["default"].string), _defineProperty(_propTypes, "left", _propTypes2["default"].number), _defineProperty(_propTypes, "needExternalPopupState", _propTypes2["default"].bool), _defineProperty(_propTypes, "needResponsive", _propTypes2["default"].bool), _defineProperty(_propTypes, "needTick", _propTypes2["default"].bool), _defineProperty(_propTypes, "onClick", _propTypes2["default"].func), _defineProperty(_propTypes, "onTogglePopup", _propTypes2["default"].func), _defineProperty(_propTypes, "options", _propTypes2["default"].array.isRequired), _defineProperty(_propTypes, "placeHolderText", _propTypes2["default"].string), _defineProperty(_propTypes, "position", _propTypes2["default"].string), _defineProperty(_propTypes, "removeClose", _propTypes2["default"].func), _defineProperty(_propTypes, "right", _propTypes2["default"].number), _defineProperty(_propTypes, "searchBoxSize", _propTypes2["default"].oneOf(['small', 'medium', 'xmedium'])), _defineProperty(_propTypes, "searchEmptyHint", _propTypes2["default"].string), _defineProperty(_propTypes, "searchErrorText", _propTypes2["default"].string), _defineProperty(_propTypes, "showIconOnHover", _propTypes2["default"].bool), _defineProperty(_propTypes, "showOnHover", _propTypes2["default"].bool), _defineProperty(_propTypes, "statusColor", _propTypes2["default"].string), _defineProperty(_propTypes, "targetAlign", _propTypes2["default"].oneOf(['vertical', 'horizontal', 'both', 'top', 'right', 'bottom', 'left', 'between', 'around'])), _defineProperty(_propTypes, "title", _propTypes2["default"].string), _defineProperty(_propTypes, "togglePopup", _propTypes2["default"].func), _defineProperty(_propTypes, "value", _propTypes2["default"].node), _defineProperty(_propTypes, "needMultiLineText", _propTypes2["default"].bool), _defineProperty(_propTypes, "onSelectLabel", _propTypes2["default"].func), _defineProperty(_propTypes, "top", _propTypes2["default"].number), _propTypes);
 exports.propTypes = propTypes;

package/lib/lookup/Lookup/Lookup.js

@@ -105,6 +105,7 @@ var Lookup = /*#__PURE__*/function (_Component) {
           role = _a11y$role === void 0 ? 'dialog' : _a11y$role,
           ariaLabelledby = a11y.ariaLabelledby,
           ariaDescribedby = a11y.ariaDescribedby,
+          ariaLabel = a11y.ariaLabel,
           _a11y$ariaModal = a11y.ariaModal,
           ariaModal = _a11y$ariaModal === void 0 ? isActive ? true : undefined : _a11y$ariaModal;
       var _customProps$focusSco = customProps.focusScopeProps,
@@ -127,6 +128,7 @@ var Lookup = /*#__PURE__*/function (_Component) {
         role: role,
         "aria-labelledby": ariaLabelledby,
         "aria-describedby": ariaDescribedby,
+        "aria-label": ariaLabel,
         "aria-modal": ariaModal,
         id: htmlId,
         className: "".concat(_LookupModule["default"].box, " ").concat(_LookupModule["default"]["".concat(size, "Size")]),

package/lib/lookup/Lookup/props/propTypes.js

@@ -25,6 +25,9 @@ var propTypes = {
   onKeyDown: _propTypes["default"].func,
   childAnimationName: _propTypes["default"].oneOf(['expand', 'flyDown']),
   needFocusScope: _propTypes["default"].bool,
-  customProps: _propTypes["default"].object
+  customProps: _propTypes["default"].object,
+  forwardRef: _propTypes["default"].object,
+  onClick: _propTypes["default"].func,
+  onClose: _propTypes["default"].func
 };
 exports.propTypes = propTypes;

package/lib/lookup/header/ViewDropDown/props/propTypes.js

@@ -12,27 +12,22 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "d
 var propTypes = {
   emptyMessage: _propTypes["default"].string,
   needSearch: _propTypes["default"].bool,
-  onChange: _propTypes["default"].func.isRequired,
-  options: _propTypes["default"].oneOfType([_propTypes["default"].arrayOf(_propTypes["default"].string), _propTypes["default"].arrayOf(_propTypes["default"].shape({
-    id: _propTypes["default"].string,
-    text: _propTypes["default"].string
-  }))]).isRequired,
   searchBoxPlaceHolder: _propTypes["default"].string,
   searchEmptyMessage: _propTypes["default"].string,
-  selectedValue: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
-  valueField: _propTypes["default"].string,
-  textField: _propTypes["default"].string,
-  needLocalSearch: _propTypes["default"].bool,
   dropBoxSize: _propTypes["default"].oneOf(['small', 'medium', 'large']),
 
   /**** Popup props ****/
   isPopupOpen: _propTypes["default"].bool,
   isPopupReady: _propTypes["default"].bool,
-  togglePopup: _propTypes["default"].func,
   removeClose: _propTypes["default"].func,
   closePopupOnly: _propTypes["default"].func,
   position: _propTypes["default"].string,
   getTargetRef: _propTypes["default"].func,
-  getContainerRef: _propTypes["default"].func
+  getContainerRef: _propTypes["default"].func,
+  defaultDropBoxPosition: _propTypes["default"].string,
+  animationStyle: _propTypes["default"].string,
+  searchBoxSize: _propTypes["default"].string,
+  searchBoxVariant: _propTypes["default"].string,
+  maxLength: _propTypes["default"].string
 };
 exports.propTypes = propTypes;

package/lib/setup/table/TableHead/props/propTypes.js

@@ -13,6 +13,7 @@ var propTypes = {
   children: _propTypes["default"].element,
   className: _propTypes["default"].string,
   onMouseEnter: _propTypes["default"].func,
-  onMouseLeave: _propTypes["default"].func
+  onMouseLeave: _propTypes["default"].func,
+  dataId: _propTypes["default"].string
 };
 exports.propTypes = propTypes;

package/lib/v1/ChannelIcon/ChannelIcon.js

@@ -0,0 +1,113 @@
+"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 _icons = require("@zohodesk/icons");
+
+var _Avatar = _interopRequireDefault(require("@zohodesk/components/lib/Avatar/Avatar"));
+
+var _AvatarIcon = _interopRequireDefault(require("../../avatar/AvatarIcon/AvatarIcon"));
+
+var _defaultProps = require("../../ChannelIcon/props/defaultProps");
+
+var _propTypes = require("../../ChannelIcon/props/propTypes");
+
+var _ChannelIconMapping = require("../../utils/ChannelIconMapping");
+
+var _ChannelIconModule = _interopRequireDefault(require("../../ChannelIcon/ChannelIcon.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; }
+
+var ChannelIcon = function ChannelIcon(props) {
+  var name = props.name,
+      action = props.action,
+      iconSize = props.iconSize,
+      iconTitle = props.iconTitle,
+      size = props.size,
+      topicIcon = props.topicIcon,
+      topicIconTitle = props.topicIconTitle,
+      topicIconSize = props.topicIconSize,
+      topicIconColor = props.topicIconColor,
+      iconClass = props.iconClass,
+      dataId = props.dataId,
+      className = props.className,
+      palette = props.palette,
+      textPalette = props.textPalette,
+      customTextClass = props.customTextClass,
+      iconColor = props.iconColor,
+      needTopicBorder = props.needTopicBorder,
+      topicClass = props.topicClass,
+      renderIconOnly = props.renderIconOnly,
+      iconName = props.iconName,
+      title = props.title,
+      dataSelectorId = props.dataSelectorId;
+  var defaultChannelObj = name && !iconName && (0, _ChannelIconMapping.getChannelMappingObj)()[name.toUpperCase()];
+  var customizedChannelName = null;
+
+  if (!defaultChannelObj) {
+    customizedChannelName = name;
+  } else {
+    iconName = defaultChannelObj[action];
+  }
+
+  return /*#__PURE__*/_react["default"].createElement("span", {
+    className: _ChannelIconModule["default"].container,
+    "data-selector-id": dataSelectorId
+  }, customizedChannelName ? /*#__PURE__*/_react["default"].createElement(_Avatar["default"], {
+    name: customizedChannelName,
+    size: size,
+    palette: palette,
+    textPalette: textPalette,
+    customClass: customTextClass,
+    dataId: dataId,
+    needTitle: title,
+    title: title
+  }) : !renderIconOnly ? iconName ? /*#__PURE__*/_react["default"].createElement(_AvatarIcon["default"], {
+    name: iconName,
+    iconSize: iconSize,
+    size: size,
+    iconClass: "".concat(_ChannelIconModule["default"].iconStyle, " ").concat(name && action ? _ChannelIconModule["default"]["".concat(name.toLowerCase(), "_").concat(action.toLowerCase())] : '', " ").concat(iconClass ? iconClass : '', " "),
+    dataId: dataId,
+    className: className,
+    iconColor: iconColor,
+    title: iconTitle
+  }) : /*#__PURE__*/_react["default"].createElement(_Avatar["default"], {
+    name: name,
+    size: size,
+    palette: palette,
+    textPalette: textPalette,
+    customClass: customTextClass,
+    needTitle: title,
+    title: title
+  }) : /*#__PURE__*/_react["default"].createElement(_icons.Icon, {
+    name: iconName,
+    size: iconSize,
+    iconClass: "".concat(iconClass ? iconClass : '', " ").concat(_ChannelIconModule["default"].iconStyle, " ").concat(name && action ? _ChannelIconModule["default"]["".concat(name.toLowerCase(), "_").concat(action.toLowerCase())] : ''),
+    title: iconTitle,
+    dataId: dataId
+  }), topicIcon ? /*#__PURE__*/_react["default"].createElement("span", {
+    className: "".concat(_ChannelIconModule["default"].thread, " ").concat(needTopicBorder ? _ChannelIconModule["default"].threadBorder : '', " ").concat(topicClass ? topicClass : ''),
+    "data-title": topicIconTitle
+  }, /*#__PURE__*/_react["default"].createElement(_icons.Icon, {
+    name: topicIcon,
+    size: topicIconSize,
+    iconClass: _ChannelIconModule["default"]["topic_".concat(topicIconColor)] ? "".concat(_ChannelIconModule["default"].topicIcon, " ").concat(_ChannelIconModule["default"]["topic_".concat(topicIconColor)]) : '',
+    dataId: dataId
+  })) : null);
+};
+
+ChannelIcon.defaultProps = _defaultProps.defaultProps;
+ChannelIcon.propTypes = _propTypes.propTypes;
+var _default = ChannelIcon;
+exports["default"] = _default;

package/lib/v1/ExternalLink/ExternalLink.js

@@ -0,0 +1,57 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _defaultProps = require("../../ExternalLink/props/defaultProps");
+
+var _propTypes = require("../../ExternalLink/props/propTypes");
+
+var _ExternalLinkModule = _interopRequireDefault(require("../../ExternalLink/ExternalLink.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); }
+
+var ExternalLink = function ExternalLink(props) {
+  var href = props.href,
+      title = props.title,
+      target = props.target,
+      className = props.className,
+      children = props.children,
+      rel = props.rel,
+      dataId = props.dataId,
+      onClick = props.onClick,
+      customProps = props.customProps;
+
+  var addHttp = function addHttp(url) {
+    var regEx = new RegExp(/(^(ftp|https|mailto|tel|http|simplehelp|dynamicsnav?):)/i);
+
+    if (!regEx.test(url)) {
+      return "http://".concat(url);
+    }
+
+    return url;
+  };
+
+  var urlOutput = href && typeof href !== 'boolean' ? addHttp(String(href)) : 'javascript:void(0);';
+  return /*#__PURE__*/_react["default"].createElement("a", _extends({
+    href: urlOutput,
+    target: target,
+    className: "".concat(_ExternalLinkModule["default"].link, " ").concat(className ? className : ''),
+    "data-title": title,
+    rel: rel,
+    "data-id": dataId,
+    "data-test-id": dataId,
+    onClick: onClick
+  }, customProps), children);
+};
+
+ExternalLink.defaultProps = _defaultProps.defaultProps;
+ExternalLink.propTypes = _propTypes.propTypes;
+var _default = ExternalLink;
+exports["default"] = _default;

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/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;