@zohodesk/icons 1.0.0-beta.11 → 1.0.0-beta.110

package/lib/Icon/index.js

@@ -1,103 +1,232 @@
-'use strict';
+"use strict";
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports["default"] = void 0;
 
-var _react = require('react');
+var _react = _interopRequireDefault(require("react"));
 
-var _react2 = _interopRequireDefault(_react);
+var _asyncComponent = _interopRequireDefault(require("./asyncComponent"));
 
-var _asyncComponent = require('./asyncComponent');
+var _FontFactory = require("./FontFactory");
 
-var _asyncComponent2 = _interopRequireDefault(_asyncComponent);
+var _FontIcon = _interopRequireDefault(require("./FontIcon"));
 
-var _FontFactory = require('./FontFactory');
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+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); }
 
-function getAddformsFontIcon() {
-  return require('./AddformsFontIcon').default;
+function getAddforms() {
+  return require('../../assets_final/react/zd-font-react-addforms.module.css');
 }
-function getAutomateFontIcon() {
-  return require('./AutomateFontIcon').default;
+
+function getAutomate() {
+  return require('../../assets_final/react/zd-font-react-automate.module.css');
+}
+
+function getChannels() {
+  return require('../../assets_final/react/zd-font-react-channels.module.css');
+}
+
+function getCommon() {
+  return require('../../assets_final/react/zd-font-react-common.module.css');
+}
+
+function getCommunity() {
+  return require('../../assets_final/react/zd-font-react-community.module.css');
 }
-function getChannelsFontIcon() {
-  return require('./ChannelsFontIcon').default;
+
+function getCustomers() {
+  return require('../../assets_final/react/zd-font-react-customers.module.css');
+}
+
+function getCustomize() {
+  return require('../../assets_final/react/zd-font-react-customize.module.css');
+}
+
+function getGamescope() {
+  return require('../../assets_final/react/zd-font-react-gamescope.module.css');
+}
+
+function getGettingstarted() {
+  return require('../../assets_final/react/zd-font-react-gettingstarted.module.css');
 }
-function getCommonFontIcon() {
-  return require('./CommonFontIcon').default;
+
+function getKnowledgeBase() {
+  return require('../../assets_final/react/zd-font-react-kb.module.css');
 }
-function getCommunityFontIcon() {
-  return require('./CommunityFontIcon').default;
+
+function getOrganization() {
+  return require('../../assets_final/react/zd-font-react-organization.module.css');
 }
-function getCustomersFontIcon() {
-  return require('./CustomersFontIcon').default;
+
+function getOthers() {
+  return require('../../assets_final/react/zd-font-react-others.module.css');
 }
-function getCustomizeFontIcon() {
-  return require('./CustomizeFontIcon').default;
+
+function getReports() {
+  return require('../../assets_final/react/zd-font-react-reports.module.css');
 }
-function getGamescopeFontIcon() {
-  return require('./GamescopeFontIcon').default;
+
+function getSetup() {
+  return require('../../assets_final/react/zd-font-react-setup.module.css');
 }
-function getGettingstartedFontIcon() {
-  return require('./GettingstartedFontIcon').default;
+
+function getSocial() {
+  return require('../../assets_final/react/zd-font-react-social.module.css');
 }
-function getKnowledgeBaseFontIcon() {
-  return require('./KnowledgeBaseFontIcon').default;
+
+function getTickets() {
+  return require('../../assets_final/react/zd-font-react-tickets.module.css');
 }
-function getOrganizationFontIcon() {
-  return require('./OrganizationFontIcon').default;
+
+function getTopband() {
+  return require('../../assets_final/react/zd-font-react-topband.module.css');
 }
-function getOthersFontIcon() {
-  return require('./OthersFontIcon').default;
+
+function getTicketsChannel() {
+  return require('../../assets_final/react/zd-font-react-ticket-channels.module.css');
 }
-function getReportsFontIcon() {
-  return require('./ReportsFontIcon').default;
+
+function getReactCallBar() {
+  return require('../../assets_final/react/zd-font-rCallBar.module.css');
 }
-function getSetupFontIcon() {
-  return require('./SetupFontIcon').default;
+
+function getReactChannels() {
+  return require('../../assets_final/react/zd-font-rChannels.module.css');
 }
-function getSocialFontIcon() {
-  return require('./SocialFontIcon').default;
+
+function getReactCutomize() {
+  return require('../../assets_final/react/zd-font-rCustomize.module.css');
 }
-function getTicketsFontIcon() {
-  return require('./TicketsFontIcon').default;
+
+function getReactExportFiles() {
+  return require('../../assets_final/react/zd-font-rExportFiles.module.css');
 }
-function getTopbandFontIcon() {
-  return require('./TopbandFontIcon').default;
+
+function getReactGeneral() {
+  return require('../../assets_final/react/zd-font-rGeneral.module.css');
+}
+
+function getReactIntegrations() {
+  return require('../../assets_final/react/zd-font-rIntegrations.module.css');
+}
+
+function getReactLhs() {
+  return require('../../assets_final/react/zd-font-rLhs.module.css');
+}
+
+function getReactMarketplace() {
+  return require('../../assets_final/react/zd-font-rMarketplace.module.css');
+}
+
+function getReactReports() {
+  return require('../../assets_final/react/zd-font-rReports.module.css');
+}
+
+function getReactSetup() {
+  return require('../../assets_final/react/zd-font-rSetup.module.css');
+}
+
+function getReactTickets() {
+  return require('../../assets_final/react/zd-font-rTickets.module.css');
+}
+
+function getReactTopband() {
+  return require('../../assets_final/react/zd-font-rTopband.module.css');
+}
+
+function getReactGC() {
+  return require('../../assets_final/react/zd-font-react-gcFonts.module.css');
+}
+
+function getReactTwotone() {
+  return require('../../assets_final/react/zd-font-rTwotone.module.css');
+}
+
+function IconRender(iconName, iconContent) {
+  return function (props) {
+    var name = props.name,
+        onClick = props.onClick,
+        isBold = props.isBold,
+        iconClass = props.iconClass,
+        title = props.title,
+        dataId = props.dataId,
+        size = props.size,
+        titlePosition = props.titlePosition;
+    var pathName = _typeof(_FontFactory.FontFactory[iconName][name]) === 'object' ? _FontFactory.FontFactory[iconName][name][0] : _FontFactory.FontFactory[iconName][name];
+    return /*#__PURE__*/_react["default"].createElement(_FontIcon["default"], {
+      iconClass: iconClass,
+      iconContent: iconContent,
+      isBold: isBold,
+      name: _FontFactory.FontFactory[iconName][name],
+      onClick: onClick,
+      pathName: iconContent[pathName],
+      title: title,
+      dataId: dataId,
+      size: size,
+      iconName: name,
+      titlePosition: titlePosition
+    });
+  };
 }
 
 function getIcon(props) {
-  var iconName = void 0;
+  var iconName;
   var filesMap = {
-    AddformsFontIcon: getAddformsFontIcon,
-    AutomateFontIcon: getAutomateFontIcon,
-    ChannelsFontIcon: getChannelsFontIcon,
-    CommonFontIcon: getCommonFontIcon,
-    CommunityFontIcon: getCommunityFontIcon,
-    CustomersFontIcon: getCustomersFontIcon,
-    CustomizeFontIcon: getCustomizeFontIcon,
-    GamescopeFontIcon: getGamescopeFontIcon,
-    GettingstartedFontIcon: getGettingstartedFontIcon,
-    KnowledgeBaseFontIcon: getKnowledgeBaseFontIcon,
-    OrganizationFontIcon: getOrganizationFontIcon,
-    OthersFontIcon: getOthersFontIcon,
-    ReportsFontIcon: getReportsFontIcon,
-    SetupFontIcon: getSetupFontIcon,
-    SocialFontIcon: getSocialFontIcon,
-    TicketsFontIcon: getTicketsFontIcon,
-    TopbandFontIcon: getTopbandFontIcon
+    AddformsFontIcon: getAddforms,
+    AutomateFontIcon: getAutomate,
+    ChannelsFontIcon: getChannels,
+    CommonFontIcon: getCommon,
+    CommunityFontIcon: getCommunity,
+    CustomersFontIcon: getCustomers,
+    CustomizeFontIcon: getCustomize,
+    GamescopeFontIcon: getGamescope,
+    GettingstartedFontIcon: getGettingstarted,
+    KnowledgeBaseFontIcon: getKnowledgeBase,
+    OrganizationFontIcon: getOrganization,
+    OthersFontIcon: getOthers,
+    ReportsFontIcon: getReports,
+    SetupFontIcon: getSetup,
+    SocialFontIcon: getSocial,
+    TicketsFontIcon: getTickets,
+    TopbandFontIcon: getTopband,
+    TicketsChannelFontIcon: getTicketsChannel,
+    ReactCallBarFontIcon: getReactCallBar,
+    ReactChannelsFontIcon: getReactChannels,
+    ReactCustomizeFontIcon: getReactCutomize,
+    ReactExportFilesFontIcon: getReactExportFiles,
+    ReactGeneralFontIcon: getReactGeneral,
+    ReactIntegrationsFontIcon: getReactIntegrations,
+    ReactLhsFontIcon: getReactLhs,
+    ReactMarketplaceFontIcon: getReactMarketplace,
+    ReactReportsFontIcon: getReactReports,
+    ReactSetupFontIcon: getReactSetup,
+    ReactTicketsFontIcon: getReactTickets,
+    ReactTopbandFontIcon: getReactTopband,
+    ReactGCFontIcon: getReactGC,
+    ReactTwotoneIcon: getReactTwotone
   };
   return new Promise(function (res) {
+    if (_typeof(require.ensure) !== "function") {
+      require.ensure = function (d, c) {
+        return c(require);
+      };
+    }
+
     require.ensure([], function () {
       Object.keys(_FontFactory.FontFactory).map(function (name) {
         if (typeof _FontFactory.FontFactory[name][props.name] !== 'undefined') {
           iconName = name;
         }
       });
+
       if (iconName) {
-        var _Icon = filesMap[iconName]();
+        var iconContent = filesMap[iconName]();
+
+        var _Icon = IconRender(iconName, iconContent);
+
         var response = {
           Icon: _Icon
         };
@@ -107,19 +236,16 @@ function getIcon(props) {
   });
 }
 
-var Icon = (0, _asyncComponent2.default)(function (props) {
+var Icon = (0, _asyncComponent["default"])(function (props) {
   return getIcon(props).then(function (res) {
     return res.Icon;
   });
 });
-
-exports.default = Icon;
-
+var _default = Icon;
+exports["default"] = _default;
 
 if (false) {
   Icon.docs = {
-    componentGroup: 'Icon',
-    folderName: 'Style Guide',
-    external: true
+    componentGroup: 'Icon'
   };
 }

package/lib/Icon/props/defaultProps.js

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

package/lib/Icon/props/propTypes.js

@@ -0,0 +1,28 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.IconProps = void 0;
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var IconProps = {
+  dataId: _propTypes["default"].string,
+  iconClass: _propTypes["default"].string,
+  iconContent: _propTypes["default"].object,
+  isBold: _propTypes["default"].bool,
+  name: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].array]),
+  onClick: _propTypes["default"].func,
+  pathName: _propTypes["default"].string,
+  size: _propTypes["default"].string,
+  title: _propTypes["default"].string,
+  iconName: _propTypes["default"].string,
+  titlePosition: _propTypes["default"].oneOf(['top', 'bottom', 'left', 'right']),
+  a11y: _propTypes["default"].shape({
+    ariaHidden: _propTypes["default"].bool
+  })
+};
+exports.IconProps = IconProps;

package/lib/common/{docStyle.module.css → IcondocStyle.module.css}

@@ -9,11 +9,9 @@
   position: relative;
   overflow: hidden;
 }
-
-.font_grid>span {
+.font_grid > span {
   display: inline-block;
 }
-
 .font_grid p {
   margin-top: 0.9375rem;
   font: 0.8125rem Semibold;
@@ -21,4 +19,4 @@
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
-}
+}

package/lib/index.js

@@ -1,64 +1,49 @@
-'use strict';
+"use strict";
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-
-var _react = require('react');
-
-Object.defineProperty(exports, 'React', {
+Object.defineProperty(exports, "Icon", {
   enumerable: true,
   get: function get() {
-    return _interopRequireDefault(_react).default;
+    return _Icon["default"];
   }
 });
-
-var _reactDom = require('react-dom');
-
-Object.defineProperty(exports, 'ReactDOM', {
+Object.defineProperty(exports, "Icon__default", {
   enumerable: true,
   get: function get() {
-    return _interopRequireDefault(_reactDom).default;
+    return _Icon__default["default"];
   }
 });
-
-var _server = require('react-dom/server');
-
-Object.defineProperty(exports, 'renderToStaticMarkup', {
+Object.defineProperty(exports, "React", {
   enumerable: true,
   get: function get() {
-    return _server.renderToStaticMarkup;
+    return _react["default"];
   }
 });
-
-var _Icon = require('./Icon');
-
-Object.defineProperty(exports, 'Icon', {
+Object.defineProperty(exports, "ReactDOM", {
   enumerable: true,
   get: function get() {
-    return _interopRequireDefault(_Icon).default;
+    return _reactDom["default"];
   }
 });
-
-var _Icon__default = require('./Icon/docs/Icon__default.docs');
-
-Object.defineProperty(exports, 'Icon__default', {
+Object.defineProperty(exports, "renderToStaticMarkup", {
   enumerable: true,
   get: function get() {
-    return _interopRequireDefault(_Icon__default).default;
+    return _server.renderToStaticMarkup;
   }
 });
 
-var _docs = require('./docs.js');
+var _react = _interopRequireDefault(require("react"));
 
-Object.keys(_docs).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _docs[key];
-    }
-  });
-});
+var _reactDom = _interopRequireDefault(require("react-dom"));
+
+var _server = require("react-dom/server");
+
+require("@zohodesk/variables/assets/fontsizeVariables.module.css");
+
+var _Icon = _interopRequireDefault(require("./Icon"));
+
+var _Icon__default = _interopRequireDefault(require("./Icon/docs/Icon__default.docs"));
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@zohodesk/icons",
   "umdVar": "Icons",
-  "version": "1.0.0-beta.11",
+  "version": "1.0.0-beta.110",
   "private": false,
   "description": "",
   "main": "lib/index",
@@ -19,12 +19,17 @@
   "homepage": "https://github.com/vimalceg/fz-dnd#readme",
   "scripts": {
     "clean": "react-cli clean lib es coverage assets",
-    "build": "react-cli build:component:cmjs",
+    "build": "react-cli build:component:cmjs ",
+    "build:dev": " npm run build && npm run build:es --module:mode=dev -- -w",
     "build:es": "react-cli build:library:es",
-    "prepare": "npm run init && npm run build && npm run build:es",
+    "prepare": "npm run init && npm run build && npm run build:es && npm run valueReplacer",
     "init": "npm run clean && cd ../assets && npm run iconsassets",
     "lint": "react-cli lint",
-    "docs": "react-cli docs"
+    "docs": "react-cli docs",
+    "postpublish": "react-cli postpublish",
+    "download": "rm package-lock.json && rm -rf node_modules/ && npm install",
+    "valueReplacer": "react-cli  valuereplacer ./src ./lib &&  react-cli  valuereplacer ./src ./es && rm -rf ./assets_final  && react-cli valuereplacer ./assets ./assets_final true",
+    "expublish": "npm publish --tag experimental-version"
   },
   "tags": [
     "react",
@@ -35,10 +40,68 @@
     "redux",
     "router"
   ],
-  "dependencies": {
-    "@zohodesk/variables": "^1.0.0-beta.0"
-  },
+  "dependencies": {},
   "devDependencies": {
-    "cssmod": "0.0.4"
+    "@zohodesk/variables": "1.0.0-beta.29"
+  },
+  "peerDependencies": {
+    "@zohodesk/variables": "1.0.0-beta.29"
+  },
+  "react-cli": {
+    "css": {
+      "valueReplacer": [
+        {
+          "props": [
+            "font",
+            "font-family"
+          ],
+          "values": {
+            "zdfonts-rCallBar": "zdf-rCallBar_1",
+            "zdfonts-rChannels": "zdf-rChannels_1",
+            "zdfonts-rCustomize": "zdf-rCustomize_2",
+            "zdfonts-react-addforms": "zdf-react-addforms_1",
+            "zdfonts-react-automate": "zdf-react-automate_1",
+            "zdfonts-react-channels": "zdf-react-channels_1",
+            "zdfonts-react-common": "zdf-react-common_1",
+            "zdfonts-react-community": "zdf-react-community_1",
+            "zdfonts-react-customers": "zdf-react-customers_1",
+            "zdfonts-react-customize": "zdf-react-customize_1",
+            "zdfonts-react-gamescope": "zdf-react-gamescope_1",
+            "zdfonts-react-gcFonts": "zdf-react-gcFonts_3",
+            "zdfonts-react-gettingstarted": "zdf-react-gettingstarted_1",
+            "zdfonts-react-integrations": "zdf-react-integrations_1",
+            "zdfonts-react-kb": "zdf-react-kb_1",
+            "zdfonts-react-logo": "zdf-react-logo_1",
+            "zdfonts-react-organization": "zdf-react-organization_1",
+            "zdfonts-react-others": "zdf-react-others_1",
+            "zdfonts-react-reports": "zdf-react-reports_1",
+            "zdfonts-react-setup": "zdf-react-setup_1",
+            "zdfonts-react-social": "zdf-react-social_1",
+            "zdfonts-ticket-channels": "zdf-ticket-channels_1",
+            "zdfonts-react-tickets": "zdf-react-tickets_1",
+            "zdfonts-react-topband": "zdf-react-topband_1",
+            "zdfonts-rExportFiles": "zdf-rExportFiles_1",
+            "zdfonts-rGeneral": "zdf-rGeneral_5",
+            "zdfonts-rIntegrations": "zdf-rIntegrations_2",
+            "zdfonts-rLhs": "zdf-rLhs_1",
+            "zdfonts-rMarketplace": "zdf-rMarketplace_3",
+            "zdfonts-rReports": "zdf-rReports_1",
+            "zdfonts-rSetup": "zdf-rSetup_1",
+            "zdfonts-rTickets": "zdf-rTickets_1",
+            "zdfonts-rTopband": "zdf-rTopband_1",
+            "zdfonts-rTwotone": "zdf-rTwotone_5"
+          }
+        }
+      ]
+    },
+    "docs": {
+      "cssUniqueness": "false",
+      "disableES5Transpile": true
+    },
+    "app": {
+      "removePropTypes": {
+        "removeImport": true
+      }
+    }
   }
 }

package/assets/css/font-icon-portallist.module.css

@@ -1,25 +0,0 @@
-/*$Id$*/
-@font-face {
-  font-family:"zdfonts-portallist";
-  src:
-    url('../fonts/zd-font-icon-portallist.woff2') format('woff2'),
-    
-    url('../fonts/zd-font-icon-portallist.woff') format('woff'),
-    url('../fonts/zd-font-icon-portallist.svg#zdfonts') format('svg');
-  font-weight: normal;
-  font-style: normal;
-}
-
-.icon-exclamation-lightborder,.icon-arrow-right,.icon-power-button{
-	font-family:"zdfonts-portallist" !important;
-}
-
-.icon-exclamation-lightborder:before {
-  content: "\e550";
-}
-.icon-arrow-right:before {
-  content: "\e551";
-}
-.icon-power-button:before {
-  content: "\e552";
-}