From c18b0212df7d4bf985ecb071d6e928c83e0b4b90 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tobias=20H=C3=B8egh?= <tobias@tujo.no>
Date: Wed, 14 Sep 2022 13:23:55 +0200
Subject: [PATCH] feat(Easing): expose default CSS easing with --easing-default
 (#1562)

---
 .../src/docs/uilib/helpers/classes.md                | 12 ++++++++++++
 .../style/core/helper-classes/helper-classes.scss    |  4 ++++
 2 files changed, 16 insertions(+)

diff --git a/packages/dnb-design-system-portal/src/docs/uilib/helpers/classes.md b/packages/dnb-design-system-portal/src/docs/uilib/helpers/classes.md
index de86f96a456..311587df769 100644
--- a/packages/dnb-design-system-portal/src/docs/uilib/helpers/classes.md
+++ b/packages/dnb-design-system-portal/src/docs/uilib/helpers/classes.md
@@ -16,6 +16,18 @@ import SkipLinkExample from 'Docs/uilib/usage/accessibility/examples/skip-link-e
 
 Reusing classes in the markup instead of using SCSS extends or _mixins_ will prevent duplication in the `@dnb/eufemia`. So also your application will have good benefits from reusing these helper classes.
 
+## Easing
+
+`var(--easing-default)`
+
+You can use the internal Eufemia easing function.
+
+```css
+.animation-element {
+  transition: transform 1s var(--easing-default);
+}
+```
+
 ## Core style
 
 `dnb-core-style`
diff --git a/packages/dnb-eufemia/src/style/core/helper-classes/helper-classes.scss b/packages/dnb-eufemia/src/style/core/helper-classes/helper-classes.scss
index 5576dcbd4ee..926deae8cb6 100644
--- a/packages/dnb-eufemia/src/style/core/helper-classes/helper-classes.scss
+++ b/packages/dnb-eufemia/src/style/core/helper-classes/helper-classes.scss
@@ -3,6 +3,10 @@
  *
  */
 
+:root {
+  --easing-default: #{$defaultEasing};
+}
+
 // Focus management
 .dnb-no-focus {
   outline: none;