@wavemaker/rn-codegen 11.15.1-rc.6451 → 11.15.2-rc.249

package/src/templates/foundation-theme/wavemaker/design-tokens/input/calendar.less

@@ -5,49 +5,57 @@
 }
 
 .app-calendar-text {
-    color: var(--wm-color-black);
+
 }
 
 .app-calendar-wrapper {
-    box-shadow: var(--wm-calendar-view-shadow);
-    border-style: var(--wm-calendar-view-border-style);
-    border-radius: var(--wm-calendar-view-radius);
-    border-color: var(--wm-calendar-day-border-color);
-    background-color: var(--wm-calendar-header-background-color);
+    box-shadow: var(--wm-calendar-wrapper-shadow);
+    border-style: var(--wm-calendar-wrapper-border-style);
+    border-radius: var(--wm-calendar-wrapper-border-radius);
+    border-color: var(--wm-calendar-wrapper-border-color);
+    border-width: var(--wm-calendar-wrapper-border-width);
+    background-color: var(--wm-calendar-wrapper-background);
 }
 
 .app-calendar-header {
     box-shadow: none;
-    border-radius: var(--wm-calendar-view-radius);
-    padding-top: var(--wm-calendar-fc-header-vertical-padding);
-    padding-bottom: var(--wm-calendar-fc-header-vertical-padding);
+    border-radius: var(--wm-calendar-header-border-radius);
+    padding: var(--wm-calendar-header-padding);
     background-color: var(--wm-calendar-header-background-color);
-    border-color: var(--wm-calendar-header-background-color);
-    border-bottom-width: var(--wm-calendar-header-border-bottom-width);
+    border-color: var(--wm-calendar-header-border-color);
+    border-width: var(--wm-calendar-header-border-width);
     border-style: var(--wm-calendar-header-border-style);
 }
 
 .app-calendar-week-day {
-    border-bottom-width: var(--wm-calendar-weekday-border-bottom-width);
+    border-width: var(--wm-calendar-weekday-border-width);
     border-style: var(--wm-calendar-weekday-border-style);
     padding: var(--wm-calendar-weekday-padding);
-    background-color: var(--wm-calendar-header-background-color);
-    border-color: var(--wm-calendar-header-background-color);
+    background-color: var(--wm-calendar-weekday-background-color);
+    border-color: var(--wm-calendar-weekday-border-color);
 }
 
 .app-calendar-week-day-text {
-    color: var(--wm-calendar-fc-anchor-color);
-    font-weight: var(--wm-calendar-fc-header-text-font-weight);
+    color: var(--wm-calendar-weekday-text-color);
+    font-weight: var(--wm-calendar-weekday-text-font-weight);
     font-family: var(--wm-calendar-weekday-text-font-family);
     font-size: var(--wm-calendar-weekday-text-font-size);
 }
 
+.app-calendar-day-wrapper{
+    background-color: var(--wm-calendar-daywrapper-background);
+    border-color: var(--wm-calendar-daywrapper-border-color);
+    border-width: var(--wm-space-1);
+    border-style: var(--wm-border-style-solid);
+}
+
 .app-calendar-day {
-    color: var(--wm-calendar-fc-anchor-color);
-    font-size: var(--wm-calendar-weekday-text-font-size);
-    font-weight: var(--wm-calendar-fc-header-text-font-weight);
-    font-family: var(--wm-calendar-weekday-text-font-family);
+    color: var(--wm-calendar-day-color);
+    font-size: var(--wm-calendar-day-font-size);
+    font-weight: var(--wm-calendar-day-font-weight);
+    font-family: var(--wm-calendar-day-font-family);
     border-color: var(--wm-calendar-day-border-color);
+    background-color: var(--wm-calendar-day-background);
 }
 
 .app-calendar-not-day-of-month {
@@ -56,20 +64,24 @@
 }
 
 .app-calendar-month-text {
-    color: var(--wm-color-on-surface);
-    font-weight: var(--wm-font-weight-800);
-    font-family: var(--wm-calendar-weekday-text-font-family);
+    color: var(--wm-calendar-month-text-color);
+    font-weight: var(--wm-calendar-month-text-font-weight);
+    font-family: var(--wm-calendar-month-text-font-family);
 }
 
 .app-calendar-year-text {
-    color: var(--wm-color-on-surface);
-    font-weight: var(--wm-font-weight-800);
-    font-family: var(--wm-calendar-weekday-text-font-family);
+    color: var(--wm-calendar-year-text-color);
+    font-weight: var(--wm-calendar-year-text-font-weight);
+    font-family: var(--wm-calendar-year-text-font-family);
 }
 
 .app-calendar-today {
-    border-color: var(--wm-form-control-border-color);
-    background-color: var(--wm-calendar-header-background-color);
+    border-color: var(--wm-calendar-today-border-color);
+    background-color: var(--wm-calendar-today-background-color);
+}
+
+.app-calendar-today-text{
+    background-color: var(--wm-calendar-today-text-background-color);
 }
 
 .app-calendar-eventDay1 {
@@ -85,18 +97,14 @@
 }
 
 .app-calendar-selected-day {
-    background-color: var(--wm-calendar-fc-event-background);
-    border-color: var(--wm-calendar-fc-event-background);
+    background-color: var(--wm-calendar-selected-day-background);
+    border-color: var(--wm-calendar-selected-day-background);
 }
 
 .app-calendar-selected-day-text {
-    background-color: var(--wm-calendar-fc-event-background);
-    border-color: var(--wm-calendar-fc-event-background);
-    color: var(--wm-calendar-header-background-color);
-    font-weight: var(--wm-font-weight-700);
+    background-color: var(--wm-calendar-selected-day-text-background);
+    border-color: var(--wm-calendar-selected-day-text-background);
+    color: var(--wm-calendar-selected-day-text-color);
+    font-weight: var(--wm-calendar-selected-day-text-font-weight);
 }
 
-.app-calendar-header-skeleton {
-    width: var(--wm-calendar-header-skeleton-width);
-    margin-bottom: var(--wm-calendar-header-skeleton-margin-bottom);
-}

package/src/templates/foundation-theme/wavemaker/design-tokens/input/checkboxset.less

@@ -3,8 +3,7 @@
 .app-checkboxset-group-title {
     color: var(--wm-checkboxset-title-color);
     background-color: var(--wm-checkboxset-title-background-color);
-    padding-left: var(--wm-checkboxset-title-padding-left);
-    padding-right: var(--wm-checkboxset-title-padding-right);
+    padding: var(--wm-checkboxset-title-padding);
     font-size: var(--wm-checkboxset-title-font-size);
     font-family: var(--wm-checkboxset-title-font-family);
 }

package/src/templates/foundation-theme/wavemaker/design-tokens/input/chips.less

@@ -1,9 +1,6 @@
 @import (optional) url('../variables/chips.variant.less');
 .app-chips {
-  padding-top: var(--wm-chips-list-padding-top);
-  padding-bottom: var(--wm-chips-list-padding-bottom);
-  padding-left: var(--wm-chips-list-padding-left);
-  padding-right: var(--wm-chips-list-padding-right);
+  padding: var(--wm-chips-list-padding);
   background-color: var(--wm-chips-list-background-color);
   border-width: var(--wm-chips-list-border-width);
   border-style: var(--wm-chips-list-border-style);
@@ -27,10 +24,7 @@
   gap: var(--wm-chips-item-gap);
   min-height: var(--wm-chips-item-height);
   height: var(--wm-chips-item-height);
-  padding-top: var(--wm-chips-item-padding-top);
-  padding-bottom: var(--wm-chips-item-padding-bottom);
-  padding-left: var(--wm-chips-item-padding-left);
-  padding-right: var(--wm-chips-item-padding-right);
+  padding: var(--wm-chips-item-padding);
   background-color: var(--wm-chips-background-color);
   border-radius: var(--wm-chips-item-border-radius);
   border-width: var(--wm-chips-border-width);
@@ -48,10 +42,7 @@
   gap: var(--wm-chips-item-gap);
   min-height: var(--wm-chips-item-height);
   height: var(--wm-chips-item-height);
-  padding-top: var(--wm-chips-item-padding-top);
-  padding-bottom: var(--wm-chips-item-padding-bottom);
-  padding-left: var(--wm-chips-item-padding-left);
-  padding-right: var(--wm-chips-item-padding-right);
+  padding: var(--wm-chips-item-padding);
   color: var(--wm-chips-color);
   background-color: var(--wm-chips-background-color);
   border-radius: var(--wm-chips-item-border-radius);
@@ -73,6 +64,7 @@
 .app-chips-active-item {
   background-color: var(--wm-chips-background-color);
   border-color: var(--wm-chips-item-border-color);
+  border-width: var(--wm-chips-border-width);
 }
 
 .app-chips-active-item-text {
@@ -80,29 +72,26 @@
 }
 
 .app-chips-search-text {
-  padding-top: var(--wm-chips-input-padding-top);
-  padding-bottom: var(--wm-chips-input-padding-bottom);
-  padding-left: var(--wm-chips-input-padding-left);
-  padding-right: var(--wm-chips-input-padding-right);
+  padding: var(--wm-chips-input-padding);
 }
 
 .app-chips-search.placeholderText {
   color: var(--wm-chips-list-place-holder-color);
 }
 
-.app-chips-done-icon .app-icon {
+.app-chips-done-icon .app-icon-shape {
   font-size: var(--wm-chips-item-icon-size);
   padding-left: var(--wm-chips-item-icon-gap);
   color: var(--wm-chips-item-icon-color);
 }
 
-.app-chips-clear-icon .app-icon {
+.app-chips-clear-icon .app-icon-shape {
   font-size: var(--wm-chips-item-icon-size);
   padding-right: var(--wm-chips-item-icon-gap);
   color: var(--wm-chips-item-icon-color);
 }
 
-.app-chips-picture {
+.app-chips-picture .app-picture {
   width: var(--wm-chips-item-avatar-size);
   height: var(--wm-chips-item-avatar-size);
   border-radius: var( --wm-chips-item-avatar-radius);

package/src/templates/foundation-theme/wavemaker/design-tokens/input/currency.less

@@ -19,12 +19,13 @@
 //     padding-right: var(--wm-currency-input-padding-right);
 // }
 
-// .app-currency-label {
-//     background-color: var(--wm-color-primary);
-//     font-weight: var(--wm-currency-inputgroup-addon-font-weight);
-//     font-family: var(--wm-font-family-plain);
-//     font-size: var(--wm-currency-inputgroup-addon-font-size);
-// }
+.app-currency-label {
+    background-color: var(--wm-currency-labelwrapper-background);
+    font-weight: var(--wm-currency-label-font-weight);
+    font-family: var(--wm-currency-label-font-family);
+    font-size: var(--wm-currency-label-font-size);
+    color: var(--wm-currency-label-color);
+}
 
 // .app-currency-flotaing-label {
 // }
@@ -54,17 +55,13 @@
 //     min-height: var(--wm-currency-container-min-height);
 // }
 
-// .app-currency-label-wrapper {
-//     background-color: var(--wm-color-primary);
-//     min-height: var(--wm-currency-container-min-height);
-//     border-top-left-radius: var(--wm-currency-container-border-radius);
-//     border-bottom-left-radius: var(--wm-currency-container-border-radius);
-//     padding-top: var(--wm-currency-input-padding-top);
-//     padding-bottom: var(--wm-currency-input-padding-bottom);
-//     padding-left: var(--wm-currency-input-padding-left);
-//     padding-right: var(--wm-currency-input-padding-right);
-//     width: var(--wm-currency-label-wrapper-width);
-// }
+.app-currency-label-wrapper {
+    background-color: var(--wm-currency-labelwrapper-background);
+    min-height: var(--wm-currency-labelwrapper-min-height);
+    border-radius: var(--wm-currency-labelwrapper-border-radius);
+    padding: var(--wm-currency-labelwrapper-padding);
+    width: var(--wm-currency-labelwrapper-width);
+}
 
 // .app-currency-input-wrapper {
 //     width: var(--wm-currency-skeleton-text-input-wrapper-width);

package/src/templates/foundation-theme/wavemaker/design-tokens/input/radioset.less

@@ -13,8 +13,7 @@
   color: var(--wm-radiobutton-title-color);
   background-color: var(--wm-radiobutton-title-background-color);
   line-height: var(--wm-radiobutton-title-line-height);
-  padding-left: var(--wm-radiobutton-title-padding-left);
-  padding-right: var(--wm-radiobutton-title-padding-right);
+  padding: var(--wm-radiobutton-title-padding);
   font-size: var(--wm-radiobutton-title-font-size);
   font-family: var(--wm-radiobutton-title-font-family);
 }

package/src/templates/foundation-theme/wavemaker/design-tokens/input/rating.less

@@ -4,7 +4,7 @@
     opacity: var(--wm-rating-opacity);
 }
 .app-rating-text {
-    padding-left: var(--wm-rating-text-padding-left);
+    padding: var(--wm-rating-text-padding);
     color: var(--wm-rating-text-color);
     font-size: var(--wm-rating-text-size);
 }

package/src/templates/foundation-theme/wavemaker/design-tokens/input/select.less

@@ -1,79 +1,41 @@
 @import (optional) url('../variables/select.variant.less');
 
-.app-select {
-    // color: var(--wm-form-control-color);
-    // background-color: var(--wm-color-surface-container-high);
-    // border-style: var(--wm-border-style);
-    // border-color: var(--wm-color-surface-container-high);
-    // border-radius: var(--wm-select-container-border-radius);
-    // padding: var(--wm-space-3);
-}
-
-.app-select-text {
-    // font-size: var(--wm-label-large-font-size);
-    // font-family: var(--wm-font-family-plain);
-}
-
-.app-select-invalid {}
-
-.app-select-item {
-   border-bottom: var(--wm-select-item-border-bottom);
-   padding-horizontal: var(--wm-select-item-padding-horizontal);
-   padding-vertical: var(--wm-select-item-padding-vertical);
-}
-
-.app-select-item-text {
-    font-size: var(--wm-label-large-font-size);
-    font-family: var(--wm-font-family-plain);
-    color: var(--wm-select-item-color);
-}
-
-.app-select-last-item {
-    // border-bottom-width: var(--wm-select-last-item-border-bottom-width);
-}
-
-.app-select-active-item {}
-
-.app-select-active-item-text {
-    // color: var(--wm-color-primary);
-}
-
-.app-select-check-icon {}
 
 .app-select-arrow-button {
+    background-color: var(--wm-select-arrow-button-background-color);
+    padding: var(--wm-select-arrow-button-padding);
     border-width: var(--wm-select-arrow-button-border-width);
-    border-color: var(--wm-select-arrow-button-border-color);
     border-style: var(--wm-select-arrow-button-border-style);
-    height: var(--wm-select-arrow-button-height);
+    border-color: var(--wm-select-arrow-button-border-color);
+    border-radius: var(--wm-select-arrow-button-border-radius);
 }
 
-.app-select-arrow-button-icon {}
-
-.app-select-arrow-button-skeleton {
-    // border-radius: var(--wm-select-arrow-button-skeleton-border-radius);
+.app-select-modal-content {
+    background-color: var(--wm-select-modal-content-background-color);
+    border-color: var(--wm-select-modal-content-border-color);
+    border-radius: var(--wm-select-modal-content-border-radius);
+    border-style: var(--wm-select-modal-content-border-style);
+    border-width: var(--wm-select-modal-content-border-width);
 }
 
-.app-select-check-icon.text {
-    // color: var(--wm-color-primary);
-    // font-size: var(--wm-label-large-font-size);
+.app-select-arrow-button-icon {
+    font-size: var(--wm-select-arrow-button-icon-font-size);
+    color: var(--wm-select-arrow-button-icon-color);
+    height: var(--wm-select-arrow-button-icon-height);
+    border-width: var(--wm-select-arrow-button-icon-border-width);
+    border-style: var(--wm-select-arrow-button-icon-border-style);
+    border-color: var(--wm-select-arrow-button-icon-border-color);
+    border-radius: var(--wm-select-arrow-button-icon-border-radius);
+    padding: var(--wm-select-arrow-button-icon-padding);
 }
 
-.app-select-text-skeleton {
-    // border-radius: var(--wm-select-text-skeleton-border-radius);
-    // height: var(--wm-select-text-skeleton-height);
+.app-select-item-text {
+    font-size: var(--wm-select-modal-text-font-size);
+    color: var(--wm-select-modal-text-color);
+    font-family: var(--wm-select-modal-text-font-family);
 }
 
-.app-select-dropdown-content {}
-
-.app-select-dropdown {}
-
-.app-select-modal {}
-
-.app-select-modal-content {
-    background-color: var(--wm-select-modal-content-background);
-    border-color: var(--wm-select-modal-content-border-color);
-    border-radius: var(--wm-select-modal-content-border-radius);
-    border-style: var(--wm-select-modal-content-border-style);
-    border-width: var(--wm-select-modal-content-border-width);
-    width: var(--wm-select-modal-content-width);
+.app-select-check-icon.text {
+    font-size: var(--wm-select-check-icon-font-size);
+    color: var(--wm-select-check-icon-color);
 }

package/src/templates/foundation-theme/wavemaker/design-tokens/input/switch.less

@@ -15,8 +15,7 @@
   ripple-color: var(--wm-switch-button-ripple-color);
   border-color: var(--wm-switch-button-border-color);
   background-color: var(--wm-switch-button-background-color);
-  padding-left: var(--wm-switch-button-padding-left);
-  padding-right: var(--wm-switch-button-padding-right);
+  padding: var(--wm-switch-button-padding);
   border-width: var(--wm-switch-button-border-width);
 }
 

package/src/templates/foundation-theme/wavemaker/design-tokens/input/toggle.less

@@ -1,4 +1,4 @@
-@import url('../variables/toggle.variant.less');
+@import (optional) url('../variables/toggle.variant.less');
 
 .app-toggle-off  .app-toggle {
     width: var(--wm-toggle-width);

package/src/templates/foundation-theme/wavemaker/design-tokens/navigation/appnavbar.less

@@ -1,17 +1,11 @@
 
 .app-appnavbar {
     height: var(--wm-navbar-height);
-    padding-left: var(--wm-navbar-padding-left);
-    padding-right: var(--wm-navbar-padding-right);
-    padding-top: var(--wm-navbar-padding-top);
-    padding-bottom: var(--wm-navbar-padding-bottom);
+    padding: var(--wm-navbar-padding);
     background-color: var(--wm-navbar-background-color);
-    border-color: var(--wm-navbar-border-color);
+    border-width: var(--wm-navbar-border-width);
     border-style: var(--wm-navbar-border-style);
-    border-top-width: var(--wm-navbar-border-width-top);
-    border-bottom-width: var(--wm-navbar-border-width-bottom);
-    border-left-width: var(--wm-navbar-border-width-left);
-    border-right-width: var(--wm-navbar-border-width-right);
+    border-color: var(--wm-navbar-border-color);
     border-radius: var(--wm-navbar-border-radius);
 }
 
@@ -49,18 +43,20 @@
 
 }
 
-.app-appnavbar-badge {
+.app-appnavbar-badge,
+.navbarAnchorItem.badge {
     background-color: var(--wm-navbar-badge-background-color);
     color: var(--wm-navbar-badge-color);
+    height: var(--wm-navbar-badge-height);
+    width: var(--wm-navbar-badge-width);
+    font-size: var(--wm-navbar-badge-font-size);
+    line-height: var(--wm-navbar-badge-line-height);
+    border-radius: var(--wm-navbar-badge-border-radius);
     margin-left: var(--wm-navbar-badge-margin-left);
 }
 
 .navbar-anchor {
-    padding-right: var(--wm-navbar-anchor-padding-right);
-    padding-left: var(--wm-navbar-anchor-padding-left);
-    padding-top: var(--wm-navbar-anchor-padding-top);
-    padding-bottom: var(--wm-navbar-anchor-padding-bottom);
-
+    padding: var(--wm-navbar-anchor-padding);
 }
 
 .navbar-anchor-text {

package/src/templates/foundation-theme/wavemaker/design-tokens/navigation/menu.less

@@ -10,8 +10,7 @@
   color: var(--wm-dropdown-menu-color);
   font-weight: var(--wm-dropdown-menu-text-font-weight);
   text-decoration: var(--wm-dropdown-menu-text-decoration);
-  padding-left: var(--wm-dropdown-menu-text-padding-left);
-  padding-right: var(--wm-dropdown-menu-text-padding-right);;
+  padding: var(--wm-dropdown-menu-text-padding);
 }
 
 .app-menu-trigger .app-anchor-icon .app-icon {
@@ -27,19 +26,12 @@
   background-color: var(--wm-dropdown-menu-content-background); 
   border-radius: var(--wm-dropdown-menu-content-border-radius); 
   width: var(--wm-dropdown-menu-content-width); 
-  padding-left: var(--wm-dropdown-menu-padding-left);
-  padding-right: var(--wm-dropdown-menu-padding-right);
-  padding-top: var(--wm-dropdown-menu-padding-top);
-  padding-bottom: var(--wm-dropdown-menu-padding-bottom);
+  padding: var(--wm-dropdown-menu-padding);
 }
 
 .app-menu-item.root {
   border-style: var(--wm-dropdown-menu-item-border-style); 
-  // border-bottom-width: var(--wm-dropdown-menu-item-border-bottom-width); 
-  padding-top: var(--wm-dropdown-menu-item-padding-top); 
-  padding-bottom: var(--wm-dropdown-menu-item-padding-bottom); 
-  padding-left: var(--wm-dropdown-menu-item-padding-left); 
-  padding-right: var(--wm-dropdown-menu-item-padding-right); 
+  padding: var(--wm-dropdown-menu-item-padding);
 }
 
 .app-menu-item .app-anchor-text {

package/src/templates/foundation-theme/wavemaker/design-tokens/navigation/popover.less

@@ -1,24 +1,32 @@
 .app-popover{
-    padding-bottom: var(--wm-popover-padding-bottom);
-    padding-top: var(--wm-popover-padding-top);
-    padding-left: var(--wm-popover-padding-left);
-    padding-right: var(--wm-popover-padding-right);
+    padding: var(--wm-popover-padding);
     background-color: var(--wm-popover-background-color);
     box-shadow: var(--wm-popover-shadow);
-    border-top-left-radius: var(--wm-popover-border-top-left-radius);
-    border-top-right-radius: var(--wm-popover-border-top-right-radius)
+    border-radius: var(--wm-popover-border-radius);
+    border-width: var(--wm-popover-border-width);
+    border-style: var(--wm-popover-border-style);
+    border-color: var(--wm-popover-border-color);
 }
 
+.app-popover-content{
+    background-color: var(--wm-popover-content-background-color);
+    box-shadow: var(--wm-popover-content-shadow);
+    border-width: var(--wm-popover-content-border-width);
+    border-style: var(--wm-popover-content-border-style);
+    border-color: var(--wm-popover-content-border-color);
+    border-radius: var(--wm-popover-content-border-radius);
+}
+
+.app-popover-modal-content{
+    box-shadow: var(--wm-popover-modal-content-shadow);
+}
 .app-popover-wrapper{
     background-color: var(--wm-popover-link-background-color);
     border-color: var(--wm-popover-link-border-color);
     border-width: var(--wm-popover-link-border-width);
     border-style: var(--wm-popover-link-border-style);
-    border-radius: var(--wm-popover-link-border-radius);
-    padding-top: var(--wm-popover-link-padding-top);
-    padding-bottom: var(--wm-popover-link-padding-bottom);
-    padding-left: var(--wm-popover-link-padding-left);
-    padding-right: var(--wm-popover-link-padding-right);
+    border-radius: var(--wm-popover-link-radius);
+    padding: var(--wm-popover-link-padding);
     width: var(--wm-popover-link-width);
     height: var(--wm-popover-link-height);
     min-height: var(--wm-popover-link-min-height);
@@ -34,10 +42,7 @@
 }
 
 .app-popover-title {
-    padding-left: var(--wm-popover-header-padding-left);
-    padding-right: var(--wm-popover-header-padding-right);
-    padding-top: var(--wm-popover-header-padding-top);
-    padding-bottom: var(--wm-popover-header-padding-bottom);
+    padding: var(--wm-popover-header-padding);
     font-family: var(--wm-popover-header-font-family);
     font-size: var(--wm-popover-header-font-size);
     font-weight: var(--wm-popover-header-font-weight);
@@ -74,4 +79,6 @@
     font-weight: var(--wm-popover-link-font-weight);
     line-height: var(--wm-popover-link-line-height);
     letter-spacing: var(--wm-popover-link-letter-spacing);
+    text-decoration: var(--wm-popover-link-text-decoration);
+    text-decoration-line: var(--wm-popover-link-text-decoration);
 }

package/src/templates/foundation-theme/wavemaker/design-tokens/page/left-panel.less

@@ -1,5 +1,4 @@
 .app-left-panel {
-    min-height: var(--wm-left-panel-min-height);
     background-color: var(--wm-left-panel-background);
     box-shadow: var(--wm-left-panel-elevation);
     border-top-right-radius: var(--wm-left-panel-border-top-right-radius);

package/src/templates/foundation-theme/wavemaker/design-tokens/page/partial-container.less

@@ -1,3 +1,4 @@
 
 .app-partial-container {
+    background-color: var(--wm-partial-container-background-color);
 }

package/src/templates/foundation-theme/wavemaker/design-tokens/page/tabbar.less

@@ -1,9 +1,9 @@
 .app-tabbar {
     height: var(--wm-tabbar-height);
     box-shadow: var(--wm-tabbar-box-shadow);
-    border-top-width: var(--wm-tabbar-border-top-width);
-    border-top-style: var(--wm-tabbar-border-top-style);
-    border-top-color: var(--wm-tabbar-border-top-color);
+    border-width: var(--wm-tabbar-border-width);
+    border-style: var(--wm-tabbar-border-style);
+    border-color: var(--wm-tabbar-border-color);
 
 }
 
@@ -21,8 +21,7 @@
 
 .app-tabbar-more-menu-row {
     width: var(--wm-tabbar-more-menu-row-width);
-    padding-bottom: var(--wm-tabbar-more-menu-row-padding-bottom);
-    padding-top: var(--wm-tabbar-more-menu-row-padding-top);
+    padding: var(--wm-tabbar-more-menu-row-padding);
 }
 
 .app-tabbar-item {
@@ -30,6 +29,7 @@
     min-width: var(--wm-tabbar-item-min-width);
     background-color: var(--wm-tabbar-item-background-color);
     border-radius: var(--wm-tabbar-item-border-radius);
+    border-width: var(--wm-tabbar-item-border-width);
     margin-bottom: var(--wm-space-0);
     opacity: var(--wm-tabbar-item-opacity);
     display: flex;
@@ -41,6 +41,7 @@
     opacity: var(--wm-tabbar-item-opacity);
     margin-bottom: var(--wm-space-0);
     border-radius: var(--wm-tabbar-item-border-radius);
+    border-width: var(--wm-tabbar-item-border-width);
     background-color: var(--wm-tabbar-item-background-color);
     display: flex;
     justify-content: center;
@@ -52,19 +53,19 @@
 
 .app-tabbar-item-icon .app-icon {
     border-bottom-color: var(--wm-tabbar-icon-border-bottom-color);
-    padding-bottom: var(--wm-tabbar-icon-padding-bottom);
+    padding: var(--wm-tabbar-icon-padding);
 }
 
 .app-tabbar-item-icon .app-icon-shape {
     color: var(--wm-tabbar-icon-color);
     font-size: var(--wm-tabbar-icon-size);
-    padding-right: var(--wm-tabbar-icon-padding-right);
+    padding: var(--wm-tabbar-icon-padding);
 }
 
 .app-tabbar-active-icon .app-icon-shape {
     color: var(--wm-tabbar-icon-color);
     font-size: var(--wm-tabbar-icon-size);
-    padding-right: var(--wm-tabbar-icon-padding-right);
+    padding: var(--wm-tabbar-icon-padding);
 }
 
 .app-tabbar-item-label {

package/src/templates/foundation-theme/wavemaker/design-tokens/studio/advanced/carousel.less

@@ -41,7 +41,7 @@
 }
 
 .carousel-control.right {
-    top: 50%;
+    top: 30%;
     opacity: 1;
     border-style: solid;
     margin-right: var(--wm-carousel-navigation-arrows-margin-left);
@@ -52,10 +52,11 @@
     height: var(--wm-carousel-navigation-arrows-height);
     border-color: var(--wm-carousel-navigation-arrows-border-color);
     border-width: var(--wm-carousel-navigation-arrows-border-width);
+    z-index: 1;
 }
 
 .carousel-control.left {
-    top: 50%;
+    top: 30%;
     opacity: 1;
     border-style: solid;
     margin-left: var(--wm-carousel-navigation-arrows-margin-left);
@@ -66,6 +67,7 @@
     height: var(--wm-carousel-navigation-arrows-height);
     border-color: var(--wm-carousel-navigation-arrows-border-color);
     border-width: var(--wm-carousel-navigation-arrows-border-width);
+    z-index: 1;
 }
 
 .app-carousel .carousel-indicators li {