@zohodesk/dot 1.0.0-temp-222 → 1.0.0-temp-220.2

package/es/form/fields/SelectField/__tests__/__snapshots__/SelectField.spec.js.snap

@@ -19,10 +19,8 @@ exports[`SelectField rendering the defult props 1`] = `
           data-test-id="selectComponent"
         >
           <div
-            class="container effect  input  flex rowdir"
-            data-id="containerComponent"
+            class="varClass customContainer  border_bottom effect borderColor_default hasBorder    container input  flex rowdir"
             data-selector-id="textBoxIcon"
-            data-test-id="containerComponent"
           >
             <div
               class="grow basis shrinkOff"
@@ -96,9 +94,6 @@ exports[`SelectField rendering the defult props 1`] = `
                 </div>
               </div>
             </div>
-            <div
-              class="line borderColor_default "
-            />
           </div>
         </div>
       </div>

package/es/form/fields/TagsMultiSelect/__tests__/__snapshots__/TagsMultiSelect.spec.js.snap

@@ -25,10 +25,8 @@ exports[`TagsMultiSelect rendering the defult props 1`] = `
           class="custmSpan"
         />
         <div
-          class="container effect  custmInp  flex rowdir"
-          data-id="containerComponent"
+          class="varClass customContainer   effect     container custmInp  flex rowdir"
           data-selector-id="textBoxIcon"
-          data-test-id="containerComponent"
         >
           <div
             class="grow basis shrinkOff"

package/es/form/fields/TagsMultiSelectField/__tests__/__snapshots__/TagsMultiSelectField.spec.js.snap

@@ -31,10 +31,8 @@ exports[`TagsMultiSelectField rendering the defult props 1`] = `
             class="custmSpan"
           />
           <div
-            class="container effect  custmInp  flex rowdir"
-            data-id="containerComponent"
+            class="varClass customContainer   effect     container custmInp  flex rowdir"
             data-selector-id="textBoxIcon"
-            data-test-id="containerComponent"
           >
             <div
               class="grow basis shrinkOff"

package/es/form/fields/TextBoxField/__tests__/__snapshots__/TextBoxField.spec.js.snap

@@ -10,10 +10,8 @@ exports[`TextBoxField rendering the defult props 1`] = `
       class="fieldContainer "
     >
       <div
-        class="container effect    flex rowdir"
-        data-id="containerComponent"
+        class="varClass customContainer  border_bottom effect borderColor_default hasBorder    container   flex rowdir"
         data-selector-id="textBoxIcon"
-        data-test-id="containerComponent"
       >
         <div
           class="grow basis shrinkOff"
@@ -45,9 +43,6 @@ exports[`TextBoxField rendering the defult props 1`] = `
             data-test-id="containerComponent"
           />
         </div>
-        <div
-          class="line borderColor_default "
-        />
       </div>
     </div>
   </div>

package/es/form/fields/TextEditor/TextEditor.js

@@ -243,7 +243,8 @@ export default class TextEditor extends Component {
       let customStyleTag = document.createElement('style');
       customStyleTag.type = 'text/css';
       const customizedCSS = `pre {white-space: pre-wrap} ${customCSS}`;
-      const fontCSS = `@font-face {font-family: 'ZohoPuviRegular';src: url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Regular.woff2') format('woff2');font-style: normal;font-weight: normal;text-rendering: optimizeLegibility;font-display: swap}@font-face {font-family: Regular;src: url('https://static.zohocdn.com/webfonts/lato2regular/font.woff2') format('woff2');font-weight: 400;font-style: normal;font-display: swap}@font-face {font-family: 'RobotoRegular';font-weight: 400;font-style: normal;font-display: swa;src: url('https://static.zohocdn.com/webfonts/robotoregular/font.woff2')}`;
+      const fontCSS = `@font-face {font-family: 'ZohoPuviRegular';src: url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Regular.woff2') format('woff2');font-style: normal;font-weight: 400;text-rendering: optimizeLegibility;font-display: swap}@font-face {font-family: Regular;src: url('https://static.zohocdn.com/webfonts/lato2regular/font.woff2') format('woff2');font-weight: 400;font-style: normal;font-display: swap}@font-face {font-family: 'RobotoRegular';font-weight: 400;font-style: normal;font-display: swap;src: url('https://static.zohocdn.com/webfonts/robotoregular/font.woff2')}
+      @font-face {font-family: 'ZohoPuvi';src: url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Regular.woff2') format('woff2');font-style: normal;font-weight: 400;text-rendering: optimizeLegibility;font-display: swap}@font-face {font-family: ZDLato;src: url('https://static.zohocdn.com/webfonts/lato2regular/font.woff2') format('woff2');font-weight: 400;font-style: normal;font-display: swap}@font-face {font-family: 'Roboto';font-weight: 400;font-style: normal;font-display: swap;src: url('https://static.zohocdn.com/webfonts/robotoregular/font.woff2')}`;
       customStyleTag.textContent = `${customizedCSS} ${fontCSS}`;
       iframeHead.appendChild(customStyleTag);
     }

package/es/form/fields/TextEditor/TextEditor.module.css

@@ -32,7 +32,7 @@
 .textEditor * {
   box-sizing: initial;
   line-height: initial;
-  font-family: var(--zd_regular);
+  font-weight: var(--zd-fw-normal);
 }
 
 .textEditor {
@@ -717,7 +717,7 @@
 }
 
 :global .KB_Editor textarea.ze_area {
-  font-family: var(--zd_regular) !important;
+  font-weight: var(--zd-fw-normal) !important;
   font-size: var(--zd_font_size14)  !important;
   padding: var(--zd_size15) var(--zd_size20)  !important;
 }

package/es/layout/SetupDetailLayout/SetupDetailLayout.module.css

@@ -30,7 +30,7 @@
 .title {
   font-size: var(--zd_font_size16) ;
   line-height: 1;
-  font-family: var(--zd_semibold);
+  font-weight: var(--zd-fw-semibold);
   color: var(--zdt_setupdetail_backicon);
   composes: ftsmooth from '~@zohodesk/components/es/common/common.module.css';
 }

package/es/list/SecondaryText/SecondaryText.module.css

@@ -15,14 +15,14 @@
   cursor: not-allowed;
 }
 .textBold {
-  font-family: var(--zd_bold);
+  font-weight: var(--zd-fw-bold);
   color: var(--zdt_secondaryText_black_text);
 }
 .textStyle, .link{
   display: block
 }
 .textStyle.textBold {
-  font-family: var(--zd_bold);
+  font-weight: var(--zd-fw-bold);
   color: var(--zdt_secondaryText_black_text);
 }
 .ticketId,
@@ -64,7 +64,7 @@
 .ticketIdLink {
   cursor: pointer;
 }
-.ticketIdLink:hover, .ticketIdLink:focus {
+.ticketIdLink:hover,.ticketIdLink:focus {
   color: var(--zdt_secondaryText_blue_hover_text);
 }
 .primaryAccountNameCnt {
@@ -72,13 +72,13 @@
 }
 /* status */
 .font_regular {
-  font-family: var(--zd_regular);
+  font-weight: var(--zd-fw-normal);
 }
 .font_semibold {
-  font-family: var(--zd_semibold);
+  font-weight: var(--zd-fw-semibold);
 }
 .font_bold {
-  font-family: var(--zd_bold);
+  font-weight: var(--zd-fw-bold);
 }
 .font_semibold,
 .font_bold,

package/es/list/Subject/Subject.module.css

@@ -14,15 +14,15 @@
 }
 
 .font_regular {
-  font-family: var(--zd_regular);
+  font-weight: var(--zd-fw-normal);
 }
 
 .font_semibold {
-  font-family: var(--zd_semibold);
+  font-weight: var(--zd-fw-semibold);
 }
 
 .font_bold {
-  font-family: var(--zd_bold);
+  font-weight: var(--zd-fw-bold);
 }
 
 .font_semibold,

package/es/lookup/EmptyPage/LookupEmptyPage.module.css

@@ -1,12 +1,14 @@
 .container {
   text-align: center;
 }
+
 .image {
   margin: var(--zd_size20) auto ;
 }
+
 .contentDiv {
   font-size: var(--zd_font_size20) ;
-  font-family: var(--zd_semibold);
+  font-weight: var(--zd-fw-semibold);
   composes: ftsmooth from '~@zohodesk/components/es/common/common.module.css';
   margin-top: var(--zd_size15) ;
-}
+}

package/es/lookup/header/Search/__tests__/__snapshots__/Search.spec.js.snap

@@ -18,10 +18,8 @@ exports[`Search rendering the customized style search 1`] = `
       data-test-id="boxComponent"
     >
       <div
-        class="container effect    flex rowdir"
-        data-id="containerComponent"
+        class="varClass customContainer   effect     container   flex rowdir"
         data-selector-id="textBoxIcon"
-        data-test-id="containerComponent"
       >
         <div
           class="grow basis shrinkOff"
@@ -77,10 +75,8 @@ exports[`Search rendering the defult props 1`] = `
       data-test-id="boxComponent"
     >
       <div
-        class="container effect    flex rowdir"
-        data-id="containerComponent"
+        class="varClass customContainer   effect     container   flex rowdir"
         data-selector-id="textBoxIcon"
-        data-test-id="containerComponent"
       >
         <div
           class="grow basis shrinkOff"
@@ -136,10 +132,8 @@ exports[`Search rendering the prop hasSeparator is false 1`] = `
       data-test-id="boxComponent"
     >
       <div
-        class="container effect    flex rowdir"
-        data-id="containerComponent"
+        class="varClass customContainer   effect     container   flex rowdir"
         data-selector-id="textBoxIcon"
-        data-test-id="containerComponent"
       >
         <div
           class="grow basis shrinkOff"
@@ -198,10 +192,8 @@ exports[`Search rendering the prop hasSeparator is true 1`] = `
       data-test-id="boxComponent"
     >
       <div
-        class="container effect    flex rowdir"
-        data-id="containerComponent"
+        class="varClass customContainer   effect     container   flex rowdir"
         data-selector-id="textBoxIcon"
-        data-test-id="containerComponent"
       >
         <div
           class="grow basis shrinkOff"
@@ -270,10 +262,8 @@ exports[`Search rendering the renderChildren props via function 1`] = `
           data-test-id="boxComponent"
         >
           <div
-            class="container effect    flex rowdir"
-            data-id="containerComponent"
+            class="varClass customContainer   effect     container   flex rowdir"
             data-selector-id="textBoxIcon"
-            data-test-id="containerComponent"
           >
             <div
               class="grow basis shrinkOff"
@@ -331,10 +321,8 @@ exports[`Search rendering the search active 1`] = `
       data-test-id="boxComponent"
     >
       <div
-        class="container effect effectFocused   flex rowdir"
-        data-id="containerComponent"
+        class="varClass customContainer   effect  active   container   flex rowdir"
         data-selector-id="textBoxIcon"
-        data-test-id="containerComponent"
       >
         <div
           class="grow basis shrinkOff"

package/es/lookup/header/Title/LookupTitle.module.css

@@ -1,21 +1,25 @@
 .title {
   font-size: var(--zd_font_size16) ;
-  font-family: var(--zd_semibold);
+  font-weight: var(--zd-fw-semibold);
   composes: ftsmooth from '~@zohodesk/components/es/common/common.module.css';
   vertical-align: middle;
   word-break: break-all;
   cursor: initial;
 }
+
 .bold {
-  font-family: var(--zd_semibold);
+  font-weight: var(--zd-fw-semibold);
 }
+
 /* Palette */
 .default {
   color: var(--zdt_lookuptitle_default_text);
 }
+
 .primary {
   color: var(--zdt_lookuptitle_primary_text);
 }
+
 .danger {
   color: var(--zdt_lookuptitle_danger_text);
-}
+}

package/es/lookup/header/ViewDropDown/ViewDropDown.module.css

@@ -1,28 +1,35 @@
 .small {
   max-height: var(--zd_size200) ;
 }
+
 .medium {
   max-height: var(--zd_size348) ;
 }
+
 .large {
   max-height: var(--zd_size400) ;
 }
+
 .emptyState {
   font-size: var(--zd_font_size14) ;
   color: var(--zdt_viewdropdown_empty_text);
-  font-family: var(--zd_semibold);
+  font-weight: var(--zd-fw-semibold);
   composes: ftsmooth from '~@zohodesk/components/es/common/common.module.css';
   padding: var(--zd_size12) var(--zd_size15) ;
 }
+
 .hide {
   composes: vishidden from '~@zohodesk/components/es/common/common.module.css';
 }
+
 .container {
   position: relative;
 }
+
 .listItemContainer {
   padding: var(--zd_size10) 0 ;
 }
+
 /* Label Style */
 .labelCnt {
   composes: dInflex alignVertical from '~@zohodesk/components/es/common/common.module.css';
@@ -30,21 +37,25 @@
   color: var(--zdt_viewdropdown_label_text);
   cursor: pointer;
 }
+
 .labelText {
   font-size: var(--zd_font_size12) ;
   max-width: var(--zd_size180) ;
   composes: dotted from '~@zohodesk/components/es/common/common.module.css';
 }
+
 [dir=ltr] .labelText {
   margin-right: var(--zd_size5) ;
 }
+
 [dir=rtl] .labelText {
   margin-left: var(--zd_size5) ;
 }
+
 .labelCnt:hover .arrowIcon {
   color: var(--zdt_viewdropdown_hover_label_text);
 }
 
 .loader {
   padding: var(--zd_size12) var(--zd_size15) ;
-}
+}

package/es/setup/header/Search/Search.module.css

@@ -38,7 +38,7 @@
   letter-spacing: 0.2px;
   transition: all var(--zd_transition3) ease;
   color: var(--zdt_search_input_text);
-  font-family: var(--zd_regular);
+  font-weight: var(--zd-fw-normal);
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;

package/es/v1/form/fields/TextEditor/TextEditor.js

@@ -243,7 +243,8 @@ export default class TextEditor extends Component {
       let customStyleTag = document.createElement('style');
       customStyleTag.type = 'text/css';
       const customizedCSS = `pre {white-space: pre-wrap} ${customCSS}`;
-      const fontCSS = `@font-face {font-family: 'ZohoPuviRegular';src: url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Regular.woff2') format('woff2');font-style: normal;font-weight: normal;text-rendering: optimizeLegibility;font-display: swap}@font-face {font-family: Regular;src: url('https://static.zohocdn.com/webfonts/lato2regular/font.woff2') format('woff2');font-weight: 400;font-style: normal;font-display: swap}@font-face {font-family: 'RobotoRegular';font-weight: 400;font-style: normal;font-display: swa;src: url('https://static.zohocdn.com/webfonts/robotoregular/font.woff2')}`;
+      const fontCSS = `@font-face {font-family: 'ZohoPuviRegular';src: url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Regular.woff2') format('woff2');font-style: normal;font-weight: 400;text-rendering: optimizeLegibility;font-display: swap}@font-face {font-family: Regular;src: url('https://static.zohocdn.com/webfonts/lato2regular/font.woff2') format('woff2');font-weight: 400;font-style: normal;font-display: swap}@font-face {font-family: 'RobotoRegular';font-weight: 400;font-style: normal;font-display: swap;src: url('https://static.zohocdn.com/webfonts/robotoregular/font.woff2')}
+      @font-face {font-family: 'ZohoPuvi';src: url('https://static.zohocdn.com/zohofonts/zohopuvi/4.0/Zoho_Puvi_Regular.woff2') format('woff2');font-style: normal;font-weight: 400;text-rendering: optimizeLegibility;font-display: swap}@font-face {font-family: ZDLato;src: url('https://static.zohocdn.com/webfonts/lato2regular/font.woff2') format('woff2');font-weight: 400;font-style: normal;font-display: swap}@font-face {font-family: 'Roboto';font-weight: 400;font-style: normal;font-display: swap;src: url('https://static.zohocdn.com/webfonts/robotoregular/font.woff2')}`;
       customStyleTag.textContent = `${customizedCSS} ${fontCSS}`;
       iframeHead.appendChild(customStyleTag);
     }

package/es/version2/GlobalNotification/GlobalNotification.js

@@ -7,6 +7,8 @@ import AlertClose from "../AlertClose/AlertClose";
 import style from "./GlobalNotification.module.css";
 import { Container, Box } from '@zohodesk/components/es/Layout';
 import { cancelBubblingEffect } from '@zohodesk/components/es/utils/Common';
+import getCurrentTime from '@zohodesk/utils/es/getCurrentTime';
+import { STATUS } from "./utils/constants";
 export default class GlobalNotification extends React.Component {
   constructor(props) {
     super(props);
@@ -15,6 +17,8 @@ export default class GlobalNotification extends React.Component {
       shadowClose: true
     };
     this.onClose = this.onClose.bind(this);
+    this.getNotiifcationData = this.getNotiifcationData.bind(this);
+    this.handleStatusChange = this.handleStatusChange.bind(this);
   }
 
   componentDidMount() {
@@ -24,18 +28,44 @@ export default class GlobalNotification extends React.Component {
       id,
       needAutoClose
     } = this.props;
+    this.handleStatusChange(STATUS.MOUNTED);
 
     if (needAutoClose) {
       this.hideMessageTimer = setTimeout(() => {
         hideMessage(id);
+        this.handleStatusChange(STATUS.DISMISSING);
       }, hideTime);
     }
   }
 
+  componentDidUpdate(prevProps) {
+    if (prevProps.id === this.props.id && (prevProps.message !== this.props.message || prevProps.type !== this.props.type)) {
+      this.handleStatusChange(STATUS.UPDATED);
+    }
+  }
+
   componentWillUnmount() {
     if (this.hideMessageTimer) {
       clearTimeout(this.hideMessageTimer);
     }
+
+    this.handleStatusChange(STATUS.UNMOUNTED);
+  }
+
+  handleStatusChange(status) {
+    const {
+      onStatusChange
+    } = this.props;
+
+    if (typeof onStatusChange == 'function') {
+      const notificationData = this.getNotiifcationData();
+      const currentTime = getCurrentTime();
+      onStatusChange({
+        status,
+        ...notificationData,
+        time: currentTime
+      });
+    }
   }
 
   onClose(e) {
@@ -47,20 +77,31 @@ export default class GlobalNotification extends React.Component {
     this.setState({
       shadowClose: false
     });
+    this.handleStatusChange(STATUS.DISMISSING);
     hideMessage && hideMessage(id);
     onClose && onClose(e);
   }
 
+  getNotiifcationData() {
+    const {
+      id,
+      type,
+      message
+    } = this.props;
+    return {
+      id,
+      type,
+      message
+    };
+  }
+
   render() {
     let {
-      type,
-      message,
       hideMessage,
       onClick,
       i18nKeys = {},
       customProps,
       dataSelectorId,
-      id,
       needShadow,
       shadowCount,
       eleRef
@@ -71,15 +112,13 @@ export default class GlobalNotification extends React.Component {
     let {
       closeTitle = 'Close'
     } = i18nKeys;
-    return /*#__PURE__*/React.createElement(GlobalNotificationUI, {
-      type: type,
-      message: message,
+    const notificationData = this.getNotiifcationData();
+    return /*#__PURE__*/React.createElement(GlobalNotificationUI, { ...notificationData,
       hideMessage: hideMessage,
       onClick: onClick,
       closeTitle: closeTitle,
       customProps: customProps,
       dataSelectorId: dataSelectorId,
-      id: id,
       shadowCount: shadowCount,
       onClose: this.onClose,
       needShadow: shadowClose && needShadow,

package/es/version2/GlobalNotification/GlobalNotification.module.css

@@ -126,7 +126,8 @@
   --globalnotification_text_color: var(--zdt_globalnotification_info_text);
 }
 
-.danger,.error {
+.danger,
+.error {
   --commonalert_border_color: var(--zdt_commonalert_danger_border);
   --globalnotification_bg_color: var(--zdt_globalnotification_danger_bg);
   --globalnotification_text_color: var(--zdt_globalnotification_danger_text);
@@ -148,7 +149,7 @@
 
 .text {
   font-size: var(--zd_font_size14) ;
-  font-family: var(--zd_semibold);
+  font-weight: var(--zd-fw-semibold);
   composes: ftsmooth from '~@zohodesk/components/es/common/common.module.css';
   line-height: 1.4286;
   overflow: hidden;

package/es/version2/GlobalNotification/__tests__/GlobalNotification.spec.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import { render } from '@testing-library/react';
 import GlobalNotification from "../GlobalNotification";
+import { STATUS } from "../utils/constants";
 describe('GlobalNotification', () => {
   test('rendering the defult props', () => {
     const {
@@ -8,4 +9,12 @@ describe('GlobalNotification', () => {
     } = render( /*#__PURE__*/React.createElement(GlobalNotification, null));
     expect(asFragment()).toMatchSnapshot();
   });
+});
+describe('GlobalNotification Constants', () => {
+  test('should have correct constant values', () => {
+    expect(STATUS.MOUNTED).toBe('mounted');
+    expect(STATUS.UPDATED).toBe('updated');
+    expect(STATUS.DISMISSING).toBe('dismissing');
+    expect(STATUS.UNMOUNTED).toBe('unmounted');
+  });
 });

package/es/version2/GlobalNotification/props/propTypes.js

@@ -10,12 +10,13 @@ export const propTypes = {
   customProps: PropTypes.shape({
     ExtraProps: PropTypes.object
   }),
-  id: PropTypes.number,
+  id: PropTypes.string,
   hideTime: PropTypes.number,
   needAutoClose: PropTypes.bool,
   isCollapseView: PropTypes.bool,
   shadowCount: PropTypes.number,
-  needShadow: PropTypes.bool
+  needShadow: PropTypes.bool,
+  onStatusChange: PropTypes.func
 };
 export const UI_propTypes = {
   dataSelectorId: PropTypes.string,
@@ -28,7 +29,7 @@ export const UI_propTypes = {
   }),
   needShadow: PropTypes.bool,
   shadowCount: PropTypes.number,
-  id: PropTypes.number,
+  id: PropTypes.string,
   onClose: PropTypes.func
 };
 export const new_propTypes = {

package/es/version2/GlobalNotification/utils/constants.js

@@ -0,0 +1,6 @@
+export const STATUS = {
+  MOUNTED: 'mounted',
+  UNMOUNTED: 'unmounted',
+  UPDATED: 'updated',
+  DISMISSING: 'dismissing'
+};

package/es/version2/errorstate/V2_ErrorStates.module.css

@@ -5,7 +5,7 @@
   margin-top: var(--zd_size15) ;
 }
 .title {
-  font-family: var(--zd_bold);
+  font-weight: var(--zd-fw-bold);
 }
 .desc {
   line-height: 1.5714;

package/es/version2/lookup/AlertHeader/css/AlertHeaderNew.module.css

@@ -1,6 +1,7 @@
 .varClass {
   --commonalert_border_color: var(--zdt_commonalert_default_border);
 }
+
 .container {
   composes: varClass;
   position: relative;
@@ -9,12 +10,15 @@
   border-color: var(--commonalert_border_color);
   border-width: 2px 0 0 0;
 }
+
 .headerLayout {
   min-height: var(--zd_size54) ;
 }
+
 [dir=ltr] .headerLayout {
   padding: var(--zd_size15) var(--zd_size45) 0 var(--zd_size20) ;
 }
+
 [dir=rtl] .headerLayout {
   padding: var(--zd_size15) var(--zd_size20) 0 var(--zd_size45) ;
 }
@@ -23,11 +27,13 @@
   --commonalert_border_color: var(--zdt_commonalert_success_border);
 }
 
-.info,.notification {
+.info,
+.notification {
   --commonalert_border_color: var(--zdt_commonalert_info_border);
 }
 
-.danger,.error {
+.danger,
+.error {
   --commonalert_border_color: var(--zdt_commonalert_danger_border);
 }
 
@@ -52,7 +58,7 @@
   color: var(--zdt_alertlookupnew_text);
   font-size: var(--zd_font_size18) ;
   line-height: 1.2222;
-  font-family: var(--zd_bold);
+  font-weight: var(--zd-fw-bold);
   composes: ftsmooth wbreak from '~@zohodesk/components/es/common/common.module.css';
   vertical-align: middle;
   cursor: default;

package/es/version2/lookup/alertLookupCommonNew.module.css

@@ -14,7 +14,7 @@
 
 .noteTitle {
     font-size: var(--zd_font_size13) ;
-    font-family: var(--zd_semibold);
+    font-weight: var(--zd-fw-semibold);
     composes: ftsmooth from '~@zohodesk/components/es/common/common.module.css';
 }
 

package/es/version2/notification/DesktopNotification/DesktopNotification.module.css

@@ -36,7 +36,8 @@
 .large {
   width: var(--zd_size580) ;
 }
-.tapWidth{
+
+.tapWidth {
   max-width: 100% ;
   min-width: 100% ;
 }
@@ -109,7 +110,7 @@
 .subTitle {
   font-size: var(--zd_font_size15) ;
   line-height: 1.3333;
-  font-family: var(--zd_semibold);
+  font-weight: var(--zd-fw-semibold);
   composes: ftsmooth wbreak from '~@zohodesk/components/es/common/common.module.css';
 }
 
@@ -130,4 +131,4 @@
 .footer {
   overflow: hidden;
   border-radius: 0 0 var(--zd_size10) var(--zd_size10);
-}
+}