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

package/es/NewStar/NewStar.module.css

@@ -5,53 +5,26 @@
   width: var(--zd_size21);
 }
 .topLeft {
-  top: 0;
-}
-[dir=ltr] .topLeft {
   transform: translate(-45%, -45%);
   left: 0;
-}
-[dir=rtl] .topLeft {
-  transform: translate(45%, -45%);
-  right: 0;
-}
-.topRight {
   top: 0;
 }
-[dir=ltr] .topRight {
+.topRight {
   transform: translate(45%, -45%);
   right: 0;
-}
-[dir=rtl] .topRight {
-  transform: translate(-45%, -45%);
-  left: 0;
+  top: 0;
 }
 .bottomLeft {
-  bottom: 0;
-}
-[dir=ltr] .bottomLeft {
   transform: translate(-45%, 45%);
   left: 0;
-}
-[dir=rtl] .bottomLeft {
-  transform: translate(45%, 45%);
-  right: 0;
-}
-.bottomRight {
   bottom: 0;
 }
-[dir=ltr] .bottomRight {
+.bottomRight {
   transform: translate(45%, 45%);
   right: 0;
+  bottom: 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 {
+.stars {
   animation: twinkle var(--zd_transition4) infinite, star-scale var(--zd_transition10) infinite;
 }
 .green::before {
@@ -68,20 +41,10 @@
 }
 .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',

package/es/ToastMessage/ToastMessage.module.css

@@ -1,33 +1,22 @@
 .container {
-  transition: all var(--zd_transition4);
-  position: relative;
-  max-height: 100%;
   border-radius: 5px;
   box-shadow: 0 5px 40px 7px var(--zdt_toastmessage_default_box_shadow);
   background-color: var(--zdt_toastmessage_default_bg);
+  transition: all var(--zd_transition4);
   margin-bottom: var(--zd_size7);
-}[dir=ltr] .container {
+  position: relative;
   transform-origin: right center;
-}[dir=rtl] .container {
-  transform-origin: left center;
+  max-height: 100%;
 }
 
 .closeAnimation {
   max-height: 0;
-  transition: all var(--zd_transition3) 0.4s;
   margin-bottom: 0;
+  transition: all var(--zd_transition3) 0.4s;
 }
 
 .animation {
   composes: modeForward from '~@zohodesk/components/lib/common/animation.module.css';
-}
-
-[dir=ltr] .animation {
-  animation-duration: var(--zd_transition4);
-  -webkit-animation-duration: var(--zd_transition4);
-}
-
-[dir=rtl] .animation {
   animation-duration: var(--zd_transition4);
   -webkit-animation-duration: var(--zd_transition4);
 }
@@ -38,8 +27,8 @@
 }
 
 .leftnoanimate {
-  opacity: 1;
   transform: translateX(0) scale(1);
+  opacity: 1;
 }
 
 .rightanimate {
@@ -54,26 +43,12 @@
 
 .alertifybanner {
   overflow: hidden;
-}
-
-[dir=ltr] .alertifybanner {
   border-radius: 5px 0 0 5px;
 }
 
-[dir=rtl] .alertifybanner {
-  border-radius: 0 5px 5px 0;
-}
-
 .alertright {
-  width: var(--zd_size105);
-}
-
-[dir=ltr] .alertright {
   border-left: 1px solid var(--zdt_toastmessage_alert_border);
-}
-
-[dir=rtl] .alertright {
-  border-right: 1px solid var(--zdt_toastmessage_alert_border);
+  width: var(--zd_size105);
 }
 
 .popbutton {
@@ -121,29 +96,20 @@
 
 .primary:hover,
 .alerttab:hover .coverfill.primary {
-  color: var(--zdt_toastmessage_primary_hover_text);
-}
-
-.primary:hover, .alerttab:hover .coverfill.primary {
   background-color: var(--zdt_toastmessage_primary_hover_bg);
+  color: var(--zdt_toastmessage_primary_hover_text);
 }
 
 .danger:hover,
 .alerttab:hover .coverfill.danger {
-  color: var(--zdt_toastmessage_primary_hover_text);
-}
-
-.danger:hover, .alerttab:hover .coverfill.danger {
   background-color: var(--zdt_toastmessage_danger_hover_bg);
+  color: var(--zdt_toastmessage_primary_hover_text);
 }
 
 .success:hover,
 .alerttab:hover .coverfill.success {
-  color: var(--zdt_toastmessage_primary_hover_text);
-}
-
-.success:hover, .alerttab:hover .coverfill.success {
   background-color: var(--zdt_toastmessage_success_hover_bg);
+  color: var(--zdt_toastmessage_primary_hover_text);
 }
 
 .alertleft {
@@ -165,26 +131,22 @@
   color: var(--zdt_toastmessage_alerttitle_text);
 }
 
-[dir=ltr] .alertTitleLeft {
+.alertTitleLeft {
   margin-right: var(--zd_size10);
 }
 
-[dir=rtl] .alertTitleLeft {
-  margin-left: var(--zd_size10);
-}
-
 .alertMessage {
   font-size: var(--zd_font_size12);
   composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
+  margin-top: var(--zd_size5);
   line-height: var(--zd_size16);
   color: var(--zdt_toastmessage_alert_text);
-  margin-top: var(--zd_size5);
 }
 
 .buttonText {
   font-size: inherit;
-  line-height: var(--zd_size14);
   text-align: center;
+  line-height: var(--zd_size14);
   padding: 0 var(--zd_size7);
   cursor: pointer;
 }
@@ -192,24 +154,13 @@
 .closeIcon,
 .closeIconPrimary {
   position: absolute;
+  right: 0;
   top: 0;
   z-index: 1;
-  color: var(--zdt_toastmessage_closeicon);
-}
-
-.closeIcon, .closeIconPrimary {
   padding: var(--zd_size2);
-  cursor: pointer;
-}
-
-[dir=ltr] .closeIcon, [dir=ltr] .closeIconPrimary {
-  right: 0;
   border-bottom-left-radius: 3px;
-}
-
-[dir=rtl] .closeIcon, [dir=rtl] .closeIconPrimary {
-  left: 0;
-  border-bottom-right-radius: 3px;
+  cursor: pointer;
+  color: var(--zdt_toastmessage_closeicon);
 }
 
 .closeIcon:hover {
@@ -226,63 +177,41 @@
 
 .dropdown {
   width: var(--zd_size23);
+  background: var(--zdt_toastmessage_dropdown_bg);
   position: relative;
   height: 100%;
   color: var(--zdt_toastmessage_dropdown_text);
-  background: var(--zdt_toastmessage_dropdown_bg);
 }
 
 .dropdown > i {
   position: absolute;
   top: 50%;
-}
-
-[dir=ltr] .dropdown > i {
   left: 50%;
   transform: translate(-50%, -50%);
 }
 
-[dir=rtl] .dropdown > i {
-  right: 50%;
-  transform: translate(50%, -50%);
-}
-
 .dropdown:hover i {
   color: var(--zdt_toastmessage_cancel_hover_text);
 }
 
 .message {
+  padding: var(--zd_size10) var(--zd_size20) var(--zd_size10) var(--zd_size76);
+  border-top: 1px solid var(--zdt_toastmessage_message_border);
+  cursor: pointer;
   position: relative;
   color: var(--zdt_toastmessage_popbutton_text);
   font-size: var(--zd_font_size11);
   composes: dotted textCap from '~@zohodesk/components/lib/common/common.module.css';
   height: var(--zd_size33);
   transition: padding var(--zd_transition3), height var(--zd_transition3);
-  border-top: 1px solid var(--zdt_toastmessage_message_border);
-  cursor: pointer;
   margin:0;
 }
 
-[dir=ltr] .message {
-  padding: var(--zd_size10) var(--zd_size20) var(--zd_size10) var(--zd_size76);
-}
-
-[dir=rtl] .message {
-  padding: var(--zd_size10) var(--zd_size76) var(--zd_size10) var(--zd_size20);
-}
-
 .messageOff {
-  height: 0;
-  font-size: 0;
   border-width: 0;
-}
-
-[dir=ltr] .messageOff {
   padding: 0 var(--zd_size20) 0 var(--zd_size76);
-}
-
-[dir=rtl] .messageOff {
-  padding: 0 var(--zd_size76) 0 var(--zd_size20);
+  height: 0;
+  font-size: 0;
 }
 
 .message:hover {
@@ -293,26 +222,26 @@
   width: var(--zd_size29);
   height: var(--zd_size29);
   line-height: var(--zd_size29);
-  composes: rounded from '~@zohodesk/components/lib/common/common.module.css';
   text-align: center;
+  composes: rounded from '~@zohodesk/components/lib/common/common.module.css';
 }
 
 .successFill {
   composes: fill;
-  color: var(--zdt_toastmessage_primary_hover_text);
   background: var(--zdt_toastmessage_successfill_bg);
+  color: var(--zdt_toastmessage_primary_hover_text);
 }
 
 .dangerFill {
   composes: fill;
-  color: var(--zdt_toastmessage_primary_hover_text);
   background: var(--zdt_toastmessage_danger_hover_bg);
+  color: var(--zdt_toastmessage_primary_hover_text);
 }
 
 .dangerShadow {
-  color: var(--zdt_toastmessage_danger_text);
   text-shadow: 0 4px 22px var(--zdt_toastmessage_danger_text_shadow);
   margin-top: var(--zd_size5);
+  color: var(--zdt_toastmessage_danger_text);
 }
 
 .successPlain {

package/es/Upload/Upload.module.css

@@ -1,8 +1,8 @@
 .container {
   position: relative;
+  cursor: pointer;
   transition: all var(--zd_transition3);
   vertical-align: middle;
-  cursor: pointer;
   padding: var(--zd_size5);
   border-radius: var(--zd_size2);
 }
@@ -16,15 +16,9 @@
   position: absolute;
   top: 0;
   bottom: 0;
-  background-color: var(--zdt_upload_overlay_bg);
-}
-[dir=ltr] .overlay {
   left: 0;
   right: 0;
-}
-[dir=rtl] .overlay {
-  right: 0;
-  left: 0;
+  background-color: var(--zdt_upload_overlay_bg);
 }
 .small {
   width: var(--zd_size50);
@@ -44,13 +38,8 @@
   height: var(--zd_size2);
   width: 0%;
   transition: width var(--zd_transition6) ease;
-}
-[dir=ltr] .loader {
   left: 0;
 }
-[dir=rtl] .loader {
-  right: 0;
-}
 .light .loader {
   background: var(--zdt_upload_loader_default_bg);
 }
@@ -61,21 +50,18 @@
   width: 100%;
   height: 100%;
 }
-[dir=ltr] .attachInfo {
+.attachInfo {
   padding: var(--zd_size4) 0 0 var(--zd_size8);
 }
-[dir=rtl] .attachInfo {
-  padding: var(--zd_size4) var(--zd_size8) 0 0;
-}
 .fileIcon {
   font-size: var(--zd_font_size14);
 }
 .attachsize {
   font-size: var(--zd_font_size10);
+  padding: var(--zd_size4) 0 var(--zd_size2);
   letter-spacing: 1px;
   composes: dotted from "~@zohodesk/components/lib/common/common.module.css";
   text-transform: uppercase;
-  padding: var(--zd_size4) 0 var(--zd_size2);
 }
 .light .attachsize {
   color: var(--zdt_upload_attachsize_default_text);
@@ -87,27 +73,22 @@
   height: var(--zd_size12);
   width: var(--zd_size12);
   top: 0;
+  right: 0;
   position: absolute;
+  text-align: center;
   line-height: var(--zd_size10);
   font-size: var(--zd_font_size12);
-  text-align: center;
-}
-[dir=ltr] .uploadclose {
-  right: 0;
-}
-[dir=rtl] .uploadclose {
-  left: 0;
 }
 .light .uploadclose {
-  color: var(--zdt_upload_uploadclose_default_text);
   background-color: var(--zdt_upload_uploadclose_default_bg);
+  color: var(--zdt_upload_uploadclose_default_text);
 }
 .light .uploadclose:hover {
   background-color: var(--zdt_upload_uploadclose_default_hover_text);
 }
 .night .uploadclose {
-  color: var(--zdt_upload_uploadclose_night_text);
   background-color: var(--zdt_upload_uploadclose_night_bg);
+  color: var(--zdt_upload_uploadclose_night_text);
 }
 .night .uploadclose:hover {
   background-color: var(--zdt_upload_uploadclose_night_hover_text);

package/es/alert/AlertHeader/AlertHeader.module.css

@@ -1,38 +1,20 @@
 .container {
   min-height: var(--zd_size54);
   position: relative;
-}[dir=ltr] .container {
   padding: var(--zd_size12) var(--zd_size45) var(--zd_size12) var(--zd_size26);
-}[dir=rtl] .container {
-  padding: var(--zd_size12) var(--zd_size26) var(--zd_size12) var(--zd_size45);
 }
 
-[dir=ltr] .extraSmall {
+.extraSmall {
   padding: var(--zd_size12) var(--zd_size45) var(--zd_size12) var(--zd_size16);
 }
 
-[dir=rtl] .extraSmall {
-  padding: var(--zd_size12) var(--zd_size16) var(--zd_size12) var(--zd_size45);
-}
-
-[dir=ltr] .iconContainer {
+.iconContainer {
   margin: 0 var(--zd_size10) 0 0;
 }
 
-[dir=rtl] .iconContainer {
-  margin: 0 0 0 var(--zd_size10);
-}
-
 .title {
-  font-size: 0;
-}
-
-[dir=ltr] .title {
   margin: 0 var(--zd_size5) 0 0;
-}
-
-[dir=rtl] .title {
-  margin: 0 0 0 var(--zd_size5);
+  font-size: 0;
 }
 
 .iconStyle {

package/es/alert/AlertLookup/AlertLookup.js

@@ -34,16 +34,19 @@ export default class AlertLookup extends Component {
     document.removeEventListener('keydown', this.documentKeydownHandler);
   }
 
-  documentKeydownHandler(e = {}) {
+  documentKeydownHandler() {
+    let e = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     let {
       onSubmitClick,
       onCancelClick,
-      isActive
+      isActive,
+      onEsc,
+      onClose
     } = this.props;
 
     if (e.keyCode === 27 && isActive) {
       e && e.preventDefault && e.preventDefault();
-      onCancelClick && onCancelClick(e);
+      onEsc == 'close' ? onClose && onClose(e) : onCancelClick && onCancelClick(e);
     } else if (e.keyCode === 13 && isActive) {
       e && e.preventDefault && e.preventDefault();
       onSubmitClick && onSubmitClick(e);
@@ -168,7 +171,8 @@ AlertLookup.propTypes = {
     AlertHeaderProps: PropTypes.object,
     PrimaryButtonProps: PropTypes.object,
     SecondaryButtonProps: PropTypes.object
-  })
+  }),
+  onEsc: PropTypes.oneOf(['close', 'cancel'])
 };
 AlertLookup.defaultProps = {
   isActive: false,
@@ -180,7 +184,8 @@ AlertLookup.defaultProps = {
   dataId: 'alertPopup',
   customClass: '',
   isDefaultFocus: true,
-  customProps: {}
+  customProps: {},
+  onEsc: 'cancel'
 };
 
 if (false) {

package/es/alert/AlertLookup/AlertLookup.module.css

@@ -3,21 +3,17 @@
 }
 
 .innerSection {
+  padding: var(--zd_size30) var(--zd_size20) var(--zd_size20);
   line-height: var(--zd_size25);
   color: var(--zdt_alertlookup_innersection_text);
   font-size: var(--zd_font_size15);
   word-break: break-word;
-  padding: var(--zd_size30) var(--zd_size20) var(--zd_size20);
 }
 
-[dir=ltr] .buttonGap {
+.buttonGap {
   margin: 0 0 0 var(--zd_size12);
 }
 
-[dir=rtl] .buttonGap {
-  margin: 0 var(--zd_size12) 0 0;
-}
-
 .text {
   margin-top: var(--zd_size20);
 }