// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
// See LICENSE in the project root for license information.

// ---------------------------------------------------------------------

@use 'libSupport/deprecated';
// Animation defaults are provided by the design-tokens package. Under the module
// system they must be loaded explicitly rather than relying on a consumer-injected
// global `@import` of the token stylesheet.
@use '@aurodesignsystem/design-tokens/dist/legacy/auro-classic/SCSSVariables' as tokens;

/// Provides a way to control animation speed when changing CSS properties.
///
/// Defaults are set by baseline Design Tokens
///
/// Compatibility: [css-transitions](https://caniuse.com/#feat=css-transitions)
///
/// @group Animation
/// @param {string} $property [$ds-animation-default-property] - Specifies the name of the CSS property the transition effect is for
/// @param {string} $duration [$ds-animation-default-duration] - Specifies how many seconds or milliseconds a transition effect takes to complete
/// @param {string} $timing [$ds-animation-default-timing] - Specifies the speed curve of the transition effect (ease, linear, ease-in, ease-out, ease-in-out)
/// @param {string} $delay [null] - Specifies a delay (in seconds) for the transition effect
///
/// @example scss - import file
///   @use "./node_modules/@aurodesignsystem/webcorestylesheets/dist/animation" as *;
///
/// @example scss - Using mixin with default values;
///   .foo {
///     @include auro_transition;
///   }

@mixin auro_transition($property: tokens.$ds-animation-default-property, $duration: tokens.$ds-animation-default-duration, $timing: tokens.$ds-animation-default-timing, $delay: null) {
  transition: $property $duration $timing $delay;
}
