@zohodesk/dot 1.0.0-temp-68 → 1.0.0-temp-71

package/es/errorstate/WillBack/WillBack.module.css

@@ -16,9 +16,7 @@
 .header {
   min-width: var(--zd_size450);
 }
-.imageContainer,
-.tabletImageContainer,
-.mobileImageContainer {
+.imageContainer, .tabletImageContainer, .mobileImageContainer {
   margin-top: calc(var(--zd_size70) * -1);
   margin-bottom: var(--zd_size30);
 }

package/es/form/fields/CurrencyField/CurrencyField.js

@@ -112,7 +112,7 @@ export default class CurrencyField extends PureComponent {
     } = this.state;
     let formatValue = value;
 
-    if (!isActive && value != 0) {
+    if (!isActive) {
       formatValue = formatCurrency(value, userCurrencyType);
     } else {
       formatValue = value;

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

@@ -34,15 +34,19 @@
   -webkit-line-clamp: 2;
 }
 .checkboxText {
-  padding-left: var(--zd_size6);
   composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
   line-height: normal;
 }
+[dir=ltr] .checkboxText {
+  padding-left: var(--zd_size6);
+}
+[dir=rtl] .checkboxText {
+  padding-right: var(--zd_size6);
+}
 .cbTextPointer {
   cursor: pointer;
 }
-.disabled,
-.readonly {
+.disabled, .readonly {
   cursor: not-allowed;
 }
 .cbTextReadonly,
@@ -50,12 +54,18 @@
 .readonly .fieldLabel {
   --label_cursor: not-allowed;
 }
-.radio {
+[dir=ltr] .radio {
   margin: var(--zd_size5) var(--zd_size32) var(--zd_size5) 0;
 }
-.duration {
+[dir=rtl] .radio {
+  margin: var(--zd_size5) 0 var(--zd_size5) var(--zd_size32);
+}
+[dir=ltr] .duration {
   margin-right: var(--zd_size15);
 }
+[dir=rtl] .duration {
+  margin-left: var(--zd_size15);
+}
 .durationWidth {
   width: var(--zd_size94);
 }
@@ -69,8 +79,8 @@
 }
 .phoneIcon {
   color: var(--zdt_fields_phoneicon_icon);
-  margin: var(--zd_size15) var(--zd_size10) 0 var(--zd_size10);
   display: inline-block;
+  margin: var(--zd_size15) var(--zd_size10) 0 var(--zd_size10);
   cursor: pointer;
 }
 .phoneIcon:hover {
@@ -89,9 +99,14 @@
 .lockIcon,
 .infoIcon {
   color: var(--zdt_fields_lockicon_icon);
-  margin-left: var(--zd_size5);
   composes: dInflex from '~@zohodesk/components/lib/common/common.module.css';
 }
+[dir=ltr] .lockIcon, [dir=ltr] .infoIcon {
+  margin-left: var(--zd_size5);
+}
+[dir=rtl] .lockIcon, [dir=rtl] .infoIcon {
+  margin-right: var(--zd_size5);
+}
 /* .infoIcon {
   opacity: 0;
   visibility: hidden;
@@ -108,15 +123,25 @@
 }
 .timeFormat {
   font-size: var(--zd_font_size11);
-  margin-left: var(--zd_size4);
   color: var(--zdt_fields_lockicon_icon);
 }
+[dir=ltr] .timeFormat {
+  margin-left: var(--zd_size4);
+}
+[dir=rtl] .timeFormat {
+  margin-right: var(--zd_size4);
+}
 .newTab {
-  margin-left: var(--zd_size6);
-  cursor: pointer;
   color: var(--zdt_fields_lockicon_icon);
   font-size: 0;
   display: none;
+  cursor: pointer;
+}
+[dir=ltr] .newTab {
+  margin-left: var(--zd_size6);
+}
+[dir=rtl] .newTab {
+  margin-right: var(--zd_size6);
 }
 .newTab:hover {
   color: var(--zdt_fields_phoneicon_icon);
@@ -131,18 +156,28 @@
 }
 .labelMandatory:after {
   content: '*';
-  padding-left: var(--zd_size2);
   color: var(--zdt_fields_lockicon_hover_icon);
 }
+[dir=ltr] .labelMandatory:after {
+  padding-left: var(--zd_size2);
+}
+[dir=rtl] .labelMandatory:after {
+  padding-right: var(--zd_size2);
+}
 .ePhiTag {
   composes: flexshrink from '~@zohodesk/components/lib/common/common.module.css';
   color: var(--zdt_fields_phitag_text);
+  font-size: var(--zd_font_size12);
+  height: var(--zd_size18);
+  line-height: var(--zd_size18);
   background-color: var(--zdt_fields_phitag_bg);
   border: 1px solid var(--zdt_fields_phitag_border);
-  font-size: var(--zd_font_size12);
   padding: 0 var(--zd_size5);
   border-radius: var(--zd_size3);
+}
+[dir=ltr] .ePhiTag {
   margin-left: var(--zd_size8);
-  height: var(--zd_size18);
-  line-height: var(--zd_size18);
+}
+[dir=rtl] .ePhiTag {
+  margin-right: var(--zd_size8);
 }

package/es/form/fields/TagsMultiSelect/TagsMultiSelect.js

@@ -117,7 +117,8 @@ export default class TagsMultiSelect extends React.Component {
       needBorder,
       borderColor,
       getTextBoxChildren,
-      htmlId
+      htmlId,
+      boxSize
     } = this.props;
     let {
       showAll
@@ -185,7 +186,7 @@ export default class TagsMultiSelect extends React.Component {
       isArrow: false,
       getRef: getContainerRef,
       isBoxPaddingNeed: true,
-      size: "default",
+      size: boxSize,
       boxPosition: boxPosition,
       isPadding: false,
       customClass: {
@@ -279,7 +280,8 @@ TagsMultiSelect.propTypes = {
   borderColor: PropTypes.oneOf(['transparent', 'default', 'dark']),
   needBorder: PropTypes.bool,
   getTextBoxChildren: PropTypes.func,
-  htmlId: PropTypes.string
+  htmlId: PropTypes.string,
+  boxSize: PropTypes.string
 };
 TagsMultiSelect.defaultProps = {
   className: '',
@@ -287,7 +289,8 @@ TagsMultiSelect.defaultProps = {
   chipNeedToShow: '5',
   borderColor: 'default',
   needBorder: true,
-  dataId: ''
+  dataId: '',
+  boxSize: 'default'
 };
 
 if (false) {

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

@@ -1,26 +1,28 @@
 .tag {
   max-width: 100%;
 }
-.moreLess,
-.tag {
+[dir=ltr] .moreLess, [dir=ltr] .tag {
   margin: 0 var(--zd_size6) var(--zd_size6) 0;
 }
+[dir=rtl] .moreLess, [dir=rtl] .tag {
+  margin: 0 0 var(--zd_size6) var(--zd_size6);
+}
 .input {
   height: var(--zd_size20);
-  margin-bottom: var(--zd_size4);
   width: 100%;
+  margin-bottom: var(--zd_size4);
 }
 .viewpopNew {
   max-height: var(--zd_size250);
 }
 .tagDiv {
-  margin-top: var(--zd_size5);
   max-height: var(--zd_size160);
+  margin-top: var(--zd_size5);
 }
 .hasBorder {
+  transition: border var(--zd_transition2) linear 0s;
   border-bottom-style: solid;
   border-bottom-width: 1px;
-  transition: border var(--zd_transition2) linear 0s;
 }
 .borderColor_transparent {
   border-bottom-color: var(--zdt_tagsmultiselect_transparent_border);
@@ -64,10 +66,15 @@
   font-size: 0;
 }
 .newTagLabel {
-  margin-right: var(--zd_size5);
   color: var(--zdt_tagsmultiselect_labelt_text);
   composes: semibold from '~@zohodesk/components/lib/common/common.module.css';
 }
+[dir=ltr] .newTagLabel {
+  margin-right: var(--zd_size5);
+}
+[dir=rtl] .newTagLabel {
+  margin-left: var(--zd_size5);
+}
 .dotted {
   composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
 }
@@ -87,9 +94,14 @@
 .custmInp {
   position: absolute;
   top: 0;
-  left: 0;
   width: 100%;
 }
+[dir=ltr] .custmInp {
+  left: 0;
+}
+[dir=rtl] .custmInp {
+  right: 0;
+}
 .newTagText {
   color: var(--zdt_tagsmultiselect_more_text);
 }

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

@@ -1,6 +1,9 @@
 .count {
   color: var(--zdt_tagsmultiselectField_count_text);
   font-size: var(--zd_font_size12);
-  margin-left: var(--zd_size4);
   word-break: break-word;
+}[dir=ltr] .count {
+  margin-left: var(--zd_size4);
+}[dir=rtl] .count {
+  margin-right: var(--zd_size4);
 }