@syncfusion/ej2-angular-navigations 20.2.48-ngcc → 20.2.48

package/styles/pager/icons/_tailwind-dark.scss

@@ -0,0 +1 @@
+@import './tailwind.scss';

package/styles/pager/icons/_tailwind.scss

@@ -0,0 +1,50 @@
+@include export-module('pager-tailwind-icons') {
+
+  /* !componenticons */
+
+  #{&}.e-pager,
+  .e-grid-menu {
+
+    .e-icon-last::before {
+      content: '\e7a9';
+    }
+
+    .e-icon-first::before {
+      content: '\e744';
+    }
+
+    .e-icon-prev::before {
+      content: '\e765';
+    }
+
+    .e-icon-next::before {
+      content: '\e748';
+    }
+
+    &.e-rtl {
+      & .e-icon-last.e-lastpage::before,
+      & .e-icon-last.e-lastpage:hover,
+      & .e-icon-last.e-lastpagedisabled::before {
+        content: '\e744';
+      }
+
+      & .e-icon-first.e-firstpage::before,
+      & .e-icon-first.e-firstpage:hover,
+      & .e-icon-first.e-firstpagedisabled::before {
+        content: '\e7a9';
+      }
+
+      & .e-icon-prev.e-prevpage::before,
+      & .e-icon-prev.e-prevpage:hover,
+      & .e-icon-prev.e-prevpagedisabled::before {
+        content: '\e748';
+      }
+
+      & .e-icon-next.e-nextpage::before,
+      & .e-icon-next.e-nextpage:hover,
+      & .e-icon-next.e-nextpagedisabled::before {
+        content: '\e765';
+      }
+    }
+  }
+}

package/styles/pager/material-dark.css

@@ -225,6 +225,8 @@
   padding: 0;
   white-space: normal;
   width: 100%;
+  /* stylelint-disable */
+  /* stylelint-enable */
 }
 .e-pager [class^=e-] {
   box-sizing: border-box;
@@ -351,10 +353,10 @@
   margin: 5px 6px 5px 18px;
   overflow: hidden;
 }
-.e-pager .e-lastpage:Hover {
+.e-pager .e-lastpage:hover {
   border-radius: 0 4px 4px 0;
 }
-.e-pager .e-firstpage:Hover {
+.e-pager .e-firstpage:hover {
   border-radius: 4px 0 0 4px;
 }
 .e-pager .e-pagermessage,
@@ -571,7 +573,16 @@
 .e-pager.sf-pager .e-next.e-icons.e-icon-next.e-nextpage.e-pager-default {
   margin-left: 0;
 }
-
+.e-pager.sf-pager .e-pagercontainer .e-firstpage,
+.e-pager.sf-pager .e-pagercontainer .e-prevpage,
+.e-pager.sf-pager .e-pagercontainer .e-firstpagedisabled,
+.e-pager.sf-pager .e-pagercontainer .e-prevpagedisabled,
+.e-pager.sf-pager .e-pagercontainer .e-nextpage,
+.e-pager.sf-pager .e-pagercontainer .e-lastpage,
+.e-pager.sf-pager .e-pagercontainer .e-nextpagedisabled,
+.e-pager.sf-pager .e-pagercontainer .e-lastpagedisabled {
+  padding: 11px 9px 8px;
+}
 /*! Pager theme */
 .e-pager {
   background-color: #303030;

package/styles/pager/material-dark.scss

@@ -1 +1,4 @@
-@import 'ej2-navigations/styles/pager/material-dark.scss';
+@import 'ej2-base/styles/material-dark-definition.scss';
+@import 'material-dark-definition.scss';
+@import 'icons/material-dark.scss';
+@import 'all.scss';

package/styles/pager/material.css

@@ -225,6 +225,8 @@
   padding: 0;
   white-space: normal;
   width: 100%;
+  /* stylelint-disable */
+  /* stylelint-enable */
 }
 .e-pager [class^=e-] {
   box-sizing: border-box;
@@ -351,10 +353,10 @@
   margin: 5px 6px 5px 18px;
   overflow: hidden;
 }
-.e-pager .e-lastpage:Hover {
+.e-pager .e-lastpage:hover {
   border-radius: 0 4px 4px 0;
 }
-.e-pager .e-firstpage:Hover {
+.e-pager .e-firstpage:hover {
   border-radius: 4px 0 0 4px;
 }
 .e-pager .e-pagermessage,
@@ -571,7 +573,16 @@
 .e-pager.sf-pager .e-next.e-icons.e-icon-next.e-nextpage.e-pager-default {
   margin-left: 0;
 }
-
+.e-pager.sf-pager .e-pagercontainer .e-firstpage,
+.e-pager.sf-pager .e-pagercontainer .e-prevpage,
+.e-pager.sf-pager .e-pagercontainer .e-firstpagedisabled,
+.e-pager.sf-pager .e-pagercontainer .e-prevpagedisabled,
+.e-pager.sf-pager .e-pagercontainer .e-nextpage,
+.e-pager.sf-pager .e-pagercontainer .e-lastpage,
+.e-pager.sf-pager .e-pagercontainer .e-nextpagedisabled,
+.e-pager.sf-pager .e-pagercontainer .e-lastpagedisabled {
+  padding: 11px 9px 8px;
+}
 /*! Pager theme */
 .e-pager {
   background-color: #fff;

package/styles/pager/material.scss

@@ -1 +1,4 @@
-@import 'ej2-navigations/styles/pager/material.scss';
+@import 'ej2-base/styles/material-definition.scss';
+@import 'material-definition.scss';
+@import 'icons/material.scss';
+@import 'all.scss';

package/styles/pager/tailwind-dark.css

@@ -1,5 +1,5 @@
 @import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
-/*!componenticons*/
+/* !componenticons */
 .e-pager .e-icon-last::before,
 .e-grid-menu .e-icon-last::before {
   content: "\e7a9";
@@ -289,6 +289,8 @@
   padding: 8px 8px 8px 8px;
   white-space: normal;
   width: 100%;
+  /* stylelint-disable */
+  /* stylelint-enable */
 }
 .e-pager [class^=e-] {
   box-sizing: border-box;
@@ -457,10 +459,10 @@
   margin: 0 0 -4px;
   overflow: hidden;
 }
-.e-pager .e-lastpage:Hover {
+.e-pager .e-lastpage:hover {
   border-radius: 0 4px 4px 0;
 }
-.e-pager .e-firstpage:Hover {
+.e-pager .e-firstpage:hover {
   border-radius: 4px 0 0 4px;
 }
 .e-pager .e-pagermessage,
@@ -697,6 +699,19 @@
 .e-pager.sf-pager .e-next.e-icons.e-icon-next.e-nextpage.e-pager-default {
   margin-left: 0;
 }
+.e-pager.sf-pager .e-pagercontainer .e-firstpage,
+.e-pager.sf-pager .e-pagercontainer .e-prevpage,
+.e-pager.sf-pager .e-pagercontainer .e-firstpagedisabled,
+.e-pager.sf-pager .e-pagercontainer .e-prevpagedisabled,
+.e-pager.sf-pager .e-pagercontainer .e-nextpage,
+.e-pager.sf-pager .e-pagercontainer .e-lastpage,
+.e-pager.sf-pager .e-pagercontainer .e-nextpagedisabled,
+.e-pager.sf-pager .e-pagercontainer .e-lastpagedisabled {
+  padding: 7.5px 7px 7.5px 7px;
+}
+.e-pager.sf-pager .e-numericitem.e-currentitem {
+  padding: 3.5px 11px 5px 10px;
+}
 
 /*! Pager theme */
 .e-pager {

package/styles/pager/tailwind-dark.scss

@@ -1 +1,4 @@
-@import 'ej2-navigations/styles/pager/tailwind-dark.scss';
+@import 'ej2-base/styles/tailwind-dark-definition.scss';
+@import 'tailwind-dark-definition.scss';
+@import 'icons/tailwind-dark.scss';
+@import 'all.scss';

package/styles/pager/tailwind.css

@@ -1,5 +1,5 @@
 @import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
-/*!componenticons*/
+/* !componenticons */
 .e-pager .e-icon-last::before,
 .e-grid-menu .e-icon-last::before {
   content: "\e7a9";
@@ -289,6 +289,8 @@
   padding: 8px 8px 8px 8px;
   white-space: normal;
   width: 100%;
+  /* stylelint-disable */
+  /* stylelint-enable */
 }
 .e-pager [class^=e-] {
   box-sizing: border-box;
@@ -457,10 +459,10 @@
   margin: 0 0 -4px;
   overflow: hidden;
 }
-.e-pager .e-lastpage:Hover {
+.e-pager .e-lastpage:hover {
   border-radius: 0 4px 4px 0;
 }
-.e-pager .e-firstpage:Hover {
+.e-pager .e-firstpage:hover {
   border-radius: 4px 0 0 4px;
 }
 .e-pager .e-pagermessage,
@@ -697,6 +699,19 @@
 .e-pager.sf-pager .e-next.e-icons.e-icon-next.e-nextpage.e-pager-default {
   margin-left: 0;
 }
+.e-pager.sf-pager .e-pagercontainer .e-firstpage,
+.e-pager.sf-pager .e-pagercontainer .e-prevpage,
+.e-pager.sf-pager .e-pagercontainer .e-firstpagedisabled,
+.e-pager.sf-pager .e-pagercontainer .e-prevpagedisabled,
+.e-pager.sf-pager .e-pagercontainer .e-nextpage,
+.e-pager.sf-pager .e-pagercontainer .e-lastpage,
+.e-pager.sf-pager .e-pagercontainer .e-nextpagedisabled,
+.e-pager.sf-pager .e-pagercontainer .e-lastpagedisabled {
+  padding: 7.5px 7px 7.5px 7px;
+}
+.e-pager.sf-pager .e-numericitem.e-currentitem {
+  padding: 3.5px 11px 5px 10px;
+}
 
 /*! Pager theme */
 .e-pager {

package/styles/pager/tailwind.scss

@@ -1 +1,4 @@
-@import 'ej2-navigations/styles/pager/tailwind.scss';
+@import 'ej2-base/styles/tailwind-definition.scss';
+@import 'tailwind-definition.scss';
+@import 'icons/tailwind.scss';
+@import 'all.scss';

package/styles/sidebar/_all.scss

@@ -0,0 +1,3 @@
+@import 'icons.scss';
+@import 'layout.scss';
+@import 'theme.scss';

package/styles/sidebar/_bootstrap-dark-definition.scss

@@ -0,0 +1,4 @@
+$sidebar-background: $grey !default;
+$sidebar-border: $grey-cc !default;
+$sidebar-box-shadow: 0 0 20px rgba(0, 0, 0, .2) !default;
+$sidebar-overlay: rgba(0, 0, 0, .6) !default;

package/styles/sidebar/_bootstrap-definition.scss

@@ -0,0 +1,4 @@
+$sidebar-background: $grey-white !default;
+$sidebar-border: $grey-lighter !default;
+$sidebar-box-shadow: 0 0 20px rgba(0, 0, 0, .2) !default;
+$sidebar-overlay: rgba(0, 0, 0, .6) !default;

package/styles/sidebar/_bootstrap4-definition.scss

@@ -0,0 +1,4 @@
+$sidebar-background: $content-bg !default;
+$sidebar-border: $gray-300 !default;
+$sidebar-box-shadow: 0 0 20px rgba($black, .2) !default;
+$sidebar-overlay: rgba($black, .5) !default;

package/styles/sidebar/_bootstrap5-dark-definition.scss

@@ -0,0 +1 @@
+@import './bootstrap5-definition.scss';

package/styles/sidebar/_bootstrap5-definition.scss

@@ -0,0 +1,6 @@
+$sidebar-box-shadow: $shadow !default;
+
+//color variables
+$sidebar-background: $content-bg-color-alt1 !default;
+$sidebar-border: $transparent !default;
+$sidebar-overlay: $overlay-bg-color !default;

package/styles/sidebar/_fabric-dark-definition.scss

@@ -0,0 +1,4 @@
+$sidebar-background: $neutral-lighter-alt !default;
+$sidebar-border: $neutral-light !default;
+$sidebar-box-shadow: 0 0 20px rgba(0, 0, 0, .2) !default;
+$sidebar-overlay: rgba(0, 0, 0, .6) !default;

package/styles/sidebar/_fabric-definition.scss

@@ -0,0 +1,4 @@
+$sidebar-background: $neutral-white !default;
+$sidebar-border: $neutral-light !default;
+$sidebar-box-shadow: 0 0 30px rgba(0, 0, 0, .3) !default;
+$sidebar-overlay: rgba(0, 0, 0, .6) !default;

package/styles/sidebar/_fluent-dark-definition.scss

@@ -0,0 +1 @@
+@import './fluent-definition.scss';

package/styles/sidebar/_fluent-definition.scss

@@ -0,0 +1,6 @@
+$sidebar-box-shadow: $shadow-none !default;
+
+//color variables
+$sidebar-background: $content-bg-color-alt1 !default;
+$sidebar-border: $border-light !default;
+$sidebar-overlay: $overlay-bg-color !default;

package/styles/sidebar/_fusionnew-definition.scss

@@ -0,0 +1,6 @@
+$sidebar-box-shadow: $shadow !default;
+
+//color variables
+$sidebar-background: $content-bg-color-alt1 !default;
+$sidebar-border: $transparent !default;
+$sidebar-overlay: $overlay-bg-color !default;

package/styles/sidebar/_highcontrast-definition.scss

@@ -0,0 +1,4 @@
+$sidebar-background: $bg-base-0 !default;
+$sidebar-border: $border-default !default;
+$sidebar-box-shadow: 0 0 16px rgba(0, 0, 0, .3) !default;
+$sidebar-overlay: rgba(0, 0, 0, .6) !default;

package/styles/sidebar/_highcontrast-light-definition.scss

@@ -0,0 +1,4 @@
+$sidebar-background: $bg-base-100 !default;
+$sidebar-border: $border-default !default;
+$sidebar-box-shadow: 0 0 16px rgba(0, 0, 0, .3) !default;
+$sidebar-overlay: rgba(0, 0, 0, .6) !default;

package/styles/sidebar/_icons.scss

@@ -0,0 +1 @@
+/* stylelint-disable-line no-empty-source */

package/styles/sidebar/_layout.scss

@@ -0,0 +1 @@
+/* stylelint-disable-line no-empty-source */

package/styles/sidebar/_material-dark-definition.scss

@@ -0,0 +1,4 @@
+$sidebar-background: $grey-800 !default;
+$sidebar-border: $grey-700 !default;
+$sidebar-box-shadow: 0 0 20px rgba(0, 0, 0, .2) !default;
+$sidebar-overlay: rgba(0, 0, 0, .6) !default;

package/styles/sidebar/_material-definition.scss

@@ -0,0 +1,6 @@
+/*! Material theme definition's */
+/*! component's theme wise override definitions and variables */
+$sidebar-background: $grey-white !default;
+$sidebar-border: rgba($grey-light-font, .12) !default;
+$sidebar-box-shadow: 0 0 16px rgba(0, 0, 0, .18) !default;
+$sidebar-overlay: rgba(0, 0, 0, .6) !default;

package/styles/sidebar/_material3-definition.scss

@@ -0,0 +1,6 @@
+$sidebar-box-shadow: $shadow !default;
+
+//color variables
+$sidebar-background: $content-bg-color-alt1 !default;
+$sidebar-border: $transparent !default;
+$sidebar-overlay: $overlay-bg-color !default;

package/styles/sidebar/_tailwind-dark-definition.scss

@@ -0,0 +1 @@
+@import './tailwind-definition.scss';

package/styles/sidebar/_tailwind-definition.scss

@@ -0,0 +1,6 @@
+$sidebar-box-shadow: $shadow-sm !default;
+
+//color variables
+$sidebar-background: $content-bg-color-alt2 !default;
+$sidebar-border: $transparent !default;
+$sidebar-overlay: $overlay-bg-color !default;

package/styles/sidebar/_theme.scss

@@ -0,0 +1,182 @@
+@include export-module('sidebar-theme') {
+
+  ejs-sidebar {
+    display: none;
+  }
+
+  .e-sidebar-display {
+    display: block;
+  }
+
+  .e-sidebar {
+    /* stylelint-disable property-no-vendor-prefix */
+    -webkit-tap-highlight-color: transparent;
+    background: $sidebar-background;
+    height: 100%;
+    overflow: auto;
+    position: fixed;
+    top: 0;
+    transition: none;
+    vertical-align: middle;
+    visibility: hidden;
+    will-change: transform;
+
+    &.e-right.e-open {
+      transform: translateX(0%);
+      transition: transform .5s ease;
+      visibility: visible;
+    }
+
+    &.e-right.e-close {
+      box-shadow: none;
+      transform: translateX(100%);
+      transition: transform .5s ease, visibility 500ms;
+      visibility: hidden;
+    }
+
+    &.e-left.e-open {
+      transform: translateX(0%);
+      transition: transform .5s ease;
+      visibility: visible;
+    }
+
+    &.e-left.e-transition.e-close,
+    &.e-right.e-transition.e-close {
+      transition: transform .5s ease, visibility 500ms;
+    }
+
+    &.e-left.e-close {
+      box-shadow: none;
+      transform: translateX(-100%);
+      visibility: hidden;
+    }
+
+    &.e-right.e-close {
+      box-shadow: none;
+      transform: translateX(100%);
+      transition: transform .5s ease, visibility 500ms;
+      visibility: hidden;
+    }
+
+    &.e-right {
+      @if ($skin-name == 'tailwind' or $skin-name == 'bootstrap5') {
+        border-left: 0 solid $sidebar-border;
+      }
+      @else {
+        border-left: 1px solid $sidebar-border;
+      }
+      left: auto;
+      right: 0;
+      top: 0;
+    }
+
+    &.e-left {
+      @if ($skin-name == 'tailwind' or $skin-name == 'bootstrap5') {
+        border-right: 0 solid $sidebar-border;
+      }
+      @else {
+        border-right: 1px solid $sidebar-border;
+      }
+      left: 0;
+      right: auto;
+      top: 0;
+    }
+
+    &.e-left.e-close.e-dock {
+      transform: translateX(0%);
+      transition: width .5s ease, visibility 500ms;
+      visibility: visible;
+    }
+
+    &.e-right.e-close.e-dock {
+      transform: translateX(0%);
+      transition: width .5s ease, visibility 500ms;
+      visibility: visible;
+    }
+
+    &.e-left.e-open.e-dock.e-blazor-dock,
+    &.e-right.e-open.e-dock.e-blazor-dock {
+      transition: width .5s ease, visibility 500ms;
+    }
+
+    &.e-left.e-open.e-disable-animation,
+    &.e-right.e-open.e-disable-animation,
+    &.e-right.e-close.e-disable-animation,
+    &.e-left.e-close.e-disable-animation {
+      transition: none;
+    }
+
+    &.e-visibility {
+      visibility: hidden;
+    }
+
+    &.e-over {
+      box-shadow: $sidebar-box-shadow;
+    }
+  }
+
+  .e-sidebar-absolute {
+    position: absolute;
+  }
+
+  .e-sidebar-context {
+    overflow-x: hidden;
+    position: relative;
+  }
+
+  .e-backdrop {
+    background-color: $sidebar-overlay;
+    height: 100%;
+    left: 0;
+    @if ($skin-name != 'tailwind' and  $skin-name != 'bootstrap5' and  $skin-name != 'FluentUI') {
+      opacity: .5;
+    }
+    pointer-events: auto;
+    top: 0;
+    width: auto;
+    z-index: 999;
+  }
+
+  .e-content-animation {
+    transition: margin .5s ease, -webkit-transform .5s ease, transform .5s ease;
+
+    &.e-overlay {
+      box-sizing: border-box;
+      overflow: auto;
+      user-select: none;
+    }
+  }
+
+  .e-disable-interaction {
+    pointer-events: none;
+    touch-action: none;
+  }
+
+  /* stylelint-disable */
+  .e-sidebar-overflow {
+        overflow-x: hidden !important;
+    }
+  /* stylelint-enable */
+
+  .e-sidebar-overlay {
+    background-color: $sidebar-overlay;
+    height: 100%;
+    left: 0;
+    @if ($skin-name != 'tailwind' and  $skin-name != 'bootstrap5' and  $skin-name != 'FluentUI') {
+      opacity: .5;
+    }
+    pointer-events: auto;
+    position: fixed;
+    top: 0;
+    width: 100%;
+    z-index: 999;
+  }
+
+  .e-content-placeholder.e-sidebar.e-placeholder-sidebar {
+    left: 0;
+    position: fixed;
+    right: auto;
+    top: 0;
+    visibility: visible;
+  }
+}

package/styles/sidebar/bootstrap-dark.css

@@ -1,3 +1,4 @@
+/* stylelint-disable-line no-empty-source */ /* stylelint-disable-line no-empty-source */
 ejs-sidebar {
   display: none;
 }
@@ -7,6 +8,7 @@ ejs-sidebar {
 }
 
 .e-sidebar {
+  /* stylelint-disable property-no-vendor-prefix */
   -webkit-tap-highlight-color: transparent;
   background: #313131;
   height: 100%;
@@ -120,10 +122,12 @@ ejs-sidebar {
       touch-action: none;
 }
 
+/* stylelint-disable */
 .e-sidebar-overflow {
   overflow-x: hidden !important;
 }
 
+/* stylelint-enable */
 .e-sidebar-overlay {
   background-color: rgba(0, 0, 0, 0.6);
   height: 100%;

package/styles/sidebar/bootstrap-dark.scss

@@ -1 +1,3 @@
-@import 'ej2-navigations/styles/sidebar/bootstrap-dark.scss';
+@import 'ej2-base/styles/bootstrap-dark-definition.scss';
+@import 'bootstrap-dark-definition.scss';
+@import 'all.scss';

package/styles/sidebar/bootstrap.css

@@ -1,3 +1,4 @@
+/* stylelint-disable-line no-empty-source */ /* stylelint-disable-line no-empty-source */
 ejs-sidebar {
   display: none;
 }
@@ -7,6 +8,7 @@ ejs-sidebar {
 }
 
 .e-sidebar {
+  /* stylelint-disable property-no-vendor-prefix */
   -webkit-tap-highlight-color: transparent;
   background: #fff;
   height: 100%;
@@ -120,10 +122,12 @@ ejs-sidebar {
       touch-action: none;
 }
 
+/* stylelint-disable */
 .e-sidebar-overflow {
   overflow-x: hidden !important;
 }
 
+/* stylelint-enable */
 .e-sidebar-overlay {
   background-color: rgba(0, 0, 0, 0.6);
   height: 100%;

package/styles/sidebar/bootstrap.scss

@@ -1 +1,3 @@
-@import 'ej2-navigations/styles/sidebar/bootstrap.scss';
+@import 'ej2-base/styles/bootstrap-definition.scss';
+@import 'bootstrap-definition.scss';
+@import 'all.scss';

package/styles/sidebar/bootstrap4.css

@@ -1,3 +1,4 @@
+/* stylelint-disable-line no-empty-source */ /* stylelint-disable-line no-empty-source */
 ejs-sidebar {
   display: none;
 }
@@ -7,6 +8,7 @@ ejs-sidebar {
 }
 
 .e-sidebar {
+  /* stylelint-disable property-no-vendor-prefix */
   -webkit-tap-highlight-color: transparent;
   background: #fff;
   height: 100%;
@@ -120,10 +122,12 @@ ejs-sidebar {
       touch-action: none;
 }
 
+/* stylelint-disable */
 .e-sidebar-overflow {
   overflow-x: hidden !important;
 }
 
+/* stylelint-enable */
 .e-sidebar-overlay {
   background-color: rgba(0, 0, 0, 0.5);
   height: 100%;

package/styles/sidebar/bootstrap4.scss

@@ -1 +1,3 @@
-@import 'ej2-navigations/styles/sidebar/bootstrap4.scss';
+@import 'ej2-base/styles/bootstrap4-definition.scss';
+@import 'bootstrap4-definition.scss';
+@import 'all.scss';