@nulogy/components 15.2.1 → 15.2.3

package/dist/src/TruncatedText/TruncatedText.js

@@ -1,24 +1,16 @@
-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 { Text } from "../Type";
 import TruncatedTextFillWidth from "./components/TruncatedTextFillWidth";
 import TruncatedTextMaxCharacters from "./components/TruncatedTextMaxCharacters";
-const TruncatedText = (_a) => {
-    var { indicator = "...", element = React.createElement(Text, null), maxCharacters = 20, fullWidth = false, showTooltip = true, "data-testid": dataTestId = "truncated-text", children } = _a, rest = __rest(_a, ["indicator", "element", "maxCharacters", "fullWidth", "showTooltip", "data-testid", "children"]);
-    const props = Object.assign({ indicator,
+const TruncatedText = ({ indicator = "...", element = React.createElement(Text, null), maxCharacters = 20, fullWidth = false, showTooltip = true, "data-testid": dataTestId = "truncated-text", children, ...rest }) => {
+    const props = {
+        indicator,
         element,
         maxCharacters,
-        showTooltip, "data-testid": dataTestId }, rest);
-    return fullWidth ? (React.createElement(TruncatedTextFillWidth, Object.assign({}, props), children)) : (React.createElement(TruncatedTextMaxCharacters, Object.assign({}, props), children));
+        showTooltip,
+        "data-testid": dataTestId,
+        ...rest,
+    };
+    return fullWidth ? (React.createElement(TruncatedTextFillWidth, { ...props }, children)) : (React.createElement(TruncatedTextMaxCharacters, { ...props }, children));
 };
 export default TruncatedText;

package/dist/src/TruncatedText/components/MaybeTooltip.d.ts

@@ -19,6 +19,6 @@ export type MaybeTooltipProps = {
     /** The trigger element(s) */
     children?: React.ReactNode;
 };
-declare function MaybeTooltip({ tooltip, showTooltip, placement, defaultOpen, showDelay, maxWidth, supportMobileTap, // Note: supportMobileTap is handled internally by the new Tooltip
+declare function MaybeTooltip({ tooltip, showTooltip, placement, defaultOpen, showDelay, maxWidth, supportMobileTap: _supportMobileTap, // Note: supportMobileTap is handled internally by the new Tooltip
 className, children, }: MaybeTooltipProps): React.JSX.Element;
 export default MaybeTooltip;

package/dist/src/TruncatedText/components/TruncatedTextFillWidth.js

@@ -1,19 +1,7 @@
-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 } from "react";
 import { Text } from "../../Type";
 import MaybeTooltip from "./MaybeTooltip";
-const TruncatedTextFillWidth = (_a) => {
-    var { element, showTooltip, tooltipProps, children, "data-testid": testId } = _a, props = __rest(_a, ["element", "showTooltip", "tooltipProps", "children", "data-testid"]);
+const TruncatedTextFillWidth = ({ element, showTooltip, tooltipProps, children, "data-testid": testId, ...props }) => {
     const [hasOverflowText, setHasOverflowText] = useState(false);
     const hasTooltip = showTooltip && hasOverflowText;
     const updateOverflow = (e) => {
@@ -22,7 +10,7 @@ const TruncatedTextFillWidth = (_a) => {
             setHasOverflowText(true);
         }
     };
-    return (React.createElement(MaybeTooltip, Object.assign({ showTooltip: hasTooltip, tooltip: children, defaultOpen: true }, tooltipProps),
-        React.createElement(Text, Object.assign({ as: element.type, cursor: hasTooltip ? "pointer" : "initial", onMouseEnter: updateOverflow, width: "100%", whiteSpace: "nowrap", overflow: "hidden", textOverflow: "ellipsis", "data-testid": testId }, element.props, props), children)));
+    return (React.createElement(MaybeTooltip, { showTooltip: hasTooltip, tooltip: children, defaultOpen: true, ...tooltipProps },
+        React.createElement(Text, { as: element.type, cursor: hasTooltip ? "pointer" : "initial", onMouseEnter: updateOverflow, width: "100%", whiteSpace: "nowrap", overflow: "hidden", textOverflow: "ellipsis", "data-testid": testId, ...element.props, ...props }, children)));
 };
 export default TruncatedTextFillWidth;

package/dist/src/TruncatedText/components/TruncatedTextMaxCharacters.js

@@ -1,24 +1,12 @@
-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 { Text } from "../../Type";
 import MaybeTooltip from "./MaybeTooltip";
-const TruncatedTextMaxCharacters = (_a) => {
-    var { children, element, indicator, maxCharacters, showTooltip, tooltipProps, "data-testid": testId } = _a, props = __rest(_a, ["children", "element", "indicator", "maxCharacters", "showTooltip", "tooltipProps", "data-testid"]);
-    const innerText = children !== null && children !== void 0 ? children : "";
+const TruncatedTextMaxCharacters = ({ children, element, indicator, maxCharacters, showTooltip, tooltipProps, "data-testid": testId, ...props }) => {
+    const innerText = children ?? "";
     const requiresTruncation = innerText.length > maxCharacters;
     const truncatedText = requiresTruncation ? innerText.slice(0, maxCharacters) + indicator : innerText;
     const hasTooltip = showTooltip && requiresTruncation;
-    return (React.createElement(MaybeTooltip, Object.assign({ showTooltip: hasTooltip, tooltip: innerText }, tooltipProps),
-        React.createElement(Text, Object.assign({ as: element.type, cursor: hasTooltip ? "pointer" : "initial", width: "fit-content", "data-testid": testId }, element.props, props), truncatedText)));
+    return (React.createElement(MaybeTooltip, { showTooltip: hasTooltip, tooltip: innerText, ...tooltipProps },
+        React.createElement(Text, { as: element.type, cursor: hasTooltip ? "pointer" : "initial", width: "fit-content", "data-testid": testId, ...element.props, ...props }, truncatedText)));
 };
 export default TruncatedTextMaxCharacters;

package/dist/src/Type/Headings.d.ts

@@ -1,11 +1,10 @@
-/// <reference types="react" />
 import { TextProps } from "./Text";
 export declare const Heading1: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "textTransform" | "disabled" | keyof import("react").HTMLAttributes<HTMLParagraphElement> | "inline" | "compact" | keyof import("../StyledProps").StyledProps> & import("react").HTMLAttributes<HTMLParagraphElement> & {
     variant?: import("../NDSProvider/ComponentVariantContext").ComponentVariant;
     inline?: boolean;
     compact?: boolean;
     disabled?: boolean;
-    textTransform?: "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "full-width" | "capitalize" | "full-size-kana" | "lowercase" | "uppercase";
+    textTransform?: "none" | "inherit" | "initial" | "-moz-initial" | "revert" | "unset" | "capitalize" | "full-size-kana" | "full-width" | "lowercase" | "uppercase" | undefined;
     fontSize?: string;
 } & import("../StyledProps").StyledProps, "ref"> & {
     ref?: import("react").Ref<HTMLParagraphElement>;
@@ -17,7 +16,7 @@ export declare const Heading2: import("styled-components/dist/types").IStyledCom
     inline?: boolean;
     compact?: boolean;
     disabled?: boolean;
-    textTransform?: "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "full-width" | "capitalize" | "full-size-kana" | "lowercase" | "uppercase";
+    textTransform?: "none" | "inherit" | "initial" | "-moz-initial" | "revert" | "unset" | "capitalize" | "full-size-kana" | "full-width" | "lowercase" | "uppercase" | undefined;
     fontSize?: string;
 } & import("../StyledProps").StyledProps, "ref"> & {
     ref?: import("react").Ref<HTMLParagraphElement>;
@@ -29,7 +28,7 @@ export declare const Heading3: import("styled-components/dist/types").IStyledCom
     inline?: boolean;
     compact?: boolean;
     disabled?: boolean;
-    textTransform?: "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "full-width" | "capitalize" | "full-size-kana" | "lowercase" | "uppercase";
+    textTransform?: "none" | "inherit" | "initial" | "-moz-initial" | "revert" | "unset" | "capitalize" | "full-size-kana" | "full-width" | "lowercase" | "uppercase" | undefined;
     fontSize?: string;
 } & import("../StyledProps").StyledProps, "ref"> & {
     ref?: import("react").Ref<HTMLParagraphElement>;
@@ -41,7 +40,7 @@ export declare const Heading4: import("styled-components/dist/types").IStyledCom
     inline?: boolean;
     compact?: boolean;
     disabled?: boolean;
-    textTransform?: "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "full-width" | "capitalize" | "full-size-kana" | "lowercase" | "uppercase";
+    textTransform?: "none" | "inherit" | "initial" | "-moz-initial" | "revert" | "unset" | "capitalize" | "full-size-kana" | "full-width" | "lowercase" | "uppercase" | undefined;
     fontSize?: string;
 } & import("../StyledProps").StyledProps, "ref"> & {
     ref?: import("react").Ref<HTMLParagraphElement>;

package/dist/src/Type/Text.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ComponentVariant } from "../NDSProvider/ComponentVariantContext";
 import { StyledProps } from "../StyledProps";
 export type TextProps = React.HTMLAttributes<HTMLParagraphElement> & {

package/dist/src/Validation/InlineValidation.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 { Text } from "../Type";
@@ -23,9 +12,8 @@ const Wrapper = styled.div(({ theme }) => ({
         marginBottom: 0,
     },
 }));
-export default function InlineValidation(_a) {
-    var { className, errorMessage, errorList, children } = _a, boxProps = __rest(_a, ["className", "errorMessage", "errorList", "children"]);
-    return errorMessage || errorList ? (React.createElement(Flex, Object.assign({ className: className, color: "red" }, boxProps),
+export default function InlineValidation({ className, errorMessage, errorList, children, ...boxProps }) {
+    return errorMessage || errorList ? (React.createElement(Flex, { className: className, color: "red", ...boxProps },
         React.createElement(Icon, { icon: "error", mr: "x1" }),
         React.createElement(Wrapper, null,
             errorMessage && React.createElement(Text, null, errorMessage),

package/dist/src/VerticalDivider/VerticalDivider.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { StyledProps } from "../StyledProps";
 export interface DividerProps extends StyledProps, React.HTMLAttributes<HTMLDivElement> {
     secondary?: boolean;

package/dist/src/VisualTests/WithSpace.story.js

@@ -7,35 +7,35 @@ const spaceProps = {
     p: "x1",
     mt: "x5",
 };
-export const _Alert = () => React.createElement(Alert, Object.assign({}, spaceProps), "Danger alert");
-export const _AsyncSelect = () => (React.createElement(AsyncSelect, Object.assign({ placeholder: "Filter Countries", className: "Select", classNamePrefix: "SelectTest", labelText: "Country" }, spaceProps)));
-export const _Breadcrumbs = () => (React.createElement(Breadcrumbs, Object.assign({}, spaceProps),
+export const _Alert = () => React.createElement(Alert, { ...spaceProps }, "Danger alert");
+export const _AsyncSelect = () => (React.createElement(AsyncSelect, { placeholder: "Filter Countries", className: "Select", classNamePrefix: "SelectTest", labelText: "Country", ...spaceProps }));
+export const _Breadcrumbs = () => (React.createElement(Breadcrumbs, { ...spaceProps },
     React.createElement(Link, { href: "/" }, "Home"),
     React.createElement(Link, { href: "/Tenants" }, "Tenants"),
     React.createElement(Text, null, "Current Tenant")));
-export const _PrimaryButton = () => React.createElement(PrimaryButton, Object.assign({}, spaceProps), "Create project");
-export const _DatePicker = () => React.createElement(DatePicker, Object.assign({}, spaceProps));
-export const _DropdownMenu = () => (React.createElement(DropdownMenu, Object.assign({ defaultOpen: true, openAriaLabel: "open dropdown", closeAriaLabel: "close dropdown" }, spaceProps),
+export const _PrimaryButton = () => React.createElement(PrimaryButton, { ...spaceProps }, "Create project");
+export const _DatePicker = () => React.createElement(DatePicker, { ...spaceProps });
+export const _DropdownMenu = () => (React.createElement(DropdownMenu, { defaultOpen: true, openAriaLabel: "open dropdown", closeAriaLabel: "close dropdown", ...spaceProps },
     React.createElement(DropdownLink, { href: "/" }, "Dropdown Link"),
     React.createElement(DropdownButton, { onClick: () => { } }, "Dropdown Button"),
     React.createElement(DropdownItem, null,
         React.createElement("a", { href: "/", style: { textDecoration: "none" } }, "Custom Link Component"))));
-export const _FieldLabel = () => (React.createElement(FieldLabel, Object.assign({ labelText: "Default label", helpText: "I am help text. I can give more details on the input below!", requirementText: "(Required)" }, spaceProps),
+export const _FieldLabel = () => (React.createElement(FieldLabel, { labelText: "Default label", helpText: "I am help text. I can give more details on the input below!", requirementText: "(Required)", ...spaceProps },
     React.createElement(Input, { id: "birthplace", labelText: "Place of birth", requirementText: "(Optional)" })));
 export const _Form = () => (React.createElement(Form, { mt: "x2", p: "x1" },
     React.createElement(Input, { id: "name", labelText: "Name" }),
     React.createElement(Input, { id: "birthdate", placeholder: "DD-MM-YYYY", labelText: "Date of birth", requirementText: "(Optional)", helpText: "Enter a date below" }),
     React.createElement(Input, { id: "birthplace", labelText: "Place of birth", requirementText: "(Optional)" })));
 export const _Link = () => (React.createElement(Link, { as: "button", mt: "x2", p: "x1" }, "Link"));
-export const _List = () => (React.createElement(List, Object.assign({ leftAlign: true }, spaceProps),
+export const _List = () => (React.createElement(List, { leftAlign: true, ...spaceProps },
     React.createElement(ListItem, null, "List Item 1"),
     React.createElement(ListItem, null, "List Item 2 that is really really really really really really really really really long"),
     React.createElement(ListItem, { mt: "x1" }, "List Item 3")));
-export const _Pagination = () => React.createElement(Pagination, Object.assign({ currentPage: 3, totalPages: 4 }, spaceProps));
+export const _Pagination = () => React.createElement(Pagination, { currentPage: 3, totalPages: 4, ...spaceProps });
 export const _Radio = () => (React.createElement(React.Fragment, null,
-    React.createElement(Radio, Object.assign({ id: "radio", error: true, labelText: "I am error" }, spaceProps)),
-    React.createElement(Radio, Object.assign({ id: "radio", defaultChecked: true, error: true, labelText: "I am error" }, spaceProps))));
-export const _Select = () => (React.createElement(Select, Object.assign({ defaultValue: 2, placeholder: "Please select inventory status", options: [
+    React.createElement(Radio, { id: "radio", error: true, labelText: "I am error", ...spaceProps }),
+    React.createElement(Radio, { id: "radio", defaultChecked: true, error: true, labelText: "I am error", ...spaceProps })));
+export const _Select = () => (React.createElement(Select, { defaultValue: 2, placeholder: "Please select inventory status", options: [
         {
             label: "option 1",
             value: 1,
@@ -48,7 +48,7 @@ export const _Select = () => (React.createElement(Select, Object.assign({ defaul
             label: "option 3",
             value: 3,
         },
-    ], labelText: "Inventory status" }, spaceProps)));
+    ], labelText: "Inventory status", ...spaceProps }));
 const columns = [
     { label: "Date", dataKey: "date" },
     { label: "Expected Quantity", dataKey: "expectedQuantity" },
@@ -104,12 +104,12 @@ const rowData = [
         id: "r9",
     },
 ];
-export const _Table = () => React.createElement(Table, Object.assign({ columns: columns, rows: rowData }, spaceProps));
-export const _Tabs = () => (React.createElement(Tabs, Object.assign({}, spaceProps),
+export const _Table = () => React.createElement(Table, { columns: columns, rows: rowData, ...spaceProps });
+export const _Tabs = () => (React.createElement(Tabs, { ...spaceProps },
     React.createElement(Tab, { className: "Tab1", label: "Tab 1" }, "Tab 1 Content"),
     React.createElement(Tab, { className: "Tab2", label: "Tab 2" }, "Tab 2 Content"),
     React.createElement(Tab, { className: "Tab3", label: "Tab 3" }, "Tab 3 Content"),
     React.createElement(Tab, { className: "Tab4", label: "Tab 4" }, "Tab 4 Content")));
-export const _TimePicker = () => React.createElement(TimePicker, Object.assign({ labelText: "End Time", defaultValue: "12:38 PM" }, spaceProps));
-export const _TruncatedText = () => (React.createElement(TruncatedText, Object.assign({}, spaceProps), "Special instructions are provided for the shipment"));
-export const _InlineValidation = () => React.createElement(InlineValidation, Object.assign({ errorMessage: "Something has gone wrong" }, spaceProps));
+export const _TimePicker = () => React.createElement(TimePicker, { labelText: "End Time", defaultValue: "12:38 PM", ...spaceProps });
+export const _TruncatedText = () => (React.createElement(TruncatedText, { ...spaceProps }, "Special instructions are provided for the shipment"));
+export const _InlineValidation = () => React.createElement(InlineValidation, { errorMessage: "Something has gone wrong", ...spaceProps });

package/dist/src/hooks/useMediaQuery/useMediaQuery.js

@@ -1,10 +1,9 @@
 import { ThemeContext } from "styled-components";
 import React, { useCallback, useEffect, useState } from "react";
 function useMediaQuery(q) {
-    var _a;
     const isUnsupported = typeof window === "undefined" || typeof window.matchMedia === "undefined";
     const theme = React.useContext(ThemeContext);
-    const query = ((_a = theme === null || theme === void 0 ? void 0 : theme.breakpoints) === null || _a === void 0 ? void 0 : _a[q]) ? `(min-width: ${theme.breakpoints[q]})` : q;
+    const query = theme?.breakpoints?.[q] ? `(min-width: ${theme.breakpoints[q]})` : q;
     const getMatches = useCallback((query) => {
         if (isUnsupported) {
             return false;

package/dist/src/i18n.js

@@ -48,7 +48,7 @@ i18n.init({
     defaultNS: "nds",
     resources,
     lng: "en_US",
-    keySeparator: false,
+    keySeparator: false, // we do not use keys in form messages.welcome
     interpolation: {
         escapeValue: false, // react already safes from xss
     },

package/dist/src/locale.story.js

@@ -77,7 +77,7 @@ const getRows = () => {
         const row = { key, id: key };
         Object.keys(locales).forEach((locale) => {
             const translations = locales[locale].keys;
-            row[locale] = (translations === null || translations === void 0 ? void 0 : translations[key]) || "-";
+            row[locale] = translations?.[key] || "-";
         });
         return row;
     });

package/dist/src/testing/matchers/toHaveStyle.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Helper function to check if an element has a specific computed style.
+ * @param element - The DOM element to check
+ * @param styleString - CSS style string in the format "property: value" (e.g., "opacity: 0", "z-index: 1001")
+ * @returns true if the computed style matches, false otherwise
+ */
+export declare function hasComputedStyle(element: HTMLElement | null, styleString: string): boolean;
+declare module "vitest" {
+    interface Assertion {
+        toHaveComputedStyle(styleString: string): void;
+    }
+    interface AsymmetricMatchersContaining {
+        toHaveComputedStyle(styleString: string): void;
+    }
+}

package/dist/src/testing/matchers/toHaveStyle.js

@@ -0,0 +1,50 @@
+import { expect } from "vitest";
+/**
+ * Helper function to check if an element has a specific computed style.
+ * @param element - The DOM element to check
+ * @param styleString - CSS style string in the format "property: value" (e.g., "opacity: 0", "z-index: 1001")
+ * @returns true if the computed style matches, false otherwise
+ */
+export function hasComputedStyle(element, styleString) {
+    if (!element) {
+        return false;
+    }
+    const [property, value] = styleString.split(":").map((s) => s.trim());
+    const computedStyle = window.getComputedStyle(element);
+    const actualValue = computedStyle.getPropertyValue(property);
+    // Normalize values for comparison
+    // Handle numeric values (e.g., "0" vs "0px" for opacity, "1001" vs "1001px" for z-index)
+    const normalizedExpected = value.trim();
+    const normalizedActual = actualValue.trim();
+    // For numeric values, compare as numbers
+    const expectedNum = parseFloat(normalizedExpected);
+    const actualNum = parseFloat(normalizedActual);
+    if (!isNaN(expectedNum) && !isNaN(actualNum)) {
+        return expectedNum === actualNum;
+    }
+    // For non-numeric values, do exact string comparison
+    return normalizedExpected === normalizedActual;
+}
+/**
+ * Custom Vitest matcher to check computed styles.
+ * Usage: expect(element).toHaveComputedStyle("opacity: 0")
+ */
+expect.extend({
+    toHaveComputedStyle(received, styleString) {
+        const pass = hasComputedStyle(received, styleString);
+        const [property, value] = styleString.split(":").map((s) => s.trim());
+        if (pass) {
+            return {
+                message: () => `expected element not to have computed style ${property}: ${value}`,
+                pass: true,
+            };
+        }
+        else {
+            const actualValue = received ? window.getComputedStyle(received).getPropertyValue(property) : "element is null";
+            return {
+                message: () => `expected element to have computed style ${property}: ${value}, but got ${actualValue}`,
+                pass: false,
+            };
+        }
+    },
+});

package/dist/src/testing/matchers/toMatchDate.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/src/testing/matchers/toMatchDate.js

@@ -1,4 +1,4 @@
-"use strict";
+import { expect } from "vitest";
 expect.extend({
     toMatchDate(received, date) {
         const pass = date.getMonth() === received.getMonth() &&

package/dist/src/theme/mergeThemes.util.js

@@ -1,6 +1,12 @@
 export const mergeThemes = (theme, customTheme) => Object.keys(theme).reduce((mergedTheme, group) => {
     if (customTheme && mergedTheme[group] && customTheme[group]) {
-        return Object.assign(Object.assign({}, mergedTheme), { [group]: Object.assign(Object.assign({}, mergedTheme[group]), customTheme[group]) });
+        return {
+            ...mergedTheme,
+            [group]: {
+                ...mergedTheme[group],
+                ...customTheme[group],
+            },
+        };
     }
     return mergedTheme;
 }, theme);

package/dist/src/theme/useNDSTheme.js

@@ -4,9 +4,12 @@ import { useFeatureFlags } from "../NDSProvider/FeatureFlagsContext";
 import { mergeThemes } from "./mergeThemes.util";
 import { legacy, themes } from "./theme";
 const THEME_VARIANTS = new Set(["desktop", "touch"]);
-export const buildBreakPoints = (breakpointsConfig) => (Object.assign(Object.assign({}, breakpointsConfig), { map: function (fn) {
+export const buildBreakPoints = (breakpointsConfig) => ({
+    ...breakpointsConfig,
+    map: function (fn) {
         return Object.values(breakpointsConfig).map(fn);
-    } }));
+    },
+});
 const validateVariantOrThrow = (variant) => {
     if (!THEME_VARIANTS.has(variant)) {
         throw new Error(`Invalid variant "${variant}" provided to NDSProvider. Valid variants are: ${Array.from(THEME_VARIANTS).join(", ")}.`);
@@ -28,5 +31,8 @@ export function useNDSTheme(variant = "desktop", customTheme) {
         setThemeVariant(newTheme);
     }, [variant, isTabletSize, experimentalDesktopTypographyScale]);
     const mergedTheme = mergeThemes(themeVariant, customTheme);
-    return Object.assign(Object.assign({}, mergedTheme), { breakpoints: buildBreakPoints(mergedTheme.breakpoints) });
+    return {
+        ...mergedTheme,
+        breakpoints: buildBreakPoints(mergedTheme.breakpoints),
+    };
 }

package/dist/src/utils/ClickInputLabel.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ComponentVariant } from "../NDSProvider/ComponentVariantContext";
 declare const ClickInputLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, {
     variant?: ComponentVariant;

package/dist/src/utils/DetectOutsideClick.d.ts

@@ -1,3 +1,6 @@
+/**
+ * @deprecated use `useClickOutside` instead
+ */
 export default class DetectOutsideClick extends React.Component<any, any, any> {
     constructor(props: any);
     handleOutsideClick(e: any): void;

package/dist/src/utils/DetectOutsideClick.js

@@ -1,4 +1,7 @@
 import React from "react";
+/**
+ * @deprecated use `useClickOutside` instead
+ */
 export default class DetectOutsideClick extends React.Component {
     constructor(props) {
         super(props);

package/dist/src/utils/PopperArrow.js

@@ -128,5 +128,9 @@ const PopperArrow = styled.div(({ theme }) => ({
         position: "absolute",
         width: 0,
     },
-}), ({ placement = "bottom", borderColor = "grey", backgroundColor = "white", theme }) => (Object.assign({}, drawArrow(placement, borderColor, backgroundColor, theme))), ({ placement = "bottom", theme }) => (Object.assign({}, positionArrow(placement, theme))));
+}), ({ placement = "bottom", borderColor = "grey", backgroundColor = "white", theme }) => ({
+    ...drawArrow(placement, borderColor, backgroundColor, theme),
+}), ({ placement = "bottom", theme }) => ({
+    ...positionArrow(placement, theme),
+}));
 export default PopperArrow;

package/dist/src/utils/ScrollIndicators.js

@@ -1,7 +1,7 @@
 import React from "react";
-import { Icon } from "../Icon";
 import styled from "styled-components";
 import { position } from "styled-system";
+import { Icon } from "../Icon";
 const ScrollIndicatorWrapper = styled.div(({ theme }) => ({
     position: "absolute",
     left: `calc(50% - ${theme.space.x3})`,

package/dist/src/utils/generateId.d.ts

@@ -1,2 +1,7 @@
 export default generateId;
+/**
+ * Generates a unique ID for an element.
+ * @returns {string} A unique ID.
+ * @deprecated use `useId` instead
+ */
 declare function generateId(): string;

package/dist/src/utils/generateId.js

@@ -1,5 +1,10 @@
 const prefix = "random-id-";
 let randomId = 0;
+/**
+ * Generates a unique ID for an element.
+ * @returns {string} A unique ID.
+ * @deprecated use `useId` instead
+ */
 const generateId = () => {
     randomId += 1;
     return prefix + randomId;

package/dist/src/utils/index.d.ts

@@ -2,7 +2,6 @@ export { default as ClickInputLabel } from "./ClickInputLabel";
 export { default as omit } from "./omit";
 export { default as subPx } from "./subPx";
 export { default as generateId } from "./generateId";
-export { default as withWindowDimensions } from "./withWindowDimensions";
 export { default as DetectOutsideClick } from "./DetectOutsideClick";
 export { default as PopperArrow } from "./PopperArrow";
 export { default as ScrollIndicators } from "./ScrollIndicators";

package/dist/src/utils/index.js

@@ -2,7 +2,6 @@ export { default as ClickInputLabel } from "./ClickInputLabel";
 export { default as omit } from "./omit";
 export { default as subPx } from "./subPx";
 export { default as generateId } from "./generateId";
-export { default as withWindowDimensions } from "./withWindowDimensions";
 export { default as DetectOutsideClick } from "./DetectOutsideClick";
 export { default as PopperArrow } from "./PopperArrow";
 export { default as ScrollIndicators } from "./ScrollIndicators";

package/dist/src/utils/numberFromDimension/numberFromDimension.spec.js

@@ -1,3 +1,4 @@
+import { describe, it, expect } from "vitest";
 import numberFromDimension from ".";
 describe("numberFromDimension", () => {
     it("returns the numerical value from a css dimension", () => {

package/dist/src/utils/story/code.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 /**
  * A styled component for displaying code in a storybook.
  *

package/dist/src/utils/story/dashed.d.ts

@@ -5,5 +5,5 @@ import { ComponentType } from "react";
  * Do not export for production.
  */
 export declare const dashed: <P extends Record<string, unknown>>(component: ComponentType<P>) => import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<(import("react").PropsWithoutRef<P> & import("react").RefAttributes<import("react").Component<P, any, any>>) | (import("react").PropsWithRef<P & {
-    children?: import("react").ReactNode;
-}> & import("styled-components/dist/types").BaseObject), import("styled-components/dist/types").BaseObject>> & string & (Omit<import("react").ComponentClass<P, any>, keyof import("react").Component<any, {}, any>> | Omit<import("react").FunctionComponent<P>, keyof import("react").Component<any, {}, any>>);
+    children?: import("react").ReactNode | undefined;
+}> & import("styled-components/dist/types").BaseObject), import("styled-components/dist/types").BaseObject>> & (string & (Omit<import("react").ComponentClass<P, any>, keyof import("react").Component<any, {}, any>> | Omit<import("react").FunctionComponent<P>, keyof import("react").Component<any, {}, any>>));

package/dist/src/utils/story/placeholder.js

@@ -24,7 +24,7 @@ const Svg = styled.svg(({ theme }) => ({
  * To be used in Storybook exclusively. Do not export for production.
  */
 export function Placeholder(props) {
-    return (React.createElement(Contianer, Object.assign({}, props),
+    return (React.createElement(Contianer, { ...props },
         React.createElement(Svg, { fill: "none" },
             React.createElement("defs", null,
                 React.createElement("pattern", { id: "diagonal-stripes", x: "0", y: "0", width: "10", height: "10", patternUnits: "userSpaceOnUse" },

package/dist/src/utils/story/resizable.d.ts

@@ -11,14 +11,14 @@ export declare const WidthText: import("styled-components/dist/types").IStyledCo
     inline?: boolean;
     compact?: boolean;
     disabled?: boolean;
-    textTransform?: "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "full-width" | "capitalize" | "full-size-kana" | "lowercase" | "uppercase";
+    textTransform?: "none" | "inherit" | "initial" | "-moz-initial" | "revert" | "unset" | "capitalize" | "full-size-kana" | "full-width" | "lowercase" | "uppercase" | undefined;
     fontSize?: string;
 } & import("../..").StyledProps & import("framer-motion").MotionProps, "ref"> & React.RefAttributes<HTMLElement | SVGElement>, never>> & string & Omit<import("framer-motion").CustomDomComponent<import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "textTransform" | "disabled" | keyof React.HTMLAttributes<HTMLParagraphElement> | "inline" | "compact" | keyof import("../..").StyledProps> & React.HTMLAttributes<HTMLParagraphElement> & {
     variant?: import("../../NDSProvider/ComponentVariantContext").ComponentVariant;
     inline?: boolean;
     compact?: boolean;
     disabled?: boolean;
-    textTransform?: "-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "full-width" | "capitalize" | "full-size-kana" | "lowercase" | "uppercase";
+    textTransform?: "none" | "inherit" | "initial" | "-moz-initial" | "revert" | "unset" | "capitalize" | "full-size-kana" | "full-width" | "lowercase" | "uppercase" | undefined;
     fontSize?: string;
 } & import("../..").StyledProps>, keyof React.Component<any, {}, any>>;
 export declare const ResizeHandle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/src/utils/story/resizable.js

@@ -13,7 +13,7 @@ export const Resizable = ({ children, containerWidth = "100%", onResize, showCon
     return (React.createElement(ReResizable, { enable: { right: true }, size: { width: width }, handleComponent: { right: React.createElement(ResizeHandle, null) }, onResizeStart: () => setShowWidth(true), onResizeStop: () => setShowWidth(false), onResize: (_, __, ref) => {
             const width = Math.round(ref.getBoundingClientRect().width);
             setWidth(`${width - (showContainerOutline ? CONTAINER_BORDER_WIDTH : 0)}px`);
-            onResize === null || onResize === void 0 ? void 0 : onResize(width - (showContainerOutline ? CONTAINER_BORDER_WIDTH : 0));
+            onResize?.(width - (showContainerOutline ? CONTAINER_BORDER_WIDTH : 0));
         } }, showContainerOutline ? (React.createElement(DashedBox, null,
         children,
         WidthIndicator)) : (React.createElement(Box, null,

package/dist/src/utils/story/simulatedAPIRequests.js

@@ -1,22 +1,11 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
+export async function filterOptions(inputValue, options, simulatedNetworkDelayMs = 450) {
+    const filteredOptions = options.filter((option) => {
+        return option.label.toLowerCase().startsWith(inputValue.toLowerCase());
     });
-};
-export function filterOptions(inputValue, options, simulatedNetworkDelayMs = 450) {
-    return __awaiter(this, void 0, void 0, function* () {
-        const filteredOptions = options.filter((option) => {
-            return option.label.toLowerCase().startsWith(inputValue.toLowerCase());
-        });
-        const responseBody = JSON.stringify(filteredOptions);
-        return new Promise((resolve) => {
-            setTimeout(() => {
-                resolve(new Response(responseBody));
-            }, simulatedNetworkDelayMs);
-        });
+    const responseBody = JSON.stringify(filteredOptions);
+    return new Promise((resolve) => {
+        setTimeout(() => {
+            resolve(new Response(responseBody));
+        }, simulatedNetworkDelayMs);
     });
 }

package/dist/src/utils/subPx.js

@@ -5,6 +5,6 @@
  * @returns A CSS calc() expression
  */
 export default function subPx(baseValue, subtractValue) {
-    const valueToSubtract = subtractValue !== null && subtractValue !== void 0 ? subtractValue : "1px";
+    const valueToSubtract = subtractValue ?? "1px";
     return `calc(${baseValue} - ${valueToSubtract})`;
 }