@zohodesk/svg 1.0.0-beta.4 → 1.0.0-beta.40

package/src/svg/EmptyFeed.js

@@ -0,0 +1,87 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import SVG from './SVG';
+
+export default class EmptyFeed extends React.Component {
+  render() {
+    return (
+      <SVG viewBox='0 0 200 200' name='Feed' {...this.props}>
+        <defs>
+          <style>
+            {
+              ".EmptyFeed_svg__cls-4,.EmptyFeed_svg__cls-5,.EmptyFeed_svg__cls-6,.EmptyFeed_svg__cls-7,.EmptyFeed_svg__cls-8{fill:none}.EmptyFeed_svg__cls-4{stroke-miterlimit:10;stroke:var(--zd_emptysvg_tiny_circle)}.EmptyFeed_svg__cls-7{stroke-miterlimit:10;stroke:var(--zd_emptysvg_cross)}.EmptyFeed_svg__cls-5,.EmptyFeed_svg__cls-6{stroke:var(--zd_emptysvg_plus);stroke-linecap:round;stroke-linejoin:round}.EmptyFeed_svg__cls-6{stroke:var(--zd_emptysvg_primary_stroke)}.EmptyFeed_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="EmptyFeed_svg__cls-4"
+          cx={79.62}
+          cy={29.6}
+          rx={2.12}
+          ry={2.1}
+        />
+        <path
+          className="EmptyFeed_svg__cls-5"
+          d="M23.28 100.86l-.35 6.16M20 103.76l6.22.35"
+        />
+        <ellipse
+          className="EmptyFeed_svg__cls-8"
+          cx={165.88}
+          cy={154.09}
+          rx={2.45}
+          ry={2.43}
+        />
+        <path
+          className="EmptyFeed_svg__cls-7"
+          d="M175.6 117.21l4.15 4.6M175.36 121.57l4.64-4.12"
+        />
+        <ellipse
+          cx={111.07}
+          cy={152.77}
+          rx={11.07}
+          ry={10.89}
+          fill="var(--zd_emptysvg_secondary_fill)"
+        />
+        <path
+          className="EmptyFeed_svg__cls-6"
+          d="M44.32 94.5S67.74 113.31 64 114.9s-8.34-6.88-2.42-13 41.73-42.38 101.77 0l-12.95 17.24s-37.42-38.94-77.81 0l13.87 13.65s24.87-22.36 50.69 0a.08.08 0 010 .1l-14.78 14.54a.07.07 0 01-.09 0c-.69-.62-9-7.86-17.26-4.08a10.22 10.22 0 00-5.19 12.34c1 2.94 3.13 6.49 9.1 7.36 6.36.93 9.62-1.65 11-5 2.73-6.6-2.43-13.64-9.67-13.83-3.18-.09-6.47 1.11-8.32 5.51"
+        />
+      </SVG>
+    );
+  }
+}
+EmptyFeed.propTypes = {
+  alignHorizontal: PropTypes.bool,
+  className: PropTypes.string,
+  dataId: PropTypes.string,
+  isRender: PropTypes.bool,
+  size: PropTypes.oneOf(['small', 'large']),
+  palette: PropTypes.oneOf(['default', 'dark'])
+};
+EmptyFeed.defaultProps = {
+  size: 'large',
+  alignHorizontal: true,
+  isRender: true,
+  className: '',
+  dataId: 'EmptyFeed',
+  palette: 'default'
+};
+if (__DOCS__) {
+  EmptyFeed.docs = {
+    componentGroup: 'SVG'
+  };
+}

package/src/svg/EmptyFollowers.js

@@ -0,0 +1,85 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import SVG from './SVG';
+
+export default class EmptyFollowers extends React.Component {
+  render() {
+    return (
+      <SVG viewBox='0 0 500 500' name='Followers' {...this.props}>
+        <defs>
+          <style>
+            {
+              ".EmptyFollowers_svg__cls-6{fill:var(--zd_emptysvg_secondary_fill)}.EmptyFollowers_svg__cls-3,.EmptyFollowers_svg__cls-4,.EmptyFollowers_svg__cls-5,EmptyFollowers_svg__cls-7,.EmptyFollowers_svg__cls-8{fill:none;stroke-width:3px}.EmptyFollowers_svg__cls-3{stroke-miterlimit:10;stroke:var(--zd_emptysvg_tiny_circle)}.EmptyFollowers_svg__cls-7{stroke-miterlimit:10;stroke:var(--zd_emptysvg_cross)}.EmptyFollowers_svg__cls-4,.EmptyFollowers_svg__cls-5{stroke:var(--zd_emptysvg_plus);stroke-linecap:round;stroke-linejoin:round}.EmptyFollowers_svg__cls-5{stroke:var(--zd_emptysvg_primary_stroke)}.EmptyFollowers_svg__cls-8{stroke:var(--zd_emptysvg_small_circle);stroke-linecap:round;stroke-linejoin:round}"
+            }
+          </style>
+        </defs>
+        <path
+          d="M212 153.52s111.42-74.45 167.82-52S474.7 312.38 317.89 397 90.15 297.57 89.55 265c-.55-31.6 0-106.8 122.45-111.48z"
+          opacity={0.05}
+          fill="var(--zd_emptysvg_primary_fill)"
+        />
+        <ellipse
+          cx={377.09}
+          cy={79.12}
+          rx={8.4}
+          ry={8.47}
+          strokeMiterlimit={10}
+          stroke="var(--zd_emptysvg_medium_circle)"
+          fill="none"
+          strokeWidth={3}
+        />
+        <ellipse
+          className="EmptyFollowers_svg__cls-3"
+          cx={195.59}
+          cy={74.06}
+          rx={5.02}
+          ry={5.06}
+        />
+        <path
+          className="EmptyFollowers_svg__cls-4"
+          d="M61.8 246.07l-.83 14.88M54 253.09l14.77.84"
+        />
+        <ellipse
+          className="EmptyFollowers_svg__cls-8"
+          cx={400.47}
+          cy={374.57}
+          rx={5.83}
+          ry={5.88}
+        />
+        <path
+          className="EmptyFollowers_svg__cls-7"
+          d="M423.56 285.54l9.85 11.12M422.97 296.06l11.03-9.93"
+        />
+        <path
+          className="EmptyFollowers_svg__cls-6"
+          d="M238.69 313.62s-52.62-34-55-77.81 55.63-25.75 55.34 4.51c0 0 15.63-43 42.15-28.73s-6.58 81.25-42.49 102.03zM331.4 156v-26.12h20.24l1.92 24.87 23.21.54s3.13.05 3.49 3-1.07 16.42-1.07 16.42l-21.34 1.45-.11 23.3s-24.44 3.27-24.41 1c.07-5.59-1.33-23.88-1.33-23.88l-22.58-2.07.26-19.4 21.72 1z"
+        />
+        <path
+          className="EmptyFollowers_svg__cls-5"
+          d="M222.1 334.39h-22.56a7.26 7.26 0 00-6.18 3.49s-21.76 33.85-23.06 37.43c-1.38 3.76 1.34 6.44 3.23 2.81S173 337 173 337a7.25 7.25 0 00-7.61-7.28c-8.5.45-21.43.88-24.13-.48-4.1-2.06-8.2-158.91 0-166.13 7.53-6.7 190.14-7.11 190.14-7.11v-26.12s18-1.62 20.24 0 1 24.22 1.92 24.87c.78.52 16.84.55 23.21.54a3.56 3.56 0 013.49 3c1 5.47.73 15.64-1.07 16.42s-10.3-.1-18.21-.14a3.89 3.89 0 00-3.87 4.2c.51 6.67 1.33 19 .63 20.69-1 2.26-23.45 4.53-24.41 1S332 176.51 332 176.51s-22.87.3-22.58-2.07-.92-19.4.26-19.4c14.21.67 26.28 8.56 26.36 22.9.2 35.09.29 96.72-.5 125.46A24.51 24.51 0 01322 324.73c-8.16 4-19.36 8.13-31 8-2.61 0-5.49-.09-8.67-.43-42.7-4.57-101.88-54.67-101.88-96.5s52.82-20.3 55.33 4.51c0 0 14.76-43.5 42.16-28.73C323 235.91 234 324.35 234 324.35"
+        />
+      </SVG>
+    );
+  }
+}
+EmptyFollowers.propTypes = {
+  alignHorizontal: PropTypes.bool,
+  className: PropTypes.string,
+  dataId: PropTypes.string,
+  isRender: PropTypes.bool,
+  size: PropTypes.oneOf(['small', 'large']),
+  palette: PropTypes.oneOf(['default', 'dark'])
+};
+EmptyFollowers.defaultProps = {
+  size: 'large',
+  alignHorizontal: true,
+  isRender: true,
+  className: '',
+  dataId: 'EmptyFollowers',
+  palette: 'default'
+};
+if (__DOCS__) {
+  EmptyFollowers.docs = {
+    componentGroup: 'SVG'
+  };
+}

package/src/svg/EmptyFrame.js

@@ -0,0 +1,83 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import SVG from './SVG';
+
+export default class EmptyFrame extends React.Component {
+  render() {
+    return (
+      <SVG viewBox='0 0 200 200' name='emptyFrame' {...this.props}>
+        <defs>
+          <style>
+            {
+              ".EmptyFrame_svg__cls-1{fill:var(--zd_emptysvg_primary_fill);opacity:.05}.EmptyFrame_svg__cls-3,.EmptyFrame_svg__cls-4,.EmptyFrame_svg__cls-5{fill:none}.EmptyFrame_svg__cls-3{stroke-miterlimit:10;stroke:var(--zd_emptysvg_tiny_circle)}.EmptyFrame_svg__cls-5{stroke-miterlimit:10;stroke:var(--zd_emptysvg_cross)}.EmptyFrame_svg__cls-4{stroke:var(--zd_emptysvg_plus);stroke-linecap:round;stroke-linejoin:round}"
+            }
+          </style>
+        </defs>
+        <path
+          className="EmptyFrame_svg__cls-1"
+          d="M87.55 64.35s46.92-30.84 70.66-21.56 40 87.37-26.06 122.42S36.26 124 36 110.51c-.24-13.06 0-44.22 51.55-46.16z"
+        />
+        <ellipse
+          cx={157.08}
+          cy={33.53}
+          rx={3.54}
+          ry={3.51}
+          strokeMiterlimit={10}
+          stroke="var(--zd_emptysvg_medium_circle)"
+          fill="none"
+        />
+        <ellipse
+          className="EmptyFrame_svg__cls-5"
+          cx={80.66}
+          cy={31.43}
+          rx={2.12}
+          ry={2.1}
+        />
+        <path
+          className="EmptyFrame_svg__cls-4"
+          d="M24.32 102.69l-.35 6.17M21.04 105.6l6.22.35"
+        />
+        <ellipse
+          cx={166.92}
+          cy={155.93}
+          rx={2.45}
+          ry={2.43}
+          stroke="var(--zd_emptysvg_small_circle)"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          fill="none"
+        />
+        <path
+          className="EmptyFrame_svg__cls-3"
+          d="M176.64 119.05l4.15 4.6M176.4 123.4l4.64-4.11"
+        />
+        <path
+          className="EmptyFrame_svg__cls-1"
+          d="M59.89 123.66S22 99.3 21.1 78.87s51.06-57.72 98.23-20.71 1 83.7-8.82 88.28c-9.51 4.43-32.43 14.39-50.62-22.78z"
+        />
+      </SVG>
+    );
+  }
+}
+EmptyFrame.propTypes = {
+  alignHorizontal: PropTypes.bool,
+  className: PropTypes.string,
+  dataId: PropTypes.string,
+  isRender: PropTypes.bool,
+  size: PropTypes.oneOf(['small', 'large']),
+  palette: PropTypes.oneOf(['default', 'dark', 'danger'])
+};
+EmptyFrame.defaultProps = {
+  size: 'large',
+  alignHorizontal: true,
+  isRender: true,
+  className: '',
+  dataId: 'emptyFrame',
+  palette: 'default'
+};
+
+if (__DOCS__) {
+  EmptyFrame.docs = {
+    componentGroup: 'SVG'
+  };
+}

package/src/svg/EmptyFromAddress.js

@@ -1,27 +1,30 @@
 import React from 'react';
-import PropTypes from 'prop-types'
+import PropTypes from 'prop-types';
 import SVG from './SVG';
 import image from './images/EmptyFromAddress.svg';
 export default class EmptyFromAddress extends React.Component {
   render() {
-    let { size, className='', alignHorizontal } = this.props;
     return (
-      <SVG viewBox='0 0 181.9 139.3' name='fromAddress' size={size} className={className} alignHorizontal={alignHorizontal}>
+      <SVG viewBox='0 0 181.9 139.3' name='fromAddress' {...this.props}>
         <image xlinkHref={image} height='100%' width='100%' />
       </SVG>
     );
   }
 }
 EmptyFromAddress.propTypes = {
-  size: PropTypes.oneOf('small','large'),
+  alignHorizontal: PropTypes.bool,
   className: PropTypes.string,
-  alignHorizontal: PropTypes.bool
+  dataId: PropTypes.string,
+  isRender: PropTypes.bool,
+  size: PropTypes.oneOf(['small', 'large'])
 };
 EmptyFromAddress.defaultProps = {
   size: 'large',
-  alignHorizontal: true
-}
-
+  alignHorizontal: true,
+  isRender: true,
+  className: '',
+  dataId: 'emptyFromAddress'
+};
 if (__DOCS__) {
   EmptyFromAddress.docs = {
     componentGroup: 'SVG'

package/src/svg/EmptyHappiness.js

@@ -1,29 +1,85 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import SVG from './SVG';
-import image from './images/EmptyHappiness.svg';
+
 export default class EmptyHappiness extends React.Component {
   render() {
-    let { size, className='', alignHorizontal } = this.props;
     return (
-      <SVG viewBox='0 0 181.9 139.3' name='happiness' size={size} className={className} alignHorizontal={alignHorizontal}>
-        <image xlinkHref={image} height='100%' width='100%' />
+      <SVG viewBox='0 0 200 200' name='happiness' {...this.props}>
+        <defs>
+          <style>
+            {
+              ".EmptyHappiness_svg__cls-3,.EmptyHappiness_svg__cls-4,.EmptyHappiness_svg__cls-5,.EmptyHappiness_svg__cls-6,.EmptyHappiness_svg__cls-7{fill:none}.EmptyHappiness_svg__cls-3{stroke-miterlimit:10;stroke:var(--zd_emptysvg_tiny_circle)}.EmptyHappiness_svg__cls-6{stroke-miterlimit:10;stroke:var(--zd_emptysvg_cross)}.EmptyHappiness_svg__cls-4,.EmptyHappiness_svg__cls-5{stroke:var(--zd_emptysvg_plus);stroke-linecap:round;stroke-linejoin:round}.EmptyHappiness_svg__cls-5{stroke:var(--zd_emptysvg_primary_stroke)}.EmptyHappiness_svg__cls-7{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="EmptyHappiness_svg__cls-3"
+          cx={79.62}
+          cy={29.6}
+          rx={2.12}
+          ry={2.1}
+        />
+        <path
+          className="EmptyHappiness_svg__cls-4"
+          d="M23.28 100.86l-.35 6.16M20 103.76l6.22.35"
+        />
+        <ellipse
+          className="EmptyHappiness_svg__cls-7"
+          cx={165.88}
+          cy={154.09}
+          rx={2.45}
+          ry={2.43}
+        />
+        <path
+          className="EmptyHappiness_svg__cls-6"
+          d="M175.6 117.21l4.15 4.6M175.36 121.57l4.64-4.12"
+        />
+        <path
+          d="M68.31 125.71s12.59-12.23 15.08-9.4 5.83 9.18 8.13 8.2 6.44-9.74 8.9-8.32 16.44 9.1 16.44 9.1-11.83 21.44-26.39 23-22.16-22.58-22.16-22.58z"
+          fill="var(--zd_emptysvg_secondary_fill)"
+        />
+        <path
+          className="EmptyHappiness_svg__cls-5"
+          d="M111.71 132.7c-6.94 10.22-17.79 17.3-24.44 15.35C72 143.56 70.8 128.61 70.8 128.61s24.85 13.81 47.93-5.23c0 0-2.83-1.42-2.5.51s1.68 1.92 1.68 1.92-9.76-4.79-16.83-9.32a2.6 2.6 0 00-3.6.82c-1.87 3-5.21 8.35-7.53 6.49-3.35-2.68-6.11-9-8.46-8-1.92.76-9.35 7.52-13.18 9.94 0 0 12-12.59 13.66-12.2s4.54.61 4.54-1.4c0-4-3.63-3-5.54-4a4.31 4.31 0 01-1.65-1.46c-2.07-3.26 2.45-6.13 3.71-8.42a30.21 30.21 0 003.06-20.31C82.43 59.06 74.2 53.53 67.94 52.22a11 11 0 00-11.86 5.63c-16.18 29.28 1 106.87 45 102 47-5.26 55.66-70.81 44.53-101.72s-64-11.14-46.38 12 47.3-5.25 18.86-5.25C101 64.89 97 80.78 96.54 93.46"
+        />
       </SVG>
     );
   }
 }
 EmptyHappiness.propTypes = {
-  size: PropTypes.oneOf('small','large'),
+  alignHorizontal: PropTypes.bool,
   className: PropTypes.string,
-  alignHorizontal: PropTypes.bool
+  dataId: PropTypes.string,
+  isRender: PropTypes.bool,
+  size: PropTypes.oneOf(['small', 'large']),
+  palette: PropTypes.oneOf(['default', 'dark'])
 };
 EmptyHappiness.defaultProps = {
   size: 'large',
-  alignHorizontal: true
-}
+  alignHorizontal: true,
+  isRender: true,
+  className: '',
+  dataId: 'emptyHappiness',
+  palette: 'default'
+};
 
 if (__DOCS__) {
-    EmptyHappiness.docs = {
+  EmptyHappiness.docs = {
     componentGroup: 'SVG'
   };
 }

package/src/svg/EmptyHistory.js

@@ -1,34 +1,82 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import SVG from './SVG';
-import image from './images/EmptyHistory.svg';
+
 export default class EmptyHistory extends React.Component {
   render() {
-    let { size, className = '', alignHorizontal } = this.props;
     return (
-      <SVG
-        viewBox='0 0 181.9 139.3'
-        name='accounts'
-        size={size}
-        className={className}
-        alignHorizontal={alignHorizontal}
-      >
-        <image xlinkHref={image} height='100%' width='100%' />
+      <SVG viewBox='0 0 200 200' name='accounts' {...this.props}>
+        <defs>
+          <style>
+            {
+              ".EmptyHistory_svg__cls-3,.EmptyHistory_svg__cls-4,.EmptyHistory_svg__cls-5,.EmptyHistory_svg__cls-6,.EmptyHistory_svg__cls-7{fill:none}.EmptyHistory_svg__cls-3{stroke-miterlimit:10;stroke:var(--zd_emptysvg_tiny_circle)}.EmptyHistory_svg__cls-6{stroke-miterlimit:10;stroke:var(--zd_emptysvg_cross)}.EmptyHistory_svg__cls-4,.EmptyHistory_svg__cls-5{stroke:var(--zd_emptysvg_plus);stroke-linecap:round;stroke-linejoin:round}.EmptyHistory_svg__cls-5{stroke:var(--zd_emptysvg_primary_stroke)}.EmptyHistory_svg__cls-7{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="EmptyHistory_svg__cls-3"
+          cx={79.62}
+          cy={29.6}
+          rx={2.12}
+          ry={2.1}
+        />
+        <path
+          className="EmptyHistory_svg__cls-4"
+          d="M23.28 100.86l-.35 6.16M20 103.76l6.22.35"
+        />
+        <ellipse
+          className="EmptyHistory_svg__cls-7"
+          cx={165.88}
+          cy={154.09}
+          rx={2.45}
+          ry={2.43}
+        />
+        <path
+          className="EmptyHistory_svg__cls-6"
+          d="M175.6 117.21l4.15 4.6M175.36 121.57l4.64-4.12"
+        />
+        <path
+          d="M53.08 154s8.57-1.57 11.15-22.71c1.83-15 4-30.35 5.15-38.06a6.68 6.68 0 015.87-5.68c16.7-1.91 69.7-7.12 89.62.61l-11 56.17s-6.46 9.67-12.79 9.67z"
+          fill="var(--zd_emptysvg_secondary_fill)"
+        />
+        <path
+          className="EmptyHistory_svg__cls-5"
+          d="M175.07 88.31C175.53 69.79 155.31 69 155.31 69s-31-1.61-31.86-3.18c-1.24-2.43-6.79-8.42-10.15-11.93a8.74 8.74 0 00-6.3-2.67c-8.36-.06-28.48-.17-33.49 0-6.37.25-8.27 21-8.27 21s-23.78-4.93-23.56 10.33C41.89 96.8 38 154 48.05 154c15.51 0 10.38-60.21 20.18-65.84 5.6-3.22 93.45-8.5 96.64 0 2.36 6.3-6.37 39.45-11 56.17a13.23 13.23 0 01-12.79 9.67H62s25.42.13 43-23c0 0-11 9.44-5.6 11.72s18.59 2.7 18.49-2c-.1-4.91-5.39-13.63-5.39-13.63s10.08 5.41 10.15 16.27c0 0 .3 3-5 3.48-6.34.63-15.79.55-18.8 0a9.29 9.29 0 01-2.11-.42c-1.79-.76-4.45-2.83-2.33-8.26 4.18-10.74 27.68-22.4 28.1-30.32s-3.17-8.15-6-8.35c-8-.55-17.44-.4-17.44-.4s-6.44.09-5 7.48 10.14 12.89 10.35 11-6.76-4.86-2.74-8.14 16.16-1.26 14.89 2.75c-1 3.19-5.49 5.81-5.49 5.81"
+        />
       </SVG>
     );
   }
 }
-
 EmptyHistory.propTypes = {
-  size: PropTypes.oneOf('small', 'large'),
+  alignHorizontal: PropTypes.bool,
   className: PropTypes.string,
-  alignHorizontal: PropTypes.bool
+  dataId: PropTypes.string,
+  isRender: PropTypes.bool,
+  size: PropTypes.oneOf(['small', 'large']),
+  palette: PropTypes.oneOf(['default', 'dark'])
 };
 EmptyHistory.defaultProps = {
   size: 'large',
-  alignHorizontal: true
+  alignHorizontal: true,
+  isRender: true,
+  className: '',
+  dataId: 'emptyHistory',
+  palette: 'default'
 };
-
 if (__DOCS__) {
   EmptyHistory.docs = {
     componentGroup: 'SVG'

package/src/svg/EmptyImportHistory.js

@@ -1,27 +1,30 @@
 import React from 'react';
-import PropTypes from 'prop-types'
+import PropTypes from 'prop-types';
 import SVG from './SVG';
 import image from './images/EmptyImportHistory.svg';
 export default class EmptyImportHistory extends React.Component {
   render() {
-    let { size, className='', alignHorizontal } = this.props;
     return (
-      <SVG viewBox='0 0 181.9 139.3' name='importHistory' size={size} className={className} alignHorizontal={alignHorizontal}>
+      <SVG viewBox='0 0 181.9 139.3' name='importHistory' {...this.props}>
         <image xlinkHref={image} height='100%' width='100%' />
       </SVG>
     );
   }
 }
 EmptyImportHistory.propTypes = {
-  size: PropTypes.oneOf('small','large'),
+  alignHorizontal: PropTypes.bool,
   className: PropTypes.string,
-  alignHorizontal: PropTypes.bool
+  dataId: PropTypes.string,
+  isRender: PropTypes.bool,
+  size: PropTypes.oneOf(['small', 'large'])
 };
 EmptyImportHistory.defaultProps = {
   size: 'large',
-  alignHorizontal: true
-}
-
+  alignHorizontal: true,
+  isRender: true,
+  className: '',
+  dataId: 'emptyImportHistory'
+};
 if (__DOCS__) {
   EmptyImportHistory.docs = {
     componentGroup: 'SVG'

package/src/svg/{Inconvenience.js → EmptyInconvenience.js}

@@ -4,15 +4,13 @@ import SVG from './SVG';
 import image from './images/Inconvenience.svg';
 export default class Inconvenience extends React.Component {
   render() {
-    let { isRender, className, alignHorizontal, isFluid } = this.props;
+    let { isFluid } = this.props;
     return (
       <SVG
         viewBox='0 0 508.8 313.8'
         name='Inconvenience'
-        isRender={isRender}
-        className={className}
-        alignHorizontal={alignHorizontal}
         isFluid={isFluid}
+        {...this.props}
       >
         <image xlinkHref={image} height='100%' width='100%' />
       </SVG>
@@ -20,17 +18,18 @@ export default class Inconvenience extends React.Component {
   }
 }
 Inconvenience.propTypes = {
-  isRender: PropTypes.bool,
   alignHorizontal: PropTypes.bool,
   className: PropTypes.string,
-  isFluid: PropTypes.bool
+  dataId: PropTypes.string,
+  isFluid: PropTypes.bool,
+  isRender: PropTypes.bool
 };
 Inconvenience.defaultProps = {
+  alignHorizontal: true,
   isRender: true,
   className: '',
-  alignHorizontal: true
+  dataId: 'inconvenience'
 };
-
 if (__DOCS__) {
   Inconvenience.docs = {
     componentGroup: 'SVG'

package/src/svg/EmptyInvoice.js

@@ -1,27 +1,88 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import SVG from './SVG';
-import image from './images/EmptyInvoice.svg';
+
 export default class EmptyInvoice extends React.Component {
   render() {
-    let { size, className='', alignHorizontal } = this.props;
     return (
-      <SVG viewBox='0 0 181.9 139.3' name='invoice' size={size} className={className} alignHorizontal={alignHorizontal}>
-        <image xlinkHref={image} height='100%' width='100%' />
+      <SVG viewBox='0 0 200 200' name='invoice' {...this.props}>
+        <defs>
+          <style>
+            {
+              ".EmptyInvoice_svg__cls-6{fill:var(--zd_emptysvg_secondary_fill)}.EmptyInvoice_svg__cls-3,.EmptyInvoice_svg__cls-4,.EmptyInvoice_svg__cls-5,.EmptyInvoice_svg__cls-7,.EmptyInvoice_svg__cls-8{fill:none}.EmptyInvoice_svg__cls-3{stroke-miterlimit:10;stroke:var(--zd_emptysvg_cross)}.EmptyInvoice_svg__cls-7{stroke-miterlimit:10;stroke:var(--zd_emptysvg_tiny_circle)}.EmptyInvoice_svg__cls-4,.EmptyInvoice_svg__cls-5{stroke:var(--zd_emptysvg_plus);stroke-linecap:round;stroke-linejoin:round}.EmptyInvoice_svg__cls-5{stroke:var(--zd_emptysvg_primary_stroke)}.EmptyInvoice_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"
+          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="EmptyInvoice_svg__cls-7"
+          cx={79.62}
+          cy={29.6}
+          rx={2.12}
+          ry={2.1}
+        />
+        <path
+          className="EmptyInvoice_svg__cls-4"
+          d="M23.28 100.86l-.35 6.16M20 103.76l6.22.35"
+        />
+        <ellipse
+          className="EmptyInvoice_svg__cls-8"
+          cx={165.88}
+          cy={154.09}
+          rx={2.45}
+          ry={2.43}
+        />
+        <path
+          className="EmptyInvoice_svg__cls-3"
+          d="M175.6 117.21l4.15 4.6M175.36 121.57l4.64-4.12"
+        />
+        <circle
+          className="EmptyInvoice_svg__cls-6"
+          cx={57.41}
+          cy={113.21}
+          r={14.89}
+        />
+        <path
+          className="EmptyInvoice_svg__cls-6"
+          d="M48.34 130.44l.37 17.69a.83.83 0 001.37.63l7-6.81 6.75 7c.75.67 1.1-1.59 1.1-2.6v-18.77M75.54 73.14s-4.64-1.26 5.62-3S124.53 69 124.42 72c0 0-43.42 2.82-48.88 1.14zM84 103.87s-2.54-.29-1.3-2.77c.81-1.6 40.16-4.64 41.79-.79 1.05 2.42-40.49 3.56-40.49 3.56z"
+        />
+        <path
+          className="EmptyInvoice_svg__cls-5"
+          d="M65 134.94s1.12 12.34 0 14-7.85-7-7.85-7-6.13 8.84-8.67 7.23c0 0-1-14.15-.47-17.87a1.82 1.82 0 011.48-1.53c4.18-.79 17.77-1.64 22.24-12.22C77 105 63.59 94.05 49.83 99.06c-11.42 4.16-14.58 28.31 6.72 28.88s19-19 16.21-24.11C69.08 97 61 94.65 58.27 94.46a1.84 1.84 0 01-1.71-1.76l.93-27.7a19.26 19.26 0 012.18-10 14.82 14.82 0 0112.86-8.07c14-.85 74.65 0 74.65 0s17.71-.38 17.67 23.58a55.92 55.92 0 00-22.83 0s-1.3-20.23 6.68-20.57c0 0-7.62-3.26-8.79 17.3L142 136a21.76 21.76 0 01-1.41 8.57c-1.62 4.15-4.88 8.75-11.26 7.25a12.85 12.85 0 01-9.21-8.87l-1-3.34h-43s-2.63-1.65 46.72-1.24c0 0-2.6 9.27 2.06 13.74 1.85 1.77 11.39 3.09 11.39 3.09H69s-1.7-18.13 1.81-25.2 16-20.9-2.31-37c0 0 .39-18.28.68-25.54.44-11.25 55.12-7.4 58.14-4.37s5.38 7.39 1 8.4-53.87 2.87-54.11.67c-.2-1.78 44-4.51 49.53-1.63 4.45 2.29 3.45 19.6 3.3 25.84a4 4 0 01-.25 1.18 5.28 5.28 0 01-2.47 2.94 6.87 6.87 0 01-2.28.73c-11.11 1.57-33.26 2.45-38 2.65a1.41 1.41 0 01-1.45-1.08c-.15-.6-.31-1.47.15-1.69 3.47-1.6 43.07-6 44.9 2.1 1.4 6.18 1 15.16.28 19.29a2.79 2.79 0 01-2.48 2.3c-6.34.62-23.75 2.68-23.59.42.24-3.43 20.32-3.12 20.32-3.12"
+        />
       </SVG>
     );
   }
 }
 EmptyInvoice.propTypes = {
-  size: PropTypes.oneOf('small','large'),
+  alignHorizontal: PropTypes.bool,
   className: PropTypes.string,
-  alignHorizontal: PropTypes.bool
+  dataId: PropTypes.string,
+  isRender: PropTypes.bool,
+  size: PropTypes.oneOf(['small', 'large']),
+  palette: PropTypes.oneOf(['default', 'dark'])
 };
 EmptyInvoice.defaultProps = {
   size: 'large',
-  alignHorizontal: true
-}
-
+  alignHorizontal: true,
+  isRender: true,
+  className: '',
+  dataId: 'emptyInvoice',
+  palette: 'default'
+};
 if (__DOCS__) {
   EmptyInvoice.docs = {
     componentGroup: 'SVG'