@nulogy/components 15.2.2 → 15.2.3

package/dist/src/Button/ControlIcon.js

@@ -1,14 +1,3 @@
-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 React from "react";
 import styled from "styled-components";
 import { layout, space } from "styled-system";
@@ -38,9 +27,6 @@ const StyledButton = styled.button(({ toggled, disabled, theme }) => ({
         backgroundColor: theme.colors.lightGrey,
     },
 }), space, layout);
-const ControlIcon = React.forwardRef((_a, ref) => {
-    var { icon, toggled, disabled, label, size = "x4", type = "button" } = _a, props = __rest(_a, ["icon", "toggled", "disabled", "label", "size", "type"]);
-    return (React.createElement(StyledButton, Object.assign({ "aria-label": label, ref: ref, disabled: disabled, toggled: toggled, type: type }, props),
-        React.createElement(Icon, { size: size, icon: icon })));
-});
+const ControlIcon = React.forwardRef(({ icon, toggled, disabled, label, size = "x4", type = "button", ...props }, ref) => (React.createElement(StyledButton, { "aria-label": label, ref: ref, disabled: disabled, toggled: toggled, type: type, ...props },
+    React.createElement(Icon, { size: size, icon: icon }))));
 export default ControlIcon;

package/dist/src/Button/DangerButton.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ButtonProps } from "./Button";
 declare const DangerButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<ButtonProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>, never>> & string & Omit<import("react").ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>, keyof import("react").Component<any, {}, any>>;
 export default DangerButton;

package/dist/src/Button/IconicButton.js

@@ -1,14 +1,3 @@
-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 React from "react";
 import styled from "styled-components";
 import { space, variant } from "styled-system";
@@ -18,19 +7,16 @@ import icons from "@nulogy/icons";
 import { Icon } from "../Icon";
 import { Text } from "../Type";
 import { useComponentVariant } from "../NDSProvider/ComponentVariantContext";
-const IconWrapper = styled.span(({ theme, size }) => {
-    var _a, _b;
-    return ({
-        display: "inline-flex",
-        flexShrink: 0,
-        alignItems: "center",
-        justifyContent: "center",
-        borderRadius: theme.radii.rounded,
-        height: `calc(${(_a = theme.sizes[size]) !== null && _a !== void 0 ? _a : size} + ${theme.sizes.x1})`,
-        width: `calc(${(_b = theme.sizes[size]) !== null && _b !== void 0 ? _b : size} + ${theme.sizes.x1})`,
-        transition: ".2s",
-    });
-});
+const IconWrapper = styled.span(({ theme, size }) => ({
+    display: "inline-flex",
+    flexShrink: 0,
+    alignItems: "center",
+    justifyContent: "center",
+    borderRadius: theme.radii.rounded,
+    height: `calc(${theme.sizes[size] ?? size} + ${theme.sizes.x1})`,
+    width: `calc(${theme.sizes[size] ?? size} + ${theme.sizes.x1})`,
+    transition: ".2s",
+}));
 const HoverText = styled.div(({ theme }) => ({
     whiteSpace: "nowrap",
     ontSize: theme.fontSizes.small,
@@ -42,61 +28,58 @@ const HoverText = styled.div(({ theme }) => ({
     padding: `${theme.space.half} ${theme.space.x1}`,
     pointerEvents: "none",
 }));
-const WrapperButton = styled.button(({ disabled, hoverBackgroundColor, theme }) => {
-    var _a;
-    return ({
-        background: "transparent",
-        border: "none",
-        position: "relative",
-        display: "inline-flex",
-        alignItems: "center",
-        cursor: disabled ? "default" : "pointer",
-        [`${Text}`]: {
-            display: "block",
-            fontWeight: theme.fontWeights.medium,
-            textAlign: "left",
+const WrapperButton = styled.button(({ disabled, hoverBackgroundColor, theme }) => ({
+    background: "transparent",
+    border: "none",
+    position: "relative",
+    display: "inline-flex",
+    alignItems: "center",
+    cursor: disabled ? "default" : "pointer",
+    [`${Text}`]: {
+        display: "block",
+        fontWeight: theme.fontWeights.medium,
+        textAlign: "left",
+    },
+    [`${HoverText}`]: {
+        opacity: "0",
+    },
+    "&:hover": {
+        [`${IconWrapper}`]: {
+            backgroundColor: theme.colors[hoverBackgroundColor] ?? hoverBackgroundColor,
         },
         [`${HoverText}`]: {
-            opacity: "0",
+            opacity: "1",
         },
-        "&:hover": {
-            [`${IconWrapper}`]: {
-                backgroundColor: (_a = theme.colors[hoverBackgroundColor]) !== null && _a !== void 0 ? _a : hoverBackgroundColor,
-            },
-            [`${HoverText}`]: {
-                opacity: "1",
-            },
+    },
+    "&:active": {
+        [`${IconWrapper}`]: {
+            transform: "scale(0.875)",
+            transition: ".2s ease-in",
         },
-        "&:active": {
+    },
+    "&:disabled": {
+        opacity: ".5",
+        "&:hover, &:active": {
             [`${IconWrapper}`]: {
-                transform: "scale(0.875)",
-                transition: ".2s ease-in",
+                background: "none",
+                transform: "none",
             },
         },
-        "&:disabled": {
-            opacity: ".5",
-            "&:hover, &:active": {
-                [`${IconWrapper}`]: {
-                    background: "none",
-                    transform: "none",
-                },
-            },
+    },
+    "&:focus": {
+        outline: "none",
+        [`${IconWrapper}`]: {
+            boxShadow: theme.shadows.focus,
         },
-        "&:focus": {
-            outline: "none",
-            [`${IconWrapper}`]: {
-                boxShadow: theme.shadows.focus,
-            },
-            [`${HoverText}`]: {
-                opacity: "1",
-            },
+        [`${HoverText}`]: {
+            opacity: "1",
         },
-        paddingTop: theme.space.half,
-        paddingBottom: theme.space.half,
-        paddingLeft: theme.space.none,
-        paddingRight: theme.space.none,
-    });
-}, variant({
+    },
+    paddingTop: theme.space.half,
+    paddingBottom: theme.space.half,
+    paddingLeft: theme.space.none,
+    paddingRight: theme.space.none,
+}), variant({
     variants: {
         touch: {
             fontSize: "md",
@@ -104,10 +87,9 @@ const WrapperButton = styled.button(({ disabled, hoverBackgroundColor, theme })
         },
     },
 }), space);
-const IconicButton = React.forwardRef((_a, forwardedRef) => {
-    var { children, color = "darkBlue", hoverBackgroundColor = "lightBlue", icon, labelHidden, className, iconSize = "x3", fontSize, tooltip, variant } = _a, props = __rest(_a, ["children", "color", "hoverBackgroundColor", "icon", "labelHidden", "className", "iconSize", "fontSize", "tooltip", "variant"]);
+const IconicButton = React.forwardRef(({ children, color = "darkBlue", hoverBackgroundColor = "lightBlue", icon, labelHidden, className, iconSize = "x3", fontSize, tooltip, variant, ...props }, forwardedRef) => {
     const componentVariant = useComponentVariant(variant);
-    return (React.createElement(WrapperButton, Object.assign({ ref: forwardedRef, "aria-label": props["aria-label"] ? props["aria-label"] : typeof children === "string" ? children : undefined, className: className, hoverBackgroundColor: hoverBackgroundColor, variant: componentVariant }, props),
+    return (React.createElement(WrapperButton, { ref: forwardedRef, "aria-label": props["aria-label"] ? props["aria-label"] : typeof children === "string" ? children : undefined, className: className, hoverBackgroundColor: hoverBackgroundColor, variant: componentVariant, ...props },
         React.createElement(Manager, null,
             React.createElement(Reference, null, ({ ref }) => (React.createElement(IconWrapper, { ref: ref, size: iconSize },
                 React.createElement(Icon, { size: iconSize, icon: icon, color: color })))),

package/dist/src/Button/PrimaryButton.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ButtonProps } from "./Button";
 declare const PrimaryButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<ButtonProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>, never>> & string & Omit<import("react").ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>, keyof import("react").Component<any, {}, any>>;
 export default PrimaryButton;

package/dist/src/Button/QuietButton.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ButtonProps } from "./Button";
 declare const QuietButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<ButtonProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>, never>> & string & Omit<import("react").ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>, keyof import("react").Component<any, {}, any>>;
 export default QuietButton;

package/dist/src/ButtonGroup/ButtonGroup.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { FlexProps } from "../Flex/Flex";
 type ButtonGroupProps = FlexProps & {
     children?: React.ReactNode;

package/dist/src/ButtonGroup/ButtonGroup.js

@@ -24,7 +24,13 @@ const buttonSpacings = (theme) => ({
 });
 const getAlignment = (alignment) => alignments[alignment] || alignments.left;
 const getButtonSpacing = (alignment, theme) => buttonSpacings(theme)[alignment] || buttonSpacings(theme).left;
-const ButtonGroup = styled(Flex)(({ alignment = "left", theme }) => (Object.assign({ flexWrap: "wrap", marginBottom: `-${theme.space.x1}`, justifyContent: getAlignment(alignment), button: {
+const ButtonGroup = styled(Flex)(({ alignment = "left", theme }) => ({
+    flexWrap: "wrap",
+    marginBottom: `-${theme.space.x1}`,
+    justifyContent: getAlignment(alignment),
+    button: {
         marginBottom: theme.space.x1,
-    } }, getButtonSpacing(alignment, theme))));
+    },
+    ...getButtonSpacing(alignment, theme),
+}));
 export default ButtonGroup;

package/dist/src/Card/Card.js

@@ -1,17 +1,5 @@
-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 React from "react";
 import { Box } from "../Box";
-export default function Card(_a) {
-    var { borderRadius = "medium", boxShadow = "small", py = "x2", px = "x2", position = "relative", children } = _a, props = __rest(_a, ["borderRadius", "boxShadow", "py", "px", "position", "children"]);
-    return (React.createElement(Box, Object.assign({ border: "1px solid", borderColor: "lightGrey", borderRadius: borderRadius, boxShadow: boxShadow, py: py, px: px, position: position }, props), children));
+export default function Card({ borderRadius = "medium", boxShadow = "small", py = "x2", px = "x2", position = "relative", children, ...props }) {
+    return (React.createElement(Box, { border: "1px solid", borderColor: "lightGrey", borderRadius: borderRadius, boxShadow: boxShadow, py: py, px: px, position: position, ...props }, children));
 }

package/dist/src/Card/Card.story.js

@@ -47,7 +47,7 @@ export const AdvancedUsage = () => {
             React.createElement(TopBar.BackLink, { href: "/cycle-counts" }, "Cycle counts"),
             React.createElement(TopBar.PageTitle, null, "Cycle count #3992"),
             React.createElement(TopBar.Menu, null, menuItems.map((props) => (React.createElement(TopBar.MenuItem, { key: props.title },
-                React.createElement(TopBar.MenuItemLink, Object.assign({}, props))))))) },
+                React.createElement(TopBar.MenuItemLink, { ...props })))))) },
         React.createElement(Page, { fullHeight: true },
             React.createElement(CardSet, null, [...Array(10)].map((_, i) => (React.createElement(AdvancedCard, { key: i })))))));
 };

package/dist/src/Card/CardSet.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 declare const CardSet: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import("../Box").BoxProps> & import("../Box").BoxProps, keyof import("../Flex/Flex").FlexProps> & import("../Flex/Flex").FlexProps, never>> & string;
 export default CardSet;

package/dist/src/Checkbox/Checkbox.js

@@ -68,7 +68,16 @@ const VisualCheckbox = styled.div(({ indeterminate, theme }) => ({
         marginBottom: theme.space.x0_5,
     },
     // checkmark
-    "&:before": Object.assign({ content: "''", display: "none", position: "relative", left: theme.space.half, width: theme.sizes.half, height: theme.sizes.x1, border: `solid ${theme.colors.white}` }, (indeterminate ? indeterminateStyles : checkedStyles)),
+    "&:before": {
+        content: "''",
+        display: "none",
+        position: "relative",
+        left: theme.space.half,
+        width: theme.sizes.half,
+        height: theme.sizes.x1,
+        border: `solid ${theme.colors.white}`,
+        ...(indeterminate ? indeterminateStyles : checkedStyles),
+    },
 }), addStyledProps);
 const CheckboxInput = styled.input((props) => ({
     position: "absolute",
@@ -78,19 +87,24 @@ const CheckboxInput = styled.input((props) => ({
     [`&:focus + ${VisualCheckbox}`]: {
         boxShadow: props.theme.shadows.focus,
     },
-    [`&:checked + ${VisualCheckbox}`]: Object.assign(Object.assign({}, getCheckboxStyle(props, "checked")), { "&:before": {
+    [`&:checked + ${VisualCheckbox}`]: {
+        ...getCheckboxStyle(props, "checked"),
+        "&:before": {
             display: "block",
-        } }),
-    [`&:not(:checked) + ${VisualCheckbox}`]: Object.assign({}, getCheckboxStyle(props, "unchecked")),
+        },
+    },
+    [`&:not(:checked) + ${VisualCheckbox}`]: {
+        ...getCheckboxStyle(props, "unchecked"),
+    },
 }));
 const Checkbox = forwardRef((props, ref) => {
     const { variant, className, labelText, disabled, checked, required, error, indeterminate } = props;
     const componentVariant = useComponentVariant(variant);
     const spaceProps = getSubset(props, propTypes.space);
     const restProps = omitSubset(props, propTypes.space);
-    return (React.createElement(Box, Object.assign({ className: className, px: "0" }, spaceProps),
+    return (React.createElement(Box, { className: className, px: "0", ...spaceProps },
         React.createElement(ClickInputLabel, { variant: componentVariant, disabled: disabled },
-            React.createElement(CheckboxInput, Object.assign({ type: "checkbox", required: required, "aria-required": required, "aria-invalid": error, indeterminate: indeterminate, ref: ref }, restProps)),
+            React.createElement(CheckboxInput, { type: "checkbox", required: required, "aria-required": required, "aria-invalid": error, indeterminate: indeterminate, ref: ref, ...restProps }),
             React.createElement(VisualCheckbox, { disabled: disabled, checked: checked, indeterminate: indeterminate, "data-testid": "visual-checkbox" }),
             labelText && (React.createElement(Text, { fontSize: componentVariant === "touch" ? "md" : undefined, lineHeight: componentVariant === "touch" ? "base" : undefined, disabled: disabled, ml: "x1" }, labelText)))));
 });

package/dist/src/Checkbox/Checkbox.story.js

@@ -4,7 +4,10 @@ class CheckboxWithState extends React.Component {
     constructor(props) {
         super(props);
         this.handleChange = (key) => {
-            this.setState((state) => (Object.assign(Object.assign({}, state), { [key]: !state[key] })));
+            this.setState((state) => ({
+                ...state,
+                [key]: !state[key],
+            }));
         };
         this.state = { checkbox1: false, checkbox2: false };
     }

package/dist/src/Checkbox/CheckboxGroup.js

@@ -1,14 +1,3 @@
-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 React from "react";
 import styled from "styled-components";
 import { HelpText, RequirementText } from "../FieldLabel";
@@ -18,9 +7,8 @@ import { InlineIcon } from "../Icon";
 import { Tooltip } from "../Tooltip";
 import LabelText, { LabelContent } from "../FieldLabel/LabelText";
 import Checkbox from "./Checkbox";
-export default function CheckboxGroup(_a) {
-    var { className, id, errorMessage, errorList, labelText, helpText, requirementText, hint } = _a, props = __rest(_a, ["className", "id", "errorMessage", "errorList", "labelText", "helpText", "requirementText", "hint"]);
-    const otherProps = Object.assign(Object.assign({}, props), { errorMessage, errorList });
+export default function CheckboxGroup({ className, id, errorMessage, errorList, labelText, helpText, requirementText, hint, ...props }) {
+    const otherProps = { ...props, errorMessage, errorList };
     return (React.createElement(Fieldset, { className: className, id: id },
         React.createElement(Legend, null,
             React.createElement(LabelContent, { "data-testid": "label-content" },
@@ -34,8 +22,8 @@ export default function CheckboxGroup(_a) {
 }
 const getCheckboxButtons = (props) => {
     const checkboxButtons = React.Children.map(props.children, (checkbox) => {
-        const _a = checkbox.props, { value, disabled, required, onChange } = _a, checkboxProps = __rest(_a, ["value", "disabled", "required", "onChange"]);
-        return (React.createElement(Checkbox, Object.assign({}, checkboxProps, { value: value, disabled: props.disabled || disabled, error: !!(props.errorMessage || props.errorList), required: props.required || required, name: props.name, defaultChecked: props.defaultValue ? props.defaultValue.includes(value) : undefined, checked: props.checkedValue ? props.checkedValue.includes(value) : undefined, onChange: props.onChange || onChange })));
+        const { value, disabled, required, onChange, ...checkboxProps } = checkbox.props;
+        return (React.createElement(Checkbox, { ...checkboxProps, value: value, disabled: props.disabled || disabled, error: !!(props.errorMessage || props.errorList), required: props.required || required, name: props.name, defaultChecked: props.defaultValue ? props.defaultValue.includes(value) : undefined, checked: props.checkedValue ? props.checkedValue.includes(value) : undefined, onChange: props.onChange || onChange }));
     });
     return checkboxButtons;
 };

package/dist/src/DatePickers/DatePicker.js

@@ -1,22 +1,10 @@
-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 React, { forwardRef, useState, useEffect } from "react";
 import { subDays, addDays, isValid, isAfter, isBefore, isSameDay } from "date-fns";
 import { BasePicker } from "./shared/components/BasePicker";
 import { DatePickerHeader } from "./shared/components/DatePickerHeader";
 const DEFAULT_DATE_FORMAT = "yyyy-MMM-dd";
 const DEFAULT_PLACEHOLDER = "YYYY-Mon-DD";
-const DatePicker = forwardRef((_a, datePickerRef) => {
-    var { selected, dateFormat = DEFAULT_DATE_FORMAT, onChange } = _a, props = __rest(_a, ["selected", "dateFormat", "onChange"]);
+const DatePicker = forwardRef(({ selected, dateFormat = DEFAULT_DATE_FORMAT, onChange, ...props }, datePickerRef) => {
     const [selectedDate, setSelectedDate] = useState(selected);
     const [ref] = useState(null);
     useEffect(() => {
@@ -46,6 +34,6 @@ const DatePicker = forwardRef((_a, datePickerRef) => {
             ref.setOpen(!isOpen);
         }
     };
-    return (React.createElement(BasePicker, Object.assign({}, props, { selected: selectedDate, dateFormat: dateFormat, onChange: handleSelectedDateChange, ref: datePickerRef, defaultFormat: DEFAULT_DATE_FORMAT, defaultPlaceholder: DEFAULT_PLACEHOLDER, showMonthYearPicker: false, disabledKeyboardNavigation: true, onUpKeyPress: handleUpKey, onDownKeyPress: handleDownKey, onEnterKeyPress: handleEnterKey, renderHeader: (headerProps) => (React.createElement(DatePickerHeader, Object.assign({ locale: props.locale }, headerProps))) })));
+    return (React.createElement(BasePicker, { ...props, selected: selectedDate, dateFormat: dateFormat, onChange: handleSelectedDateChange, ref: datePickerRef, defaultFormat: DEFAULT_DATE_FORMAT, defaultPlaceholder: DEFAULT_PLACEHOLDER, showMonthYearPicker: false, disabledKeyboardNavigation: true, onUpKeyPress: handleUpKey, onDownKeyPress: handleDownKey, onEnterKeyPress: handleEnterKey, renderHeader: (headerProps) => (React.createElement(DatePickerHeader, { locale: props.locale, ...headerProps })) }));
 });
 export default DatePicker;

package/dist/src/DatePickers/MonthPicker.js

@@ -1,22 +1,10 @@
-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 React, { forwardRef, useState, useEffect } from "react";
 import { noop } from "../utils/noop";
 import { BasePicker } from "./shared/components/BasePicker";
 import { MonthDatePickerHeader } from "./custom/MonthPickerHeader";
 export const DEFAULT_MONTH_FORMAT = "yyyy-MMM";
 export const DEFAULT_PLACEHOLDER = "YYYY-Mon";
-const MonthPicker = forwardRef((_a, monthPickerRef) => {
-    var { selected, dateFormat = DEFAULT_MONTH_FORMAT, onChange } = _a, props = __rest(_a, ["selected", "dateFormat", "onChange"]);
+const MonthPicker = forwardRef(({ selected, dateFormat = DEFAULT_MONTH_FORMAT, onChange, ...props }, monthPickerRef) => {
     const [selectedDate, setSelectedDate] = useState(selected);
     const [ref] = useState(null);
     useEffect(() => {
@@ -36,6 +24,6 @@ const MonthPicker = forwardRef((_a, monthPickerRef) => {
             ref.setOpen(!isOpen);
         }
     };
-    return (React.createElement(BasePicker, Object.assign({}, props, { selected: selectedDate, onChange: handleSelectedDateChange, ref: monthPickerRef, dateFormat: dateFormat, defaultFormat: DEFAULT_MONTH_FORMAT, defaultPlaceholder: DEFAULT_PLACEHOLDER, showMonthYearPicker: true, renderHeader: (headerProps) => (React.createElement(MonthDatePickerHeader, Object.assign({ locale: props.locale }, headerProps))), onUpKeyPress: handleUpKey, onDownKeyPress: handleDownKey, onEnterKeyPress: handleEnterKey })));
+    return (React.createElement(BasePicker, { ...props, selected: selectedDate, onChange: handleSelectedDateChange, ref: monthPickerRef, dateFormat: dateFormat, defaultFormat: DEFAULT_MONTH_FORMAT, defaultPlaceholder: DEFAULT_PLACEHOLDER, showMonthYearPicker: true, renderHeader: (headerProps) => (React.createElement(MonthDatePickerHeader, { locale: props.locale, ...headerProps })), onUpKeyPress: handleUpKey, onDownKeyPress: handleDownKey, onEnterKeyPress: handleEnterKey }));
 });
 export default MonthPicker;

package/dist/src/DatePickers/WeekPicker.js

@@ -1,14 +1,3 @@
-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 propTypes from "@styled-system/prop-types";
 import { addDays, endOfWeek, getWeek, getYear, isAfter, isBefore, isSameDay, isValid, startOfWeek, subDays, } from "date-fns";
 import React, { forwardRef, useEffect, useState } from "react";
@@ -40,8 +29,7 @@ const roundMaxDateToWeekEnd = (date) => {
     const weekEnd = endOfWeek(date, { weekStartsOn: WEEK_START_DAY });
     return isBefore(date, weekEnd) ? addDays(startOfWeek(date, { weekStartsOn: WEEK_START_DAY }), -1) : weekEnd;
 };
-const WeekPicker = forwardRef((_a, datePickerRef) => {
-    var { dateFormat, errorMessage, errorList, inputProps, minDate, maxDate, locale, disableFlipping, className, onInputChange, onChange, onBlur, onFocus, selected } = _a, props = __rest(_a, ["dateFormat", "errorMessage", "errorList", "inputProps", "minDate", "maxDate", "locale", "disableFlipping", "className", "onInputChange", "onChange", "onBlur", "onFocus", "selected"]);
+const WeekPicker = forwardRef(({ dateFormat, errorMessage, errorList, inputProps, minDate, maxDate, locale, disableFlipping, className, onInputChange, onChange, onBlur, onFocus, selected, ...props }, datePickerRef) => {
     const [selectedDate, setSelectedDate] = useState(selected);
     const { locale: contextLocale } = useLocale();
     const { i18n } = useTranslation();
@@ -111,7 +99,7 @@ const WeekPicker = forwardRef((_a, datePickerRef) => {
         }
     };
     const renderCustomHeader = (props) => {
-        return React.createElement(DatePickerHeader, Object.assign({ locale: currentLocale }, props));
+        return React.createElement(DatePickerHeader, { locale: currentLocale, ...props });
     };
     const weekPickerRefHandler = (r) => {
         if (datePickerRef) {
@@ -119,10 +107,15 @@ const WeekPicker = forwardRef((_a, datePickerRef) => {
         }
         onRefChange(r);
     };
-    const customInputProps = Object.assign(Object.assign(Object.assign(Object.assign({}, InputFieldDefaultProps), { error: !!(errorMessage || errorList) }), inputProps), { placeholder: (inputProps && inputProps.placeholder) ||
-            (finalDateFormat === defaultDateFormat ? defaultPlaceholder : finalDateFormat) });
+    const customInputProps = {
+        ...InputFieldDefaultProps,
+        error: !!(errorMessage || errorList),
+        ...inputProps,
+        placeholder: (inputProps && inputProps.placeholder) ||
+            (finalDateFormat === defaultDateFormat ? defaultPlaceholder : finalDateFormat),
+    };
     const customInput = (React.createElement(DatePickerInput, { locale: currentLocale, variant: componentVariant, inputProps: customInputProps, dateFormat: finalDateFormat, onInputChange: handleInputChange, onUpKeyPress: handleUpKey, onDownKeyPress: handleDownKey, onEnterKeyPress: handleEnterKey }));
-    return (React.createElement(Field, Object.assign({ className: `${className} nds-date-picker` }, spaceProps),
+    return (React.createElement(Field, { className: `${className} nds-date-picker`, ...spaceProps },
         React.createElement(DatePickerStyles, null),
         React.createElement(WeekPickerStyles, { variant: componentVariant }),
         React.createElement(ReactDatePicker, { showWeekNumbers: true, showWeekPicker: true, weekLabel: weekShorthand, calendarStartDay: WEEK_START_DAY, selected: selectedDate, openToDate: selectedDate, dateFormat: finalDateFormat, onChange: handleSelectedDateChange, customInput: customInput, renderCustomHeader: renderCustomHeader, strictParsing: true, minDate: roundedMinDate, maxDate: roundedMaxDate, locale: NDS_TO_DATE_FN_LOCALES_MAP[currentLocale], ref: weekPickerRefHandler, onFocus: onFocus, onBlur: onBlur, popperModifiers: getPopperModifiers(disableFlipping), disabledKeyboardNavigation: true }),

package/dist/src/DatePickers/custom/weekPickerStyles.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ComponentVariant } from "../../NDSProvider/ComponentVariantContext";
 export declare const WeekPickerStyles: import("react").NamedExoticComponent<import("styled-components").ExecutionProps & {
     variant: ComponentVariant;

package/dist/src/DatePickers/shared/components/BasePicker.js

@@ -1,14 +1,3 @@
-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 React, { forwardRef, useState } from "react";
 import propTypes from "@styled-system/prop-types";
 import ReactDatePicker from "react-datepicker";
@@ -23,8 +12,7 @@ import { InlineValidation } from "../../../Validation";
 import { DatePickerStyles } from "../styles";
 import { getPopperModifiers } from "../helpers";
 import DatePickerInput from "./DatePickerInput";
-export const BasePicker = forwardRef((_a, pickerRef) => {
-    var { dateFormat, errorMessage, errorList, inputProps, minDate, maxDate, disableFlipping, className, onInputChange, onChange, onBlur, onFocus, selected, highlightDates, defaultFormat, defaultPlaceholder, showMonthYearPicker, showWeekNumbers, renderHeader, onUpKeyPress, onDownKeyPress, onEnterKeyPress, locale, disabledKeyboardNavigation, name, required } = _a, props = __rest(_a, ["dateFormat", "errorMessage", "errorList", "inputProps", "minDate", "maxDate", "disableFlipping", "className", "onInputChange", "onChange", "onBlur", "onFocus", "selected", "highlightDates", "defaultFormat", "defaultPlaceholder", "showMonthYearPicker", "showWeekNumbers", "renderHeader", "onUpKeyPress", "onDownKeyPress", "onEnterKeyPress", "locale", "disabledKeyboardNavigation", "name", "required"]);
+export const BasePicker = forwardRef(({ dateFormat, errorMessage, errorList, inputProps, minDate, maxDate, disableFlipping, className, onInputChange, onChange, onBlur, onFocus, selected, highlightDates, defaultFormat, defaultPlaceholder, showMonthYearPicker, showWeekNumbers, renderHeader, onUpKeyPress, onDownKeyPress, onEnterKeyPress, locale, disabledKeyboardNavigation, name, required, ...props }, pickerRef) => {
     const { locale: contextLocale } = useLocale();
     const [ref, setRef] = useState(null);
     const componentVariant = useComponentVariant();
@@ -48,7 +36,13 @@ export const BasePicker = forwardRef((_a, pickerRef) => {
             ref.setOpen(!isOpen);
         }
     };
-    const customInputProps = Object.assign(Object.assign(Object.assign(Object.assign({}, InputFieldDefaultProps), { inputWidth: componentVariant === "touch" ? "280px" : "184px", error: !!(errorMessage || errorList) }), inputProps), { placeholder: (inputProps && inputProps.placeholder) || (dateFormat === defaultFormat ? defaultPlaceholder : dateFormat) });
+    const customInputProps = {
+        ...InputFieldDefaultProps,
+        inputWidth: componentVariant === "touch" ? "280px" : "184px",
+        error: !!(errorMessage || errorList),
+        ...inputProps,
+        placeholder: (inputProps && inputProps.placeholder) || (dateFormat === defaultFormat ? defaultPlaceholder : dateFormat),
+    };
     const customInput = (React.createElement(DatePickerInput, { locale: currentLocale, variant: componentVariant, inputProps: customInputProps, dateFormat: dateFormat, onInputChange: handleInputChange, onUpKeyPress: onUpKeyPress, onDownKeyPress: onDownKeyPress, onEnterKeyPress: handleEnterKey }));
     const pickerRefHandler = (r) => {
         if (pickerRef) {
@@ -57,7 +51,7 @@ export const BasePicker = forwardRef((_a, pickerRef) => {
         onRefChange(r);
     };
     const spaceProps = getSubset(props, propTypes.space);
-    return (React.createElement(Field, Object.assign({ className: `${className} nds-date-picker` }, spaceProps),
+    return (React.createElement(Field, { className: `${className} nds-date-picker`, ...spaceProps },
         React.createElement(DatePickerStyles, null),
         React.createElement(ReactDatePicker, { highlightDates: highlightDates, selected: selected, openToDate: selected, dateFormat: dateFormat, onChange: onChange, customInput: customInput, renderCustomHeader: renderHeader, strictParsing: true, minDate: minDate, maxDate: maxDate, locale: NDS_TO_DATE_FN_LOCALES_MAP[currentLocale], ref: pickerRefHandler, onFocus: onFocus, onBlur: onBlur, showMonthYearPicker: showMonthYearPicker, showWeekNumbers: showWeekNumbers, name: name, required: required, onEnterKeyPress: onEnterKeyPress, popperModifiers: getPopperModifiers(disableFlipping), disabledKeyboardNavigation: disabledKeyboardNavigation }),
         React.createElement(InlineValidation, { mt: "x1", errorMessage: errorMessage, errorList: errorList })));

package/dist/src/DatePickers/shared/components/DatePickerInput.js

@@ -1,20 +1,9 @@
-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 React, { forwardRef } from "react";
 import { useTranslation } from "react-i18next";
 import { InputField, InputFieldDefaultProps } from "../../../Input/InputField";
 const DatePickerInput = forwardRef(({ onChange, onClick, onBlur, onFocus, onInputChange, value, inputProps = InputFieldDefaultProps, onUpKeyPress, onDownKeyPress, onEnterKeyPress, variant, locale, "aria-label": ariaLabel, }, ref) => {
     const { i18n } = useTranslation();
-    const { placeholder } = inputProps, inputFieldProps = __rest(inputProps, ["placeholder"]);
+    const { placeholder, ...inputFieldProps } = inputProps;
     const handleChange = (event) => {
         onInputChange(event);
         if (onChange) {
@@ -40,6 +29,6 @@ const DatePickerInput = forwardRef(({ onChange, onClick, onBlur, onFocus, onInpu
                 break;
         }
     };
-    return (React.createElement(InputField, Object.assign({ onBlur: onBlur, onFocus: onFocus, ref: ref, variant: variant, "aria-label": ariaLabel || t("select a date"), autoComplete: "off", value: value, placeholder: placeholder, iconRight: "calendarToday", iconRightSize: "x2", onClick: onClick, onKeyDown: handleKeyDown, onChange: handleChange }, inputFieldProps)));
+    return (React.createElement(InputField, { onBlur: onBlur, onFocus: onFocus, ref: ref, variant: variant, "aria-label": ariaLabel || t("select a date"), autoComplete: "off", value: value, placeholder: placeholder, iconRight: "calendarToday", iconRightSize: "x2", onClick: onClick, onKeyDown: handleKeyDown, onChange: handleChange, ...inputFieldProps }));
 });
 export default DatePickerInput;

package/dist/src/DatePickers/shared/styles.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare const DatePickerStyles: import("react").NamedExoticComponent<import("styled-components").ExecutionProps & object>;

package/dist/src/DatePickers/shared/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ReactDatePickerProps } from "react-datepicker";
 import { InputFieldProps } from "../../Input/InputField";
 import { FieldProps } from "../../Form/Field";

package/dist/src/DatePickers/stories/WeekPicker.story.js

@@ -33,7 +33,7 @@ export const AdvancedUsage = () => {
         setInputValue(value);
         // Custom validation could be implemented here
     };
-    return (React.createElement(WeekPicker, { selected: selectedWeek === null || selectedWeek === void 0 ? void 0 : selectedWeek.startDate, onChange: handleWeekChange, onInputChange: handleInputChange, minDate: new Date(2023, 0, 1), maxDate: new Date(), errorMessage: hasError ? "Please select a valid week" : undefined, inputProps: {
+    return (React.createElement(WeekPicker, { selected: selectedWeek?.startDate, onChange: handleWeekChange, onInputChange: handleInputChange, minDate: new Date(2023, 0, 1), maxDate: new Date(), errorMessage: hasError ? "Please select a valid week" : undefined, inputProps: {
             value: inputValue,
             inputWidth: "560px",
             placeholder: "Select a week",