@progress/kendo-theme-default 9.1.1-dev.2 → 10.0.0-dev.0

package/scss/calendar/_variables.scss

@@ -1,3 +1,5 @@
+@use "../core/_index.scss" as *;
+
 // Calendar
 
 /// The width of the border around the Calendar.

package/scss/captcha/_index.scss

@@ -1,49 +1,29 @@
-@import "../core/_index.scss";
-@import "../utils/_index.scss";
-
-
-// Module meta
-$_kendo-module-meta: (
-    name: "captcha",
-    dependencies: (
-        "button",
-        "icon",
-        "input",
-        "slider",
-        "textbox",
-    )
-);
-
-
 // Dependencies
-@import "../icons/_index.scss";
-@import "../input/_index.scss";
-@import "../button/_index.scss";
-@import "../textbox/_index.scss";
-@import "../slider/_index.scss";
-
+@use "../core/_index.scss" as *;
+@use "../icons/_index.scss" as *;
+@use "../utils/_index.scss" as *;
+@use "../input/_index.scss" as *;
+@use "../button/_index.scss" as *;
+@use "../textbox/_index.scss" as *;
+@use "../slider/_index.scss" as *;
 
 // Component
-@import "./_variables.scss";
-@import "./_layout.scss";
-@import "./_theme.scss";
-
-
-// Register
-@import "../core/module-system/index.import.scss";
-@include module-register( $_kendo-module-meta... );
-
+@forward "./_variables.scss";
+@use "./_layout.scss" as *;
+@use "./_theme.scss" as *;
 
 // Expose
 @mixin kendo-captcha--styles() {
-    @include module-render( "captcha" ) {
+    @include import-once( "captcha" ) {
+        @include core-styles();
+        @include kendo-icon--styles();
+        @include kendo-input--styles();
+        @include kendo-button--styles();
+        @include kendo-textbox--styles();
+        @include kendo-slider--styles();
         @include kendo-captcha--layout();
         @include kendo-captcha--theme();
         @include kendo-utils--typography--text-color();
         @include kendo-utils--layout--position();
     }
 }
-
-@if $kendo-auto-bootstrap {
-    @include kendo-captcha--styles();
-}

package/scss/captcha/_layout.scss

@@ -1,3 +1,5 @@
+@use "./variables.scss" as *;
+
 @mixin kendo-captcha--layout-base() {
 
     // Captcha

package/scss/captcha/_theme.scss

@@ -1,3 +1,6 @@
+@use "../core/_index.scss" as *;
+@use "./variables.scss" as *;
+
 @mixin kendo-captcha--theme-base() {
 
     // Captcha

package/scss/captcha/_variables.scss

@@ -1,3 +1,5 @@
+@use "../core/_index.scss" as *;
+
 // Captcha
 
 /// The spacer of the Captcha.

package/scss/card/_index.scss

@@ -1,39 +1,22 @@
-@import "../core/_index.scss";
-@import "../utils/_index.scss";
-
-
-
-// Module meta
-$_kendo-module-meta: (
-    name: "card",
-    dependencies: (
-        "action-buttons",
-        "button",
-        "typography",
-    )
-);
-
-
 // Dependencies
-@import "../action-buttons/_index.scss";
-@import "../icons/_index.scss";
-@import "../typography/_index.scss";
-
+@use "../core/_index.scss" as *;
+@use "../icons/_index.scss" as *;
+@use "../utils/_index.scss" as *;
+@use "../action-buttons/_index.scss" as *;
+@use "../typography/_index.scss" as *;
 
 // Component
-@import "./_variables.scss";
-@import "./_layout.scss";
-@import "./_theme.scss";
-
-
-// Register
-@import "../core/module-system/index.import.scss";
-@include module-register( $_kendo-module-meta... );
-
+@forward "./_variables.scss";
+@use "./_layout.scss" as *;
+@use "./_theme.scss" as *;
 
 // Expose
 @mixin kendo-card--styles() {
-    @include module-render( "card" ) {
+    @include import-once( "card" ) {
+        @include core-styles();
+        @include kendo-action-buttons--styles();
+        @include kendo-icon--styles();
+        @include kendo-typography--styles();
         @include kendo-card--layout();
         @include kendo-card--theme();
         @include kendo-utils--typography--text-overflow();
@@ -41,7 +24,3 @@ $_kendo-module-meta: (
         @include kendo-utils--layout--display();
     }
 }
-
-@if $kendo-auto-bootstrap {
-    @include kendo-card--styles();
-}

package/scss/card/_layout.scss

@@ -1,3 +1,7 @@
+@use "../core/_index.scss" as *;
+@use "./variables.scss" as *;
+@use "../typography/_variables.scss" as *;
+
 @mixin kendo-card--layout-base() {
 
 

package/scss/card/_theme.scss

@@ -1,3 +1,7 @@
+@use "../core/_index.scss" as *;
+@use "../core/functions/index.import.scss" as *;
+@use "./variables.scss" as *;
+
 @mixin kendo-card--theme-base() {
 
     // Card

package/scss/card/_variables.scss

@@ -1,4 +1,5 @@
-@import "../button/_variables.scss";
+@use "../core/_index.scss" as *;
+@use "../button/_variables.scss" as *;
 
 // Card
 

package/scss/chart-wizard/_index.scss

@@ -1,57 +1,37 @@
-@import "../core/_index.scss";
-@import "../utils/_index.scss";
-
-
-// Module meta
-$_kendo-module-meta: (
-    name: "chart-wizard",
-    dependencies: (
-        "icon",
-        "window",
-        "splitter",
-        "dataviz",
-        "expander",
-        "grid",
-        "tabstrip",
-        "listview",
-        "form",
-        "combobox"
-    )
-);
-
-
 // Dependencies
-@import "../icons/_index.scss";
-@import "../window/_index.scss";
-@import "../splitter/_index.scss";
-@import "../dataviz/_index.scss";
-@import "../expansion-panel/_index.scss";
-@import "../grid/_index.scss";
-@import "../tabstrip/_index.scss";
-@import "../listview/_index.scss";
-@import "../forms/_index.scss";
-@import "../combobox/_index.scss";
-
+@use "../core/_index.scss" as *;
+@use "../icons/_index.scss" as *;
+@use "../utils/_index.scss" as *;
+@use "../window/_index.scss" as *;
+@use "../splitter/_index.scss" as *;
+@use "../dataviz/_index.scss" as *;
+@use "../expansion-panel/_index.scss" as *;
+@use "../grid/_index.scss" as *;
+@use "../tabstrip/_index.scss" as *;
+@use "../listview/_index.scss" as *;
+@use "../forms/_index.scss" as *;
+@use "../combobox/_index.scss" as *;
 
 // Component
-@import "./_variables.scss";
-@import "./_layout.scss";
-@import "./_theme.scss";
-
-
-// Register
-@import "../core/module-system/index.import.scss";
-@include module-register( $_kendo-module-meta... );
-
+@forward "./_variables.scss";
+@use "./_layout.scss" as *;
+@use "./_theme.scss" as *;
 
 // Expose
 @mixin kendo-chart-wizard--styles() {
-    @include module-render( "chart-wizard" ) {
+    @include import-once( "chart-wizard" ) {
+        @include core-styles();
+        @include kendo-icon--styles();
+        @include kendo-window--styles();
+        @include kendo-splitter--styles();
+        @include kendo-dataviz--styles();
+        @include kendo-expander--styles();
+        @include kendo-grid--styles();
+        @include kendo-tabstrip--styles();
+        @include kendo-listview--styles();
+        @include kendo-form--styles();
+        @include kendo-combobox--styles();
         @include kendo-chart-wizard--layout();
         @include kendo-chart-wizard--theme();
     }
 }
-
-@if $kendo-auto-bootstrap {
-    @include kendo-chart-wizard--styles();
-}

package/scss/chart-wizard/_layout.scss

@@ -1,3 +1,5 @@
+@use "./variables.scss" as *;
+
 @mixin kendo-chart-wizard--layout-base() {
     // Chart wizard
     .k-chart-wizard {

package/scss/chart-wizard/_theme.scss

@@ -1,3 +1,5 @@
+@use "./variables.scss" as *;
+
 @mixin kendo-chart-wizard--theme-base() {
     .k-chart-wizard {
         .k-icon-text-wrapper {

package/scss/chart-wizard/_variables.scss

@@ -1,3 +1,6 @@
+@use "../core/_index.scss" as *;
+@use "../core/functions/index.import.scss" as *;
+
 // Chart wizard
 
 /// The color of the area around the chart type icon.

package/scss/chat/_index.scss

@@ -1,47 +1,24 @@
-@import "../core/_index.scss";
-
-
-
-// Module meta
-$_kendo-module-meta: (
-    name: "chat",
-    dependencies: (
-        "avatar",
-        "button",
-        "card",
-        "icon",
-        "input",
-        "toolbar"
-    )
-);
-
-
 // Dependencies
-@import "../input/_index.scss";
-@import "../card/_index.scss";
-@import "../icons/_index.scss";
-@import "../toolbar/_index.scss";
-
+@use "../core/_index.scss" as *;
+@use "../icons/_index.scss" as *;
+@use "../input/_index.scss" as *;
+@use "../card/_index.scss" as *;
+@use "../toolbar/_index.scss" as *;
 
 // Component
-@import "./_variables.scss";
-@import "./_layout.scss";
-@import "./_theme.scss";
-
-
-// Register
-@import "../core/module-system/index.import.scss";
-@include module-register( $_kendo-module-meta... );
-
+@forward "./_variables.scss";
+@use "./_layout.scss" as *;
+@use "./_theme.scss" as *;
 
 // Expose
 @mixin kendo-chat--styles() {
-    @include module-render( "chat" ) {
+    @include import-once( "chat" ) {
+        @include core-styles();
+        @include kendo-input--styles();
+        @include kendo-card--styles();
+        @include kendo-icon--styles();
+        @include kendo-toolbar--styles();
         @include kendo-chat--layout();
         @include kendo-chat--theme();
     }
 }
-
-@if $kendo-auto-bootstrap {
-    @include kendo-chat--styles();
-}

package/scss/chat/_layout.scss

@@ -1,3 +1,7 @@
+@use "../core/_index.scss" as *;
+@use "./variables.scss" as *;
+@use "../toolbar/_variables.scss" as *;
+
 @mixin kendo-chat--layout-base() {
 
     // Chat

package/scss/chat/_theme.scss

@@ -1,3 +1,6 @@
+@use "../core/_index.scss" as *;
+@use "./variables.scss" as *;
+
 @mixin kendo-chat--theme-base() {
 
     // Chat

package/scss/chat/_variables.scss

@@ -1,3 +1,7 @@
+@use "../core/_index.scss" as *;
+@use "../core/functions/index.import.scss" as *;
+@use "../toolbar/_variables.scss" as *;
+
 // Chat
 
 /// The horizontal padding of the Chat.

package/scss/checkbox/_index.scss

@@ -1,36 +1,16 @@
-@import "../core/_index.scss";
-
-
-
-// Module meta
-$_kendo-module-meta: (
-    name: "checkbox",
-    dependencies: ()
-);
-
-
 // Dependencies
-
+@use "../core/_index.scss" as *;
 
 // Component
-@import "./_variables.scss";
-@import "./_layout.scss";
-@import "./_theme.scss";
-
-
-// Register
-@import "../core/module-system/index.import.scss";
-@include module-register( $_kendo-module-meta... );
-
+@forward "./_variables.scss";
+@use "./_layout.scss" as *;
+@use "./_theme.scss" as *;
 
 // Expose
 @mixin kendo-checkbox--styles() {
-    @include module-render( "checkbox" ) {
+    @include import-once( "checkbox" ) {
+        @include core-styles();
         @include kendo-checkbox--layout();
         @include kendo-checkbox--theme();
     }
 }
-
-@if $kendo-auto-bootstrap {
-    @include kendo-checkbox--styles();
-}

package/scss/checkbox/_layout.scss

@@ -1,3 +1,7 @@
+@use "sass:map";
+@use "../core/_index.scss" as *;
+@use "./_variables.scss" as *;
+
 @mixin kendo-checkbox--layout-base() {
 
     // Checkbox
@@ -191,9 +195,9 @@
 
     // Checkbox size
     @each $size, $size-props in $kendo-checkbox-sizes {
-        $_size: k-map-get( $size-props, size );
-        $_glyph-size: k-map-get( $size-props, glyph-size );
-        $_ripple-size: k-map-get( $size-props, ripple-size );
+        $_size: map.get( $size-props, size );
+        $_glyph-size: map.get( $size-props, glyph-size );
+        $_ripple-size: map.get( $size-props, ripple-size );
 
         .k-checkbox-#{$size} {
             width: $_size;

package/scss/checkbox/_theme.scss

@@ -1,3 +1,6 @@
+@use "../core/_index.scss" as *;
+@use "./variables.scss" as *;
+
 @mixin kendo-checkbox--theme-base() {
 
     // Checkbox

package/scss/checkbox/_variables.scss

@@ -1,4 +1,6 @@
-@import "../list/_variables.scss";
+@use "../list/_variables.scss" as *;
+@use "../core/_index.scss" as *;
+@use "../core/functions/index.import.scss" as *;
 
 
 // CheckBox

package/scss/chip/_index.scss

@@ -1,42 +1,20 @@
-@import "../core/_index.scss";
-@import "../utils/_index.scss";
-
-
-
-// Module meta
-$_kendo-module-meta: (
-    name: "chip",
-    dependencies: (
-        "avatar",
-        "icon"
-    )
-);
-
-
 // Dependencies
-@import "../icons/_index.scss";
-
+@use "../core/_index.scss" as *;
+@use "../icons/_index.scss" as *;
+@use "../utils/_index.scss" as *;
 
 // Component
-@import "./_variables.scss";
-@import "./_layout.scss";
-@import "./_theme.scss";
-
-
-// Register
-@import "../core/module-system/index.import.scss";
-@include module-register( $_kendo-module-meta... );
-
+@forward "./_variables.scss";
+@use "./_layout.scss" as *;
+@use "./_theme.scss" as *;
 
 // Expose
 @mixin kendo-chip--styles() {
-    @include module-render( "chip" ) {
+    @include import-once( "chip" ) {
+        @include core-styles();
+        @include kendo-icon--styles();
         @include kendo-chip--layout();
         @include kendo-chip--theme();
         @include kendo-utils--typography--text-overflow();
     }
 }
-
-@if $kendo-auto-bootstrap {
-    @include kendo-chip--styles();
-}

package/scss/chip/_layout.scss

@@ -1,3 +1,6 @@
+@use "./_variables.scss" as *;
+@use "sass:map";
+
 @mixin kendo-chip--layout-base() {
 
     // Chip
@@ -126,10 +129,10 @@
 
     // Sizes
     @each $size, $size-props in $kendo-chip-sizes {
-        $_padding-x: k-map-get( $size-props, padding-x );
-        $_padding-y: k-map-get( $size-props, padding-y );
-        $_font-size: k-map-get( $size-props, font-size );
-        $_line-height: k-map-get( $size-props, line-height );
+        $_padding-x: map.get( $size-props, padding-x );
+        $_padding-y: map.get( $size-props, padding-y );
+        $_font-size: map.get( $size-props, font-size );
+        $_line-height: map.get( $size-props, line-height );
         $_avatar-size: 1em;
 
         .k-chip-#{$size} {

package/scss/chip/_theme.scss

@@ -1,3 +1,7 @@
+@use "../core/_index.scss" as *;
+@use "../core/functions/index.import.scss" as *;
+@use "./_variables.scss" as *;
+
 @mixin kendo-chip--theme-base() {
 
     // Solid

package/scss/chip/_variables.scss

@@ -1,4 +1,7 @@
-@import "../button/_variables.scss";
+@use "sass:map";
+@use "../core/_index.scss" as *;
+@use "../core/functions/index.import.scss" as *;
+@use "../button/_variables.scss" as *;
 
 
 // Chip
@@ -98,10 +101,10 @@ $kendo-chip-base-bg: if($kendo-enable-color-system, k-color( base-subtle ), $ken
 /// @group chip
 $kendo-chip-theme-colors: (
     "base": $kendo-chip-base-bg,
-    "error": k-map-get($kendo-theme-colors, "error"),
-    "info": k-map-get($kendo-theme-colors, "info"),
-    "warning": k-map-get($kendo-theme-colors, "warning"),
-    "success": k-map-get($kendo-theme-colors, "success")
+    "error": map.get($kendo-theme-colors, "error"),
+    "info": map.get($kendo-theme-colors, "info"),
+    "warning": map.get($kendo-theme-colors, "warning"),
+    "success": map.get($kendo-theme-colors, "success")
 ) !default;
 
 /// The base background color of the solid Chip.

package/scss/color-preview/_index.scss

@@ -1,38 +1,16 @@
-@import "../core/_index.scss";
-
-
-
-// Module meta
-$_kendo-module-meta: (
-    name: "color-preview",
-    dependencies: (
-        "icon"
-    )
-);
-
-
 // Dependencies
-
+@use "../core/_index.scss" as *;
 
 // Component
-@import "./_variables.scss";
-@import "./_layout.scss";
-@import "./_theme.scss";
-
-
-// Register
-@import "../core/module-system/index.import.scss";
-@include module-register( $_kendo-module-meta... );
-
+@forward "./_variables.scss";
+@use "./_layout.scss" as *;
+@use "./_theme.scss" as *;
 
 // Expose
 @mixin kendo-color-preview--styles() {
-    @include module-render( "color-preview" ) {
+    @include import-once( "color-preview" ) {
+        @include core-styles();
         @include kendo-color-preview--layout();
         @include kendo-color-preview--theme();
     }
 }
-
-@if $kendo-auto-bootstrap {
-    @include kendo-color-preview--styles();
-}

package/scss/color-preview/_layout.scss

@@ -1,3 +1,6 @@
+@use "./_variables.scss" as *;
+@use "../icons/_variables.scss" as *;
+
 @mixin kendo-color-preview--layout-base() {
 
     // Color Preview

package/scss/color-preview/_theme.scss

@@ -1,3 +1,6 @@
+@use "../core/_index.scss" as *;
+@use "./_variables.scss" as *;
+
 @mixin kendo-color-preview--theme-base() {
 
     // Color Preview

package/scss/color-preview/_variables.scss

@@ -1,3 +1,6 @@
+@use "../core/_index.scss" as *;
+@use "../core/functions/index.import.scss" as *;
+
 // Color Preview
 $kendo-color-preview-border-radius: k-border-radius(md)!default;
 $kendo-color-preview-border-width: 1px !default;