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

package/images/EmptySkills.svg

@@ -0,0 +1,83 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 24.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 200 200" style="enable-background:new 0 0 200 200;" xml:space="preserve">
+<style type="text/css">
+	.st0{opacity:5.000000e-02;fill:#3F70B7;enable-background:new    ;}
+	.st1{fill:none;stroke:#E56471;stroke-miterlimit:10;}
+	.st2{fill:none;stroke:#5CC1A5;stroke-miterlimit:10;}
+	.st3{fill:none;stroke:#3F70B7;stroke-linecap:round;stroke-linejoin:round;}
+	.st4{fill:none;stroke:#010101;stroke-linecap:round;stroke-linejoin:round;}
+	.st5{fill:none;stroke:#000000;stroke-miterlimit:10;}
+	.st6{opacity:0.25;fill:#3F70B7;enable-background:new    ;}
+	.st7{opacity:0.25;}
+	.st8{clip-path:url(#SVGID_2_);}
+	.st9{fill:none;stroke:#3F70B7;stroke-width:0.5;stroke-miterlimit:10;}
+	.st10{clip-path:url(#SVGID_4_);}
+</style>
+<title>ReactEmpty</title>
+<path class="st0" d="M86.5,62.5c0,0,46.9-30.9,70.7-21.5s40,87.4-26.1,122.4S35.2,122.2,35,108.7C34.7,95.6,35,64.4,86.5,62.5z"/>
+<ellipse class="st1" cx="156" cy="31.7" rx="3.5" ry="3.5"/>
+<ellipse class="st2" cx="79.6" cy="29.6" rx="2.1" ry="2.1"/>
+<line class="st3" x1="23.3" y1="100.9" x2="22.9" y2="107"/>
+<line class="st3" x1="20" y1="103.8" x2="26.2" y2="104.1"/>
+<ellipse class="st4" cx="165.9" cy="154.1" rx="2.4" ry="2.4"/>
+<line class="st2" x1="175.6" y1="117.2" x2="179.8" y2="121.8"/>
+<line class="st2" x1="175.4" y1="121.6" x2="180" y2="117.4"/>
+<path class="st5" d="M25.9,124.2c0,0,28.6-2.9,35.8-25.2s29.5-22.8,35.6-24.2l0.7-0.2c6.6-2.4,11.3-8.9,11.3-16.3
+	c0-9.5-7.7-17.2-17.2-17.2s-17.1,7.7-17.1,17.2c0,8.2,5.7,15,13.4,16.7l0,0c2.1,0.7,4.5,1.6,7.3,1.9c2.2,0.2,4.5,0.3,6.8,0.2
+	c5.3-0.2,18.5,2.2,23.3,13.8c6.3,15.4,16.9,30.2,36.4,30.2c0,0-44.3,6.3-51.1-23c0,0,3.2,1.1,0,15.1s-18.7,28.8-44.6,14.8
+	s-30.6,18.7-5,22.3s58.3-18.4,72.7-22s24.1,5,24.1,12.2c0,20.2-79.2,33.1-83.2-42.5"/>
+<circle class="st6" cx="97.2" cy="58.1" r="17.1"/>
+<g class="st7">
+	<g>
+		<defs>
+			<circle id="SVGID_1_" cx="147.6" cy="58.7" r="12.7"/>
+		</defs>
+		<clipPath id="SVGID_2_">
+			<use xlink:href="#SVGID_1_"  style="overflow:visible;"/>
+		</clipPath>
+		<g class="st8">
+			<line class="st9" x1="162.5" y1="47.7" x2="158.4" y2="73.7"/>
+			<line class="st9" x1="160.9" y1="47.5" x2="156.8" y2="73.5"/>
+			<line class="st9" x1="159.3" y1="47.2" x2="155.2" y2="73.2"/>
+			<line class="st9" x1="157.7" y1="47" x2="153.6" y2="73"/>
+			<line class="st9" x1="156.1" y1="46.7" x2="151.9" y2="72.7"/>
+			<line class="st9" x1="154.5" y1="46.5" x2="150.4" y2="72.4"/>
+			<line class="st9" x1="152.9" y1="46.2" x2="148.7" y2="72.2"/>
+			<line class="st9" x1="151.3" y1="45.9" x2="147.1" y2="71.9"/>
+			<line class="st9" x1="149.7" y1="45.7" x2="145.5" y2="71.7"/>
+			<line class="st9" x1="148.1" y1="45.4" x2="143.9" y2="71.4"/>
+			<line class="st9" x1="146.5" y1="45.2" x2="142.3" y2="71.2"/>
+			<line class="st9" x1="144.9" y1="44.9" x2="140.7" y2="70.9"/>
+			<line class="st9" x1="143.2" y1="44.7" x2="139.1" y2="70.7"/>
+			<line class="st9" x1="141.6" y1="44.4" x2="137.5" y2="70.4"/>
+			<line class="st9" x1="140" y1="44.2" x2="135.9" y2="70.2"/>
+			<line class="st9" x1="138.4" y1="43.9" x2="134.3" y2="69.9"/>
+			<line class="st9" x1="136.8" y1="43.6" x2="132.7" y2="69.6"/>
+		</g>
+	</g>
+	<circle class="st9" cx="147.6" cy="58.7" r="12.7"/>
+</g>
+<g class="st7">
+	<g>
+		<defs>
+			<circle id="SVGID_3_" cx="34.3" cy="61.8" r="12.7"/>
+		</defs>
+		<clipPath id="SVGID_4_">
+			<use xlink:href="#SVGID_3_"  style="overflow:visible;"/>
+		</clipPath>
+		<g class="st10">
+			<line class="st9" x1="47.7" y1="50.6" x2="43.5" y2="76.6"/>
+			<line class="st9" x1="44.5" y1="50.1" x2="40.3" y2="76.1"/>
+			<line class="st9" x1="41.2" y1="49.6" x2="37.1" y2="75.6"/>
+			<line class="st9" x1="38" y1="49" x2="33.9" y2="75.1"/>
+			<line class="st9" x1="34.8" y1="48.5" x2="30.7" y2="74.5"/>
+			<line class="st9" x1="31.6" y1="48" x2="27.5" y2="74"/>
+			<line class="st9" x1="28.4" y1="47.5" x2="24.2" y2="73.5"/>
+			<line class="st9" x1="25.2" y1="47" x2="21" y2="73"/>
+		</g>
+	</g>
+	<circle class="st9" cx="34.3" cy="61.8" r="12.7"/>
+</g>
+</svg>

package/lib/Loader/Loader.js

@@ -0,0 +1,117 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _defaultProps = require("./props/defaultProps");
+
+var _propTypes = require("./props/propTypes");
+
+var _SVG = _interopRequireDefault(require("./../SVG/SVG"));
+
+var _SVGModule = _interopRequireDefault(require("./../SVG/SVG.module.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
+
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+var Loader = /*#__PURE__*/function (_React$PureComponent) {
+  _inherits(Loader, _React$PureComponent);
+
+  var _super = _createSuper(Loader);
+
+  function Loader(props) {
+    var _this;
+
+    _classCallCheck(this, Loader);
+
+    _this = _super.call(this, props);
+    _this.viewBoxStyle = {
+      animation: 'loaderone 2s linear infinite'
+    };
+    _this.defsStyle = {
+      animation: 'circleAnimation_1 1.5s linear infinite',
+      transformOrigin: 'center'
+    };
+    _this.circleStyle = {
+      animation: 'circleAnimation_2 1.2s linear infinite',
+      transformOrigin: 'center'
+    };
+    return _this;
+  }
+
+  _createClass(Loader, [{
+    key: "render",
+    value: function render() {
+      var dataId = this.props.dataId;
+      return /*#__PURE__*/_react["default"].createElement("div", {
+        className: _SVGModule["default"].center
+      }, /*#__PURE__*/_react["default"].createElement(_SVG["default"], {
+        viewBox: "0 0 40 40",
+        name: "Loader",
+        className: "".concat(_SVGModule["default"].loaderWrapper),
+        dataId: dataId,
+        styleName: this.viewBoxStyle
+      }, /*#__PURE__*/_react["default"].createElement("defs", null, /*#__PURE__*/_react["default"].createElement("style", null, '@keyframes circleAnimation_1{to{stroke-dashoffset:-82}}@keyframes circleAnimation_2{to{stroke-dashoffset:-50}}@keyframes loaderone{0%{transform:rotate(0deg)}to{transform:rotate(359deg)}}')), /*#__PURE__*/_react["default"].createElement("title", null, 'loader'), /*#__PURE__*/_react["default"].createElement("circle", {
+        fill: "none",
+        stroke: "#089949",
+        strokeWidth: 2,
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        cx: 20,
+        cy: 20,
+        r: 13,
+        style: this.defsStyle,
+        strokeDasharray: 82,
+        strokeDashoffset: 82
+      }), /*#__PURE__*/_react["default"].createElement("circle", {
+        fill: "none",
+        stroke: "#17c662",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        cx: 20,
+        cy: 20,
+        r: 8,
+        style: this.circleStyle,
+        strokeDasharray: 50,
+        strokeDashoffset: 50
+      })));
+    }
+  }]);
+
+  return Loader;
+}(_react["default"].PureComponent);
+
+exports["default"] = Loader;
+Loader.propTypes = _propTypes.LoaderProps;
+Loader.defaultProps = _defaultProps.LoaderDefaultProps;
+
+if (false) {
+  Loader.docs = {
+    componentGroup: 'SVG'
+  };
+}

package/lib/Loader/props/defaultProps.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.LoaderDefaultProps = void 0;
+var LoaderDefaultProps = {
+  dataId: 'loader'
+};
+exports.LoaderDefaultProps = LoaderDefaultProps;

package/lib/Loader/props/propTypes.js

@@ -0,0 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.LoaderProps = void 0;
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var LoaderProps = {
+  dataId: _propTypes["default"].string
+};
+exports.LoaderProps = LoaderProps;

package/lib/Provider.js

@@ -0,0 +1,139 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _AppContainer = _interopRequireDefault(require("@zohodesk/components/lib/AppContainer/AppContainer"));
+
+var _Layout = require("@zohodesk/components/lib/Layout");
+
+var _ThemeTool = _interopRequireDefault(require("../../common/lib/ThemeTool/ThemeTool"));
+
+require("@zohodesk/components/assets/Appearance/default/mode/defaultMode.module.css");
+
+require("@zohodesk/components/assets/Appearance/dark/mode/darkMode.module.css");
+
+require("../assets/Appearance/default/themes/blue/blueDefaultCTATheme.module.css");
+
+require("../assets/Appearance/default/themes/green/greenDefaultCTATheme.module.css");
+
+require("../assets/Appearance/default/themes/orange/orangeDefaultCTATheme.module.css");
+
+require("../assets/Appearance/default/themes/red/redDefaultCTATheme.module.css");
+
+require("../assets/Appearance/default/themes/yellow/yellowDefaultCTATheme.module.css");
+
+require("../assets/Appearance/default/mode/defaultEmptyStates.module.css");
+
+require("../assets/Appearance/dark/themes/blue/blueDarkCTATheme.module.css");
+
+require("../assets/Appearance/dark/themes/green/greenDarkCTATheme.module.css");
+
+require("../assets/Appearance/dark/themes/orange/orangeDarkCTATheme.module.css");
+
+require("../assets/Appearance/dark/themes/red/redDarkCTATheme.module.css");
+
+require("../assets/Appearance/dark/themes/yellow/yellowDarkCTATheme.module.css");
+
+require("../assets/Appearance/dark/mode/darkEmptyStates.module.css");
+
+require("../assets/Appearance/pureDark/themes/blue/bluePureDarkCTATheme.module.css");
+
+require("../assets/Appearance/pureDark/themes/green/greenPureDarkCTATheme.module.css");
+
+require("../assets/Appearance/pureDark/themes/orange/orangePureDarkCTATheme.module.css");
+
+require("../assets/Appearance/pureDark/themes/red/redPureDarkCTATheme.module.css");
+
+require("../assets/Appearance/pureDark/themes/yellow/yellowPureDarkCTATheme.module.css");
+
+require("../assets/Appearance/pureDark/mode/pureDarkEmptyStates.module.css");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
+
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+var Provider = /*#__PURE__*/function (_React$Component) {
+  _inherits(Provider, _React$Component);
+
+  var _super = _createSuper(Provider);
+
+  function Provider(props) {
+    var _this;
+
+    _classCallCheck(this, Provider);
+
+    _this = _super.call(this, props);
+    _this.state = {
+      appearanceName: 'default',
+      themeName: 'blue'
+    };
+    _this.setTheme = _this.setTheme.bind(_assertThisInitialized(_this));
+    _this.setAppearance = _this.setAppearance.bind(_assertThisInitialized(_this));
+    return _this;
+  }
+
+  _createClass(Provider, [{
+    key: "setAppearance",
+    value: function setAppearance(mode) {
+      this.setState({
+        appearanceName: mode
+      });
+    }
+  }, {
+    key: "setTheme",
+    value: function setTheme(theme) {
+      this.setState({
+        themeName: theme
+      });
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this$state = this.state,
+          appearanceName = _this$state.appearanceName,
+          themeName = _this$state.themeName;
+      return /*#__PURE__*/_react["default"].createElement(_AppContainer["default"], {
+        customProps: {
+          ExtraProps: {
+            'data-mode': appearanceName,
+            'data-theme': themeName
+          }
+        }
+      }, /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
+        scroll: "vertical"
+      }, this.props.children), /*#__PURE__*/_react["default"].createElement(_ThemeTool["default"], {
+        onThemeChange: this.setTheme,
+        onAppearanceChange: this.setAppearance
+      }));
+    }
+  }]);
+
+  return Provider;
+}(_react["default"].Component);
+
+exports["default"] = Provider;

package/lib/SVG/SVG.js

@@ -0,0 +1,107 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = require("./props/propTypes");
+
+var _defaultProps = require("./props/defaultProps");
+
+var _SVGModule = _interopRequireDefault(require("./SVG.module.css"));
+
+var _EmptyStateVariablesModule = _interopRequireDefault(require("./../css/EmptyStateVariables.module.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
+
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+var SVG = /*#__PURE__*/function (_React$Component) {
+  _inherits(SVG, _React$Component);
+
+  var _super = _createSuper(SVG);
+
+  function SVG() {
+    _classCallCheck(this, SVG);
+
+    return _super.apply(this, arguments);
+  }
+
+  _createClass(SVG, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+          viewBox = _this$props.viewBox,
+          children = _this$props.children,
+          name = _this$props.name,
+          isRender = _this$props.isRender,
+          isSymbol = _this$props.isSymbol,
+          size = _this$props.size,
+          className = _this$props.className,
+          alignHorizontal = _this$props.alignHorizontal,
+          isFluid = _this$props.isFluid,
+          dataId = _this$props.dataId,
+          palette = _this$props.palette,
+          styleName = _this$props.styleName;
+      return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, isSymbol ? /*#__PURE__*/_react["default"].createElement("div", {
+        hidden: true
+      }, /*#__PURE__*/_react["default"].createElement("svg", null, /*#__PURE__*/_react["default"].createElement("symbol", {
+        id: name,
+        viewBox: viewBox
+      }, children))) : null, isRender && isSymbol ? /*#__PURE__*/_react["default"].createElement("div", {
+        className: "".concat(size === 'large' ? _SVGModule["default"].large : size === 'small' ? _SVGModule["default"].small : isFluid ? _SVGModule["default"].cover : '', " ").concat(className, " ").concat(_EmptyStateVariablesModule["default"][palette], " ").concat(alignHorizontal ? _SVGModule["default"].svgCenter : '', " "),
+        "aria-hidden": "true"
+      }, /*#__PURE__*/_react["default"].createElement("svg", {
+        height: "100%",
+        width: "100%",
+        "data-id": dataId
+      }, /*#__PURE__*/_react["default"].createElement("use", {
+        xlinkHref: "#".concat(name)
+      }))) : isRender ? /*#__PURE__*/_react["default"].createElement("div", {
+        className: "".concat(size === 'large' ? _SVGModule["default"].large : size === 'small' ? _SVGModule["default"].small : isFluid ? _SVGModule["default"].cover : '', " ").concat(className, " ").concat(_EmptyStateVariablesModule["default"][palette], " ").concat(alignHorizontal ? _SVGModule["default"].svgCenter : '', " "),
+        "aria-hidden": "true"
+      }, /*#__PURE__*/_react["default"].createElement("svg", {
+        height: "100%",
+        width: "100%",
+        viewBox: viewBox,
+        "data-id": dataId,
+        style: styleName
+      }, children)) : null);
+    }
+  }]);
+
+  return SVG;
+}(_react["default"].Component);
+
+exports["default"] = SVG;
+SVG.propTypes = _propTypes.SvgProps;
+SVG.defaultProps = _defaultProps.SvgDefaultProps;
+
+if (false) {
+  SVG.docs = {
+    componentGroup: 'SVG'
+  };
+}

package/lib/{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/lib/SVG/SvgLoader.js

@@ -0,0 +1,66 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StaticSvg = StaticSvg;
+exports["default"] = SvgLoader;
+
+var _react = _interopRequireWildcard(require("react"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+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); }
+
+function SvgLoader(props) {
+  var uiProps = {};
+  Object.keys(props).filter(function (prop) {
+    return prop != 'imageUrl';
+  }).map(function (prop) {
+    uiProps[prop] = props[prop];
+  });
+
+  var image = require("./images/".concat(props.imageUrl));
+
+  return /*#__PURE__*/_react["default"].createElement("image", _extends({
+    xlinkHref: image
+  }, uiProps));
+}
+
+function StaticSvg(props) {
+  var uiProps = {},
+      _useState = (0, _react.useState)(null),
+      _useState2 = _slicedToArray(_useState, 2),
+      image = _useState2[0],
+      setImage = _useState2[1];
+
+  Object.keys(props).filter(function (prop) {
+    return prop != 'getImage';
+  }).map(function (prop) {
+    uiProps[prop] = props[prop];
+  });
+  (0, _react.useEffect)(function () {
+    props.getImage().then(function (image) {
+      return setImage(image);
+    });
+  }, [props.getImage]);
+  return image ? /*#__PURE__*/_react["default"].createElement("image", _extends({
+    xlinkHref: image["default"]
+  }, uiProps)) : null;
+}

package/lib/SVG/props/defaultProps.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SvgDefaultProps = void 0;
+var SvgDefaultProps = {
+  alignHorizontal: true,
+  isRender: true,
+  className: '',
+  dataId: 'SVG',
+  name: '',
+  viewBox: '',
+  isSymbol: false,
+  isFluid: false,
+  palette: 'default'
+};
+exports.SvgDefaultProps = SvgDefaultProps;

package/lib/SVG/props/propTypes.js

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SvgProps = void 0;
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var SvgProps = {
+  alignHorizontal: _propTypes["default"].bool,
+  children: _propTypes["default"].node,
+  className: _propTypes["default"].string,
+  dataId: _propTypes["default"].string,
+  isFluid: _propTypes["default"].bool,
+  isRender: _propTypes["default"].bool,
+  isSymbol: _propTypes["default"].bool,
+  name: _propTypes["default"].string,
+  size: _propTypes["default"].oneOf(['small', 'large']),
+  viewBox: _propTypes["default"].string,
+  palette: _propTypes["default"].oneOf(['default', 'dark']),
+  styleName: _propTypes["default"].node
+};
+exports.SvgProps = SvgProps;