diff --git a/packages/elements/src/__tests__/__snapshots__/PublicAPI-test.js.snap b/packages/elements/src/__tests__/__snapshots__/PublicAPI-test.js.snap index 2e64e18ff0b9..6df53f6619e1 100644 --- a/packages/elements/src/__tests__/__snapshots__/PublicAPI-test.js.snap +++ b/packages/elements/src/__tests__/__snapshots__/PublicAPI-test.js.snap @@ -87,6 +87,8 @@ Array [ "expressiveHeading05", "expressiveHeading06", "expressiveParagraph01", + "fast01", + "fast02", "field01", "field02", "fluid", @@ -184,6 +186,8 @@ Array [ "magenta90", "miniUnit", "miniUnits", + "moderate01", + "moderate02", "motion", "orange", "orange40", @@ -231,6 +235,8 @@ Array [ "selectedUI", "skeleton01", "skeleton02", + "slow01", + "slow02", "spacing", "spacing01", "spacing02", diff --git a/packages/motion/__tests__/__snapshots__/motion-test.js.snap b/packages/motion/__tests__/__snapshots__/motion-test.js.snap new file mode 100644 index 000000000000..793bd5fa4a91 --- /dev/null +++ b/packages/motion/__tests__/__snapshots__/motion-test.js.snap @@ -0,0 +1,47 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`@carbon/motion @carbon/motion/scss/motion.scss 1`] = ` +Array [ + "fast-01", + "fast-02", + "moderate-01", + "moderate-02", + "slow-01", + "slow-02", + "carbon--easings", +] +`; + +exports[`@carbon/motion Public API 1`] = ` +Object { + "easings": Object { + "entrance": Object { + "expressive": "cubic-bezier(0, 0, 0.3, 1)", + "productive": "cubic-bezier(0, 0, 0.38, 0.9)", + }, + "exit": Object { + "expressive": "cubic-bezier(0.4, 0.14, 1, 1)", + "productive": "cubic-bezier(0.2, 0, 1, 0.9)", + }, + "standard": Object { + "expressive": "cubic-bezier(0.4, 0.14, 0.3, 1)", + "productive": "cubic-bezier(0.2, 0, 0.38, 0.9)", + }, + }, + "fast01": "70ms", + "fast02": "110ms", + "moderate01": "150ms", + "moderate02": "240ms", + "motion": [Function], + "slow01": "400ms", + "slow02": "700ms", + "unstable_tokens": Array [ + "fast01", + "fast02", + "moderate01", + "moderate02", + "slow01", + "slow02", + ], +} +`; diff --git a/packages/motion/__tests__/motion-test.js b/packages/motion/__tests__/motion-test.js new file mode 100644 index 000000000000..c6d653f6ecf7 --- /dev/null +++ b/packages/motion/__tests__/motion-test.js @@ -0,0 +1,30 @@ +/** + * 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. + * + * @jest-environment node + */ + +import { SassRenderer } from '@carbon/test-utils/scss'; +import * as CarbonMotion from '../src'; + +const { render } = SassRenderer.create(__dirname); + +describe('@carbon/motion', () => { + test('Public API', () => { + expect(CarbonMotion).toMatchSnapshot(); + }); + + test('@carbon/motion/scss/motion.scss', async () => { + const { getValue } = await render(` + @use 'sass:meta'; + @use '../scss/motion'; + + $_: get-value(meta.module-variables('motion')); + `); + const variables = getValue(0); + expect(Object.keys(variables)).toMatchSnapshot(); + }); +}); diff --git a/packages/motion/scss/motion.scss b/packages/motion/scss/motion.scss index f4d215b422e5..eddd8c5891ca 100644 --- a/packages/motion/scss/motion.scss +++ b/packages/motion/scss/motion.scss @@ -5,6 +5,30 @@ // LICENSE file in the root directory of this source tree. // +/// @access public +/// @group @carbon/motion +$fast-01: 70ms !default; + +/// @access public +/// @group @carbon/motion +$fast-02: 110ms !default; + +/// @access public +/// @group @carbon/motion +$moderate-01: 150ms !default; + +/// @access public +/// @group @carbon/motion +$moderate-02: 240ms !default; + +/// @access public +/// @group @carbon/motion +$slow-01: 400ms !default; + +/// @access public +/// @group @carbon/motion +$slow-02: 700ms !default; + /// Common component easings /// @type Map /// @access public diff --git a/packages/motion/src/index.js b/packages/motion/src/index.js index c028e345fa7f..0e4839cfd149 100644 --- a/packages/motion/src/index.js +++ b/packages/motion/src/index.js @@ -5,6 +5,22 @@ * LICENSE file in the root directory of this source tree. */ +export const fast01 = '70ms'; +export const fast02 = '110ms'; +export const moderate01 = '150ms'; +export const moderate02 = '240ms'; +export const slow01 = '400ms'; +export const slow02 = '700ms'; + +export const unstable_tokens = [ + 'fast01', + 'fast02', + 'moderate01', + 'moderate02', + 'slow01', + 'slow02', +]; + export const easings = { standard: { productive: 'cubic-bezier(0.2, 0, 0.38, 0.9)', diff --git a/packages/react/src/components/DataTable/TableBatchActions.js b/packages/react/src/components/DataTable/TableBatchActions.js index 566a06d3830b..5839edd24fdc 100644 --- a/packages/react/src/components/DataTable/TableBatchActions.js +++ b/packages/react/src/components/DataTable/TableBatchActions.js @@ -45,7 +45,10 @@ const TableBatchActions = ({ ); return ( -
+

diff --git a/packages/react/src/components/DataTable/__tests__/__snapshots__/DataTable-test.js.snap b/packages/react/src/components/DataTable/__tests__/__snapshots__/DataTable-test.js.snap index d84336c1a497..7a087e7d6fb7 100644 --- a/packages/react/src/components/DataTable/__tests__/__snapshots__/DataTable-test.js.snap +++ b/packages/react/src/components/DataTable/__tests__/__snapshots__/DataTable-test.js.snap @@ -2016,6 +2016,7 @@ exports[`DataTable should render 1`] = ` translateWithId={[Function]} >