@nulogy/components 15.2.2 → 15.2.3

package/dist/src/Tabs/TabScrollIndicator.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 styled from "styled-components";
 import React from "react";
 import { useTranslation } from "react-i18next";
@@ -47,15 +36,14 @@ const TabScrollIndicatorButton = styled.button(({ side, width, theme }) => ({
         opacity: ".5",
     },
 }));
-const TabScrollIndicator = (_a) => {
-    var { side = "left", width = 40, ariaLabelLeft, ariaLabelRight, onClick } = _a, props = __rest(_a, ["side", "width", "ariaLabelLeft", "ariaLabelRight", "onClick"]);
+const TabScrollIndicator = ({ side = "left", width = 40, ariaLabelLeft, ariaLabelRight, onClick, ...props }) => {
     const { t } = useTranslation();
     const rightArrowLabel = ariaLabelRight || t("next");
     const leftArrowLabel = ariaLabelLeft || t("previous");
     function preventFocusMovement(event) {
         event.preventDefault();
     }
-    return (React.createElement(TabScrollIndicatorButton, Object.assign({}, props, { width: width, tabIndex: -1, onClick: onClick, onMouseDown: preventFocusMovement, side: side, "aria-label": side === "right" ? rightArrowLabel : leftArrowLabel }),
+    return (React.createElement(TabScrollIndicatorButton, { ...props, width: width, tabIndex: -1, onClick: onClick, onMouseDown: preventFocusMovement, side: side, "aria-label": side === "right" ? rightArrowLabel : leftArrowLabel },
         React.createElement(Icon, { icon: side === "right" ? "rightArrow" : "leftArrow" })));
 };
 export default TabScrollIndicator;

package/dist/src/Tabs/Tabs.js

@@ -28,7 +28,7 @@ class Tabs extends React.Component {
     }
     getTabs(setFocusToTab, focusedIndex, handleArrowNavigation) {
         const { fitted, children, onTabClick, variant } = this.props;
-        const componentVariant = variant !== null && variant !== void 0 ? variant : this.context.size;
+        const componentVariant = variant ?? this.context.size;
         const selectedIndex = this.getSelectedIndex();
         const tabs = React.Children.toArray(children);
         return tabs
@@ -36,10 +36,9 @@ class Tabs extends React.Component {
             .map((tab, index) => {
             return React.cloneElement(tab, {
                 onClick: (e) => {
-                    var _a, _b;
                     setFocusToTab(index);
-                    if ((_a = tab === null || tab === void 0 ? void 0 : tab.props) === null || _a === void 0 ? void 0 : _a.onClick) {
-                        (_b = tab === null || tab === void 0 ? void 0 : tab.props) === null || _b === void 0 ? void 0 : _b.onClick(e);
+                    if (tab?.props?.onClick) {
+                        tab?.props?.onClick(e);
                     }
                     if (onTabClick) {
                         onTabClick(e, index);
@@ -71,13 +70,12 @@ class Tabs extends React.Component {
         const tabContent = tabs
             .filter((tab) => Boolean(tab))
             .map((tab, index) => {
-            var _a;
             const selected = index === selectedIndex;
             if (renderTabContentOnlyWhenSelected && !selected) {
                 return null;
             }
             else {
-                return (React.createElement("div", { "aria-hidden": !selected, hidden: !selected, selected: selected, key: tab.key || tab.label }, (_a = tab === null || tab === void 0 ? void 0 : tab.props) === null || _a === void 0 ? void 0 : _a.children));
+                return (React.createElement("div", { "aria-hidden": !selected, hidden: !selected, selected: selected, key: tab.key || tab.label }, tab?.props?.children));
             }
         });
         return tabContent;
@@ -91,7 +89,7 @@ class Tabs extends React.Component {
         const { className } = this.props;
         const spaceProps = getSubset(this.props, propTypes.space);
         return (React.createElement(Box, { position: "relative" },
-            React.createElement(FocusManager, { refs: this.tabRefs, defaultFocusedIndex: this.getSelectedIndex() }, ({ focusedIndex, setFocusedIndex, handleArrowNavigation }) => (React.createElement(TabScrollIndicators, { tabRefs: this.tabRefs, tabContainerRef: this.tabContainerRef }, ({ handleScroll, handleResize }) => (React.createElement(TabContainer, Object.assign({ className: className, role: "tablist", onScroll: handleScroll, ref: this.tabContainerRef }, spaceProps),
+            React.createElement(FocusManager, { refs: this.tabRefs, defaultFocusedIndex: this.getSelectedIndex() }, ({ focusedIndex, setFocusedIndex, handleArrowNavigation }) => (React.createElement(TabScrollIndicators, { tabRefs: this.tabRefs, tabContainerRef: this.tabContainerRef }, ({ handleScroll, handleResize }) => (React.createElement(TabContainer, { className: className, role: "tablist", onScroll: handleScroll, ref: this.tabContainerRef, ...spaceProps },
                 React.createElement(ReactResizeDetector, { handleWidth: true, onResize: handleResize }),
                 this.getTabs(setFocusedIndex, focusedIndex, handleArrowNavigation)))))),
             this.getTabContent()));

package/dist/src/Textarea/Textarea.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 } from "react";
 import propTypes from "@styled-system/prop-types";
 import { Field } from "../Form";
@@ -17,14 +6,13 @@ import { InlineValidation } from "../Validation";
 import { getSubset, omitSubset } from "../utils/subset";
 import { useComponentVariant } from "../NDSProvider/ComponentVariantContext";
 import StyledTextarea from "./StyledTextarea";
-const Textarea = forwardRef((_a, ref) => {
-    var { disabled = false, required = false, rows = 3, errorMessage, errorList, error = !!(errorMessage || errorList), labelText, requirementText, helpText, id, className, isResizeable = true, variant } = _a, props = __rest(_a, ["disabled", "required", "rows", "errorMessage", "errorList", "error", "labelText", "requirementText", "helpText", "id", "className", "isResizeable", "variant"]);
+const Textarea = forwardRef(({ disabled = false, required = false, rows = 3, errorMessage, errorList, error = !!(errorMessage || errorList), labelText, requirementText, helpText, id, className, isResizeable = true, variant, ...props }, ref) => {
     const componentVariant = useComponentVariant(variant);
     const spaceProps = getSubset(props, propTypes.space);
     const restProps = omitSubset(props, propTypes.space);
-    return (React.createElement(Field, Object.assign({ className: className }, spaceProps),
+    return (React.createElement(Field, { className: className, ...spaceProps },
         React.createElement(MaybeFieldLabel, { labelText: labelText, requirementText: requirementText, helpText: helpText },
-            React.createElement(StyledTextarea, Object.assign({ "aria-invalid": error, "aria-required": required, required: required, id: id, ref: ref, errorMessage: errorMessage, errorList: errorList, error: error, rows: rows, isResizeable: isResizeable, variant: componentVariant, disabled: disabled }, restProps))),
+            React.createElement(StyledTextarea, { "aria-invalid": error, "aria-required": required, required: required, id: id, ref: ref, errorMessage: errorMessage, errorList: errorList, error: error, rows: rows, isResizeable: isResizeable, variant: componentVariant, disabled: disabled, ...restProps })),
         React.createElement(InlineValidation, { mt: "x1", errorMessage: errorMessage, errorList: errorList })));
 });
 export default Textarea;

package/dist/src/TimePicker/TimePicker.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;
-};
 // @ts-nocheck
 import React, { useState, useContext, useEffect, forwardRef, useRef, useCallback } from "react";
 import { setMinutes } from "date-fns";
@@ -100,8 +89,7 @@ export const getTimeOptions = (interval, timeFormat, minTime, maxTime, locale) =
         .sort((a, b) => getIntervalFromTime(a.value, interval) - getIntervalFromTime(b.value, interval))
         .slice(startingInterval, finalInterval);
 };
-const TimePicker = forwardRef((_a, inputRef) => {
-    var { timeFormat, interval, className, minTime, maxTime, defaultValue, onInputChange, onBlur, onFocus, errorMessage, errorList, labelText, placeholder, onClick, onChange, "aria-label": ariaLabel, value, error, disabled, variant } = _a, props = __rest(_a, ["timeFormat", "interval", "className", "minTime", "maxTime", "defaultValue", "onInputChange", "onBlur", "onFocus", "errorMessage", "errorList", "labelText", "placeholder", "onClick", "onChange", "aria-label", "value", "error", "disabled", "variant"]);
+const TimePicker = forwardRef(({ timeFormat, interval, className, minTime, maxTime, defaultValue, onInputChange, onBlur, onFocus, errorMessage, errorList, labelText, placeholder, onClick, onChange, "aria-label": ariaLabel, value, error, disabled, variant, ...props }, inputRef) => {
     const [input, setInput] = useState(defaultValue ? defaultValue : "");
     const [currentOptionRef, setCurrentOptionRef] = useState(null);
     const [dropdownIsOpen, setDropdownIsOpen] = useState(false);
@@ -196,7 +184,7 @@ const TimePicker = forwardRef((_a, inputRef) => {
     };
     const displayValue = value ? value : input || "";
     return (React.createElement(React.Fragment, null,
-        React.createElement(Box, Object.assign({ className: `nds-time-picker ${className || ""}`, position: "relative", ref: onRefChange, width: componentVariant === "touch" ? "208px" : "130px", "data-testid": "select-container" }, props),
+        React.createElement(Box, { className: `nds-time-picker ${className || ""}`, position: "relative", ref: onRefChange, width: componentVariant === "touch" ? "208px" : "130px", "data-testid": "select-container", ...props },
             React.createElement(TimePickerInput, { labelText: labelText, error: hasError, dropdownIsOpen: dropdownIsOpen, onChange: handleInputChange, onFocus: handleFocus, value: displayValue, placeholder: placeholder, iconRight: "queryBuilder", onClick: handleClickInput, onKeyDown: (e) => handleKeyDown(e), "aria-label": ariaLabel || t("Select a time"), inputWidth: componentVariant === "touch" ? "208px" : "130px", iconRightSize: "x2", "data-testid": "select-input", type: "text", ref: inputRef, disabled: disabled, autoComplete: "off", variant: componentVariant }),
             React.createElement(TimePickerDropdown, { isOpen: dropdownIsOpen, "aria-expanded": dropdownIsOpen, role: "listbox", "data-testid": "select-dropdown", ref: dropdownRef }, dropdownOptions.map((option, i) => {
                 const isClosest = matchingIndex === i;

package/dist/src/TimePicker/TimePickerDropdown.d.ts

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

package/dist/src/TimePicker/TimePickerInput.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { InputFieldProps } from "../Input/InputField";
 type TimePickerInputProps = InputFieldProps & {
     dropdownIsOpen: boolean;

package/dist/src/TimePicker/TimePickerInput.js

@@ -1,7 +1,9 @@
 import styled from "styled-components";
 import { InputField } from "../Input/InputField";
-const TimePickerInput = styled(InputField)(({ dropdownIsOpen }) => (Object.assign({}, (dropdownIsOpen && {
-    borderBottomLeftRadius: "0px",
-    borderBottomRightRadius: "0px",
-}))));
+const TimePickerInput = styled(InputField)(({ dropdownIsOpen }) => ({
+    ...(dropdownIsOpen && {
+        borderBottomLeftRadius: "0px",
+        borderBottomRightRadius: "0px",
+    }),
+}));
 export default TimePickerInput;

package/dist/src/TimeRange/TimeRange.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, { useState, useEffect, forwardRef, useImperativeHandle, useRef } from "react";
 import { useTranslation } from "react-i18next";
 import { TimePicker } from "../TimePicker";
@@ -17,8 +6,10 @@ import { FieldLabelDefaultProps } from "../FieldLabel/FieldLabel.type";
 import { useComponentVariant } from "../NDSProvider/ComponentVariantContext";
 import { getDuration } from "./TimeRange.utils";
 const DEFAULT_LABEL = "Time Range";
-const TimeRange = forwardRef((_a, ref) => {
-    var { timeFormat, onRangeChange, onStartTimeChange, onEndTimeChange, errorMessage, defaultStartTime, defaultEndTime, minTime, maxTime, interval, startAriaLabel, endAriaLabel, endTimeProps, startTimeProps, variant, disableRangeValidation = false, labelProps = Object.assign(Object.assign({}, FieldLabelDefaultProps), { labelText: DEFAULT_LABEL }) } = _a, props = __rest(_a, ["timeFormat", "onRangeChange", "onStartTimeChange", "onEndTimeChange", "errorMessage", "defaultStartTime", "defaultEndTime", "minTime", "maxTime", "interval", "startAriaLabel", "endAriaLabel", "endTimeProps", "startTimeProps", "variant", "disableRangeValidation", "labelProps"]);
+const TimeRange = forwardRef(({ timeFormat, onRangeChange, onStartTimeChange, onEndTimeChange, errorMessage, defaultStartTime, defaultEndTime, minTime, maxTime, interval, startAriaLabel, endAriaLabel, endTimeProps, startTimeProps, variant, disableRangeValidation = false, labelProps = {
+    ...FieldLabelDefaultProps,
+    labelText: DEFAULT_LABEL,
+}, ...props }, ref) => {
     const [startTime, setStartTime] = useState();
     const [endTime, setEndTime] = useState();
     const [rangeError, setRangeError] = useState();
@@ -27,18 +18,24 @@ const TimeRange = forwardRef((_a, ref) => {
     const { t } = useTranslation();
     const componentVariant = useComponentVariant(variant);
     useImperativeHandle(ref, () => ({
-        inputRef1: Object.assign(Object.assign({}, inputRef1), { focus: () => {
+        inputRef1: {
+            ...inputRef1,
+            focus: () => {
                 if (inputRef1.current) {
                     // @ts-ignore
                     inputRef1.current.focus();
                 }
-            } }),
-        inputRef2: Object.assign(Object.assign({}, inputRef2), { focus: () => {
+            },
+        },
+        inputRef2: {
+            ...inputRef2,
+            focus: () => {
                 if (inputRef2.current) {
                     // @ts-ignore
                     inputRef2.current.focus();
                 }
-            } }),
+            },
+        },
     }));
     useEffect(() => {
         validateTimeRange();
@@ -74,8 +71,11 @@ const TimeRange = forwardRef((_a, ref) => {
             });
         }
     };
-    const startInput = (React.createElement(TimePicker, Object.assign({ timeFormat: timeFormat, defaultValue: defaultStartTime, selected: startTime, onChange: changeStartTimeHandler, minTime: minTime, maxTime: endTime || maxTime, interval: interval, "aria-label": startAriaLabel || t("select a start time"), "data-testid": "timerange-start-time", ref: inputRef1, error: rangeError, variant: componentVariant }, startTimeProps)));
-    const endInput = (React.createElement(TimePicker, Object.assign({ timeFormat: timeFormat, defaultValue: defaultEndTime, selected: endTime, onChange: changeEndTimeHandler, maxTime: maxTime, minTime: startTime || minTime, interval: interval, "aria-label": endAriaLabel || t("select an end time"), "data-testid": "timerange-end-time", ref: inputRef2, error: rangeError, variant: componentVariant }, endTimeProps)));
-    return (React.createElement(RangeContainer, Object.assign({ labelProps: Object.assign(Object.assign({}, labelProps), { labelText: labelProps.labelText === DEFAULT_LABEL ? t("time range") : labelProps.labelText }), startComponent: startInput, endComponent: endInput, errorMessages: !disableRangeValidation ? [rangeError, errorMessage] : [errorMessage], variant: componentVariant }, props)));
+    const startInput = (React.createElement(TimePicker, { timeFormat: timeFormat, defaultValue: defaultStartTime, selected: startTime, onChange: changeStartTimeHandler, minTime: minTime, maxTime: endTime || maxTime, interval: interval, "aria-label": startAriaLabel || t("select a start time"), "data-testid": "timerange-start-time", ref: inputRef1, error: rangeError, variant: componentVariant, ...startTimeProps }));
+    const endInput = (React.createElement(TimePicker, { timeFormat: timeFormat, defaultValue: defaultEndTime, selected: endTime, onChange: changeEndTimeHandler, maxTime: maxTime, minTime: startTime || minTime, interval: interval, "aria-label": endAriaLabel || t("select an end time"), "data-testid": "timerange-end-time", ref: inputRef2, error: rangeError, variant: componentVariant, ...endTimeProps }));
+    return (React.createElement(RangeContainer, { labelProps: {
+            ...labelProps,
+            labelText: labelProps.labelText === DEFAULT_LABEL ? t("time range") : labelProps.labelText,
+        }, startComponent: startInput, endComponent: endInput, errorMessages: !disableRangeValidation ? [rangeError, errorMessage] : [errorMessage], variant: componentVariant, ...props }));
 });
 export default TimeRange;

package/dist/src/Toast/Toast.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, { useState, useEffect } from "react";
 import { AnimatePresence } from "framer-motion";
 import Alert from "../Alert/Alert";
@@ -31,8 +20,7 @@ export const toastAnimationConfig = {
         transition: { ease: "easeOut", duration: 0.15 },
     },
 };
-export const Toast = (_a) => {
-    var { triggered = false, isCloseable = false, showDuration = TOAST_SHOW_DURATION, onHide, onShow, children, onHidden, zIndex } = _a, props = __rest(_a, ["triggered", "isCloseable", "showDuration", "onHide", "onShow", "children", "onHidden", "zIndex"]);
+export const Toast = ({ triggered = false, isCloseable = false, showDuration = TOAST_SHOW_DURATION, onHide, onShow, children, onHidden, zIndex, ...props }) => {
     const [visible, setVisible] = useState(triggered);
     const [timeoutID, setTimeoutID] = useState(undefined);
     const cancelHidingToast = () => {
@@ -85,9 +73,9 @@ export const Toast = (_a) => {
     const handleCloseButtonClick = () => {
         hideToast(0);
     };
-    return (React.createElement(AnimatePresence, { initial: false }, visible && (React.createElement(AnimatedBox, Object.assign({ onMouseEnter: onMouseIn, 
+    return (React.createElement(AnimatePresence, { initial: false }, visible && (React.createElement(AnimatedBox, { onMouseEnter: onMouseIn, 
         /* @ts-ignore */
-        onFocus: onMouseIn, onMouseLeave: onMouseOut, onBlur: onMouseOut, position: "fixed", bottom: "0", left: "0", right: "0", marginLeft: "auto", marginRight: "auto", width: "fit-content", zIndex: zIndex, boxShadow: "medium", layout: true }, toastAnimationConfig),
-        React.createElement(Alert, Object.assign({ minWidth: "200px", maxWidth: "600px", isCloseable: isCloseable, onClose: handleCloseButtonClick, controlled: true }, props), children)))));
+        onFocus: onMouseIn, onMouseLeave: onMouseOut, onBlur: onMouseOut, position: "fixed", bottom: "0", left: "0", right: "0", marginLeft: "auto", marginRight: "auto", width: "fit-content", zIndex: zIndex, boxShadow: "medium", layout: true, ...toastAnimationConfig },
+        React.createElement(Alert, { minWidth: "200px", maxWidth: "600px", isCloseable: isCloseable, onClose: handleCloseButtonClick, controlled: true, ...props }, children)))));
 };
 export default Toast;

package/dist/src/ToastContainer/ToastContainer.js

@@ -1,21 +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, { useEffect } from "react";
 import { toast as _toast, Toaster, useToasterStore } from "react-hot-toast";
 import { useTheme } from "styled-components";
 import { TOAST_SHOW_DURATION } from "../Toast/Toast";
 import numberFromDimension from "../utils/numberFromDimension";
-const ToastContainer = (_a) => {
-    var { gap, position = "bottom-center", reverseOrder = false, containerClassName = "nds-toast-container", toastOptions = { duration: TOAST_SHOW_DURATION }, maxVisibleToasts = 8 } = _a, props = __rest(_a, ["gap", "position", "reverseOrder", "containerClassName", "toastOptions", "maxVisibleToasts"]);
+const ToastContainer = ({ gap, position = "bottom-center", reverseOrder = false, containerClassName = "nds-toast-container", toastOptions = { duration: TOAST_SHOW_DURATION }, maxVisibleToasts = 8, ...props }) => {
     const theme = useTheme();
     const { toasts } = useToasterStore();
     useEffect(() => {
@@ -24,8 +12,8 @@ const ToastContainer = (_a) => {
             .filter((_, i) => i >= maxVisibleToasts)
             .forEach((t) => _toast.dismiss(t.id));
     }, [toasts, maxVisibleToasts]);
-    return (React.createElement(Toaster, Object.assign({ gutter: gap || numberFromDimension(theme.space.x1), toastOptions: {
-            custom: Object.assign({}, toastOptions),
-        }, position: position, reverseOrder: reverseOrder, containerClassName: containerClassName }, props)));
+    return (React.createElement(Toaster, { gutter: gap || numberFromDimension(theme.space.x1), toastOptions: {
+            custom: { ...toastOptions },
+        }, position: position, reverseOrder: reverseOrder, containerClassName: containerClassName, ...props }));
 };
 export default ToastContainer;

package/dist/src/ToastContainer/ToastContainer.story.js

@@ -59,7 +59,7 @@ export const WithEverything = () => {
                 React.createElement(Flex, { flexDirection: "column" },
                     React.createElement(Text, { fontWeight: "bold" }, "Trigger toasts from anywhere using the `toast` function"),
                     React.createElement("pre", null, `import { toast } from "@nulogy/components"`),
-                    React.createElement("pre", null, toastFunctionTemplate !== null && toastFunctionTemplate !== void 0 ? toastFunctionTemplate : getToastFunctionTemplate())),
+                    React.createElement("pre", null, toastFunctionTemplate ?? getToastFunctionTemplate())),
                 React.createElement(Flex, { gap: "x2", flexDirection: "column" },
                     React.createElement(Select, { defaultValue: type, options: [{ value: "random", label: "Random" }, ...types], labelText: "Type", onChange: (value) => setType(value) }),
                     React.createElement(Select, { defaultValue: behavior, options: [

package/dist/src/ToastContainer/ToastFunction.js

@@ -1,32 +1,20 @@
-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 { AnimatePresence } from "framer-motion";
 import { toast as _toast } from "react-hot-toast";
 import { Alert } from "../Alert";
 import { AnimatedBox } from "../Box";
 import { toastAnimationConfig } from "../Toast/Toast";
-const CustomToast = (_a) => {
-    var { isVisible, id, children } = _a, props = __rest(_a, ["isVisible", "id", "children"]);
+const CustomToast = ({ isVisible, id, children, ...props }) => {
     const handleClose = () => {
         _toast.dismiss(id);
     };
-    return (React.createElement(AnimatePresence, null, isVisible && (React.createElement(AnimatedBox, Object.assign({ key: "notification", role: "alert" }, toastAnimationConfig),
-        React.createElement(Alert, Object.assign({ controlled: true, onClose: handleClose }, props), children)))));
+    return (React.createElement(AnimatePresence, null, isVisible && (React.createElement(AnimatedBox, { key: "notification", role: "alert", ...toastAnimationConfig },
+        React.createElement(Alert, { controlled: true, onClose: handleClose, ...props }, children)))));
 };
 const toast = {
-    danger: (children, props = {}, options = {}) => _toast.custom((t) => (React.createElement(CustomToast, Object.assign({ id: t.id, isVisible: t.visible, type: "danger" }, props), children)), Object.assign({ duration: props.isCloseable ? Infinity : options.duration }, options)),
-    informative: (children, props = {}, options = {}) => _toast.custom((t) => (React.createElement(CustomToast, Object.assign({ id: t.id, isVisible: t.visible, type: "informative" }, props), children)), Object.assign({ duration: props.isCloseable ? Infinity : options.duration }, options)),
-    success: (children, props = {}, options = {}) => _toast.custom((t) => (React.createElement(CustomToast, Object.assign({ id: t.id, isVisible: t.visible, type: "success" }, props), children)), Object.assign({ duration: props.isCloseable ? Infinity : options.duration }, options)),
-    warning: (children, props = {}, options = {}) => _toast.custom((t) => (React.createElement(CustomToast, Object.assign({ id: t.id, isVisible: t.visible, type: "warning" }, props), children)), Object.assign({ duration: props.isCloseable ? Infinity : options.duration }, options)),
+    danger: (children, props = {}, options = {}) => _toast.custom((t) => (React.createElement(CustomToast, { id: t.id, isVisible: t.visible, type: "danger", ...props }, children)), { duration: props.isCloseable ? Infinity : options.duration, ...options }),
+    informative: (children, props = {}, options = {}) => _toast.custom((t) => (React.createElement(CustomToast, { id: t.id, isVisible: t.visible, type: "informative", ...props }, children)), { duration: props.isCloseable ? Infinity : options.duration, ...options }),
+    success: (children, props = {}, options = {}) => _toast.custom((t) => (React.createElement(CustomToast, { id: t.id, isVisible: t.visible, type: "success", ...props }, children)), { duration: props.isCloseable ? Infinity : options.duration, ...options }),
+    warning: (children, props = {}, options = {}) => _toast.custom((t) => (React.createElement(CustomToast, { id: t.id, isVisible: t.visible, type: "warning", ...props }, children)), { duration: props.isCloseable ? Infinity : options.duration, ...options }),
 };
 export default toast;

package/dist/src/Toggle/Toggle.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, { useCallback, useEffect } from "react";
 import propTypes from "@styled-system/prop-types";
 import { FieldLabel } from "../FieldLabel";
@@ -18,9 +7,7 @@ import { useComponentVariant } from "../NDSProvider/ComponentVariantContext";
 import { getSubset, omitSubset } from "../utils/subset";
 import { Flex } from "../Flex";
 import ToggleButton from "./ToggleButton";
-const Toggle = React.forwardRef((_a, ref) => {
-    var _b;
-    var { checked, variant, className, labelText, requirementText, helpText, hint, disabled, toggled, onChange, onText, offText, required, error, id, defaultToggled, onClick, "data-testid": dataTestId } = _a, props = __rest(_a, ["checked", "variant", "className", "labelText", "requirementText", "helpText", "hint", "disabled", "toggled", "onChange", "onText", "offText", "required", "error", "id", "defaultToggled", "onClick", "data-testid"]);
+const Toggle = React.forwardRef(({ checked, variant, className, labelText, requirementText, helpText, hint, disabled, toggled, onChange, onText, offText, required, error, id, defaultToggled, onClick, "data-testid": dataTestId, ...props }, ref) => {
     const componentVariant = useComponentVariant(variant);
     const spaceProps = getSubset(props, propTypes.space);
     const restProps = omitSubset(props, propTypes.space);
@@ -36,7 +23,7 @@ const Toggle = React.forwardRef((_a, ref) => {
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
-    const _checked = (_b = checked !== null && checked !== void 0 ? checked : defaultToggled) !== null && _b !== void 0 ? _b : toggled;
+    const _checked = checked ?? defaultToggled ?? toggled;
     const _onChange = useCallback((e) => {
         if (onClick) {
             onClick(e);
@@ -51,10 +38,10 @@ const Toggle = React.forwardRef((_a, ref) => {
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
-    return (React.createElement(Field, Object.assign({ className: className, alignItems: "flex-start", py: "half" }, spaceProps),
+    return (React.createElement(Field, { className: className, alignItems: "flex-start", py: "half", ...spaceProps },
         React.createElement(FieldLabel, { htmlFor: id, labelText: labelText, requirementText: requirementText, helpText: helpText, hint: hint, disabled: disabled, variant: componentVariant, "data-testid": dataTestId },
             React.createElement(Flex, { flexDirection: "row", alignItems: "center" },
-                React.createElement(ToggleButton, Object.assign({ id: id, checked: _checked, onChange: _onChange, disabled: disabled, required: required, "aria-required": required, "aria-invalid": error }, restProps, { ref: ref })),
+                React.createElement(ToggleButton, { id: id, checked: _checked, onChange: _onChange, disabled: disabled, required: required, "aria-required": required, "aria-invalid": error, ...restProps, ref: ref }),
                 (onText || offText) && (React.createElement(Text, { disabled: disabled, mb: "none", ml: "x1", "aria-hidden": true }, _checked ? onText : offText))))));
 });
 export default Toggle;

package/dist/src/Toggle/ToggleButton.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 { motion } from "framer-motion";
 import styled, { useTheme } from "styled-components";
@@ -61,10 +50,9 @@ const ToggleInput = styled.input(({ disabled, theme }) => ({
         boxShadow: disabled ? undefined : theme.shadows.focus,
     },
 }));
-const ToggleButton = React.forwardRef((_a, ref) => {
-    var { disabled, checked } = _a, props = __rest(_a, ["disabled", "checked"]);
+const ToggleButton = React.forwardRef(({ disabled, checked, ...props }, ref) => {
     return (React.createElement(Switch, { disabled: disabled, checked: checked },
-        React.createElement(ToggleInput, Object.assign({ type: "checkbox", role: "switch", checked: checked, ref: ref, value: checked ? "on" : "off", disabled: disabled }, props)),
+        React.createElement(ToggleInput, { type: "checkbox", role: "switch", checked: checked, ref: ref, value: checked ? "on" : "off", disabled: disabled, ...props }),
         React.createElement(Slider, { disabled: disabled })));
 });
 export default ToggleButton;

package/dist/src/Tooltip/Tooltip.story.js

@@ -20,7 +20,7 @@ export const WithWrappedText = {
 };
 export const WithCustomMaxWidth = {
     render: (args) => (React.createElement(Flex, { p: "x8" },
-        React.createElement(Tooltip, Object.assign({}, args, { placement: "bottom", tooltip: "I am a Tooltip! I have very long text, but I have a smaller maxWidth prop that causes me to wrap frequently.", maxWidth: "128px", defaultOpen: true }),
+        React.createElement(Tooltip, { ...args, placement: "bottom", tooltip: "I am a Tooltip! I have very long text, but I have a smaller maxWidth prop that causes me to wrap frequently.", maxWidth: "128px", defaultOpen: true },
             React.createElement(Button, null, " Button ")))),
     name: "with custom maxWidth",
 };
@@ -57,17 +57,17 @@ export const WithPlacement = {
     name: "with placement",
 };
 export const WithLinkPassedIn = {
-    render: (args) => (React.createElement(Tooltip, Object.assign({}, args, { placement: "bottom", tooltip: React.createElement(Link, { href: "/" }, " Link "), defaultOpen: true }),
+    render: (args) => (React.createElement(Tooltip, { ...args, placement: "bottom", tooltip: React.createElement(Link, { href: "/" }, " Link "), defaultOpen: true },
         React.createElement(Button, null, " Button "))),
     name: "with Link passed in",
 };
 export const WithButtonPassedIn = {
-    render: (args) => (React.createElement(Tooltip, Object.assign({}, args, { placement: "bottom", tooltip: React.createElement(Button, { href: "/" }, " Button "), defaultOpen: true }),
+    render: (args) => (React.createElement(Tooltip, { ...args, placement: "bottom", tooltip: React.createElement(Button, { href: "/" }, " Button "), defaultOpen: true },
         React.createElement(Button, null, " Button "))),
     name: "with Button passed in",
 };
 export const WithCustomShowDelay = {
-    render: (args) => (React.createElement(Tooltip, Object.assign({}, args, { placement: "bottom", tooltip: "Tooltip", showDelay: "1000" }),
+    render: (args) => (React.createElement(Tooltip, { ...args, placement: "bottom", tooltip: "Tooltip", showDelay: "1000" },
         React.createElement(Button, null, " Button "))),
     name: "with custom showDelay",
 };
@@ -86,15 +86,15 @@ export const WithOtherFocusableElements = {
     name: "with other focusable elements",
 };
 export const OpenByDefault = {
-    render: (args) => (React.createElement(Tooltip, Object.assign({}, args, { tooltip: "I am an open Tooltip!", defaultOpen: true }),
+    render: (args) => (React.createElement(Tooltip, { ...args, tooltip: "I am an open Tooltip!", defaultOpen: true },
         React.createElement(Button, null, "Hover me"))),
     name: "open by default",
 };
 export const WithCustomComponent = {
-    render: (args) => (React.createElement(Tooltip, Object.assign({}, args, { tooltip: "See me on hover!", defaultOpen: true }),
+    render: (args) => (React.createElement(Tooltip, { ...args, tooltip: "See me on hover!", defaultOpen: true },
         React.createElement(CustomComponent, null))),
 };
-const CustomComponent = React.forwardRef((props, forwardedRef) => (React.createElement("span", Object.assign({ ref: forwardedRef }, props),
+const CustomComponent = React.forwardRef((props, forwardedRef) => (React.createElement("span", { ref: forwardedRef, ...props },
     React.createElement(Text, { inline: true }, "This component uses the forwardedRef from the Tooltip wrapping it"))));
 const CustomTooltip = () => (React.createElement(Flex, { flexDirection: "column", width: "320px", p: "x1_5" },
     React.createElement(Text, { fontSize: "smaller", fontWeight: "medium", textTransform: "uppercase", color: "midGrey" }, "Purchase Order"),

package/dist/src/Tooltip/TooltipContainer.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { PositionProps } from "styled-system";
 import { DefaultNDSThemeType } from "../theme";
 type TooltipContainerProps = PositionProps & {

package/dist/src/Tooltip/TooltipContainer.js

@@ -27,5 +27,20 @@ const getTooltipMargin = (placement) => {
             };
     }
 };
-const TooltipContainer = styled(Box)(({ theme, dataPlacement, open, position }) => (Object.assign(Object.assign({ color: tooltipStyles(theme).textColor, display: "flex", flexDirection: "column", fontSize: theme.fontSizes.small, backgroundColor: tooltipStyles(theme).backgroundColor, borderRadius: theme.radii.medium, border: `1px solid ${tooltipStyles(theme).borderColor}`, boxShadow: theme.shadows.medium, padding: theme.space.x1, transition: "opacity 0.3s", zIndex: theme.zIndices.content }, getTooltipMargin(dataPlacement)), { position, top: open ? 0 : "-9999px" })));
+const TooltipContainer = styled(Box)(({ theme, dataPlacement, open, position }) => ({
+    color: tooltipStyles(theme).textColor,
+    display: "flex",
+    flexDirection: "column",
+    fontSize: theme.fontSizes.small,
+    backgroundColor: tooltipStyles(theme).backgroundColor,
+    borderRadius: theme.radii.medium,
+    border: `1px solid ${tooltipStyles(theme).borderColor}`,
+    boxShadow: theme.shadows.medium,
+    padding: theme.space.x1,
+    transition: "opacity 0.3s",
+    zIndex: theme.zIndices.content,
+    ...getTooltipMargin(dataPlacement),
+    position,
+    top: open ? 0 : "-9999px",
+}));
 export default TooltipContainer;

package/dist/src/Tooltip/components/TooltipComponents.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 * as React from "react";
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
 import styled, { keyframes, useTheme } from "styled-components";
@@ -18,7 +7,7 @@ function useHasHover() {
     try {
         return matchMedia("(hover: hover)").matches;
     }
-    catch (_a) {
+    catch {
         // Assume that if the browser is too old to support matchMedia, it's likely not a touch device
         return true;
     }
@@ -29,21 +18,18 @@ const TooltipTriggerContext = React.createContext({
     setOpen: () => { },
 });
 const TooltipProvider = TooltipPrimitive.Provider;
-function Tooltip(_a) {
-    var _b, _c;
-    var { children } = _a, props = __rest(_a, ["children"]);
-    const [open, setOpen] = React.useState((_b = props.defaultOpen) !== null && _b !== void 0 ? _b : false);
+function Tooltip({ children, ...props }) {
+    const [open, setOpen] = React.useState(props.defaultOpen ?? false);
     const hasHover = useHasHover();
     return (React.createElement(TooltipPrimitive.Root, { delayDuration: !hasHover && props.supportMobileTap ? 0 : props.delayDuration, onOpenChange: setOpen, open: open },
         React.createElement(TooltipTriggerContext.Provider, { value: {
                 open,
                 setOpen,
-                supportMobileTap: (_c = props.supportMobileTap) !== null && _c !== void 0 ? _c : false,
+                supportMobileTap: props.supportMobileTap ?? false,
             } }, children)));
 }
 Tooltip.displayName = TooltipPrimitive.Root.displayName;
-const TooltipTrigger = React.forwardRef((_a, ref) => {
-    var { children } = _a, props = __rest(_a, ["children"]);
+const TooltipTrigger = React.forwardRef(({ children, ...props }, ref) => {
     const hasHover = useHasHover();
     const { setOpen, supportMobileTap } = React.useContext(TooltipTriggerContext);
     const { onClick: onClickProp } = props;
@@ -53,10 +39,10 @@ const TooltipTrigger = React.forwardRef((_a, ref) => {
             setOpen(true);
         }
         else {
-            onClickProp === null || onClickProp === void 0 ? void 0 : onClickProp(e);
+            onClickProp?.(e);
         }
     }, [setOpen, hasHover, supportMobileTap, onClickProp]);
-    return (React.createElement(TooltipPrimitive.Trigger, Object.assign({ ref: ref }, props, { onClick: onClick }), children));
+    return (React.createElement(TooltipPrimitive.Trigger, { ref: ref, ...props, onClick: onClick }, children));
 });
 TooltipTrigger.displayName = TooltipPrimitive.Trigger.displayName;
 const slideUpAndFade = keyframes `
@@ -132,10 +118,9 @@ const StyledArrow = styled(TooltipPrimitive.Arrow)(({ theme }) => ({
     fill: theme.colors.white,
     filter: `drop-shadow(0px 1px 0px ${theme.colors.grey})`,
 }));
-const TooltipContent = React.forwardRef((_a, ref) => {
-    var { sideOffset = 4, children } = _a, props = __rest(_a, ["sideOffset", "children"]);
+const TooltipContent = React.forwardRef(({ sideOffset = 4, children, ...props }, ref) => {
     const theme = useTheme();
-    return (React.createElement(StyledContent, Object.assign({ ref: ref, sideOffset: sideOffset }, props),
+    return (React.createElement(StyledContent, { ref: ref, sideOffset: sideOffset, ...props },
         children,
         React.createElement(StyledArrow, { width: theme.space.x1_5, height: theme.space.x0_75 })));
 });