feat(module-system): integrate module system in default theme

telerik · Mar 31, 2023 · 0e5e949 · 0e5e949
1 parent 690aafa
commit 0e5e949
Show file tree

Hide file tree

Showing 326 changed files with 3,552 additions and 611 deletions.
diff --git a/packages/default/scss/_variables.scss b/packages/default/scss/_variables.scss
@@ -14,6 +14,8 @@ $kendo-use-input-button-width: true !default;
 $kendo-use-input-spinner-width: true !default;
 $kendo-use-input-spinner-icon-offset: false !default;
 
+$kendo-auto-bootstrap: true !default;
+
 
 // Spacing
 $kendo-spacing: (

diff --git a/packages/default/scss/action-buttons/_index.scss b/packages/default/scss/action-buttons/_index.scss
@@ -18,3 +18,21 @@ $_kendo-module-meta: (
 @import "./_variables.scss";
 @import "./_layout.scss";
 @import "./_theme.scss";
+
+
+// Register
+@import "../core/module-system/index.import.scss";
+@include module-register( $_kendo-module-meta... );
+
+
+// Expose
+@mixin kendo-actions--styles() {
+    @include module-render( "actions" ) {
+        @include kendo-actions--layout();
+        @include kendo-actions--theme();
+    }
+}
+
+@if $kendo-auto-bootstrap {
+    @include kendo-actions--styles();
+}
diff --git a/packages/default/scss/action-buttons/_layout.scss b/packages/default/scss/action-buttons/_layout.scss
@@ -1,5 +1,6 @@
-@include exports("action-buttons/layout") {
+@mixin kendo-actions--layout-base() {
 
+    // Actions
     .k-actions {
         padding-block: $kendo-actions-padding-y;
         padding-inline: $kendo-actions-padding-x;
@@ -29,14 +30,6 @@
         margin-top: $kendo-actions-margin-top;
     }
 
-
-    // Aliases
-    .k-edit-buttons,
-    .k-action-buttons,
-    .k-columnmenu-actions {
-        @extend .k-actions !optional;
-    }
-
     // Actions align
     .k-actions-start {
         justify-content: flex-start;
@@ -51,6 +44,7 @@
         flex: 1 0 0%;
     }
 
+
     // Actions orientation
     .k-actions-horizontal {
         width: 100%;
@@ -60,4 +54,17 @@
         flex-flow: column nowrap;
     }
 
+
+    // Aliases
+    .k-edit-buttons,
+    .k-action-buttons,
+    .k-columnmenu-actions {
+        @extend .k-actions !optional;
+    }
+
+}
+
+
+@mixin kendo-actions--layout() {
+    @include kendo-actions--layout-base();
 }
diff --git a/packages/default/scss/action-buttons/_theme.scss b/packages/default/scss/action-buttons/_theme.scss
@@ -1,5 +1,6 @@
-@include exports("action-buttons/theme") {
+@mixin kendo-actions--theme-base() {
 
+    // Actions
     .k-actions {
         @include fill(
             $kendo-actions-text,
@@ -10,3 +11,8 @@
     }
 
 }
+
+
+@mixin kendo-actions--theme() {
+    @include kendo-actions--theme-base();
+}
diff --git a/packages/default/scss/action-sheet/_index.scss b/packages/default/scss/action-sheet/_index.scss
@@ -23,3 +23,21 @@ $_kendo-module-meta: (
 @import "./_variables.scss";
 @import "./_layout.scss";
 @import "./_theme.scss";
+
+
+// Register
+@import "../core/module-system/index.import.scss";
+@include module-register( $_kendo-module-meta... );
+
+
+// Expose
+@mixin kendo-action-sheet--styles() {
+    @include module-render( "action-sheet" ) {
+        @include kendo-action-sheet--layout();
+        @include kendo-action-sheet--theme();
+    }
+}
+
+@if $kendo-auto-bootstrap {
+    @include kendo-action-sheet--styles();
+}
diff --git a/packages/default/scss/action-sheet/_layout.scss b/packages/default/scss/action-sheet/_layout.scss
@@ -1,4 +1,4 @@
-@include exports("action-sheet/layout") {
+@mixin kendo-action-sheet--layout-base() {
 
     // Action sheet container
     .k-actionsheet-container {
@@ -338,10 +338,9 @@
         }
     }
 
-}
-
-@include exports("action-sheet/layout/legacy") {
 
+    // Legacy action sheet
+    // TODO: remove when kendo-jquery migrate
     .k-actionsheet-jq {
         &.k-actionsheet {
             height: auto;
@@ -358,3 +357,8 @@
     }
 
 }
+
+
+@mixin kendo-action-sheet--layout() {
+    @include kendo-action-sheet--layout-base();
+}
diff --git a/packages/default/scss/action-sheet/_theme.scss b/packages/default/scss/action-sheet/_theme.scss
@@ -1,4 +1,4 @@
-@include exports("action-sheet/theme") {
+@mixin kendo-action-sheet--theme-base() {
 
     // Actionsheet
     .k-actionsheet {
@@ -95,3 +95,8 @@
     }
 
 }
+
+
+@mixin kendo-action-sheet--theme() {
+    @include kendo-action-sheet--theme-base();
+}
diff --git a/packages/default/scss/adaptive/_index.scss b/packages/default/scss/adaptive/_index.scss
@@ -27,3 +27,21 @@ $_kendo-module-meta: (
 @import "./_variables.scss";
 @import "./_layout.scss";
 @import "./_theme.scss";
+
+
+// Register
+@import "../core/module-system/index.import.scss";
+@include module-register( $_kendo-module-meta... );
+
+
+// Expose
+@mixin kendo-adaptive--styles() {
+    @include module-render( "adaptive" ) {
+        @include kendo-adaptive--layout();
+        @include kendo-adaptive--theme();
+    }
+}
+
+@if $kendo-auto-bootstrap {
+    @include kendo-adaptive--styles();
+}
diff --git a/packages/default/scss/adaptive/_layout.scss b/packages/default/scss/adaptive/_layout.scss
@@ -1,4 +1,4 @@
-@include exports("adaptive/layout") {
+@mixin kendo-adaptive--layout-base() {
 
     .k-pane-wrapper {
         border-width: $kendo-adaptive-border-width;
@@ -54,11 +54,10 @@
         }
     }
 
-}
 
 
-@include exports("adaptive/layout/grid") {
 
+    // Grid specific styles
     .k-pane-wrapper {
 
         > div.k-pane {
@@ -114,10 +113,11 @@
             user-select: none;
         }
     }
-}
 
-@include exports("adaptive/layout/scheduler") {
 
+
+
+    // Scheduler specific styles
     .k-pane-wrapper {
 
         .k-scheduler-edit-form {
@@ -344,10 +344,11 @@
             border-bottom-width: 0;
         }
     }
-}
 
-@include exports("adaptive/layout/common") {
 
+
+
+    // Common styles for the Adaptive Layout
     .k-pane-wrapper {
 
         .k-appbar {
@@ -489,4 +490,10 @@
             }
         }
     }
+
+}
+
+
+@mixin kendo-adaptive--layout() {
+    @include kendo-adaptive--layout-base();
 }
diff --git a/packages/default/scss/adaptive/_theme.scss b/packages/default/scss/adaptive/_theme.scss
@@ -1,4 +1,4 @@
-@include exports("adaptive/theme") {
+@mixin kendo-adaptive--theme-base() {
 
     .k-pane-wrapper,
     .k-view {
@@ -92,4 +92,10 @@
         }
 
     }
+
+}
+
+
+@mixin kendo-adaptive--theme() {
+    @include kendo-adaptive--theme-base();
 }
diff --git a/packages/default/scss/all.scss b/packages/default/scss/all.scss
@@ -1 +1,7 @@
 @import "./index.scss";
+
+
+@if not $kendo-auto-bootstrap {
+    @include kendo-theme--config();
+    @include kendo-theme--styles();
+}
diff --git a/packages/default/scss/appbar/_index.scss b/packages/default/scss/appbar/_index.scss
@@ -17,3 +17,21 @@ $_kendo-module-meta: (
 @import "./_variables.scss";
 @import "./_layout.scss";
 @import "./_theme.scss";
+
+
+// Register
+@import "../core/module-system/index.import.scss";
+@include module-register( $_kendo-module-meta... );
+
+
+// Expose
+@mixin kendo-appbar--styles() {
+    @include module-render( "appbar" ) {
+        @include kendo-appbar--layout();
+        @include kendo-appbar--theme();
+    }
+}
+
+@if $kendo-auto-bootstrap {
+    @include kendo-appbar--styles();
+}
diff --git a/packages/default/scss/appbar/_layout.scss b/packages/default/scss/appbar/_layout.scss
@@ -1,4 +1,4 @@
-@include exports("appbar/layout") {
+@mixin kendo-appbar--layout-base() {
 
     // Appbar
     .k-appbar {
@@ -110,3 +110,8 @@
     }
 
 }
+
+
+@mixin kendo-appbar--layout() {
+    @include kendo-appbar--layout-base();
+}
diff --git a/packages/default/scss/appbar/_theme.scss b/packages/default/scss/appbar/_theme.scss
@@ -1,4 +1,4 @@
-@include exports("appbar/theme") {
+@mixin kendo-appbar--theme-base() {
 
     .k-appbar {
         @include box-shadow( $kendo-appbar-box-shadow );
@@ -25,3 +25,8 @@
     }
 
 }
+
+
+@mixin kendo-appbar--theme() {
+    @include kendo-appbar--theme-base();
+}
diff --git a/packages/default/scss/autocomplete/_index.scss b/packages/default/scss/autocomplete/_index.scss
@@ -27,3 +27,21 @@ $_kendo-module-meta: (
 @import "./_variables.scss";
 @import "./_layout.scss";
 @import "./_theme.scss";
+
+
+// Register
+@import "../core/module-system/index.import.scss";
+@include module-register( $_kendo-module-meta... );
+
+
+// Expose
+@mixin kendo-autocomplete--styles() {
+    @include module-render( "autocomplete" ) {
+        @include kendo-autocomplete--layout();
+        @include kendo-autocomplete--theme();
+    }
+}
+
+@if $kendo-auto-bootstrap {
+    @include kendo-autocomplete--styles();
+}
diff --git a/packages/default/scss/autocomplete/_layout.scss b/packages/default/scss/autocomplete/_layout.scss
@@ -1,6 +1,11 @@
-@include exports( "autocomplete/layout" ) {
+@mixin kendo-autocomplete--layout-base() {
 
     // Autocomplete
     .k-autocomplete {}
 
 }
+
+
+@mixin kendo-autocomplete--layout() {
+    @include kendo-autocomplete--layout-base();
+}
diff --git a/packages/default/scss/autocomplete/_theme.scss b/packages/default/scss/autocomplete/_theme.scss
@@ -1,6 +1,11 @@
-@include exports( "autocomplete/theme" ) {
+@mixin kendo-autocomplete--theme-base() {
 
     // Autocomplete
     .k-autocomplete {}
 
 }
+
+
+@mixin kendo-autocomplete--theme() {
+    @include kendo-autocomplete--theme-base();
+}
diff --git a/packages/default/scss/avatar/_index.scss b/packages/default/scss/avatar/_index.scss
@@ -17,3 +17,21 @@ $_kendo-module-meta: (
 @import "./_variables.scss";
 @import "./_layout.scss";
 @import "./_theme.scss";
+
+
+// Register
+@import "../core/module-system/index.import.scss";
+@include module-register( $_kendo-module-meta... );
+
+
+// Expose
+@mixin kendo-avatar--styles() {
+    @include module-render( "avatar" ) {
+        @include kendo-avatar--layout();
+        @include kendo-avatar--theme();
+    }
+}
+
+@if $kendo-auto-bootstrap {
+    @include kendo-avatar--styles();
+}