@zohodesk/icons 1.1.8 → 1.2.1

package/cbt.config.js

@@ -0,0 +1,90 @@
+
+const path = require('path');
+
+exports.config = {
+  preProcess: {
+    enable: false,
+    runner: './preprocess/index.js'
+  },
+  css: {
+    plugins: {
+      rtl: {
+        enable: true,
+        patterns: [
+          '**/src/**/*.css',
+          '!**/node_modules/**'
+        ]
+      },
+      cssVariableReplacement: {
+        enable: true,
+        configFile:
+          './node_modules/@zohodesk-private/css-variable-migrator/es/config/cssVariableReplacementOptions.json',
+        patterns: [
+          "**/src/**",
+          "!**/node_modules/**"
+        ]
+      },
+       valueReplacer: {
+        enable: true,
+        patterns: ['**/assets/**/*.css'],
+        config: [
+          {
+          props: ['font', 'font-family'],
+            values: {
+              "zdfonts-rCallBar": "zdf-rCallBar_1",
+              "zdfonts-rChannels": "zdf-rChannels_4",
+              "zdfonts-rCustomize": "zdf-rCustomize_10",
+              "zdfonts-react-addforms": "zdf-react-addforms_1",
+              "zdfonts-react-automate": "zdf-react-automate_2",
+              "zdfonts-react-channels": "zdf-react-channels_2",
+              "zdfonts-react-common": "zdf-react-common_3",
+              "zdfonts-react-community": "zdf-react-community_1",
+              "zdfonts-react-customers": "zdf-react-customers_1",
+              "zdfonts-react-customize": "zdf-react-customize_2",
+              "zdfonts-react-gamescope": "zdf-react-gamescope_1",
+              "zdfonts-react-gcFonts": "zdf-react-gcFonts_21",
+              "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_2",
+              "zdfonts-react-setup": "zdf-react-setup_1",
+              "zdfonts-react-social": "zdf-react-social_1",
+              "zdfonts-ticket-channels": "zdf-ticket-channels_3",
+              "zdfonts-react-tickets": "zdf-react-tickets_4",
+              "zdfonts-react-topband": "zdf-react-topband_2",
+              "zdfonts-rExportFiles": "zdf-rExportFiles_2",
+              "zdfonts-rGeneral": "zdf-rGeneral_37",
+              "zdfonts-rIntegrations": "zdf-rIntegrations_4",
+              "zdfonts-rLhs": "zdf-rLhs_1",
+              "zdfonts-rMarketplace": "zdf-rMarketplace_5",
+              "zdfonts-rReports": "zdf-rReports_5",
+              "zdfonts-rSetup": "zdf-rSetup_3",
+              "zdfonts-rTickets": "zdf-rTickets_10",
+              "zdfonts-rTopband": "zdf-rTopband_5",
+              "zdfonts-rTwotone": "zdf-rTwotone_28",
+              "zdfonts-rAccessibility": "zdf-rAccessibility_1",
+              "zdfonts-rUpdates": "zdf-rUpdates_1",
+              "zdfonts-rAI": "zdf-rAI_5",
+              "zdfonts-rAutomation": "zdf-rAutomation_3",
+              "zdfonts-rDeveloperSpace": "zdf-rDeveloperSpace_1"
+        }
+          }
+        ]
+      }
+    },
+     customPlugins: [
+      {
+        plugin: (options) =>
+          require('postcss-discard-comments')({
+            remove: (c) => { return c.includes('rtl:') }
+          }), 
+        patterns: ['**/assets/**/*.css'],
+        enable: true
+      }
+    ]
+  }
+ 
+};

package/es/Icon/FontIcon.js

@@ -1,8 +1,10 @@
+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); }
+
 import React from 'react';
-import { IconDefaultProps } from "./props/defaultProps";
-import { IconProps } from "./props/propTypes";
-import { allCustomIcons } from "./CustomIcons";
-import style from "./Icon.module.css";
+import { IconDefaultProps } from './props/defaultProps';
+import { IconProps } from './props/propTypes';
+import { allCustomIcons } from './CustomIcons';
+import style from './Icon.module.css';
 export default class FontIcon extends React.Component {
   render() {
     let {
@@ -48,7 +50,7 @@ export default class FontIcon extends React.Component {
       }
     }
 
-    return /*#__PURE__*/React.createElement("i", {
+    return /*#__PURE__*/React.createElement("i", _extends({
       className: `${'zd_font_icons'} ${fontClass} ${isCustom}`,
       "data-title": title,
       onClick: onClick,
@@ -57,16 +59,15 @@ export default class FontIcon extends React.Component {
       "data-title-position": titlePosition,
       style: fontStyle,
       "aria-hidden": ariaHidden,
-      "data-selector-id": dataSelectorId,
-      ...tagAttributes
-    }, childArray ? childArray : null);
+      "data-selector-id": dataSelectorId
+    }, tagAttributes), childArray ? childArray : null);
   }
 
 }
 FontIcon.propTypes = IconProps;
 FontIcon.defaultProps = IconDefaultProps;
 
-if (false) {
+if (__DOCS__) {
   FontIcon.docs = {
     componentGroup: 'Icon',
     folderName: 'Style Guide'

package/es/Icon/Icon.module.css

@@ -45,13 +45,9 @@
 .lightBlue2 :global .path3::before {
   color: #00acda !important;
 }
-
-/*rtl:ignore*/
 [dir='rtl'] .rtl {
   transform: rotateY(180deg);
 }
-
-/*rtl:ignore*/
 /* .twotwo :global .path1:before {
   color: red !important;
 } */

package/es/Icon/__tests__/FontIcon.spec.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import FontIcon from "../FontIcon";
+import FontIcon from '../FontIcon';
 import { render } from "@testing-library/react";
 describe('FontIcon - ', () => {
   test('rendering the "default" props', () => {

package/es/Icon/asyncComponent.js

@@ -1,3 +1,5 @@
+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); }
+
 import React from 'react';
 export default function asyncComponent(getComponent) {
   return class AsyncComponent extends React.Component {
@@ -48,9 +50,9 @@ export default function asyncComponent(getComponent) {
       } = this.state;
 
       if (Component) {
-        return /*#__PURE__*/React.createElement(Component, { ...this.props,
+        return /*#__PURE__*/React.createElement(Component, _extends({}, this.props, {
           ref: this.getRef
-        });
+        }));
       }
 
       return null;

package/es/Icon/index.js

@@ -1,153 +1,153 @@
 import React from 'react';
-import { FontFactory } from "./FontFactory";
-import FontIcon from "../v1/FontIcon";
+import { FontFactory } from './FontFactory';
+import FontIcon from '../v1/FontIcon';
 
 function getAddforms() {
-  return require("../../assets_final/react/zd-font-react-addforms.module.css");
+  return require('../../assets/react/zd-font-react-addforms.module.css');
 }
 
 function getAutomate() {
-  return require("../../assets_final/react/zd-font-react-automate.module.css");
+  return require('../../assets/react/zd-font-react-automate.module.css');
 }
 
 function getChannels() {
-  return require("../../assets_final/react/zd-font-react-channels.module.css");
+  return require('../../assets/react/zd-font-react-channels.module.css');
 }
 
 function getCommon() {
-  return require("../../assets_final/react/zd-font-react-common.module.css");
+  return require('../../assets/react/zd-font-react-common.module.css');
 }
 
 function getCommunity() {
-  return require("../../assets_final/react/zd-font-react-community.module.css");
+  return require('../../assets/react/zd-font-react-community.module.css');
 }
 
 function getCustomers() {
-  return require("../../assets_final/react/zd-font-react-customers.module.css");
+  return require('../../assets/react/zd-font-react-customers.module.css');
 }
 
 function getCustomize() {
-  return require("../../assets_final/react/zd-font-react-customize.module.css");
+  return require('../../assets/react/zd-font-react-customize.module.css');
 }
 
 function getGamescope() {
-  return require("../../assets_final/react/zd-font-react-gamescope.module.css");
+  return require('../../assets/react/zd-font-react-gamescope.module.css');
 }
 
 function getGettingstarted() {
-  return require("../../assets_final/react/zd-font-react-gettingstarted.module.css");
+  return require('../../assets/react/zd-font-react-gettingstarted.module.css');
 }
 
 function getKnowledgeBase() {
-  return require("../../assets_final/react/zd-font-react-kb.module.css");
+  return require('../../assets/react/zd-font-react-kb.module.css');
 }
 
 function getOrganization() {
-  return require("../../assets_final/react/zd-font-react-organization.module.css");
+  return require('../../assets/react/zd-font-react-organization.module.css');
 }
 
 function getOthers() {
-  return require("../../assets_final/react/zd-font-react-others.module.css");
+  return require('../../assets/react/zd-font-react-others.module.css');
 }
 
 function getReports() {
-  return require("../../assets_final/react/zd-font-react-reports.module.css");
+  return require('../../assets/react/zd-font-react-reports.module.css');
 }
 
 function getSetup() {
-  return require("../../assets_final/react/zd-font-react-setup.module.css");
+  return require('../../assets/react/zd-font-react-setup.module.css');
 }
 
 function getSocial() {
-  return require("../../assets_final/react/zd-font-react-social.module.css");
+  return require('../../assets/react/zd-font-react-social.module.css');
 }
 
 function getTickets() {
-  return require("../../assets_final/react/zd-font-react-tickets.module.css");
+  return require('../../assets/react/zd-font-react-tickets.module.css');
 }
 
 function getTopband() {
-  return require("../../assets_final/react/zd-font-react-topband.module.css");
+  return require('../../assets/react/zd-font-react-topband.module.css');
 }
 
 function getTicketsChannel() {
-  return require("../../assets_final/react/zd-font-react-ticket-channels.module.css");
+  return require('../../assets/react/zd-font-react-ticket-channels.module.css');
 }
 
 function getReactCallBar() {
-  return require("../../assets_final/react/zd-font-rCallBar.module.css");
+  return require('../../assets/react/zd-font-rCallBar.module.css');
 }
 
 function getReactChannels() {
-  return require("../../assets_final/react/zd-font-rChannels.module.css");
+  return require('../../assets/react/zd-font-rChannels.module.css');
 }
 
 function getReactCutomize() {
-  return require("../../assets_final/react/zd-font-rCustomize.module.css");
+  return require('../../assets/react/zd-font-rCustomize.module.css');
 }
 
 function getReactExportFiles() {
-  return require("../../assets_final/react/zd-font-rExportFiles.module.css");
+  return require('../../assets/react/zd-font-rExportFiles.module.css');
 }
 
 function getReactGeneral() {
-  return require("../../assets_final/react/zd-font-rGeneral.module.css");
+  return require('../../assets/react/zd-font-rGeneral.module.css');
 }
 
 function getReactIntegrations() {
-  return require("../../assets_final/react/zd-font-rIntegrations.module.css");
+  return require('../../assets/react/zd-font-rIntegrations.module.css');
 }
 
 function getReactLhs() {
-  return require("../../assets_final/react/zd-font-rLhs.module.css");
+  return require('../../assets/react/zd-font-rLhs.module.css');
 }
 
 function getReactMarketplace() {
-  return require("../../assets_final/react/zd-font-rMarketplace.module.css");
+  return require('../../assets/react/zd-font-rMarketplace.module.css');
 }
 
 function getReactReports() {
-  return require("../../assets_final/react/zd-font-rReports.module.css");
+  return require('../../assets/react/zd-font-rReports.module.css');
 }
 
 function getReactSetup() {
-  return require("../../assets_final/react/zd-font-rSetup.module.css");
+  return require('../../assets/react/zd-font-rSetup.module.css');
 }
 
 function getReactTickets() {
-  return require("../../assets_final/react/zd-font-rTickets.module.css");
+  return require('../../assets/react/zd-font-rTickets.module.css');
 }
 
 function getReactTopband() {
-  return require("../../assets_final/react/zd-font-rTopband.module.css");
+  return require('../../assets/react/zd-font-rTopband.module.css');
 }
 
 function getReactGC() {
-  return require("../../assets_final/react/zd-font-react-gcFonts.module.css");
+  return require('../../assets/react/zd-font-react-gcFonts.module.css');
 }
 
 function getReactTwotone() {
-  return require("../../assets_final/react/zd-font-rTwotone.module.css");
+  return require('../../assets/react/zd-font-rTwotone.module.css');
 }
 
 function getReactAccessibility() {
-  return require("../../assets_final/react/zd-font-rAccessibility.module.css");
+  return require('../../assets/react/zd-font-rAccessibility.module.css');
 }
 
 function getReactUpdates() {
-  return require("../../assets_final/react/zd-font-rUpdates.module.css");
+  return require('../../assets/react/zd-font-rUpdates.module.css');
 }
 
 function getReactAI() {
-  return require("../../assets_final/react/zd-font-rAI.module.css");
+  return require('../../assets/react/zd-font-rAI.module.css');
 }
 
 function getReactAutomation() {
-  return require("../../assets_final/react/zd-font-rAutomation.module.css");
+  return require('../../assets/react/zd-font-rAutomation.module.css');
 }
 
 function getReactDeveloperSpace() {
-  return require("../../assets_final/react/zd-font-rDeveloperSpace.module.css");
+  return require('../../assets/react/zd-font-rDeveloperSpace.module.css');
 }
 
 function IconRender(iconName, iconContent, props) {

package/es/index.js

@@ -1 +1 @@
-export { default as Icon } from "./Icon";
+export { default as Icon } from './Icon';

package/es/v1/FontIcon.js

@@ -1,8 +1,10 @@
+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); }
+
 import React from 'react';
-import { IconDefaultProps } from "./props/defaultProps";
-import { IconProps } from "./props/propTypes";
-import { allCustomIcons } from "../Icon/CustomIcons";
-import style from "../Icon/Icon.module.css";
+import { IconDefaultProps } from './props/defaultProps';
+import { IconProps } from './props/propTypes';
+import { allCustomIcons } from '../Icon/CustomIcons';
+import style from '../Icon/Icon.module.css';
 export default function FontIcon(props) {
   const {
     name,
@@ -47,7 +49,7 @@ export default function FontIcon(props) {
     }
   }
 
-  return /*#__PURE__*/React.createElement("i", {
+  return /*#__PURE__*/React.createElement("i", _extends({
     className: `${'zd_font_icons'} ${fontClass} ${isCustom}`,
     "data-title": title,
     onClick: onClick,
@@ -56,14 +58,13 @@ export default function FontIcon(props) {
     "data-title-position": titlePosition,
     style: fontStyle,
     "aria-hidden": ariaHidden,
-    "data-selector-id": dataSelectorId,
-    ...tagAttributes
-  }, childArray ? childArray : null);
+    "data-selector-id": dataSelectorId
+  }, tagAttributes), childArray ? childArray : null);
 }
 FontIcon.propTypes = IconProps;
 FontIcon.defaultProps = IconDefaultProps;
 
-if (false) {
+if (__DOCS__) {
   FontIcon.docs = {
     componentGroup: 'Icon',
     folderName: 'Style Guide'

package/es/v1/__tests__/FontIcon.spec.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import FontIcon from "../FontIcon";
+import FontIcon from '../FontIcon';
 import { render } from "@testing-library/react";
 describe('FontIcon - ', () => {
   test('rendering the "default" props', () => {

package/es/v1/asyncComponent.js

@@ -1,3 +1,5 @@
+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); }
+
 import React, { useEffect, useState, useRef } from 'react';
 export default function asyncComponent(getComponentProps) {
   return function AsyncComponent(props) {
@@ -30,9 +32,9 @@ export default function asyncComponent(getComponentProps) {
     };
 
     if (Component) {
-      return /*#__PURE__*/React.createElement(Component, { ...props,
+      return /*#__PURE__*/React.createElement(Component, _extends({}, props, {
         ref: getRef
-      });
+      }));
     }
 
     return null;

package/lib/Icon/FontIcon.js

@@ -117,7 +117,7 @@ exports["default"] = FontIcon;
 FontIcon.propTypes = _propTypes.IconProps;
 FontIcon.defaultProps = _defaultProps.IconDefaultProps;
 
-if (false) {
+if (__DOCS__) {
   FontIcon.docs = {
     componentGroup: 'Icon',
     folderName: 'Style Guide'

package/lib/Icon/Icon.module.css

@@ -45,13 +45,9 @@
 .lightBlue2 :global .path3::before {
   color: #00acda !important;
 }
-
-/*rtl:ignore*/
 [dir='rtl'] .rtl {
   transform: rotateY(180deg);
 }
-
-/*rtl:ignore*/
 /* .twotwo :global .path1:before {
   color: red !important;
 } */