@zohodesk/dot 1.0.0-temp-157 → 1.0.0-temp-159

package/lib/v1/list/AvatarFlip/AvatarFlip.js

@@ -0,0 +1,86 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = AvatarFlip;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _defaultProps = require("../../../list/AvatarFlip/props/defaultProps");
+
+var _propTypes = require("../../../list/AvatarFlip/props/propTypes");
+
+var _FlipCard = _interopRequireDefault(require("../../FlipCard/FlipCard"));
+
+var _AvatarFlipModule = _interopRequireDefault(require("../../../list/AvatarFlip/AvatarFlip.module.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function AvatarFlip(props) {
+  var id = props.id,
+      action = props.action,
+      name = props.name,
+      isChecked = props.isChecked,
+      onChange = props.onChange,
+      noNeedFlip = props.noNeedFlip,
+      size = props.size,
+      onClick = props.onClick,
+      isPaidUser = props.isPaidUser,
+      isPortalUser = props.isPortalUser,
+      channel = props.channel,
+      src = props.src,
+      icon = props.icon,
+      initial = props.initial,
+      dataId = props.dataId,
+      className = props.className,
+      palette = props.palette,
+      textPalette = props.textPalette,
+      customTextClass = props.customTextClass,
+      frontClass = props.frontClass,
+      needTitle = props.needTitle,
+      tourId = props.tourId,
+      iconSize = props.iconSize,
+      isFilledCheckbox = props.isFilledCheckbox,
+      channelTitle = props.channelTitle,
+      customProps = props.customProps;
+  return /*#__PURE__*/_react["default"].createElement(_FlipCard["default"], {
+    id: id,
+    action: action,
+    name: name,
+    initial: initial,
+    isChecked: isChecked,
+    onChange: onChange,
+    noNeedFlip: noNeedFlip,
+    size: size,
+    onClick: onClick,
+    isPaidUser: isPaidUser,
+    isPortalUser: isPortalUser,
+    channel: channel,
+    src: src,
+    icon: icon,
+    iconSize: iconSize,
+    iconClass: "".concat(_AvatarFlipModule["default"].iconStyle),
+    dataId: dataId,
+    ticListContainer: "tic-list-filp-cont",
+    ticList: "tic-list-filp",
+    className: className,
+    palette: palette,
+    textPalette: textPalette,
+    customTextClass: customTextClass,
+    frontClass: frontClass,
+    needTitle: needTitle,
+    tourId: tourId,
+    isFilledCheckbox: isFilledCheckbox,
+    channelTitle: channelTitle,
+    customProps: customProps
+  });
+}
+
+AvatarFlip.propTypes = _propTypes.propTypes;
+AvatarFlip.defaultProps = _defaultProps.defaultProps; // if (__DOCS__) {
+//   AvatarFlip.docs = {
+//     folderName: 'List',
+//     componentGroup: 'AvatarFlip'
+//   };
+// }

package/lib/v1/list/BluePrintStatus/BluePrintStatus.js

@@ -0,0 +1,33 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = BluePrintStatus;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = require("../../../list/BluePrintStatus/props/propTypes");
+
+var _BluePrintStatusModule = _interopRequireDefault(require("../../../list/BluePrintStatus/BluePrintStatus.module.css"));
+
+var _icons = require("@zohodesk/icons");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function BluePrintStatus(props) {
+  var title = props.title;
+  return /*#__PURE__*/_react["default"].createElement("span", {
+    className: "".concat(_BluePrintStatusModule["default"].container)
+  }, /*#__PURE__*/_react["default"].createElement(_icons.Icon, {
+    name: "ZD-blueprint",
+    title: title,
+    iconClass: _BluePrintStatusModule["default"].iconStyle
+  }));
+}
+
+BluePrintStatus.propTypes = _propTypes.propTypes; // if (__DOCS__) {
+//   BluePrintStatus.docs = {
+//     componentGroup: 'Atom'
+//   };
+// }

package/lib/v1/list/Comment/Comment.js

@@ -0,0 +1,53 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = Comment;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _defaultProps = require("../../../list/Comment/props/defaultProps");
+
+var _propTypes = require("../../../list/Comment/props/propTypes");
+
+var _icons = require("@zohodesk/icons");
+
+var _i18n = require("@zohodesk/i18n");
+
+var _Button = _interopRequireDefault(require("@zohodesk/components/es/v1/semantic/Button/Button"));
+
+var _CommentModule = _interopRequireDefault(require("../../../list/Comment/Comment.module.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function Comment(props) {
+  var count = props.count,
+      onClick = props.onClick,
+      className = props.className;
+  var i18N = _i18n.i18NProviderUtils.getI18NValue;
+  var commentCount = parseInt(count);
+  var commentTitle = !commentCount ? i18N('tabs.request.comment') : commentCount > 1 ? i18N('support.comment.many', count) : i18N('support.comment.one');
+  return /*#__PURE__*/_react["default"].createElement(_Button["default"], {
+    customClass: "".concat(_CommentModule["default"].container, " ").concat(className, " "),
+    onClick: onClick,
+    dataId: "commentLstContainer",
+    title: commentTitle,
+    a11y: {
+      ariaLabel: commentTitle
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_icons.Icon, {
+    name: "ZD-TK-commentLine",
+    iconClass: _CommentModule["default"].commentIcon
+  }), count && /*#__PURE__*/_react["default"].createElement("span", {
+    className: _CommentModule["default"].count
+  }, count));
+}
+
+Comment.defaultProps = _defaultProps.defaultProps;
+Comment.propTypes = _propTypes.propTypes; // if (__DOCS__) {
+//   Comment.docs = {
+//     folderName: 'List',
+//     componentGroup: 'Comment'
+//   };
+// }

package/lib/v1/list/DepartmentDropDown/DepartmentDropDown.js

@@ -0,0 +1,102 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _defaultProps = require("../../../list/DepartmentDropDown/props/defaultProps");
+
+var _propTypes = require("../../../list/DepartmentDropDown/props/propTypes");
+
+var _ToggleDropDown = _interopRequireDefault(require("../../dropdown/ToggleDropDown/ToggleDropDown"));
+
+var _SecondaryText = require("../SecondaryText");
+
+var _DepartmentDropDownModule = _interopRequireDefault(require("../../../list/DepartmentDropDown/DepartmentDropDown.module.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function DepartmentDropDown(props) {
+  var departmentName = props.departmentName,
+      _props$departmentList = props.departmentList,
+      departmentList = _props$departmentList === void 0 ? [] : _props$departmentList,
+      onSelectLabel = props.onSelectLabel,
+      isEditable = props.isEditable,
+      dataId = props.dataId,
+      isFetching = props.isFetching,
+      isPopupActive = props.isPopupActive,
+      getNextOptions = props.getNextOptions,
+      isNextOptions = props.isNextOptions,
+      onSearch = props.onSearch,
+      needSearchFetching = props.needSearchFetching,
+      searchStr = props.searchStr,
+      i18nKeys = props.i18nKeys,
+      onMoveDepartment = props.onMoveDepartment,
+      getDepartment = props.getDepartment;
+  var _i18nKeys$title = i18nKeys.title,
+      title = _i18nKeys$title === void 0 ? 'Move Department' : _i18nKeys$title,
+      _i18nKeys$searchEmpty = i18nKeys.searchEmptyText,
+      searchEmptyText = _i18nKeys$searchEmpty === void 0 ? 'No results found' : _i18nKeys$searchEmpty,
+      _i18nKeys$searchError = i18nKeys.searchErrorText,
+      searchErrorText = _i18nKeys$searchError === void 0 ? 'No results' : _i18nKeys$searchError,
+      _i18nKeys$placeholder = i18nKeys.placeholder,
+      placeholder = _i18nKeys$placeholder === void 0 ? 'Search Department' : _i18nKeys$placeholder;
+
+  function onClick(e) {
+    if (getDepartment) {
+      getDepartment(e);
+    }
+
+    onSearch('');
+  }
+
+  function handleMoveDepartment(deptId) {
+    onSearch('');
+    onMoveDepartment(deptId);
+  }
+
+  return /*#__PURE__*/_react["default"].createElement(_ToggleDropDown["default"], {
+    title: title,
+    options: departmentList,
+    value: /*#__PURE__*/_react["default"].createElement(_SecondaryText.DepartmentText, {
+      text: departmentName,
+      dataTitle: departmentName
+    }),
+    keyName: "name",
+    idName: "id",
+    onClick: handleMoveDepartment,
+    isArrow: false,
+    isEditable: isEditable,
+    onSelectLabel: onSelectLabel,
+    isPopupActive: isPopupActive,
+    needExternalPopupState: true,
+    isSearch: departmentList.length > 5 || searchStr.length !== 0,
+    boxSize: "small",
+    dataId: dataId,
+    isDataLoaded: !isFetching,
+    isPadding: false,
+    searchErrorText: searchErrorText,
+    searchEmptyHint: searchEmptyText,
+    isNeedEffect: false,
+    className: _DepartmentDropDownModule["default"].departmentBox,
+    placeHolderText: placeholder,
+    getNextOptions: getNextOptions,
+    isNextOptions: isNextOptions,
+    onSearch: onSearch,
+    needSearchFetching: needSearchFetching
+  });
+}
+
+DepartmentDropDown.defaultProps = _defaultProps.defaultProps;
+DepartmentDropDown.propTypes = _propTypes.propTypes;
+var _default = DepartmentDropDown; // if (__DOCS__) {
+//   DepartmentDropDown.docs = {
+//     folderName: 'List',
+//     componentGroup: 'DepartmentDropDown'
+//   };
+// }
+
+exports["default"] = _default;

package/lib/v1/list/Dot/Dot.js

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = Dot;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _defaultProps = require("../../../list/Dot/props/defaultProps");
+
+var _propTypes = require("../../../list/Dot/props/propTypes");
+
+var _DotModule = _interopRequireDefault(require("../../../list/Dot/Dot.module.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function Dot(props) {
+  var className = props.className,
+      spacingType = props.spacingType;
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: "".concat(_DotModule["default"].dot, " ").concat(_DotModule["default"][spacingType], " ").concat(className)
+  }, ".");
+}
+
+Dot.propTypes = _propTypes.propTypes;
+Dot.defaultProps = _defaultProps.defaultProps;

package/lib/v1/list/DotNew/DotNew.js

@@ -0,0 +1,34 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = DotNew;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _defaultProps = require("../../../list/DotNew/props/defaultProps");
+
+var _propTypes = require("../../../list/DotNew/props/propTypes");
+
+var _DotNewModule = _interopRequireDefault(require("../../../list/DotNew/DotNew.module.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function DotNew(props) {
+  var className = props.className,
+      dataTitle = props.dataTitle,
+      size = props.size;
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: "".concat(_DotNewModule["default"].container, " ").concat(_DotNewModule["default"][size], " ").concat(className ? className : ''),
+    "data-title": dataTitle
+  });
+}
+
+DotNew.propTypes = _propTypes.propTypes;
+DotNew.defaultProps = _defaultProps.defaultProps; // if (__DOCS__) {
+//   DotNew.docs = {
+//     folderName: 'List',
+//     componentGroup: 'DotNew'
+//   };
+// }

package/lib/v1/list/GridStencils/GridStencils.js

@@ -0,0 +1,42 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = GridStencils;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = require("../../../list/GridStencils/props/propTypes");
+
+var _GridStencilsModule = _interopRequireDefault(require("../../../list/GridStencils/GridStencils.module.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function GridStencils(props) {
+  var lineBar = props.lineBar,
+      from = props.from,
+      isThreeLayout = props.isThreeLayout,
+      styles = props.styles,
+      order = props.order;
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: from == 'leftPanel' && isThreeLayout ? "".concat(_GridStencilsModule["default"].stenLoading, " ").concat(_GridStencilsModule["default"].threeLayout) : from == 'leftPanel' ? "".concat(_GridStencilsModule["default"].stenLoading, " ").concat(_GridStencilsModule["default"].leftCont) : _GridStencilsModule["default"].stenLoading,
+    style: styles,
+    order: order
+  }, lineBar ? /*#__PURE__*/_react["default"].createElement("div", {
+    className: _GridStencilsModule["default"].stenLoadbody
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "".concat(_GridStencilsModule["default"].lineBar, " ").concat(_GridStencilsModule["default"].stenListBAr)
+  }), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "".concat(_GridStencilsModule["default"].lineBar2, " ").concat(_GridStencilsModule["default"].stenListBAr)
+  }), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "".concat(_GridStencilsModule["default"].lineBar3, " ").concat(_GridStencilsModule["default"].stenListBAr)
+  })) : '');
+}
+
+GridStencils.propTypes = _propTypes.propTypes; // if (__DOCS__) {
+//   GridStencils.docs = {
+//     folderName: 'List',
+//     componentGroup: 'GridStencils'
+//   };
+// }

package/lib/v1/list/Icons/AddNewIcon.js

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = AddNewIcon;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = require("../../../list/Icons/props/propTypes");
+
+var _icons = require("@zohodesk/icons");
+
+var _semanticButtonModule = _interopRequireDefault(require("@zohodesk/components/es/semantic/Button/semanticButton.module.css"));
+
+var _IconsModule = _interopRequireDefault(require("../../../list/Icons/Icons.module.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function AddNewIcon(props) {
+  var onClick = props.onClick,
+      dataId = props.dataId,
+      dataTitle = props.dataTitle,
+      iconClass = props.iconClass,
+      className = props.className;
+  return /*#__PURE__*/_react["default"].createElement("button", {
+    onClick: onClick,
+    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
+  }, /*#__PURE__*/_react["default"].createElement(_icons.Icon, {
+    name: "ZD-SE-addTickets",
+    iconClass: iconClass ? iconClass : ''
+  }));
+}
+
+AddNewIcon.propTypes = _propTypes.AddNewIcon_propTypes;

package/lib/v1/list/Icons/CompleteIcon.js

@@ -0,0 +1,40 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = CompleteIcon;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = require("../../../list/Icons/props/propTypes");
+
+var _icons = require("@zohodesk/icons");
+
+var _semanticButtonModule = _interopRequireDefault(require("@zohodesk/components/es/semantic/Button/semanticButton.module.css"));
+
+var _IconsModule = _interopRequireDefault(require("../../../list/Icons/Icons.module.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function CompleteIcon(props) {
+  var onClick = props.onClick,
+      dataId = props.dataId,
+      dataTitle = props.dataTitle,
+      iconClass = props.iconClass,
+      className = props.className,
+      iconSize = props.iconSize;
+  return /*#__PURE__*/_react["default"].createElement("button", {
+    onClick: onClick,
+    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
+  }, /*#__PURE__*/_react["default"].createElement(_icons.Icon, {
+    name: "ZD-GN-checkbox",
+    iconClass: iconClass ? iconClass : '',
+    size: iconSize
+  }));
+}
+
+CompleteIcon.propTypes = _propTypes.CompleteIcon_propTypes;

package/lib/v1/list/Icons/DeleteIcon.js

@@ -0,0 +1,41 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = DeleteComponent;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = require("../../../list/Icons/props/propTypes");
+
+var _IconsModule = _interopRequireDefault(require("../../../list/Icons/Icons.module.css"));
+
+var _icons = require("@zohodesk/icons");
+
+var _semanticButtonModule = _interopRequireDefault(require("@zohodesk/components/es/semantic/Button/semanticButton.module.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function DeleteComponent(props) {
+  var onClick = props.onClick,
+      dataId = props.dataId,
+      dataTitle = props.dataTitle,
+      iconClass = props.iconClass,
+      iconSize = props.iconSize,
+      className = props.className;
+  return /*#__PURE__*/_react["default"].createElement("button", {
+    onClick: onClick,
+    className: "".concat(_IconsModule["default"].iconStyle, " ").concat(_IconsModule["default"].redHover, " ").concat(className ? className : '', " ").concat(_semanticButtonModule["default"].buttonReset),
+    "data-id": dataId,
+    "data-test-id": dataId,
+    "data-title": dataTitle,
+    "aria-label": dataTitle
+  }, /*#__PURE__*/_react["default"].createElement(_icons.Icon, {
+    name: "ZD-GN-delete",
+    iconClass: iconClass ? iconClass : '',
+    size: iconSize
+  }));
+}
+
+DeleteComponent.propTypes = _propTypes.DeleteComponent_propTypes;

package/lib/v1/list/Icons/EditIcon.js

@@ -0,0 +1,41 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = EditIcon;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = require("../../../list/Icons/props/propTypes");
+
+var _IconsModule = _interopRequireDefault(require("../../../list/Icons/Icons.module.css"));
+
+var _icons = require("@zohodesk/icons");
+
+var _semanticButtonModule = _interopRequireDefault(require("@zohodesk/components/es/semantic/Button/semanticButton.module.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function EditIcon(props) {
+  var onClick = props.onClick,
+      dataId = props.dataId,
+      dataTitle = props.dataTitle,
+      iconClass = props.iconClass,
+      iconSize = props.iconSize,
+      className = props.className;
+  return /*#__PURE__*/_react["default"].createElement("button", {
+    onClick: onClick,
+    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,
+    "aria-label": dataTitle
+  }, /*#__PURE__*/_react["default"].createElement(_icons.Icon, {
+    name: "ZD-GN-edit",
+    iconClass: iconClass ? iconClass : '',
+    size: iconSize
+  }));
+}
+
+EditIcon.propTypes = _propTypes.EditIcon_propTypes;

package/lib/v1/list/Icons/FloatingIcons.js

@@ -0,0 +1,42 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = FloatingIcons;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _defaultProps = require("../../../list/Icons/props/defaultProps");
+
+var _propTypes = require("../../../list/Icons/props/propTypes");
+
+var _IconsModule = _interopRequireDefault(require("../../../list/Icons/Icons.module.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function FloatingIcons(props) {
+  var _props$children = props.children,
+      children = _props$children === void 0 ? [] : _props$children,
+      iconClass = props.iconClass;
+
+  var icons = _react["default"].Children.toArray(children).filter(function (o) {
+    return o;
+  });
+
+  return /*#__PURE__*/_react["default"].createElement("span", {
+    className: "".concat(_IconsModule["default"].container)
+  }, icons.map(function (child) {
+    return /*#__PURE__*/_react["default"].cloneElement(child, {
+      iconClass: iconClass
+    });
+  }));
+}
+
+FloatingIcons.propTypes = _propTypes.FloatingIcons_propTypes;
+FloatingIcons.defaultProps = _defaultProps.FloatingIcons_defaultProps; // if (__DOCS__) {
+//   FloatingIcons.docs = {
+//     folderName: 'List',
+//     componentGroup: 'FloatingIcons'
+//   };
+// }

package/lib/v1/list/Icons/ReadUnreadIcon.js

@@ -0,0 +1,46 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = ReadUnreadIcon;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _defaultProps = require("../../../list/Icons/props/defaultProps");
+
+var _propTypes = require("../../../list/Icons/props/propTypes");
+
+var _icons = require("@zohodesk/icons");
+
+var _semanticButtonModule = _interopRequireDefault(require("@zohodesk/components/es/semantic/Button/semanticButton.module.css"));
+
+var _IconsModule = _interopRequireDefault(require("../../../list/Icons/Icons.module.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function ReadUnreadIcon(props) {
+  var onClick = props.onClick,
+      dataId = props.dataId,
+      dataTitle = props.dataTitle,
+      iconClassName = props.iconClassName,
+      iconClass = props.iconClass,
+      className = props.className,
+      isRead = props.isRead,
+      iconSize = props.iconSize;
+  return /*#__PURE__*/_react["default"].createElement("button", {
+    onClick: onClick,
+    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,
+    "aria-label": dataTitle
+  }, /*#__PURE__*/_react["default"].createElement(_icons.Icon, {
+    name: isRead ? 'ZD-GN-read' : 'ZD-GN-unread',
+    size: iconSize,
+    iconClass: "".concat(iconClassName ? iconClassName : '', " ").concat(iconClass ? iconClass : '')
+  }));
+}
+
+ReadUnreadIcon.defaultProps = _defaultProps.ReadUnreadIcon_defaultProps;
+ReadUnreadIcon.propTypes = _propTypes.ReadUnreadIcon_propTypes;

package/lib/v1/list/Icons/SmartIcon.js

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = SmartIcon;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = require("../../../list/Icons/props/propTypes");
+
+var _IconsModule = _interopRequireDefault(require("../../../list/Icons/Icons.module.css"));
+
+var _icons = require("@zohodesk/icons");
+
+var _semanticButtonModule = _interopRequireDefault(require("@zohodesk/components/es/semantic/Button/semanticButton.module.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function SmartIcon(props) {
+  var onClick = props.onClick,
+      dataId = props.dataId,
+      dataTitle = props.dataTitle,
+      iconClass = props.iconClass,
+      className = props.className;
+  return /*#__PURE__*/_react["default"].createElement("button", {
+    onClick: onClick,
+    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
+  }, /*#__PURE__*/_react["default"].createElement(_icons.Icon, {
+    name: "ZD-TK-peek",
+    iconClass: iconClass ? iconClass : ''
+  }));
+}
+
+SmartIcon.propTypes = _propTypes.SmartIcon_propTypes;