@zohodesk/svg 1.0.0-beta.5 → 1.0.0-beta.50

package/es/Provider.js

@@ -0,0 +1,74 @@
+import React from 'react';
+import AppContainer from '@zohodesk/components/lib/AppContainer/AppContainer';
+import { Container } from '@zohodesk/components/lib/Layout';
+import ThemeTool from '../../common/lib/ThemeTool/ThemeTool';
+import '@zohodesk/components/assets/Appearance/default/mode/defaultMode.module.css';
+import '@zohodesk/components/assets/Appearance/dark/mode/darkMode.module.css';
+/* default mode & themes */
+
+import '../assets/Appearance/default/themes/blue/blueDefaultCTATheme.module.css';
+import '../assets/Appearance/default/themes/green/greenDefaultCTATheme.module.css';
+import '../assets/Appearance/default/themes/orange/orangeDefaultCTATheme.module.css';
+import '../assets/Appearance/default/themes/red/redDefaultCTATheme.module.css';
+import '../assets/Appearance/default/themes/yellow/yellowDefaultCTATheme.module.css';
+import '../assets/Appearance/default/mode/defaultEmptyStates.module.css';
+/* dark mode & themes */
+
+import '../assets/Appearance/dark/themes/blue/blueDarkCTATheme.module.css';
+import '../assets/Appearance/dark/themes/green/greenDarkCTATheme.module.css';
+import '../assets/Appearance/dark/themes/orange/orangeDarkCTATheme.module.css';
+import '../assets/Appearance/dark/themes/red/redDarkCTATheme.module.css';
+import '../assets/Appearance/dark/themes/yellow/yellowDarkCTATheme.module.css';
+import '../assets/Appearance/dark/mode/darkEmptyStates.module.css';
+/* pure dark mode & themes */
+
+import '../assets/Appearance/pureDark/themes/blue/bluePureDarkCTATheme.module.css';
+import '../assets/Appearance/pureDark/themes/green/greenPureDarkCTATheme.module.css';
+import '../assets/Appearance/pureDark/themes/orange/orangePureDarkCTATheme.module.css';
+import '../assets/Appearance/pureDark/themes/red/redPureDarkCTATheme.module.css';
+import '../assets/Appearance/pureDark/themes/yellow/yellowPureDarkCTATheme.module.css';
+import '../assets/Appearance/pureDark/mode/pureDarkEmptyStates.module.css';
+export default class Provider extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      appearanceName: 'default',
+      themeName: 'blue'
+    };
+    this.setTheme = this.setTheme.bind(this);
+    this.setAppearance = this.setAppearance.bind(this);
+  }
+
+  setAppearance(mode) {
+    this.setState({
+      appearanceName: mode
+    });
+  }
+
+  setTheme(theme) {
+    this.setState({
+      themeName: theme
+    });
+  }
+
+  render() {
+    let {
+      appearanceName,
+      themeName
+    } = this.state;
+    return /*#__PURE__*/React.createElement(AppContainer, {
+      customProps: {
+        ExtraProps: {
+          'data-mode': appearanceName,
+          'data-theme': themeName
+        }
+      }
+    }, /*#__PURE__*/React.createElement(Container, {
+      scroll: "vertical"
+    }, this.props.children), /*#__PURE__*/React.createElement(ThemeTool, {
+      onThemeChange: this.setTheme,
+      onAppearanceChange: this.setAppearance
+    }));
+  }
+
+}

package/es/SVG/SVG.js

@@ -0,0 +1,56 @@
+import React from 'react';
+import { SvgProps } from './props/propTypes';
+import { SvgDefaultProps } from './props/defaultProps';
+import style from './SVG.module.css';
+import styles from './../css/EmptyStateVariables.module.css';
+export default class SVG extends React.Component {
+  render() {
+    let {
+      viewBox,
+      children,
+      name,
+      isRender,
+      isSymbol,
+      size,
+      className,
+      alignHorizontal,
+      isFluid,
+      dataId,
+      palette,
+      styleName
+    } = this.props;
+    return /*#__PURE__*/React.createElement(React.Fragment, null, isSymbol ? /*#__PURE__*/React.createElement("div", {
+      hidden: true
+    }, /*#__PURE__*/React.createElement("svg", null, /*#__PURE__*/React.createElement("symbol", {
+      id: name,
+      viewBox: viewBox
+    }, children))) : null, isRender && isSymbol ? /*#__PURE__*/React.createElement("div", {
+      className: `${size === 'large' ? style.large : size === 'small' ? style.small : isFluid ? style.cover : ''} ${className} ${styles[palette]} ${alignHorizontal ? style.svgCenter : ''} `,
+      "aria-hidden": "true"
+    }, /*#__PURE__*/React.createElement("svg", {
+      height: "100%",
+      width: "100%",
+      "data-id": dataId
+    }, /*#__PURE__*/React.createElement("use", {
+      xlinkHref: `#${name}`
+    }))) : isRender ? /*#__PURE__*/React.createElement("div", {
+      className: `${size === 'large' ? style.large : size === 'small' ? style.small : isFluid ? style.cover : ''} ${className} ${styles[palette]} ${alignHorizontal ? style.svgCenter : ''} `,
+      "aria-hidden": "true"
+    }, /*#__PURE__*/React.createElement("svg", {
+      height: "100%",
+      width: "100%",
+      viewBox: viewBox,
+      "data-id": dataId,
+      style: styleName
+    }, children)) : null);
+  }
+
+}
+SVG.propTypes = SvgProps;
+SVG.defaultProps = SvgDefaultProps;
+
+if (false) {
+  SVG.docs = {
+    componentGroup: 'SVG'
+  };
+}

package/es/{svg → SVG}/SVG.module.css

@@ -2,8 +2,8 @@
   height: 100%;
 }
 .large {
-  height: var(--zd_size150);
-  width: var(--zd_size150);
+  height: var(--zd_size160);
+  width: var(--zd_size160);
 }
 .small {
   height: var(--zd_size130);
@@ -17,7 +17,6 @@
   height: var(--zd_size40);
   width: var(--zd_size40);
 }
-
 .center {
   height: 100%;
   width: 100%;

package/es/SVG/SvgLoader.js

@@ -0,0 +1,28 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+import React, { useEffect, useState } from 'react';
+export default function SvgLoader(props) {
+  let uiProps = {};
+  Object.keys(props).filter(prop => prop != 'imageUrl').map(prop => {
+    uiProps[prop] = props[prop];
+  });
+
+  let image = require(`./images/${props.imageUrl}`);
+
+  return /*#__PURE__*/React.createElement("image", _extends({
+    xlinkHref: image
+  }, uiProps));
+}
+export function StaticSvg(props) {
+  let uiProps = {},
+      [image, setImage] = useState(null);
+  Object.keys(props).filter(prop => prop != 'getImage').map(prop => {
+    uiProps[prop] = props[prop];
+  });
+  useEffect(() => {
+    props.getImage().then(image => setImage(image));
+  }, [props.getImage]);
+  return image ? /*#__PURE__*/React.createElement("image", _extends({
+    xlinkHref: image.default
+  }, uiProps)) : null;
+}

package/es/SVG/props/defaultProps.js

@@ -0,0 +1,11 @@
+export const SvgDefaultProps = {
+  alignHorizontal: true,
+  isRender: true,
+  className: '',
+  dataId: 'SVG',
+  name: '',
+  viewBox: '',
+  isSymbol: false,
+  isFluid: false,
+  palette: 'default'
+};

package/es/SVG/props/propTypes.js

@@ -0,0 +1,15 @@
+import PropTypes from 'prop-types';
+export const SvgProps = {
+  alignHorizontal: PropTypes.bool,
+  children: PropTypes.node,
+  className: PropTypes.string,
+  dataId: PropTypes.string,
+  isFluid: PropTypes.bool,
+  isRender: PropTypes.bool,
+  isSymbol: PropTypes.bool,
+  name: PropTypes.string,
+  size: PropTypes.oneOf(['small', 'large']),
+  viewBox: PropTypes.string,
+  palette: PropTypes.oneOf(['default', 'dark']),
+  styleName: PropTypes.node
+};

package/es/css/EmptyStateVariables.module.css

@@ -0,0 +1,39 @@
+.default {
+  /* empty svg default palette variables */
+  --zd_emptysvg_primary_fill: var(--zdt_svg_default_primary_fill);
+  --zd_emptysvg_primary_stroke: var(--zdt_svg_default_primary_stroke);
+  --zd_emptysvg_secondary_fill: var(--zdt_svg_default_secondary_fill);
+  --zd_emptysvg_secondary_plainfill: var(--zdt_svg_default_secondary_plainfill);
+  --zd_emptysvg_plus: var(--zdt_svg_default_plus);
+  --zd_emptysvg_cross: var(--zdt_svg_default_cross);
+  --zd_emptysvg_medium_circle: var(--zdt_svg_default_medium_circle);
+  --zd_emptysvg_tiny_circle: var(--zdt_svg_default_tiny_circle);
+  --zd_emptysvg_small_circle: var(--zdt_svg_default_small_circle);
+  --zd_emptysvg_circle_fill: var(--zdt_svg_default_circle_fill);
+}
+.dark {
+  /* empty svg dark palette variables */
+  --zd_emptysvg_primary_fill: var(--zdt_svg_dark_primary_fill);
+  --zd_emptysvg_primary_stroke: var(--zdt_svg_dark_primary_stroke);
+  --zd_emptysvg_secondary_fill: var(--zdt_svg_dark_secondary_fill);
+  --zd_emptysvg_secondary_plainfill: var(--zdt_svg_dark_secondary_plainfill);
+  --zd_emptysvg_plus: var(--zdt_svg_dark_plus);
+  --zd_emptysvg_cross: var(--zdt_svg_dark_cross);
+  --zd_emptysvg_medium_circle: var(--zdt_svg_dark_medium_circle);
+  --zd_emptysvg_tiny_circle: var(--zdt_svg_dark_tiny_circle);
+  --zd_emptysvg_small_circle: var(--zdt_svg_dark_small_circle);
+  --zd_emptysvg_circle_fill: var(--zdt_svg_dark_circle_fill);
+}
+.danger {
+  /* empty svg danger palette variables */
+  --zd_emptysvg_primary_fill: var(--zdt_svg_danger_primary_fill);
+  --zd_emptysvg_primary_stroke: var(--zdt_svg_danger_primary_stroke);
+  --zd_emptysvg_secondary_fill: var(--zdt_svg_danger_secondary_fill);
+  --zd_emptysvg_secondary_plainfill: var(--zdt_svg_danger_secondary_plainfill);
+  --zd_emptysvg_plus: var(--zdt_svg_danger_plus);
+  --zd_emptysvg_cross: var(--zdt_svg_danger_cross);
+  --zd_emptysvg_medium_circle: var(--zdt_svg_danger_medium_circle);
+  --zd_emptysvg_tiny_circle: var(--zdt_svg_danger_tiny_circle);
+  --zd_emptysvg_small_circle: var(--zdt_svg_danger_small_circle);
+  --zd_emptysvg_circle_fill: var(--zdt_svg_danger_circle_fill);
+}

package/es/docs/Emptystate__version1.docs.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import EmptyCustomDomain from '../emptystate/version1/EmptyCustomDomain';
+import style from './SVGdocstyle.module.css';
+export default class Emptystate__version1 extends React.Component {
+  render() {
+    let allSvg = {
+      EmptyCustomDomain: /*#__PURE__*/React.createElement(EmptyCustomDomain, null)
+    };
+    return /*#__PURE__*/React.createElement("div", {
+      className: style.parent
+    }, Object.keys(allSvg).map(item => {
+      let filterDarkPalettes = item.endsWith('DarkPalette');
+      return /*#__PURE__*/React.createElement("div", {
+        className: filterDarkPalettes ? style.darkPalette : style.defaultPalette
+      }, /*#__PURE__*/React.createElement("div", {
+        className: style.box
+      }, allSvg[item]), /*#__PURE__*/React.createElement("div", {
+        className: style.textStyle
+      }, item));
+    }));
+  }
+
+}
+
+if (false) {
+  Emptystate__version1.docs = {
+    componentGroup: 'Emptystate'
+  };
+}

package/es/docs/Emptystate__version2.docs.js

@@ -0,0 +1,45 @@
+import React from 'react';
+import EmptyBusinessHoliday from '../emptystate/version2/EmptyBusinessHoliday';
+import EmptyBusinessHour from '../emptystate/version2/EmptyBusinessHour';
+import EmptyImportHistory from '../emptystate/version2/EmptyImportHistory';
+import EmptyRecycleBin from '../emptystate/version2/EmptyRecycleBin';
+import EmptyRoles from '../emptystate/version2/EmptyRoles';
+import EmptyNetwork from '../emptystate/version2/EmptyNetwork';
+import FailureLog from '../emptystate/version2/FailureLog';
+import EmptyFromAddress from '../emptystate/version2/EmptyFromAddress';
+import EmptyWebhook from '../emptystate/version2/EmptyWebhook';
+import style from './SVGdocstyle.module.css';
+export default class Emptystate__version2 extends React.Component {
+  render() {
+    let allSvg = {
+      EmptyBusinessHoliday: /*#__PURE__*/React.createElement(EmptyBusinessHoliday, null),
+      EmptyBusinessHour: /*#__PURE__*/React.createElement(EmptyBusinessHour, null),
+      EmptyImportHistory: /*#__PURE__*/React.createElement(EmptyImportHistory, null),
+      EmptyRecycleBin: /*#__PURE__*/React.createElement(EmptyRecycleBin, null),
+      EmptyRoles: /*#__PURE__*/React.createElement(EmptyRoles, null),
+      EmptyNetwork: /*#__PURE__*/React.createElement(EmptyNetwork, null),
+      FailureLog: /*#__PURE__*/React.createElement(FailureLog, null),
+      EmptyFromAddress: /*#__PURE__*/React.createElement(EmptyFromAddress, null),
+      EmptyWebhook: /*#__PURE__*/React.createElement(EmptyWebhook, null)
+    };
+    return /*#__PURE__*/React.createElement("div", {
+      className: style.parent
+    }, Object.keys(allSvg).map(item => {
+      let filterDarkPalettes = item.endsWith('DarkPalette');
+      return /*#__PURE__*/React.createElement("div", {
+        className: filterDarkPalettes ? style.darkPalette : style.defaultPalette
+      }, /*#__PURE__*/React.createElement("div", {
+        className: style.box
+      }, allSvg[item]), /*#__PURE__*/React.createElement("div", {
+        className: style.textStyle
+      }, item));
+    }));
+  }
+
+}
+
+if (false) {
+  Emptystate__version2.docs = {
+    componentGroup: 'Emptystate'
+  };
+}

package/es/docs/Emptystate__version3.docs.js

@@ -0,0 +1,180 @@
+import React from 'react';
+import EmptyActivity from '../emptystate/version3/EmptyActivity';
+import EmptyAccounts from '../emptystate/version3/EmptyAccounts';
+import EmptyAgent from '../emptystate/version3/EmptyAgent';
+import EmptyArchived from '../emptystate/version3/EmptyArchived';
+import EmptyBlueprint from '../emptystate/version3/EmptyBlueprint';
+import EmptyFrame from '../emptystate/version3/EmptyFrame';
+import EmptyContact from '../emptystate/version3/EmptyContact';
+import EmptyDashboard from '../emptystate/version3/EmptyDashboard';
+import EmptyInvoice from '../emptystate/version3/EmptyInvoice';
+import EmptyProducts from '../emptystate/version3/EmptyProducts';
+import EmptyReports from '../emptystate/version3/EmptyReports';
+import EmptySearch from '../emptystate/version3/EmptySearch';
+import EmptyTag from '../emptystate/version3/EmptyTag';
+import EmptyTask from '../emptystate/version3/EmptyTask';
+import EmptyTicket from '../emptystate/version3/EmptyTicket';
+import EmptyAttach from '../emptystate/version3/EmptyAttach';
+import EmptyHappiness from '../emptystate/version3/EmptyHappiness';
+import EmptyConversation from '../emptystate/version3/EmptyConversation';
+import EmptyNotification from '../emptystate/version3/EmptyNotification';
+import EmptyTimeEntry from '../emptystate/version3/EmptyTimeEntry';
+import EmptyTeams from '../emptystate/version3/EmptyTeams';
+import EmptyTopic from '../emptystate/version3/EmptyTopic';
+import EmptyActiveCalls from '../emptystate/version3/EmptyActiveCalls';
+import EmptyCallHistory from '../emptystate/version3/EmptyCallHistory';
+import EmptyHistory from '../emptystate/version3/EmptyHistory';
+import EmptyTemplate from '../emptystate/version3/EmptyTemplate';
+import EmptySkills from '../emptystate/version3/EmptySkills';
+import EmptySnippet from '../emptystate/version3/EmptySnippet';
+import EmptyCrm from '../emptystate/version3/EmptyCrm';
+import EmptyFollowers from '../emptystate/version3/EmptyFollowers';
+import EmptyFeed from '../emptystate/version3/EmptyFeed';
+import EmptySchedule from '../emptystate/version3/EmptySchedule';
+import EmptyColumn from '../emptystate/version3/EmptyColumn';
+import EmptyApproval from '../emptystate/version3/EmptyApproval';
+import EmptyCollision from '../emptystate/version3/EmptyCollision';
+import EmptyCrmNotes from '../emptystate/version3/EmptyCrmNotes';
+import EmptyCrmPotential from '../emptystate/version3/EmptyCrmPotential';
+import EmptyTimeline from '../emptystate/version3/EmptyTimeline';
+import EmptyReply from '../emptystate/version3/EmptyReply';
+import EmptyContract from '../emptystate/version3/EmptyContract';
+import EmptySla from '../emptystate/version3/EmptySla';
+import EmptyAgentQueue from '../emptystate/version3/EmptyAgentQueue';
+import EmptyDepartment from '../emptystate/version3/EmptyDepartment';
+import EmptyMessenger from '../emptystate/version3/EmptyMessenger';
+import EmptyApplechat from '../emptystate/version3/EmptyApplechat';
+import EmptyTelegram from '../emptystate/version3/EmptyTelegram';
+import EmptyArticle from '../emptystate/version3/EmptyArticle';
+import EmptyAsapchat from '../emptystate/version3/EmptyAsapchat';
+import EmptyCanned from '../emptystate/version3/EmptyCanned';
+import EmptyChat from '../emptystate/version3/EmptyChat';
+import EmptyInstagram from '../emptystate/version3/EmptyInstagram';
+import EmptyInstantmessage from '../emptystate/version3/EmptyInstantmessage';
+import EmptyLine from '../emptystate/version3/EmptyLine';
+import EmptyWechat from '../emptystate/version3/EmptyWechat';
+import EmptyTwilio from '../emptystate/version3/EmptyTwilio';
+import EmptyWhatsapp from '../emptystate/version3/EmptyWhatsapp';
+import ZiaAnamoly from '../emptystate/version3/ZiaAnamoly';
+import Predictor from '../emptystate/version3/Predictor';
+import Extractor from '../emptystate/version3/Extractor';
+import EmptyError from '../emptystate/version3/EmptyError';
+import Import from '../emptystate/version3/Import';
+import Export from '../emptystate/version3/Export';
+import Extensions from '../emptystate/version3/Extensions';
+import Multilingual from '../emptystate/version3/Multilingual';
+import EmptyDelete from '../emptystate/version3/EmptyDelete';
+import EmptyNoData from '../emptystate/version3/EmptyNoData';
+import GCBot from '../emptystate/version3/GCBot';
+import GCConversation from '../emptystate/version3/GCConversation';
+import KBBot from '../emptystate/version3/KBBot';
+import NetworkError from '../emptystate/version3/NetworkError';
+import Variable from '../emptystate/version3/Variable';
+import ReadRecipients from '../emptystate/version3/ReadRecipients';
+import CustomModule from '../emptystate/version3/CustomModule';
+import AuditLog from '../emptystate/version3/AuditLog';
+import SupportPlan from '../emptystate/version3/SupportPlan';
+import style from './SVGdocstyle.module.css';
+export default class Emptystate__version3 extends React.Component {
+  render() {
+    let allSvg = {
+      EmptyAccounts: /*#__PURE__*/React.createElement(EmptyAccounts, null),
+      EmptyActiveCalls: /*#__PURE__*/React.createElement(EmptyActiveCalls, null),
+      EmptyActivity: /*#__PURE__*/React.createElement(EmptyActivity, null),
+      EmptyAgent: /*#__PURE__*/React.createElement(EmptyAgent, null),
+      EmptyApproval: /*#__PURE__*/React.createElement(EmptyApproval, null),
+      EmptyArchived: /*#__PURE__*/React.createElement(EmptyArchived, null),
+      EmptyAttach: /*#__PURE__*/React.createElement(EmptyAttach, null),
+      EmptyCallHistory: /*#__PURE__*/React.createElement(EmptyCallHistory, null),
+      EmptyCollision: /*#__PURE__*/React.createElement(EmptyCollision, null),
+      EmptyColumn: /*#__PURE__*/React.createElement(EmptyColumn, null),
+      EmptyContact: /*#__PURE__*/React.createElement(EmptyContact, null),
+      EmptyConversation: /*#__PURE__*/React.createElement(EmptyConversation, null),
+      EmptyCrm: /*#__PURE__*/React.createElement(EmptyCrm, null),
+      EmptyCrmNotes: /*#__PURE__*/React.createElement(EmptyCrmNotes, null),
+      EmptyCrmPotential: /*#__PURE__*/React.createElement(EmptyCrmPotential, null),
+      EmptyDashboard: /*#__PURE__*/React.createElement(EmptyDashboard, null),
+      EmptyInvoice: /*#__PURE__*/React.createElement(EmptyInvoice, null),
+      EmptyProducts: /*#__PURE__*/React.createElement(EmptyProducts, null),
+      EmptyReports: /*#__PURE__*/React.createElement(EmptyReports, null),
+      EmptySearch: /*#__PURE__*/React.createElement(EmptySearch, null),
+      EmptyTag: /*#__PURE__*/React.createElement(EmptyTag, null),
+      EmptyTask: /*#__PURE__*/React.createElement(EmptyTask, null),
+      EmptyTicket: /*#__PURE__*/React.createElement(EmptyTicket, null),
+      EmptyHappiness: /*#__PURE__*/React.createElement(EmptyHappiness, null),
+      EmptyNotification: /*#__PURE__*/React.createElement(EmptyNotification, null),
+      EmptyTimeEntry: /*#__PURE__*/React.createElement(EmptyTimeEntry, null),
+      EmptyTeams: /*#__PURE__*/React.createElement(EmptyTeams, null),
+      EmptyTopic: /*#__PURE__*/React.createElement(EmptyTopic, null),
+      EmptySnippet: /*#__PURE__*/React.createElement(EmptySnippet, null),
+      EmptyFollowers: /*#__PURE__*/React.createElement(EmptyFollowers, null),
+      EmptyFeed: /*#__PURE__*/React.createElement(EmptyFeed, null),
+      EmptySchedule: /*#__PURE__*/React.createElement(EmptySchedule, null),
+      EmptyHistory: /*#__PURE__*/React.createElement(EmptyHistory, null),
+      EmptyTimeline: /*#__PURE__*/React.createElement(EmptyTimeline, null),
+      EmptyTemplate: /*#__PURE__*/React.createElement(EmptyTemplate, null),
+      EmptyBlueprint: /*#__PURE__*/React.createElement(EmptyBlueprint, null),
+      EmptyContract: /*#__PURE__*/React.createElement(EmptyContract, null),
+      EmptySla: /*#__PURE__*/React.createElement(EmptySla, null),
+      EmptyReply: /*#__PURE__*/React.createElement(EmptyReply, null),
+      EmptyAgentQueue: /*#__PURE__*/React.createElement(EmptyAgentQueue, null),
+      EmptySkills: /*#__PURE__*/React.createElement(EmptySkills, null),
+      EmptyDepartment: /*#__PURE__*/React.createElement(EmptyDepartment, null),
+      EmptyMessenger: /*#__PURE__*/React.createElement(EmptyMessenger, null),
+      EmptyApplechat: /*#__PURE__*/React.createElement(EmptyApplechat, null),
+      EmptyArticle: /*#__PURE__*/React.createElement(EmptyArticle, null),
+      EmptyAsapchat: /*#__PURE__*/React.createElement(EmptyAsapchat, null),
+      EmptyCanned: /*#__PURE__*/React.createElement(EmptyCanned, null),
+      EmptyChat: /*#__PURE__*/React.createElement(EmptyChat, null),
+      EmptyInstagram: /*#__PURE__*/React.createElement(EmptyInstagram, null),
+      EmptyInstantmessage: /*#__PURE__*/React.createElement(EmptyInstantmessage, null),
+      EmptyLine: /*#__PURE__*/React.createElement(EmptyLine, null),
+      EmptyTelegram: /*#__PURE__*/React.createElement(EmptyTelegram, null),
+      EmptyWechat: /*#__PURE__*/React.createElement(EmptyWechat, null),
+      EmptyTwilio: /*#__PURE__*/React.createElement(EmptyTwilio, null),
+      EmptyWhatsapp: /*#__PURE__*/React.createElement(EmptyWhatsapp, null),
+      ZiaAnamoly: /*#__PURE__*/React.createElement(ZiaAnamoly, null),
+      Predictor: /*#__PURE__*/React.createElement(Predictor, null),
+      Extractor: /*#__PURE__*/React.createElement(Extractor, null),
+      Import: /*#__PURE__*/React.createElement(Import, null),
+      Export: /*#__PURE__*/React.createElement(Export, null),
+      Extensions: /*#__PURE__*/React.createElement(Extensions, null),
+      Multilingual: /*#__PURE__*/React.createElement(Multilingual, null),
+      EmptyDelete: /*#__PURE__*/React.createElement(EmptyDelete, null),
+      EmptyNoData: /*#__PURE__*/React.createElement(EmptyNoData, null),
+      GCBot: /*#__PURE__*/React.createElement(GCBot, null),
+      GCConversation: /*#__PURE__*/React.createElement(GCConversation, null),
+      KBBot: /*#__PURE__*/React.createElement(KBBot, null),
+      NetworkError: /*#__PURE__*/React.createElement(NetworkError, null),
+      Variable: /*#__PURE__*/React.createElement(Variable, null),
+      ReadRecipients: /*#__PURE__*/React.createElement(ReadRecipients, null),
+      CustomModule: /*#__PURE__*/React.createElement(CustomModule, null),
+      EmptyFrame: /*#__PURE__*/React.createElement(EmptyFrame, null),
+      EmptyFrameDangerPalette: /*#__PURE__*/React.createElement(EmptyFrame, {
+        palette: "danger"
+      }),
+      EmptyError: /*#__PURE__*/React.createElement(EmptyError, null),
+      AuditLog: /*#__PURE__*/React.createElement(AuditLog, null),
+      SupportPlan: /*#__PURE__*/React.createElement(SupportPlan, null)
+    };
+    return /*#__PURE__*/React.createElement("div", {
+      className: style.parent
+    }, Object.keys(allSvg).map(item => {
+      let filterDarkPalettes = item.endsWith('DarkPalette');
+      return /*#__PURE__*/React.createElement("div", {
+        className: filterDarkPalettes ? style.darkPalette : style.defaultPalette
+      }, /*#__PURE__*/React.createElement("div", {
+        className: style.box
+      }, allSvg[item]), /*#__PURE__*/React.createElement("div", {
+        className: style.textStyle
+      }, item));
+    }));
+  }
+
+}
+
+if (false) {
+  Emptystate__version3.docs = {
+    componentGroup: 'Emptystate'
+  };
+}

package/es/docs/Errorstate__version1.docs.js

@@ -0,0 +1,41 @@
+import React from 'react';
+import EmptyInconvenience from '../errorstate/version1/EmptyInconvenience';
+import NoRequestFound from '../errorstate/version1/NoRequestFound';
+import PageNotFound from '../errorstate/version1/PageNotFound';
+import UnableToProcessRequest from '../errorstate//version1/UnableToProcessRequest';
+import UnauthorizedLogin from '../errorstate/version1/UnauthorizedLogin';
+import UrlNotFound from '../errorstate/version1/UrlNotFound';
+import WillBeRightBack from '../errorstate/version1/WillBeRightBack';
+import style from './SVGdocstyle.module.css';
+export default class Errorstate__version1 extends React.Component {
+  render() {
+    let allSvg = {
+      EmptyInconvenience: /*#__PURE__*/React.createElement(EmptyInconvenience, null),
+      NoRequestFound: /*#__PURE__*/React.createElement(NoRequestFound, null),
+      PageNotFound: /*#__PURE__*/React.createElement(PageNotFound, null),
+      UnableToProcessRequest: /*#__PURE__*/React.createElement(UnableToProcessRequest, null),
+      UnauthorizedLogin: /*#__PURE__*/React.createElement(UnauthorizedLogin, null),
+      UrlNotFound: /*#__PURE__*/React.createElement(UrlNotFound, null),
+      WillBeRightBack: /*#__PURE__*/React.createElement(WillBeRightBack, null)
+    };
+    return /*#__PURE__*/React.createElement("div", {
+      className: style.parent
+    }, Object.keys(allSvg).map(item => {
+      let filterDarkPalettes = item.endsWith('DarkPalette');
+      return /*#__PURE__*/React.createElement("div", {
+        className: filterDarkPalettes ? style.darkPalette : style.defaultPalette
+      }, /*#__PURE__*/React.createElement("div", {
+        className: style.box
+      }, allSvg[item]), /*#__PURE__*/React.createElement("div", {
+        className: style.textStyle
+      }, item));
+    }));
+  }
+
+}
+
+if (false) {
+  Errorstate__version1.docs = {
+    componentGroup: 'Errorstate'
+  };
+}

package/es/docs/Errorstate__version2.docs.js

@@ -0,0 +1,33 @@
+import React from 'react';
+import EmptyUnauthorizedLogin from '../errorstate/version2/EmptyUnauthorizedLogin';
+import EmptyWillBeRightBack from '../errorstate/version2/EmptyWillBeRightBack';
+import NotImpossible from '../errorstate/version2/NotImpossible';
+import style from './SVGdocstyle.module.css';
+export default class Errorstate__version2 extends React.Component {
+  render() {
+    let allSvg = {
+      EmptyUnauthorizedLogin: /*#__PURE__*/React.createElement(EmptyUnauthorizedLogin, null),
+      EmptyWillBeRightBack: /*#__PURE__*/React.createElement(EmptyWillBeRightBack, null),
+      NotImpossible: /*#__PURE__*/React.createElement(NotImpossible, null)
+    };
+    return /*#__PURE__*/React.createElement("div", {
+      className: style.parent
+    }, Object.keys(allSvg).map(item => {
+      let filterDarkPalettes = item.endsWith('DarkPalette');
+      return /*#__PURE__*/React.createElement("div", {
+        className: filterDarkPalettes ? style.darkPalette : style.defaultPalette
+      }, /*#__PURE__*/React.createElement("div", {
+        className: style.box
+      }, allSvg[item]), /*#__PURE__*/React.createElement("div", {
+        className: style.textStyle
+      }, item));
+    }));
+  }
+
+}
+
+if (false) {
+  Errorstate__version2.docs = {
+    componentGroup: 'Errorstate'
+  };
+}

package/es/docs/Errorstate__version3.docs.js

@@ -0,0 +1,39 @@
+import React from 'react';
+import ErrorInconvenience from '../errorstate/version3/ErrorInconvenience';
+import ErrorOopsSomethingMiss from '../errorstate/version3/ErrorOopsSomethingMiss';
+import ErrorUnableToProcessRequest from '../errorstate/version3/ErrorUnableToProcessRequest';
+import ErrorUnauthorizedLogin from '../errorstate/version3/ErrorUnauthorizedLogin';
+import ErrorUrlNotFound from '../errorstate/version3/ErrorUrlNotFound';
+import ErrorWillBeRightBack from '../errorstate/version3/ErrorWillBeRightBack';
+import style from './SVGdocstyle.module.css';
+export default class Errorstate__version3 extends React.Component {
+  render() {
+    let allSvg = {
+      Inconvenience: /*#__PURE__*/React.createElement(ErrorInconvenience, null),
+      OopsSomethingMiss: /*#__PURE__*/React.createElement(ErrorOopsSomethingMiss, null),
+      UnableToProcessRequest: /*#__PURE__*/React.createElement(ErrorUnableToProcessRequest, null),
+      UnathorizedLogin: /*#__PURE__*/React.createElement(ErrorUnauthorizedLogin, null),
+      UrlNotFound: /*#__PURE__*/React.createElement(ErrorUrlNotFound, null),
+      WillBeRightBack: /*#__PURE__*/React.createElement(ErrorWillBeRightBack, null)
+    };
+    return /*#__PURE__*/React.createElement("div", {
+      className: style.parent
+    }, Object.keys(allSvg).map(item => {
+      let filterDarkPalettes = item.endsWith('DarkPalette');
+      return /*#__PURE__*/React.createElement("div", {
+        className: filterDarkPalettes ? style.darkPalette : style.defaultPalette
+      }, /*#__PURE__*/React.createElement("div", {
+        className: style.box
+      }, allSvg[item]), /*#__PURE__*/React.createElement("div", {
+        className: style.textStyle
+      }, item));
+    }));
+  }
+
+}
+
+if (false) {
+  Errorstate__version3.docs = {
+    componentGroup: 'Errorstate'
+  };
+}

package/es/docs/SVG__common.docs.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import Loader from '../Loader/Loader';
+import style from './SVGdocstyle.module.css';
+export default class SVG__common extends React.Component {
+  render() {
+    let allSvg = {
+      Loader: /*#__PURE__*/React.createElement(Loader, null)
+    };
+    return /*#__PURE__*/React.createElement("div", {
+      className: style.parent
+    }, Object.keys(allSvg).map(item => {
+      let filterDarkPalettes = item.endsWith('DarkPalette');
+      return /*#__PURE__*/React.createElement("div", {
+        className: filterDarkPalettes ? style.darkPalette : style.defaultPalette
+      }, /*#__PURE__*/React.createElement("div", {
+        className: style.box
+      }, allSvg[item]), /*#__PURE__*/React.createElement("div", {
+        className: style.textStyle
+      }, item));
+    }));
+  }
+
+}
+
+if (false) {
+  SVG__common.docs = {
+    componentGroup: 'Svg'
+  };
+}