@workday/canvas-kit-react 8.0.0-alpha.253-next.22 → 8.0.0-alpha.428-next.2

package/dist/es6/radio/lib/Radio.js

@@ -1,38 +1,16 @@
-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;
-};
 import * as React from 'react';
 import { createComponent, focusRing, mouseFocusBehavior, styled, useUniqueId, } from '@workday/canvas-kit-react/common';
 import { borderRadius, colors, inputColors, spaceNumbers } from '@workday/canvas-kit-react/tokens';
 import { LabelText } from '@workday/canvas-kit-react/text';
-var radioBorderRadius = 9;
-var radioDot = 8;
-var radioHeight = 18;
-var radioTapArea = spaceNumbers.m;
-var radioContainerHeight = radioTapArea;
-var radioLabelDistance = spaceNumbers.xs;
-var radioWidth = 18;
-var rippleRadius = (spaceNumbers.l - radioWidth) / 2;
-var RadioContainer = styled('div')({
+const radioBorderRadius = 9;
+const radioDot = 8;
+const radioHeight = 18;
+const radioTapArea = spaceNumbers.m;
+const radioContainerHeight = radioTapArea;
+const radioLabelDistance = spaceNumbers.xs;
+const radioWidth = 18;
+const rippleRadius = (spaceNumbers.l - radioWidth) / 2;
+const RadioContainer = styled('div')({
     display: 'flex',
     alignItems: 'center',
     minHeight: radioContainerHeight,
@@ -43,26 +21,23 @@ var RadioContainer = styled('div')({
  * :hover on the radio when you hover on it's corresponding label.
  * This stops the ripple from showing when you hover on the label.
  */
-var RadioInputWrapper = styled('div')({
+const RadioInputWrapper = styled('div')({
     display: 'flex',
     height: radioHeight,
     width: radioWidth,
 });
-var RadioRipple = styled('span')({
+const RadioRipple = styled('span')({
     borderRadius: borderRadius.circle,
-    boxShadow: "0 0 0 0 " + colors.soap200,
+    boxShadow: `0 0 0 0 ${colors.soap200}`,
     height: radioHeight,
     transition: 'box-shadow 150ms ease-out',
     width: radioWidth,
     position: 'absolute',
-    pointerEvents: 'none',
-}, function (_a) {
-    var variant = _a.variant;
-    return ({
-        opacity: variant === 'inverse' ? '0.4' : '1',
-    });
-});
-var RadioInput = styled('input')({
+    pointerEvents: 'none', // This is a decorative element we don't want it to block clicks to input
+}, ({ variant }) => ({
+    opacity: variant === 'inverse' ? '0.4' : '1',
+}));
+const RadioInput = styled('input')({
     borderRadius: radioBorderRadius,
     width: radioTapArea,
     height: radioTapArea,
@@ -74,64 +49,79 @@ var RadioInput = styled('input')({
     '&:focus, &:active': {
         outline: 'none',
     },
-}, function (_a) {
-    var checked = _a.checked, disabled = _a.disabled, variant = _a.variant, _b = _a.theme.canvas.palette, themePrimary = _b.primary, themeFocusOutline = _b.common.focusOutline;
-    return (__assign({ cursor: disabled ? undefined : 'pointer', 
-        /**
-         * These selectors are targetting various sibling elements (~) here because
-         * their styles need to be connected to changes around the input's state
-         * (e.g. hover, focus, etc.).
-         *
-         * We are choosing not to use component selectors from Emotion in this case.
-         * The Babel transforms have been problematic in the past.
-         */
-        // `span:first-of-type` refers to `RadioRipple`, the light grey
-        // element that animates around the component on hover
-        '&:hover ~ span:first-of-type': {
-            boxShadow: disabled ? undefined : "0 0 0 " + rippleRadius + "px " + colors.soap200,
-        }, 
-        // `div:first-of-type` refers to the `RadioBackground`, the visual facade of the
-        // input (which is visually hidden)
-        '&:hover ~ div:first-of-type': {
-            backgroundColor: checked
-                ? variant === 'inverse'
-                    ? colors.frenchVanilla100
-                    : themePrimary.main
-                : disabled
-                    ? inputColors.disabled.background
-                    : 'white',
-            borderColor: checked
-                ? variant === 'inverse'
+}, ({ checked, disabled, variant, theme: { canvas: { palette: { primary: themePrimary, common: { focusOutline: themeFocusOutline }, }, }, }, }) => ({
+    cursor: disabled ? undefined : 'pointer',
+    /**
+     * These selectors are targetting various sibling elements (~) here because
+     * their styles need to be connected to changes around the input's state
+     * (e.g. hover, focus, etc.).
+     *
+     * We are choosing not to use component selectors from Emotion in this case.
+     * The Babel transforms have been problematic in the past.
+     */
+    // `span:first-of-type` refers to `RadioRipple`, the light grey
+    // element that animates around the component on hover
+    '&:hover ~ span:first-of-type': {
+        boxShadow: disabled ? undefined : `0 0 0 ${rippleRadius}px ${colors.soap200}`,
+    },
+    // `div:first-of-type` refers to the `RadioBackground`, the visual facade of the
+    // input (which is visually hidden)
+    '&:hover ~ div:first-of-type': {
+        backgroundColor: checked
+            ? variant === 'inverse'
+                ? colors.frenchVanilla100
+                : themePrimary.main
+            : disabled
+                ? inputColors.disabled.background
+                : 'white',
+        borderColor: checked
+            ? variant === 'inverse'
+                ? colors.soap300
+                : themePrimary.main
+            : disabled
+                ? inputColors.disabled.border
+                : variant === 'inverse'
                     ? colors.soap300
-                    : themePrimary.main
-                : disabled
-                    ? inputColors.disabled.border
-                    : variant === 'inverse'
-                        ? colors.soap300
-                        : inputColors.hoverBorder,
-            borderWidth: '1px',
-        }, '&:focus, &focus:hover': {
-            '& ~ div:first-of-type': __assign({ borderWidth: '2px', borderColor: variant === 'inverse' ? colors.blackPepper400 : themeFocusOutline, boxShadow: 'none' }, focusRing({
+                    : inputColors.hoverBorder,
+        borderWidth: '1px',
+    },
+    '&:focus, &focus:hover': {
+        '& ~ div:first-of-type': {
+            borderWidth: '2px',
+            borderColor: variant === 'inverse' ? colors.blackPepper400 : themeFocusOutline,
+            boxShadow: 'none',
+            ...focusRing({
                 width: variant === 'inverse' ? 2 : 0,
                 separation: 0,
                 animate: false,
                 innerColor: variant === 'inverse' ? colors.blackPepper400 : undefined,
                 outerColor: variant === 'inverse' ? colors.frenchVanilla100 : undefined,
-            })),
-        }, '&:checked:focus ~ div:first-of-type': __assign(__assign({}, focusRing({
+            }),
+        },
+    },
+    '&:checked:focus ~ div:first-of-type': {
+        ...focusRing({
             separation: 2,
             width: 2,
             innerColor: variant === 'inverse' ? colors.blackPepper400 : undefined,
             outerColor: variant === 'inverse' ? colors.frenchVanilla100 : themeFocusOutline,
-        })), { borderColor: variant === 'inverse' ? colors.frenchVanilla100 : themePrimary.main, borderWidth: '2px' }) }, mouseFocusBehavior({
-        '&:focus ~ div:first-of-type': __assign(__assign({}, focusRing({
-            width: 0,
-            outerColor: variant === 'inverse' ? colors.frenchVanilla100 : themeFocusOutline,
-        })), { borderWidth: '1px', borderColor: checked
+        }),
+        borderColor: variant === 'inverse' ? colors.frenchVanilla100 : themePrimary.main,
+        borderWidth: '2px',
+    },
+    ...mouseFocusBehavior({
+        '&:focus ~ div:first-of-type': {
+            ...focusRing({
+                width: 0,
+                outerColor: variant === 'inverse' ? colors.frenchVanilla100 : themeFocusOutline,
+            }),
+            borderWidth: '1px',
+            borderColor: checked
                 ? variant === 'inverse'
                     ? colors.soap300
                     : themePrimary.main
-                : inputColors.border }),
+                : inputColors.border,
+        },
         '&:focus:hover ~ div:first-of-type, &:focus:active ~ div:first-of-type': {
             borderColor: checked
                 ? variant === 'inverse'
@@ -141,9 +131,9 @@ var RadioInput = styled('input')({
                     ? colors.soap300
                     : inputColors.hoverBorder,
         },
-    })));
-});
-var RadioBackground = styled('div')({
+    }),
+}));
+const RadioBackground = styled('div')({
     alignItems: 'center',
     backgroundColor: colors.frenchVanilla100,
     borderRadius: radioBorderRadius,
@@ -158,29 +148,26 @@ var RadioBackground = styled('div')({
     position: 'absolute',
     transition: 'border 200ms ease, background 200ms',
     width: radioWidth,
-}, function (_a) {
-    var checked = _a.checked, disabled = _a.disabled, variant = _a.variant, themePrimary = _a.theme.canvas.palette.primary;
-    return ({
-        borderColor: checked
-            ? variant === 'inverse'
+}, ({ checked, disabled, variant, theme: { canvas: { palette: { primary: themePrimary }, }, }, }) => ({
+    borderColor: checked
+        ? variant === 'inverse'
+            ? colors.soap300
+            : themePrimary.main
+        : disabled
+            ? inputColors.disabled.border
+            : variant === 'inverse'
                 ? colors.soap300
-                : themePrimary.main
-            : disabled
-                ? inputColors.disabled.border
-                : variant === 'inverse'
-                    ? colors.soap300
-                    : inputColors.border,
-        backgroundColor: checked
-            ? variant === 'inverse'
-                ? colors.frenchVanilla100
-                : themePrimary.main
-            : disabled
-                ? inputColors.disabled.background
-                : 'white',
-        opacity: disabled && variant === 'inverse' ? '.4' : '1',
-    });
-});
-var RadioCheck = styled('div')({
+                : inputColors.border,
+    backgroundColor: checked
+        ? variant === 'inverse'
+            ? colors.frenchVanilla100
+            : themePrimary.main
+        : disabled
+            ? inputColors.disabled.background
+            : 'white',
+    opacity: disabled && variant === 'inverse' ? '.4' : '1',
+}));
+const RadioCheck = styled('div')({
     borderRadius: radioBorderRadius,
     display: 'flex',
     flexDirection: 'column',
@@ -188,28 +175,21 @@ var RadioCheck = styled('div')({
     pointerEvents: 'none',
     transition: 'transform 200ms ease, opacity 200ms ease',
     width: radioDot,
-}, function (_a) {
-    var theme = _a.theme, variant = _a.variant;
-    return ({
-        backgroundColor: variant === 'inverse'
-            ? theme.canvas.palette.primary.main
-            : theme.canvas.palette.primary.contrast,
-    });
-}, function (_a) {
-    var checked = _a.checked;
-    return ({
-        opacity: checked ? 1 : 0,
-        transform: checked ? 'scale(1)' : 'scale(0.5)',
-    });
-});
-export var Radio = createComponent('input')({
+}, ({ theme, variant }) => ({
+    backgroundColor: variant === 'inverse'
+        ? theme.canvas.palette.primary.main
+        : theme.canvas.palette.primary.contrast,
+}), ({ checked }) => ({
+    opacity: checked ? 1 : 0,
+    transform: checked ? 'scale(1)' : 'scale(0.5)',
+}));
+export const Radio = createComponent('input')({
     displayName: 'Radio',
-    Component: function (_a, ref, Element) {
-        var _b = _a.checked, checked = _b === void 0 ? false : _b, id = _a.id, _c = _a.label, label = _c === void 0 ? '' : _c, disabled = _a.disabled, name = _a.name, onChange = _a.onChange, value = _a.value, variant = _a.variant, elemProps = __rest(_a, ["checked", "id", "label", "disabled", "name", "onChange", "value", "variant"]);
-        var inputId = useUniqueId(id);
+    Component: ({ checked = false, id, label = '', disabled, name, onChange, value, variant, ...elemProps }, ref, Element) => {
+        const inputId = useUniqueId(id);
         return (React.createElement(RadioContainer, null,
             React.createElement(RadioInputWrapper, { disabled: disabled },
-                React.createElement(RadioInput, __assign({ as: Element, checked: checked, disabled: disabled, id: inputId, ref: ref, name: name, onChange: onChange, type: "radio", value: value, "aria-checked": checked, variant: variant }, elemProps)),
+                React.createElement(RadioInput, Object.assign({ as: Element, checked: checked, disabled: disabled, id: inputId, ref: ref, name: name, onChange: onChange, type: "radio", value: value, "aria-checked": checked, variant: variant }, elemProps)),
                 React.createElement(RadioRipple, { variant: variant }),
                 React.createElement(RadioBackground, { checked: checked, disabled: disabled, variant: variant },
                     React.createElement(RadioCheck, { checked: checked, variant: variant }))),

package/dist/es6/radio/lib/RadioGroup.d.ts

@@ -24,11 +24,10 @@ export interface RadioGroupProps extends Themeable, GrowthBehavior {
      */
     onChange?: (value: string | number) => void;
 }
-declare class RadioGroup extends React.Component<RadioGroupProps> {
+export declare class RadioGroup extends React.Component<RadioGroupProps> {
     static ErrorType: typeof ErrorType;
     render(): React.ReactNode;
     private renderChild;
     private onRadioChange;
 }
-export { RadioGroup };
 //# sourceMappingURL=RadioGroup.d.ts.map

package/dist/es6/radio/lib/RadioGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.d.ts","sourceRoot":"","sources":["../../../../radio/lib/RadioGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAQ,UAAU,EAAC,MAAM,SAAS,CAAC;AAE1C,OAAO,EACL,SAAS,EACT,cAAc,EAGd,SAAS,EACV,MAAM,kCAAkC,CAAC;AAE1C,MAAM,WAAW,eAAgB,SAAQ,SAAS,EAAE,cAAc;IAChE;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC,UAAU,CAAC,EAAE,CAAC;IAC3C;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;CAC7C;AAoCD,cAAM,UAAW,SAAQ,KAAK,CAAC,SAAS,CAAC,eAAe,CAAC;IACvD,MAAM,CAAC,SAAS,mBAAa;IAE7B,MAAM,IAAI,KAAK,CAAC,SAAS;IASzB,OAAO,CAAC,WAAW,CAkBjB;IAEF,OAAO,CAAC,aAAa,CAiBnB;CACH;AAID,OAAO,EAAC,UAAU,EAAC,CAAC"}
+{"version":3,"file":"RadioGroup.d.ts","sourceRoot":"","sources":["../../../../radio/lib/RadioGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAQ,UAAU,EAAC,MAAM,SAAS,CAAC;AAE1C,OAAO,EACL,SAAS,EACT,cAAc,EAGd,SAAS,EACV,MAAM,kCAAkC,CAAC;AAE1C,MAAM,WAAW,eAAgB,SAAQ,SAAS,EAAE,cAAc;IAChE;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC,UAAU,CAAC,EAAE,CAAC;IAC3C;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;CAC7C;AAoCD,qBAAa,UAAW,SAAQ,KAAK,CAAC,SAAS,CAAC,eAAe,CAAC;IAC9D,MAAM,CAAC,SAAS,mBAAa;IAE7B,MAAM,IAAI,KAAK,CAAC,SAAS;IASzB,OAAO,CAAC,WAAW,CAkBjB;IAEF,OAAO,CAAC,aAAa,CAiBnB;CACH"}

package/dist/es6/radio/lib/RadioGroup.js

@@ -1,50 +1,15 @@
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-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;
-};
 import * as React from 'react';
 import { Radio } from './Radio';
 import { borderRadius, space } from '@workday/canvas-kit-react/tokens';
 import { ErrorType, getErrorColors, styled, } from '@workday/canvas-kit-react/common';
-var Container = styled('div')({
+const Container = styled('div')({
     display: 'inline-block',
     boxSizing: 'border-box',
     borderRadius: borderRadius.m,
-    padding: space.xxxs + " " + space.xs,
-    margin: "-" + space.xxxs + " -" + space.xs,
+    padding: `${space.xxxs} ${space.xs}`,
+    margin: `-${space.xxxs} -${space.xs}`,
     '& > div': {
-        margin: space.xxs + " " + space.zero,
+        margin: `${space.xxs} ${space.zero}`,
         alignItems: 'flex-start',
         '> div': {
             flex: '0 0 auto',
@@ -56,59 +21,50 @@ var Container = styled('div')({
             marginBottom: space.xxxs,
         },
     },
-}, function (_a) {
-    var grow = _a.grow;
-    return grow && { width: '100%' };
-}, function (_a) {
-    var error = _a.error, theme = _a.theme;
-    var errorColors = getErrorColors(error, theme);
+}, ({ grow }) => grow && { width: '100%' }, ({ error, theme }) => {
+    const errorColors = getErrorColors(error, theme);
     return {
         transition: '100ms box-shadow',
         boxShadow: errorColors.outer !== errorColors.inner
-            ? "inset 0 0 0 1px " + errorColors.outer + ", inset 0 0 0 3px " + errorColors.inner
-            : "inset 0 0 0 2px " + errorColors.inner,
+            ? `inset 0 0 0 1px ${errorColors.outer}, inset 0 0 0 3px ${errorColors.inner}`
+            : `inset 0 0 0 2px ${errorColors.inner}`,
     };
 });
-var RadioGroup = /** @class */ (function (_super) {
-    __extends(RadioGroup, _super);
-    function RadioGroup() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.renderChild = function (child, index, value) {
+export class RadioGroup extends React.Component {
+    constructor() {
+        super(...arguments);
+        this.renderChild = (child, index, value) => {
             if (typeof child.type === typeof Radio) {
-                var childProps = child.props;
-                var checked = typeof value === 'number' ? index === value : childProps.value === value;
-                var name_1 = _this.props.name ? _this.props.name : childProps.name;
+                const childProps = child.props;
+                const checked = typeof value === 'number' ? index === value : childProps.value === value;
+                const name = this.props.name ? this.props.name : childProps.name;
                 return React.cloneElement(child, {
-                    checked: checked,
-                    name: name_1,
-                    onChange: _this.onRadioChange.bind(_this, childProps.onChange, index),
+                    checked,
+                    name,
+                    onChange: this.onRadioChange.bind(this, childProps.onChange, index),
                 });
             }
             return child;
         };
-        _this.onRadioChange = function (existingOnChange, index, event) {
+        this.onRadioChange = (existingOnChange, index, event) => {
             if (existingOnChange) {
                 existingOnChange(event);
             }
-            var target = event.currentTarget;
-            if (target && _this.props.onChange) {
+            const target = event.currentTarget;
+            if (target && this.props.onChange) {
                 if (target.value) {
-                    _this.props.onChange(target.value);
+                    this.props.onChange(target.value);
                 }
                 else {
-                    _this.props.onChange(index);
+                    this.props.onChange(index);
                 }
             }
         };
-        return _this;
     }
-    RadioGroup.prototype.render = function () {
-        var _this = this;
-        var _a = this.props, _b = _a.value, value = _b === void 0 ? 0 : _b, children = _a.children, error = _a.error, onChange = _a.onChange, grow = _a.grow, elemProps = __rest(_a, ["value", "children", "error", "onChange", "grow"]);
-        return (React.createElement(Container, __assign({ error: error, grow: grow }, elemProps), React.Children.map(children, function (child, index) { return _this.renderChild(child, index, value); })));
-    };
-    RadioGroup.ErrorType = ErrorType;
-    return RadioGroup;
-}(React.Component));
+    render() {
+        const { value = 0, children, error, onChange, grow, ...elemProps } = this.props;
+        return (React.createElement(Container, Object.assign({ error: error, grow: grow }, elemProps), React.Children.map(children, (child, index) => this.renderChild(child, index, value))));
+    }
+}
+RadioGroup.ErrorType = ErrorType;
 RadioGroup.ErrorType = ErrorType;
-export { RadioGroup };

package/dist/es6/segmented-control/lib/SegmentedControl.d.ts

@@ -20,7 +20,7 @@ export interface SegmentedControlProps {
      */
     onChange?: (value: string | number) => void;
 }
-export declare const SegmentedControl: import("../../common").ElementComponent<"div", SegmentedControlProps> & {
-    Button: import("../../common").ElementComponent<"button", SegmentedControlButtonProps>;
+export declare const SegmentedControl: import("@workday/canvas-kit-react/common").ElementComponent<"div", SegmentedControlProps> & {
+    Button: import("@workday/canvas-kit-react/common").ElementComponent<"button", SegmentedControlButtonProps>;
 };
 //# sourceMappingURL=SegmentedControl.d.ts.map

package/dist/es6/segmented-control/lib/SegmentedControl.js

@@ -1,33 +1,11 @@
-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;
-};
 import * as React from 'react';
 import { createComponent } from '@workday/canvas-kit-react/common';
 import { SegmentedControlButton } from './SegmentedControlButton';
-var onButtonClick = function (existingOnClick, onChange, index, event) {
+const onButtonClick = (existingOnClick, onChange, index, event) => {
     if (existingOnClick) {
         existingOnClick(event);
     }
-    var target = event.currentTarget;
+    const target = event.currentTarget;
     if (target && onChange) {
         if (target.value) {
             onChange(target.value);
@@ -37,11 +15,10 @@ var onButtonClick = function (existingOnClick, onChange, index, event) {
         }
     }
 };
-export var SegmentedControl = createComponent('div')({
+export const SegmentedControl = createComponent('div')({
     displayName: 'SegmentedControl',
-    Component: function (_a, ref) {
-        var _b = _a.value, value = _b === void 0 ? 0 : _b, children = _a.children, onChange = _a.onChange, elemProps = __rest(_a, ["value", "children", "onChange"]);
-        return (React.createElement("div", __assign({}, elemProps), React.Children.map(children, function (child, index) {
+    Component: ({ value = 0, children, onChange, ...elemProps }, ref) => {
+        return (React.createElement("div", Object.assign({}, elemProps), React.Children.map(children, (child, index) => {
             if (typeof child.type === typeof SegmentedControlButton) {
                 return React.cloneElement(child, {
                     toggled: typeof value === 'number' ? index === value : child.props.value === value,

package/dist/es6/segmented-control/lib/SegmentedControlButton.d.ts

@@ -6,5 +6,5 @@ export interface SegmentedControlButtonProps extends ButtonContainerProps {
     value?: string | number;
     size?: 'small' | 'medium' | 'large';
 }
-export declare const SegmentedControlButton: import("../../common").ElementComponent<"button", SegmentedControlButtonProps>;
+export declare const SegmentedControlButton: import("@workday/canvas-kit-react/common").ElementComponent<"button", SegmentedControlButtonProps>;
 //# sourceMappingURL=SegmentedControlButton.d.ts.map

package/dist/es6/segmented-control/lib/SegmentedControlButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlButton.d.ts","sourceRoot":"","sources":["../../../../segmented-control/lib/SegmentedControlButton.tsx"],"names":[],"mappings":"AACA,OAAO,EAIL,oBAAoB,EACrB,MAAM,kCAAkC,CAAC;AAO1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAyF9D,MAAM,WAAW,2BAA4B,SAAQ,oBAAoB;IACvE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,EAAE,gBAAgB,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;CACrC;AAED,eAAO,MAAM,sBAAsB,gFAiBjC,CAAC"}
+{"version":3,"file":"SegmentedControlButton.d.ts","sourceRoot":"","sources":["../../../../segmented-control/lib/SegmentedControlButton.tsx"],"names":[],"mappings":"AACA,OAAO,EAIL,oBAAoB,EACrB,MAAM,kCAAkC,CAAC;AAO1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAyF9D,MAAM,WAAW,2BAA4B,SAAQ,oBAAoB;IACvE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,EAAE,gBAAgB,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;CACrC;AAED,eAAO,MAAM,sBAAsB,oGAiBjC,CAAC"}