@zohodesk/dot 1.0.0-beta.234 → 1.0.0-beta.235

package/es/dropdown/ToggleDropDown/ToggleDropDown.js

@@ -1,7 +1,10 @@
-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 "core-js/modules/es.array.includes";
+
+function _extends() { _extends = Object.assign || 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, { Component, Fragment } from 'react';
-import PropTypes from 'prop-types';
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
 import Icon from '@zohodesk/icons/lib/Icon';
 import Popup from '@zohodesk/components/lib/Popup/Popup';
 import { Box, Container } from '@zohodesk/components/lib/Layout';
@@ -833,99 +836,8 @@ export class ToggleDropDown extends Component {
   }
 
 }
-ToggleDropDown.defaultProps = {
-  keyName: 'value',
-  idName: 'id',
-  isArrow: true,
-  searchBoxSize: 'small',
-  isDisabled: false,
-  showIconOnHover: false,
-  showOnHover: false,
-  isReadOnly: false,
-  isEditable: true,
-  isDataLoaded: true,
-  needTick: true,
-  needResponsive: true,
-  arrowIconPosition: 'default',
-  groupOptionsKey: 'items',
-  groupNameKey: 'name',
-  isPadding: true,
-  isToggleStateNeeded: false,
-  isNeedEffect: true,
-  hoverType: 'default',
-  needExternalPopupState: false,
-  customProps: {},
-  preventPopupClose: false
-};
-ToggleDropDown.propTypes = {
-  activeStyle: PropTypes.string,
-  arrowIconPosition: PropTypes.oneOf(['default', 'overlay']),
-  bottom: PropTypes.number,
-  boxPosition: PropTypes.oneOf(['bottomRight', 'bottomLeft', 'bottomCenter', 'topRight', 'topLeft', 'topCenter', 'rightTop', 'rightBottom', 'rightCenter', 'leftTop', 'leftBottom', 'leftCenter']),
-  boxSize: PropTypes.oneOf(['xsmall', 'small', 'medium', 'mlarge', 'large']),
-  children: PropTypes.node,
-  className: PropTypes.string,
-  dataId: PropTypes.string,
-  dataTitle: PropTypes.string,
-  getContainerRef: PropTypes.func,
-  getNextOptions: PropTypes.func,
-  getTargetRef: PropTypes.func,
-  groupNameKey: PropTypes.string,
-  groupOptionsKey: PropTypes.string,
-  hoverStyle: PropTypes.string,
-  hoverType: PropTypes.oneOf(['default', 'border', 'bg']),
-  iconName: PropTypes.string,
-  iconSize: PropTypes.string,
-  idName: PropTypes.string,
-  isArrow: PropTypes.bool,
-  isDataLoaded: PropTypes.bool,
-  isDisabled: PropTypes.bool,
-  isEditable: PropTypes.bool,
-  isGroupDropDown: PropTypes.bool,
-  isNeedEffect: PropTypes.bool,
-  isNextOptions: PropTypes.bool,
-  isPadding: PropTypes.bool,
-  isPopupActive: PropTypes.bool,
-  isPopupOpen: PropTypes.bool,
-  isPopupReady: PropTypes.bool,
-  isReadOnly: PropTypes.bool,
-  isSearch: PropTypes.bool,
-  isToggleStateNeeded: PropTypes.bool,
-  keyName: PropTypes.string,
-  left: PropTypes.number,
-  needExternalPopupState: PropTypes.bool,
-  needResponsive: PropTypes.bool,
-  needSearchFetching: PropTypes.bool,
-  needTick: PropTypes.bool,
-  onClick: PropTypes.func,
-  onSearch: PropTypes.func,
-  options: PropTypes.array.isRequired,
-  palette: PropTypes.oneOf(['dark']),
-  placeHolderText: PropTypes.string,
-  position: PropTypes.string,
-  removeClose: PropTypes.func,
-  right: PropTypes.number,
-  searchBoxSize: PropTypes.oneOf(['small', 'medium', 'xmedium']),
-  searchEmptyHint: PropTypes.string,
-  searchErrorText: PropTypes.string,
-  selectedId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  showIconOnHover: PropTypes.bool,
-  showOnHover: PropTypes.bool,
-  title: PropTypes.string,
-  togglePopup: PropTypes.func,
-  value: PropTypes.node,
-  onDropDownOpen: PropTypes.func,
-  onDropDownClose: PropTypes.func,
-  getFooter: PropTypes.func,
-  customProps: PropTypes.shape({
-    ToggleDropDownProps: PropTypes.object,
-    DropBoxProps: PropTypes.object,
-    TextBoxIconProps: PropTypes.object,
-    ListItemWithIconProps: PropTypes.object,
-    ListItemProps: PropTypes.object
-  }),
-  preventPopupClose: PropTypes.bool
-};
+ToggleDropDown.defaultProps = defaultProps;
+ToggleDropDown.propTypes = propTypes;
 
 if (false) {
   ToggleDropDown.docs = {

package/es/dropdown/ToggleDropDown/ToggleDropDown.module.css

@@ -12,23 +12,16 @@
 .title {
   padding-top: var(--zd_size6);
 }
-[dir=ltr] .default_arrow, [dir=ltr] .overlay_arrow {
+.default_arrow,
+.overlay_arrow {
   padding: 0 0 0 var(--zd_size5);
 }
-[dir=rtl] .default_arrow, [dir=rtl] .overlay_arrow {
-  padding: 0 var(--zd_size5) 0 0;
-}
 .overlay_arrow {
   position: absolute;
+  left: 100%;
   top: 50%;
   transform: translateY(-50%) perspective(1px);
 }
-[dir=ltr] .overlay_arrow {
-  left: 100%;
-}
-[dir=rtl] .overlay_arrow {
-  right: 100%;
-}
 .hoverIcon .arrow {
   opacity: 0;
   visibility: hidden;
@@ -55,18 +48,12 @@
 .cursor {
   cursor: pointer;
 }
-[dir=ltr] .dropBoxContainer {
+.dropBoxContainer {
   text-align: left;
 }
-[dir=rtl] .dropBoxContainer {
-  text-align: right;
-}
-[dir=ltr] .iconBox {
+.iconBox {
   margin-right: var(--zd_size4);
 }
-[dir=rtl] .iconBox {
-  margin-left: var(--zd_size4);
-}
 .iconBox > i {
   display: block;
 }
@@ -87,10 +74,10 @@
 }
 .hiddenInputElement{
   width: 100%;
+  padding: 0;
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
-  padding: 0;
   border: 0;
 }
 .groupName {

package/es/dropdown/ToggleDropDown/props/defaultProps.js

@@ -0,0 +1,24 @@
+export const defaultProps = {
+  keyName: 'value',
+  idName: 'id',
+  isArrow: true,
+  searchBoxSize: 'small',
+  isDisabled: false,
+  showIconOnHover: false,
+  showOnHover: false,
+  isReadOnly: false,
+  isEditable: true,
+  isDataLoaded: true,
+  needTick: true,
+  needResponsive: true,
+  arrowIconPosition: 'default',
+  groupOptionsKey: 'items',
+  groupNameKey: 'name',
+  isPadding: true,
+  isToggleStateNeeded: false,
+  isNeedEffect: true,
+  hoverType: 'default',
+  needExternalPopupState: false,
+  customProps: {},
+  preventPopupClose: false
+};

package/es/dropdown/ToggleDropDown/props/propTypes.js

@@ -0,0 +1,70 @@
+import PropTypes from 'prop-types';
+export const propTypes = {
+  activeStyle: PropTypes.string,
+  arrowIconPosition: PropTypes.oneOf(['default', 'overlay']),
+  bottom: PropTypes.number,
+  boxPosition: PropTypes.oneOf(['bottomRight', 'bottomLeft', 'bottomCenter', 'topRight', 'topLeft', 'topCenter', 'rightTop', 'rightBottom', 'rightCenter', 'leftTop', 'leftBottom', 'leftCenter']),
+  boxSize: PropTypes.oneOf(['xsmall', 'small', 'medium', 'mlarge', 'large']),
+  children: PropTypes.node,
+  className: PropTypes.string,
+  dataId: PropTypes.string,
+  dataTitle: PropTypes.string,
+  getContainerRef: PropTypes.func,
+  getNextOptions: PropTypes.func,
+  getTargetRef: PropTypes.func,
+  groupNameKey: PropTypes.string,
+  groupOptionsKey: PropTypes.string,
+  hoverStyle: PropTypes.string,
+  hoverType: PropTypes.oneOf(['default', 'border', 'bg']),
+  iconName: PropTypes.string,
+  iconSize: PropTypes.string,
+  idName: PropTypes.string,
+  isArrow: PropTypes.bool,
+  isDataLoaded: PropTypes.bool,
+  isDisabled: PropTypes.bool,
+  isEditable: PropTypes.bool,
+  isGroupDropDown: PropTypes.bool,
+  isNeedEffect: PropTypes.bool,
+  isNextOptions: PropTypes.bool,
+  isPadding: PropTypes.bool,
+  isPopupActive: PropTypes.bool,
+  isPopupOpen: PropTypes.bool,
+  isPopupReady: PropTypes.bool,
+  isReadOnly: PropTypes.bool,
+  isSearch: PropTypes.bool,
+  isToggleStateNeeded: PropTypes.bool,
+  keyName: PropTypes.string,
+  left: PropTypes.number,
+  needExternalPopupState: PropTypes.bool,
+  needResponsive: PropTypes.bool,
+  needSearchFetching: PropTypes.bool,
+  needTick: PropTypes.bool,
+  onClick: PropTypes.func,
+  onSearch: PropTypes.func,
+  options: PropTypes.array.isRequired,
+  palette: PropTypes.oneOf(['dark']),
+  placeHolderText: PropTypes.string,
+  position: PropTypes.string,
+  removeClose: PropTypes.func,
+  right: PropTypes.number,
+  searchBoxSize: PropTypes.oneOf(['small', 'medium', 'xmedium']),
+  searchEmptyHint: PropTypes.string,
+  searchErrorText: PropTypes.string,
+  selectedId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  showIconOnHover: PropTypes.bool,
+  showOnHover: PropTypes.bool,
+  title: PropTypes.string,
+  togglePopup: PropTypes.func,
+  value: PropTypes.node,
+  onDropDownOpen: PropTypes.func,
+  onDropDownClose: PropTypes.func,
+  getFooter: PropTypes.func,
+  customProps: PropTypes.shape({
+    ToggleDropDownProps: PropTypes.object,
+    DropBoxProps: PropTypes.object,
+    TextBoxIconProps: PropTypes.object,
+    ListItemWithIconProps: PropTypes.object,
+    ListItemProps: PropTypes.object
+  }),
+  preventPopupClose: PropTypes.bool
+};

package/es/emptystate/CommonEmptyState/CommonEmptyState.js

@@ -1,5 +1,6 @@
 import React, { Component } from 'react';
-import PropTypes from 'prop-types';
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
 import Link from '../../Link/Link';
 import style from './CommonEmptyState.module.css';
 export default class CommonEmptyState extends Component {
@@ -56,36 +57,8 @@ export default class CommonEmptyState extends Component {
   }
 
 }
-CommonEmptyState.propTypes = {
-  children: PropTypes.node,
-  className: PropTypes.string,
-  dataId: PropTypes.string,
-  description: PropTypes.string,
-  getEmptyState: PropTypes.func,
-  isFluid: PropTypes.bool,
-  linkDescription: PropTypes.string,
-  linkTarget: PropTypes.oneOf(['_blank', '_self']),
-  linkText: PropTypes.string,
-  linkUrl: PropTypes.string,
-  onUrlClick: PropTypes.func,
-  size: PropTypes.oneOf(['small', 'medium']),
-  title: PropTypes.string,
-  palette: PropTypes.oneOf(['default', 'dark']),
-  customClass: PropTypes.shape({
-    titleClass: PropTypes.string,
-    descriptionClass: PropTypes.string
-  })
-};
-CommonEmptyState.defaultProps = {
-  linkTarget: '_self',
-  className: '',
-  linkUrl: '#',
-  dataId: 'emptyState',
-  isFluid: false,
-  size: 'medium',
-  palette: 'default',
-  customClass: {}
-};
+CommonEmptyState.propTypes = propTypes;
+CommonEmptyState.defaultProps = defaultProps;
 
 if (false) {
   CommonEmptyState.docs = {

package/es/emptystate/CommonEmptyState/CommonEmptyState.module.css

@@ -5,16 +5,10 @@
   --linkHoverColor: var(--zdt_commonEmptyState_default_link_hover);
 }
 .container {
-  composes: varClass;
   text-align: center;
-}
-[dir=ltr] .container {
   margin-left: auto;
   margin-right: auto;
-}
-[dir=rtl] .container {
-  margin-right: auto;
-  margin-left: auto;
+  composes: varClass;
 }
 .fluid {
   max-width: var(--zd_size430);
@@ -50,19 +44,17 @@
 .linkDescWrapper {
   margin-top: var(--zd_size20);
 }
-[dir=ltr] .linkDesc, [dir=ltr] .desc {
+.linkDesc,
+.desc {
   margin-right: var(--zd_size4);
 }
-[dir=rtl] .linkDesc, [dir=rtl] .desc {
-  margin-left: var(--zd_size4);
-}
 .desc {
   line-height: var(--zd_size19);
 }
 .link {
+  cursor: pointer;
   color: var(--linkColor);
   display: inline-block;
-  cursor: pointer;
 }
 .link:hover {
   color: var(--linkHoverColor);

package/es/emptystate/CommonEmptyState/props/defaultProps.js

@@ -0,0 +1,10 @@
+export const defaultProps = {
+  linkTarget: '_self',
+  className: '',
+  linkUrl: '#',
+  dataId: 'emptyState',
+  isFluid: false,
+  size: 'medium',
+  palette: 'default',
+  customClass: {}
+};

package/es/emptystate/CommonEmptyState/props/propTypes.js

@@ -0,0 +1,21 @@
+import PropTypes from 'prop-types';
+export const propTypes = {
+  children: PropTypes.node,
+  className: PropTypes.string,
+  dataId: PropTypes.string,
+  description: PropTypes.string,
+  getEmptyState: PropTypes.func,
+  isFluid: PropTypes.bool,
+  linkDescription: PropTypes.string,
+  linkTarget: PropTypes.oneOf(['_blank', '_self']),
+  linkText: PropTypes.string,
+  linkUrl: PropTypes.string,
+  onUrlClick: PropTypes.func,
+  size: PropTypes.oneOf(['small', 'medium']),
+  title: PropTypes.string,
+  palette: PropTypes.oneOf(['default', 'dark']),
+  customClass: PropTypes.shape({
+    titleClass: PropTypes.string,
+    descriptionClass: PropTypes.string
+  })
+};

package/es/emptystate/EditionPage/EditionPage.css

@@ -19,23 +19,17 @@
 }
 .footer {
   font-size: var(--zd_font_size13);
+  margin: var(--zd_size10) 0 var(--zd_size80) 0;
   position: relative;
   display: inline-block;
-  margin: var(--zd_size10) 0 var(--zd_size80) 0;
 }
 .footer::before {
   content: '';
-  position: absolute;
-  top: calc(var(--zd_size10) * -1);
   border-top: var(--zd_size1) solid var(--zdt_editionpage_footer_text);
-}
-[dir=ltr] .footer::before {
+  position: absolute;
   left: calc(var(--zd_size20) * -1);
   right: calc(var(--zd_size20) * -1);
-}
-[dir=rtl] .footer::before {
-  right: calc(var(--zd_size20) * -1);
-  left: calc(var(--zd_size20) * -1);
+  top: calc(var(--zd_size10) * -1);
 }
 .button {
   color: var(--zdt_editionpage_primary_text);

package/es/emptystate/EditionPage/EditionPage.js

@@ -1,5 +1,6 @@
 import React, { Component } from 'react';
-import { PropTypes } from 'prop-types';
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
 import EmptyCrmPotential from '@zohodesk/svg/lib/emptystate/version3/EmptyCrmPotential';
 import style from './EditionPage.css';
 export default class EditionPage extends Component {
@@ -46,17 +47,8 @@ export default class EditionPage extends Component {
   }
 
 }
-EditionPage.defaultProps = {
-  title: '',
-  subtitle: '',
-  dataId: 'edition'
-};
-EditionPage.propTypes = {
-  dataId: PropTypes.string,
-  footerText: PropTypes.string,
-  subTitle: PropTypes.string,
-  title: PropTypes.string
-};
+EditionPage.defaultProps = defaultProps;
+EditionPage.propTypes = propTypes;
 
 if (false) {
   EditionPage.docs = {

package/es/emptystate/EditionPage/props/defaultProps.js

@@ -0,0 +1,5 @@
+export const defaultProps = {
+  title: '',
+  subtitle: '',
+  dataId: 'edition'
+};

package/es/emptystate/EditionPage/props/propTypes.js

@@ -0,0 +1,7 @@
+import PropTypes from 'prop-types';
+export const propTypes = {
+  dataId: PropTypes.string,
+  footerText: PropTypes.string,
+  subTitle: PropTypes.string,
+  title: PropTypes.string
+};

package/es/errorstate/EmptyStates.module.css

@@ -1,4 +1,5 @@
-.container, .tabletContainer {
+.container,
+.tabletContainer {
   text-align: center;
   background-color: var(--zdt_emptystate_default_bg);
 }
@@ -13,23 +14,16 @@
 }
 .header {
   min-width: var(--zd_size400);
-  display: inline-block;
   margin: 0 auto;
-}
-[dir=ltr] .header {
+  display: inline-block;
   text-align: left;
 }
-[dir=rtl] .header {
-  text-align: right;
-}
 .title,
 .tabletTitle,
 .mobileTitle {
   composes: semibold from '~@zohodesk/components/lib/common/common.module.css';
-  letter-spacing: var(--zd_size1);
-}
-.title, .tabletTitle, .mobileTitle {
   margin-bottom: var(--zd_size5);
+  letter-spacing: var(--zd_size1);
 }
 .title {
   font-size: var(--zd_font_size50);
@@ -58,14 +52,15 @@
 }
 
 .footer {
-  display: inline-block;
   text-align: center;
   margin: 0 auto;
+  display: inline-block;
 }
 .footerWidth {
   min-width: var(--zd_size400);
 }
-.btmText, .tabletBtmText {
+.btmText,
+.tabletBtmText {
   margin-bottom: var(--zd_size10);
 }
 .btmText {
@@ -74,7 +69,9 @@
 .tabletBtmText {
   font-size: var(--zd_font_size12);
 }
-.imageContainer, .tabletImageContainer, .mobileImageContainer {
+.imageContainer,
+.tabletImageContainer,
+.mobileImageContainer {
   margin-bottom: var(--zd_size30);
 }
 .imageContainer {

package/es/errorstate/Inconvenience/Inconvenience.js

@@ -1,5 +1,6 @@
 import React from 'react';
-import PropTypes from 'prop-types';
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
 import { Container, Box } from '@zohodesk/components/lib/Layout';
 import LinkText from '../LinkText/LinkText';
 import InconvenienceSVG from '@zohodesk/svg/lib/errorstate/version1/EmptyInconvenience';
@@ -75,20 +76,8 @@ export default class Inconvenience extends React.Component {
   }
 
 }
-Inconvenience.propTypes = {
-  customClass: PropTypes.string,
-  dataId: PropTypes.string,
-  description: PropTypes.string,
-  onClick: PropTypes.func,
-  subtitle: PropTypes.string,
-  title: PropTypes.string,
-  url: PropTypes.string,
-  urlText: PropTypes.string
-};
-Inconvenience.defaultProps = {
-  dataId: 'inconvenience',
-  customClass: ''
-};
+Inconvenience.propTypes = propTypes;
+Inconvenience.defaultProps = defaultProps;
 
 if (false) {
   Inconvenience.docs = {

package/es/errorstate/Inconvenience/Inconvenience.module.css

@@ -1,7 +1,4 @@
 .imageContainer {
   margin-top: calc(var(--zd_size35) * -1);
-}[dir=ltr] .imageContainer {
   margin-left: calc(var(--zd_size30) * -1);
-}[dir=rtl] .imageContainer {
-  margin-right: calc(var(--zd_size30) * -1);
 }

package/es/errorstate/Inconvenience/props/defaultProps.js

@@ -0,0 +1,4 @@
+export const defaultProps = {
+  dataId: 'inconvenience',
+  customClass: ''
+};

package/es/errorstate/Inconvenience/props/propTypes.js

@@ -0,0 +1,11 @@
+import PropTypes from 'prop-types';
+export const propTypes = {
+  customClass: PropTypes.string,
+  dataId: PropTypes.string,
+  description: PropTypes.string,
+  onClick: PropTypes.func,
+  subtitle: PropTypes.string,
+  title: PropTypes.string,
+  url: PropTypes.string,
+  urlText: PropTypes.string
+};

package/es/errorstate/LinkText/LinkText.js

@@ -1,5 +1,6 @@
 import React from 'react';
-import PropTypes from 'prop-types';
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
 import Link from '../../Link/Link';
 import style from './LinkText.module.css';
 export default class LinkText extends React.Component {
@@ -20,17 +21,8 @@ export default class LinkText extends React.Component {
   }
 
 }
-LinkText.propTypes = {
-  dataId: PropTypes.string,
-  href: PropTypes.string,
-  onClick: PropTypes.func,
-  text: PropTypes.string,
-  customClass: PropTypes.string
-};
-LinkText.defaultProps = {
-  dataId: 'LinkText',
-  customClass: ''
-};
+LinkText.propTypes = propTypes;
+LinkText.defaultProps = defaultProps;
 
 if (false) {
   LinkText.docs = {

package/es/errorstate/LinkText/LinkText.module.css

@@ -1,6 +1,6 @@
 .text {
   color: var(--zdt_linktext_default_text);
   display: inline-block;
-  font-size: var(--zd_font_size15);
   cursor: pointer;
+  font-size: var(--zd_font_size15);
 }

package/es/errorstate/LinkText/props/defaultProps.js

@@ -0,0 +1,4 @@
+export const defaultProps = {
+  dataId: 'LinkText',
+  customClass: ''
+};

package/es/errorstate/LinkText/props/propTypes.js

@@ -0,0 +1,8 @@
+import PropTypes from 'prop-types';
+export const propTypes = {
+  dataId: PropTypes.string,
+  href: PropTypes.string,
+  onClick: PropTypes.func,
+  text: PropTypes.string,
+  customClass: PropTypes.string
+};

package/es/errorstate/NoRequestFound/NoRequestFound.js

@@ -1,5 +1,6 @@
 import React from 'react';
-import PropTypes from 'prop-types';
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
 import commonStyle from '../EmptyStates.module.css';
 import NoRequestFoundSVG from '@zohodesk/svg/lib/errorstate/version1/NoRequestFound';
 import { Container, Box } from '@zohodesk/components/lib/Layout';
@@ -75,20 +76,8 @@ export default class NoRequestFound extends React.Component {
   }
 
 }
-NoRequestFound.propTypes = {
-  customClass: PropTypes.string,
-  dataId: PropTypes.string,
-  description: PropTypes.string,
-  onClick: PropTypes.func,
-  subtitle: PropTypes.string,
-  title: PropTypes.string,
-  url: PropTypes.string,
-  urlText: PropTypes.string
-};
-NoRequestFound.defaultProps = {
-  dataId: 'noRequestFound',
-  customClass: ''
-};
+NoRequestFound.propTypes = propTypes;
+NoRequestFound.defaultProps = defaultProps;
 
 if (false) {
   NoRequestFound.docs = {

package/es/errorstate/NoRequestFound/props/defaultProps.js

@@ -0,0 +1,4 @@
+export const defaultProps = {
+  dataId: 'noRequestFound',
+  customClass: ''
+};