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

package/dist/commonjs/color-picker/lib/ColorPicker.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,32 +18,21 @@ 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.ColorPicker = void 0;
-var tokens_1 = require("@workday/canvas-kit-react/tokens");
-var canvas_system_icons_web_1 = require("@workday/canvas-system-icons-web");
-var color_picker_1 = require("@workday/canvas-kit-react/color-picker");
-var button_1 = require("@workday/canvas-kit-react/button");
-var React = __importStar(require("react"));
-var form_field_1 = require("@workday/canvas-kit-react/form-field");
-var styled_1 = __importDefault(require("@emotion/styled"));
-var ColorReset_1 = require("./parts/ColorReset");
-var SwatchBook_1 = require("./parts/SwatchBook");
-var defaultColorSet = [
+const tokens_1 = require("@workday/canvas-kit-react/tokens");
+const canvas_system_icons_web_1 = require("@workday/canvas-system-icons-web");
+const color_picker_1 = require("@workday/canvas-kit-react/color-picker");
+const button_1 = require("@workday/canvas-kit-react/button");
+const React = __importStar(require("react"));
+const form_field_1 = require("@workday/canvas-kit-react/form-field");
+const styled_1 = __importDefault(require("@emotion/styled"));
+const ColorReset_1 = require("./parts/ColorReset");
+const SwatchBook_1 = require("./parts/SwatchBook");
+const defaultColorSet = [
     tokens_1.colors.blueberry600,
     tokens_1.colors.grapeSoda600,
     tokens_1.colors.pomegranate600,
@@ -112,51 +90,50 @@ var defaultColorSet = [
     tokens_1.colors.frenchVanilla200,
     tokens_1.colors.frenchVanilla100,
 ];
-var ColorPickerContainer = styled_1.default('div')({
+const ColorPickerContainer = styled_1.default('div')({
     width: 216,
 });
-var ColorInputWrapper = styled_1.default('form')({
+const ColorInputWrapper = styled_1.default('form')({
     width: '100%',
     marginTop: tokens_1.space.s,
     display: 'flex',
     flexDirection: 'row',
     justifyContent: 'space-between',
 });
-var ColorInputAndLabel = styled_1.default(form_field_1.FormField)({
+const ColorInputAndLabel = styled_1.default(form_field_1.FormField)({
     display: 'flex',
     flexDirection: 'column',
     margin: 0,
 });
-var CheckButton = styled_1.default(button_1.SecondaryButton)({
+const CheckButton = styled_1.default(button_1.SecondaryButton)({
     alignSelf: 'flex-end',
 });
-var HexColorInput = styled_1.default(color_picker_1.ColorInput)({
+const HexColorInput = styled_1.default(color_picker_1.ColorInput)({
     width: '168px',
 });
-var isCustomColor = function (colors, hexCode) {
+const isCustomColor = (colors, hexCode) => {
     if (!hexCode) {
         return false;
     }
-    var lowercaseHex = hexCode.toLowerCase();
+    const lowercaseHex = hexCode.toLowerCase();
     return !colors.includes(lowercaseHex);
 };
-var ColorPicker = function (_a) {
-    var _b = _a.colorSet, colorSet = _b === void 0 ? defaultColorSet : _b, _c = _a.customHexInputLabel, customHexInputLabel = _c === void 0 ? 'Custom Hex Color' : _c, _d = _a.submitLabel, submitLabel = _d === void 0 ? 'Submit' : _d, onColorChange = _a.onColorChange, onColorReset = _a.onColorReset, onSubmitClick = _a.onSubmitClick, _e = _a.resetLabel, resetLabel = _e === void 0 ? 'Reset' : _e, resetColor = _a.resetColor, _f = _a.value, value = _f === void 0 ? '' : _f, _g = _a.showCustomHexInput, showCustomHexInput = _g === void 0 ? false : _g, elemProps = __rest(_a, ["colorSet", "customHexInputLabel", "submitLabel", "onColorChange", "onColorReset", "onSubmitClick", "resetLabel", "resetColor", "value", "showCustomHexInput"]);
-    var _h = React.useState(''), validHexValue = _h[0], setValidHexValue = _h[1];
-    var _j = React.useState(isCustomColor(colorSet, value) ? value : ''), customHexValue = _j[0], setCustomHexValue = _j[1];
-    var onCustomHexChange = function (event) {
+const ColorPicker = ({ colorSet = defaultColorSet, customHexInputLabel = 'Custom Hex Color', submitLabel = 'Submit', onColorChange, onColorReset, onSubmitClick, resetLabel = 'Reset', resetColor, value = '', showCustomHexInput = false, ...elemProps }) => {
+    const [validHexValue, setValidHexValue] = React.useState('');
+    const [customHexValue, setCustomHexValue] = React.useState(isCustomColor(colorSet, value) ? value : '');
+    const onCustomHexChange = (event) => {
         setCustomHexValue(event.target.value);
         setValidHexValue('');
     };
-    var onValidCustomHexChange = function (validHexValue) { return setValidHexValue(validHexValue); };
-    var onSubmit = function (event) {
+    const onValidCustomHexChange = (validHexValue) => setValidHexValue(validHexValue);
+    const onSubmit = (event) => {
         if (onSubmitClick) {
             onSubmitClick(event);
         }
         onColorChange(validHexValue);
         event.preventDefault(); // don't submit the form - default action is to reload the page
     };
-    return (React.createElement(ColorPickerContainer, __assign({}, elemProps),
+    return (React.createElement(ColorPickerContainer, Object.assign({}, elemProps),
         onColorReset && resetColor && (React.createElement(ColorReset_1.ResetButton, { onClick: onColorReset, resetColor: resetColor, label: resetLabel })),
         React.createElement(SwatchBook_1.SwatchBook, { colors: colorSet, onSelect: onColorChange, value: value }),
         showCustomHexInput && (React.createElement(ColorInputWrapper, { onSubmit: onSubmit },

package/dist/commonjs/color-picker/lib/parts/ColorReset.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,22 +23,42 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ResetButton = void 0;
-var React = __importStar(require("react"));
-var styled_1 = __importDefault(require("@emotion/styled"));
-var tokens_1 = require("@workday/canvas-kit-react/tokens");
-var common_1 = require("@workday/canvas-kit-react/common");
-var color_picker_1 = require("@workday/canvas-kit-react/color-picker");
-var Label = styled_1.default('div')({
+const React = __importStar(require("react"));
+const styled_1 = __importDefault(require("@emotion/styled"));
+const tokens_1 = require("@workday/canvas-kit-react/tokens");
+const common_1 = require("@workday/canvas-kit-react/common");
+const color_picker_1 = require("@workday/canvas-kit-react/color-picker");
+const Label = styled_1.default('div')({
     marginLeft: tokens_1.space.xxs,
 });
-var Container = styled_1.default('button')(__assign(__assign(__assign({ display: 'flex', alignItems: 'center', justifyContent: 'flex-start', width: "calc(100% + " + tokens_1.space.l + ")", height: tokens_1.space.l, margin: "-" + tokens_1.space.xxs + " -" + tokens_1.space.s + " " + tokens_1.space.xxs, padding: "0px " + tokens_1.space.s }, tokens_1.type.levels.subtext.medium), { whiteSpace: 'nowrap', border: 'none', outline: 'none', background: 'none', cursor: 'pointer', transition: 'color 120ms ease, background-color 120ms ease', '&:hover': {
+const Container = styled_1.default('button')({
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'flex-start',
+    width: `calc(100% + ${tokens_1.space.l})`,
+    height: tokens_1.space.l,
+    margin: `-${tokens_1.space.xxs} -${tokens_1.space.s} ${tokens_1.space.xxs}`,
+    padding: `0px ${tokens_1.space.s}`,
+    ...tokens_1.type.levels.subtext.medium,
+    whiteSpace: 'nowrap',
+    border: 'none',
+    outline: 'none',
+    background: 'none',
+    cursor: 'pointer',
+    transition: 'color 120ms ease, background-color 120ms ease',
+    '&:hover': {
         backgroundColor: tokens_1.colors.soap300,
-    }, '&:active': {
+    },
+    '&:active': {
         backgroundColor: tokens_1.colors.soap400,
-    }, '&:focus': __assign({}, common_1.focusRing()) }), common_1.hideMouseFocus));
-var ResetButton = function (_a) {
-    var onClick = _a.onClick, resetColor = _a.resetColor, label = _a.label;
-    var handleResetColor = function () { return onClick(resetColor); };
+    },
+    '&:focus': {
+        ...common_1.focusRing(),
+    },
+    ...common_1.hideMouseFocus,
+});
+const ResetButton = ({ onClick, resetColor, label }) => {
+    const handleResetColor = () => onClick(resetColor);
     return (React.createElement(Container, { onClick: handleResetColor },
         React.createElement(color_picker_1.ColorSwatch, { color: resetColor }),
         React.createElement(Label, null, label)));

package/dist/commonjs/color-picker/lib/parts/SwatchBook.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,27 +23,30 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SwatchBook = void 0;
-var React = __importStar(require("react"));
-var styled_1 = __importDefault(require("@emotion/styled"));
-var tokens_1 = require("@workday/canvas-kit-react/tokens");
-var common_1 = require("@workday/canvas-kit-react/common");
-var color_picker_1 = require("@workday/canvas-kit-react/color-picker");
-var accessibilityBorder = tokens_1.colors.frenchVanilla100 + " 0px 0px 0px 2px, " + tokens_1.colors.licorice200 + " 0px 0px 0px 3px";
-var SwatchContainer = styled_1.default('div')({
+const React = __importStar(require("react"));
+const styled_1 = __importDefault(require("@emotion/styled"));
+const tokens_1 = require("@workday/canvas-kit-react/tokens");
+const common_1 = require("@workday/canvas-kit-react/common");
+const color_picker_1 = require("@workday/canvas-kit-react/color-picker");
+const accessibilityBorder = `${tokens_1.colors.frenchVanilla100} 0px 0px 0px 2px, ${tokens_1.colors.licorice200} 0px 0px 0px 3px`;
+const SwatchContainer = styled_1.default('div')({
     display: 'flex',
     width: 20,
     height: 20,
     cursor: 'pointer',
     borderRadius: tokens_1.borderRadius.s,
     transition: 'box-shadow 120ms ease',
-    margin: "0px " + tokens_1.space.xxs + " " + tokens_1.space.xxs + " 0px",
+    margin: `0px ${tokens_1.space.xxs} ${tokens_1.space.xxs} 0px`,
     '&:hover': {
         boxShadow: accessibilityBorder,
     },
-    '&:focus': __assign({ outline: 'none' }, common_1.focusRing({ separation: 2 })),
-}, function (_a) {
-    var isSelected = _a.isSelected;
-    return (__assign({ boxShadow: isSelected ? accessibilityBorder : undefined }, common_1.mouseFocusBehavior({
+    '&:focus': {
+        outline: 'none',
+        ...common_1.focusRing({ separation: 2 }),
+    },
+}, ({ isSelected }) => ({
+    boxShadow: isSelected ? accessibilityBorder : undefined,
+    ...common_1.mouseFocusBehavior({
         '&:focus': {
             animation: 'none',
             boxShadow: 'none',
@@ -65,23 +57,18 @@ var SwatchContainer = styled_1.default('div')({
         '&': {
             boxShadow: isSelected ? accessibilityBorder : undefined,
         },
-    })));
-});
-var Container = styled_1.default('div')({
+    }),
+}));
+const Container = styled_1.default('div')({
     display: 'flex',
     flexWrap: 'wrap',
-    margin: "0px -" + tokens_1.space.xxs + " -" + tokens_1.space.xxs + " 0px",
+    margin: `0px -${tokens_1.space.xxs} -${tokens_1.space.xxs} 0px`,
 });
-var SwatchBook = function (_a) {
-    var colors = _a.colors, value = _a.value, onSelect = _a.onSelect;
-    return (React.createElement(Container, null, colors.map(function (color, index) {
-        var isSelected = value ? color.toLowerCase() === value.toLowerCase() : false;
-        var handleClick = function () { return onSelect(color); };
-        var handleKeyDown = function (event) {
-            return (event.key === 'Enter' || event.key === ' ') && onSelect(color);
-        };
-        return (React.createElement(SwatchContainer, { key: index + '-' + color, onClick: handleClick, onKeyDown: handleKeyDown, tabIndex: 0, isSelected: isSelected },
-            React.createElement(color_picker_1.ColorSwatch, { color: color, showCheck: isSelected })));
-    })));
-};
+const SwatchBook = ({ colors, value, onSelect }) => (React.createElement(Container, null, colors.map((color, index) => {
+    const isSelected = value ? color.toLowerCase() === value.toLowerCase() : false;
+    const handleClick = () => onSelect(color);
+    const handleKeyDown = (event) => (event.key === 'Enter' || event.key === ' ') && onSelect(color);
+    return (React.createElement(SwatchContainer, { key: index + '-' + color, onClick: handleClick, onKeyDown: handleKeyDown, tabIndex: 0, isSelected: isSelected },
+        React.createElement(color_picker_1.ColorSwatch, { color: color, showCheck: isSelected })));
+})));
 exports.SwatchBook = SwatchBook;

package/dist/commonjs/form-field/lib/FormField.js

@@ -1,38 +1,16 @@
 "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.FormField = 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 hooks_1 = require("./hooks");
-var FormFieldInput_1 = require("./FormFieldInput");
-var FormFieldLabel_1 = require("./FormFieldLabel");
-var FormFieldHint_1 = require("./FormFieldHint");
+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 hooks_1 = require("./hooks");
+const FormFieldInput_1 = require("./FormFieldInput");
+const FormFieldLabel_1 = require("./FormFieldLabel");
+const FormFieldHint_1 = require("./FormFieldHint");
 exports.FormField = common_1.createContainer('div')({
     displayName: 'FormField',
     modelHook: hooks_1.useFormFieldModel,
@@ -41,8 +19,7 @@ exports.FormField = common_1.createContainer('div')({
         Label: FormFieldLabel_1.FormFieldLabel,
         Hint: FormFieldHint_1.FormFieldHint,
     },
-})(function (_a, Element) {
-    var children = _a.children, orientation = _a.orientation, elemProps = __rest(_a, ["children", "orientation"]);
-    var layoutProps = hooks_1.useFormFieldOrientation(orientation);
-    return (react_1.default.createElement(layout_1.Flex, __assign({ as: Element }, layoutProps, elemProps), children));
+})(({ children, orientation, ...elemProps }, Element) => {
+    const layoutProps = hooks_1.useFormFieldOrientation(orientation);
+    return (react_1.default.createElement(layout_1.Flex, Object.assign({ as: Element }, layoutProps, elemProps), children));
 });

package/dist/commonjs/form-field/lib/FormFieldHint.js

@@ -1,46 +1,23 @@
 "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.FormFieldHint = void 0;
-var react_1 = __importDefault(require("react"));
-var common_1 = require("@workday/canvas-kit-react/common");
-var tokens_1 = require("@workday/canvas-kit-react/tokens");
-var hooks_1 = require("./hooks");
-var text_1 = require("@workday/canvas-kit-react/text");
+const react_1 = __importDefault(require("react"));
+const common_1 = require("@workday/canvas-kit-react/common");
+const tokens_1 = require("@workday/canvas-kit-react/tokens");
+const hooks_1 = require("./hooks");
+const text_1 = require("@workday/canvas-kit-react/text");
 exports.FormFieldHint = common_1.createSubcomponent('p')({
     displayName: 'FormField.Hint',
     modelHook: hooks_1.useFormFieldModel,
     elemPropsHook: hooks_1.useFormFieldHint,
-})(function (_a, Element, model) {
-    var children = _a.children, elemProps = __rest(_a, ["children"]);
-    var theme = common_1.useTheme();
+})(({ children, ...elemProps }, Element, model) => {
+    const theme = common_1.useTheme();
     if (!children) {
         // If there is no hint text just skip rendering
         return null;
     }
-    return (react_1.default.createElement(text_1.Subtext, __assign({ as: Element, size: "medium", color: model.state.hasError ? theme.canvas.palette.error.main : undefined, marginY: tokens_1.space.xxs }, elemProps), children));
+    return (react_1.default.createElement(text_1.Subtext, Object.assign({ as: Element, size: "medium", color: model.state.hasError ? theme.canvas.palette.error.main : undefined, marginY: tokens_1.space.xxs }, elemProps), children));
 });

package/dist/commonjs/form-field/lib/FormFieldInput.js

@@ -1,28 +1,17 @@
 "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.FormFieldInput = 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 hooks_1 = require("./hooks");
+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 hooks_1 = require("./hooks");
 exports.FormFieldInput = common_1.createSubcomponent('input')({
     displayName: 'FormField.Input',
     modelHook: hooks_1.useFormFieldModel,
     elemPropsHook: hooks_1.useFormFieldInput,
-})(function (elemProps, Element) {
-    return react_1.default.createElement(layout_1.Box, __assign({ as: Element }, elemProps));
+})((elemProps, Element) => {
+    return react_1.default.createElement(layout_1.Box, Object.assign({ as: Element }, elemProps));
 });

package/dist/commonjs/form-field/lib/FormFieldLabel.js

@@ -1,44 +1,21 @@
 "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.FormFieldLabel = 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 text_1 = require("@workday/canvas-kit-react/text");
-var hooks_1 = require("./hooks");
+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 text_1 = require("@workday/canvas-kit-react/text");
+const hooks_1 = require("./hooks");
 exports.FormFieldLabel = common_1.createSubcomponent('label')({
     displayName: 'FormField.Label',
     modelHook: hooks_1.useFormFieldModel,
     elemPropsHook: hooks_1.useFormFieldLabel,
-})(function (_a, Element, model) {
-    var _b = _a.gap, gap = _b === void 0 ? 'xxxs' : _b, children = _a.children, elemProps = __rest(_a, ["gap", "children"]);
-    var theme = common_1.useTheme();
-    return (react_1.default.createElement(layout_1.Flex, __assign({ as: Element, gap: gap, minWidth: "180px" }, elemProps),
+})(({ gap = 'xxxs', children, ...elemProps }, Element, model) => {
+    const theme = common_1.useTheme();
+    return (react_1.default.createElement(layout_1.Flex, Object.assign({ as: Element, gap: gap, minWidth: "180px" }, elemProps),
         react_1.default.createElement(text_1.LabelText, { as: "span", fontWeight: "medium" }, children),
         model.state.isRequired && (react_1.default.createElement(text_1.Text, { fontSize: 20, fontWeight: "regular", textDecoration: "unset", color: theme.canvas.palette.error.main, "aria-hidden": "true" }, "*"))));
 });

package/dist/commonjs/form-field/lib/hooks/useFormFieldHint.js

@@ -1,15 +1,14 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useFormFieldHint = void 0;
-var common_1 = require("@workday/canvas-kit-react/common");
-var useFormFieldModel_1 = require("./useFormFieldModel");
+const common_1 = require("@workday/canvas-kit-react/common");
+const useFormFieldModel_1 = require("./useFormFieldModel");
 /**
  * Adds the necessary props to a `Hint` component.
  * Used by the FormField.Hint subcomponent and other input type components
  */
-exports.useFormFieldHint = common_1.createElemPropsHook(useFormFieldModel_1.useFormFieldModel)(function (_a) {
-    var state = _a.state;
+exports.useFormFieldHint = common_1.createElemPropsHook(useFormFieldModel_1.useFormFieldModel)(({ state }) => {
     return {
-        id: "hint-" + state.id,
+        id: `hint-${state.id}`,
     };
 });

package/dist/commonjs/form-field/lib/hooks/useFormFieldInput.js

@@ -1,18 +1,17 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useFormFieldInput = void 0;
-var common_1 = require("@workday/canvas-kit-react/common");
-var useFormFieldModel_1 = require("./useFormFieldModel");
+const common_1 = require("@workday/canvas-kit-react/common");
+const useFormFieldModel_1 = require("./useFormFieldModel");
 /**
  * Adds the necessary props to an `Input` component.
  * Used by the FormField.Input subcomponent and other input type components
  */
-exports.useFormFieldInput = common_1.createElemPropsHook(useFormFieldModel_1.useFormFieldModel)(function (_a) {
-    var state = _a.state;
+exports.useFormFieldInput = common_1.createElemPropsHook(useFormFieldModel_1.useFormFieldModel)(({ state }) => {
     return {
         required: state.isRequired ? true : undefined,
         'aria-invalid': state.hasError ? true : undefined,
-        'aria-describedby': "hint-" + state.id,
-        id: "input-" + state.id,
+        'aria-describedby': `hint-${state.id}`,
+        id: `input-${state.id}`,
     };
 });

package/dist/commonjs/form-field/lib/hooks/useFormFieldLabel.js

@@ -1,15 +1,14 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useFormFieldLabel = void 0;
-var common_1 = require("@workday/canvas-kit-react/common");
-var useFormFieldModel_1 = require("./useFormFieldModel");
+const common_1 = require("@workday/canvas-kit-react/common");
+const useFormFieldModel_1 = require("./useFormFieldModel");
 /**
  * Adds the necessary props to a `Label` component.
  * Used by the FormField.Label subcomponent and other input type components
  */
-exports.useFormFieldLabel = common_1.createElemPropsHook(useFormFieldModel_1.useFormFieldModel)(function (_a) {
-    var state = _a.state;
+exports.useFormFieldLabel = common_1.createElemPropsHook(useFormFieldModel_1.useFormFieldModel)(({ state }) => {
     return {
-        htmlFor: "input-" + state.id,
+        htmlFor: `input-${state.id}`,
     };
 });

package/dist/commonjs/form-field/lib/hooks/useFormFieldModel.js

@@ -1,18 +1,7 @@
 "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);
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useFormFieldModel = void 0;
-var common_1 = require("@workday/canvas-kit-react/common");
+const common_1 = require("@workday/canvas-kit-react/common");
 exports.useFormFieldModel = common_1.createModelHook({
     defaultConfig: {
         /**
@@ -37,11 +26,14 @@ exports.useFormFieldModel = common_1.createModelHook({
          */
         isRequired: false,
     },
-})(function (config) {
-    var id = common_1.useUniqueId(config.id);
-    var state = __assign(__assign({}, config), { id: id });
+})(config => {
+    const id = common_1.useUniqueId(config.id);
+    const state = {
+        ...config,
+        id,
+    };
     return {
-        state: state,
+        state,
         events: {},
     };
 });

package/dist/commonjs/form-field/lib/hooks/useFormFieldOrientation.js

@@ -1,12 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useFormFieldOrientation = void 0;
-var tokens_1 = require("@workday/canvas-kit-react/tokens");
+const tokens_1 = require("@workday/canvas-kit-react/tokens");
 /**
  * Adds the necessary layout props to a `FormField` component.
  */
-var useFormFieldOrientation = function (orientation) {
-    var layoutProps;
+const useFormFieldOrientation = (orientation) => {
+    let layoutProps;
     if (orientation === 'horizontal') {
         layoutProps = {
             flexDirection: 'row',