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

package/dist/commonjs/button/lib/deprecated_Button.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,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.DeprecatedButton = void 0;
-var React = __importStar(require("react"));
-var tokens_1 = require("@workday/canvas-kit-react/tokens");
-var common_1 = require("@workday/canvas-kit-react/common");
-var styled_1 = __importDefault(require("@emotion/styled"));
-var Container = styled_1.default('button')({
+const React = __importStar(require("react"));
+const tokens_1 = require("@workday/canvas-kit-react/tokens");
+const common_1 = require("@workday/canvas-kit-react/common");
+const styled_1 = __importDefault(require("@emotion/styled"));
+const Container = styled_1.default('button')({
     fontFamily: tokens_1.type.properties.fontFamilies.default,
     fontSize: 14,
     fontWeight: 500,
@@ -67,13 +45,12 @@ var Container = styled_1.default('button')({
     // Makes the "down" state of the button happens faster than the hover state, so it animates in correctly.
     '&:hover:active': { transitionDuration: '40ms' },
     '&:disabled, &:disabled:active': { cursor: 'default', boxShadow: 'none' },
-}, function (_a) {
-    var size = _a.size;
+}, ({ size }) => {
     switch (size) {
         case 'large':
             return {
                 height: '40px',
-                padding: "0 " + tokens_1.canvas.space.l,
+                padding: `0 ${tokens_1.canvas.space.l}`,
                 minWidth: '112px',
                 maxWidth: '288px',
             };
@@ -81,7 +58,7 @@ var Container = styled_1.default('button')({
         default:
             return {
                 height: '24px',
-                padding: "0 " + tokens_1.canvas.space.m,
+                padding: `0 ${tokens_1.canvas.space.m}`,
                 minWidth: '80px',
                 maxWidth: '200px',
                 fontSize: 13, // hardcoded value to prevent shifting from type changes
@@ -89,19 +66,15 @@ var Container = styled_1.default('button')({
         case 'small':
             return {
                 height: '18px',
-                padding: "0 " + tokens_1.canvas.space.xxs,
+                padding: `0 ${tokens_1.canvas.space.xxs}`,
                 minWidth: '56px',
                 maxWidth: '120px',
                 fontSize: 10,
                 lineHeight: 'normal',
             };
     }
-}, function (_a) {
-    var grow = _a.grow;
-    return grow && { width: '100%', maxWidth: '100%' };
-}, function (_a) {
-    var variant = _a.variant;
-    var buttonColors;
+}, ({ grow }) => grow && { width: '100%', maxWidth: '100%' }, ({ variant }) => {
+    let buttonColors;
     switch (variant) {
         case 'primary':
             buttonColors = tokens_1.canvas.buttonColors.primary;
@@ -111,53 +84,77 @@ var Container = styled_1.default('button')({
             buttonColors = tokens_1.canvas.buttonColors.secondary;
             break;
         case 'delete':
-            buttonColors = __assign(__assign({}, tokens_1.canvas.buttonColors.delete), { focusBorder: tokens_1.canvas.colors.cinnamon500, activeBorder: tokens_1.canvas.colors.cinnamon500 });
+            buttonColors = {
+                ...tokens_1.canvas.buttonColors.delete,
+                focusBorder: tokens_1.canvas.colors.cinnamon500,
+                activeBorder: tokens_1.canvas.colors.cinnamon500,
+            };
             break;
     }
     if (!buttonColors) {
         return {};
     }
-    var baseStyles = {
+    const baseStyles = {
         backgroundColor: buttonColors.background,
         borderColor: buttonColors.border,
         color: buttonColors.text,
     };
-    var hoverStyles = {
+    const hoverStyles = {
         ':hover': {
             backgroundColor: buttonColors.hoverBackground,
             borderColor: buttonColors.hoverBorder,
             color: buttonColors.hoverText,
         },
     };
-    var activeStyles = {
+    const activeStyles = {
         ':active, :focus:active, :hover:active': {
             backgroundColor: buttonColors.activeBackground,
             borderColor: buttonColors.activeBorder,
             color: buttonColors.activeText,
         },
     };
-    return __assign(__assign(__assign(__assign(__assign(__assign({}, baseStyles), { ':focus': {
+    return {
+        ...baseStyles,
+        ':focus': {
             backgroundColor: buttonColors.focusBackground,
             borderColor: buttonColors.focusBorder,
             color: buttonColors.focusText,
-        } }), activeStyles), hoverStyles), { ':disabled, :active:disabled, :focus:disabled, :hover:disabled': {
+        },
+        ...activeStyles,
+        ...hoverStyles,
+        ':disabled, :active:disabled, :focus:disabled, :hover:disabled': {
             backgroundColor: buttonColors.disabledBackground,
             borderColor: buttonColors.disabledBorder,
             color: buttonColors.disabledText,
-        }, '&:not([disabled])': {
-            '&:focus': __assign({ borderColor: buttonColors.focusBorder }, common_1.focusRing()),
-            '&:active': __assign({ borderColor: buttonColors.activeBorder }, common_1.focusRing()),
-        } }), common_1.mouseFocusBehavior({
-        '&:focus': __assign(__assign(__assign(__assign({}, baseStyles), { outline: 'none', boxShadow: 'none', animation: 'none' }), hoverStyles), activeStyles),
-    }));
+        },
+        '&:not([disabled])': {
+            '&:focus': {
+                borderColor: buttonColors.focusBorder,
+                ...common_1.focusRing(),
+            },
+            '&:active': {
+                borderColor: buttonColors.activeBorder,
+                ...common_1.focusRing(),
+            },
+        },
+        ...common_1.mouseFocusBehavior({
+            '&:focus': {
+                ...baseStyles,
+                outline: 'none',
+                boxShadow: 'none',
+                animation: 'none',
+                ...hoverStyles,
+                ...activeStyles,
+            },
+        }),
+    };
 });
 exports.DeprecatedButton = common_1.createComponent('button')({
     displayName: 'DeprecatedButton',
-    Component: function (_a, ref, Element) {
-        var _b = _a.variant, variant = _b === void 0 ? 'secondary' : _b, _c = _a.size, size = _c === void 0 ? 'large' : _c, children = _a.children, elemProps = __rest(_a, ["variant", "size", "children"]);
-        React.useEffect(function () {
+    Component: ({ variant = 'secondary', size = 'large', children, ...elemProps }, ref, Element) => {
+        React.useEffect(() => {
             console.warn('This component is now deprecated, consider using the new Button component');
         }, []);
-        return (React.createElement(Container, __assign({ ref: ref, as: Element, variant: variant, size: size }, elemProps), children));
+        return (React.createElement(Container, Object.assign({ ref: ref, as: Element, variant: variant, size: size }, elemProps), children));
     },
 });

package/dist/commonjs/button/lib/parts/ButtonLabel.js

@@ -1,35 +1,13 @@
 "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.ButtonLabel = void 0;
-var react_1 = __importDefault(require("react"));
-var common_1 = require("@workday/canvas-kit-react/common");
-var layout_1 = require("@workday/canvas-kit-react/layout");
-var StyledButtonLabel = common_1.styled(layout_1.Box.as('span'))({
+const react_1 = __importDefault(require("react"));
+const common_1 = require("@workday/canvas-kit-react/common");
+const layout_1 = require("@workday/canvas-kit-react/layout");
+const StyledButtonLabel = common_1.styled(layout_1.Box.as('span'))({
     position: 'relative',
     textOverflow: 'ellipsis',
     overflow: 'hidden',
@@ -37,8 +15,7 @@ var StyledButtonLabel = common_1.styled(layout_1.Box.as('span'))({
 });
 exports.ButtonLabel = common_1.createComponent('span')({
     displayName: 'ButtonLabel',
-    Component: function (_a, ref, Element) {
-        var children = _a.children, elemProps = __rest(_a, ["children"]);
-        return (react_1.default.createElement(StyledButtonLabel, __assign({ as: Element, ref: ref }, elemProps), children));
+    Component: ({ children, ...elemProps }, ref, Element) => {
+        return (react_1.default.createElement(StyledButtonLabel, Object.assign({ as: Element, ref: ref }, elemProps), children));
     },
 });

package/dist/commonjs/button/lib/parts/ButtonLabelIcon.js

@@ -1,35 +1,13 @@
 "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.ButtonLabelIcon = void 0;
-var react_1 = __importDefault(require("react"));
-var common_1 = require("@workday/canvas-kit-react/common");
-var icon_1 = require("@workday/canvas-kit-react/icon");
-var iconSizes = {
+const react_1 = __importDefault(require("react"));
+const common_1 = require("@workday/canvas-kit-react/common");
+const icon_1 = require("@workday/canvas-kit-react/icon");
+const iconSizes = {
     extraSmall: 18,
     small: 20,
     medium: 20,
@@ -37,12 +15,11 @@ var iconSizes = {
 };
 exports.ButtonLabelIcon = common_1.createComponent('span')({
     displayName: 'ButtonLabelIconNew',
-    Component: function (_a, ref, Element) {
-        var icon = _a.icon, _b = _a.size, size = _b === void 0 ? 'medium' : _b, _c = _a.shouldMirrorIcon, shouldMirrorIcon = _c === void 0 ? false : _c, elemProps = __rest(_a, ["icon", "size", "shouldMirrorIcon"]);
+    Component: ({ icon, size = 'medium', shouldMirrorIcon = false, ...elemProps }, ref, Element) => {
         if (icon === undefined) {
             return null;
         }
-        var iconSize = iconSizes[size];
-        return (react_1.default.createElement(icon_1.SystemIcon, __assign({ size: iconSize, icon: icon, shouldMirror: shouldMirrorIcon, width: size ? iconSizes[size] : iconSizes.large, height: size ? iconSizes[size] : iconSizes.large, display: "inline-block" }, elemProps)));
+        const iconSize = iconSizes[size];
+        return (react_1.default.createElement(icon_1.SystemIcon, Object.assign({ size: iconSize, icon: icon, shouldMirror: shouldMirrorIcon, width: size ? iconSizes[size] : iconSizes.large, height: size ? iconSizes[size] : iconSizes.large, display: "inline-block" }, elemProps)));
     },
 });

package/dist/commonjs/card/lib/Card.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,25 +18,14 @@ 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.Card = void 0;
-var React = __importStar(require("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 CardHeading_1 = require("./CardHeading");
-var CardBody_1 = require("./CardBody");
+const React = __importStar(require("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 CardHeading_1 = require("./CardHeading");
+const CardBody_1 = require("./CardBody");
 /**
  * `Card` is a container component that holds a {@link CardBody Card.Body} and an optional
  * {@link CardHeading Card.Heading}. `Card` wraps a non-semantic `div` element. The element can be
@@ -62,9 +40,8 @@ var CardBody_1 = require("./CardBody");
  */
 exports.Card = common_1.createComponent('div')({
     displayName: 'Card',
-    Component: function (_a, ref, Element) {
-        var children = _a.children, elemProps = __rest(_a, ["children"]);
-        return (React.createElement(layout_1.Box, __assign({ ref: ref, as: Element, depth: 1, padding: "l", backgroundColor: "frenchVanilla100", border: "1px solid " + tokens_1.colors.soap500, borderRadius: "l" }, elemProps), children));
+    Component: ({ children, ...elemProps }, ref, Element) => {
+        return (React.createElement(layout_1.Box, Object.assign({ ref: ref, as: Element, depth: 1, padding: "l", backgroundColor: "frenchVanilla100", border: `1px solid ${tokens_1.colors.soap500}`, borderRadius: "l" }, elemProps), children));
     },
     subComponents: {
         /**

package/dist/commonjs/card/lib/CardBody.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,27 +18,15 @@ 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.CardBody = void 0;
-var React = __importStar(require("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");
+const React = __importStar(require("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");
 exports.CardBody = common_1.createComponent('div')({
     displayName: 'Card.Body',
-    Component: function (_a, ref, Element) {
-        var children = _a.children, elemProps = __rest(_a, ["children"]);
-        return (React.createElement(layout_1.Box, __assign({ ref: ref, as: Element }, tokens_1.type.levels.subtext.large, elemProps), children));
+    Component: ({ children, ...elemProps }, ref, Element) => {
+        return (React.createElement(layout_1.Box, Object.assign({ ref: ref, as: Element }, tokens_1.type.levels.subtext.large, elemProps), children));
     },
 });

package/dist/commonjs/card/lib/CardHeading.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,26 +18,14 @@ 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.CardHeading = void 0;
-var React = __importStar(require("react"));
-var common_1 = require("@workday/canvas-kit-react/common");
-var text_1 = require("@workday/canvas-kit-react/text");
+const React = __importStar(require("react"));
+const common_1 = require("@workday/canvas-kit-react/common");
+const text_1 = require("@workday/canvas-kit-react/text");
 exports.CardHeading = common_1.createComponent('h3')({
     displayName: 'Card.Heading',
-    Component: function (_a, ref, Element) {
-        var children = _a.children, elemProps = __rest(_a, ["children"]);
-        return (React.createElement(text_1.Text, __assign({ ref: ref, typeLevel: "body.large", fontWeight: "bold", marginBottom: "m", marginTop: 0, as: Element }, elemProps), children));
+    Component: ({ children, ...elemProps }, ref, Element) => {
+        return (React.createElement(text_1.Text, Object.assign({ ref: ref, typeLevel: "body.large", fontWeight: "bold", marginBottom: "m", marginTop: 0, as: Element }, elemProps), children));
     },
 });