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

package/src/svg/Loader.js

@@ -1,25 +0,0 @@
-import React from 'react';
-import SVG from './SVG';
-import image from './images/Loader.svg';
-import style from './SVG.module.css';
-export default class Loader extends React.Component {
-  render() {
-    return (
-      <div className={style.center}>
-        <SVG
-          viewBox='0 0 40 40'
-          name='Loader'
-          className={`${style.loaderWrapper}`}
-        >
-          <image xlinkHref={image} height='100%' width='100%' />
-        </SVG>
-      </div>
-    );
-  }
-}
-
-if (__DOCS__) {
-  Loader.docs = {
-    componentGroup: 'SVG'
-  };
-}

package/src/svg/NoRequestFound.js

@@ -1,38 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import SVG from './SVG';
-import image from './images/NoRequestFound.svg';
-export default class NoRequestFound extends React.Component {
-  render() {
-    let { isRender, className, alignHorizontal, isFluid } = this.props;
-    return (
-      <SVG
-        viewBox='0 0 476.5 297.6'
-        name='NoRequestFound'
-        isRender={isRender}
-        className={className}
-        alignHorizontal={alignHorizontal}
-        isFluid={isFluid}
-      >
-        <image xlinkHref={image} height='100%' width='100%' />
-      </SVG>
-    );
-  }
-}
-NoRequestFound.propTypes = {
-  isRender: PropTypes.bool,
-  alignHorizontal: PropTypes.bool,
-  className: PropTypes.string,
-  isFluid: PropTypes.bool
-};
-NoRequestFound.defaultProps = {
-  isRender: true,
-  className: '',
-  alignHorizontal: true
-};
-
-if (__DOCS__) {
-  NoRequestFound.docs = {
-    componentGroup: 'SVG'
-  };
-}

package/src/svg/PageNotFound.js

@@ -1,38 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import SVG from './SVG';
-import image from './images/PageNotFound.svg';
-export default class PageNotFound extends React.Component {
-  render() {
-    let { isRender, className, alignHorizontal, isFluid } = this.props;
-    return (
-      <SVG
-        viewBox='0 0 508.8 324.8'
-        name='PageNotFound'
-        isRender={isRender}
-        className={className}
-        alignHorizontal={alignHorizontal}
-        isFluid={isFluid}
-      >
-        <image xlinkHref={image} height='100%' width='100%' />
-      </SVG>
-    );
-  }
-}
-PageNotFound.propTypes = {
-  isRender: PropTypes.bool,
-  alignHorizontal: PropTypes.bool,
-  className: PropTypes.string,
-  isFluid: PropTypes.bool
-};
-PageNotFound.defaultProps = {
-  isRender: true,
-  alignHorizontal: true,
-  className: ''
-};
-
-if (__DOCS__) {
-  PageNotFound.docs = {
-    componentGroup: 'SVG'
-  };
-}

package/src/svg/SVG.js

@@ -1,88 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import style from './SVG.module.css';
-export default class SVG extends React.Component {
-  render() {
-    let {
-      viewBox,
-      children,
-      name,
-      isRender,
-      isSymbol,
-      size,
-      className,
-      alignHorizontal,
-      isFluid
-    } = this.props;
-    return (
-      <React.Fragment>
-        {isSymbol ? (
-          <div hidden>
-            <svg>
-              <symbol id={name} viewBox={viewBox}>
-                {children}
-              </symbol>
-            </svg>
-          </div>
-        ) : null}
-        {isRender && isSymbol ? (
-          <div
-            className={`${
-              size === 'large'
-                ? style.large
-                : size === 'small'
-                ? style.small
-                : isFluid
-                ? style.cover
-                : ''
-            } ${className} ${alignHorizontal ? style.svgCenter : ''} `}
-          >
-            <svg height='100%' width='100%'>
-              <use xlinkHref={`#${name}`} />
-            </svg>
-          </div>
-        ) : isRender ? (
-          <div
-            className={`${
-              size === 'large'
-                ? style.large
-                : size === 'small'
-                ? style.small
-                : isFluid
-                ? style.cover
-                : ''
-            } ${className} ${alignHorizontal ? style.svgCenter : ''} `}
-          >
-            <svg height='100%' width='100%' viewBox={viewBox}>
-              {children}
-            </svg>
-          </div>
-        ) : null}
-      </React.Fragment>
-    );
-  }
-}
-SVG.defaultProps = {
-  name: '',
-  viewBox: '',
-  isRender: true,
-  isSymbol: false,
-  className: '',
-  isFluid: false
-};
-SVG.propTypes = {
-  children: PropTypes.node,
-  isRender: PropTypes.bool,
-  isSymbol: PropTypes.bool,
-  name: PropTypes.string,
-  viewBox: PropTypes.string,
-  size: PropTypes.oneOf('small', 'large'),
-  className: PropTypes.string,
-  alignHorizontal: PropTypes.bool,
-  isFluid: PropTypes.bool
-};
-if (__DOCS__) {
-  SVG.docs = {
-    componentGroup: 'SVG'
-  };
-}

package/src/svg/SVG.module.css

@@ -1,27 +0,0 @@
-.cover {
-  height: 100%;
-}
-.large {
-  height: var(--zd_size150);
-  width: var(--zd_size150);
-}
-.small {
-  height: var(--zd_size130);
-  width: var(--zd_size130);
-}
-.svgCenter {
-  margin-left: auto;
-  margin-right: auto;
-}
-.loaderWrapper {
-  height: var(--zd_size40);
-  width: var(--zd_size40);
-}
-
-.center {
-  height: 100%;
-  width: 100%;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}

package/src/svg/SitBack.js

@@ -1,29 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types'
-import SVG from './SVG';
-import image from './images/SitBack.svg';
-export default class SitBack extends React.Component {
-  render() {
-    let { className, alignHorizontal } = this.props;
-    return (
-      <SVG viewBox='0 0 334.43 256.56' name='sitBack' className={className} alignHorizontal={alignHorizontal}>
-        <image xlinkHref={image} height='100%' width='100%' />
-      </SVG>
-    );
-  }
-}
-
-SitBack.propTypes = {
-  className : PropTypes.string,
-  alignHorizontal: PropTypes.bool
-}
-SitBack.defaultProps = {
-  className: '',
-  alignHorizontal : true
-}
-
-if (__DOCS__) {
-  SitBack.docs = {
-    componentGroup: 'SVG'
-  };
-}

package/src/svg/UnableToProcessRequest.js

@@ -1,38 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import SVG from './SVG';
-import image from './images/UnableToProcess.svg';
-export default class UnableToProcessRequest extends React.Component {
-  render() {
-    let { isRender, className, alignHorizontal, isFluid } = this.props;
-    return (
-      <SVG
-        viewBox='0 0 587.1 331.1'
-        name='UnableToProcessRequest'
-        isRender={isRender}
-        className={className}
-        alignHorizontal={alignHorizontal}
-        isFluid={isFluid}
-      >
-        <image xlinkHref={image} height='100%' width='100%' />
-      </SVG>
-    );
-  }
-}
-UnableToProcessRequest.propTypes = {
-  isRender: PropTypes.bool,
-  className: PropTypes.string,
-  alignHorizontal: PropTypes.bool,
-  isFluid: PropTypes.bool
-};
-UnableToProcessRequest.defaultProps = {
-  isRender: true,
-  className: '',
-  alignHorizontal: true
-};
-
-if (__DOCS__) {
-  UnableToProcessRequest.docs = {
-    componentGroup: 'SVG'
-  };
-}

package/src/svg/UnauthorizedLogin.js

@@ -1,38 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import SVG from './SVG';
-import image from './images/UnauthorizedLogin.svg';
-export default class UnauthorizedLogin extends React.Component {
-  render() {
-    let { isRender, className, alignHorizontal, isFluid } = this.props;
-    return (
-      <SVG
-        viewBox='0 0 519.3 288.6'
-        name='UnauthorizedLogin'
-        isRender={isRender}
-        className={className}
-        alignHorizontal={alignHorizontal}
-        isFluid={isFluid}
-      >
-        <image xlinkHref={image} height='100%' width='100%' />
-      </SVG>
-    );
-  }
-}
-UnauthorizedLogin.propTypes = {
-  isRender: PropTypes.bool,
-  alignHorizontal: PropTypes.bool,
-  className: PropTypes.string,
-  isFluid: PropTypes.bool
-};
-UnauthorizedLogin.defaultProps = {
-  isRender: true,
-  className: '',
-  alignHorizontal: true
-};
-
-if (__DOCS__) {
-  UnauthorizedLogin.docs = {
-    componentGroup: 'SVG'
-  };
-}

package/src/svg/UrlNotFound.js

@@ -1,38 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import SVG from './SVG';
-import image from './images/ReguestUrlNotFound.svg';
-export default class UrlNotFound extends React.Component {
-  render() {
-    let { isRender, className, alignHorizontal, isFluid } = this.props;
-    return (
-      <SVG
-        viewBox='0 0 614.2 310.2'
-        name='UrlNotFound'
-        isRender={isRender}
-        alignHorizontal={alignHorizontal}
-        className={className}
-        isFluid={isFluid}
-      >
-        <image xlinkHref={image} height='100%' width='100%' />
-      </SVG>
-    );
-  }
-}
-UrlNotFound.propTypes = {
-  isRender: PropTypes.bool,
-  className: PropTypes.string,
-  alignHorizontal: PropTypes.bool,
-  isFluid: PropTypes.bool
-};
-UrlNotFound.defaultProps = {
-  isRender: true,
-  alignHorizontal: true,
-  className: ''
-};
-
-if (__DOCS__) {
-  UrlNotFound.docs = {
-    componentGroup: 'SVG'
-  };
-}

package/src/svg/WillBeRightBack.js

@@ -1,38 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import SVG from './SVG';
-import image from './images/WillBack.svg';
-export default class WillBeRightBack extends React.Component {
-  render() {
-    let { isRender, className, alignHorizontal, isFluid } = this.props;
-    return (
-      <SVG
-        viewBox='0 0 889 490.6'
-        name='WillBeRightBack'
-        isRender={isRender}
-        className={className}
-        alignHorizontal={alignHorizontal}
-        isFluid={isFluid}
-      >
-        <image xlinkHref={image} height='100%' width='100%' />
-      </SVG>
-    );
-  }
-}
-WillBeRightBack.propTypes = {
-  isRender: PropTypes.bool,
-  className: PropTypes.string,
-  alignHorizontal: PropTypes.bool,
-  isFluid: PropTypes.bool
-};
-WillBeRightBack.defaultProps = {
-  isRender: true,
-  alignHorizontal: true,
-  className: ''
-};
-
-if (__DOCS__) {
-  WillBeRightBack.docs = {
-    componentGroup: 'SVG'
-  };
-}

package/src/svg/docs/SVG__default.docs.js

@@ -1,289 +0,0 @@
-import React from 'react';
-import EmptyActivity from '../EmptyActivity';
-import EmptyAccounts from '../EmptyAccounts';
-import EmptyAgent from '../EmptyAgent';
-import EmptyArchived from '../EmptyArchived';
-import EmptyBusinessHoliday from '../EmptyBusinessHoliday';
-import EmptyBusinessHour from '../EmptyBusinessHour';
-import EmptyBlueprint from '../EmptyBlueprint';
-import EmptyCloud from '../EmptyCloud';
-import EmptyCloudDanger from '../EmptyCloudDanger';
-import EmptyContact from '../EmptyContact';
-import EmptyDashboard from '../EmptyDashboard';
-import EmptyImportHistory from '../EmptyImportHistory';
-import EmptyInvoice from '../EmptyInvoice';
-import EmptyProducts from '../EmptyProducts';
-import EmptyRecycleBin from '../EmptyRecycleBin';
-import EmptyReports from '../EmptyReports';
-import EmptyRoles from '../EmptyRoles';
-import EmptySearch from '../EmptySearch';
-import EmptyTag from '../EmptyTag';
-import EmptyTask from '../EmptyTask';
-import EmptyTicket from '../EmptyTicket';
-import EmptyAttach from '../EmptyAttach';
-import EmptyNetwork from '../EmptyNetwork';
-import EmptyHappiness from '../EmptyHappiness';
-import EmptyConversation from '../EmptyConversation';
-import EmptyNotification from '../EmptyNotification';
-import EmptyTimeEntry from '../EmptyTimeEntry';
-import EmptyTeams from '../EmptyTeams';
-import EmptyTopic from '../EmptyTopic';
-import FailureLog from '../FailureLog';
-import InvalidUrl from '../InvalidUrl';
-import Inconvenience from '../Inconvenience';
-import NoRequestFound from '../NoRequestFound';
-import PageNotFound from '../PageNotFound';
-import UnableToProcessRequest from '../UnableToProcessRequest';
-import UnauthorizedLogin from '../UnauthorizedLogin';
-import UrlNotFound from '../UrlNotFound';
-import WillBeRightBack from '../WillBeRightBack';
-import EmptyActiveCalls from '../EmptyActiveCalls';
-import EmptyCallHistory from '../EmptyCallHistory';
-import EmptyHistory from '../EmptyHistory';
-import EmptyFromAddress from '../EmptyFromAddress';
-import EmptyWebhook from '../EmptyWebhook';
-import EmptyTemplate from '../EmptyTemplate';
-import EmptyEdition from '../EmptyEdition';
-import EmptySkills from '../EmptySkills';
-import EmptySnippet from '../EmptySnippet';
-import SitBack from '../SitBack';
-import Loader from '../Loader';
-
-export default class SVG__default extends React.Component {
-  render() {
-    let boxStyle = {
-      minWidth: '15%',
-      border: '1px solid #dcdcdc',
-      padding: '5px',
-      margin: '5px',
-      flex: '1'
-    };
-    let textStyle = {
-      textAlign: 'center',
-      padding: '10px 0',
-      background: ' #f9f9f9',
-      marginTop: '10px',
-      color: '#000'
-    };
-    return (
-      <React.Fragment>
-        <div
-          style={{
-            display: 'flex',
-            flexDirection: 'row',
-            alignItems: 'center',
-            justifyContent: 'center',
-            flexWrap: 'wrap'
-          }}
-        >
-          <div style={boxStyle}>
-            <EmptyTeams />
-            <div style={textStyle}>EmptyTeams</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyAgent />
-            <div style={textStyle}>EmptyAgent</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyTicket />
-            <div style={textStyle}>EmptyTicket</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyTask />
-            <div style={textStyle}>EmptyTask</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyContact />
-            <div style={textStyle}>EmptyContact</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyAccounts />
-            <div style={textStyle}>EmptyAccounts</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyActivity />
-            <div style={textStyle}>EmptyActivity</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyProducts />
-            <div style={textStyle}>EmptyProducts</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyDashboard />
-            <div style={textStyle}>EmptyDashboard</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyReports />
-            <div style={textStyle}>EmptyReports</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyTopic />
-            <div style={textStyle}>EmptyTopic</div>
-          </div>
-
-          <div style={boxStyle}>
-            <EmptyArchived />
-            <div style={textStyle}>EmptyArchived</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyBusinessHour />
-            <div style={textStyle}>EmptyBusinessHour</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyBusinessHoliday />
-            <div style={textStyle}>EmptyBusinessHoliday</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyBlueprint />
-            <div style={textStyle}>EmptyBlueprint</div>
-          </div>
-
-          <div style={boxStyle}>
-            <EmptyImportHistory />
-            <div style={textStyle}>EmptyImportHistory</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyInvoice />
-            <div style={textStyle}>EmptyInvoice</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyRecycleBin />
-            <div style={textStyle}>EmptyRecycleBin</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyRoles />
-            <div style={textStyle}>EmptyRoles</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptySearch />
-            <div style={textStyle}>EmptySearch</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyTag />
-            <div style={textStyle}>EmptyTag</div>
-          </div>
-          <div style={boxStyle}>
-            <FailureLog />
-            <div style={textStyle}>FailureLog</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyActiveCalls />
-            <div style={textStyle}>EmptyActiveCalls</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyCallHistory />
-            <div style={textStyle}>EmptyCallHistory</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyHistory />
-            <div style={textStyle}>EmptyHistory</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyFromAddress />
-            <div style={textStyle}>EmptyFromAddress</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyWebhook />
-            <div style={textStyle}>EmptyWebhook</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyTemplate />
-            <div style={textStyle}>EmptyTemplate</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyEdition />
-            <div style={textStyle}>EmptyEdition</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyTimeEntry />
-            <div style={textStyle}>EmptyTimeEntry</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyNotification />
-            <div style={textStyle}>EmptyNotification</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyNetwork />
-            <div style={textStyle}>EmptyNetwork</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyHappiness />
-            <div style={textStyle}>EmptyHappiness</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyConversation />
-            <div style={textStyle}>EmptyConversation</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptySnippet />
-            <div style={textStyle}>EmptySnippet</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptySkills />
-            <div style={textStyle}>EmptySkills</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyAttach />
-            <div style={textStyle}>EmptyAttach</div>
-          </div>
-
-          <div style={boxStyle}>
-            <EmptyCloud />
-            <div style={textStyle}>EmptyCloud</div>
-          </div>
-          <div style={boxStyle}>
-            <EmptyCloudDanger />
-            <div style={textStyle}>EmptyCloudDanger</div>
-          </div>
-          <div style={boxStyle}>
-            <Inconvenience />
-            <div style={textStyle}>Inconvenience</div>
-          </div>
-          <div style={boxStyle}>
-            <InvalidUrl />
-            <div style={textStyle}>InvalidUrl</div>
-          </div>
-          <div style={boxStyle}>
-            <NoRequestFound />
-            <div style={textStyle}>NoRequestFound</div>
-          </div>
-          <div style={boxStyle}>
-            <PageNotFound />
-            <div style={textStyle}>PageNotFound</div>
-          </div>
-          <div style={boxStyle}>
-            <UnableToProcessRequest />
-            <div style={textStyle}>UnableToProcessRequest</div>
-          </div>
-          <div style={boxStyle}>
-            <UnauthorizedLogin />
-            <div style={textStyle}>UnathorizedLogin</div>
-          </div>
-          <div style={boxStyle}>
-            <UrlNotFound />
-            <div style={textStyle}>UrlNotFound</div>
-          </div>
-          <div style={boxStyle}>
-            <WillBeRightBack />
-            <div style={textStyle}>WillBeRightBack</div>
-          </div>
-          <div style={boxStyle}>
-            <SitBack />
-            <div style={textStyle}>SitBack</div>
-          </div>
-          <div style={boxStyle}>
-            <div style={{ height: '40px', width: '40px', margin: 'auto' }}>
-              <Loader />
-            </div>
-            <div style={textStyle}>Loader</div>
-          </div>
-        </div>
-      </React.Fragment>
-    );
-  }
-}
-if (__DOCS__) {
-  SVG__default.docs = {
-    componentGroup: 'SVG'
-  };
-}