@zohodesk/dot 1.0.0-temp-206.2 → 1.0.0-temp-200.4

package/es/Loader/Loader.module.css

@@ -11,19 +11,20 @@
 .loader {
   width: 100% ;
   /*  Variable:Ignore  */
-  height: 3px;
-  background-image: var(--zdt_loader_gradient_bg);
-  background-size: 200% auto;
+  height: 5px;
+  background-size: 50% auto;
 }
 [dir=ltr] .loader {
+  background-image: linear-gradient(to right, var(--zdt_loader_bg) 30%, var(--dot_solitude) 50%, var(--zdt_loader_bg) 90%);
   background-position: 0 100%;
-  animation:  loading-ltr 3s infinite;
+  animation:  loading-ltr 2s infinite;
   animation-fill-mode: forwards;
   animation-timing-function: linear;
 }
 [dir=rtl] .loader {
+  background-image: linear-gradient(to left, var(--zdt_loader_bg) 30%, var(--dot_solitude) 50%, var(--zdt_loader_bg) 90%);
   background-position: 100% 100%;
-  animation:  loading-rtl 3s infinite;
+  animation:  loading-rtl 2s infinite;
   animation-fill-mode: forwards;
   animation-timing-function: linear;
 }
@@ -33,7 +34,7 @@
     background-position: 0 0;
   }
   100% {
-    background-position: -200% 0;
+    background-position: 200% 0;
   }
 }
 
@@ -42,6 +43,6 @@
     background-position: 100% 0;
   }
   100% {
-    background-position: 300% 0;
+    background-position: -100% 0;
   }
 }

package/es/Loader/__tests__/Loader.spec.js

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

package/es/Message/Message.js

@@ -1,9 +1,9 @@
 import React from 'react';
-import { defaultProps } from './props/defaultProps';
-import { propTypes, MessageUI_propTypes, MessageNew_propTypes } from './props/propTypes';
+import { defaultProps } from "./props/defaultProps";
+import { propTypes, MessageUI_propTypes, MessageNew_propTypes } from "./props/propTypes";
 import { Icon } from '@zohodesk/icons';
-import AutoClose from '../actions/AutoClose';
-import style from './Message.module.css';
+import AutoClose from "../actions/AutoClose";
+import style from "./Message.module.css";
 export default class Message extends React.Component {
   constructor(props) {
     super(props);

package/es/Message/__tests__/Message.spec.js

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

package/es/Message/props/propTypes.js

@@ -1,5 +1,5 @@
 import PropTypes from 'prop-types';
-import { propTypes as AutoClose_PropTypes } from '../../actions/props/propTypes';
+import { propTypes as AutoClose_PropTypes } from "../../actions/props/propTypes";
 export const propTypes = {
   hideMessage: PropTypes.func,
   showMessage: PropTypes.bool,

package/es/MessageBanner/MessageBanner.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { defaultProps } from './props/defaultProps';
-import { propTypes } from './props/propTypes';
-import Link from '../Link/Link';
+import { defaultProps } from "./props/defaultProps";
+import { propTypes } from "./props/propTypes";
+import Link from "../Link/Link";
 import { Icon } from '@zohodesk/icons';
 import { Container, Box } from '@zohodesk/components/lib/Layout';
-import style from './MessageBanner.module.css';
+import style from "./MessageBanner.module.css";
 export default class MessageBanner extends React.Component {
   render() {
     let {

package/es/MessageBanner/__tests__/MessageBanner.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import MessageBanner from '../MessageBanner';
+import MessageBanner from "../MessageBanner";
 describe('MessageBanner', () => {
   const PALETTE = ['default', 'blue', 'white'];
   const TYPE = ['primary', 'secondary'];

package/es/NewStar/NewStar.js

@@ -1,9 +1,9 @@
 import React from 'react';
-import { defaultProps } from './props/defaultProps';
-import { propTypes } from './props/propTypes';
+import { defaultProps } from "./props/defaultProps";
+import { propTypes } from "./props/propTypes";
 import { Icon } from '@zohodesk/icons';
 import { Container } from '@zohodesk/components/lib/Layout';
-import style from './NewStar.module.css';
+import style from "./NewStar.module.css";
 export default class NewStar extends React.Component {
   render() {
     let {

package/es/NewStar/__tests__/NewStar.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import NewStar from '../NewStar';
+import NewStar from "../NewStar";
 describe('NewStar', () => {
   const PALETTE = ['green', 'blue', 'yellow'];
   const POSITION = ['topRight', 'topLeft', 'bottomRight', 'bottomLeft'];

package/es/PlusIcon/PlusIcon.js

@@ -1,8 +1,8 @@
 import React from 'react';
-import { defaultProps } from './props/defaultProps';
-import { propTypes } from './props/propTypes';
-import style from './PlusIcon.module.css';
-import AvatarIcon from '../avatar/AvatarIcon/AvatarIcon';
+import { defaultProps } from "./props/defaultProps";
+import { propTypes } from "./props/propTypes";
+import style from "./PlusIcon.module.css";
+import AvatarIcon from "../avatar/AvatarIcon/AvatarIcon";
 export default class PlusIcon extends React.Component {
   constructor(props) {
     super(props);

package/es/PlusIcon/__tests__/PlusIcon.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import PlusIcon from '../PlusIcon';
+import PlusIcon from "../PlusIcon";
 describe('PlusIcon', () => {
   const size = ['small', 'xsmall', 'xxsmall', 'medium', 'xmedium', 'xlarge'];
   test('renders with default props', () => {

package/es/Separator/Separator.js

@@ -1,8 +1,8 @@
 import React from 'react';
 import { Container, Box } from '@zohodesk/components/lib/Layout';
-import { defaultProps } from './props/defaultProps';
-import { propTypes } from './props/propTypes';
-import style from './Separator.module.css';
+import { defaultProps } from "./props/defaultProps";
+import { propTypes } from "./props/propTypes";
+import style from "./Separator.module.css";
 export default class Separator extends React.Component {
   constructor(props) {
     super(props);

package/es/Separator/__tests__/Separator.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import Separator from '../Separator';
+import Separator from "../Separator";
 describe('Separator', () => {
   const PALETTE = ['default', 'primary', 'secondary'];
   const TYPE = ['dot', 'slash', 'arrow', 'comma', 'none'];

package/es/TagWithIcon/TagWithIcon.js

@@ -1,9 +1,9 @@
 import React from 'react';
-import { defaultProps } from './props/defaultProps';
-import { propTypes } from './props/propTypes';
+import { defaultProps } from "./props/defaultProps";
+import { propTypes } from "./props/propTypes";
 import { Container, Box } from '@zohodesk/components/es/Layout';
 import Icon from '@zohodesk/icons/es/Icon';
-import style from './TagWithIcon.module.css';
+import style from "./TagWithIcon.module.css";
 export default class TagWithIcon extends React.Component {
   render() {
     const {

package/es/TagWithIcon/__tests__/TagWithIcon.spec.js

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

package/es/ToastMessage/ToastMessage.js

@@ -1,16 +1,16 @@
 import React, { useState } from 'react';
-import { defaultProps } from './props/defaultProps';
-import { propTypes } from './props/propTypes'; //components
+import { defaultProps } from "./props/defaultProps";
+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/lib/Layout';
 import { useZIndex } from '@zohodesk/components/lib/Provider/ZindexProvider';
 import { useUniqueId } from '@zohodesk/components/lib/Provider/IdProvider';
-import AutoClose from '../actions/AutoClose';
+import AutoClose from "../actions/AutoClose";
 import a11yStyle from '@zohodesk/components/lib/semantic/Button/semanticButton.module.css'; //style
 
-import style from './ToastMessage.module.css';
+import style from "./ToastMessage.module.css";
 
 function ToastMessageUI(props) {
   let [messageState, setMessageState] = useState(props.messageState);

package/es/ToastMessage/__tests__/ToastMessage.spec.js

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

package/es/Upload/Upload.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { defaultProps } from './props/defaultProps';
-import { propTypes } from './props/propTypes';
+import { defaultProps } from "./props/defaultProps";
+import { propTypes } from "./props/propTypes";
 import { Icon } from '@zohodesk/icons';
 import { Container, Box } from '@zohodesk/components/lib/Layout';
-import Image from '../Image/Image';
-import style from './Upload.module.css';
+import Image from "../Image/Image";
+import style from "./Upload.module.css";
 export default class Upload extends React.Component {
   render() {
     let {

package/es/Upload/__tests__/Upload.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import Upload from '../Upload';
+import Upload from "../Upload";
 describe('Upload', () => {
   const mockOnRemove = jest.fn();
   const mockEleRef = jest.fn();

package/es/actions/AutoClose.js

@@ -1,7 +1,7 @@
 import React, { useState, useEffect } from 'react';
 import { cancelBubblingEffect } from '@zohodesk/components/es/utils/Common';
-import { defaultProps } from './props/defaultProps';
-import { propTypes } from './props/propTypes';
+import { defaultProps } from "./props/defaultProps";
+import { propTypes } from "./props/propTypes";
 export default function AutoClose(props) {
   let {
     Element,

package/es/alert/AlertHeader/AlertHeader.js

@@ -1,11 +1,11 @@
 import React, { Component } from 'react';
-import { defaultProps } from './props/defaultProps';
-import { propTypes } from './props/propTypes';
-import Title from '../../lookup/header/Title/Title';
+import { defaultProps } from "./props/defaultProps";
+import { propTypes } from "./props/propTypes";
+import Title from "../../lookup/header/Title/Title";
 import { Container, Box } from '@zohodesk/components/lib/Layout';
 import { Icon } from '@zohodesk/icons';
-import Close from '../../lookup/header/Close/Close';
-import style from './AlertHeader.module.css';
+import Close from "../../lookup/header/Close/Close";
+import style from "./AlertHeader.module.css";
 export default class AlertHeader extends Component {
   render() {
     let {

package/es/alert/AlertHeader/__tests__/AlertHeader.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import AlertHeader from '../AlertHeader';
+import AlertHeader from "../AlertHeader";
 describe('AlertHeader', () => {
   const mockOnClose = jest.fn();
   const iconTypes = ['delete', 'alert', 'remoteAssist', 'splitTicket', 'update'];

package/es/alert/AlertLookup/AlertLookup.js

@@ -1,17 +1,17 @@
 /**** Libraries ****/
 import React, { Component } from 'react';
-import { defaultProps } from './props/defaultProps';
-import { propTypes } from './props/propTypes';
+import { defaultProps } from "./props/defaultProps";
+import { propTypes } from "./props/propTypes";
 /**** Components ****/
 
-import Lookup from '../../lookup/Lookup/Lookup';
-import AlertHeader from '../AlertHeader/AlertHeader';
+import Lookup from "../../lookup/Lookup/Lookup";
+import AlertHeader from "../AlertHeader/AlertHeader";
 import Button from '@zohodesk/components/lib/Button/Button';
-import Section from '../../lookup/Section/Section';
-import FormAction from '../../FormAction/FormAction';
+import Section from "../../lookup/Section/Section";
+import FormAction from "../../FormAction/FormAction";
 /**** CSS ****/
 
-import style from './AlertLookup.module.css';
+import style from "./AlertLookup.module.css";
 export default class AlertLookup extends Component {
   render() {
     let {

package/es/alert/AlertLookup/__tests__/AlertLookup.spec.js

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

package/es/alert/index.js

@@ -1,2 +1,2 @@
-export { default as AlertHeader } from './AlertHeader/AlertHeader';
-export { default as AlertLookup } from './AlertLookup/AlertLookup';
+export { default as AlertHeader } from "./AlertHeader/AlertHeader";
+export { default as AlertLookup } from "./AlertLookup/AlertLookup";

package/es/avatar/AvatarClose/AvatarClose.js

@@ -1,9 +1,9 @@
 import React from 'react';
-import { defaultProps } from './props/defaultProps';
-import { propTypes } from './props/propTypes';
+import { defaultProps } from "./props/defaultProps";
+import { propTypes } from "./props/propTypes";
 import Avatar from '@zohodesk/components/lib/Avatar/Avatar';
 import { Icon } from '@zohodesk/icons';
-import style from './AvatarClose.module.css';
+import style from "./AvatarClose.module.css";
 export default class AvatarClose extends React.Component {
   constructor(props) {
     super(props);

package/es/avatar/AvatarClose/__tests__/AvatarClose.spec.js

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

package/es/avatar/AvatarCollision/AvatarCollision.js

@@ -1,9 +1,9 @@
 import React from 'react';
-import { defaultProps } from './props/defaultProps';
-import { propTypes } from './props/propTypes';
+import { defaultProps } from "./props/defaultProps";
+import { propTypes } from "./props/propTypes";
 import Avatar from '@zohodesk/components/lib/Avatar/Avatar';
 import { Icon } from '@zohodesk/icons';
-import style from './AvatarCollision.module.css';
+import style from "./AvatarCollision.module.css";
 export default class AvatarCollision extends React.Component {
   constructor(props) {
     super(props);

package/es/avatar/AvatarCollision/__tests__/AvatarCollision.spec.js

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

package/es/avatar/AvatarIcon/AvatarIcon.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { defaultProps } from './props/defaultProps';
-import { propTypes } from './props/propTypes';
+import { defaultProps } from "./props/defaultProps";
+import { propTypes } from "./props/propTypes";
 import { Icon } from '@zohodesk/icons';
 import { Container } from '@zohodesk/components/lib/Layout';
 import AvatarSize from '@zohodesk/components/lib/Provider/AvatarSize';
-import style from './AvatarIcon.module.css';
+import style from "./AvatarIcon.module.css";
 export default class AvatarIcon extends React.Component {
   render() {
     let {

package/es/avatar/AvatarIcon/__tests__/AvatarIcon.spec.js

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

package/es/avatar/AvatarStatus/AvatarStatus.js

@@ -1,8 +1,8 @@
 import React from 'react';
-import { defaultProps } from './props/defaultProps';
-import { propTypes } from './props/propTypes';
+import { defaultProps } from "./props/defaultProps";
+import { propTypes } from "./props/propTypes";
 import Avatar from '@zohodesk/components/lib/Avatar/Avatar';
-import style from './AvatarStatus.module.css';
+import style from "./AvatarStatus.module.css";
 export default class AvatarStatus extends React.Component {
   constructor(props) {
     super(props);

package/es/avatar/AvatarStatus/__tests__/AvatarStatus.spec.js

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

package/es/avatar/AvatarThread/AvatarThread.js

@@ -1,9 +1,9 @@
 import React from 'react';
-import { defaultProps } from './props/defaultProps';
-import { propTypes } from './props/propTypes';
+import { defaultProps } from "./props/defaultProps";
+import { propTypes } from "./props/propTypes";
 import Avatar from '@zohodesk/components/lib/Avatar/Avatar';
 import { Icon } from '@zohodesk/icons';
-import style from './AvatarThread.module.css';
+import style from "./AvatarThread.module.css";
 export default class AvatarThread extends React.Component {
   render() {
     let {

package/es/avatar/AvatarThread/__tests__/AvatarThread.spec.js

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

package/es/avatar/AvatarUser/AvatarUser.js

@@ -1,13 +1,13 @@
 /**** Libraries ****/
 import React from 'react';
-import { defaultProps } from './props/defaultProps';
-import { propTypes } from './props/propTypes';
+import { defaultProps } from "./props/defaultProps";
+import { propTypes } from "./props/propTypes";
 /**** Components ****/
 
 import Avatar from '@zohodesk/components/lib/Avatar/Avatar';
-import AvatarIcon from '../AvatarIcon/AvatarIcon';
+import AvatarIcon from "../AvatarIcon/AvatarIcon";
 import { Icon } from '@zohodesk/icons';
-import style from './AvatarUser.module.css';
+import style from "./AvatarUser.module.css";
 /**** Methods ****/
 
 export default class AvatarUser extends React.Component {

package/es/avatar/AvatarUser/__tests__/AvatarUser.spec.js

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

package/es/avatar/AvatarWithTeam/AvatarWithTeam.js

@@ -1,9 +1,9 @@
 import React from 'react';
-import { defaultProps } from './props/defaultProps';
-import { propTypes } from './props/propTypes';
+import { defaultProps } from "./props/defaultProps";
+import { propTypes } from "./props/propTypes";
 import Avatar from '@zohodesk/components/lib/Avatar/Avatar';
 import AvatarTeam from '@zohodesk/components/lib/AvatarTeam/AvatarTeam';
-import style from './AvatarWithTeam.module.css';
+import style from "./AvatarWithTeam.module.css";
 export default class AvatarWithTeam extends React.Component {
   render() {
     let {

package/es/avatar/AvatarWithTeam/__tests__/AvatarWithTeam.spec.js

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

package/es/avatar/index.js

@@ -1,7 +1,7 @@
-export { default as AvatarClose } from './AvatarClose/AvatarClose';
-export { default as AvatarCollision } from './AvatarCollision/AvatarCollision';
-export { default as AvatarIcon } from './AvatarIcon/AvatarIcon';
-export { default as AvatarStatus } from './AvatarStatus/AvatarStatus';
-export { default as AvatarThread } from './AvatarThread/AvatarThread';
-export { default as AvatarUser } from './AvatarUser/AvatarUser';
-export { default as AvatarWithTeam } from './AvatarWithTeam/AvatarWithTeam';
+export { default as AvatarClose } from "./AvatarClose/AvatarClose";
+export { default as AvatarCollision } from "./AvatarCollision/AvatarCollision";
+export { default as AvatarIcon } from "./AvatarIcon/AvatarIcon";
+export { default as AvatarStatus } from "./AvatarStatus/AvatarStatus";
+export { default as AvatarThread } from "./AvatarThread/AvatarThread";
+export { default as AvatarUser } from "./AvatarUser/AvatarUser";
+export { default as AvatarWithTeam } from "./AvatarWithTeam/AvatarWithTeam";

package/es/common/dot_common.module.css

@@ -1,4 +1,39 @@
-.audioImage {
+/* .audioImage {
   background-image: url('../../images/audio_thumbnail.png');
   background-repeat: no-repeat;
-}
+}
+
+.videoImage {
+  background-image: url('../../images/video_thumbnail.png');
+  background-repeat: no-repeat;
+}
+
+.pdfImage {
+  background-image: url('../../images/pdf_thumbnail.png');
+  background-repeat: no-repeat;
+}
+
+.writerImage {
+  background-image: url('../../images/writer_thumbnail.png');
+  background-repeat: no-repeat;
+}
+
+.showImage {
+  background-image: url('../../images/show_thumbnail.png');
+  background-repeat: no-repeat;
+}
+
+.sheetImage {
+  background-image: url('../../images/sheet_thumbnail.png');
+  background-repeat: no-repeat;
+}
+
+.mailImage {
+  background-image: url('../../images/mail_thumbnail.png');
+  background-repeat: no-repeat;
+}
+
+.otherImage {
+  background-image: url('../../images/otherfile_thumbnail.png');
+  background-repeat: no-repeat;
+} */

package/es/deprecated/FreezeLayer/FreezeLayer.js

@@ -1,11 +1,11 @@
 import React, { Component } from 'react';
-import { defaultProps } from './props/defaultProps';
-import { propTypes } from './props/propTypes';
+import { defaultProps } from "./props/defaultProps";
+import { propTypes } from "./props/propTypes";
 import { Container } from '@zohodesk/components/lib/Layout';
 import VelocityAnimationGroup from '@zohodesk/components/lib/VelocityAnimation/VelocityAnimationGroup/VelocityAnimationGroup';
-import style from './_FreezeLayer.module.css';
+import style from "./_FreezeLayer.module.css";
 import { getZIndex } from '@zohodesk/components/lib/Provider/ZindexProvider';
-import { getDotLibraryConfig } from '../Provider/Config';
+import { getDotLibraryConfig } from "../Provider/Config";
 export default class FreezeLayer extends Component {
   constructor(props) {
     super(props);

package/es/deprecated/SelectDropdown/SelectDropdown.js

@@ -8,7 +8,7 @@ import { Icon } from '@zohodesk/icons';
 import { Container, Box } from '@zohodesk/components/lib/Layout';
 import ResponsiveDropBox from '@zohodesk/components/lib/ResponsiveDropBox/ResponsiveDropBox';
 import { ResponsiveReceiver } from '@zohodesk/components/lib/Responsive/CustomResponsive';
-import style from './SelectDropdown.module.css';
+import style from "./SelectDropdown.module.css";
 
 class SelectDropdown extends React.Component {
   constructor(props) {