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

package/scss/coloreditor/_index.scss

@@ -1,46 +1,24 @@
-@import "../core/_index.scss";
-
-
-
-// Module meta
-$_kendo-module-meta: (
-    name: "color-editor",
-    dependencies: (
-        "button",
-        "action-buttons",
-        "color-gradient",
-        "color-palette",
-        "color-preview"
-    )
-);
-
-
 // Dependencies
-@import "../action-buttons/_index.scss";
-@import "../color-preview/_index.scss";
-@import "../colorpalette/_index.scss";
-@import "../colorgradient/_index.scss";
-
+@use "../core/_index.scss" as *;
+@use "../action-buttons/_index.scss" as *;
+@use "../color-preview/_index.scss" as *;
+@use "../colorpalette/_index.scss" as *;
+@use "../colorgradient/_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-editor--styles() {
-    @include module-render( "color-editor" ) {
+    @include import-once( "color-editor" ) {
+        @include core-styles();
+        @include kendo-action-buttons--styles();
+        @include kendo-color-preview--styles();
+        @include kendo-color-palette--styles();
+        @include kendo-color-gradient--styles();
         @include kendo-color-editor--layout();
         @include kendo-color-editor--theme();
     }
 }
-
-@if $kendo-auto-bootstrap {
-    @include kendo-color-editor--styles();
-}

package/scss/coloreditor/_layout.scss

@@ -1,3 +1,7 @@
+@use "../core/_index.scss" as *;
+@use "./variables.scss" as *;
+@use "../colorpalette/_variables.scss" as *;
+
 @mixin kendo-color-editor--layout-base() {
 
     // ColorEditor/FlatColorPicker

package/scss/coloreditor/_theme.scss

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

package/scss/coloreditor/_variables.scss

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

package/scss/colorgradient/_index.scss

@@ -1,43 +1,26 @@
-@import "../core/_index.scss";
-@import "../utils/_index.scss";
-
-
-
-// Module meta
-$_kendo-module-meta: (
-    name: "color-gradient",
-    dependencies: (
-        "button",
-        "icon",
-        "numeric-textbox",
-        "slider",
-        "textbox",
-    )
-);
-
-
 // Dependencies
-@import "../icons/_index.scss";
-@import "../button/_index.scss";
-@import "../slider/_index.scss";
-@import "../textbox/_index.scss";
-@import "../numerictextbox/_index.scss";
-
+@use "../core/_index.scss" as *;
+@use "../icons/_index.scss" as *;
+@use "../utils/_index.scss" as *;
+@use "../button/_index.scss" as *;
+@use "../slider/_index.scss" as *;
+@use "../textbox/_index.scss" as *;
+@use "../numerictextbox/_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-gradient--styles() {
-    @include module-render( "color-gradient" ) {
+    @include import-once( "color-gradient" ) {
+        @include core-styles();
+        @include kendo-icon--styles();
+        @include kendo-button--styles();
+        @include kendo-slider--styles();
+        @include kendo-textbox--styles();
+        @include kendo-numeric-textbox--styles();
         @include kendo-color-gradient--layout();
         @include kendo-color-gradient--theme();
         @include kendo-utils--flex-grid--flex();
@@ -45,7 +28,3 @@ $_kendo-module-meta: (
         @include kendo-utils--typography--text-color();
     }
 }
-
-@if $kendo-auto-bootstrap {
-    @include kendo-color-gradient--styles();
-}

package/scss/colorgradient/_layout.scss

@@ -1,3 +1,7 @@
+@use "sass:math";
+@use "../core/_index.scss" as *;
+@use "./variables.scss" as *;
+
 @mixin kendo-color-gradient--layout-base() {
 
     // ColorGradient
@@ -83,7 +87,7 @@
         &.k-slider-vertical .k-slider-track {
             width: $kendo-color-gradient-slider-track-size;
             border-radius: $kendo-color-gradient-slider-border-radius;
-            margin-left: - k-math-div( $kendo-color-gradient-slider-track-size, 2 );
+            margin-left: - math.div( $kendo-color-gradient-slider-track-size, 2 );
         }
 
         &.k-slider-horizontal {
@@ -94,7 +98,7 @@
         &.k-slider-horizontal .k-slider-track {
             height: $kendo-color-gradient-slider-track-size;
             border-radius: $kendo-color-gradient-slider-border-radius;
-            margin-top: - k-math-div( $kendo-color-gradient-slider-track-size, 2 );
+            margin-top: - math.div( $kendo-color-gradient-slider-track-size, 2 );
         }
 
         &.k-alpha-slider .k-slider-track::before {

package/scss/colorgradient/_theme.scss

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

package/scss/colorgradient/_variables.scss

@@ -1,3 +1,6 @@
+@use "sass:math";
+@use "../core/_index.scss" as *;
+
 // ColorGradient
 
 /// The spacer of the ColorGradient.
@@ -117,10 +120,10 @@ $kendo-color-gradient-draghandle-shadow: k-elevation(2) !default;
 
 /// The vertical margin of the ColorGradient canvas drag handle.
 /// @group color-gradient
-$kendo-color-gradient-canvas-draghandle-margin-y: - k-math-div( $kendo-color-gradient-draghandle-height, 2 ) !default;
+$kendo-color-gradient-canvas-draghandle-margin-y: - math.div( $kendo-color-gradient-draghandle-height, 2 ) !default;
 /// The horizontal margin of the ColorGradient canvas drag handle.
 /// @group color-gradient
-$kendo-color-gradient-canvas-draghandle-margin-x: - k-math-div( $kendo-color-gradient-draghandle-width, 2 ) !default;
+$kendo-color-gradient-canvas-draghandle-margin-x: - math.div( $kendo-color-gradient-draghandle-width, 2 ) !default;
 
 /// The width of the ColorGradient input.
 /// @group color-gradient

package/scss/colorpalette/_index.scss

@@ -1,36 +1,16 @@
-@import "../core/_index.scss";
-
-
-
-// Module meta
-$_kendo-module-meta: (
-    name: "color-palette",
-    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-color-palette--styles() {
-    @include module-render( "color-palette" ) {
+    @include import-once( "color-palette" ) {
+        @include core-styles();
         @include kendo-color-palette--layout();
         @include kendo-color-palette--theme();
     }
 }
-
-@if $kendo-auto-bootstrap {
-    @include kendo-color-palette--styles();
-}

package/scss/colorpalette/_layout.scss

@@ -1,3 +1,6 @@
+@use "../core/_index.scss" as *;
+@use "./variables.scss" as *;
+
 @mixin kendo-color-palette--layout-base() {
 
     // ColorPalette

package/scss/colorpalette/_theme.scss

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

package/scss/colorpalette/_variables.scss

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

package/scss/colorpicker/_index.scss

@@ -1,47 +1,26 @@
-@import "../core/_index.scss";
-
-
-
-// Module meta
-$_kendo-module-meta: (
-    name: "color-picker",
-    dependencies: (
-        "button",
-        "color-editor",
-        "icon",
-        "input",
-        "popup",
-    )
-);
-
-
 // Dependencies
-@import "../input/_index.scss";
-@import "../button/_index.scss";
-@import "../coloreditor/_index.scss";
-@import "../popup/_index.scss";
-@import "../icons/_index.scss";
-
+@use "../core/_index.scss" as *;
+@use "../icons/_index.scss" as *;
+@use "../input/_index.scss" as *;
+@use "../button/_index.scss" as *;
+@use "../coloreditor/_index.scss" as *;
+@use "../popup/_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-picker--styles() {
-    @include module-render( "color-picker" ) {
+    @include import-once( "color-picker" ) {
+        @include core-styles();
+        @include kendo-input--styles();
+        @include kendo-button--styles();
+        @include kendo-color-editor--styles();
+        @include kendo-popup--styles();
+        @include kendo-icon--styles();
         @include kendo-color-picker--layout();
         @include kendo-color-picker--theme();
     }
 }
-
-@if $kendo-auto-bootstrap {
-    @include kendo-color-picker--styles();
-}

package/scss/combobox/_index.scss

@@ -1,48 +1,26 @@
-@import "../core/_index.scss";
-
-
-
-// Module meta
-$_kendo-module-meta: (
-    name: "combobox",
-    dependencies: (
-        "button",
-        "floating-label",
-        "icon",
-        "input",
-        "list",
-        "popup"
-    )
-);
-
-
 // Dependencies
-@import "../input/_index.scss";
-@import "../floating-label/_index.scss";
-@import "../icons/_index.scss";
-@import "../popup/_index.scss";
-@import "../list/_index.scss";
-
+@use "../core/_index.scss" as *;
+@use "../icons/_index.scss" as *;
+@use "../input/_index.scss" as *;
+@use "../floating-label/_index.scss" as *;
+@use "../popup/_index.scss" as *;
+@use "../list/_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-combobox--styles() {
-    @include module-render( "combobox" ) {
+    @include import-once( "combobox" ) {
+        @include core-styles();
+        @include kendo-input--styles();
+        @include kendo-floating-label--styles();
+        @include kendo-icon--styles();
+        @include kendo-popup--styles();
+        @include kendo-list--styles();
         @include kendo-combobox--layout();
         @include kendo-combobox--theme();
     }
 }
-
-@if $kendo-auto-bootstrap {
-    @include kendo-combobox--styles();
-}

package/scss/core/_index.scss

@@ -1,32 +1,9 @@
-$wcag-min-contrast-ratio: 4.5 !default;
+// Core Index
+@forward "@progress/kendo-theme-core/scss/index.import.scss";
 
 // Variables
-@import "../_variables.scss";
+@forward "../_variables.scss";
 
-// Color System
-@import "./color-system/_swatch.scss";
+// Color System Backward Compatibility
+@forward "./color-system/_swatch-legacy.scss";
 
-// Typography
-@import "./typography/index.import.scss";
-
-// Spacing
-@import "./spacing/index.import.scss";
-
-@import "@progress/kendo-theme-core/scss/index.import.scss";
-
-// Backward compatibility
-@import "./color-system/_swatch-legacy.scss";
-
-// Expose
-@include exports("kendo-core-styles") {
-    @include kendo-core--styles();
-
-    // Elevation System
-    @include kendo-elevation--styles();
-    // Typography
-    @include kendo-core--typography--styles();
-    // Spacing
-    @include kendo-spacing--styles();
-    // Radii
-    @include kendo-border-radius--styles();
-}

package/scss/core/border-radii/index.import.scss

@@ -1 +1 @@
-@import "@progress/kendo-theme-core/scss/border-radii/index.import.scss";
+@forward "@progress/kendo-theme-core/scss/border-radii/index.import.scss";