@zohodesk/dot 1.0.0-temp-60 → 1.0.0-temp-63

package/es/FormAction/FormAction.module.css

@@ -25,33 +25,58 @@
   padding-bottom: var(--zd_size10);
 }
 
-.largePadding {
+[dir=ltr] .largePadding {
   padding-left: var(--zd_size60);
 }
-.mediumPadding {
+
+[dir=rtl] .largePadding {
+  padding-right: var(--zd_size60);
+}
+[dir=ltr] .mediumPadding {
   padding-left: var(--zd_size50);
 }
-.xmediumPadding {
+[dir=rtl] .mediumPadding {
+  padding-right: var(--zd_size50);
+}
+[dir=ltr] .xmediumPadding {
   padding-left: var(--zd_size30);
 }
-.smallPadding {
+[dir=rtl] .xmediumPadding {
+  padding-right: var(--zd_size30);
+}
+[dir=ltr] .smallPadding {
   padding-left: var(--zd_size25);
 }
-.xsmallPadding {
+[dir=rtl] .smallPadding {
+  padding-right: var(--zd_size25);
+}
+[dir=ltr] .xsmallPadding {
   padding-left: var(--zd_size20);
 }
+[dir=rtl] .xsmallPadding {
+  padding-right: var(--zd_size20);
+}
 
 .marginRight {
   composes: dinblk from '~@zohodesk/components/lib/common/common.module.css';
 }
-.largeFooter .marginRight,
-.mediumFooter .marginRight {
+[dir=ltr] .largeFooter .marginRight, [dir=ltr] .mediumFooter .marginRight {
   margin-right: var(--zd_size15);
 }
-.smallFooter .marginRight {
+[dir=rtl] .largeFooter .marginRight, [dir=rtl] .mediumFooter .marginRight {
+  margin-left: var(--zd_size15);
+}
+[dir=ltr] .smallFooter .marginRight {
   margin-right: var(--zd_size12);
 }
+[dir=rtl] .smallFooter .marginRight {
+  margin-left: var(--zd_size12);
+}
 
-.marginRight:last-child {
+[dir=ltr] .marginRight:last-child {
   margin-right: 0;
 }
+
+[dir=rtl] .marginRight:last-child {
+  margin-left: 0;
+}

package/es/FreezeLayer/FreezeLayer.module.css

@@ -1,10 +1,14 @@
 .container {
   top: 0;
-  left: 0;
   bottom: 0;
-  right: 0;
   position: absolute;
   overflow: hidden;
+}[dir=ltr] .container {
+  left: 0;
+  right: 0;
+}[dir=rtl] .container {
+  right: 0;
+  left: 0;
 }
 .default {
   background-color: var(--zdt_freezelayer_default_bg);

package/es/IconButton/IconButton.module.css

@@ -3,11 +3,11 @@
 }
 .wrapper {
   height: var(--zd_size28);
-  cursor: pointer;
   width: var(--zd_size28);
   composes: offSelection from '~@zohodesk/components/lib/common/common.module.css';
   composes: varClass;
   color: var(--iconColor);
+  cursor: pointer;
 }
 .primary {
   --iconColor: var(--zdt_iconButton_icon_primary);

package/es/ImportantNotes/ImportantNotes.module.css

@@ -4,12 +4,17 @@
 }
 .title {
   font-size: var(--zd_font_size13);
-  line-height: 1.38;
+  line-height: var(--zd_font_size18);
   color: var(--zdt_importantnotes_title_text);
 }
 .icon {
-  margin-top: var(--zd_size1);
-  margin-right: var(--zd_size5);
   color: var(--zdt_importantnotes_icon);
   font-size: 0;
+  margin-top: var(--zd_size1);
+}
+[dir=ltr] .icon {
+  margin-right: var(--zd_size5);
+}
+[dir=rtl] .icon {
+  margin-left: var(--zd_size5);
 }

package/es/Link/Link.js

@@ -3,7 +3,7 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 import React from 'react';
 import PropTypes from 'prop-types';
 import style from './Link.module.css';
-import LinkContext from './LinkContext.js';
+import LinkContext from './LinkContext';
 export default class Link extends React.Component {
   constructor(props, context) {
     super(props, context);

package/es/Loader/Loader.module.css

@@ -1,21 +1,33 @@
 .ajaxLoader {
   position: absolute;
   top: 0;
+}[dir=ltr] .ajaxLoader {
   left: 0;
   right: 0;
+}[dir=rtl] .ajaxLoader {
+  right: 0;
+  left: 0;
 }
 .loader {
-  background-image: var(--zdt_loader_gradient_bg);
   width: 100%;
+  height: 3px;
+  background-image: var(--zdt_loader_gradient_bg);
   background-size: 200% auto;
+}
+[dir=ltr] .loader {
   background-position: 0 100%;
-  animation: loading 3s infinite;
+  animation:  loading-ltr 3s infinite;
+  animation-fill-mode: forwards;
+  animation-timing-function: linear;
+}
+[dir=rtl] .loader {
+  background-position: 100% 100%;
+  animation:  loading-rtl 3s infinite;
   animation-fill-mode: forwards;
   animation-timing-function: linear;
-  height: 3px;
 }
 
-@keyframes loading {
+@keyframes loading-ltr {
   0% {
     background-position: 0 0;
   }
@@ -23,3 +35,12 @@
     background-position: -200% 0;
   }
 }
+
+@keyframes loading-rtl {
+  0% {
+    background-position: 100% 0;
+  }
+  100% {
+    background-position: 300% 0;
+  }
+}

package/es/Message/Message.module.css

@@ -3,20 +3,31 @@
   top: 0;
   z-index: 1000;
   /*Hook for editor alert*/
-  right: 0;
+  pointer-events: none;
   text-align: center;
+}[dir=ltr] .message {
+  right: 0;
   left: 0;
-  pointer-events: none;
+}[dir=rtl] .message {
+  left: 0;
+  right: 0;
 }
 
 .container {
-  padding: var(--zd_size13) var(--zd_size10) var(--zd_size13) var(--zd_size50);
-  box-shadow: 0 0 19px 1px var(--zdt_message_default_box_shadow);
-  border-radius: 0 0 5px 5px;
   position: relative;
-  background: var(--zdt_message_default_bg);
   display: inline-block;
   pointer-events: initial;
+  box-shadow: 0 0 19px 1px var(--zdt_message_default_box_shadow);
+  border-radius: 0 0 5px 5px;
+  background: var(--zdt_message_default_bg);
+}
+
+[dir=ltr] .container {
+  padding: var(--zd_size13) var(--zd_size10) var(--zd_size13) var(--zd_size50);
+}
+
+[dir=rtl] .container {
+  padding: var(--zd_size13) var(--zd_size50) var(--zd_size13) var(--zd_size10);
 }
 
 .text {
@@ -25,19 +36,34 @@
   word-break: break-word;
   font-size: var(--zd_font_size14);
   vertical-align: middle;
+}
+
+[dir=ltr] .text {
   text-align: left;
 }
 
+[dir=rtl] .text {
+  text-align: right;
+}
+
 .icon {
   position: absolute;
-  left: 0;
   top: 0;
   width: var(--zd_size40);
   display: inline-block;
-  border-bottom-left-radius: 5px;
   height: 100%;
 }
 
+[dir=ltr] .icon {
+  left: 0;
+  border-bottom-left-radius: 5px;
+}
+
+[dir=rtl] .icon {
+  right: 0;
+  border-bottom-right-radius: 5px;
+}
+
 .success {
   composes: icon;
   background: var(--zdt_message_success_bg);
@@ -63,8 +89,15 @@
 .close {
   color: var(--zdt_message_close_text);
   font-size: var(--zd_font_size16);
-  cursor: pointer;
   display: inline-block;
   vertical-align: middle;
+  cursor: pointer;
+}
+
+[dir=ltr] .close {
   margin-left: var(--zd_size10);
+}
+
+[dir=rtl] .close {
+  margin-right: var(--zd_size10);
 }

package/es/MessageBanner/MessageBanner.module.css

@@ -1,20 +1,28 @@
-.type_primary {
-}
 .type_secondary {
   max-width: var(--zd_size468);
   border-radius: 3px;
   margin: 0 auto;
 }
 .message {
-  padding: var(--zd_size10) 0;
   color: var(--zdt_messagebanner_text);
-  margin-left: var(--zd_size10);
   composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
+  padding: var(--zd_size10) 0;
+}
+[dir=ltr] .message {
+  margin-left: var(--zd_size10);
+}
+[dir=rtl] .message {
+  margin-right: var(--zd_size10);
 }
 .link {
   color: var(--zdt_messagebanner_link_text);
+}
+[dir=ltr] .link {
   margin-left: var(--zd_size5);
 }
+[dir=rtl] .link {
+  margin-right: var(--zd_size5);
+}
 .message,.link{font-size:  var(--zd_font_size14);}
 .close {
   color: var(--zdt_messagebanner_close_text);

package/es/NewStar/NewStar.module.css

@@ -5,26 +5,53 @@
   width: var(--zd_size21);
 }
 .topLeft {
+  top: 0;
+}
+[dir=ltr] .topLeft {
   transform: translate(-45%, -45%);
   left: 0;
-  top: 0;
 }
-.topRight {
+[dir=rtl] .topLeft {
   transform: translate(45%, -45%);
   right: 0;
+}
+.topRight {
   top: 0;
 }
+[dir=ltr] .topRight {
+  transform: translate(45%, -45%);
+  right: 0;
+}
+[dir=rtl] .topRight {
+  transform: translate(-45%, -45%);
+  left: 0;
+}
 .bottomLeft {
+  bottom: 0;
+}
+[dir=ltr] .bottomLeft {
   transform: translate(-45%, 45%);
   left: 0;
-  bottom: 0;
 }
-.bottomRight {
+[dir=rtl] .bottomLeft {
   transform: translate(45%, 45%);
   right: 0;
+}
+.bottomRight {
   bottom: 0;
 }
-.stars {
+[dir=ltr] .bottomRight {
+  transform: translate(45%, 45%);
+  right: 0;
+}
+[dir=rtl] .bottomRight {
+  transform: translate(-45%, 45%);
+  left: 0;
+}
+[dir=ltr] .stars {
+  animation: twinkle var(--zd_transition4) infinite, star-scale var(--zd_transition10) infinite;
+}
+[dir=rtl] .stars {
   animation: twinkle var(--zd_transition4) infinite, star-scale var(--zd_transition10) infinite;
 }
 .green::before {
@@ -41,10 +68,20 @@
 }
 .starTwo {
   composes: stars;
+}
+[dir=ltr] .starTwo {
+  animation-delay: 0.5s;
+}
+[dir=rtl] .starTwo {
   animation-delay: 0.5s;
 }
 .starThree {
   composes: stars;
+}
+[dir=ltr] .starThree {
+  animation-delay: 1s;
+}
+[dir=rtl] .starThree {
   animation-delay: 1s;
 }
 

package/es/Provider.js

@@ -7,65 +7,65 @@ import datetime from '@zohodesk/datetimejs';
 import i18n from './i18n';
 /* component pkg - default mode & themes */
 
-import '@zohodesk/components/lib/Appearance/default/themes/blue/blueDefaultCTATheme.module.css';
-import '@zohodesk/components/lib/Appearance/default/themes/green/greenDefaultCTATheme.module.css';
-import '@zohodesk/components/lib/Appearance/default/themes/orange/orangeDefaultCTATheme.module.css';
-import '@zohodesk/components/lib/Appearance/default/themes/red/redDefaultCTATheme.module.css';
-import '@zohodesk/components/lib/Appearance/default/themes/yellow/yellowDefaultCTATheme.module.css';
-import '@zohodesk/components/lib/Appearance/default/themes/blue/blueDefaultComponentTheme.module.css';
-import '@zohodesk/components/lib/Appearance/default/themes/green/greenDefaultComponentTheme.module.css';
-import '@zohodesk/components/lib/Appearance/default/themes/orange/orangeDefaultComponentTheme.module.css';
-import '@zohodesk/components/lib/Appearance/default/themes/red/redDefaultComponentTheme.module.css';
-import '@zohodesk/components/lib/Appearance/default/themes/yellow/yellowDefaultComponentTheme.module.css';
-import '@zohodesk/components/lib/Appearance/default/mode/defaultMode.module.css';
+import '@zohodesk/components/assets/Appearance/default/themes/blue/blueDefaultCTATheme.module.css';
+import '@zohodesk/components/assets/Appearance/default/themes/green/greenDefaultCTATheme.module.css';
+import '@zohodesk/components/assets/Appearance/default/themes/orange/orangeDefaultCTATheme.module.css';
+import '@zohodesk/components/assets/Appearance/default/themes/red/redDefaultCTATheme.module.css';
+import '@zohodesk/components/assets/Appearance/default/themes/yellow/yellowDefaultCTATheme.module.css';
+import '@zohodesk/components/assets/Appearance/default/themes/blue/blueDefaultComponentTheme.module.css';
+import '@zohodesk/components/assets/Appearance/default/themes/green/greenDefaultComponentTheme.module.css';
+import '@zohodesk/components/assets/Appearance/default/themes/orange/orangeDefaultComponentTheme.module.css';
+import '@zohodesk/components/assets/Appearance/default/themes/red/redDefaultComponentTheme.module.css';
+import '@zohodesk/components/assets/Appearance/default/themes/yellow/yellowDefaultComponentTheme.module.css';
+import '@zohodesk/components/assets/Appearance/default/mode/defaultMode.module.css';
 /* component pkg - dark mode & themes */
 
-import '@zohodesk/components/lib/Appearance/dark/themes/blue/blueDarkCTATheme.module.css';
-import '@zohodesk/components/lib/Appearance/dark/themes/green/greenDarkCTATheme.module.css';
-import '@zohodesk/components/lib/Appearance/dark/themes/orange/orangeDarkCTATheme.module.css';
-import '@zohodesk/components/lib/Appearance/dark/themes/red/redDarkCTATheme.module.css';
-import '@zohodesk/components/lib/Appearance/dark/themes/yellow/yellowDarkCTATheme.module.css';
-import '@zohodesk/components/lib/Appearance/dark/themes/blue/blueDarkComponentTheme.module.css';
-import '@zohodesk/components/lib/Appearance/dark/themes/green/greenDarkComponentTheme.module.css';
-import '@zohodesk/components/lib/Appearance/dark/themes/orange/orangeDarkComponentTheme.module.css';
-import '@zohodesk/components/lib/Appearance/dark/themes/red/redDarkComponentTheme.module.css';
-import '@zohodesk/components/lib/Appearance/dark/themes/yellow/yellowDarkComponentTheme.module.css';
-import '@zohodesk/components/lib/Appearance/dark/mode/darkMode.module.css';
+import '@zohodesk/components/assets/Appearance/dark/themes/blue/blueDarkCTATheme.module.css';
+import '@zohodesk/components/assets/Appearance/dark/themes/green/greenDarkCTATheme.module.css';
+import '@zohodesk/components/assets/Appearance/dark/themes/orange/orangeDarkCTATheme.module.css';
+import '@zohodesk/components/assets/Appearance/dark/themes/red/redDarkCTATheme.module.css';
+import '@zohodesk/components/assets/Appearance/dark/themes/yellow/yellowDarkCTATheme.module.css';
+import '@zohodesk/components/assets/Appearance/dark/themes/blue/blueDarkComponentTheme.module.css';
+import '@zohodesk/components/assets/Appearance/dark/themes/green/greenDarkComponentTheme.module.css';
+import '@zohodesk/components/assets/Appearance/dark/themes/orange/orangeDarkComponentTheme.module.css';
+import '@zohodesk/components/assets/Appearance/dark/themes/red/redDarkComponentTheme.module.css';
+import '@zohodesk/components/assets/Appearance/dark/themes/yellow/yellowDarkComponentTheme.module.css';
+import '@zohodesk/components/assets/Appearance/dark/mode/darkMode.module.css';
 /* svg pkg - default mode & themes */
 
-import '@zohodesk/svg/lib/svg/Appearance/default/themes/blue/blueDefaultCTATheme.module.css';
-import '@zohodesk/svg/lib/svg/Appearance/default/themes/green/greenDefaultCTATheme.module.css';
-import '@zohodesk/svg/lib/svg/Appearance/default/themes/orange/orangeDefaultCTATheme.module.css';
-import '@zohodesk/svg/lib/svg/Appearance/default/themes/red/redDefaultCTATheme.module.css';
-import '@zohodesk/svg/lib/svg/Appearance/default/themes/yellow/yellowDefaultCTATheme.module.css';
-import '@zohodesk/svg/lib/svg/Appearance/default/mode/defaultEmptyStates.module.css';
+import '@zohodesk/svg/assets/Appearance/default/themes/blue/blueDefaultCTATheme.module.css';
+import '@zohodesk/svg/assets/Appearance/default/themes/green/greenDefaultCTATheme.module.css';
+import '@zohodesk/svg/assets/Appearance/default/themes/orange/orangeDefaultCTATheme.module.css';
+import '@zohodesk/svg/assets/Appearance/default/themes/red/redDefaultCTATheme.module.css';
+import '@zohodesk/svg/assets/Appearance/default/themes/yellow/yellowDefaultCTATheme.module.css';
+import '@zohodesk/svg/assets/Appearance/default/mode/defaultEmptyStates.module.css';
 /* svg pkg - dark mode & themes */
 
-import '@zohodesk/svg/lib/svg/Appearance/dark/themes/blue/blueDarkCTATheme.module.css';
-import '@zohodesk/svg/lib/svg/Appearance/dark/themes/green/greenDarkCTATheme.module.css';
-import '@zohodesk/svg/lib/svg/Appearance/dark/themes/orange/orangeDarkCTATheme.module.css';
-import '@zohodesk/svg/lib/svg/Appearance/dark/themes/red/redDarkCTATheme.module.css';
-import '@zohodesk/svg/lib/svg/Appearance/dark/themes/yellow/yellowDarkCTATheme.module.css';
-import '@zohodesk/svg/lib/svg/Appearance/dark/mode/darkEmptyStates.module.css';
+import '@zohodesk/svg/assets/Appearance/dark/themes/blue/blueDarkCTATheme.module.css';
+import '@zohodesk/svg/assets/Appearance/dark/themes/green/greenDarkCTATheme.module.css';
+import '@zohodesk/svg/assets/Appearance/dark/themes/orange/orangeDarkCTATheme.module.css';
+import '@zohodesk/svg/assets/Appearance/dark/themes/red/redDarkCTATheme.module.css';
+import '@zohodesk/svg/assets/Appearance/dark/themes/yellow/yellowDarkCTATheme.module.css';
+import '@zohodesk/svg/assets/Appearance/dark/mode/darkEmptyStates.module.css';
 import { setGlobalIdPrefix } from '@zohodesk/components/lib/Provider/IdProvider';
 import { setInitialZIndex } from '@zohodesk/components/lib/Provider/ZindexProvider';
 import Switch from '@zohodesk/components/lib/Switch/Switch';
 /* dot pkg - default mode & themes */
 
-import './Appearance/default/themes/blue/blueDefaultDotTheme.module.css';
-import './Appearance/default/themes/green/greenDefaultDotTheme.module.css';
-import './Appearance/default/themes/orange/orangeDefaultDotTheme.module.css';
-import './Appearance/default/themes/red/redDefaultDotTheme.module.css';
-import './Appearance/default/themes/yellow/yellowDefaultDotTheme.module.css';
-import './Appearance/default/mode/dotDefaultMode.module.css';
+import '../assets/Appearance/default/themes/blue/blueDefaultDotTheme.module.css';
+import '../assets/Appearance/default/themes/green/greenDefaultDotTheme.module.css';
+import '../assets/Appearance/default/themes/orange/orangeDefaultDotTheme.module.css';
+import '../assets/Appearance/default/themes/red/redDefaultDotTheme.module.css';
+import '../assets/Appearance/default/themes/yellow/yellowDefaultDotTheme.module.css';
+import '../assets/Appearance/default/mode/dotDefaultMode.module.css';
 /* dot pkg - dark mode & themes */
 
-import './Appearance/dark/themes/blue/blueDarkDotTheme.module.css';
-import './Appearance/dark/themes/green/greenDarkDotTheme.module.css';
-import './Appearance/dark/themes/orange/orangeDarkDotTheme.module.css';
-import './Appearance/dark/themes/red/redDarkDotTheme.module.css';
-import './Appearance/dark/themes/yellow/yellowDarkDotTheme.module.css';
-import './Appearance/dark/mode/dotDarkMode.module.css';
+import '../assets/Appearance/dark/themes/blue/blueDarkDotTheme.module.css';
+import '../assets/Appearance/dark/themes/green/greenDarkDotTheme.module.css';
+import '../assets/Appearance/dark/themes/orange/orangeDarkDotTheme.module.css';
+import '../assets/Appearance/dark/themes/red/redDarkDotTheme.module.css';
+import '../assets/Appearance/dark/themes/yellow/yellowDarkDotTheme.module.css';
+import '../assets/Appearance/dark/mode/dotDarkMode.module.css';
 datetime.tz.set({
   timezone: 'Asia/Kolkata',
   _packed: '-5R.s -5R.k -5l.a -5u -6u|01234343|-4Fg5R.s BKo0.8 1rDcw.a 1r2LP.a 1un0 HB0 7zX0|15e6',