@workday/canvas-kit-react 7.0.0-alpha.0-next.1 → 7.0.0-alpha.0-next.6

package/badge/lib/CountBadge.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import {keyframes} from '@emotion/core';
+import {keyframes} from '@emotion/react';
 import styled from '@emotion/styled';
 import {borderRadius, colors, fontFamily} from '@workday/canvas-kit-react/tokens';
 

package/banner/lib/Banner.tsx

@@ -1,5 +1,6 @@
+/** @jsxRuntime classic */
 /** @jsx jsx */
-import {jsx} from '@emotion/core';
+import {jsx} from '@emotion/react';
 import * as React from 'react';
 
 import {borderRadius, CSSProperties, space, type} from '@workday/canvas-kit-react/tokens';

package/banner/lib/BannerActionText.tsx

@@ -1,10 +1,13 @@
-/** @jsx jsx */
-import {jsx} from '@emotion/core';
 import * as React from 'react';
 
-import {ExtractProps, createComponent, useModelContext} from '@workday/canvas-kit-react/common';
+import {
+  ExtractProps,
+  createComponent,
+  useModelContext,
+  styled,
+  StyledType,
+} from '@workday/canvas-kit-react/common';
 import {Box} from '@workday/canvas-kit-labs-react/common';
-import {CSSProperties} from '@workday/canvas-kit-react/tokens';
 
 import {BannerModelContext} from './Banner';
 import {BannerModel, useBannerActionText} from './hooks';
@@ -18,9 +21,9 @@ export interface BannerActionTextProps extends ExtractProps<typeof Box, never> {
   children?: React.ReactNode;
 }
 
-const styles: CSSProperties = {
+const StyledActionBarText = styled(Box.as('span'))<StyledType>({
   textDecoration: 'underline',
-};
+});
 
 export const BannerActionText = createComponent('span')({
   displayName: 'Banner.ActionTextText',
@@ -33,14 +36,14 @@ export const BannerActionText = createComponent('span')({
     const props = useBannerActionText(localModel, elemProps, ref);
 
     return (
-      <Box
+      <StyledActionBarText
         display={localModel.state.isSticky ? 'none' : 'inline'}
+        ref={ref}
         as={Element}
-        css={[styles]}
         {...props}
       >
         {children}
-      </Box>
+      </StyledActionBarText>
     );
   },
 });

package/banner/lib/BannerIcon.tsx

@@ -1,9 +1,11 @@
-/** @jsx jsx */
-import {jsx} from '@emotion/core';
-
-import {CSSProperties, space} from '@workday/canvas-kit-react/tokens';
-import {ExtractProps, createComponent, useModelContext} from '@workday/canvas-kit-react/common';
-import {useThemeRTL} from '@workday/canvas-kit-labs-react/common';
+import React from 'react';
+import {space} from '@workday/canvas-kit-react/tokens';
+import {
+  ExtractProps,
+  createComponent,
+  useModelContext,
+  styled,
+} from '@workday/canvas-kit-react/common';
 import {SystemIcon} from '@workday/canvas-kit-react/icon';
 import {exclamationTriangleIcon} from '@workday/canvas-system-icons-web';
 import {CanvasSystemIcon} from '@workday/design-assets-types';
@@ -20,21 +22,18 @@ export interface BannerIconProps extends Omit<ExtractProps<typeof SystemIcon, ne
   icon?: CanvasSystemIcon;
 }
 
-const styles: CSSProperties = {
+const StyledBannerIcon = styled(SystemIcon)({
   marginRight: space.xs,
-};
+});
 
 export const BannerIcon = createComponent('span')({
   displayName: 'Banner.Icon',
   Component: ({icon = exclamationTriangleIcon, model, ...elemProps}: BannerIconProps, ref) => {
-    const {themeRTL} = useThemeRTL();
     const localModel = useModelContext(BannerModelContext, model);
 
     // SystemIcon is still a class based component so we need to set ref manually.
     const {ref: iconRef, icon: defaultIcon, ...props} = useBannerIcon(localModel, elemProps, ref);
 
-    return (
-      <SystemIcon icon={icon ?? defaultIcon} iconRef={iconRef} css={themeRTL(styles)} {...props} />
-    );
+    return <StyledBannerIcon icon={icon ?? defaultIcon} iconRef={iconRef} {...props} />;
   },
 });

package/button/lib/TertiaryButton.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import {CSSObject} from '@emotion/core';
+import {CSSObject} from '@emotion/styled';
 import {
   focusRing,
   useTheme,

package/button/lib/ToolbarDropdownButton.tsx

@@ -1,5 +1,4 @@
-/** @jsx jsx */
-import {jsx} from '@emotion/core';
+import React from 'react';
 import {colors, space, borderRadius} from '@workday/canvas-kit-react/tokens';
 import {
   focusRing,

package/button/lib/parts/ButtonContainer.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import isPropValid from '@emotion/is-prop-valid';
-import {CSSObject} from '@emotion/core';
+import {CSSObject} from '@emotion/styled';
 import {borderRadius, space, spaceNumbers, type} from '@workday/canvas-kit-react/tokens';
 import {
   GrowthBehavior,
@@ -8,7 +8,6 @@ import {
   focusRing,
   styled,
   EmotionCanvasTheme,
-  StyledType,
 } from '@workday/canvas-kit-react/common';
 import {ButtonColors, ButtonSizes} from '../types';
 import {buttonLabelDataClassName} from './ButtonLabelData';
@@ -70,7 +69,7 @@ function getIconColorSelectors(
 
 export const ButtonContainer = styled('button', {
   shouldForwardProp: prop => isPropValid(prop) && prop !== 'size',
-})<ButtonContainerProps & StyledType>(
+})<ButtonContainerProps>(
   {
     ...type.levels.subtext.large,
     fontWeight: type.properties.fontWeights.bold,

package/button/lib/types.ts

@@ -1,4 +1,4 @@
-import {CSSObject} from '@emotion/core';
+import {CSSObject} from '@emotion/styled';
 
 /**
  * The object used for passing in colors to the ButtonContainer

package/card/lib/CardHeading.tsx

@@ -1,9 +1,10 @@
 import * as React from 'react';
 import styled from '@emotion/styled';
-import {type, space} from '@workday/canvas-kit-react/tokens';
+import {type} from '@workday/canvas-kit-react/tokens';
 import {StyledType, createComponent} from '@workday/canvas-kit-react/common';
+import {Box, BoxProps} from '@workday/canvas-kit-labs-react/common';
 
-export interface CardHeadingProps {
+export interface CardHeadingProps extends BoxProps {
   /**
    * The id of the Card heading. Tie this to an `aria-labelledby` for accessibility.
    */
@@ -12,17 +13,15 @@ export interface CardHeadingProps {
   children?: React.ReactNode;
 }
 
-const Heading = styled('h3')<StyledType>(type.levels.body.large, {
+const Heading = styled(Box.as('h3'))<StyledType>(type.levels.body.large, {
   fontWeight: type.properties.fontWeights.bold,
-  marginBottom: space.m,
-  marginTop: 0,
 });
 
 export const CardHeading = createComponent('h3')({
   displayName: 'Card.Heading',
   Component: ({children, ...elemProps}: CardHeadingProps, ref, Element) => {
     return (
-      <Heading ref={ref} as={Element} {...elemProps}>
+      <Heading ref={ref} marginBottom="m" marginTop={0} as={Element} {...elemProps}>
         {children}
       </Heading>
     );

package/common/lib/CanvasProvider.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import {ThemeProvider} from 'emotion-theming';
+import {Theme, ThemeProvider} from '@emotion/react';
 import {InputProvider} from './InputProvider';
 import {defaultCanvasTheme, PartialEmotionCanvasTheme} from './theming';
 
@@ -18,8 +18,9 @@ export class CanvasProvider extends React.Component<
 
   render() {
     const {children, theme, ...elemProps} = this.props;
+
     return (
-      <ThemeProvider theme={theme}>
+      <ThemeProvider theme={theme as Theme}>
         <InputProvider />
         <div
           dir={(theme.canvas && theme.canvas.direction) || defaultCanvasTheme.direction}

package/common/lib/genericStyles.ts

@@ -1,4 +1,4 @@
-import {CSSObject} from '@emotion/core';
+import {CSSObject} from '@emotion/styled';
 
 /**
  * Our schema for generic styles for a whole component.

package/common/lib/styles/errorRing.ts

@@ -1,6 +1,6 @@
 import {EmotionCanvasTheme} from '../theming/index';
 import {ErrorType} from '../types';
-import {CSSObject} from '@emotion/core';
+import {CSSObject} from '@emotion/styled';
 import {colors, inputColors} from '@workday/canvas-kit-react/tokens';
 import chroma from 'chroma-js';
 

package/common/lib/styles/focusRing.ts

@@ -1,6 +1,6 @@
-import {keyframes, CSSObject} from '@emotion/core';
+import {keyframes, Theme, CSSObject} from '@emotion/react';
 import canvas from '@workday/canvas-kit-react/tokens';
-import {EmotionCanvasTheme, defaultCanvasTheme} from '../theming/index';
+import {defaultCanvasTheme} from '../theming/index';
 import memoize from 'lodash/memoize';
 
 interface FocusRingOptions {
@@ -87,7 +87,7 @@ export const memoizedFocusRing = memoize(calculateFocusRing, (...args) => JSON.s
  *
  * @returns {CSSObject} the css object for the focus ring style
  */
-export function focusRing(options: FocusRingOptions = {}, theme?: EmotionCanvasTheme): CSSObject {
+export function focusRing(options: FocusRingOptions = {}, theme?: Theme): CSSObject {
   const {
     width = 2,
     separation = 0,

package/common/lib/styles/hideMouseFocus.ts

@@ -1,4 +1,4 @@
-import {Interpolation} from '@emotion/core';
+import {Interpolation} from '@emotion/react';
 import {CSSProperties} from '@workday/canvas-kit-react/tokens';
 
 /**
@@ -26,9 +26,9 @@ export const hideMouseFocus: CSSProperties = {
    },
  */
 export const mouseFocusBehavior = (
-  selectors: Record<string, Interpolation>
-): Record<string, Interpolation> => {
-  const output: Record<string, Interpolation> = {};
+  selectors: Record<string, Interpolation<any>>
+): Record<string, Interpolation<any>> => {
+  const output: Record<string, Interpolation<any>> = {};
 
   Object.keys(selectors).map((selector, index) => {
     selector.split(',').forEach(selectorPart => {

package/common/lib/theming/styled.ts

@@ -1,4 +1,5 @@
 import {default as emotionStyled, CreateStyled, Interpolation, CSSObject} from '@emotion/styled';
+
 import {useTheme, EmotionCanvasTheme, ContentDirection} from './index';
 import rtlCSSJS from 'rtl-css-js';
 import {convertToStaticStates} from '../utils/StaticStates';
@@ -16,7 +17,6 @@ function styled<Props>(node: any) {
         const direction = props.theme.canvas.direction;
         const maybeFlip = direction === ContentDirection.RTL ? rtlCSSJS : noop;
         const maybeConvert = props.theme._staticStates ? convertToStaticStates : noop;
-
         try {
           if (typeof interpolation === 'function') {
             return maybeFlip(maybeConvert(interpolation(props)) as CSSObject);
@@ -32,4 +32,4 @@ function styled<Props>(node: any) {
   };
 }
 
-export default styled as CreateStyled<EmotionCanvasTheme>;
+export default styled as CreateStyled;

package/common/lib/theming/types.ts

@@ -3,6 +3,7 @@ import {CanvasBreakpoints, BreakpointFnParam} from './breakpoints';
 /**
  * A single palette within a Canvas theme
  */
+
 export type CanvasThemePalette = {
   lightest: string;
   light: string;
@@ -27,6 +28,7 @@ export enum ContentDirection {
 /**
  * The format of a Canvas theme for components that support it.
  */
+
 export interface CanvasTheme {
   palette: {
     common: CanvasThemeCommonPalette;
@@ -253,4 +255,9 @@ type RecursivePartial<T> = {
 export type PartialCanvasTheme = RecursivePartial<CanvasTheme>;
 export type PartialCanvasThemePalette = RecursivePartial<CanvasThemePalette>;
 export type PartialEmotionCanvasTheme = {canvas?: PartialCanvasTheme};
+declare module '@emotion/react' {
+  export interface Theme {
+    canvas: CanvasTheme;
+  }
+}
 export type EmotionCanvasTheme = {canvas: CanvasTheme};

package/common/lib/theming/useIsRTL.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import {ThemeContext} from '@emotion/core';
+import {ThemeContext} from '@emotion/react';
 import {EmotionCanvasTheme, ContentDirection, PartialEmotionCanvasTheme} from './types';
 
 function useDefaultTheme<T, C>(theme: T | undefined, config: C, fn: (config: C) => T) {

package/common/lib/theming/useTheme.ts

@@ -1,6 +1,5 @@
-import * as React from 'react';
 import get from 'lodash/get';
-import {ThemeContext} from '@emotion/core';
+import {useTheme as useEmotionTheme} from '@emotion/react';
 import {
   defaultCanvasTheme,
   createCanvasTheme,
@@ -38,7 +37,7 @@ export function useTheme(theme?: PartialEmotionCanvasTheme): EmotionCanvasTheme
 
   try {
     // eslint-disable-next-line react-hooks/rules-of-hooks
-    const contextTheme = React.useContext(ThemeContext) as EmotionCanvasTheme;
+    const contextTheme = useEmotionTheme() as EmotionCanvasTheme;
     if (contextTheme && contextTheme.canvas) {
       return getFilledTheme(contextTheme);
     }

package/common/lib/utils/components.ts

@@ -4,7 +4,6 @@ import {Model} from './models';
 
 /**
  * Adds the `as` to the style interface to support `as` in styled components
- * This type and usage should be removed with Emotion 11
  */
 export type StyledType = {
   as?: React.ElementType;
@@ -143,7 +142,7 @@ export type Component<P> = {
 
 interface RefForwardingComponent<T, P = {}> {
   (
-    props: React.PropsWithChildren<P> & {as?: React.ReactElement<any>},
+    props: React.PropsWithChildren<P> & {as?: React.ElementType},
     /**
      * A ref to be forwarded. Pass it along to the root element. If no element was passed, this
      * will result in a `never`

package/common/lib/utils/index.ts

@@ -10,6 +10,7 @@ export * from './useMount';
 export * from './components';
 export * from './models';
 export * from './elements';
+export * from './useConstant';
 export * from './useIsFullscreen';
 export * from './useWindowSize';
 export * from './useResizeObserver';

package/common/lib/utils/useMount.ts

@@ -5,6 +5,8 @@ import React from 'react';
  * Avoids the React lint errors and encodes intent.
  */
 export const useMount = (callback: () => (() => void) | void) => {
+  // we only want this to be called once
+  // eslint-disable-next-line react-hooks/exhaustive-deps
   React.useEffect(callback, []);
 };
 
@@ -13,5 +15,7 @@ export const useMount = (callback: () => (() => void) | void) => {
  * Avoids the React lint errors and encodes intent.
  */
 export const useMountLayout = (callback: () => (() => void) | void) => {
+  // we only want this to be called once
+  // eslint-disable-next-line react-hooks/exhaustive-deps
   React.useLayoutEffect(callback, []);
 };

package/dist/commonjs/action-bar/index.js

@@ -1,6 +1,13 @@
 "use strict";
-function __export(m) {
-    for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
-}
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-__export(require("./lib/ActionBar"));
+__exportStar(require("./lib/ActionBar"), exports);

package/dist/commonjs/action-bar/lib/ActionBar.js

@@ -10,14 +10,27 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
-    result["default"] = mod;
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.ActionBar = void 0;
 var React = __importStar(require("react"));
 var common_1 = require("@workday/canvas-kit-react/common");
 var tokens_1 = require("@workday/canvas-kit-react/tokens");

package/dist/commonjs/avatar/index.js

@@ -1,12 +1,20 @@
 "use strict";
-function __export(m) {
-    for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
-}
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.Avatar = void 0;
 var Avatar_1 = __importDefault(require("./lib/Avatar"));
 exports.Avatar = Avatar_1.default;
 exports.default = Avatar_1.default;
-__export(require("./lib/Avatar"));
+__exportStar(require("./lib/Avatar"), exports);

package/dist/commonjs/avatar/lib/Avatar.js

@@ -10,6 +10,25 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -21,17 +40,11 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
-    result["default"] = mod;
-    return result;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.AvatarVariant = void 0;
 var react_1 = __importStar(require("react"));
 var common_1 = require("@workday/canvas-kit-react/common");
 var is_prop_valid_1 = __importDefault(require("@emotion/is-prop-valid"));

package/dist/commonjs/badge/index.js

@@ -1,4 +1,8 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.CountBadge = void 0;
 var CountBadge_1 = require("./lib/CountBadge");
-exports.CountBadge = CountBadge_1.default;
+Object.defineProperty(exports, "CountBadge", { enumerable: true, get: function () { return __importDefault(CountBadge_1).default; } });

package/dist/commonjs/badge/lib/CountBadge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CountBadge.d.ts","sourceRoot":"","sources":["../../../../badge/lib/CountBadge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,MAAM,WAAW,eAAgB,SAAQ,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;IAC5E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CACjC;AA8CD,QAAA,MAAM,UAAU,yCAUf,CAAC;AAEF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"CountBadge.d.ts","sourceRoot":"","sources":["../../../../badge/lib/CountBadge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,MAAM,WAAW,eAAgB,SAAQ,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;IAC5E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CACjC;AA8CD,QAAA,MAAM,UAAU,UAAW,eAAe,gBAUzC,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/commonjs/badge/lib/CountBadge.js

@@ -14,6 +14,25 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -25,19 +44,12 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
-    result["default"] = mod;
-    return result;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var React = __importStar(require("react"));
-var core_1 = require("@emotion/core");
+var react_1 = require("@emotion/react");
 var styled_1 = __importDefault(require("@emotion/styled"));
 var tokens_1 = require("@workday/canvas-kit-react/tokens");
 var variants = {
@@ -52,7 +64,7 @@ var variants = {
         color: tokens_1.colors.blueberry400,
     },
 };
-var grow = core_1.keyframes(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  from {\n    transform: scale(0.85);\n  }\n\n  to {\n    transform: scale(1.0);\n  }\n"], ["\n  from {\n    transform: scale(0.85);\n  }\n\n  to {\n    transform: scale(1.0);\n  }\n"])));
+var grow = react_1.keyframes(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  from {\n    transform: scale(0.85);\n  }\n\n  to {\n    transform: scale(1.0);\n  }\n"], ["\n  from {\n    transform: scale(0.85);\n  }\n\n  to {\n    transform: scale(1.0);\n  }\n"])));
 var Container = styled_1.default('span')({
     alignItems: 'center',
     animation: grow + " 0.2s ease",

package/dist/commonjs/banner/index.js

@@ -1,7 +1,14 @@
 "use strict";
-function __export(m) {
-    for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
-}
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-__export(require("./lib/Banner"));
-__export(require("./lib/hooks/"));
+__exportStar(require("./lib/Banner"), exports);
+__exportStar(require("./lib/hooks/"), exports);

package/dist/commonjs/banner/lib/Banner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../../../banner/lib/Banner.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAEL,YAAY,EAKb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,IAAI,EAAC,MAAM,uCAAuC,CAAC;AAE3D,OAAO,EAAC,WAAW,EAAE,iBAAiB,EAA8C,MAAM,SAAS,CAAC;AAMpG,eAAO,MAAM,kBAAkB;;;;OAA8C,CAAC;AAE9E,MAAM,WAAW,WAAY,SAAQ,iBAAiB,EAAE,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC;IACtF,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAkBD,eAAO,MAAM,MAAM;;;;CAqDjB,CAAC"}
+{"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../../../banner/lib/Banner.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAEL,YAAY,EAKb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,IAAI,EAAC,MAAM,uCAAuC,CAAC;AAE3D,OAAO,EAAC,WAAW,EAAE,iBAAiB,EAA8C,MAAM,SAAS,CAAC;AAMpG,eAAO,MAAM,kBAAkB;;;;OAA8C,CAAC;AAE9E,MAAM,WAAW,WAAY,SAAQ,iBAAiB,EAAE,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC;IACtF,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAkBD,eAAO,MAAM,MAAM;;;;CAqDjB,CAAC"}