@zohodesk/svg 1.0.0-temp-9 → 1.0.0-temp.42

package/src/Provider.js

@@ -1,141 +0,0 @@
-import React from 'react';
-import AppContainer from '@zohodesk/components/lib/AppContainer/AppContainer';
-import { Container } from '@zohodesk/components/lib/Layout';
-import Switch from '@zohodesk/components/lib/Switch/Switch';
-import '@zohodesk/components/lib/Appearance/default/mode/defaultMode.module.css';
-import '@zohodesk/components/lib/Appearance/dark/mode/darkMode.module.css';
-/* default mode & themes */
-import './svg/Appearance/default/themes/blue/blueDefaultCTATheme.module.css';
-import './svg/Appearance/default/themes/green/greenDefaultCTATheme.module.css';
-import './svg/Appearance/default/themes/orange/orangeDefaultCTATheme.module.css';
-import './svg/Appearance/default/themes/red/redDefaultCTATheme.module.css';
-import './svg/Appearance/default/themes/yellow/yellowDefaultCTATheme.module.css';
-import './svg/Appearance/default/mode/defaultEmptyStates.module.css';
-/* dark mode & themes */
-import './svg/Appearance/dark/themes/blue/blueDarkCTATheme.module.css';
-import './svg/Appearance/dark/themes/green/greenDarkCTATheme.module.css';
-import './svg/Appearance/dark/themes/orange/orangeDarkCTATheme.module.css';
-import './svg/Appearance/dark/themes/red/redDarkCTATheme.module.css';
-import './svg/Appearance/dark/themes/yellow/yellowDarkCTATheme.module.css';
-import './svg/Appearance/dark/mode/darkEmptyStates.module.css';
-
-export default class Provider extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      appearanceName: 'default',
-      themeName: 'blue'
-    };
-
-    this.switchMode = this.switchMode.bind(this);
-    this.setTheme = this.setTheme.bind(this);
-  }
-
-  switchMode() {
-    let appearanceName = this.state.appearanceName;
-    if (appearanceName == 'default') {
-      this.setState({
-        appearanceName: 'dark'
-      });
-    } else {
-      this.setState({
-        appearanceName: 'default'
-      });
-    }
-  }
-
-  setTheme(theme) {
-    this.setState({
-      themeName: theme
-    });
-  }
-
-  render() {
-    let { appearanceName, themeName } = this.state;
-    let themeClass = {
-      width: '20px',
-      height: '20px',
-      borderRadius: '3px',
-      display: 'flex',
-      border: '1px solid #ccc',
-      margin: '0 5px',
-      cursor: 'pointer',
-      backgroundColor: '#0a73eb'
-    };
-    let green = {
-      backgroundColor: '#26a942'
-    };
-    let red = {
-      backgroundColor: '#de3535'
-    };
-    let orange = {
-      backgroundColor: '#e57717'
-    };
-    let yellow = {
-      backgroundColor: '#e8b923'
-    };
-    
-    return (
-      <AppContainer 
-        customProps={{ExtraProps:{'data-mode':appearanceName,'data-theme':themeName}}}
-      >
-        <Container scroll='vertical'>{this.props.children}</Container>
-        <div
-          style={{
-            position: 'fixed',
-            bottom: '0',
-            backgroundColor: '#272727',
-            padding: '10px',
-            borderRadius: '15px 15px 0 0',
-            minWidth: '100px',
-            textAlign: 'center',
-            left: '50%',
-            transform: 'translate(-50%)',
-            boxShadow: '0 0 3px #000',
-            fontSize: '12px',
-            zIndex: '3',
-            display: 'flex',
-            alignItems: 'center'
-          }}
-        >
-          <div>
-            <Switch
-              id='switchMode'
-              text='Light/Night Mode'
-              labelSize='small'
-              onChange={this.switchMode}
-              checked={appearanceName == 'dark'}
-            />
-          </div>
-          <div style={{display: 'flex'}}>
-            <span 
-              title='Blue Theme' 
-              style={themeClass}
-              onClick={() => this.setTheme('blue')}
-            ></span>
-            <span 
-              title='Green Theme' 
-              style={Object.assign({}, themeClass, green)}
-              onClick={() => this.setTheme('green')}
-            ></span>
-            <span 
-              title='Red Theme' 
-              style={Object.assign({}, themeClass, red)}
-              onClick={() => this.setTheme('red')}
-            ></span>
-            <span 
-              title='Orange Theme' 
-              style={Object.assign({}, themeClass, orange)}
-              onClick={() => this.setTheme('orange')}
-            ></span>
-            <span 
-              title='Yellow Theme' 
-              style={Object.assign({}, themeClass, yellow)}
-              onClick={() => this.setTheme('yellow')}
-            ></span>
-          </div>
-        </div>
-      </AppContainer>
-    );
-  }
-}

package/src/index.js

@@ -1,10 +0,0 @@
-export { default as React } from 'react';
-export { default as ReactDOM } from 'react-dom';
-export { renderToStaticMarkup } from 'react-dom/server';
-import '@zohodesk/variables/lib/sizeVariables.module.css';
-
-export { default as _provider } from './Provider';
-export { default as SVG } from './svg/SVG';
-export { default as SVG__emptystate } from './svg/docs/SVG__default.docs';
-export { default as SVG__common } from './svg/docs/SVG__common.docs';
-export { default as SVG__errorstate } from './svg/docs/SVG__errorstate.docs';

package/src/svg/Appearance/dark/mode/darkEmptyStates.module.css

@@ -1,37 +0,0 @@
-[data-mode='dark'] {
-  /* default palette */
-  --zdt_svg_default_primary_fill: var(--zdt_cta_primary_fill);
-  --zdt_svg_default_primary_stroke: var(--zdt_cta_primary_stroke);
-  --zdt_svg_default_secondary_fill: var(--zdt_cta_secondary_fill);
-  --zdt_svg_default_secondary_plainfill: var(--zdt_cta_secondary_plainfill);
-  --zdt_svg_default_plus: #479dff;
-  --zdt_svg_default_cross: #5cc1a5;
-  --zdt_svg_default_medium_circle: #ff6b6b;
-  --zdt_svg_default_tiny_circle: #4ac064;
-  --zdt_svg_default_small_circle: #ff6b6b;
-  --zdt_svg_default_circle_fill: #fff;
-
-  /* dark palette */
-  --zdt_svg_dark_primary_fill: var(--zdt_cta_primary_dark_fill);
-  --zdt_svg_dark_primary_stroke: var(--zdt_cta_primary_dark_stroke);
-  --zdt_svg_dark_secondary_fill: var(--zdt_cta_secondary_dark_fill);
-  --zdt_svg_dark_secondary_plainfill: var(--zdt_cta_secondary_dark_plainfill);
-  --zdt_svg_dark_plus: #479dff;
-  --zdt_svg_dark_cross: #5cc1a5;
-  --zdt_svg_dark_medium_circle: #ff6b6b;
-  --zdt_svg_dark_tiny_circle: #4ac064;
-  --zdt_svg_dark_small_circle: #ff6b6b;
-  --zdt_svg_dark_circle_fill: #fff;
-
-  /* danger palette */
-  --zdt_svg_danger_primary_fill: #ff6f00;
-  --zdt_svg_danger_primary_stroke: #479dff;
-  --zdt_svg_danger_secondary_fill: #334b68;
-  --zdt_svg_danger_secondary_plainfill: #334b68;
-  --zdt_svg_danger_plus: #479dff;
-  --zdt_svg_danger_cross: #5cc1a5;
-  --zdt_svg_danger_medium_circle: #ff6b6b;
-  --zdt_svg_danger_tiny_circle: #4ac064;
-  --zdt_svg_danger_small_circle: #ff6b6b;
-  --zdt_svg_danger_circle_fill: #fff;
-}

package/src/svg/Appearance/dark/themes/blue/blueDarkCTATheme.module.css

@@ -1,10 +0,0 @@
-[data-mode='dark'][data-theme='blue'] {
-    --zdt_cta_primary_fill: #828994;
-    --zdt_cta_primary_stroke: #479dff;
-    --zdt_cta_secondary_fill: #334b68;
-    --zdt_cta_secondary_plainfill: #334b68;
-    --zdt_cta_primary_dark_fill: #828994;
-    --zdt_cta_primary_dark_stroke: #479dff;
-    --zdt_cta_secondary_dark_fill: #334b68;
-    --zdt_cta_secondary_dark_plainfill: #334b68;
-}

package/src/svg/Appearance/dark/themes/green/greenDarkCTATheme.module.css

@@ -1,10 +0,0 @@
-[data-mode='dark'][data-theme='green'] {
-    --zdt_cta_primary_fill: #45a159;
-    --zdt_cta_primary_stroke: #45a159;
-    --zdt_cta_secondary_fill: rgba(69, 161, 89, 0.25);
-    --zdt_cta_secondary_plainfill: #45a159;
-    --zdt_cta_primary_dark_fill: #45a159;
-    --zdt_cta_primary_dark_stroke: #45a159;
-    --zdt_cta_secondary_dark_fill: rgba(69, 161, 89, 0.25);
-    --zdt_cta_secondary_dark_plainfill: #45a159;
-}

package/src/svg/Appearance/dark/themes/orange/orangeDarkCTATheme.module.css

@@ -1,10 +0,0 @@
-[data-mode='dark'][data-theme='orange'] {
-    --zdt_cta_primary_fill: #ff801f;
-    --zdt_cta_primary_stroke: #ff801f;
-    --zdt_cta_secondary_fill: rgba(255, 128, 31, 0.25);
-    --zdt_cta_secondary_plainfill: #ff801f;
-    --zdt_cta_primary_dark_fill: #ff801f;
-    --zdt_cta_primary_dark_stroke: #ff801f;
-    --zdt_cta_secondary_dark_fill: rgba(255, 128, 31, 0.25);
-    --zdt_cta_secondary_dark_plainfill: #ff801f;
-}

package/src/svg/Appearance/dark/themes/red/redDarkCTATheme.module.css

@@ -1,10 +0,0 @@
-[data-mode='dark'][data-theme='red'] {
-    --zdt_cta_primary_fill: #e94f4f;
-    --zdt_cta_primary_stroke: #e94f4f;
-    --zdt_cta_secondary_fill: rgba(233, 79, 79, 0.25);
-    --zdt_cta_secondary_plainfill: #e94f4f;
-    --zdt_cta_primary_dark_fill: #e94f4f;
-    --zdt_cta_primary_dark_stroke: #e94f4f;
-    --zdt_cta_secondary_dark_fill: rgba(233, 79, 79, 0.25);
-    --zdt_cta_secondary_dark_plainfill: #e94f4f;
-}

package/src/svg/Appearance/dark/themes/yellow/yellowDarkCTATheme.module.css

@@ -1,10 +0,0 @@
-[data-mode='dark'][data-theme='yellow'] {
-    --zdt_cta_primary_fill: #d79835;
-    --zdt_cta_primary_stroke: #d79835;
-    --zdt_cta_secondary_fill: rgba(215, 152, 53, 0.25);
-    --zdt_cta_secondary_plainfill: #d79835;
-    --zdt_cta_primary_dark_fill: #d79835;
-    --zdt_cta_primary_dark_stroke: #d79835;
-    --zdt_cta_secondary_dark_fill: rgba(215, 152, 53, 0.25);
-    --zdt_cta_secondary_dark_plainfill: #d79835;
-}

package/src/svg/Appearance/default/mode/defaultEmptyStates.module.css

@@ -1,37 +0,0 @@
-[data-mode='default'] {
-  /* default palette */
-  --zdt_svg_default_primary_fill: var(--zdt_cta_primary_fill);
-  --zdt_svg_default_primary_stroke: var(--zdt_cta_primary_stroke);
-  --zdt_svg_default_secondary_fill: var(--zdt_cta_secondary_fill);
-  --zdt_svg_default_secondary_plainfill: var(--zdt_cta_secondary_plainfill);
-  --zdt_svg_default_plus: #3f70b7;
-  --zdt_svg_default_cross: #5cc1a5;
-  --zdt_svg_default_medium_circle: #e56471;
-  --zdt_svg_default_tiny_circle: #5cc1a5;
-  --zdt_svg_default_small_circle: #010101;
-  --zdt_svg_default_circle_fill: #fff;
-
-  /* dark palette */
-  --zdt_svg_dark_primary_fill: var(--zdt_cta_primary_dark_fill);
-  --zdt_svg_dark_primary_stroke: var(--zdt_cta_primary_dark_stroke);
-  --zdt_svg_dark_secondary_fill: var(--zdt_cta_secondary_dark_fill);
-  --zdt_svg_dark_secondary_plainfill: var(--zdt_cta_secondary_dark_plainfill);
-  --zdt_svg_dark_plus: #479dff;
-  --zdt_svg_dark_cross: #5cc1a5;
-  --zdt_svg_dark_medium_circle: #e56471;
-  --zdt_svg_dark_tiny_circle: #5cc1a5;
-  --zdt_svg_dark_small_circle: #010101;
-  --zdt_svg_dark_circle_fill: #fff;
-
-  /* danger palette */
-  --zdt_svg_danger_primary_fill: #ff6f00;
-  --zdt_svg_danger_primary_stroke: #010101;
-  --zdt_svg_danger_secondary_fill: rgba(63, 112, 183, 0.25);
-  --zdt_svg_danger_secondary_plainfill: #3f70b7;
-  --zdt_svg_danger_plus: #3f70b7;
-  --zdt_svg_danger_cross: #5cc1a5;
-  --zdt_svg_danger_medium_circle: #e56471;
-  --zdt_svg_danger_tiny_circle: #5cc1a5;
-  --zdt_svg_danger_small_circle: #010101;
-  --zdt_svg_danger_circle_fill: #fff;
-}

package/src/svg/Appearance/default/themes/blue/blueDefaultCTATheme.module.css

@@ -1,10 +0,0 @@
-[data-mode='default'][data-theme='blue'] {
-    --zdt_cta_primary_fill: #0a73eb;
-    --zdt_cta_primary_stroke: #221f1f;
-    --zdt_cta_secondary_fill: rgba(10, 115, 235, 0.25);
-    --zdt_cta_secondary_plainfill: #0a73eb;
-    --zdt_cta_primary_dark_fill: #a6add7;
-    --zdt_cta_primary_dark_stroke: #fff;
-    --zdt_cta_secondary_dark_fill: #3f70b7;
-    --zdt_cta_secondary_dark_plainfill: #3f70b7;
-}

package/src/svg/Appearance/default/themes/green/greenDefaultCTATheme.module.css

@@ -1,10 +0,0 @@
-[data-mode='default'][data-theme='green'] {
-    --zdt_cta_primary_fill: #26a942;
-    --zdt_cta_primary_stroke: #010101;
-    --zdt_cta_secondary_fill: rgba(38, 169, 66, 0.25);
-    --zdt_cta_secondary_plainfill: #26a942;
-    --zdt_cta_primary_dark_fill: #26a942;
-    --zdt_cta_primary_dark_stroke: #fff;
-    --zdt_cta_secondary_dark_fill: rgba(38, 169, 66, 0.25);
-    --zdt_cta_secondary_dark_plainfill: #26a942;
-}

package/src/svg/Appearance/default/themes/orange/orangeDefaultCTATheme.module.css

@@ -1,10 +0,0 @@
-[data-mode='default'][data-theme='orange'] {
-    --zdt_cta_primary_fill: #e57717;
-    --zdt_cta_primary_stroke: #010101;
-    --zdt_cta_secondary_fill: rgba(229, 119, 23, 0.25);
-    --zdt_cta_secondary_plainfill: #e57717;
-    --zdt_cta_primary_dark_fill: #e57717;
-    --zdt_cta_primary_dark_stroke: #fff;
-    --zdt_cta_secondary_dark_fill: rgba(229, 119, 23, 0.25);
-    --zdt_cta_secondary_dark_plainfill: #e57717;
-}

package/src/svg/Appearance/default/themes/red/redDefaultCTATheme.module.css

@@ -1,10 +0,0 @@
-[data-mode='default'][data-theme='red'] {
-    --zdt_cta_primary_fill: #de3535;
-    --zdt_cta_primary_stroke: #010101;
-    --zdt_cta_secondary_fill: rgba(222, 53, 53, 0.25);
-    --zdt_cta_secondary_plainfill: #de3535;
-    --zdt_cta_primary_dark_fill: #de3535;
-    --zdt_cta_primary_dark_stroke: #fff;
-    --zdt_cta_secondary_dark_fill: rgba(222, 53, 53, 0.25);
-    --zdt_cta_secondary_dark_plainfill: #de3535;
-}

package/src/svg/Appearance/default/themes/yellow/yellowDefaultCTATheme.module.css

@@ -1,10 +0,0 @@
-[data-mode='default'][data-theme='yellow'] {
-    --zdt_cta_primary_fill: #e8b923;
-    --zdt_cta_primary_stroke: #010101;
-    --zdt_cta_secondary_fill: rgba(232, 185, 35, 0.25);
-    --zdt_cta_secondary_plainfill: #e8b923;
-    --zdt_cta_primary_dark_fill: #e8b923;
-    --zdt_cta_primary_dark_stroke: #fff;
-    --zdt_cta_secondary_dark_fill: rgba(232, 185, 35, 0.25);
-    --zdt_cta_secondary_dark_plainfill: #e8b923;
-}

package/src/svg/EmptyAccounts.js

@@ -1,121 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import SVG from './SVG';
-
-export default class EmptyAccounts extends React.Component {
-  render() {
-    return (
-      <SVG viewBox="0 0 200 200" name="accounts" {...this.props}>
-        <defs>
-          <style>
-            {
-              ".EmptyAccounts_svg__cls-7,.EmptyAccounts_svg__cls-9{fill:var(--zd_emptysvg_secondary_fill)}.EmptyAccounts_svg__cls-3,.EmptyAccounts_svg__cls-4,.EmptyAccounts_svg__cls-5,.EmptyAccounts_svg__cls-6,.EmptyAccounts_svg__cls-8{fill:none}.EmptyAccounts_svg__cls-3{stroke-miterlimit:10;stroke:var(--zd_emptysvg_cross)}.EmptyAccounts_svg__cls-8{stroke-miterlimit:10;stroke:var(--zd_emptysvg_tiny_circle)}.EmptyAccounts_svg__cls-4,.EmptyAccounts_svg__cls-5{stroke:var(--zd_emptysvg_plus);stroke-linecap:round;stroke-linejoin:round}.EmptyAccounts_svg__cls-5{stroke:var(--zd_emptysvg_primary_stroke)}.EmptyAccounts_svg__cls-6{stroke:var(--zd_emptysvg_small_circle);stroke-linecap:round;stroke-linejoin:round}"
-            }
-          </style>
-        </defs>
-        <path
-          d="M86.51 62.52S133.43 31.67 157.17 41s40 87.37-26.06 122.41S35.22 122.19 35 108.68c-.28-13.07 0-44.23 51.51-46.16z"
-          opacity={0.05}
-          fill="var(--zd_emptysvg_primary_fill)"
-        />
-        <ellipse
-          cx={156.04}
-          cy={31.69}
-          rx={3.54}
-          ry={3.51}
-          strokeMiterlimit={10}
-          stroke="var(--zd_emptysvg_medium_circle)"
-          fill="none"
-        />
-        <ellipse
-          className="EmptyAccounts_svg__cls-8"
-          cx={79.62}
-          cy={29.6}
-          rx={2.12}
-          ry={2.1}
-        />
-        <path
-          className="EmptyAccounts_svg__cls-4"
-          d="M23.28 100.86l-.35 6.16M20 103.76l6.22.35"
-        />
-        <ellipse
-          className="EmptyAccounts_svg__cls-6"
-          cx={165.88}
-          cy={154.09}
-          rx={2.45}
-          ry={2.43}
-        />
-        <path
-          className="EmptyAccounts_svg__cls-3"
-          d="M175.6 117.21l4.15 4.6M175.36 121.57l4.64-4.12"
-        />
-        <g opacity={0.3}>
-          <ellipse
-            className="EmptyAccounts_svg__cls-7"
-            cx={70.01}
-            cy={92.77}
-            rx={13.53}
-            ry={13.42}
-          />
-          <path
-            className="EmptyAccounts_svg__cls-7"
-            d="M128.12 74.12s5.37-7.3 17.62-.47 3.25 28-11.37 26.24c0 0-4.75-.87-6.36-2-.01-.02 4.36-11.67.11-23.77z"
-          />
-          <ellipse
-            className="EmptyAccounts_svg__cls-7"
-            cx={104.52}
-            cy={81.92}
-            rx={18.72}
-            ry={18.56}
-          />
-        </g>
-        <g>
-          <ellipse
-            className="EmptyAccounts_svg__cls-9"
-            cx={70.01}
-            cy={92.77}
-            rx={13.53}
-            ry={13.42}
-          />
-          <path
-            className="EmptyAccounts_svg__cls-9"
-            d="M128.12 74.12s5.37-7.3 17.62-.47 3.25 28-11.37 26.24c0 0-4.75-.87-6.36-2-.01-.02 4.36-11.67.11-23.77z"
-          />
-          <ellipse
-            className="EmptyAccounts_svg__cls-9"
-            cx={104.52}
-            cy={81.92}
-            rx={18.72}
-            ry={18.56}
-          />
-        </g>
-        <path
-          className="EmptyAccounts_svg__cls-5"
-          d="M43.12 137.27s26.19 17.89 43.6 1.66a6.4 6.4 0 002-4c.65-6.42 1-24.27-14.68-29.35a17.28 17.28 0 007.88-8.3c2.6-6.49 1.34-16.24-9-18.38-17.24-3.58-19.41 15-13 22.12l3.78 4.56s-18.89 12.48-16.32 23.95c0 0 13.38 12.34 30.06 7.68 0 0 23 28.3 52.82 2.18a7.2 7.2 0 002.43-5.47c-.07-8.11-1.8-29-17-36.76 0 0-13.62 12.11-26.54-3.49s3-32.37 14.56-31 23 5.12 19.49 30.5c0 0 7.75 12.35 20.9 3.5s5.17-20.73 1.65-23.06-13.1-5.77-17.62.47a35.44 35.44 0 01-7.18 35.44 29.18 29.18 0 00-6 10.41c-.88 2.75-1.33 5.66-.39 7.71 2.27 4.95 26.73 11 40.87-2.31a4.65 4.65 0 001.47-3.5c-.06-4.26-1.32-13.89-10.87-18.18 0 0 11.51 20.26 2.12 32.84"
-        />
-      </SVG>
-    );
-  }
-}
-
-EmptyAccounts.propTypes = {
-  alignHorizontal: PropTypes.bool,
-  className: PropTypes.string,
-  dataId: PropTypes.string,
-  isRender: PropTypes.bool,
-  size: PropTypes.oneOf(['small', 'large']),
-  palette: PropTypes.oneOf(['default', 'dark'])
-};
-EmptyAccounts.defaultProps = {
-  size: 'large',
-  alignHorizontal: true,
-  isRender: true,
-  className: '',
-  dataId: 'emptyAccounts',
-  palette: 'default'
-};
-if (__DOCS__) {
-  EmptyAccounts.docs = {
-    componentGroup: 'SVG'
-  };
-}

package/src/svg/EmptyActiveCalls.js

@@ -1,85 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import SVG from './SVG';
-
-export default class EmptyActiveCalls extends React.Component {
-  render() {
-    return (
-      <SVG viewBox='0 0 200 200' name='ActiveCalls' {...this.props}>
-        <defs>
-          <style>
-            {
-              ".EmptyActiveCalls_svg__cls-4,.EmptyActiveCalls_svg__cls-5,.EmptyActiveCalls_svg__cls-6,.EmptyActiveCalls_svg__cls-7,.EmptyActiveCalls_svg__cls-8{fill:none}.EmptyActiveCalls_svg__cls-4{stroke-miterlimit:10;stroke:var(--zd_emptysvg_cross)}.EmptyActiveCalls_svg__cls-7{stroke-miterlimit:10;stroke:var(--zd_emptysvg_tiny_circle)}.EmptyActiveCalls_svg__cls-5,.EmptyActiveCalls_svg__cls-6{stroke:var(--zd_emptysvg_plus);stroke-linecap:round;stroke-linejoin:round}.EmptyActiveCalls_svg__cls-6{stroke:var(--zd_emptysvg_primary_stroke)}.EmptyActiveCalls_svg__cls-8{stroke:var(--zd_emptysvg_small_circle);stroke-linecap:round;stroke-linejoin:round}"
-            }
-          </style>
-        </defs>
-        <path
-          d="M86.51 62.52S133.43 31.67 157.17 41s40 87.37-26.06 122.41S35.22 122.19 35 108.68c-.28-13.07 0-44.23 51.51-46.16z"
-          fill="var(--zd_emptysvg_primary_fill)"
-          opacity={0.05}
-        />
-        <ellipse
-          cx={156.04}
-          cy={31.69}
-          rx={3.54}
-          ry={3.51}
-          strokeMiterlimit={10}
-          stroke="var(--zd_emptysvg_medium_circle)"
-          fill="none"
-        />
-        <ellipse
-          className="EmptyActiveCalls_svg__cls-7"
-          cx={79.62}
-          cy={29.6}
-          rx={2.12}
-          ry={2.1}
-        />
-        <path
-          className="EmptyActiveCalls_svg__cls-5"
-          d="M23.28 100.86l-.35 6.16M20 103.76l6.22.35"
-        />
-        <ellipse
-          className="EmptyActiveCalls_svg__cls-8"
-          cx={165.88}
-          cy={154.09}
-          rx={2.45}
-          ry={2.43}
-        />
-        <path
-          className="EmptyActiveCalls_svg__cls-4"
-          d="M175.6 117.21l4.15 4.6M175.36 121.57l4.64-4.12"
-        />
-        <path
-          d="M79.93 53.67c6.28.38 9.53 13.52 8.06 18.09s-6.15 4.54-10.33-1.48-2-16.09-2-16.09c.53-.82 4.27-.52 4.27-.52zm15.35 57.76s3.88 8.57 9.94 10.57 8.88 3.58 10.12-.5c0 0-2.21-10.29-14.9-12.13 0-.02-2.16-.24-5.16 2.06z"
-          fill="var(--zd_emptysvg_secondary_fill)"
-        />
-        <path
-          className="EmptyActiveCalls_svg__cls-6"
-          d="M64.76 119.92h18.49S67.07 90.31 65.72 83.25s-3.66-20.63 3.86-26 13.67-4.2 15.79 0 6.75 22-4 17c0 0-7.13-4.2-6.55-17a3.4 3.4 0 00-3 2.82c-.61 2.7.49 12.49 6.46 16a7.05 7.05 0 01-4.77 1.67s6.92 21.53 19.17 36.42c0 0 5.39-8.09 13-3.32s11.51 8.81 9 15-12.39 9.25-19 6.65-10.5-9.69-10.5-9.69 12.1 12.72 24.34 3.76c0 0-12.09-2.75-13.84-10 0 0 .57-2.1 1.19-2.1a21.06 21.06 0 0016.49 9.68s-4.48 8-3.5 9.25 8.47 18.38 20.72 13.88 9.31-21.6 20.65-24.75 17.93-2.92 17.93-2.92"
-        />
-      </SVG>
-    );
-  }
-}
-EmptyActiveCalls.propTypes = {
-  alignHorizontal: PropTypes.bool,
-  className: PropTypes.string,
-  dataId: PropTypes.string,
-  isRender: PropTypes.bool,
-  size: PropTypes.oneOf(['small', 'large']),
-  palette: PropTypes.oneOf(['default', 'dark'])
-};
-EmptyActiveCalls.defaultProps = {
-  size: 'large',
-  alignHorizontal: true,
-  isRender: true,
-  className: '',
-  dataId: 'emptyActiveCalls',
-  palette: 'default'
-};
-
-if (__DOCS__) {
-  EmptyActiveCalls.docs = {
-    componentGroup: 'SVG'
-  };
-}

package/src/svg/EmptyActivity.js

@@ -1,85 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import SVG from './SVG';
-
-export default class EmptyActivity extends React.Component {
-  render() {
-    return (
-      <SVG viewBox='0 0 200 200' name='EmptyActivity' {...this.props}>
-        <defs>
-          <style>
-            {
-              ".EmptyActivity_svg__cls-4,.EmptyActivity_svg__cls-5,.EmptyActivity_svg__cls-6,.EmptyActivity_svg__cls-7,.EmptyActivity_svg__cls-8{fill:none}.EmptyActivity_svg__cls-4,.EmptyActivity_svg__cls-7{stroke-miterlimit:10;stroke:var(--zd_emptysvg_tiny_circle)}.EmptyActivity_svg__cls-7{stroke:var(--zd_emptysvg_cross)}.EmptyActivity_svg__cls-5,.EmptyActivity_svg__cls-6{stroke:var(--zd_emptysvg_plus);stroke-linecap:round;stroke-linejoin:round}.EmptyActivity_svg__cls-6{stroke:var(--zd_emptysvg_primary_stroke)}.EmptyActivity_svg__cls-8{stroke:var(--zd_emptysvg_small_circle);stroke-linecap:round;stroke-linejoin:round}"
-            }
-          </style>
-        </defs>
-        <path
-          d="M86.51 62.52S133.43 31.67 157.17 41s40 87.37-26.06 122.41S35.22 122.19 35 108.68c-.28-13.07 0-44.23 51.51-46.16z"
-          fill="var(--zd_emptysvg_primary_fill)"
-          opacity={0.05}
-        />
-        <ellipse
-          cx={156.04}
-          cy={31.69}
-          rx={3.54}
-          ry={3.51}
-          strokeMiterlimit={10}
-          stroke="var(--zd_emptysvg_medium_circle)"
-          fill="none"
-        />
-        <ellipse
-          className="EmptyActivity_svg__cls-4"
-          cx={79.62}
-          cy={29.6}
-          rx={2.12}
-          ry={2.1}
-        />
-        <path
-          className="EmptyActivity_svg__cls-5"
-          d="M23.28 100.86l-.35 6.16M20 103.76l6.22.35"
-        />
-        <ellipse
-          className="EmptyActivity_svg__cls-8"
-          cx={165.88}
-          cy={154.09}
-          rx={2.45}
-          ry={2.43}
-        />
-        <path
-          className="EmptyActivity_svg__cls-7"
-          d="M175.6 117.21l4.15 4.6M175.36 121.57l4.64-4.12"
-        />
-        <path
-          d="M52.32 87.6s-.42-19.95 4.36-22.43 82.26.24 82.26.24 7.43-.07 8.34 6.9a37.49 37.49 0 010 11.36H62.64S53 83.55 52.32 87.6zm89.31 9.77c-.65.6 1.27 3.73 4.3 7s6 5.44 6.66 4.84-1.27-3.73-4.29-7-6.01-5.43-6.67-4.84zM110 108.52c.64.62 3.68-1.48 6.78-4.68s5.1-6.28 4.46-6.89-3.67 1.48-6.78 4.68-5.07 6.28-4.46 6.89z"
-          fill="var(--zd_emptysvg_secondary_fill)"
-        />
-        <path
-          className="EmptyActivity_svg__cls-6"
-          d="M122 123.76s12.07-.32 12.07 1-3.38 2.87-3.54-1.92-.16-14.52-.16-14.52 17.86.32 16.25 16.44-17.86 15.32-24 12.13-10.61-12.54-6.33-23.21c5-12.39 30.24-9.43 33.14 5.09s-7 25.49-22.51 22.64C112.5 138.71 110 125.7 112 117.22a17.58 17.58 0 016-10.89l.35-.35-.37-.55a1.59 1.59 0 00-2.43-.17c-1.28 1.34-3.74 3.7-5.07 3.5-1.86-.28-.29-3-.29-3s8.62-10.24 10.48-9.26-2.35 6-2.35 6l1.56 1.7c11.62-4 22.6.73 22.6.73l1.57-1.69s-4.21-5-2.35-6 10.47 9.26 10.47 9.26 1.57 2.68-.28 3-5.9-4.39-5.9-4.39c-.62-.18-1.31.55-2 1.61l.34.27a18.55 18.55 0 016.8 14.75l-.29 14.66c-.51 7.15-7.41 8.22-7.41 8.22s-74.65.31-81.77 0-8-7.22-8-7.22.56-38.08 0-46.42 9-7.31 9-7.31h83.61a3.73 3.73 0 013.43 2.28c3.69 8.88 2 14.37 1.2 14.4-1.06 0-.06-22.19-.06-22.19 0-1.56 0-3.48.06-5.81.11-8.23-12.84-7-12.84-7l-6.89.15s-2.09 8-6.13 8.17-2.1-16.48.45-17.67 4.34 8.46 2.54 9.2c-.9.38-3.79.4-8.6.31L88 65.45h-5.59s-2.09 8-6.13 8.17-2.08-16.46.46-17.62 4.35 8.46 2.55 9.2c-.9.38-5.32.38-10.13.28h-4.71c-4.81-.09-12.1-.6-13.45 1.16-1.53 2-1 2.19-1.28 5.58v41.65"
-        />
-      </SVG>
-    );
-  }
-}
-EmptyActivity.propTypes = {
-  alignHorizontal: PropTypes.bool,
-  className: PropTypes.string,
-  dataId: PropTypes.string,
-  isRender: PropTypes.bool,
-  size: PropTypes.oneOf(['small', 'large']),
-  palette: PropTypes.oneOf(['default', 'dark'])
-};
-EmptyActivity.defaultProps = {
-  size: 'large',
-  alignHorizontal: true,
-  isRender: true,
-  className: '',
-  dataId: 'emptyActivity',
-  palette: 'default'
-};
-
-if (__DOCS__) {
-  EmptyActivity.docs = {
-    componentGroup: 'SVG'
-  };
-}