npm - @zohodesk/dot - Versions diffs - 1.0.0-temp-62 → 1.0.0-temp-63 - Mend

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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (343) hide show

package/lib/form/fields/TextEditor/TextEditor.module.css CHANGED Viewed

@@ -17,8 +17,13 @@
 }
 .threeDotIcon {
   display: inline-block;
+}
+[dir=ltr] .threeDotIcon {
   transform: rotate(90deg);
 }
+[dir=rtl] .threeDotIcon {
+  transform: rotate(-90deg);
+}
 .textEditor * {
   box-sizing: initial;
   line-height: initial;
@@ -32,59 +37,31 @@
   box-sizing: border-box;
 }
 .light :global .KB_Editor {
-  background-color: var(--zdt_texteditor_default_bg);
   color: var(--zdt_texteditor_default_text);
+  background-color: var(--zdt_texteditor_default_bg);
 }
 .night :global .KB_Editor {
-  background-color: var(--zdt_texteditor_night_bg);
   color: var(--zdt_texteditor_night_text);
+  background-color: var(--zdt_texteditor_night_bg);
 }
-.small :global .KB_Editor_menus,
-.medium :global .KB_Editor_menus,
-.large :global .KB_Editor_menus,
-.xlarge :global .KB_Editor_menus,
-.default :global .KB_Editor_menus {
+.small :global .KB_Editor_menus, .medium :global .KB_Editor_menus, .large :global .KB_Editor_menus, .xlarge :global .KB_Editor_menus, .default :global .KB_Editor_menus {
   background-color: var(--zdt_texteditor_menu_bg);
   box-shadow: none;
 }
-.medium.borderTop :global .KB_Editor,
-.large.borderTop :global .KB_Editor,
-.xlarge.borderTop :global .KB_Editor,
-.default.borderTop :global .KB_Editor {
+.medium.borderTop :global .KB_Editor, .large.borderTop :global .KB_Editor, .xlarge.borderTop :global .KB_Editor, .default.borderTop :global .KB_Editor {
   border: 0;
   border-top: 1px solid var(--zdt_texteditor_default_border);
 }
-.medium.borderAll :global .KB_Editor,
-.large.borderAll :global .KB_Editor,
-.xlarge.borderAll :global .KB_Editor,
-.default.borderAll :global .KB_Editor {
+.medium.borderAll :global .KB_Editor, .large.borderAll :global .KB_Editor, .xlarge.borderAll :global .KB_Editor, .default.borderAll :global .KB_Editor {
   border: solid 1px var(--zdt_texteditor_default_border);
 }
-.medium :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Insert_Type,
-.medium :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.TextSize_Type,
-.medium :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Text_Type,
-.large :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Insert_Type,
-.large :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.TextSize_Type,
-.large :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Text_Type,
-.xlarge :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Insert_Type,
-.xlarge :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.TextSize_Type,
-.xlarge :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Text_Type,
-.default :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Insert_Type,
-.default :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.TextSize_Type,
-.default :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Text_Type {
+.medium :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Insert_Type, .medium :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.TextSize_Type, .medium :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Text_Type, .large :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Insert_Type, .large :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.TextSize_Type, .large :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Text_Type, .xlarge :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Insert_Type, .xlarge :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.TextSize_Type, .xlarge :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Text_Type, .default :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Insert_Type, .default :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.TextSize_Type, .default :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Text_Type {
   border: solid 1px var(--zdt_texteditor_default_border);
   background-color: transparent;
 }
-.medium :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText,
-.medium :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext,
-.large :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText,
-.large :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext,
-.xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText,
-.xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext,
-.default :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText,
-.default :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext {
+.medium :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText, .medium :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext, .large :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText, .large :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext, .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText, .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext, .default :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText, .default :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext {
   background-color: transparent;
 }
@@ -98,10 +75,13 @@
 .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools > li.KB_Editor_sel,
 .default :global .KB_Editor_menus .KB_Editor_MultiTools > li:hover,
 .default :global .KB_Editor_menus .KB_Editor_MultiTools > li.KB_Editor_sel {
-  background-color: var(--zdt_texteditor_menu_li_bg);
   color: var(--zdt_texteditor_default_text);
 }
+.small :global .KB_Editor_menus .KB_Editor_MultiTools > li:hover, .small :global .KB_Editor_menus .KB_Editor_MultiTools > li.KB_Editor_sel, .medium :global .KB_Editor_menus .KB_Editor_MultiTools > li:hover, .medium :global .KB_Editor_menus .KB_Editor_MultiTools > li.KB_Editor_sel, .large :global .KB_Editor_menus .KB_Editor_MultiTools > li:hover, .large :global .KB_Editor_menus .KB_Editor_MultiTools > li.KB_Editor_sel, .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools > li:hover, .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools > li.KB_Editor_sel, .default :global .KB_Editor_menus .KB_Editor_MultiTools > li:hover, .default :global .KB_Editor_menus .KB_Editor_MultiTools > li.KB_Editor_sel {
+  background-color: var(--zdt_texteditor_menu_li_bg);
+}
 .textEditor :global .KB_Editor_MultiTools li .Kbeditor_more_icon svg {
   fill: var(--zdt_texteditor_more_icon_fill);
 }
@@ -148,6 +128,8 @@
 .default :global .KB_Editor_menus {
   min-height: unset; /* check point 1 */
   flex: 0 0 auto;
+}
+.large :global .KB_Editor_menus, .default :global .KB_Editor_menus {
   padding: var(--zd_size6);
   border-bottom: 0;
 }
@@ -159,20 +141,26 @@
 }
 .large :global .KB_Editor_menus .KB_Editor_MultiTools > li,
 .default :global .KB_Editor_menus .KB_Editor_MultiTools > li {
-  padding: 0;
-  float: unset;
   height: unset;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
+}
+.large :global .KB_Editor_menus .KB_Editor_MultiTools > li, .default :global .KB_Editor_menus .KB_Editor_MultiTools > li {
+  padding: 0;
+  float: unset;
+}
+[dir=ltr] .large :global .KB_Editor_menus .KB_Editor_MultiTools > li, [dir=ltr] .default :global .KB_Editor_menus .KB_Editor_MultiTools > li {
   margin-right: 0;
 }
+[dir=rtl] .large :global .KB_Editor_menus .KB_Editor_MultiTools > li, [dir=rtl] .default :global .KB_Editor_menus .KB_Editor_MultiTools > li {
+  margin-left: 0;
+}
 .large :global .KB_Editor_menus .KB_Editor_MultiTools li span,
 .default :global .KB_Editor_menus .KB_Editor_MultiTools li span {
   line-height: 0;
 }
-.large :global .KB_Editor_menus .KB_Editor_MultiTools li.fright,
-.defaults :global .KB_Editor_menus .KB_Editor_MultiTools li.fright {
+.large :global .KB_Editor_menus .KB_Editor_MultiTools li.fright, .defaults :global .KB_Editor_menus .KB_Editor_MultiTools li.fright {
   float: unset !important;
 }
 .large :global .KB_Editor_menus > ul > li > span > svg,
@@ -188,9 +176,11 @@
 .large :global .KB_Editor_MultiTools .KBEditortools-Block-down-arrow svg,
 .default :global .KB_Editor_MultiTools .KBEditortools-Block-down-arrow svg {
   height: var(--zd_size10);
-  padding: var(--zd_size7) var(--zd_size5);
   width: var(--zd_size17);
 }
+.large :global .KB_Editor_MultiTools .KBEditortools-Block-down-arrow svg, .default :global .KB_Editor_MultiTools .KBEditortools-Block-down-arrow svg {
+  padding: var(--zd_size7) var(--zd_size5);
+}
 .large :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Bdr_div,
 .large :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Insert_Type,
 .large :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText,
@@ -200,18 +190,27 @@
 .default :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText,
 .default :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext {
   line-height: unset;
+}
+.large :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Bdr_div, .large :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Insert_Type, .large :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText, .large :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext, .default :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Bdr_div, .default :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Insert_Type, .default :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText, .default :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext {
   padding: var(--zd_size3) var(--zd_size6);
 }
 .large :global .KB_Editor_menus .ze_spell,
 .default :global .KB_Editor_menus .ze_spell {
   top: initial;
   bottom: calc(var(--zd_size32) * -1);
+}
+[dir=ltr] .large :global .KB_Editor_menus .ze_spell, [dir=ltr] .default :global .KB_Editor_menus .ze_spell {
   right: 0;
 }
-.large :global .KB_Editor_menus .KB_Editor_MultiTools > li,
-.default :global .KB_Editor_menus .KB_Editor_MultiTools > li {
+[dir=rtl] .large :global .KB_Editor_menus .ze_spell, [dir=rtl] .default :global .KB_Editor_menus .ze_spell {
+  left: 0;
+}
+[dir=ltr] .large :global .KB_Editor_menus .KB_Editor_MultiTools > li, [dir=ltr] .default :global .KB_Editor_menus .KB_Editor_MultiTools > li {
   margin-right: var(--zd_size2);
 }
+[dir=rtl] .large :global .KB_Editor_menus .KB_Editor_MultiTools > li, [dir=rtl] .default :global .KB_Editor_menus .KB_Editor_MultiTools > li {
+  margin-left: var(--zd_size2);
+}
 /* xlarge type editor - reply area, blue print cases - full height hover style */
 .xlarge :global .KB_Editor,
@@ -243,8 +242,8 @@
 }
 .xlarge :global .KB_Editor_menus {
   min-height: 37px; /* check point 1 */
-  padding: 0;
   flex: 0 0 auto;
+  padding: 0;
 }
 .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools {
   -ms-flex-wrap: wrap;
@@ -252,14 +251,19 @@
   min-height: inherit;
 }
 .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools > li {
-  padding: 0;
-  float: unset;
   height: unset;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
+  padding: 0;
+  float: unset;
+}
+[dir=ltr] .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools > li {
   margin-right: 0;
 }
+[dir=rtl] .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools > li {
+  margin-left: 0;
+}
 .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools li span {
   line-height: 0;
 }
@@ -267,6 +271,8 @@
 .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText,
 .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext {
   line-height: 0;
+}
+.xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Bdr_div, .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText, .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext {
   padding: var(--zd_size6);
 }
 .xlarge :global .KB_Editor_menus > ul > li > span > svg {
@@ -279,24 +285,29 @@
 }
 .xlarge :global .KB_Editor_MultiTools .KBEditortools-Block-down-arrow svg {
   height: var(--zd_size9);
-  padding: var(--zd_size7) var(--zd_size5);
   width: var(--zd_size17);
+  padding: var(--zd_size7) var(--zd_size5);
 }
 .xlarge :global .KB_Editor_menus .ze_spell {
   top: initial;
   bottom: -32px;
+}
+[dir=ltr] .xlarge :global .KB_Editor_menus .ze_spell {
   right: 0;
 }
+[dir=rtl] .xlarge :global .KB_Editor_menus .ze_spell {
+  left: 0;
+}
 .xlarge :global .KB_Editor_menus > ul > li > span.SnippetIcon svg {
   width: var(--zd_size17);
-  padding: 0 var(--zd_size7);
   height: var(--zd_size21);
+  padding: 0 var(--zd_size7);
 }
 .xlarge :global .KB_Editor_menus > ul > li > span.TemplateIcon svg {
   width: var(--zd_size16);
-  padding: 0 var(--zd_size9);
   height: var(--zd_size16);
+  padding: 0 var(--zd_size9);
 }
 .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .SnippetIcon {
   position: relative;
@@ -306,10 +317,16 @@
   position: absolute;
   height: 100%;
   width: var(--zd_size1);
-  border-right: 1px solid var(--zdt_texteditor_default_border);
   top: 0;
+}
+[dir=ltr] .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .SnippetIcon::after {
+  border-right: 1px solid var(--zdt_texteditor_default_border);
   right: 0;
 }
+[dir=rtl] .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .SnippetIcon::after {
+  border-left: 1px solid var(--zdt_texteditor_default_border);
+  left: 0;
+}
 .xlarge :global .KB_Editor_MultiTools li .Kbeditor_more_icon {
   top: initial;
   padding: 0 var(--zd_size7);
@@ -337,12 +354,18 @@
   height: var(--zd_size21);
   padding: 0 var(--zd_size4);
 }
-.xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText {
+[dir=ltr] .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText {
   padding: var(--zd_size8) var(--zd_size8) var(--zd_size7) var(--zd_size4);
 }
-.xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext {
+[dir=rtl] .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText {
+  padding: var(--zd_size8) var(--zd_size4) var(--zd_size7) var(--zd_size8);
+}
+[dir=ltr] .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext {
   padding: var(--zd_size8) var(--zd_size4) var(--zd_size7) var(--zd_size8);
 }
+[dir=rtl] .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext {
+  padding: var(--zd_size8) var(--zd_size8) var(--zd_size7) var(--zd_size4);
+}
 /* medium type editor - snippet, bug tracker cases */
 .medium :global .KB_Editor,
@@ -384,12 +407,12 @@
   min-height: inherit;
 }
 .medium :global .KB_Editor_menus .KB_Editor_MultiTools > li {
-  padding: var(--zd_size3) var(--zd_size1);
-  float: unset;
   height: unset;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
+  padding: var(--zd_size3) var(--zd_size1);
+  float: unset;
 }
 .medium :global .KB_Editor_menus .KB_Editor_MultiTools li span {
   line-height: 0;
@@ -401,24 +424,38 @@
 .medium :global .KB_Editor_menus > ul > li > span.KB_Editor_Bdr_div > svg {
   width: var(--zd_size8);
   height: var(--zd_size8);
+}
+[dir=ltr] .medium :global .KB_Editor_menus > ul > li > span.KB_Editor_Bdr_div > svg {
   padding: 0 0 0 var(--zd_size2);
 }
+[dir=rtl] .medium :global .KB_Editor_menus > ul > li > span.KB_Editor_Bdr_div > svg {
+  padding: 0 var(--zd_size2) 0 0;
+}
 .medium :global .KB_Editor_MultiTools .KBEditortools-Block-down-arrow svg {
   height: var(--zd_size10);
-  padding: var(--zd_size7) var(--zd_size2);
   width: var(--zd_size17);
+  padding: var(--zd_size7) var(--zd_size2);
 }
 .medium :global .KB_Editor_MultiTools .KB_Editor_Bdr_div,
 .medium :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Insert_Type {
   line-height: 0;
+}
+.medium :global .KB_Editor_MultiTools .KB_Editor_Bdr_div, .medium :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Insert_Type {
   padding: var(--zd_size7);
 }
 .medium :global .KB_Editor_menus .ze_spell {
   top: initial;
   bottom: calc(var(--zd_size32) * -1);
+}
+[dir=ltr] .medium :global .KB_Editor_menus .ze_spell {
   right: 0;
 }
+[dir=rtl] .medium :global .KB_Editor_menus .ze_spell {
+  left: 0;
+}
 .medium :global .KB_Editor_MultiTools li .Kbeditor_more_icon {
   top: initial;
   padding: 0 var(--zd_size3);
@@ -432,6 +469,8 @@
 .small :global .KB_Editor,
 .mini :global .KB_Editor {
   height: 100%;
+}
+.small :global .KB_Editor, .mini :global .KB_Editor {
   border: 0;
 }
 .small :global .KB_Editor_iframe,
@@ -440,27 +479,29 @@
   min-height: var(--zd_size80);
   height: var(--zd_size80);
 }
-.small.borderNone :global .KB_Editor,
-.mini.borderNone :global .KB_Editor,
-.medium.borderNone :global .KB_Editor,
-.large.borderNone :global .KB_Editor,
-.xlarge.borderNone :global .KB_Editor,
-.default.borderNone :global .KB_Editor {
+.small.borderNone :global .KB_Editor, .mini.borderNone :global .KB_Editor, .medium.borderNone :global .KB_Editor, .large.borderNone :global .KB_Editor, .xlarge.borderNone :global .KB_Editor, .default.borderNone :global .KB_Editor {
   border: 0;
 }
 .small :global .KB_Editor_menus,
 .mini :global .KB_Editor_menus {
   bottom: 0;
-  border: 0;
   z-index: 1;
-  padding: 0;
   min-height: auto;
   height: var(--zd_size40);
-  left: 0;
   width: var(--zd_size406);
   transition: opacity var(--zd_transition3);
   position: absolute;
 }
+.small :global .KB_Editor_menus, .mini :global .KB_Editor_menus {
+  border: 0;
+  padding: 0;
+}
+[dir=ltr] .small :global .KB_Editor_menus, [dir=ltr] .mini :global .KB_Editor_menus {
+  left: 0;
+}
+[dir=rtl] .small :global .KB_Editor_menus, [dir=rtl] .mini :global .KB_Editor_menus {
+  right: 0;
+}
 .small :global .KB_Editor_MultiTools,
 .mini :global .KB_Editor_MultiTools {
   display: -webkit-box;
@@ -471,6 +512,8 @@
 .small :global .KB_Editor_MultiTools li,
 .mini :global .KB_Editor_MultiTools li {
   height: 100%;
+}
+.small :global .KB_Editor_MultiTools li, .mini :global .KB_Editor_MultiTools li {
   padding: 0;
   float: unset;
 }
@@ -490,6 +533,8 @@
 .mini :global .KB_Editor_menus > ul > li > span > svg {
   width: var(--zd_size25);
   height: var(--zd_size25);
+}
+.small :global .KB_Editor_menus > ul > li > span > svg, .mini :global .KB_Editor_menus > ul > li > span > svg {
   padding: 0 var(--zd_size6);
 }
 .mini :global .KB_Editor_menus:after {
@@ -498,31 +543,45 @@
   bottom: calc(var(--zd_size5) * -1);
   height: var(--zd_size10);
   width: var(--zd_size10);
+  z-index: -1;
+  background-color: var(--zdt_texteditor_menu_after_bg);
+}
+[dir=ltr] .mini :global .KB_Editor_menus:after {
   left: var(--zd_size95);
   box-shadow: -1px 1px 2px 0 var(--zdt_texteditor_menu_after_box_shadow);
-  background-color: var(--zdt_texteditor_menu_after_bg);
   -webkit-transform: rotateZ(-45deg);
   -moz-transform: rotateZ(-45deg);
   -ms-transform: rotateZ(-45deg);
   -o-transform: rotateZ(-45deg);
   transform: rotateZ(-45deg);
-  z-index: -1;
+}
+[dir=rtl] .mini :global .KB_Editor_menus:after {
+  right: var(--zd_size95);
+  box-shadow: 1px 1px 2px 0 var(--zdt_texteditor_menu_after_box_shadow);
+  -webkit-transform: rotateZ(45deg);
+  -moz-transform: rotateZ(45deg);
+  -ms-transform: rotateZ(45deg);
+  -o-transform: rotateZ(45deg);
+  transform: rotateZ(45deg);
 }
 :global .hideTools .KB_Editor_menus {
   height: 0;
   overflow: hidden;
+  opacity: 0;
   box-shadow: 0 0 0 transparent;
   border: 0;
-  opacity: 0;
 }
 /* mini type - tdv left area comment */
 .mini :global .KB_Editor_menus {
   width: var(--zd_size205);
 }
-.mini :global .KB_Editor_menus:after {
+[dir=ltr] .mini :global .KB_Editor_menus:after {
   left: var(--zd_size55);
 }
+[dir=rtl] .mini :global .KB_Editor_menus:after {
+  right: var(--zd_size55);
+}
 :global .KB_Editor_UploadImage.hide,
 :global .KB_Editor_UploadImage .hide,
@@ -537,16 +596,23 @@
   width: 15px;
   height: 15px;
   top: -5px;
+}
+[dir=ltr] .textEditor :global .KB_Editor_menus ul .KBEditortools-quote svg {
   left: 5px;
 }
+[dir=rtl] .textEditor :global .KB_Editor_menus ul .KBEditortools-quote svg {
+  right: 5px;
+}
 .textEditor :global .KB_Editor_common_DropDown {
   padding: 0 !important;
 }
 .textEditor :global .KB_Editor_common_DropDown ul {
-  box-shadow: 0 1px 32px 0 var(--zdt_texteditor_dropdown_box_shadow);
   max-height: 210px;
   overflow: auto;
+  box-shadow: 0 1px 32px 0 var(--zdt_texteditor_dropdown_box_shadow);
   padding: 0;
 }
@@ -567,16 +633,23 @@
   order: 100;
 }
 .readOnly {
-  cursor: not-allowed;
   position: relative;
+  cursor: not-allowed;
 }
 .readOnlyMask {
   position: absolute;
   top: 0;
+  bottom: 0;
+}
+[dir=ltr] .readOnlyMask {
   left: 0;
   right: 0;
-  bottom: 0;
 }
-.readOnly :global .KB_Editor_menus {
+[dir=rtl] .readOnlyMask {
+  right: 0;
+  left: 0;
+}
+.readOnly :global .KB_Editor_menus,
+.editorHide :global .KB_Editor {
   display: none !important;
 }

package/lib/form/fields/TextEditorField/TextEditorField.js CHANGED Viewed

@@ -1,6 +1,6 @@
 "use strict";
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -35,9 +35,9 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
-function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
 function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
@@ -156,7 +156,7 @@ var TextEditorField = /*#__PURE__*/function (_PureComponent) {
           _ePhiData$ePhiStatus = ePhiData.ePhiStatus,
           ePhiStatus = _ePhiData$ePhiStatus === void 0 ? false : _ePhiData$ePhiStatus;
       return /*#__PURE__*/_react["default"].createElement("div", {
-        className: "".concat(_FieldsModule["default"].container, " ").concat(className)
+        className: "".concat(_FieldsModule["default"].container, " ").concat(isDisabled ? _FieldsModule["default"].disabled : isReadOnly ? _FieldsModule["default"].readonly : '', " ").concat(className || '')
       }, /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
         isCover: false,
         alignBox: "row",
@@ -167,7 +167,7 @@ var TextEditorField = /*#__PURE__*/function (_PureComponent) {
         htmlFor: !isReadOnly && !isDisabled ? id : undefined,
         palette: isMandatory ? 'mandatory' : isDisabled ? 'primary' : labelPalette,
         onClick: this.handleLabelClick,
-        customClass: "".concat(labelCustomClass, " ").concat(isMandatory ? _FieldsModule["default"].labelMandatory : ''),
+        customClass: "".concat(_FieldsModule["default"].fieldLabel, " ").concat(labelCustomClass, " ").concat(isMandatory ? _FieldsModule["default"].labelMandatory : ''),
         dataId: isDisabled ? "".concat(dataId, "_label_disabled") : isMandatory ? "".concat(dataId, "_label_mandatory") : "".concat(dataId, "_label")
       }, LabelProps))), infoText ? /*#__PURE__*/_react["default"].createElement(_Icon["default"], {
         name: "ZD-GN-info",

package/lib/form/fields/TextEditorWrapper/TextEditorWrapper.js CHANGED Viewed

@@ -1,6 +1,6 @@
 "use strict";
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -33,9 +33,9 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
-function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
 function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
@@ -119,7 +119,7 @@ var TextEditorWrapper = /*#__PURE__*/function (_Component) {
           isEditorShow: true
         });
       } else {
-        if (!this.state.isEditorFocus) {
+        if (!this.state.isEditorFocus && !this.props.isEditorDefaultOpen) {
           this.setState({
             isEditorShow: false
           });

package/lib/form/fields/TextEditorWrapper/TextEditorWrapper.module.css CHANGED Viewed

@@ -6,16 +6,27 @@
   height: var(--zd_size28);
   width: 100%;
   position: absolute;
-  left: 0;
-  cursor: text;
   transition: border var(--zd_transition2) linear 0s;
+  cursor: text;
+}
+[dir=ltr] .textBox {
+  left: 0;
+  animation: fadeIn var(--zd_transition4);
+}
+[dir=rtl] .textBox {
+  right: 0;
   animation: fadeIn var(--zd_transition4);
 }
 .textEditor {
   position: relative;
   z-index: 1;
+}
+[dir=ltr] .textEditor {
   padding-right: 1px;
 }
+[dir=rtl] .textEditor {
+  padding-left: 1px;
+}
 @keyframes fadeIn {
   0% {
     opacity: 0;

package/lib/form/fields/TextareaField/TextareaField.js CHANGED Viewed

@@ -1,6 +1,6 @@
 "use strict";
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -35,9 +35,9 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
-function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
 function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
@@ -142,7 +142,7 @@ var TextareaField = /*#__PURE__*/function (_PureComponent) {
           ValidationMessageProps2 = _customProps$Validati2 === void 0 ? {} : _customProps$Validati2;
       var uniqueId = htmlId ? htmlId : this.getNextId();
       return /*#__PURE__*/_react["default"].createElement("div", {
-        className: "".concat(_FieldsModule["default"].container, " ").concat(isDisabled ? _FieldsModule["default"].disabled : ''),
+        className: "".concat(_FieldsModule["default"].container, " ").concat(isDisabled ? _FieldsModule["default"].disabled : isReadOnly ? _FieldsModule["default"].readonly : ''),
         "data-title": isDisabled ? title : ''
       }, labelName && /*#__PURE__*/_react["default"].createElement("div", {
         className: _FieldsModule["default"].labelContainer
@@ -151,7 +151,7 @@ var TextareaField = /*#__PURE__*/function (_PureComponent) {
         id: id,
         size: fieldSize === 'small' ? 'small' : 'medium',
         palette: isMandatory ? 'mandatory' : isDisabled ? 'primary' : labelPalette,
-        customClass: "".concat(labelCustomClass, " ").concat(isMandatory ? _FieldsModule["default"].labelMandatory : ''),
+        customClass: "".concat(_FieldsModule["default"].fieldLabel, " ").concat(labelCustomClass, " ").concat(isMandatory ? _FieldsModule["default"].labelMandatory : ''),
         htmlFor: uniqueId,
         dataId: isDisabled ? "".concat(dataId, "_label_disabled") : isMandatory ? "".concat(dataId, "_label_mandatory") : "".concat(dataId, "_label")
       }, LabelProps)), infoText ? /*#__PURE__*/_react["default"].createElement(_Icon["default"], {