@workday/canvas-kit-react 9.0.0-alpha.368-next.6 → 9.0.0-alpha.382-next.2

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

@@ -1,15 +1,4 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    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]; } });
@@ -34,24 +23,24 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ActionBarOverflowButton = exports.useActionBarOverflowButton = void 0;
-var React = __importStar(require("react"));
-var styled_1 = __importDefault(require("@emotion/styled"));
-var canvas_system_icons_web_1 = require("@workday/canvas-system-icons-web");
-var common_1 = require("@workday/canvas-kit-react/common");
-var collection_1 = require("@workday/canvas-kit-react/collection");
-var menu_1 = require("@workday/canvas-kit-react/menu");
-var useActionBarModel_1 = require("./useActionBarModel");
-var button_1 = require("@workday/canvas-kit-react/button");
-var StyledSecondaryButton = styled_1.default(button_1.SecondaryButton)({
+const React = __importStar(require("react"));
+const styled_1 = __importDefault(require("@emotion/styled"));
+const canvas_system_icons_web_1 = require("@workday/canvas-system-icons-web");
+const common_1 = require("@workday/canvas-kit-react/common");
+const collection_1 = require("@workday/canvas-kit-react/collection");
+const menu_1 = require("@workday/canvas-kit-react/menu");
+const useActionBarModel_1 = require("./useActionBarModel");
+const button_1 = require("@workday/canvas-kit-react/button");
+const StyledSecondaryButton = styled_1.default(button_1.SecondaryButton)({
     flex: 0,
 });
-exports.useActionBarOverflowButton = common_1.composeHooks(common_1.createElemPropsHook(useActionBarModel_1.useActionBarModel)(function () { return ({
+exports.useActionBarOverflowButton = common_1.composeHooks(common_1.createElemPropsHook(useActionBarModel_1.useActionBarModel)(() => ({
     'aria-haspopup': true,
-}); }), collection_1.useOverflowListTarget, common_1.createSubModelElemPropsHook(useActionBarModel_1.useActionBarModel)(function (m) { return m.menu; }, menu_1.useMenuTarget));
+})), collection_1.useOverflowListTarget, common_1.createSubModelElemPropsHook(useActionBarModel_1.useActionBarModel)(m => m.menu, menu_1.useMenuTarget));
 exports.ActionBarOverflowButton = common_1.createSubcomponent('button')({
     displayName: 'ActionBar.OverflowButton',
     modelHook: useActionBarModel_1.useActionBarModel,
     elemPropsHook: exports.useActionBarOverflowButton,
-})(function (elemProps, Element) {
-    return React.createElement(StyledSecondaryButton, __assign({ as: Element, icon: canvas_system_icons_web_1.relatedActionsIcon }, elemProps));
+})((elemProps, Element) => {
+    return React.createElement(StyledSecondaryButton, Object.assign({ as: Element, icon: canvas_system_icons_web_1.relatedActionsIcon }, elemProps));
 });

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

@@ -1,49 +1,41 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useActionBarModel = void 0;
-var react_1 = __importDefault(require("react"));
-var common_1 = require("@workday/canvas-kit-react/common");
-var collection_1 = require("@workday/canvas-kit-react/collection");
-var menu_1 = require("@workday/canvas-kit-react/menu");
+const react_1 = __importDefault(require("react"));
+const common_1 = require("@workday/canvas-kit-react/common");
+const collection_1 = require("@workday/canvas-kit-react/collection");
+const menu_1 = require("@workday/canvas-kit-react/menu");
 exports.useActionBarModel = common_1.createModelHook({
-    defaultConfig: __assign(__assign({}, collection_1.useOverflowListModel.defaultConfig), { 
+    defaultConfig: {
+        ...collection_1.useOverflowListModel.defaultConfig,
         /**
          * Optional id for the whole `ActionBar` group. If not provided, a unique id will be created.
          * @default useUniqueId()
          */
-        id: '', 
+        id: '',
         /**
          * The default ActionBar sub-components only handle rendering of button group in a horizontal orientation,
          * but the sub-components could be replaced to handle vertical orientations.
          * @default 'horizontal'
          */
-        orientation: 'horizontal', menuConfig: {} }),
+        orientation: 'horizontal',
+        menuConfig: {},
+    },
     requiredConfig: collection_1.useOverflowListModel.requiredConfig,
-})(function (config) {
-    var getId = config.getId || collection_1.defaultGetId;
-    var items = config.items;
-    var model = collection_1.useOverflowListModel(collection_1.useOverflowListModel.mergeConfig(config, {
+})(config => {
+    const getId = config.getId || collection_1.defaultGetId;
+    const items = config.items;
+    const model = collection_1.useOverflowListModel(collection_1.useOverflowListModel.mergeConfig(config, {
         orientation: config.orientation || 'horizontal',
-        items: items,
+        items,
         shouldVirtualize: false,
     }));
-    var hiddenIds = model.state.hiddenIds;
-    var nonInteractiveIds = model.state.nonInteractiveIds;
-    var totalSize = model.state.items.length;
+    let hiddenIds = model.state.hiddenIds;
+    let nonInteractiveIds = model.state.nonInteractiveIds;
+    const totalSize = model.state.items.length;
     // Only show a maximum of 3 buttons
     if (totalSize - hiddenIds.length >= 3) {
         hiddenIds = items.slice(3, totalSize).map(getId);
@@ -53,25 +45,34 @@ exports.useActionBarModel = common_1.createModelHook({
         hiddenIds = items.slice(1, totalSize).map(getId);
     }
     nonInteractiveIds = hiddenIds;
-    var state = __assign(__assign({}, model.state), { hiddenIds: hiddenIds,
-        nonInteractiveIds: nonInteractiveIds, orientation: config.orientation || 'horizontal' });
-    var overflowItems = react_1.default.useMemo(function () { return (items ? items.filter(function (item) { return state.hiddenIds.includes(getId(item)); }) : undefined); }, 
+    const state = {
+        ...model.state,
+        hiddenIds,
+        nonInteractiveIds,
+        orientation: config.orientation || 'horizontal',
+    };
+    const overflowItems = react_1.default.useMemo(() => (items ? items.filter(item => state.hiddenIds.includes(getId(item))) : undefined), 
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [state.hiddenIds, items]);
-    var events = __assign({}, model.events);
-    var menu = menu_1.useMenuModel(menu_1.useMenuModel.mergeConfig(config.menuConfig, {
-        id: "act-bar-menu-" + model.state.id,
+    const events = {
+        ...model.events,
+    };
+    const menu = menu_1.useMenuModel(menu_1.useMenuModel.mergeConfig(config.menuConfig, {
+        id: `act-bar-menu-${model.state.id}`,
         items: overflowItems,
-        nonInteractiveIds: state.nonInteractiveIds.filter(function (key) { return !state.hiddenIds.includes(key); }),
-        onSelect: function () {
+        nonInteractiveIds: state.nonInteractiveIds.filter(key => !state.hiddenIds.includes(key)),
+        onSelect() {
             menu.events.hide();
         },
-        onShow: function () {
+        onShow() {
             // Always select the first item when the menu is opened
             menu.events.goToFirst();
         },
     }));
-    return __assign(__assign({}, model), { state: state,
-        events: events,
-        menu: menu });
+    return {
+        ...model,
+        state,
+        events,
+        menu,
+    };
 });

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

@@ -1,15 +1,4 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    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]; } });
@@ -29,93 +18,82 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __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)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Avatar = 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"));
-var tokens_1 = require("@workday/canvas-kit-react/tokens");
-var icon_1 = require("@workday/canvas-kit-react/icon");
-var canvas_system_icons_web_1 = require("@workday/canvas-system-icons-web");
+const react_1 = __importStar(require("react"));
+const common_1 = require("@workday/canvas-kit-react/common");
+const is_prop_valid_1 = __importDefault(require("@emotion/is-prop-valid"));
+const tokens_1 = require("@workday/canvas-kit-react/tokens");
+const icon_1 = require("@workday/canvas-kit-react/icon");
+const canvas_system_icons_web_1 = require("@workday/canvas-system-icons-web");
 var AvatarVariant;
 (function (AvatarVariant) {
     AvatarVariant[AvatarVariant["Light"] = 0] = "Light";
     AvatarVariant[AvatarVariant["Dark"] = 1] = "Dark";
 })(AvatarVariant = exports.AvatarVariant || (exports.AvatarVariant = {}));
-var fadeTransition = 'opacity 150ms linear';
-var StyledContainer = common_1.styled('button', {
-    shouldForwardProp: function (prop) { return is_prop_valid_1.default(prop) && prop !== 'size'; },
-})(__assign({ background: tokens_1.colors.soap200, position: 'relative', display: 'flex', alignItems: 'center', justifyContent: 'center', padding: 0, border: 0, boxSizing: 'border-box', overflow: 'hidden', borderRadius: tokens_1.borderRadius.circle, '&:not([disabled])': {
-        '&:focus': __assign({ outline: 'none' }, common_1.focusRing({ separation: 2 })),
-    } }, common_1.hideMouseFocus), function (_a) {
-    var size = _a.size;
-    return ({
-        height: size,
-        width: size,
-    });
-}, function (_a) {
-    var onClick = _a.onClick;
-    return ({
-        cursor: onClick ? 'pointer' : 'default',
-    });
-});
-var StyledStack = common_1.styled('span')({
+const fadeTransition = 'opacity 150ms linear';
+const StyledContainer = common_1.styled('button', {
+    shouldForwardProp: prop => is_prop_valid_1.default(prop) && prop !== 'size',
+})({
+    background: tokens_1.colors.soap200,
+    position: 'relative',
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    padding: 0,
+    border: 0,
+    boxSizing: 'border-box',
+    overflow: 'hidden',
+    borderRadius: tokens_1.borderRadius.circle,
+    '&:not([disabled])': {
+        '&:focus': {
+            outline: 'none',
+            ...common_1.focusRing({ separation: 2 }),
+        },
+    },
+    ...common_1.hideMouseFocus,
+}, ({ size }) => ({
+    height: size,
+    width: size,
+}), ({ onClick }) => ({
+    cursor: onClick ? 'pointer' : 'default',
+}));
+const StyledStack = common_1.styled('span')({
     position: 'absolute',
     top: 0,
     left: 0,
-}, function (_a) {
-    var size = _a.size;
-    return ({
-        height: size,
-        width: size,
-    });
-});
-var StyledIcon = common_1.styled(icon_1.SystemIconCircle)({
+}, ({ size }) => ({
+    height: size,
+    width: size,
+}));
+const StyledIcon = common_1.styled(icon_1.SystemIconCircle)({
     transition: fadeTransition,
-}, function (_a) {
-    var isImageLoaded = _a.isImageLoaded;
-    return ({
-        opacity: isImageLoaded ? 0 : 1,
-    });
-});
-var StyledImage = common_1.styled('img')({
+}, ({ isImageLoaded }) => ({
+    opacity: isImageLoaded ? 0 : 1,
+}));
+const StyledImage = common_1.styled('img')({
     width: '100%',
     height: '100%',
     borderRadius: tokens_1.borderRadius.circle,
     transition: fadeTransition,
-}, function (_a) {
-    var isLoaded = _a.isLoaded;
-    return ({
-        opacity: isLoaded ? 1 : 0,
-    });
-});
-exports.Avatar = react_1.default.forwardRef(function (_a, ref) {
-    var _b = _a.variant, variant = _b === void 0 ? AvatarVariant.Light : _b, _c = _a.size, size = _c === void 0 ? icon_1.SystemIconCircleSize.m : _c, _d = _a.altText, altText = _d === void 0 ? 'Avatar' : _d, url = _a.url, onClick = _a.onClick, elemProps = __rest(_a, ["variant", "size", "altText", "url", "onClick"]);
-    var _e = react_1.useState(false), imageLoaded = _e[0], setImageLoaded = _e[1];
-    var loadImage = function () {
+}, ({ isLoaded }) => ({
+    opacity: isLoaded ? 1 : 0,
+}));
+exports.Avatar = react_1.default.forwardRef(({ variant = AvatarVariant.Light, size = icon_1.SystemIconCircleSize.m, altText = 'Avatar', url, onClick, ...elemProps }, ref) => {
+    const [imageLoaded, setImageLoaded] = react_1.useState(false);
+    const loadImage = () => {
         if (!imageLoaded) {
             setImageLoaded(true);
         }
     };
-    react_1.default.useLayoutEffect(function () {
+    react_1.default.useLayoutEffect(() => {
         setImageLoaded(false);
     }, [url]);
-    var background = variant === AvatarVariant.Dark ? tokens_1.colors.blueberry400 : tokens_1.colors.soap300;
-    return (react_1.default.createElement(StyledContainer, __assign({ size: size, "aria-label": altText, onClick: onClick, disabled: onClick ? false : true, ref: ref }, elemProps),
+    const background = variant === AvatarVariant.Dark ? tokens_1.colors.blueberry400 : tokens_1.colors.soap300;
+    return (react_1.default.createElement(StyledContainer, Object.assign({ size: size, "aria-label": altText, onClick: onClick, disabled: onClick ? false : true, ref: ref }, elemProps),
         react_1.default.createElement(StyledStack, { size: size },
             react_1.default.createElement(StyledIcon, { icon: canvas_system_icons_web_1.userIcon, background: background, size: size, isImageLoaded: imageLoaded })),
         url && (react_1.default.createElement(StyledStack, { size: size },

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

@@ -1,19 +1,4 @@
 "use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    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]; } });
@@ -33,27 +18,16 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __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)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 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 React = __importStar(require("react"));
-var react_1 = require("@emotion/react");
-var styled_1 = __importDefault(require("@emotion/styled"));
-var tokens_1 = require("@workday/canvas-kit-react/tokens");
-var variants = {
+const React = __importStar(require("react"));
+const react_1 = require("@emotion/react");
+const styled_1 = __importDefault(require("@emotion/styled"));
+const tokens_1 = require("@workday/canvas-kit-react/tokens");
+const variants = {
     default: {
         background: tokens_1.colors.cinnamon500,
         color: tokens_1.colors.frenchVanilla100,
@@ -65,10 +39,18 @@ var variants = {
         color: tokens_1.colors.blueberry400,
     },
 };
-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')({
+const grow = react_1.keyframes `
+  from {
+    transform: scale(0.85);
+  }
+
+  to {
+    transform: scale(1.0);
+  }
+`;
+const Container = styled_1.default('span')({
     alignItems: 'center',
-    animation: grow + " 0.2s ease",
+    animation: `${grow} 0.2s ease`,
     borderRadius: tokens_1.borderRadius.circle,
     boxSizing: 'border-box',
     display: 'inline-flex',
@@ -80,14 +62,12 @@ var Container = styled_1.default('span')({
     lineHeight: '20px',
     minWidth: '20px',
     padding: '0 6.5px',
-}, function (_a) {
-    var _b = _a.variant, variant = _b === void 0 ? 'default' : _b;
-    return (__assign({}, variants[variant]));
-});
-var CountBadge = function (props) {
-    var _a = props.variant, variant = _a === void 0 ? 'default' : _a, _b = props.count, count = _b === void 0 ? 0 : _b, _c = props.limit, limit = _c === void 0 ? 1000 : _c, elemProps = __rest(props, ["variant", "count", "limit"]);
-    var formattedCount = count < limit ? "" + count : limit - 1 + "+";
-    return (React.createElement(Container, __assign({ variant: variant }, elemProps), formattedCount));
+}, ({ variant = 'default' }) => ({
+    ...variants[variant],
+}));
+const CountBadge = (props) => {
+    const { variant = 'default', count = 0, limit = 1000, ...elemProps } = props;
+    const formattedCount = count < limit ? `${count}` : `${limit - 1}+`;
+    return (React.createElement(Container, Object.assign({ variant: variant }, elemProps), formattedCount));
 };
 exports.CountBadge = CountBadge;
-var templateObject_1;

package/dist/commonjs/banner/lib/Banner.js

@@ -1,39 +1,25 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-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)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Banner = void 0;
 /** @jsxRuntime classic */
 /** @jsx jsx */
-var react_1 = require("@emotion/react");
-var tokens_1 = require("@workday/canvas-kit-react/tokens");
-var common_1 = require("@workday/canvas-kit-react/common");
-var layout_1 = require("@workday/canvas-kit-react/layout");
-var hooks_1 = require("./hooks");
-var BannerIcon_1 = require("./BannerIcon");
-var BannerLabel_1 = require("./BannerLabel");
-var BannerActionText_1 = require("./BannerActionText");
-var styles = __assign({ cursor: 'pointer', transition: 'background-color 120ms', '&:focus': __assign({ outline: 'none' }, common_1.focusRing({ separation: 2 })) }, common_1.hideMouseFocus);
+const react_1 = require("@emotion/react");
+const tokens_1 = require("@workday/canvas-kit-react/tokens");
+const common_1 = require("@workday/canvas-kit-react/common");
+const layout_1 = require("@workday/canvas-kit-react/layout");
+const hooks_1 = require("./hooks");
+const BannerIcon_1 = require("./BannerIcon");
+const BannerLabel_1 = require("./BannerLabel");
+const BannerActionText_1 = require("./BannerActionText");
+const styles = {
+    cursor: 'pointer',
+    transition: 'background-color 120ms',
+    '&:focus': {
+        outline: 'none',
+        ...common_1.focusRing({ separation: 2 }),
+    },
+    ...common_1.hideMouseFocus,
+};
 /**
  * `Banner` is a container component rendered as a `<button>` element that is responsible for creating
  * a `BannerModel` and sharing it with its subcomponents using React context.
@@ -99,25 +85,23 @@ exports.Banner = common_1.createContainer('button')({
          */
         ActionText: BannerActionText_1.BannerActionText,
     },
-})(function (_a, Element, model) {
-    var _b;
-    var children = _a.children, elemProps = __rest(_a, ["children"]);
-    var palette = hooks_1.useThemedPalette(model.state.hasError ? 'error' : 'alert');
-    var themedBackgroundStyles = {
+})(({ children, ...elemProps }, Element, model) => {
+    const palette = hooks_1.useThemedPalette(model.state.hasError ? 'error' : 'alert');
+    const themedBackgroundStyles = {
         '&:hover': {
             backgroundColor: palette.hover,
         },
     };
-    var isRTL = common_1.useIsRTL();
-    var borderBottomLeftRadius = isRTL ? 'borderBottomRightRadius' : 'borderBottomLeftRadius';
-    var borderTopLeftRadius = isRTL ? 'borderTopRightRadius' : 'borderTopLeftRadius';
-    var borderBottomRightRadius = isRTL ? 'borderBottomLeftRadius' : 'borderBottomRightRadius';
-    var borderTopRightRadius = isRTL ? 'borderTopLeftRadius' : 'borderTopRightRadius';
-    var borderStyleProps = (_b = {},
-        _b[borderBottomLeftRadius] = tokens_1.borderRadius.m,
-        _b[borderTopLeftRadius] = tokens_1.borderRadius.m,
-        _b[borderBottomRightRadius] = model.state.isSticky ? 0 : tokens_1.borderRadius.m,
-        _b[borderTopRightRadius] = model.state.isSticky ? 0 : tokens_1.borderRadius.m,
-        _b);
-    return (react_1.jsx(layout_1.Flex, __assign({ as: Element }, tokens_1.type.levels.subtext.large, { fontWeight: "medium", textAlign: "left", width: model.state.isSticky ? '222px' : '328px', backgroundColor: palette.normal, color: palette.contrast, padding: tokens_1.space.xxs + " " + tokens_1.space.s, border: "0", display: "flex", alignItems: "center" }, borderStyleProps, { css: [styles, themedBackgroundStyles] }, elemProps), children));
+    const isRTL = common_1.useIsRTL();
+    const borderBottomLeftRadius = isRTL ? 'borderBottomRightRadius' : 'borderBottomLeftRadius';
+    const borderTopLeftRadius = isRTL ? 'borderTopRightRadius' : 'borderTopLeftRadius';
+    const borderBottomRightRadius = isRTL ? 'borderBottomLeftRadius' : 'borderBottomRightRadius';
+    const borderTopRightRadius = isRTL ? 'borderTopLeftRadius' : 'borderTopRightRadius';
+    const borderStyleProps = {
+        [borderBottomLeftRadius]: tokens_1.borderRadius.m,
+        [borderTopLeftRadius]: tokens_1.borderRadius.m,
+        [borderBottomRightRadius]: model.state.isSticky ? 0 : tokens_1.borderRadius.m,
+        [borderTopRightRadius]: model.state.isSticky ? 0 : tokens_1.borderRadius.m,
+    };
+    return (react_1.jsx(layout_1.Flex, Object.assign({ as: Element }, tokens_1.type.levels.subtext.large, { fontWeight: "medium", textAlign: "left", width: model.state.isSticky ? '222px' : '328px', backgroundColor: palette.normal, color: palette.contrast, padding: `${tokens_1.space.xxs} ${tokens_1.space.s}`, border: "0", display: "flex", alignItems: "center" }, borderStyleProps, { css: [styles, themedBackgroundStyles] }, elemProps), children));
 });

package/dist/commonjs/banner/lib/BannerActionText.js

@@ -1,15 +1,4 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    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]; } });
@@ -29,31 +18,19 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __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)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.BannerActionText = void 0;
-var React = __importStar(require("react"));
-var common_1 = require("@workday/canvas-kit-react/common");
-var layout_1 = require("@workday/canvas-kit-react/layout");
-var hooks_1 = require("./hooks");
-var StyledActionBarText = common_1.styled(layout_1.Box.as('span'))({
+const React = __importStar(require("react"));
+const common_1 = require("@workday/canvas-kit-react/common");
+const layout_1 = require("@workday/canvas-kit-react/layout");
+const hooks_1 = require("./hooks");
+const StyledActionBarText = common_1.styled(layout_1.Box.as('span'))({
     textDecoration: 'underline',
 });
 exports.BannerActionText = common_1.createSubcomponent('span')({
     displayName: 'Banner.ActionTextText',
     modelHook: hooks_1.useBannerModel,
     elemPropsHook: hooks_1.useBannerActionText,
-})(function (_a, Element, model) {
-    var _b = _a.children, children = _b === void 0 ? 'View All' : _b, elemProps = __rest(_a, ["children"]);
-    return (React.createElement(StyledActionBarText, __assign({ as: Element, display: model.state.isSticky ? 'none' : 'inline' }, elemProps), children));
+})(({ children = 'View All', ...elemProps }, Element, model) => {
+    return (React.createElement(StyledActionBarText, Object.assign({ as: Element, display: model.state.isSticky ? 'none' : 'inline' }, elemProps), children));
 });

package/dist/commonjs/banner/lib/BannerIcon.js

@@ -1,44 +1,22 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-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)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.BannerIcon = void 0;
-var react_1 = __importDefault(require("react"));
-var tokens_1 = require("@workday/canvas-kit-react/tokens");
-var common_1 = require("@workday/canvas-kit-react/common");
-var icon_1 = require("@workday/canvas-kit-react/icon");
-var hooks_1 = require("./hooks");
-var StyledBannerIcon = common_1.styled(icon_1.SystemIcon)({
+const react_1 = __importDefault(require("react"));
+const tokens_1 = require("@workday/canvas-kit-react/tokens");
+const common_1 = require("@workday/canvas-kit-react/common");
+const icon_1 = require("@workday/canvas-kit-react/icon");
+const hooks_1 = require("./hooks");
+const StyledBannerIcon = common_1.styled(icon_1.SystemIcon)({
     marginRight: tokens_1.space.xs,
 });
 exports.BannerIcon = common_1.createSubcomponent('span')({
     displayName: 'Banner.Icon',
     modelHook: hooks_1.useBannerModel,
     elemPropsHook: hooks_1.useBannerIcon,
-})(function (elemProps, Element, model) {
-    var icon = elemProps.icon, iconButtonProps = __rest(elemProps, ["icon"]);
-    return react_1.default.createElement(StyledBannerIcon, __assign({ as: Element, icon: icon }, iconButtonProps));
+})((elemProps, Element, model) => {
+    const { icon, ...iconButtonProps } = elemProps;
+    return react_1.default.createElement(StyledBannerIcon, Object.assign({ as: Element, icon: icon }, iconButtonProps));
 });