@nulogy/components 15.2.2 → 15.2.3

package/dist/src/TopBar/TopBar.styled.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { StyledProps } from "../StyledProps";
 declare const MenuItemList: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, never>> & string;
 declare const Header: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, never>> & string;
@@ -12,11 +11,11 @@ declare const StyledBackLink: import("styled-components/dist/types").IStyledComp
 declare const StyledPageTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, never>> & string;
 declare const Overlay: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: import("react").Ref<HTMLDivElement>;
-}, "as" | keyof import("@reach/dialog/dist/declarations/src").DialogOverlayProps> & import("@reach/dialog/dist/declarations/src").DialogOverlayProps & {
+}, "as" | keyof import("@reach/dialog").DialogOverlayProps> & import("@reach/dialog").DialogOverlayProps & {
     as?: "div";
 } & import("framer-motion").MotionProps, "ref"> & import("react").RefAttributes<HTMLElement | SVGElement>, never>> & string & Omit<import("framer-motion").CustomDomComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: import("react").Ref<HTMLDivElement>;
-}, "as" | keyof import("@reach/dialog/dist/declarations/src").DialogOverlayProps> & import("@reach/dialog/dist/declarations/src").DialogOverlayProps & {
+}, "as" | keyof import("@reach/dialog").DialogOverlayProps> & import("@reach/dialog").DialogOverlayProps & {
     as?: "div";
 }>, keyof import("react").Component<any, {}, any>>;
 declare const TileLink: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, never>> & string;
@@ -35,12 +34,14 @@ declare const StyledMenuItem: import("styled-components/dist/types").IStyledComp
     suppressContentEditableWarning?: boolean;
     suppressHydrationWarning?: boolean;
     accessKey?: string;
+    autoCapitalize?: (string & {}) | "none" | "off" | "on" | "sentences" | "words" | "characters";
     autoFocus?: boolean;
     className?: string;
     contentEditable?: "inherit" | (boolean | "true" | "false");
     contextMenu?: string;
     dir?: string;
     draggable?: boolean | "true" | "false";
+    enterKeyHint?: "search" | "enter" | "done" | "go" | "next" | "previous" | "send";
     id?: string;
     lang?: string;
     nonce?: string;
@@ -58,7 +59,6 @@ declare const StyledMenuItem: import("styled-components/dist/types").IStyledComp
     rev?: string;
     typeof?: string;
     vocab?: string;
-    autoCapitalize?: string;
     autoCorrect?: string;
     autoSave?: string;
     itemProp?: string;
@@ -68,20 +68,26 @@ declare const StyledMenuItem: import("styled-components/dist/types").IStyledComp
     itemRef?: string;
     results?: number;
     security?: string;
-    unselectable?: "on" | "off";
+    unselectable?: "off" | "on";
     inputMode?: "search" | "text" | "none" | "tel" | "url" | "email" | "numeric" | "decimal";
     is?: string;
+    exportparts?: string;
+    part?: string;
     "aria-activedescendant"?: string;
     "aria-atomic"?: boolean | "true" | "false";
     "aria-autocomplete"?: "none" | "list" | "inline" | "both";
+    "aria-braillelabel"?: string;
+    "aria-brailleroledescription"?: string;
     "aria-busy"?: boolean | "true" | "false";
     "aria-checked"?: boolean | "true" | "false" | "mixed";
     "aria-colcount"?: number;
     "aria-colindex"?: number;
+    "aria-colindextext"?: string;
     "aria-colspan"?: number;
     "aria-controls"?: string;
-    "aria-current"?: boolean | "time" | "true" | "false" | "step" | "page" | "location" | "date";
+    "aria-current"?: boolean | "time" | "page" | "true" | "false" | "step" | "location" | "date";
     "aria-describedby"?: string;
+    "aria-description"?: string;
     "aria-details"?: string;
     "aria-disabled"?: boolean | "true" | "false";
     "aria-dropeffect"?: "link" | "none" | "copy" | "move" | "execute" | "popup";
@@ -111,6 +117,7 @@ declare const StyledMenuItem: import("styled-components/dist/types").IStyledComp
     "aria-roledescription"?: string;
     "aria-rowcount"?: number;
     "aria-rowindex"?: number;
+    "aria-rowindextext"?: string;
     "aria-rowspan"?: number;
     "aria-selected"?: boolean | "true" | "false";
     "aria-setsize"?: number;
@@ -140,7 +147,7 @@ declare const StyledMenuItem: import("styled-components/dist/types").IStyledComp
     onBlurCapture?: import("react").FocusEventHandler<HTMLLIElement>;
     onChange?: import("react").FormEventHandler<HTMLLIElement>;
     onChangeCapture?: import("react").FormEventHandler<HTMLLIElement>;
-    onBeforeInput?: import("react").FormEventHandler<HTMLLIElement>;
+    onBeforeInput?: import("react").InputEventHandler<HTMLLIElement>;
     onBeforeInputCapture?: import("react").FormEventHandler<HTMLLIElement>;
     onInput?: import("react").FormEventHandler<HTMLLIElement>;
     onInputCapture?: import("react").FormEventHandler<HTMLLIElement>;

package/dist/src/TopBar/components/BackLink.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 { Box } from "../../Box";
 import useMediaQuery from "../../hooks/useMediaQuery";
@@ -21,11 +10,10 @@ const BACK_LINK_MAX_WIDTH = {
     tabletLandscape: "20ch",
     laptop: "24ch",
 };
-export function BackLink(_a) {
-    var { children, maxWidth = BACK_LINK_MAX_WIDTH } = _a, props = __rest(_a, ["children", "maxWidth"]);
+export function BackLink({ children, maxWidth = BACK_LINK_MAX_WIDTH, ...props }) {
     const md = useMediaQuery("phoneLandscape");
     return (React.createElement(Box, { as: "li", flex: "1 1" },
-        React.createElement(StyledBackLink, Object.assign({}, props, { "data-testid": "topbar-back-link" }),
+        React.createElement(StyledBackLink, { ...props, "data-testid": "topbar-back-link" },
             React.createElement(Icon, { icon: "arrowBack" }),
             md && (React.createElement(Text, { maxWidth: maxWidth, textOverflow: "ellipsis", overflow: "hidden", fontSize: "small" }, children)))));
 }

package/dist/src/TopBar/components/Menu.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 { DialogContent } from "@reach/dialog";
 import { AnimatePresence } from "framer-motion";
 import React from "react";
@@ -38,9 +27,7 @@ const blurVariants = {
         },
     },
 };
-export function Menu(_a) {
-    var _b;
-    var { children, defaultOpened = false } = _a, props = __rest(_a, ["children", "defaultOpened"]);
+export function Menu({ children, defaultOpened = false, ...props }) {
     const [showMenu, setShowMenu] = React.useState(defaultOpened);
     const [animationComplete, setAnimationComplete] = React.useState(false);
     const { t } = useTranslation();
@@ -62,6 +49,6 @@ export function Menu(_a) {
                     setAnimationComplete(true);
                 }
             }, onDismiss: close },
-            React.createElement(DialogContent, { "data-testid": "topbar-menu", "data-visible": animationComplete ? true : undefined, "aria-label": (_b = props["aria-label"]) !== null && _b !== void 0 ? _b : t("menu options") },
+            React.createElement(DialogContent, { "data-testid": "topbar-menu", "data-visible": animationComplete ? true : undefined, "aria-label": props["aria-label"] ?? t("menu options") },
                 React.createElement(MenuItemList, null, children)))))));
 }

package/dist/src/TopBar/components/MenuItemLink.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 { motion } from "framer-motion";
 import React from "react";
 import { Flex } from "../../Flex";
@@ -16,9 +5,8 @@ import { Icon } from "../../Icon";
 import { Text } from "../../Type";
 import { TileLink } from "../TopBar.styled";
 const MotionText = motion(Text);
-export function MenuItemLink(_a) {
-    var { description, title, icon } = _a, props = __rest(_a, ["description", "title", "icon"]);
-    return (React.createElement(TileLink, Object.assign({}, props),
+export function MenuItemLink({ description, title, icon, ...props }) {
+    return (React.createElement(TileLink, { ...props },
         React.createElement(Icon, { icon: icon, size: "x3" }),
         React.createElement(Flex, { flexDirection: "column", justifyContent: "center" },
             React.createElement(MotionText, { fontWeight: "medium", fontSize: "md", lineHeight: "base" }, title),

package/dist/src/TopBar/components/PageTitle.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 { StyledPageTitle } from "../TopBar.styled";
-export function PageTitle(_a) {
-    var { children } = _a, props = __rest(_a, ["children"]);
-    return (React.createElement(StyledPageTitle, Object.assign({ "data-testid": "topbar-page-title" }, props), children));
+export function PageTitle({ children, ...props }) {
+    return (React.createElement(StyledPageTitle, { "data-testid": "topbar-page-title", ...props }, children));
 }

package/dist/src/TopBar/stories/TopBar.backButton.story.js

@@ -21,7 +21,7 @@ export default {
 export const WithNoLabel = () => (React.createElement(TopBar.Root, null,
     React.createElement(TopBar.BackLink, { href: "/cycle-counts" }),
     React.createElement(TopBar.PageTitle, null, "Cycle count #3992"),
-    React.createElement(TopBar.Menu, null, menuItems.map((props) => (React.createElement(TopBar.MenuItem, Object.assign({ key: props.title }, props)))))));
+    React.createElement(TopBar.Menu, null, menuItems.map((props) => (React.createElement(TopBar.MenuItem, { key: props.title, ...props }))))));
 export const WithACustomMaxWidth = () => (React.createElement(TopBar.Root, null,
     React.createElement(TopBar.BackLink, { href: "/cycle-counts", maxWidth: {
             small: "10ch",
@@ -31,10 +31,10 @@ export const WithACustomMaxWidth = () => (React.createElement(TopBar.Root, null,
         } }, "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 })))))));
 export const WithARouterLink = () => (React.createElement(BrowserRouter, null,
     React.createElement(TopBar.Root, null,
         React.createElement(Link, { component: TopBar.BackLink, to: "/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 }))))))));

package/dist/src/TopBar/stories/TopBar.menu.story.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 { Link, BrowserRouter } from "react-router-dom";
 import { TopBar } from "../TopBar";
@@ -34,31 +23,31 @@ export const withDefaultOpenMenu = () => (React.createElement(TopBar.Root, null,
     React.createElement(TopBar.BackLink, { href: "#" }, "Cycle counts"),
     React.createElement(TopBar.PageTitle, null, "Cycle count #3992"),
     React.createElement(TopBar.Menu, { defaultOpened: true }, menuItems.map((props) => (React.createElement(TopBar.MenuItem, { key: props.title },
-        React.createElement(TopBar.MenuItemLink, Object.assign({}, props))))))));
+        React.createElement(TopBar.MenuItemLink, { ...props })))))));
 export const WithOneMenuItem = () => (React.createElement(TopBar.Root, null,
     React.createElement(TopBar.BackLink, { href: "#" }, "Cycle counts"),
     React.createElement(TopBar.PageTitle, null, "Cycle count #3992"),
     React.createElement(TopBar.Menu, { defaultOpened: true }, menuItems.slice(0, 1).map((props) => (React.createElement(TopBar.MenuItem, { key: props.title },
-        React.createElement(TopBar.MenuItemLink, Object.assign({}, props))))))));
+        React.createElement(TopBar.MenuItemLink, { ...props })))))));
 export const WithTwoItems = () => (React.createElement(TopBar.Root, null,
     React.createElement(TopBar.BackLink, { href: "#" }, "Cycle counts"),
     React.createElement(TopBar.PageTitle, null, "Cycle count #3992"),
     React.createElement(TopBar.Menu, { defaultOpened: true }, menuItems.slice(0, 2).map((props) => (React.createElement(TopBar.MenuItem, { key: props.title },
-        React.createElement(TopBar.MenuItemLink, Object.assign({}, props))))))));
+        React.createElement(TopBar.MenuItemLink, { ...props })))))));
 export const WithThreeItems = () => (React.createElement(TopBar.Root, null,
     React.createElement(TopBar.BackLink, { href: "#" }, "Cycle counts"),
     React.createElement(TopBar.PageTitle, null, "Cycle count #3992"),
     React.createElement(TopBar.Menu, { defaultOpened: true }, menuItems.slice(0, 3).map((props) => (React.createElement(TopBar.MenuItem, { key: props.title },
-        React.createElement(TopBar.MenuItemLink, Object.assign({}, props))))))));
+        React.createElement(TopBar.MenuItemLink, { ...props })))))));
 export const WithRouterLinks = () => {
-    const routerMenuItems = menuItems.map((_a) => {
-        var { href } = _a, item = __rest(_a, ["href"]);
-        return (Object.assign(Object.assign({}, item), { to: href }));
-    });
+    const routerMenuItems = menuItems.map(({ href, ...item }) => ({
+        ...item,
+        to: href,
+    }));
     return (React.createElement(TopBar.Root, null,
         React.createElement(TopBar.BackLink, { href: "#" }, "Cycle counts"),
         React.createElement(TopBar.PageTitle, null, "Cycle count #3992"),
         React.createElement(TopBar.Menu, { defaultOpened: true },
             React.createElement(BrowserRouter, { basename: "/" }, routerMenuItems.map((item) => (React.createElement(TopBar.MenuItem, { key: item.title },
-                React.createElement(Link, Object.assign({ component: TopBar.MenuItemLink }, item)))))))));
+                React.createElement(Link, { component: TopBar.MenuItemLink, ...item }))))))));
 };

package/dist/src/TopBar/stories/TopBar.story.js

@@ -24,17 +24,17 @@ export const Default = () => (React.createElement(TopBar.Root, null,
     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 })))))));
 export const WithALongTitle = () => (React.createElement(TopBar.Root, null,
     React.createElement(TopBar.BackLink, { href: "/cycle-counts" }, "Previous page title"),
     React.createElement(TopBar.PageTitle, null, "A long title that can not fit on smaller screens"),
     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 })))))));
 export const WithAnApplicationFrame = () => (React.createElement(ApplicationFrame, { navBar: React.createElement(TopBar.Root, null,
         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(FormSection, { title: "Personal Information" },
             React.createElement(Input, { id: "name", labelText: "Name" }),

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;
     });