From 764beff39a35c3ff94ebecd8bc0ff1c3eb666ce8 Mon Sep 17 00:00:00 2001
From: Josh Black <josh@josh.black>
Date: Tue, 12 Jan 2021 16:46:34 -0600
Subject: [PATCH] feat(motion): add support for sass modules

---
 packages/motion/index.scss | 56 ++++++++++++++++++++++++++++++++++++++
 1 file changed, 56 insertions(+)
 create mode 100644 packages/motion/index.scss

diff --git a/packages/motion/index.scss b/packages/motion/index.scss
new file mode 100644
index 000000000000..4f51523f6d51
--- /dev/null
+++ b/packages/motion/index.scss
@@ -0,0 +1,56 @@
+//
+// Copyright IBM Corp. 2018, 2018
+//
+// This source code is licensed under the Apache-2.0 license found in the
+// LICENSE file in the root directory of this source tree.
+//
+
+@use 'sass:map';
+
+/// Common component easings
+/// @type Map
+/// @access public
+/// @group @carbon/motion
+$easings: (
+  standard: (
+    productive: cubic-bezier(0.2, 0, 0.38, 0.9),
+    expressive: cubic-bezier(0.4, 0.14, 0.3, 1),
+  ),
+  entrance: (
+    productive: cubic-bezier(0, 0, 0.38, 0.9),
+    expressive: cubic-bezier(0, 0, 0.3, 1),
+  ),
+  exit: (
+    productive: cubic-bezier(0.2, 0, 1, 0.9),
+    expressive: cubic-bezier(0.4, 0.14, 1, 1),
+  ),
+);
+
+/// Get the transition-timing-function for a given easing and motion mode
+/// @param {String} $name - Can be `standard`, `entrance`, or `exit`
+/// @param {String} $mode [productive] - Can be `productive` or `expressive`
+/// @param {Map} $easings [$carbon--easings] - Easings map
+/// @access public
+/// @group @carbon/motion
+/// @return {Function} CSS `cubic-bezier()` function
+@function motion($name, $mode: productive, $easings: $easings) {
+  @if map.has-key($easings, $name) {
+    $easing: map.get($easings, $name);
+    @if map.has-key($easing, $mode) {
+      @return map.get($easing, $mode);
+    } @else {
+      @error 'Unable to find a mode for the easing #{$easing} called: #{$mode}.';
+    }
+  } @else {
+    @error 'Unable to find an easing named #{$name} in our supported easings.';
+  }
+}
+
+/// Set the transition-timing-function for a given easing and motion mode
+/// @param {String} $name - The name of the easing curve to apply
+/// @param {String} $mode - The mode for the easing curve to use
+/// @access public
+/// @group @carbon/motion
+@mixin motion($name, $mode) {
+  transition-timing-function: motion($name, $mode);
+}