@zohodesk/dot 1.4.11 → 1.4.13

package/README.md

@@ -2,6 +2,19 @@
 
 In this Library, we Provide Some Basic Components to Build Your Application
 
+# 1.4.13
+
+- **ToggleDropdown** - Fixed popup issue fix
+- **RadioField** - tooltip option provided
+- **TextareaField** - onFocus prop supported
+- Common providers update for v1 components
+
+# 1.4.12
+
+- **CheckBoxField** - getContainerRef prop supported
+- **RadioField** - infoTooltip, disabled support added for the radio
+- **v1/RadioField** - getRef, isBoxStyle props supported
+
 # 1.4.11
 
 - **TagsMultiSelectField** - infoText, isLocked, lockedInfoText, alignField props added, position relative added for parent.
@@ -11,7 +24,6 @@ In this Library, we Provide Some Basic Components to Build Your Application
 
 - **TextEditor** - FireFox Focus Issue Fixed (Removed Visibility : Hidden)
 
-
 # 1.4.9
 
 - **GlobalNotification** 

package/assets/Appearance/dark/mode/Dot_DarkMode.module.css

@@ -140,6 +140,9 @@
 	--zdt_flipcard_default_text: hsla(0, 0.00%, calc(46.67% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
 	
 	/* form fields */
+	--zdt_radiofield_box_border: hsla(216, 22.98%, calc(31.57% + var(--zdc_default_inverse_medium)), calc(1 + var(--zdc_alpha_low)));
+	--zdt_radiofield_box_active_border: var(--zdt_cta_primary_border);
+	--zdt_radiofield_box_active_bg: var(--zdtm_cta_primary_light_bg_default_inverse_low);
 	--zdt_fields_phoneicon_icon: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
 	--zdt_fields_phoneicon_hover_icon: hsla(133, 48.36%, calc(52.16% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
 	--zdt_fields_lockicon_icon: hsla(217, 13.73%, calc(70.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));

package/assets/Appearance/light/mode/Dot_LightMode.module.css

@@ -140,6 +140,9 @@
 	--zdt_flipcard_default_text: hsla(0, 0.00%, calc(46.67% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
 	
 	/* form fields */
+	--zdt_radiofield_box_border: hsla(231, 22.22%, calc(82.35% + var(--zdc_default_inverse_medium)), calc(1 + var(--zdc_alpha_low)));
+	--zdt_radiofield_box_active_border: var(--zdt_cta_primary_border);
+	--zdt_radiofield_box_active_bg: var(--zdtm_cta_primary_light_bg_default_inverse_low);
 	--zdt_fields_phoneicon_icon: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
 	--zdt_fields_phoneicon_hover_icon: hsla(133, 63.29%, calc(40.59% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
 	--zdt_fields_lockicon_icon: hsla(220, 10.45%, calc(39.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));

package/assets/Appearance/pureDark/mode/Dot_PureDarkMode.module.css

@@ -140,6 +140,9 @@
 	--zdt_flipcard_default_text: hsla(0, 0.00%, calc(46.67% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
 	
 	/* form fields */
+	--zdt_radiofield_box_border: hsla(0, 0.00%, calc(34.51% + var(--zdc_default_inverse_medium)), calc(1 + var(--zdc_alpha_low)));
+	--zdt_radiofield_box_active_border: var(--zdt_cta_primary_border);
+	--zdt_radiofield_box_active_bg: var(--zdtm_cta_primary_light_bg_default_inverse_low);
 	--zdt_fields_phoneicon_icon: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
 	--zdt_fields_phoneicon_hover_icon: hsla(133, 48.36%, calc(52.16% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
 	--zdt_fields_lockicon_icon: hsla(0, 0.00%, calc(60.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));

package/coverage/ExternalLink/ExternalLink.js.html

@@ -214,7 +214,7 @@ ExternalLink.propTypes = propTypes;
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/coverage/ExternalLink/ExternalLink.module.css.html

@@ -79,7 +79,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/coverage/ExternalLink/index.html

@@ -116,7 +116,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/coverage/ExternalLink/props/defaultProps.js.html

@@ -85,7 +85,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/ExternalLink/props/index.html

@@ -116,7 +116,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/ExternalLink/props/propTypes.js.html

@@ -109,7 +109,7 @@ export const propTypes = {
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/IconButton/IconButton.js.html

@@ -451,7 +451,7 @@ IconButton.defaultProps = defaultProps;
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/coverage/IconButton/IconButton.module.css.html

@@ -139,7 +139,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/coverage/IconButton/index.html

@@ -116,7 +116,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/coverage/IconButton/props/defaultProps.js.html

@@ -121,7 +121,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/IconButton/props/index.html

@@ -116,7 +116,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/IconButton/props/propTypes.js.html

@@ -172,7 +172,7 @@ export const propTypes = {
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/Image/Image.js.html

@@ -169,7 +169,7 @@ Image.defaultProps = defaultProps;
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/coverage/Image/Image.module.css.html

@@ -103,7 +103,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/coverage/Image/index.html

@@ -116,7 +116,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/coverage/Image/props/defaultProps.js.html

@@ -82,7 +82,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/Image/props/index.html

@@ -116,7 +116,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/Image/props/propTypes.js.html

@@ -112,7 +112,7 @@ export const propTypes = {
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/avatar/AvatarWithTeam/AvatarWithTeam.js.html

@@ -433,7 +433,7 @@ AvatarWithTeam.propTypes = propTypes;
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/avatar/AvatarWithTeam/AvatarWithTeam.module.css.html

@@ -118,7 +118,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/avatar/AvatarWithTeam/index.html

@@ -116,7 +116,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/avatar/AvatarWithTeam/props/defaultProps.js.html

@@ -97,7 +97,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/avatar/AvatarWithTeam/props/index.html

@@ -116,7 +116,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/avatar/AvatarWithTeam/props/propTypes.js.html

@@ -148,7 +148,7 @@ export const propTypes = {
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/index.html

@@ -206,7 +206,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-26T11:40:17.392Z
+                at 2024-04-11T12:22:53.101Z
             </div>
         <script src="prettify.js"></script>
         <script>

package/es/FreezeLayer/FreezeLayer.js

@@ -6,7 +6,7 @@ import { mergeStyle } from '@zohodesk/utils';
 import VelocityAnimationGroup from '@zohodesk/components/lib/VelocityAnimation/VelocityAnimationGroup/VelocityAnimationGroup';
 import { useZIndex } from '@zohodesk/components/lib/Provider/ZindexProvider';
 import cssJSLogic from './css/cssJSLogic';
-import useFreezeLayer from './useFreezeLayer';
+import useFreezeLayer from '../Hooks/useFreezeLayer';
 import style from './css/FreezeLayer.module.css';
 export default function FreezeLayer(props) {
   let {

package/es/dropdown/ToggleDropDown/ToggleDropDown.js

@@ -522,6 +522,10 @@ export class ToggleDropDown extends Component {
       getFooter,
       customProps,
       needMultiLineText,
+      isAbsolutePositioningNeeded,
+      positionsOffset,
+      targetOffset,
+      isRestrictScroll,
       customClass
     } = this.props;
     let {
@@ -624,6 +628,10 @@ export class ToggleDropDown extends Component {
         palette: palette,
         isResponsivePadding: true,
         needFocusScope: true,
+        isAbsolutePositioningNeeded: isAbsolutePositioningNeeded,
+        positionsOffset: positionsOffset,
+        targetOffset: targetOffset,
+        isRestrictScroll: isRestrictScroll,
         customProps: {
           focusScopeProps: {
             loadNextOptions: this.handleGetNextOptions,

package/es/dropdown/ToggleDropDown/props/defaultProps.js

@@ -23,5 +23,7 @@ export const defaultProps = {
   preventPopupClose: false,
   dataSelectorId: 'toggleDropdown',
   needMultiLineText: false,
+  isAbsolutePositioningNeeded: true,
+  isRestrictScroll: false,
   customClass: {}
 };

package/es/dropdown/ToggleDropDown/props/propTypes.js

@@ -74,6 +74,10 @@ export const propTypes = {
     customListBox: PropTypes.string
   }),
   onSelectLabel: PropTypes.func,
+  isAbsolutePositioningNeeded: PropTypes.bool,
+  isRestrictScroll: PropTypes.bool,
+  positionsOffset: PropTypes.object,
+  targetOffset: PropTypes.object,
   from: PropTypes.string,
   top: PropTypes.number
 };

package/es/form/fields/CheckBoxField/CheckBoxField.js

@@ -61,6 +61,7 @@ export default class CheckBoxField extends PureComponent {
       dataSelectorId,
       validationRuleMessage,
       validationRulePalette,
+      getContainerRef,
       infoText,
       fieldSize,
       labelPalette,
@@ -115,7 +116,8 @@ export default class CheckBoxField extends PureComponent {
       disabled: removeEvent,
       checked: checked,
       getRef: this.handleGetRef,
-      dataId: dataId
+      dataId: dataId,
+      getContainerRef: getContainerRef
     }, CheckBoxProps))), !isDirectCol && /*#__PURE__*/React.createElement(Box, {
       flexible: true
     }, labelElement)), validationMessage && /*#__PURE__*/React.createElement(ValidationMessage, _extends({

package/es/form/fields/CheckBoxField/props/propTypes.js

@@ -6,6 +6,7 @@ export const propTypes = {
   errorType: PropTypes.oneOf(['primary', 'secondary']),
   fieldSize: PropTypes.oneOf(['small', 'medium']),
   getRef: PropTypes.func,
+  getContainerRef: PropTypes.func,
   id: PropTypes.string.isRequired,
   labelCustomClass: PropTypes.string,
   labelName: PropTypes.string,

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

@@ -60,6 +60,26 @@
 [dir=rtl] .radio {
   margin: var(--zd_size5) 0 var(--zd_size5) var(--zd_size32) ;
 }
+.radio, .radioWrap {
+  max-width: 100% 
+}
+.radiosWrapper {
+  gap: var(--zd_size10) 
+}
+.radioBox {
+  max-width: 100% ;
+  height: var(--zd_size36) ;
+  transition: border var(--zd_transition3);
+  padding: 0 var(--zd_size10) ;
+  border: 1px solid var(--zdt_radiofield_box_border);
+  border-radius: 6px
+}
+.radioBox:hover, .radioBoxActive {
+  border-color: var(--zdt_radiofield_box_active_border)
+}
+.radioBoxActive {
+  background-color: var(--zdt_radiofield_box_active_bg)
+}
 [dir=ltr] .duration {
   margin-right: var(--zd_size15) ;
 }

package/es/form/fields/RadioField/RadioField.js

@@ -6,6 +6,7 @@ import { defaultProps } from './props/defaultProps';
 import { propTypes } from './props/propTypes';
 /**** Components ****/
 
+import Icon from '@zohodesk/icons/es/Icon';
 import Label from '@zohodesk/components/lib/Label/Label';
 import Radio from '@zohodesk/components/lib/Radio/Radio';
 import ValidationMessage from '../ValidationMessage/ValidationMessage';
@@ -53,6 +54,7 @@ export default class RadioField extends PureComponent {
     const {
       LabelProps = {},
       RadioProps = {},
+      InfoIconProps = {},
       ValidationMessageProps1 = {},
       ValidationMessageProps2 = {}
     } = customProps;
@@ -72,7 +74,10 @@ export default class RadioField extends PureComponent {
     }, options.map((option, index) => {
       let {
         text,
-        value
+        value,
+        disabled = false,
+        tooltip,
+        infoTooltip
       } = option;
       return /*#__PURE__*/React.createElement("span", {
         key: index,
@@ -85,14 +90,21 @@ export default class RadioField extends PureComponent {
         labelPalette: labelPalette,
         labelSize: labelSize,
         active: isActive,
-        disabled: isDisabled,
+        disabled: disabled || isDisabled,
+        disabledTitle: tooltip,
+        title: tooltip,
         onChange: this.handleChange,
         size: size,
         checked: selectedValue == value,
         dataId: dataId,
         isReadOnly: isReadOnly,
         variant: variant
-      }, RadioProps)));
+      }, RadioProps), !!infoTooltip ? /*#__PURE__*/React.createElement(Icon, _extends({
+        name: "ZD-GN-info",
+        size: "16",
+        title: infoTooltip,
+        iconClass: style.infoIcon
+      }, InfoIconProps)) : null));
     })), validationMessage && /*#__PURE__*/React.createElement(ValidationMessage, _extends({
       text: validationMessage,
       palette: validationPalette,

package/es/form/fields/TextareaField/TextareaField.js

@@ -77,6 +77,7 @@ export default class TextareaField extends PureComponent {
       validationRuleMessage,
       validationRulePalette,
       // onKeyDown,
+      onFocus,
       infoText,
       borderColor,
       fieldSize,
@@ -126,6 +127,7 @@ export default class TextareaField extends PureComponent {
       text: value,
       placeHolder: placeHolder,
       dataId: `property(${dataId})`,
+      onFocus: onFocus,
       onBlur: this.handleBlur,
       borderColor: borderColor,
       needEffect: isReadOnly || isDisabled ? false : true,

package/es/form/fields/TextareaField/props/propTypes.js

@@ -12,6 +12,7 @@ export const propTypes = {
   labelName: PropTypes.string,
   labelPalette: PropTypes.string,
   maxLength: PropTypes.number,
+  onFocus: PropTypes.func,
   onBlur: PropTypes.func,
   onChange: PropTypes.func,
   placeHolder: PropTypes.string,

package/es/v1/ActionButton/ActionButton.js

@@ -6,7 +6,7 @@ import { Icon } from '@zohodesk/icons';
 import Button from '@zohodesk/components/es/v1/Button/Button';
 import { Container, Box } from '@zohodesk/components/es/v1/Layout';
 import ResponsiveDropBox from '@zohodesk/components/es/v1/ResponsiveDropBox/ResponsiveDropBox';
-import CssProvider from '@zohodesk/components/es/v1/Provider/CssProvider';
+import CssProvider from '@zohodesk/components/es/Provider/CssProvider';
 import btnStyle from '@zohodesk/components/es/semantic/Button/semanticButton.module.css';
 import style from '../../ActionButton/ActionButton.module.css';
 

package/es/v1/AttachmentViewer/AttachmentViewer.js

@@ -4,8 +4,8 @@ import { AttachmentViewer_propTypes } from './props/propTypes';
 import { Container, Box } from '@zohodesk/components/es/v1/Layout';
 import { Icon } from '@zohodesk/icons';
 import Avatar from '@zohodesk/components/es/v1/Avatar/Avatar';
-import { ResponsiveReceiver } from '@zohodesk/components/es/v1/Responsive/CustomResponsive';
-import { getUniqueId } from '@zohodesk/components/es/v1/Provider/IdProvider';
+import { ResponsiveReceiver } from '@zohodesk/components/es/Responsive/CustomResponsive';
+import { getUniqueId } from '@zohodesk/components/es/Provider/IdProvider';
 import AttachmentImage from './AttachmentImage';
 import Link from '../Link/Link';
 import IconButton from '../IconButton/IconButton';

package/es/v1/Drawer/Drawer.js

@@ -6,9 +6,9 @@ import { Header_propTypes, Content_propTypes, Footer_propTypes, Drawer_propTypes
 import { Container, Box } from '@zohodesk/components/es/v1/Layout';
 import { Card, CardHeader, CardContent } from '@zohodesk/components/es/v1/Card';
 import VelocityAnimationGroup from '@zohodesk/components/es/v1/VelocityAnimation/VelocityAnimationGroup/VelocityAnimationGroup';
-import { ResponsiveSender, ResponsiveReceiver } from '@zohodesk/components/es/v1/Responsive/CustomResponsive';
+import { ResponsiveSender, ResponsiveReceiver } from '@zohodesk/components/es/Responsive/CustomResponsive';
 import { Icon } from '@zohodesk/icons';
-import { useZIndex } from '@zohodesk/components/es/v1/Provider/ZindexProvider';
+import { useZIndex } from '@zohodesk/components/es/Provider/ZindexProvider';
 import FocusScope from '@zohodesk/a11y/es/FocusScope/FocusScope';
 import Heading from '@zohodesk/components/es/v1/Heading/Heading';
 import FreezeLayer from '../FreezeLayer/FreezeLayer';

package/es/v1/FlipCard/FlipCard.js

@@ -5,7 +5,7 @@ import { defaultProps } from './props/defaultProps';
 import { propTypes } from './props/propTypes';
 import CheckBox from '@zohodesk/components/es/v1/CheckBox/CheckBox';
 import { Container } from '@zohodesk/components/es/v1/Layout';
-import AvatarSize from '@zohodesk/components/es/v1/Provider/AvatarSize';
+import AvatarSize from '@zohodesk/components/es/Provider/AvatarSize';
 import ChannelIcon from '../ChannelIcon/ChannelIcon';
 import AvatarIcon from '../avatar/AvatarIcon/AvatarIcon';
 import AvatarUser from '../avatar/AvatarUser/AvatarUser';

package/es/v1/FreezeLayer/FreezeLayer.js

@@ -4,9 +4,9 @@ import { propTypes } from './props/propTypes';
 import { Container } from '@zohodesk/components/es/v1/Layout';
 import { mergeStyle } from '@zohodesk/utils';
 import VelocityAnimationGroup from '@zohodesk/components/es/v1/VelocityAnimation/VelocityAnimationGroup/VelocityAnimationGroup';
-import { useZIndex } from '@zohodesk/components/es/v1/Provider/ZindexProvider';
+import { useZIndex } from '@zohodesk/components/es/Provider/ZindexProvider';
 import cssJSLogic from '../../FreezeLayer/css/cssJSLogic';
-import useFreezeLayer from '../../FreezeLayer/useFreezeLayer';
+import useFreezeLayer from '../../Hooks/useFreezeLayer';
 import style from '../../FreezeLayer/css/FreezeLayer.module.css';
 export default function FreezeLayer(props) {
   let {

package/es/v1/Loader/Loader.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { useZIndex } from '@zohodesk/components/es/v1/Provider/ZindexProvider';
+import { useZIndex } from '@zohodesk/components/es/Provider/ZindexProvider';
 import style from '../../Loader/Loader.module.css';
 export default function Loader() {
   let getNextId = useZIndex();

package/es/v1/ToastMessage/ToastMessage.js

@@ -7,8 +7,8 @@ import { propTypes } from './props/propTypes'; //components
 import { cancelBubblingEffect } from '@zohodesk/components/es/utils/Common';
 import { Icon } from '@zohodesk/icons';
 import { Container, Box } from '@zohodesk/components/es/v1/Layout';
-import { useZIndex } from '@zohodesk/components/es/v1/Provider/ZindexProvider';
-import { useUniqueId } from '@zohodesk/components/es/v1/Provider/IdProvider';
+import { useZIndex } from '@zohodesk/components/es/Provider/ZindexProvider';
+import { useUniqueId } from '@zohodesk/components/es/Provider/IdProvider';
 import AutoClose from '../actions/AutoClose';
 import a11yStyle from '@zohodesk/components/es/semantic/Button/semanticButton.module.css'; //style
 

package/es/v1/alert/AlertLookup/AlertLookup.js

@@ -6,7 +6,7 @@ import { defaultProps } from './props/defaultProps';
 import { propTypes } from './props/propTypes';
 /**** Components ****/
 
-import { useUniqueId } from '@zohodesk/components/es/v1/Provider/IdProvider';
+import { useUniqueId } from '@zohodesk/components/es/Provider/IdProvider';
 import Button from '@zohodesk/components/es/v1/Button/Button';
 import { Container, Box } from '@zohodesk/components/es/v1/Layout';
 import Lookup from '../../lookup/Lookup/Lookup';

package/es/v1/avatar/AvatarIcon/AvatarIcon.js

@@ -5,7 +5,7 @@ import { defaultProps } from './props/defaultProps';
 import { propTypes } from './props/propTypes';
 import { Icon } from '@zohodesk/icons';
 import { Container } from '@zohodesk/components/es/v1/Layout';
-import AvatarSize from '@zohodesk/components/es/v1/Provider/AvatarSize';
+import AvatarSize from '@zohodesk/components/es/Provider/AvatarSize';
 import style from '../../../avatar/AvatarIcon/AvatarIcon.module.css';
 export default function AvatarIcon(props) {
   let {