@ndlib/component-library 1.0.45 → 1.0.46

package/dist/components/composites/ModalV2/index.js

@@ -27,21 +27,21 @@ export const ModalV2 = (_a) => {
     const { breakpoint } = useMediaQueryV2();
     const { modal } = useComponentConfig();
     const shouldShowFooter = footer !== undefined || (actions !== undefined && actions.length > 0);
-    const modalBody = (_jsxs(GroupV2, Object.assign({ type: GROUPV2_TYPE.REGION, sx: { my: 0 } }, { children: [!hideHeading && (_jsxs(RowV2, Object.assign({ justify: "space-between", align: "center", sx: {
+    const modalBody = (_jsxs(GroupV2, { type: GROUPV2_TYPE.REGION, sx: { my: 0 }, children: [!hideHeading && (_jsxs(RowV2, { justify: "space-between", align: "center", sx: {
                     p: 3,
                     borderBottom: 'solid 1px',
                     borderColor: COLOR.LIGHT_GRAY,
-                } }, { children: [_jsx(HeadingV2, Object.assign({ size: HEADINGV2_SIZE.SM, typography: TYPOGRAPHY_TYPE.CONTROL_MEDIUM, sx: { mt: 0 } }, { children: heading })), _jsx(ButtonV2, Object.assign({ type: BUTTONV2_TYPE.TEXT, onClick: (e) => {
+                }, children: [_jsx(HeadingV2, { size: HEADINGV2_SIZE.SM, typography: TYPOGRAPHY_TYPE.CONTROL_MEDIUM, sx: { mt: 0 }, children: heading }), _jsx(ButtonV2, { type: BUTTONV2_TYPE.TEXT, onClick: (e) => {
                             e.preventDefault();
                             e.stopPropagation();
                             close(e);
-                        } }, { children: "Close" }))] }))), _jsx(RowV2, Object.assign({ sx: Object.assign({ p: 3 }, bodyStyles) }, { children: children })), shouldShowFooter && (_jsxs(RowV2, Object.assign({ sx: { borderTop: 'solid 1px', borderColor: COLOR.LIGHT_GRAY, p: 3 } }, { children: [footer, actions !== undefined && (_jsx(RowV2, Object.assign({ sx: { width: '100%', justifyContent: 'flex-end' } }, { children: actions.map((action, index) => (_jsx(ButtonV2, Object.assign({ type: action.isPrimary
+                        }, children: "Close" })] })), _jsx(RowV2, { sx: Object.assign({ p: 3 }, bodyStyles), children: children }), shouldShowFooter && (_jsxs(RowV2, { sx: { borderTop: 'solid 1px', borderColor: COLOR.LIGHT_GRAY, p: 3 }, children: [footer, actions !== undefined && (_jsx(RowV2, { sx: { width: '100%', justifyContent: 'flex-end' }, children: actions.map((action, index) => (_jsx(ButtonV2, Object.assign({ type: action.isPrimary
                                 ? BUTTONV2_TYPE.DEFAULT
                                 : BUTTONV2_TYPE.OUTLINE, onClick: (e) => {
                                 action.onClick(e);
                             }, sx: {
                                 mr: index < actions.length - 1 ? 1 : 0,
-                            } }, action.buttonProps, { children: action.label }), index))) })))] })))] })));
+                            } }, action.buttonProps, { children: action.label }), index))) }))] }))] }));
     return (_jsx(ReactModal, Object.assign({ isOpen: isOpen, shouldFocusAfterRender: true, appElement: modal.appElement, onRequestClose: (e) => {
             e.preventDefault();
             e.stopPropagation();
@@ -61,5 +61,5 @@ export const ModalV2 = (_a) => {
                 marginRight: '-50%',
                 transform: 'translate(-50%, -50%)',
             },
-        } }, { children: modalBody })));
+        }, children: modalBody })));
 };

package/dist/components/composites/NavMenu/demo.js

@@ -169,4 +169,4 @@ const demoMenu = {
         },
     ],
 };
-export const DemoMenuImplementation = () => (_jsx(MenuProvider, Object.assign({ menu: demoMenu }, { children: ({ menu, getMenuProps, getMenuItemProps }) => (_jsxs(_Fragment, { children: [_jsx(Row, Object.assign({}, getMenuProps(), { children: menu.items.map((menuItem) => (_createElement(Button, Object.assign({}, getMenuItemProps([menuItem.id]), { sx: { m: 1 }, key: menuItem.id }), menuItem.label))) })), _jsx(NavMenu, {})] })) })));
+export const DemoMenuImplementation = () => (_jsx(MenuProvider, { menu: demoMenu, children: ({ menu, getMenuProps, getMenuItemProps }) => (_jsxs(_Fragment, { children: [_jsx(Row, Object.assign({}, getMenuProps(), { children: menu.items.map((menuItem) => (_createElement(Button, Object.assign({}, getMenuItemProps([menuItem.id]), { sx: { m: 1 }, key: menuItem.id }), menuItem.label))) })), _jsx(NavMenu, {})] })) }));

package/dist/components/composites/NavMenu/index.js

@@ -35,7 +35,7 @@ export const NavMenu = (props) => {
         return null;
     }
     const submenu = activeTopLevelMenu.action.submenu;
-    return (_jsxs(Row, Object.assign({}, rest, { sx: Object.assign({ justifyContent: 'center', p: 3, border: 'solid 1px', borderColor: COLOR.EXTRA_LIGHT_GRAY, bg: COLOR.WHITE, borderRadius: '4px', margin: '0px 10px 0px 10px' }, sx) }, { children: [_jsx(Column, { sx: { flexGrow: 1 } }), submenu.items.map((submenuItem, i) => {
+    return (_jsxs(Row, Object.assign({}, rest, { sx: Object.assign({ justifyContent: 'center', p: 3, border: 'solid 1px', borderColor: COLOR.EXTRA_LIGHT_GRAY, bg: COLOR.WHITE, borderRadius: '4px', margin: '0px 10px 0px 10px' }, sx), children: [_jsx(Column, { sx: { flexGrow: 1 } }), submenu.items.map((submenuItem, i) => {
                 if (!(submenuItem.action.type === MENU_ACTION_TYPE.SUBMENU)) {
                     return null;
                 }
@@ -43,18 +43,18 @@ export const NavMenu = (props) => {
                 const submenuPath = [topLevelMenuId, submenuItem.id];
                 const link = '//' + document.location.host + topLevelMenuId;
                 const category = topLevelMenuId.charAt(1).toUpperCase() + topLevelMenuId.slice(2);
-                return (_jsxs(Column, Object.assign({ sx: {
+                return (_jsxs(Column, { sx: {
                         flexBasis: '300px',
                         py: 2,
                         px: 4,
                         flexShrink: 0,
                         flexGrow: 0,
-                    } }, { children: [_jsx(Heading, Object.assign({ standalone: true, size: HEADING_SIZE.SM, underline: true }, getMenuItemProps(submenuPath), { children: submenuItem.label })), _jsx(List, Object.assign({}, getMenuProps(submenuPath), { icon: ChevronRightIcon, iconSize: FONT_SIZE.MS }, { children: leafMenuItems.map((leafMenuItem, i) => {
+                    }, children: [_jsx(Heading, Object.assign({ standalone: true, size: HEADING_SIZE.SM, underline: true }, getMenuItemProps(submenuPath), { children: submenuItem.label })), _jsx(List, Object.assign({}, getMenuProps(submenuPath), { icon: ChevronRightIcon, iconSize: FONT_SIZE.MS, children: leafMenuItems.map((leafMenuItem, i) => {
                                 var _a;
                                 const leafMenuPath = submenuPath.concat(leafMenuItem.id);
-                                return (_jsx(ListItem, Object.assign({ index: i, sx: { mt: 2 } }, getMenuItemProps(leafMenuPath), { children: _jsx(Link, Object.assign({ to: (_a = leafMenuItem === null || leafMenuItem === void 0 ? void 0 : leafMenuItem.action) === null || _a === void 0 ? void 0 : _a.to, sx: {
+                                return (_jsx(ListItem, Object.assign({ index: i, sx: { mt: 2 } }, getMenuItemProps(leafMenuPath), { children: _jsx(Link, { to: (_a = leafMenuItem === null || leafMenuItem === void 0 ? void 0 : leafMenuItem.action) === null || _a === void 0 ? void 0 : _a.to, sx: {
                                             fontWeight: FONT_WEIGHT.BOLD,
-                                        }, tabIndex: -1 }, { children: leafMenuItem.label })) }), leafMenuItem.id));
-                            }) })), i < 1 && (link.includes('esearch') || link.includes('ervices')) ? (_jsxs(ArrowLink, Object.assign({ to: link, sx: { margin: '20px 10px 10px 10px' } }, { children: ["View More ", category] }))) : null] }), submenuItem.id));
+                                        }, tabIndex: -1, children: leafMenuItem.label }) }), leafMenuItem.id));
+                            }) })), i < 1 && (link.includes('esearch') || link.includes('ervices')) ? (_jsxs(ArrowLink, { to: link, sx: { margin: '20px 10px 10px 10px' }, children: ["View More ", category] })) : null] }, submenuItem.id));
             }), _jsx(Column, { sx: { flexGrow: 1 } })] })));
 };

package/dist/components/composites/NavMenuV2/demoV2.js

@@ -180,10 +180,10 @@ const demoMenuV2 = {
         },
     ],
 };
-export const DemoMenuImplementationV2 = () => (_jsx(MenuProvider, Object.assign({ menu: demoMenuV2 }, { children: ({ menu, getMenuProps, getMenuItemProps }) => {
+export const DemoMenuImplementationV2 = () => (_jsx(MenuProvider, { menu: demoMenuV2, children: ({ menu, getMenuProps, getMenuItemProps }) => {
         const getPropsWithoutStyle = (props) => {
             const { style: _style } = props, propsWithoutStyle = __rest(props, ["style"]);
             return propsWithoutStyle;
         };
         return (_jsxs(_Fragment, { children: [_jsx(RowV2, Object.assign({}, getMenuProps(), { children: menu.items.map((menuItem) => (_createElement(ButtonV2, Object.assign({}, getPropsWithoutStyle(getMenuItemProps([menuItem.id])), { sx: { margin: '4px' }, key: menuItem.id }), menuItem.label))) })), _jsx(NavMenuV2, {})] }));
-    } })));
+    } }));

package/dist/components/composites/NavMenuV2/index.js

@@ -47,10 +47,10 @@ export const NavMenuV2 = (props) => {
                 const submenuPath = [topLevelMenuId, submenuItem.id];
                 const link = '//' + document.location.host + topLevelMenuId;
                 const category = topLevelMenuId.charAt(0).toUpperCase() + topLevelMenuId.slice(1);
-                return (_jsxs(ColumnV2, Object.assign({ className: typeSafeStyles.submenuCol }, { children: [_jsx("div", Object.assign({}, getPropsWithoutStyle(() => getMenuItemProps(submenuPath)), { children: _jsx(HeadingV2, Object.assign({ standalone: true, size: HEADINGV2_SIZE.SM, underline: true }, { children: submenuItem.label })) })), _jsx(ListV2, Object.assign({}, getPropsWithoutStyle(() => getMenuProps(submenuPath)), { icon: ChevronRightIcon, iconSize: FONT_SIZE.MS }, { children: leafMenuItems.map((leafMenuItem, i) => {
+                return (_jsxs(ColumnV2, { className: typeSafeStyles.submenuCol, children: [_jsx("div", Object.assign({}, getPropsWithoutStyle(() => getMenuItemProps(submenuPath)), { children: _jsx(HeadingV2, { standalone: true, size: HEADINGV2_SIZE.SM, underline: true, children: submenuItem.label }) })), _jsx(ListV2, Object.assign({}, getPropsWithoutStyle(() => getMenuProps(submenuPath)), { icon: ChevronRightIcon, iconSize: FONT_SIZE.MS, children: leafMenuItems.map((leafMenuItem, i) => {
                                 var _a;
                                 const leafMenuPath = submenuPath.concat(leafMenuItem.id);
-                                return (_jsx(ListItemV2, Object.assign({ index: i, sx: { mt: 2 } }, getPropsWithoutStyle(() => getMenuItemProps(leafMenuPath)), { children: _jsx("a", Object.assign({ href: (_a = leafMenuItem === null || leafMenuItem === void 0 ? void 0 : leafMenuItem.action) === null || _a === void 0 ? void 0 : _a.to, className: typeSafeStyles.leafMenuLink, tabIndex: -1 }, { children: leafMenuItem.label })) }), leafMenuItem.id));
-                            }) })), i < 1 && (link.includes('esearch') || link.includes('ervices')) ? (_jsxs(ArrowLinkV2, Object.assign({ to: link, sx: { m: '20px 10px 10px 10px' } }, { children: ["View More ", category] }))) : null] }), submenuItem.id));
+                                return (_jsx(ListItemV2, Object.assign({ index: i, sx: { mt: 2 } }, getPropsWithoutStyle(() => getMenuItemProps(leafMenuPath)), { children: _jsx("a", { href: (_a = leafMenuItem === null || leafMenuItem === void 0 ? void 0 : leafMenuItem.action) === null || _a === void 0 ? void 0 : _a.to, className: typeSafeStyles.leafMenuLink, tabIndex: -1, children: leafMenuItem.label }) }), leafMenuItem.id));
+                            }) })), i < 1 && (link.includes('esearch') || link.includes('ervices')) ? (_jsxs(ArrowLinkV2, { to: link, sx: { m: '20px 10px 10px 10px' }, children: ["View More ", category] })) : null] }, submenuItem.id));
             }), _jsx(ColumnV2, { sx: { flexGrow: 1 } })] })));
 };

package/dist/components/composites/Seo/SeoDataDisplay/index.js

@@ -3,7 +3,7 @@ import ReactDOMServer from 'react-dom/server';
 import pretty from 'pretty';
 import { Seo } from '../index';
 export const SeoDataDisplay = () => {
-    const seoHtml = ReactDOMServer.renderToString(_jsx(Seo, { pathname: 'news/story_for_website' }));
+    const seoHtml = ReactDOMServer.renderToString((_jsx(Seo, { pathname: 'news/story_for_website' })));
     return (_jsx("code", { children: _jsx("pre", { children: pretty(seoHtml) }) }));
 };
 export default SeoDataDisplay;

package/dist/components/composites/Seo/index.js

@@ -11,6 +11,6 @@ export const Seo = ({ title, description, image, nofollow, noindex, pathname, })
         noindex: noindex || defaultNoindex,
         twitterUsername,
     };
-    return (_jsxs(_Fragment, { children: [_jsx("link", { rel: "canonical", href: seo.url }), seo.title ? _jsx("title", Object.assign({ "data-testid": "seo-title" }, { children: seo.title })) : null, seo.title ? (_jsx("meta", { "data-testid": "seo-twitter-title", name: "twitter:title", content: seo.title })) : null, seo.url ? (_jsx("meta", { "data-testid": "seo-twitter-url", name: "twitter:url", content: seo.url })) : null, seo.description ? (_jsx("meta", { "data-testid": "seo-twitter-description", name: "twitter:description", content: seo.description })) : null, seo.image ? (_jsx("meta", { "data-testid": "seo-twitter-image", property: "og:image", name: "twitter:image", content: seo.image })) : null, _jsx("meta", { name: "twitter:card", content: "summary_large_image" }), seo.twitterUsername ? (_jsx("meta", { "data-testid": "seo-twitter-creator", name: "twitter:creator", content: seo.twitterUsername })) : null, seo.url ? (_jsx("meta", { "data-testid": "seo-og-url", property: "og:url", content: seo.url })) : null, seo.title ? (_jsx("meta", { "data-testid": "seo-og-title", property: "og:title", content: seo.title })) : null, seo.description ? (_jsx("meta", { "data-testid": "seo-og-description", property: "og:description", content: seo.description })) : null, seo.image ? (_jsx("meta", { "data-testid": "seo-og-image", name: "og:image", content: seo.image })) : null, seo.nofollow ? (_jsx("meta", { "data-testid": "seo-nofollow", name: "robots", content: "nofollow" })) : null, seo.noindex ? (_jsx("meta", { "data-testid": "seo-noindex", name: "robots", content: "noindex" })) : null, _jsx("meta", { name: "viewport", content: "width=device-width, initial-scale=1" })] }));
+    return (_jsxs(_Fragment, { children: [_jsx("link", { rel: "canonical", href: seo.url }), seo.title ? _jsx("title", { "data-testid": "seo-title", children: seo.title }) : null, seo.title ? (_jsx("meta", { "data-testid": "seo-twitter-title", name: "twitter:title", content: seo.title })) : null, seo.url ? (_jsx("meta", { "data-testid": "seo-twitter-url", name: "twitter:url", content: seo.url })) : null, seo.description ? (_jsx("meta", { "data-testid": "seo-twitter-description", name: "twitter:description", content: seo.description })) : null, seo.image ? (_jsx("meta", { "data-testid": "seo-twitter-image", property: "og:image", name: "twitter:image", content: seo.image })) : null, _jsx("meta", { name: "twitter:card", content: "summary_large_image" }), seo.twitterUsername ? (_jsx("meta", { "data-testid": "seo-twitter-creator", name: "twitter:creator", content: seo.twitterUsername })) : null, seo.url ? (_jsx("meta", { "data-testid": "seo-og-url", property: "og:url", content: seo.url })) : null, seo.title ? (_jsx("meta", { "data-testid": "seo-og-title", property: "og:title", content: seo.title })) : null, seo.description ? (_jsx("meta", { "data-testid": "seo-og-description", property: "og:description", content: seo.description })) : null, seo.image ? (_jsx("meta", { "data-testid": "seo-og-image", name: "og:image", content: seo.image })) : null, seo.nofollow ? (_jsx("meta", { "data-testid": "seo-nofollow", name: "robots", content: "nofollow" })) : null, seo.noindex ? (_jsx("meta", { "data-testid": "seo-noindex", name: "robots", content: "noindex" })) : null, _jsx("meta", { name: "viewport", content: "width=device-width, initial-scale=1" })] }));
 };
 export default Seo;

package/dist/components/composites/SnackBar/examples.js

@@ -7,29 +7,29 @@ import { SnackBar } from '.';
 export const BasicExample = () => {
     const { addMessage } = useSnackBar();
     const [messageCount, setMessageCount] = useState(1);
-    return (_jsxs(_Fragment, { children: [_jsx(Button, Object.assign({ onClick: () => {
+    return (_jsxs(_Fragment, { children: [_jsx(Button, { onClick: () => {
                     setMessageCount(messageCount + 1);
                     addMessage({ message: `Message ${messageCount}` });
-                } }, { children: "Add Message" })), _jsx(SnackBar, {})] }));
+                }, children: "Add Message" }), _jsx(SnackBar, {})] }));
 };
 export const ReplaceMessageExample = () => {
     const { addMessage } = useSnackBar();
     const [messageCount, setMessageCount] = useState(1);
-    return (_jsxs(_Fragment, { children: [_jsx(Button, Object.assign({ onClick: () => {
+    return (_jsxs(_Fragment, { children: [_jsx(Button, { onClick: () => {
                     setMessageCount(messageCount + 1);
                     addMessage({ message: `Message ${messageCount}`, id: 'same-id' });
-                } }, { children: "Add Message" })), _jsx(SnackBar, {})] }));
+                }, children: "Add Message" }), _jsx(SnackBar, {})] }));
 };
 export const WipeMessagesExample = () => {
     const { addMessage } = useSnackBar();
     const [messageCount, setMessageCount] = useState(1);
-    return (_jsxs(Row, { children: [_jsx(Button, Object.assign({ onClick: () => {
+    return (_jsxs(Row, { children: [_jsx(Button, { onClick: () => {
                     setMessageCount((count) => count + 1);
                     addMessage({ message: `Message ${messageCount}` });
-                }, sx: { mr: 1 } }, { children: "Add Message" })), _jsx(Button, Object.assign({ onClick: () => {
+                }, sx: { mr: 1 }, children: "Add Message" }), _jsx(Button, { onClick: () => {
                     setMessageCount((count) => count + 1);
                     addMessage({ message: `Message ${messageCount}` }, {
                         wipePrevious: true,
                     });
-                } }, { children: "Wipe and Add" })), _jsx(SnackBar, {})] }));
+                }, children: "Wipe and Add" }), _jsx(SnackBar, {})] }));
 };

package/dist/components/composites/SnackBar/index.js

@@ -25,7 +25,7 @@ export const SnackBar = () => {
     const typographyStyles = getTypographyStyles(TYPOGRAPHY_TYPE.CONDENSED_TEXT_MEDIUM);
     const animation = getAnimation(messages.length, previousMessageCount);
     const animationStyle = `${animation} 100ms linear 1 forwards`;
-    return (_jsx(Column, Object.assign({ sx: {
+    return (_jsx(Column, { sx: {
             position: 'fixed',
             left: 0,
             top: '100%',
@@ -35,11 +35,11 @@ export const SnackBar = () => {
             pb: 3,
             animation: animationStyle,
             zIndex: Z_INDEX.DIALOG,
-        } }, { children: messages.map((message) => (_jsxs(Row, Object.assign({ sx: Object.assign({ width: ['90vw', '500px'], height: '56px', borderRadius: '4px', p: 4, mt: '0.5rem', border: '1px solid', bg: COLOR.PRIMARY, color: COLOR.WHITE, justifyContent: 'space-between', alignItems: 'center' }, typographyStyles) }, { children: [_jsx(Box, Object.assign({ sx: {
+        }, children: messages.map((message) => (_jsxs(Row, { sx: Object.assign({ width: ['90vw', '500px'], height: '56px', borderRadius: '4px', p: 4, mt: '0.5rem', border: '1px solid', bg: COLOR.PRIMARY, color: COLOR.WHITE, justifyContent: 'space-between', alignItems: 'center' }, typographyStyles), children: [_jsx(Box, { sx: {
                         overflow: 'hidden',
                         whiteSpace: 'nowrap',
                         textOverflow: 'ellipsis',
-                    }, "aria-live": "polite" }, { children: message.message })), _jsx(Box, { children: _jsx(Button, { "aria-label": "Dismiss Notice", type: BUTTON_TYPE.TEXT, primaryIcon: CloseIcon, onClick: () => {
+                    }, "aria-live": "polite", children: message.message }), _jsx(Box, { children: _jsx(Button, { "aria-label": "Dismiss Notice", type: BUTTON_TYPE.TEXT, primaryIcon: CloseIcon, onClick: () => {
                             removeMessage(message.id);
-                        }, textColor: COLOR.WHITE }) })] }), message.id))) })));
+                        }, textColor: COLOR.WHITE }) })] }, message.id))) }));
 };

package/dist/components/composites/StructuredData/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export type StructuredDataProps = {
     title?: string;
     pathname?: string;

package/dist/components/composites/StructuredData/index.js

@@ -55,6 +55,6 @@ export const getStructuredDataSchemas = ({ title, pathname, description, nofollo
 };
 export const StructuredData = (props) => {
     const schemas = getStructuredDataSchemas(props);
-    return (_jsx(_Fragment, { children: schemas.map((schema, index) => (_jsx("script", Object.assign({ type: "application/ld+json" }, { children: schema }), index))) }));
+    return (_jsx(_Fragment, { children: schemas.map((schema, index) => (_jsx("script", { type: "application/ld+json", children: schema }, index))) }));
 };
 export default StructuredData;

package/dist/components/elements/Alerts/Alerts.stories.js

@@ -10,8 +10,8 @@ const meta = {
 };
 export default meta;
 export const Default = {
-    render: () => (_jsx(AlertsProvider, Object.assign({ startTime: new Date('2022-01-01').toISOString(), endTime: new Date('2022-01-01').toISOString(), endpoint: "http://localhost:1337/graphql" }, { children: _jsx(Alerts, {}) }))),
+    render: () => (_jsx(AlertsProvider, { startTime: new Date('2022-01-01').toISOString(), endTime: new Date('2022-01-01').toISOString(), endpoint: "http://localhost:1337/graphql", children: _jsx(Alerts, {}) })),
 };
 export const CustomizeAlertStyles = {
-    render: () => (_jsx(AlertsProvider, Object.assign({ startTime: new Date('2022-01-01').toISOString(), endTime: new Date('2022-01-01').toISOString(), endpoint: "http://localhost:1337/graphql" }, { children: _jsx(Alerts, { alertStyles: { borderRadius: '0px' } }) }))),
+    render: () => (_jsx(AlertsProvider, { startTime: new Date('2022-01-01').toISOString(), endTime: new Date('2022-01-01').toISOString(), endpoint: "http://localhost:1337/graphql", children: _jsx(Alerts, { alertStyles: { borderRadius: '0px' } }) })),
 };

package/dist/components/elements/Alerts/index.js

@@ -67,11 +67,11 @@ export const Alert = (_a) => {
         [ALERT_TYPE.SUCCESS]: SuccessIcon,
     }[type];
     const mergedStyles = Object.assign(Object.assign({}, style), sx);
-    return (_jsx(Row, Object.assign({ sx: mergedStyles }, rest, { children: _jsxs(Row, Object.assign({ sx: {
+    return (_jsx(Row, Object.assign({ sx: mergedStyles }, rest, { children: _jsxs(Row, { sx: {
                 boxSizing: 'border-box',
                 margin: '0 auto',
                 pl: '.5rem',
                 pr: '.5rem',
                 width: '100%',
-            } }, { children: [icon && _jsx(Icon, { icon: icon, sx: { mr: 4 }, size: FONT_SIZE.LG }), _jsx(Row, Object.assign({ sx: { flexGrow: 1, justifyContent: 'center' } }, { children: _jsx(Markdown, { content: description }) })), _jsx(Button, Object.assign({ type: BUTTON_TYPE.TEXT, onClick: dismiss, sx: { ml: 4 } }, { children: "Dismiss" }))] })) })));
+            }, children: [icon && _jsx(Icon, { icon: icon, sx: { mr: 4 }, size: FONT_SIZE.LG }), _jsx(Row, { sx: { flexGrow: 1, justifyContent: 'center' }, children: _jsx(Markdown, { content: description }) }), _jsx(Button, { type: BUTTON_TYPE.TEXT, onClick: dismiss, sx: { ml: 4 }, children: "Dismiss" })] }) })));
 };

package/dist/components/elements/AlertsV2/AlertsV2.stories.js

@@ -10,8 +10,8 @@ const meta = {
 };
 export default meta;
 export const Default = {
-    render: () => (_jsx(AlertsProvider, Object.assign({ startTime: new Date('2022-01-01').toISOString(), endTime: new Date('2022-01-01').toISOString(), endpoint: "http://localhost:1337/graphql" }, { children: _jsx(AlertsV2, {}) }))),
+    render: () => (_jsx(AlertsProvider, { startTime: new Date('2022-01-01').toISOString(), endTime: new Date('2022-01-01').toISOString(), endpoint: "http://localhost:1337/graphql", children: _jsx(AlertsV2, {}) })),
 };
 export const CustomizeAlertStyles = {
-    render: () => (_jsx(AlertsProvider, Object.assign({ startTime: new Date('2022-01-01').toISOString(), endTime: new Date('2022-01-01').toISOString(), endpoint: "http://localhost:1337/graphql" }, { children: _jsx(AlertsV2, { alertStyles: { borderRadius: '0px' } }) }))),
+    render: () => (_jsx(AlertsProvider, { startTime: new Date('2022-01-01').toISOString(), endTime: new Date('2022-01-01').toISOString(), endpoint: "http://localhost:1337/graphql", children: _jsx(AlertsV2, { alertStyles: { borderRadius: '0px' } }) })),
 };

package/dist/components/elements/AlertsV2/index.js

@@ -46,5 +46,5 @@ export const AlertV2 = (_a) => {
         [ALERT_TYPE.INFORMATIONAL]: InfoIcon,
         [ALERT_TYPE.SUCCESS]: SuccessIcon,
     }[type];
-    return (_jsx(RowV2, Object.assign({ className: clsx(processedStyles, typeSafeStyles.alertWrapper), "data-alert-type": type }, rest, { children: _jsxs(RowV2, Object.assign({ className: typeSafeStyles.alertInnerWrapper }, { children: [icon && _jsx(IconV2, { icon: icon, className: typeSafeStyles.icon }), _jsx(RowV2, Object.assign({ className: typeSafeStyles.markdownWrapper }, { children: _jsx(MarkdownV2, { content: description }) })), _jsx(ButtonV2, Object.assign({ type: BUTTONV2_TYPE.TEXT, onClick: dismiss }, { children: "Dismiss" }))] })) })));
+    return (_jsx(RowV2, Object.assign({ className: clsx(processedStyles, typeSafeStyles.alertWrapper), "data-alert-type": type }, rest, { children: _jsxs(RowV2, { className: typeSafeStyles.alertInnerWrapper, children: [icon && _jsx(IconV2, { icon: icon, className: typeSafeStyles.icon }), _jsx(RowV2, { className: typeSafeStyles.markdownWrapper, children: _jsx(MarkdownV2, { content: description }) }), _jsx(ButtonV2, { type: BUTTONV2_TYPE.TEXT, onClick: dismiss, children: "Dismiss" })] }) })));
 };

package/dist/components/elements/ArrowLink/ArrowLink.stories.js

@@ -10,5 +10,5 @@ const meta = {
 };
 export default meta;
 export const Default = {
-    render: () => (_jsx(Column, { children: _jsx(Box, { children: _jsx(ArrowLink, Object.assign({ to: "/" }, { children: "Click Me" })) }) })),
+    render: () => (_jsx(Column, { children: _jsx(Box, { children: _jsx(ArrowLink, { to: "/", children: "Click Me" }) }) })),
 };

package/dist/components/elements/ArrowLink/ArrowLink.test.js

@@ -12,15 +12,15 @@ const CustomExternalLink = (props) => {
 };
 describe('ArrowLink', () => {
     it('renders default external link component without throwing', () => {
-        const { getByRole } = render(_jsx(ArrowLink, Object.assign({ to: "https://google.com" }, { children: "Foo" })));
+        const { getByRole } = render(_jsx(ArrowLink, { to: "https://google.com", children: "Foo" }));
         expect(getByRole('link')).toBeInTheDocument();
     });
     it('renders default internal link component without throwing', () => {
-        const { getByRole } = render(_jsx(ArrowLink, Object.assign({ to: "/test/path" }, { children: "Foo" })));
+        const { getByRole } = render(_jsx(ArrowLink, { to: "/test/path", children: "Foo" }));
         expect(getByRole('link')).toBeInTheDocument();
     });
     it('passes styles to custom component', () => {
-        const { getByTestId } = render(_jsxs(_Fragment, { children: [_jsx(ArrowLink, Object.assign({ to: "https://google.com", sx: { mt: 1 } }, { children: "Foo" })), _jsx(ArrowLink, Object.assign({ to: "/test/route", sx: { mt: 1 } }, { children: "Foo" }))] }), {
+        const { getByTestId } = render(_jsxs(_Fragment, { children: [_jsx(ArrowLink, { to: "https://google.com", sx: { mt: 1 }, children: "Foo" }), _jsx(ArrowLink, { to: "/test/route", sx: { mt: 1 }, children: "Foo" })] }), {
             components: {
                 link: {
                     externalLinkComponent: CustomExternalLink,
@@ -28,7 +28,7 @@ describe('ArrowLink', () => {
                 },
             },
         });
-        expect(getByTestId(CUSTOM_EXTERNAL_TEST_ID)).toHaveStyle(`margin-top: 0.25rem`);
-        expect(getByTestId(CUSTOM_INTERNAL_TEST_ID)).toHaveStyle(`margin-top: 0.25rem`);
+        expect(getByTestId(CUSTOM_EXTERNAL_TEST_ID)).toHaveStyle(`margin-top: 4px`);
+        expect(getByTestId(CUSTOM_INTERNAL_TEST_ID)).toHaveStyle(`margin-top: 4px`);
     });
 });

package/dist/components/elements/ArrowLink/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { StyledElementProps } from '../../../theme';
 type ArrowLinkProps = StyledElementProps<HTMLLinkElement, {
     to: string;

package/dist/components/elements/ArrowLink/index.js

@@ -21,7 +21,7 @@ export const ArrowLink = (_a) => {
                 fill: COLOR.EXTRA_EXTRA_LIGHT_GRAY,
             }, '>svg': {
                 fill: COLOR.WHITE,
-            } }, sx) }, { children: [_jsx("div", Object.assign({ sx: {
+            } }, sx), children: [_jsx("div", { sx: {
                     position: 'relative',
                     border: '1px solid #a7a7a7',
                     borderWidth: '1px 0 2px 1px',
@@ -29,11 +29,11 @@ export const ArrowLink = (_a) => {
                     padding: '0.125rem 1.5rem 0.125rem 0.5rem',
                     height: '100%',
                     flex: '1 1 auto',
-                } }, { children: children })), _jsxs("svg", Object.assign({ viewBox: "0 0 16 1", preserveAspectRatio: "none", sx: {
+                }, children: children }), _jsxs("svg", { viewBox: "0 0 16 1", preserveAspectRatio: "none", sx: {
                     width: '16px',
                     right: '-16px',
                     top: '0px',
                     position: 'absolute',
                     height: '100%',
-                } }, { children: [_jsx("path", { d: "M0,0 0,0 16,0.5 0,1 0,1z" }), _jsx("line", { x1: "0", x2: "16", y1: "0", y2: "0.5", stroke: "#a7a7a7", strokeWidth: "0.05", strokeLinecap: "butt" }), _jsx("line", { x1: "0", x2: "16", y1: "1", y2: "0.5", stroke: "#a7a7a7", strokeWidth: "0.1", strokeLinecap: "butt" })] }))] })));
+                }, children: [_jsx("path", { d: "M0,0 0,0 16,0.5 0,1 0,1z" }), _jsx("line", { x1: "0", x2: "16", y1: "0", y2: "0.5", stroke: "#a7a7a7", strokeWidth: "0.05", strokeLinecap: "butt" }), _jsx("line", { x1: "0", x2: "16", y1: "1", y2: "0.5", stroke: "#a7a7a7", strokeWidth: "0.1", strokeLinecap: "butt" })] })] })));
 };

package/dist/components/elements/ArrowLinkV2/ArrowLinkV2.stories.js

@@ -10,5 +10,5 @@ const meta = {
 };
 export default meta;
 export const Default = {
-    render: () => (_jsx(ColumnV2, { children: _jsx(BoxV2, { children: _jsx(ArrowLinkV2, Object.assign({ to: "/" }, { children: "Click Me" })) }) })),
+    render: () => (_jsx(ColumnV2, { children: _jsx(BoxV2, { children: _jsx(ArrowLinkV2, { to: "/", children: "Click Me" }) }) })),
 };

package/dist/components/elements/ArrowLinkV2/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { StyledElementPropsV2 } from '../../../theme';
 type ArrowLinkV2Props = StyledElementPropsV2<HTMLAnchorElement, {
     to: string;

package/dist/components/elements/ArrowLinkV2/index.js

@@ -17,5 +17,5 @@ const typeSafeStyles = styles;
 export const ArrowLinkV2 = (_a) => {
     var { to, children, sx } = _a, rest = __rest(_a, ["to", "children", "sx"]);
     const processedSx = processSx(sx);
-    return (_jsxs("a", Object.assign({ href: to, className: typeSafeStyles.arrowLinkWrapper, style: processedSx }, rest, { children: [_jsx(BoxV2, Object.assign({ className: typeSafeStyles.arrowLinkInnerWrapper }, { children: children })), _jsxs("svg", Object.assign({ viewBox: "0 0 16 1", preserveAspectRatio: "none", className: typeSafeStyles.arrow }, { children: [_jsx("path", { d: "M0,0 0,0 16,0.5 0,1 0,1z" }), _jsx("line", { x1: "0", x2: "16", y1: "0", y2: "0.5", stroke: "#a7a7a7", strokeWidth: "0.05", strokeLinecap: "butt" }), _jsx("line", { x1: "0", x2: "16", y1: "1", y2: "0.5", stroke: "#a7a7a7", strokeWidth: "0.1", strokeLinecap: "butt" })] }))] })));
+    return (_jsxs("a", Object.assign({ href: to, className: typeSafeStyles.arrowLinkWrapper, style: processedSx }, rest, { children: [_jsx(BoxV2, { className: typeSafeStyles.arrowLinkInnerWrapper, children: children }), _jsxs("svg", { viewBox: "0 0 16 1", preserveAspectRatio: "none", className: typeSafeStyles.arrow, children: [_jsx("path", { d: "M0,0 0,0 16,0.5 0,1 0,1z" }), _jsx("line", { x1: "0", x2: "16", y1: "0", y2: "0.5", stroke: "#a7a7a7", strokeWidth: "0.05", strokeLinecap: "butt" }), _jsx("line", { x1: "0", x2: "16", y1: "1", y2: "0.5", stroke: "#a7a7a7", strokeWidth: "0.1", strokeLinecap: "butt" })] })] })));
 };

package/dist/components/elements/AutoComplete/AutoComplete.stories.js

@@ -58,5 +58,5 @@ const meta = {
 };
 export default meta;
 export const Default = {
-    render: () => (_jsx(_Fragment, { children: _jsx(Row, Object.assign({ justify: "space-between" }, { children: _jsxs(Column, { children: [_jsx(Heading, Object.assign({ size: HEADING_SIZE.LG }, { children: "Vegetables" })), _jsx("br", {}), _jsx(AutoComplete, { options: options, value: "cucumber", onSelect: onSelect }), _jsx("br", {}), _jsx(Paragraph, Object.assign({ size: PARAGRAPH_SIZE.LG }, { children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris ultrices venenatis purus at porta. Etiam congue sapien leo, sed malesuada justo commodo in. Nunc consequat, massa non cursus posuere, magna eros lacinia lectus, eget lobortis mi erat ut justo. Maecenas nisi mi, mollis sed ornare vitae, pharetra sed augue. Curabitur mollis orci risus, sed imperdiet nisi aliquet et. Ut non elit nec magna rhoncus maximus sit amet ut dui. Mauris sit amet eleifend lectus. Aliquam consectetur posuere libero eu ultricies. Etiam rutrum non orci nec vulputate. Sed vel accumsan diam. Cras aliquet eros eros, sit amet pharetra eros tincidunt ut. Vestibulum est erat, eleifend dapibus eros vel, elementum vehicula risus. Etiam blandit condimentum sodales. Donec non libero in orci aliquam egestas fringilla eget purus. Suspendisse pellentesque at ligula ut accumsan." }))] }) })) })),
+    render: () => (_jsx(_Fragment, { children: _jsx(Row, { justify: "space-between", children: _jsxs(Column, { children: [_jsx(Heading, { size: HEADING_SIZE.LG, children: "Vegetables" }), _jsx("br", {}), _jsx(AutoComplete, { options: options, value: "cucumber", onSelect: onSelect }), _jsx("br", {}), _jsx(Paragraph, { size: PARAGRAPH_SIZE.LG, children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris ultrices venenatis purus at porta. Etiam congue sapien leo, sed malesuada justo commodo in. Nunc consequat, massa non cursus posuere, magna eros lacinia lectus, eget lobortis mi erat ut justo. Maecenas nisi mi, mollis sed ornare vitae, pharetra sed augue. Curabitur mollis orci risus, sed imperdiet nisi aliquet et. Ut non elit nec magna rhoncus maximus sit amet ut dui. Mauris sit amet eleifend lectus. Aliquam consectetur posuere libero eu ultricies. Etiam rutrum non orci nec vulputate. Sed vel accumsan diam. Cras aliquet eros eros, sit amet pharetra eros tincidunt ut. Vestibulum est erat, eleifend dapibus eros vel, elementum vehicula risus. Etiam blandit condimentum sodales. Donec non libero in orci aliquam egestas fringilla eget purus. Suspendisse pellentesque at ligula ut accumsan." })] }) }) })),
 };

package/dist/components/elements/BoxV2/BoxV2.stories.js

@@ -10,5 +10,5 @@ const meta = {
 };
 export default meta;
 export const Box = {
-    render: () => (_jsx(BoxV2Component, Object.assign({ sx: { p: 1, bg: COLOR.PRIMARY } }, { children: _jsx(BoxV2Component, { sx: { p: 1, bg: COLOR.SECONDARY } }) }))),
+    render: () => (_jsx(BoxV2Component, { sx: { p: 1, bg: COLOR.PRIMARY }, children: _jsx(BoxV2Component, { sx: { p: 1, bg: COLOR.SECONDARY } }) })),
 };

package/dist/components/elements/BoxV2/index.d.ts

@@ -2,8 +2,8 @@ import React from 'react';
 import { StyledElementPropsV2 } from '../../../theme';
 export type BoxV2Props = StyledElementPropsV2<HTMLDivElement>;
 export declare const BoxV2: React.ForwardRefExoticComponent<{
-    sx?: import("../../../theme").StylesPropV2 | undefined;
+    sx?: import("../../../theme").StylesPropV2;
     children?: React.ReactNode;
 } & Omit<React.HTMLAttributes<HTMLDivElement>, "children" | "onChange"> & object & {
-    htmlFor?: string | undefined;
+    htmlFor?: string;
 } & React.RefAttributes<HTMLDivElement>>;

package/dist/components/elements/BrandingBar/index.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare const BrandingBar: () => import("react").JSX.Element;

package/dist/components/elements/BrandingBar/index.js

@@ -27,7 +27,7 @@ const provostLogo = Object.assign(Object.assign({}, sharedLinkStyle), { backgrou
         right: '0',
     } });
 export const BrandingBar = () => {
-    return (_jsx("hgroup", Object.assign({ sx: {
+    return (_jsx("hgroup", { sx: {
             backgroundColor: COLOR.ND_PROVOST_BLUE,
             height: '50px',
             display: 'block',
@@ -35,18 +35,18 @@ export const BrandingBar = () => {
                 color: COLOR.TEXT_ON_PRIMARY,
                 textDecoration: 'none',
             },
-        } }, { children: _jsx("div", Object.assign({ sx: {
+        }, children: _jsx("div", { sx: {
                 display: 'block',
                 margin: '0 auto',
                 maxWidth: '1200px',
                 padding: '0',
                 position: 'relative',
-            } }, { children: _jsxs("nav", Object.assign({ "aria-label": "University of Notre Dame", sx: {
+            }, children: _jsxs("nav", { "aria-label": "University of Notre Dame", sx: {
                     boxSizing: 'border-box',
                     display: 'block',
                     height: '50px',
                     position: 'relative',
                     overflow: 'hidden',
                     width: '100%',
-                } }, { children: [_jsxs("a", Object.assign({ sx: universityLogo, href: "http://nd.edu" }, { children: ["University ", _jsx("i", { children: "of" }), " Notre Dame"] })), _jsxs("a", Object.assign({ sx: provostLogo, href: "http://provost.nd.edu" }, { children: ["Office ", _jsx("i", { children: "of the" }), " Provost"] }))] })) })) })));
+                }, children: [_jsxs("a", { sx: universityLogo, href: "http://nd.edu", children: ["University ", _jsx("i", { children: "of" }), " Notre Dame"] }), _jsxs("a", { sx: provostLogo, href: "http://provost.nd.edu", children: ["Office ", _jsx("i", { children: "of the" }), " Provost"] })] }) }) }));
 };

package/dist/components/elements/BrandingBarV2/index.js

@@ -6,5 +6,5 @@ const typeSafeStyles = styles;
 const ProvostImage = 'data:image/png;base64,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';
 const UniversityLogo = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAlcAAABkCAMAAACclOWcAAAABGdBTUEAALGPC/xhBQAAADNQTFRF////////////////////////////////////////////////////////////AAAA////FbWC9gAAABB0Uk5TcI+vUM8w358gYO8Qf0C/AK6MYRQAAAmFSURBVHja7ZzrlqyqDoVVFOVavv/TbgFFLlGxu/qMM/ae80+v0hJD+AghWqv7QND31cEFELiCwBUEriAIXEHgCgJXEASuIHAFgSsIAlcQuILAFQSBKwhcQeAKgsAVBK4gcAVB4AoCVxC4giBwBYErCFxBELiCwBUEriAIXEHgCgJXEASuIHAFgSsIAlcQuPq/09R1C7wArr5MlR36VQKsfyFXyhjzPLCi/Ar7BgyT3JzVr/rnDRgz/c+s/Zl71de4WuyuwX3U+4fzTuHzvH8cwsc+mcPp5cEtxyH2SZqMvhI2k0iM0Xrej2pB+VaMqxOfk2N9fjcvK/N7jGscz6OD1sRrh0afS+cVQ8Sr3WiV36G03XrbVyvKsbux9iP00b++m+r4mam/sf307KDFdPm1sW5jqRtn1cj1uSWTi1dsdt2VwezFd3825yWml+48OxIMHr8bTNkv789Lls67kO8OXLqtgZmp84rBnR6dAVtjKSMz9xdaj09f+l9tzQ7GiO1LJk15eBiuZLw3e/z4uOObtj9nd7TvDtfq+DCLNq6GMNwLlXV5E3bXBxcm/vC3dT1lxt+Qs/zyG2s/nT8s/dHVlvc2ffBXuJxf274MfG/Hytj7OsZIqo19gDNPlA5fRDTf3UCEdZCfTvGf5mKm+XYPSxZ/War88nhoTByXt6hcg8HverXVhduZZcwa2KnbsPKX89wCb1/qqGUdPTXrPkQiHanP4jw7REsaqdpau4lry3p26cqF4Ua+Z+LTbK3rtVt6lftbx8oxnA3X367BMTgYx6hkxHec86lYNieB5Ri+EkB2mP9Rg7PIcWWjcT4slxmE7/E5ylm0+FSXn0M9xQ9SlTM0NlKsF3Y/4wdKV2NndoN0ZV/exyk/PmSntTu+7P9sXARdG+zmrHdRHPbShSLpzCQLsBqs1ceol4tr6nt9y1Xqcz86gkaPWky9w+Z8cO2HgORIGEiudMmNWWXasF0/j1wpmVwwVKlu2seR5MrH2vxUd04ae89VPxTHhazCpQ5mNu/ulmwlqEfNu2hUpAtdhOQqHaV0oj1YG7nqyrBc+H5ZVSNXgYxqmvRUHIpcrUsa1u64+sx9I1faR8KunSsfOmUcEXXTxw/NlS5h8UdGeoVayTXg6ngwTvkmmzd3Xbm0FT2yfqwG0oVzFgcUHRaurI1cGcprlO+fufKXVQTJUdILoV55EibMyh+4OuoMz1yp8SS8iavpDLXEiMQ+GnHHlazXVqu+wNWyG7dI+bCvXsy5tIl7rkIW0hMuXAogbNW1dq6mK98v+g1XjFgJ2SpmeiHUa5cELOs/XXMlTDtXYWGTUzNXPqG0e9hcLvvY2yuuhpXM9lcpfs+VR4C7P+KhDspDpjS7/dhY1w4yrrztocXchSJbRfZQPL3mqqNiTPQ9W99wpZLgeiaQipHEbyaoc4yn1Zpbrkb9gquQbvrp3cZVdKapk83PEfyMvOLKpSRl7hOW+ZWLX3PlIwhb7nbmPs+Z1cbeRoDZNvSjoauaJ1chqJvKhX1hByPT5keuRionsnuE2baZb7jyjfFi2g7nwJTT0FsXgvu8mkuulMf/FVcBFJeYtnHlA1zv7WD07mml0j8bOmZGoloTVpp6MXzPlW9pi0HmvrDgcu09BZsfshjfkekI6rkLbWGHWSmH3XHVuwrUBoIh89Fdr7iy1RXCoV6vEscKxXeb3WS85CroHVdh2g2tXB2Zu5Kc7uOs9bYdsJd+snThLq95/JSr5fIW6cRgJ1D8nsHAVYhEG43f5uqaHNe23TzZy99yNbpoI8iF0I242AOWyx0uudoM0fYtV6HMOrdytRfiBDXRYx8txVVnhiIjOQe7T6bEL7gqS33kePLgbhE682ngKtQCRpW7sOyNSTbXbVzNRtMlp9P3+j1XPJ9pfFvou5VebPfqQretlvzzuc2vfPXqFVchfxCNXPklfAjT4LKPms6vsvJXgetYPlX4EVeCKgYV4UqEwLZ4XoYmrgKvc+5CXewHGVlmecivLF1bsudu8RVXVd7en2Fxruvw+5SR24zpHrjai4s1V3MZKWJ52+cPq2zkKlR1STwe61f6KmAddE+/5Mo8ZSQisKvDmjusXRtXwTqZ9Y4VEVaT937gytAB64f1q6lqja9si1chLtblxpgw+8qMaaxf9Rm8VTw6H5sYcp2/6JuqPdzMlarnDZsvykF/w1UfPLI/ipTr1MZVcH/RO5mnhHRy/LQfHMmA9UOuypr/xv54DpqguNojWr+bKhu4yiojqipqJ4/juhdchTWBP/VRSUPUGeqAxeLQjsWpP+HK+gglgjOmh4pEwlUIBTlXeWcUPaueuKIDVuZ7qxu58vB3+Vh1J/QDydWynqWj2tTs2LYod2UEqJ9tiORG8wuu6Pw0rV+F+00EV77nNm/Nnt/hn7/nyoVNHkrBDw9x8qeHouJGjWlnNF3Ufqxf2TLGpPWr0ELXyNVcRkwVuScSTxOfh+/IXXJ1XGdleF/Uns9Mp/rZRp9EMO8iIkEnZwq/yo2TVU7kETUW/7py27cclyzlloX9zTrIzoL88PQ2DUs7OlfxyCem+oxn8wuL+oOc6arex+NNpgeuAoGqwupII49o2pFcsfj0jUjC0nA6b/h1kRb3Hp57B6/cZrLNKTpGcVcIz9MoTzin9uzdSm6jlrBSuwKWHrKvhLbsFCOjzil1Z1zJdM6ftniXVVn+5Pf3msz+784dS8Wo7VGIlPevCvhN6jClk6NY5/xbV+4bypXg+hcWMR69G55sq8r3voClZ3n3xoUKZTDtagm8emaxDfE4Jcu4ZCr3b7CLB4QX31b+amAYBNk7S0YHZrfXheSxySx7JovNZ/HaWayzcrL6yOh0PpXIS15xB8zG/HGgGfezoyErqeKi/mvpQLpeZn+7nZ1m0a7xFquhaGwidivisF7Oy0Wwoqw9hkWe7PVZcE813xTjEvHiDdkpcXr05lQ85Bh86OzSioTIV4xUy/m7iYlpzUzDxqKbPq0Sv/tVhiqeyC2bifSL73+r7u1vJRgVvb31nfmdKVu8+ZU/f3e9bv9ZBX7n9axhneCEt3MRLniU5PABuPq6TPNvKyBw1aTJv+mDcAWuvp1ZWdZJZFfg6rty9aEB/yEDuPq2FgOqwBUEriBwBUHgCgJXELiCIHAFgSsIXEEQuILAFQSuIAhcQeAKAlcQBK4gcAWBKwgCVxC4gsAVBIErCFxB4AqCwBUEriBwBYEruAACVxC4gsAVBIErCFxB/0n9A/6wliZWAPp5AAAAAElFTkSuQmCC';
 export const BrandingBarV2 = () => {
-    return (_jsx("hgroup", Object.assign({ className: typeSafeStyles.hGroup }, { children: _jsx(BoxV2, Object.assign({ className: typeSafeStyles.navWrapper }, { children: _jsxs("nav", Object.assign({ "aria-label": "University of Notre Dame", className: typeSafeStyles.nav }, { children: [_jsxs("a", Object.assign({ className: clsx(typeSafeStyles.universityLogo, typeSafeStyles.sharedLink), style: { backgroundImage: `url(${UniversityLogo})` }, href: "http://nd.edu" }, { children: ["University ", _jsx("i", { children: "of" }), " Notre Dame"] })), _jsxs("a", Object.assign({ className: clsx(typeSafeStyles.provostLogo, typeSafeStyles.sharedLink), style: { backgroundImage: `url(${ProvostImage})` }, href: "http://provost.nd.edu" }, { children: ["Office ", _jsx("i", { children: "of the" }), " Provost"] }))] })) })) })));
+    return (_jsx("hgroup", { className: typeSafeStyles.hGroup, children: _jsx(BoxV2, { className: typeSafeStyles.navWrapper, children: _jsxs("nav", { "aria-label": "University of Notre Dame", className: typeSafeStyles.nav, children: [_jsxs("a", { className: clsx(typeSafeStyles.universityLogo, typeSafeStyles.sharedLink), style: { backgroundImage: `url(${UniversityLogo})` }, href: "http://nd.edu", children: ["University ", _jsx("i", { children: "of" }), " Notre Dame"] }), _jsxs("a", { className: clsx(typeSafeStyles.provostLogo, typeSafeStyles.sharedLink), style: { backgroundImage: `url(${ProvostImage})` }, href: "http://provost.nd.edu", children: ["Office ", _jsx("i", { children: "of the" }), " Provost"] })] }) }) }));
 };

package/dist/components/elements/Button/Button.stories.js

@@ -23,7 +23,7 @@ const sizes = [
     { size: BUTTON_SIZE.SM, label: 'Small' },
 ];
 export const Default = {
-    render: (args) => (_jsx(Column, { children: sizes.map((size) => (_jsxs(Group, Object.assign({ type: GROUP_TYPE.REGION }, { children: [_jsx(Heading, Object.assign({ size: HEADING_SIZE.MD }, { children: size.label })), _jsx(Button, Object.assign({}, args, { size: size.size, sx: { mt: 1 } }))] })))) })),
+    render: (args) => (_jsx(Column, { children: sizes.map((size) => (_jsxs(Group, { type: GROUP_TYPE.REGION, children: [_jsx(Heading, { size: HEADING_SIZE.MD, children: size.label }), _jsx(Button, Object.assign({}, args, { size: size.size, sx: { mt: 1 } }))] }))) })),
     args: {
         type: BUTTON_TYPE.DEFAULT,
         children: 'Click Me',
@@ -38,14 +38,14 @@ export const CustomColor = {
     },
 };
 export const Link = {
-    render: (args) => (_jsx(Column, { children: sizes.map((size) => (_jsxs(Group, Object.assign({ type: GROUP_TYPE.REGION }, { children: [_jsx(Heading, Object.assign({ size: HEADING_SIZE.MD }, { children: size.label })), _jsx(LinkButton, Object.assign({}, args, { sx: { mt: 1 } }))] })))) })),
+    render: (args) => (_jsx(Column, { children: sizes.map((size) => (_jsxs(Group, { type: GROUP_TYPE.REGION, children: [_jsx(Heading, { size: HEADING_SIZE.MD, children: size.label }), _jsx(LinkButton, Object.assign({}, args, { sx: { mt: 1 } }))] }))) })),
     args: {
         type: BUTTON_TYPE.DEFAULT,
         children: 'Click Me',
     },
 };
 export const OutlineButton = {
-    render: (args) => (_jsx(Column, { children: sizes.map((size) => (_jsxs(Group, Object.assign({ type: GROUP_TYPE.REGION }, { children: [_jsx(Heading, Object.assign({ size: HEADING_SIZE.MD }, { children: size.label })), _jsx(Button, Object.assign({}, args, { size: size.size, sx: { mt: 1 } }))] })))) })),
+    render: (args) => (_jsx(Column, { children: sizes.map((size) => (_jsxs(Group, { type: GROUP_TYPE.REGION, children: [_jsx(Heading, { size: HEADING_SIZE.MD, children: size.label }), _jsx(Button, Object.assign({}, args, { size: size.size, sx: { mt: 1 } }))] }))) })),
     args: {
         type: BUTTON_TYPE.OUTLINE,
         children: 'Click Me',
@@ -53,7 +53,7 @@ export const OutlineButton = {
     },
 };
 export const TextButton = {
-    render: (args) => (_jsx(Column, { children: sizes.map((size) => (_jsxs(Group, Object.assign({ type: GROUP_TYPE.REGION }, { children: [_jsx(Heading, Object.assign({ size: HEADING_SIZE.MD }, { children: size.label })), _jsx(Button, Object.assign({}, args, { size: size.size, sx: { mt: 1 } }))] })))) })),
+    render: (args) => (_jsx(Column, { children: sizes.map((size) => (_jsxs(Group, { type: GROUP_TYPE.REGION, children: [_jsx(Heading, { size: HEADING_SIZE.MD, children: size.label }), _jsx(Button, Object.assign({}, args, { size: size.size, sx: { mt: 1 } }))] }))) })),
     args: {
         type: BUTTON_TYPE.TEXT,
         onClick: () => { },
@@ -61,7 +61,7 @@ export const TextButton = {
     },
 };
 export const IconButton = {
-    render: (args) => (_jsx(Column, { children: sizes.map((size) => (_jsxs(Group, Object.assign({ type: GROUP_TYPE.REGION }, { children: [_jsx(Heading, Object.assign({ size: HEADING_SIZE.MD }, { children: size.label })), _jsx(Button, Object.assign({}, args, { size: size.size, sx: { mt: 1 }, primaryIcon: SettingsIcon }))] })))) })),
+    render: (args) => (_jsx(Column, { children: sizes.map((size) => (_jsxs(Group, { type: GROUP_TYPE.REGION, children: [_jsx(Heading, { size: HEADING_SIZE.MD, children: size.label }), _jsx(Button, Object.assign({}, args, { size: size.size, sx: { mt: 1 }, primaryIcon: SettingsIcon }))] }))) })),
     args: {
         type: BUTTON_TYPE.TEXT,
         children: 'Click Me',
@@ -69,22 +69,22 @@ export const IconButton = {
     },
 };
 export const LeftIcon = {
-    render: (args) => (_jsx(Column, { children: sizes.map((size) => (_jsxs(Group, Object.assign({ type: GROUP_TYPE.REGION }, { children: [_jsx(Heading, Object.assign({ size: HEADING_SIZE.MD }, { children: size.label })), _jsx(Button, Object.assign({}, args, { size: size.size, sx: { mt: 1 }, leftIcon: SearchIcon }))] })))) })),
+    render: (args) => (_jsx(Column, { children: sizes.map((size) => (_jsxs(Group, { type: GROUP_TYPE.REGION, children: [_jsx(Heading, { size: HEADING_SIZE.MD, children: size.label }), _jsx(Button, Object.assign({}, args, { size: size.size, sx: { mt: 1 }, leftIcon: SearchIcon }))] }))) })),
     args: {
         onClick: () => { },
         children: 'Search',
     },
 };
 export const RightIcon = {
-    render: (args) => (_jsx(Column, { children: sizes.map((size) => (_jsxs(Group, Object.assign({ type: GROUP_TYPE.REGION }, { children: [_jsx(Heading, Object.assign({ size: HEADING_SIZE.MD }, { children: size.label })), _jsx(Button, Object.assign({}, args, { size: size.size, sx: { mt: 1 }, rightIcon: ArrowDropDownIcon }))] })))) })),
+    render: (args) => (_jsx(Column, { children: sizes.map((size) => (_jsxs(Group, { type: GROUP_TYPE.REGION, children: [_jsx(Heading, { size: HEADING_SIZE.MD, children: size.label }), _jsx(Button, Object.assign({}, args, { size: size.size, sx: { mt: 1 }, rightIcon: ArrowDropDownIcon }))] }))) })),
     args: {
         onClick: () => { },
         children: 'Select',
     },
 };
 export const Loading = {
-    render: () => (_jsxs(Column, { children: [_jsx(Row, { children: _jsx(Button, Object.assign({ loading: true }, { children: "Click Me" })) }), _jsx(Row, Object.assign({ sx: { mt: 1 } }, { children: _jsx(Button, Object.assign({ type: BUTTON_TYPE.OUTLINE, loading: true }, { children: "Click Me" })) })), _jsx(Row, Object.assign({ sx: { mt: 1 } }, { children: _jsx(Button, Object.assign({ type: BUTTON_TYPE.TEXT, loading: true }, { children: "Click Me" })) }))] })),
+    render: () => (_jsxs(Column, { children: [_jsx(Row, { children: _jsx(Button, { loading: true, children: "Click Me" }) }), _jsx(Row, { sx: { mt: 1 }, children: _jsx(Button, { type: BUTTON_TYPE.OUTLINE, loading: true, children: "Click Me" }) }), _jsx(Row, { sx: { mt: 1 }, children: _jsx(Button, { type: BUTTON_TYPE.TEXT, loading: true, children: "Click Me" }) })] })),
 };
 export const Disabled = {
-    render: () => (_jsxs(Column, { children: [_jsx(Row, { children: _jsx(Button, Object.assign({ disabled: true }, { children: "Click Me" })) }), _jsx(Row, Object.assign({ sx: { mt: 1 } }, { children: _jsx(Button, Object.assign({ type: BUTTON_TYPE.OUTLINE, disabled: true }, { children: "Click Me" })) })), _jsx(Row, Object.assign({ sx: { mt: 1 } }, { children: _jsx(Button, Object.assign({ type: BUTTON_TYPE.TEXT, disabled: true }, { children: "Click Me" })) }))] })),
+    render: () => (_jsxs(Column, { children: [_jsx(Row, { children: _jsx(Button, { disabled: true, children: "Click Me" }) }), _jsx(Row, { sx: { mt: 1 }, children: _jsx(Button, { type: BUTTON_TYPE.OUTLINE, disabled: true, children: "Click Me" }) }), _jsx(Row, { sx: { mt: 1 }, children: _jsx(Button, { type: BUTTON_TYPE.TEXT, disabled: true, children: "Click Me" }) })] })),
 };

package/dist/components/elements/Button/Button.test.js

@@ -16,7 +16,7 @@ describe('Button', () => {
         expect(getByText('Foo')).toBeInTheDocument();
     });
     it('renders icon component passed to it', () => {
-        const { getByText } = render(_jsxs(_Fragment, { children: [_jsx(Button, Object.assign({ leftIcon: MockLeftIcon }, { children: "Click Me" })), _jsx(Button, Object.assign({ primaryIcon: MockPrimaryIcon }, { children: "Click Me" })), _jsx(Button, Object.assign({ rightIcon: MockRightIcon }, { children: "Click Me" }))] }));
+        const { getByText } = render(_jsxs(_Fragment, { children: [_jsx(Button, { leftIcon: MockLeftIcon, children: "Click Me" }), _jsx(Button, { primaryIcon: MockPrimaryIcon, children: "Click Me" }), _jsx(Button, { rightIcon: MockRightIcon, children: "Click Me" })] }));
         expect(getByText('Mock Primary Icon')).toBeDefined();
         expect(getByText('Mock Left Icon')).toBeDefined();
         expect(getByText('Mock Right Icon')).toBeDefined();

package/dist/components/elements/Button/index.d.ts

@@ -26,23 +26,23 @@ export type ButtonProps = StyledElementProps<HTMLButtonElement, {
     disableFocusStyles?: boolean;
 }>;
 export declare const Button: React.ForwardRefExoticComponent<{
-    sx?: import("../../../theme").StylesProp | undefined;
+    sx?: import("../../../theme").StylesProp;
     children?: React.ReactNode;
 } & Omit<React.HTMLAttributes<HTMLButtonElement>, "children" | "onChange"> & {
-    size?: BUTTON_SIZE | undefined;
-    type?: BUTTON_TYPE | undefined;
-    color?: COLOR | undefined;
-    textColor?: COLOR | undefined;
-    customColor?: string | undefined;
-    primaryIcon?: React.FC<any> | undefined;
-    leftIcon?: React.FC<any> | undefined;
-    rightIcon?: React.FC<any> | undefined;
-    accessibleLabel?: string | undefined;
-    loading?: boolean | undefined;
-    disabled?: boolean | undefined;
-    disableFocusStyles?: boolean | undefined;
+    size?: BUTTON_SIZE;
+    type?: BUTTON_TYPE;
+    color?: COLOR;
+    textColor?: COLOR;
+    customColor?: string;
+    primaryIcon?: React.FC<any>;
+    leftIcon?: React.FC<any>;
+    rightIcon?: React.FC<any>;
+    accessibleLabel?: string;
+    loading?: boolean;
+    disabled?: boolean;
+    disableFocusStyles?: boolean;
 } & {
-    htmlFor?: string | undefined;
+    htmlFor?: string;
 } & React.RefAttributes<HTMLButtonElement>>;
 type LinkButtonProps = Omit<ButtonProps, 'type' | 'color' | 'textColor'>;
 export declare const LinkButton: React.FC<LinkButtonProps>;