@ndlib/component-library 1.0.45 → 1.0.47

package/dist/components/providers/uiV2.js

@@ -11,6 +11,6 @@ import StructuredData from '../composites/StructuredData';
 import { SnackBarProvider } from './snackBar';
 import { UniqueIdProvider } from './uniqueIds';
 export const UiProviderV2 = ({ structuredData, env, components, alertsConfig, children, includeTheme = true, loadFonts, loadGlobalStyles, useHydrationPatch, ssrBreakpoint, }) => {
-    const core = (_jsxs(EnvironmentProvider, Object.assign({ env: env }, { children: [_jsx(MediaSizeProviderV2, Object.assign({ ssrBreakpoint: ssrBreakpoint, useHydrationPatch: useHydrationPatch }, { children: _jsx(ComponentConfigProviderV2, Object.assign({ config: components || {} }, { children: _jsx(UniqueIdProvider, { children: _jsx(SnackBarProvider, { children: _jsx(DialogsProvider, { children: _jsx(AlertsProvider, Object.assign({}, alertsConfig, { children: children })) }) }) }) })) })), loadGlobalStyles && _jsx(GlobalStylesV2, {}), loadFonts && _jsx(FontLoader, {}), structuredData && _jsx(StructuredData, Object.assign({}, structuredData))] })));
+    const core = (_jsxs(EnvironmentProvider, { env: env, children: [_jsx(MediaSizeProviderV2, { ssrBreakpoint: ssrBreakpoint, useHydrationPatch: useHydrationPatch, children: _jsx(ComponentConfigProviderV2, { config: components || {}, children: _jsx(UniqueIdProvider, { children: _jsx(SnackBarProvider, { children: _jsx(DialogsProvider, { children: _jsx(AlertsProvider, Object.assign({}, alertsConfig, { children: children })) }) }) }) }) }), loadGlobalStyles && _jsx(GlobalStylesV2, {}), loadFonts && _jsx(FontLoader, {}), structuredData && _jsx(StructuredData, Object.assign({}, structuredData))] }));
     return includeTheme ? _jsx(ThemeProviderV2, { children: core }) : core;
 };

package/dist/components/providers/uniqueIds.js

@@ -3,7 +3,7 @@ import { createContext, useContext, useMemo, useRef } from 'react';
 const UniqueIdContext = createContext({});
 export const UniqueIdProvider = ({ children, }) => {
     const countIndexRef = useRef({});
-    return (_jsx(UniqueIdContext.Provider, Object.assign({ value: countIndexRef.current }, { children: children })));
+    return (_jsx(UniqueIdContext.Provider, { value: countIndexRef.current, children: children }));
 };
 export const useUniqueId = (prefix) => {
     const countIndex = useContext(UniqueIdContext);

package/dist/index.d.ts

@@ -69,6 +69,7 @@ export { SnackBar } from './components/composites/SnackBar';
 export { NavMenu } from './components/composites/NavMenu';
 export { NavMenuV2 } from './components/composites/NavMenuV2';
 export { EmptyState, EMPTY_STATE_SIZE, } from './components/composites/EmptyState';
+export { EmptyStateV2, EMPTY_STATEV2_SIZE, } from './components/composites/EmptyStateV2';
 export { DropdownLinks } from './components/composites/DropdownLinks';
 export { DropdownLinksV2 } from './components/composites/DropdownLinksV2';
 export { Modal } from './components/composites/Modal';

package/dist/index.js

@@ -68,6 +68,7 @@ export { SnackBar } from './components/composites/SnackBar';
 export { NavMenu } from './components/composites/NavMenu';
 export { NavMenuV2 } from './components/composites/NavMenuV2';
 export { EmptyState, EMPTY_STATE_SIZE, } from './components/composites/EmptyState';
+export { EmptyStateV2, EMPTY_STATEV2_SIZE, } from './components/composites/EmptyStateV2';
 export { DropdownLinks } from './components/composites/DropdownLinks';
 export { DropdownLinksV2 } from './components/composites/DropdownLinksV2';
 export { Modal } from './components/composites/Modal';

package/dist/theme/Color.stories.js

@@ -70,5 +70,5 @@ const colors = [
     { color: COLOR.ALERT_WARNING_BORDER, label: 'ALERT_WARNING_BORDER' },
 ];
 export const Default = {
-    render: () => (_jsx(Row, Object.assign({ sx: { flexWrap: 'wrap' } }, { children: colors.map((color) => (_jsxs(Group, Object.assign({ type: GROUP_TYPE.GROUP, sx: { mr: 3, mt: 0, flexBasis: '100px' } }, { children: [_jsx(Label, Object.assign({ size: LABEL_SIZE.SM }, { children: color.label })), _jsx(ColorSquare, { color: color.color })] }), color.label))) }))),
+    render: () => (_jsx(Row, { sx: { flexWrap: 'wrap' }, children: colors.map((color) => (_jsxs(Group, { type: GROUP_TYPE.GROUP, sx: { mr: 3, mt: 0, flexBasis: '100px' }, children: [_jsx(Label, { size: LABEL_SIZE.SM, children: color.label }), _jsx(ColorSquare, { color: color.color })] }, color.label))) })),
 };

package/dist/theme/Typography.stories.js

@@ -41,6 +41,6 @@ const randomElement = (arr) => {
 export const Default = {
     render: () => (_jsx(Group, { children: types.map((t) => {
             const style = getTypographyStyles(t.type);
-            return (_jsxs(Group, Object.assign({ sx: { mb: '1rem' } }, { children: [_jsx(Label, Object.assign({ size: LABEL_SIZE.SM }, { children: t.label })), _jsx(Box, Object.assign({ sx: { p: 3, boxShadow: '0px 0px 8px 1px #dddddd' } }, { children: _jsx("div", Object.assign({ sx: style }, { children: randomElement(pangrams) })) }))] })));
+            return (_jsxs(Group, { sx: { mb: '1rem' }, children: [_jsx(Label, { size: LABEL_SIZE.SM, children: t.label }), _jsx(Box, { sx: { p: 3, boxShadow: '0px 0px 8px 1px #dddddd' }, children: _jsx("div", { sx: style, children: randomElement(pangrams) }) })] }));
         }) })),
 };

package/dist/theme/colors.d.ts

@@ -18,7 +18,7 @@ export declare enum COLOR {
     LIGHT_GRAY = "lightGray",
     EXTRA_LIGHT_GRAY = "extraLightGray",
     EXTRA_EXTRA_LIGHT_GRAY = "extraExtraLightGray",
-    SUCCESS = "ndTertiary1",
+    SUCCESS = "success",
     ND_BLUE = "ndBlue",
     ND_BLUE_DARK = "ndBlueDark",
     ND_BLUE_LIGHT = "ndBlueLight",
@@ -53,7 +53,7 @@ export declare enum COLOR {
     ALERT_WARNING_BG = "alertWarningBg",
     ALERT_WARNING_BORDER = "alertWarningBorder",
     ALERT_SUCCESS_BG = "alertSuccessBg",
-    ALERT_SUCCESS_BORDER = "ndTertiary1"
+    ALERT_SUCCESS_BORDER = "alertSuccessBorder"
 }
 export declare const colors: {
     [key in COLOR]: string;

package/dist/theme/colors.js

@@ -19,7 +19,7 @@ export var COLOR;
     COLOR["LIGHT_GRAY"] = "lightGray";
     COLOR["EXTRA_LIGHT_GRAY"] = "extraLightGray";
     COLOR["EXTRA_EXTRA_LIGHT_GRAY"] = "extraExtraLightGray";
-    COLOR["SUCCESS"] = "ndTertiary1";
+    COLOR["SUCCESS"] = "success";
     COLOR["ND_BLUE"] = "ndBlue";
     COLOR["ND_BLUE_DARK"] = "ndBlueDark";
     COLOR["ND_BLUE_LIGHT"] = "ndBlueLight";
@@ -54,7 +54,7 @@ export var COLOR;
     COLOR["ALERT_WARNING_BG"] = "alertWarningBg";
     COLOR["ALERT_WARNING_BORDER"] = "alertWarningBorder";
     COLOR["ALERT_SUCCESS_BG"] = "alertSuccessBg";
-    COLOR["ALERT_SUCCESS_BORDER"] = "ndTertiary1";
+    COLOR["ALERT_SUCCESS_BORDER"] = "alertSuccessBorder";
 })(COLOR || (COLOR = {}));
 export const colors = {
     [COLOR.TEXT]: '#333333',
@@ -76,6 +76,7 @@ export const colors = {
     [COLOR.LIGHT_GRAY]: '#d2d2d2',
     [COLOR.EXTRA_LIGHT_GRAY]: '#e2e2e2',
     [COLOR.EXTRA_EXTRA_LIGHT_GRAY]: '#f2f2f2',
+    [COLOR.SUCCESS]: '#00823E',
     [COLOR.ND_GOLD]: '#ae9142',
     [COLOR.ND_GOLD_LIGHT]: '#d39f10',
     [COLOR.ND_GOLD_DARK]: '#8c7535',
@@ -110,4 +111,5 @@ export const colors = {
     [COLOR.ALERT_WARNING_BG]: '#fc7279',
     [COLOR.ALERT_WARNING_BORDER]: '#ad5458',
     [COLOR.ALERT_SUCCESS_BG]: '#edffea',
+    [COLOR.ALERT_SUCCESS_BORDER]: '#00823E',
 };

package/dist/theme/css-variables.css

@@ -18,7 +18,7 @@
   --lightGray: #d2d2d2;
   --extraLightGray: #e2e2e2;
   --extraExtraLightGray: #f2f2f2;
-  --ndTertiary1: #00823E;
+  --success: #00823E;
   --ndBlue: #0c2340;
   --ndBlueDark: #081629;
   --ndBlueLight: #143865;
@@ -53,5 +53,5 @@
   --alertWarningBg: #fc7279;
   --alertWarningBorder: #ad5458;
   --alertSuccessBg: #edffea;
-  --ndTertiary1: #00823E;
+  --alertSuccessBorder: #00823E;
 }

package/dist/theme/index.d.ts

@@ -36,7 +36,7 @@ export declare const theme: {
         lightGray: string;
         extraLightGray: string;
         extraExtraLightGray: string;
-        ndTertiary1: string;
+        success: string;
         ndBlue: string;
         ndBlueDark: string;
         ndBlueLight: string;
@@ -58,6 +58,7 @@ export declare const theme: {
         ndSecondary4: string;
         ndSecondary5: string;
         ndSecondary6: string;
+        ndTertiary1: string;
         ndTertiary2: string;
         ndTertiary3: string;
         ndTertiary4: string;
@@ -70,6 +71,7 @@ export declare const theme: {
         alertWarningBg: string;
         alertWarningBorder: string;
         alertSuccessBg: string;
+        alertSuccessBorder: string;
     };
     space: string[];
     boxShadow: typeof BOX_SHADOW;
@@ -125,7 +127,7 @@ export declare const themeV2: {
         lightGray: string;
         extraLightGray: string;
         extraExtraLightGray: string;
-        ndTertiary1: string;
+        success: string;
         ndBlue: string;
         ndBlueDark: string;
         ndBlueLight: string;
@@ -147,6 +149,7 @@ export declare const themeV2: {
         ndSecondary4: string;
         ndSecondary5: string;
         ndSecondary6: string;
+        ndTertiary1: string;
         ndTertiary2: string;
         ndTertiary3: string;
         ndTertiary4: string;
@@ -159,6 +162,7 @@ export declare const themeV2: {
         alertWarningBg: string;
         alertWarningBorder: string;
         alertSuccessBg: string;
+        alertSuccessBorder: string;
     };
     space: string[];
     boxShadow: typeof BOX_SHADOW;
@@ -243,94 +247,7 @@ export type StyledElementPropsV2<E extends Element, CustomProps = object, Childr
 } & Omit<React.HTMLAttributes<E>, 'children' | 'onChange'> & CustomProps & {
     htmlFor?: string;
 };
-export declare const useTheme: () => {
-    colors: {
-        text: string;
-        lightText: string;
-        background: string;
-        transparent: string;
-        primary: string;
-        textOnPrimary: string;
-        primaryHighlight: string;
-        secondary: string;
-        textOnSecondary: string;
-        secondaryHighlight: string;
-        white: string;
-        warmWhite: string;
-        warmWhiteDark: string;
-        black: string;
-        darkGray: string;
-        gray: string;
-        lightGray: string;
-        extraLightGray: string;
-        extraExtraLightGray: string;
-        ndTertiary1: string;
-        ndBlue: string;
-        ndBlueDark: string;
-        ndBlueLight: string;
-        ndBlueBright: string;
-        ndGold: string;
-        ndGoldLight: string;
-        ndGoldDark: string;
-        ndGreem: string;
-        ndGreenLight: string;
-        ndSkyBlue: string;
-        ndSkyBlueDark: string;
-        ndSkyBlueLight: string;
-        ndMetallicGold: string;
-        ndMetallicGoldLight: string;
-        ndProvostBlue: string;
-        ndSecondary1: string;
-        ndSecondary2: string;
-        ndSecondary3: string;
-        ndSecondary4: string;
-        ndSecondary5: string;
-        ndSecondary6: string;
-        ndTertiary2: string;
-        ndTertiary3: string;
-        ndTertiary4: string;
-        ndTertiary5: string;
-        ndTertiary6: string;
-        alertInformationalBg: string;
-        alertInformationalBorder: string;
-        alertInformationalYellowBg: string;
-        alertInformationalYellowBorder: string;
-        alertWarningBg: string;
-        alertWarningBorder: string;
-        alertSuccessBg: string;
-    };
-    space: string[];
-    boxShadow: typeof BOX_SHADOW;
-    breakpoints: string[];
-    zIndex: typeof Z_INDEX;
-    fonts: {
-        branded: string;
-        branded2: string;
-        serif: string;
-        normal: string;
-    };
-    fontSizes: {
-        xxs: string;
-        xs: string;
-        sm: string;
-        ms: string;
-        md: string;
-        ml: string;
-        lg: string;
-        xl: string;
-        xxl: string;
-    };
-    lineHeights: {
-        normal: number;
-        condensed: number;
-        extraCondensed: number;
-    };
-    fontWeights: {
-        normal: number;
-        heading: number;
-        bold: number;
-    };
-};
+export declare const useTheme: () => Theme;
 export declare const ThemeProvider: React.FC<PropsWithChildren>;
 export declare const useThemeV2: () => ThemeV2;
 export declare const ThemeProviderV2: React.FC<PropsWithChildren>;

package/dist/theme/index.js

@@ -35,7 +35,7 @@ export const useTheme = () => {
     return theme;
 };
 export const ThemeProvider = ({ children }) => {
-    return _jsx(ThemeUIProvider, Object.assign({ theme: theme }, { children: children }));
+    return _jsx(ThemeUIProvider, { theme: theme, children: children });
 };
 const ThemeV2Context = createContext(themeV2);
 export const useThemeV2 = () => {
@@ -47,5 +47,5 @@ export const useThemeV2 = () => {
 };
 export const ThemeProviderV2 = ({ children }) => {
     const value = useMemo(() => themeV2, []);
-    return (_jsx(ThemeV2Context.Provider, Object.assign({ value: value }, { children: children })));
+    return (_jsx(ThemeV2Context.Provider, { value: value, children: children }));
 };

package/dist/theme/typography.d.ts

@@ -97,6 +97,6 @@ export declare const typographyStyleMap: {
 export declare const getTypographyStyles: (typography?: TYPOGRAPHY_TYPE) => {
     fontFamily: FONT;
     fontSize: FONT_SIZE;
-    fontWeight?: FONT_WEIGHT | undefined;
+    fontWeight?: FONT_WEIGHT;
     lineHeight: LINE_HEIGHT;
 };

package/dist/utils/test.js

@@ -3,7 +3,7 @@ import { render as rtlRender } from '@testing-library/react';
 import { UiProvider } from '../components/providers/ui';
 export const render = (component, configParam) => {
     const config = configParam || {};
-    return rtlRender(_jsx(UiProvider, Object.assign({ env: config.env, components: config.components, alertsConfig: {
+    return rtlRender(_jsx(UiProvider, { env: config.env, components: config.components, alertsConfig: {
             disable: true,
-        } }, { children: component })));
+        }, children: component }));
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ndlib/component-library",
-  "version": "1.0.45",
+  "version": "1.0.47",
   "type": "module",
   "sideEffects": false,
   "files": [
@@ -60,15 +60,15 @@
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^14.0.0",
     "@testing-library/user-event": "^14.4.3",
+    "@types/minimatch": "^6.0.0",
     "@types/pretty": "^2.0.1",
     "@types/react": "18.2.7",
-    "@types/react-beautiful-dnd": "^13.1.5",
     "@types/react-datepicker": "^4.15.0",
     "@types/react-dom": "18.2.7",
     "@types/react-modal": "^3.16.0",
     "@types/sanitize-html": "^2.9.0",
-    "@typescript-eslint/eslint-plugin": "^5.57.1",
-    "@typescript-eslint/parser": "^5.57.1",
+    "@typescript-eslint/eslint-plugin": "^7.18.0",
+    "@typescript-eslint/parser": "^7.18.0",
     "@vitejs/plugin-react-swc": "^3.0.0",
     "@vitest/coverage-c8": "^0.33.0",
     "@vitest/coverage-istanbul": "^1.6.0",
@@ -97,8 +97,8 @@
   },
   "dependencies": {
     "@floating-ui/react": "^0.24.5",
+    "@hello-pangea/dnd": "^17.0.0",
     "clsx": "^2.1.1",
-    "react-beautiful-dnd": "^13.1.1",
     "react-datepicker": "^4.16.0",
     "react-markdown": "^8.0.7",
     "react-modal": "^3.16.1",