igniteui-angular 20.0.7 → 20.0.9

package/lib/core/styles/components/button/_button-theme.scss

@@ -1,242 +1,8 @@
 @use 'sass:map';
 @use 'sass:meta';
-@use 'sass:color';
 @use 'sass:list';
 @use 'sass:string';
 @use '../../base' as *;
-@use '../../themes/schemas' as *;
-
-@forward './flat-button-theme';
-@forward './contained-button-theme';
-@forward './outlined-button-theme';
-@forward './fab-button-theme';
-
-////
-/// @group themes
-/// @access public
-/// @author <a href="https://github.com/desig9stein" target="_blank">Marin Popov</a>
-/// @author <a href="https://github.com/simeonoff" target="_blank">Simeon Simeonoff</a>
-////
-
-/// If only background color is specified, text/icon color
-/// will be assigned automatically to a contrasting color.
-/// Does ___not___ apply for disabled state colors.
-/// @param {Map} $schema [$light-material-schema] - The schema used as basis for styling the component.
-/// @param {Color} $background [null] - The background color of the button.
-/// @param {Color} $foreground [null] - The text color of the button.
-/// @param {Color} $icon-color [null] - The icon color in the button.
-/// @param {Color} $icon-color-hover [null] - The icon color in the button on hover.
-/// @param {Color} $hover-background [null] - The hover background color of the button.
-/// @param {Color} $hover-foreground [null] - The hover text color of the button.
-/// @param {Color} $focus-background [null] - The focus background color of the button.
-/// @param {Color} $focus-foreground [null] - The focus text color of the button.
-/// @param {Color} $focus-hover-background [null] - The background color on focus hovered state of the button.
-/// @param {Color} $focus-hover-foreground [null] - The text color on focus hovered state of the button.
-/// @param {Color} $focus-visible-background [null] - The focus-visible background color of the button.
-/// @param {Color} $focus-visible-foreground [null] - The focus-visible text color of the button.
-/// @param {Color} $active-background [null] - The active background of the button.
-/// @param {Color} $active-foreground [null] - The active text color of the button.
-/// @param {List} $border-radius [null] - The border radius of the button.
-/// @param {Color} $border-color [null] - The border color of the button.
-/// @param {Color} $hover-border-color [null] - The hover border color of the button.
-/// @param {Color} $focus-border-color [null] - The focus border color of the button.
-/// @param {Color} $focus-visible-border-color [null] - The focus-visible border color of the button.
-/// @param {Color} $active-border-color [null] - The active border color of the button.
-/// @param {Color} $shadow-color [null] - The shadow color of the button.
-/// @param {Color} $resting-shadow [null] - The shadow of the button in its idle state.
-/// @param {Color} $hover-shadow [null] - The shadow of the button in its hover state.
-/// @param {Color} $focus-shadow [null] - The shadow of the button in its focus state.
-/// @param {Color} $active-shadow [null] - The shadow of the button in its active state.
-/// @param {Color} $disabled-background [null] - The disabled background color of the button.
-/// @param {Color} $disabled-foreground [null] - The disabled text color of the button.
-/// @param {Color} $disabled-icon-color [null] - The disabled icon color of the button.
-/// @param {Color} $disabled-border-color [null] - The disabled border color of the button.
-///
-/// @requires $light-material-schema
-///
-/// @example scss Change the background and text colors in contained buttons
-///   $my-button-theme: button-theme(
-///     $foreground: white,
-///     $background: black
-///   );
-///   // Pass the theme to the css-vars() mixin
-///   @include css-vars($my-button-theme);
-@function button-theme(
-    $schema: $light-material-schema,
-
-    $background: null,
-    $foreground: null,
-
-    $hover-background: null,
-    $hover-foreground: null,
-
-    $icon-color: $foreground,
-    $icon-color-hover: $hover-foreground,
-
-    $focus-background: null,
-    $focus-foreground: null,
-
-    $focus-hover-background: null,
-    $focus-hover-foreground: null,
-
-    $focus-visible-background: null,
-    $focus-visible-foreground: null,
-
-    $active-background: null,
-    $active-foreground: null,
-
-    $border-radius: null,
-    $border-color: null,
-    $hover-border-color: null,
-    $focus-border-color: null,
-    $focus-visible-border-color: null,
-    $active-border-color: null,
-
-    $shadow-color: null,
-
-    $resting-shadow: null,
-    $hover-shadow: null,
-    $focus-shadow: null,
-    $active-shadow: null,
-
-    $disabled-background: null,
-    $disabled-foreground: null,
-    $disabled-icon-color: $disabled-foreground,
-    $disabled-border-color: null,
-    $size: null,
-) {
-    $name: 'igx-button';
-    $button-schema: ();
-
-    @if map.has-key($schema, 'button') {
-        $button-schema: map.get($schema, 'button');
-    } @else {
-        $button-schema: $schema;
-    }
-
-    $themes: ();
-    $variant: null;
-
-    @each $_name, $_schema in $button-schema {
-        $_resting-shadow: $resting-shadow;
-        $_hover-shadow: $hover-shadow;
-        $_focus-shadow: $focus-shadow;
-        $_active-shadow: $active-shadow;
-        $_border-radius: $border-radius;
-
-        @if not($variant) {
-            $variant: map.get($schema, '_meta', 'theme');
-        }
-
-        @if not($foreground) and $background {
-            $foreground: adaptive-contrast(var(--background));
-        }
-
-        @if not($icon-color) and $background {
-            $icon-color: adaptive-contrast(var(--background));
-        }
-
-        @if not($hover-foreground) and $hover-background {
-            $hover-foreground: adaptive-contrast(var(--hover-background));
-        }
-
-        @if not($icon-color-hover) and $hover-foreground {
-            $icon-color-hover: var(--hover-foreground);
-        }
-
-        @if not($focus-foreground) and $focus-background {
-            $focus-foreground: adaptive-contrast(var(--focus-background));
-        }
-
-        @if not($focus-hover-foreground) and $focus-hover-background {
-            $focus-hover-foreground: adaptive-contrast(var(--focus-hover-background));
-        }
-
-        @if not($focus-visible-background) and $focus-background {
-            $focus-visible-background: var(--focus-background);
-        }
-
-        @if not($focus-visible-foreground) and $focus-visible-background {
-            $focus-visible-foreground: adaptive-contrast(var(--focus-visible-background));
-        }
-
-        @if not($focus-visible-border-color) and $focus-border-color {
-            $focus-visible-border-color: var(--focus-border-color);
-        }
-
-        @if not($_resting-shadow) {
-            $resting-elevation: map.get($_schema, 'resting-elevation');
-            $_resting-shadow: elevation($resting-elevation);
-        }
-
-        @if not($_hover-shadow) {
-            $hover-elevation: map.get($_schema, 'hover-elevation');
-            $_hover-shadow: elevation($hover-elevation);
-        }
-
-        @if not($_focus-shadow) {
-            $focus-elevation: map.get($_schema, 'focus-elevation');
-            $_focus-shadow: elevation($focus-elevation);
-        }
-
-        @if not($_active-shadow) {
-            $active-elevation: map.get($_schema, 'active-elevation');
-            $_active-shadow: elevation($active-elevation);
-        }
-
-        $themes: map.merge($themes, (
-            $_name: extend( digest-schema($_schema), (
-                name: $name,
-                background: $background,
-                foreground: $foreground,
-
-                icon-color: $icon-color,
-                icon-color-hover: $icon-color-hover,
-
-                hover-background: $hover-background,
-                hover-foreground: $hover-foreground,
-
-                focus-background: $focus-background,
-                focus-foreground: $focus-foreground,
-
-                focus-hover-background: $focus-hover-background,
-                focus-hover-foreground: $focus-hover-foreground,
-
-                focus-visible-background: $focus-visible-background,
-                focus-visible-foreground: $focus-visible-foreground,
-
-                active-background: $active-background,
-                active-foreground: $active-foreground,
-
-                border-radius: $_border-radius,
-                border-color: $border-color,
-                hover-border-color: $hover-border-color,
-                focus-border-color: $focus-border-color,
-                focus-visible-border-color: $focus-visible-border-color,
-                active-border-color: $active-border-color,
-
-                shadow-color: $shadow-color,
-
-                resting-shadow: $_resting-shadow,
-                hover-shadow: $_hover-shadow,
-                focus-shadow: $_focus-shadow,
-                active-shadow: $_active-shadow,
-
-                disabled-background: $disabled-background,
-                disabled-foreground: $disabled-foreground,
-                disabled-icon-color: $disabled-icon-color,
-                disabled-border-color: $disabled-border-color,
-                size: $size,
-            ))
-        ));
-    }
-
-    @return (
-        name: $name,
-        variant: $variant,
-        themes: $themes,
-    );
-}
 
 /// @deprecated Use the `css-vars` mixin instead.
 /// @see {mixin} css-vars

package/lib/core/styles/components/button-group/_button-group-theme.scss

@@ -1,300 +1,7 @@
 @use 'sass:map';
-@use 'sass:meta';
 @use '../../base' as *;
-@use '../../themes/schemas' as *;
 @use 'igniteui-theming/sass/animations/easings' as *;
 
-////
-/// @group themes
-/// @access public
-/// @author <a href="https://github.com/desig9stein" target="_blank">Marin Popov</a>
-////
-
-/// If only background color is specified, text/icon color
-/// will be assigned automatically to a contrasting color.
-/// Does ___not___ apply for disabled state colors.
-/// @param {Map} $schema [$light-material-schema] - The schema used as basis for styling the component.
-///
-/// @param {box-shadow} $shadow [null] - The shadow to be applied for the button group.
-/// @param {Color} $item-text-color [null]- The text color for button group items.
-/// @param {color} $item-icon-color [null]- The icon color for button group items.
-/// @param {Color} $item-background [null] - The background color for button group items .
-/// @param {Color} $item-border-color [null] - The border color between button group items.
-///
-/// @param {Color} $item-hover-text-color [null] - The hover text color for button group items.
-/// @param {Color} $item-hover-icon-color [null] - The hover icon color for button group items.
-/// @param {Color} $item-hover-background [null] - The hover background color for button group items.
-/// @param {Color} $item-hover-border-color [null] - The hover border color between button group items.
-///
-/// @param {Color} $item-focused-text-color [null] - The focused text color for button group items.
-/// @param {Color} $item-focused-background [null] - The focused background color for button group items.
-/// @param {Color} $item-focused-border-color [null] - The focused border color for an item from the button group.
-/// @param {Color} $item-focused-hover-background [null] - The focused & hover background color for button group items.
-/// @param {Color} $idle-shadow-color [null] - The outline color of focused button group items.
-/// @param {Color} $selected-shadow-color [null] - The outline color of focused/selected button group items.
-///
-/// @param {Color} $disabled-text-color [null]- The text/icon color for a disabled item in the button group.
-/// @param {Color} $disabled-background-color [null] - The background color for a disabled item in the button group.
-/// @param {Color} $item-disabled-border [null] - The border color for a disabled item in the button group.
-///
-/// @param {Color} $item-selected-text-color [null]- The text color for a selected item in the button group.
-/// @param {Color} $item-selected-icon-color [null]- The icon color for a selected item in the button group.
-/// @param {Color} $item-selected-background [null] - The background color for a selected item in the button group.
-/// @param {Color} $item-selected-border-color [null] - The border color for a selected item from the button group.
-///
-/// @param {Color} $item-selected-hover-text-color [null] - The text color for a selected item in hover state in the button group.
-/// @param {Color} $item-selected-hover-icon-color [null] - The icon color for a selected item in hover state in the button group.
-/// @param {Color} $item-selected-hover-background [null] - The background color for a selected item in hover state in the button group.
-/// @param {Color} $item-selected-hover-border-color [null] - The border color for a selected item in hover state in the button group.
-/// @param {Color} $item-selected-focus-background [null] - The background color for a selected item in focused state in the button group.
-/// @param {Color} $item-selected-focus-hover-background [null] - The background color for a selected item in focused & hover state in the button group.
-///
-/// @param {Color} $disabled-selected-text-color [null] - The disabled text color for a selected item in the button group.
-/// @param {Color} $disabled-selected-icon-color [null] - The disabled icon color for a selected item in the button group.
-/// @param {Color} $disabled-selected-background [null] - The disabled background color for a selected item in the button group.
-/// @param {Color} $disabled-selected-border-color [null] - The disabled border color for a selected item from the button group.
-///
-/// @param {List} $border-radius [null] - The border radius used for button-group component.
-///
-/// @requires $light-material-schema
-///
-/// @example scss Change the background, text, and border colors
-///   $my-button-group-theme: button-group-theme(
-///     $item-text-color: white,
-///     $item-background: rgba(0, 0, 0, .8),
-///     $item-border-color: #dadada
-///   );
-///   // Pass the theme to the css-vars() mixin
-///   @include css-vars($my-button-group-theme);
-@function button-group-theme(
-    $schema: $light-material-schema,
-    $shadow: null,
-
-    $item-text-color: null,
-    $item-icon-color: $item-text-color,
-    $item-background: null,
-    $item-border-color: null,
-
-    $item-hover-text-color: null,
-    $item-hover-icon-color: $item-hover-text-color,
-    $item-hover-background: null,
-    $item-hover-border-color: null,
-
-    $item-focused-text-color: null,
-    $item-focused-border-color: null,
-    $item-focused-background: null,
-    $item-focused-hover-background: null,
-    $idle-shadow-color: null,
-    $selected-shadow-color: null,
-    $border-radius: null,
-
-    $disabled-text-color: null,
-    $disabled-background-color: null,
-    $item-disabled-border: null,
-
-    $item-selected-text-color: null,
-    $item-selected-icon-color: $item-selected-text-color,
-    $item-selected-background: null,
-    $item-selected-border-color: null,
-
-    $item-selected-hover-text-color: null,
-    $item-selected-hover-icon-color: $item-selected-hover-text-color,
-    $item-selected-hover-background: null,
-    $item-selected-hover-border-color: null,
-    $item-selected-focus-background: null,
-    $item-selected-focus-hover-background: null,
-
-    $disabled-selected-text-color: null,
-    $disabled-selected-icon-color: $disabled-selected-text-color,
-    $disabled-selected-background: null,
-    $disabled-selected-border-color: null,
-) {
-    $name: 'igx-button-group';
-    $selector: 'igx-buttongroup';
-    $button-group-schema: ();
-
-    @if map.has-key($schema, 'button-group') {
-        $button-group-schema: map.get($schema, 'button-group');
-    } @else {
-        $button-group-schema: $schema;
-    }
-
-    $theme: digest-schema($button-group-schema);
-
-    $border: rem(1px) solid map.get($theme, 'item-selected-border-color');
-
-    //background colors
-    @if not($item-hover-background) and $item-background {
-        $item-hover-background: hsl(from var(--item-background) h s calc(l * 0.9));
-    }
-
-    @if not($item-selected-background) and $item-background {
-        $item-selected-background: hsl(from var(--item-background) h s calc(l * 0.7));
-    }
-
-    @if not($item-selected-hover-background) and $item-selected-background {
-        $item-selected-hover-background: hsl(from var(--item-selected-background) h s calc(l * 1.1));
-    }
-
-    @if not($item-selected-focus-background) and $item-selected-background {
-        $item-selected-focus-background: var(--item-selected-background);
-    }
-
-    @if not($item-selected-focus-hover-background) and $item-selected-hover-background {
-        $item-selected-focus-hover-background: var(--item-selected-hover-background);
-    }
-
-    @if not($item-focused-background) and $item-background {
-        $item-focused-background: var(--item-hover-background);
-    }
-
-    @if not($item-focused-hover-background) and $item-hover-background {
-        $item-focused-hover-background: hsl(from var(--item-focused-background) h s calc(l * 0.9));
-    }
-
-    @if not($disabled-background-color) and $item-background {
-        $disabled-background-color: var(--item-background);
-    }
-
-    @if not($disabled-selected-background) and $item-selected-background {
-        $disabled-selected-background: rgba(gray, 0.3);
-    }
-
-    //border colors
-    @if not($item-border-color) and $item-background {
-        $item-border-color: hsl(from var(--item-background) h s calc(l * 0.8));
-    }
-
-    @if not($item-hover-border-color) and $item-border-color {
-        $item-hover-border-color: var(--item-border-color);
-    }
-
-    @if not($item-focused-border-color) and $item-border-color {
-        $item-focused-border-color: var(--item-border-color);
-    }
-
-    @if not($item-selected-border-color) and $item-border-color {
-        $item-selected-border-color: var(--item-border-color);
-    }
-
-    @if not($item-selected-hover-border-color) and $item-border-color {
-        $item-selected-hover-border-color: var(--item-border-color);
-    }
-
-    @if not($item-disabled-border) and $item-border-color {
-        $item-disabled-border: var(--item-border-color);
-    }
-
-    @if not($disabled-selected-border-color) and $item-border-color {
-        $disabled-selected-border-color: var(--item-border-color);
-    }
-
-    //text and icon colors
-    @if not($item-text-color) and $item-background {
-        $item-text-color: adaptive-contrast(var(--item-background));
-    }
-
-    @if not($item-icon-color) and $item-text-color {
-        $item-icon-color: var(--item-text-color);
-    }
-
-    @if not($item-hover-text-color) and $item-hover-background {
-        $item-hover-text-color: adaptive-contrast(var(--item-hover-background));
-    }
-
-    @if not($item-hover-icon-color) and $item-hover-text-color {
-        $item-hover-icon-color: var(--item-hover-text-color);
-    }
-
-    @if not($item-focused-text-color) and $item-focused-background {
-        $item-focused-text-color: adaptive-contrast(var(--item-focused-background));
-    }
-
-    @if not($item-selected-text-color) and $item-selected-background {
-        $item-selected-text-color: adaptive-contrast(var(--item-selected-background));
-    }
-
-    @if not($item-selected-icon-color) and $item-selected-text-color {
-        $item-selected-icon-color: var(--item-selected-text-color);
-    }
-
-    @if not($item-selected-hover-text-color) and $item-selected-hover-background {
-        $item-selected-hover-text-color: adaptive-contrast(var(--item-selected-hover-background));
-    }
-
-    @if not($item-selected-hover-icon-color) and $item-selected-hover-text-color {
-        $item-selected-hover-icon-color: var(--item-selected-hover-text-color);
-    }
-
-    @if not($disabled-text-color) and $disabled-background-color {
-        $disabled-text-color: hsla(from adaptive-contrast(var(--disabled-background-color)) h s l / 0.4);
-    }
-
-    @if not($disabled-selected-text-color) and $disabled-text-color {
-        $disabled-selected-text-color: var(--disabled-text-color);
-    }
-
-    @if not($idle-shadow-color) and $item-background {
-        $idle-shadow-color: hsla(from var(--item-background) h s l / .5);
-    }
-
-    @if not($idle-shadow-color) and $selected-shadow-color {
-        $idle-shadow-color: var(--selected-shadow-color);
-    }
-
-    @if not($selected-shadow-color) and $idle-shadow-color {
-        $selected-shadow-color: var(--idle-shadow-color);
-    }
-
-    @if map.get($button-group-schema, 'elevation') > 0 {
-        $border: none;
-    }
-
-    @if not($shadow) {
-        $elevation: map.get($button-group-schema, 'elevation');
-        $shadow: elevation($elevation);
-    }
-
-    @return extend($theme, (
-        name: $name,
-        selector: $selector,
-        item-text-color: $item-text-color,
-        item-icon-color: $item-icon-color,
-        item-background: $item-background,
-        item-border-color: $item-border-color,
-        item-focused-text-color: $item-focused-text-color,
-        item-focused-background: $item-focused-background,
-        item-focused-border-color: $item-focused-border-color,
-        item-focused-hover-background: $item-focused-hover-background,
-        border-radius: $border-radius,
-        item-hover-text-color: $item-hover-text-color,
-        item-hover-icon-color: $item-hover-icon-color,
-        item-hover-background: $item-hover-background,
-        item-hover-border-color: $item-hover-border-color,
-        disabled-text-color:$disabled-text-color,
-        disabled-background-color:$disabled-background-color,
-        item-disabled-border: $item-disabled-border,
-        item-selected-text-color: $item-selected-text-color,
-        item-selected-icon-color: $item-selected-icon-color,
-        item-selected-background: $item-selected-background,
-        item-selected-border-color: $item-selected-border-color,
-        item-selected-hover-text-color: $item-selected-hover-text-color,
-        item-selected-hover-icon-color: $item-selected-hover-icon-color,
-        item-selected-hover-background: $item-selected-hover-background,
-        item-selected-hover-border-color: $item-selected-hover-border-color,
-        item-selected-focus-background: $item-selected-focus-background,
-        item-selected-focus-hover-background: $item-selected-focus-hover-background,
-        disabled-selected-text-color: $disabled-selected-text-color,
-        disabled-selected-icon-color: $disabled-selected-icon-color,
-        disabled-selected-background: $disabled-selected-background,
-        disabled-selected-border-color: $disabled-selected-border-color,
-        border: $border,
-        shadow: $shadow,
-        idle-shadow-color: $idle-shadow-color,
-        selected-shadow-color: $selected-shadow-color
-    ));
-}
-
 /// @deprecated Use the `css-vars` mixin instead.
 /// @see {mixin} css-vars
 /// @param {Map} $theme - The theme used to style the component.