@am92/react-design-system 2.6.0 → 2.7.0

package/dist/Components/DsAppBar/DsAppBar.Types.js

@@ -1,8 +1,5 @@
 export const DsAppBarDefaultProps = {
     color: 'default',
     enableColorOnDark: true,
-    elevation: 0,
-    appBarTitle: '',
-    navigation: false,
-    actions: false
+    elevation: 0
 };

package/dist/Components/DsAutocomplete/DsAutocomplete.Overrides.d.ts

@@ -22,7 +22,6 @@ export declare const DsAutocompleteOverrides: {
                 };
             };
             endAdornment: {
-                top: string;
                 right: string;
                 display: string;
                 alignItems: string;

package/dist/Components/DsAutocomplete/DsAutocomplete.Overrides.js

@@ -23,7 +23,6 @@ export const DsAutocompleteOverrides = {
                 }
             },
             endAdornment: {
-                top: 'unset',
                 right: '8px',
                 display: 'flex',
                 alignItems: 'center',

package/dist/Components/DsBottomSheet/DsBottomSheet.Component.js

@@ -45,7 +45,7 @@ export class DsBottomSheet extends PureComponent {
                     maxHeight: 'var(--ds-rules-bottomSheetWorkingAreaHeight)',
                     ...PaperProps?.sx
                 }
-            }, children: [showClose && (_jsx(DsIconButton, { onClick: this.handleCloseClick, ...CloseIconButtonProps, sx: {
+            }, onClose: this.handleDrawerClose, children: [showClose && (_jsx(DsIconButton, { onClick: this.handleCloseClick, ...CloseIconButtonProps, sx: {
                         flexGrow: 0,
                         alignSelf: 'center',
                         backgroundColor: 'var(--ds-colour-iconDefault)',

package/dist/Components/DsInputBase/DsInputBase.Overrides.js

@@ -115,6 +115,7 @@ export const DsInputBaseOverrides = {
                     padding: 'var(--ds-spacing-deepFreeze)',
                     height: 'auto'
                 },
+                // The warning for SSR let it be
                 '> :nth-child(even)': {
                     marginLeft: 'var(--ds-spacing-quickFreeze)'
                 }

package/dist/Components/DsNotistack/AlertMessage.Component.d.ts

@@ -1,15 +1,13 @@
 import React from 'react';
-import { VariantType } from 'notistack';
+import { OptionsObject } from 'notistack';
 import { DsToastProps } from '../DsToast';
-export interface AlertMessageProps extends Omit<DsToastProps, 'variant' | 'color' | 'ref'> {
-    message: string;
+import { DsNotistackProviderProps, NotiStackMessage } from './DsNotistack.Types';
+export interface AlertMessageProps extends Omit<DsToastProps, 'variant'>, Pick<OptionsObject, Exclude<keyof OptionsObject, keyof Omit<DsToastProps, 'variant'>>>, NotiStackMessage {
     toastVariant: DsToastProps['variant'];
-    onClose: (props: object) => void;
-    variant?: VariantType & DsToastProps['color'];
-    sx?: object;
+    iconVariant: DsNotistackProviderProps['iconVariant'];
 }
-export declare const DsNotistackAlertDefault: React.ForwardRefExoticComponent<AlertMessageProps & React.RefAttributes<HTMLDivElement>>;
-export declare const DsNotistackAlertSuccess: React.ForwardRefExoticComponent<AlertMessageProps & React.RefAttributes<HTMLDivElement>>;
-export declare const DsNotistackAlertError: React.ForwardRefExoticComponent<AlertMessageProps & React.RefAttributes<HTMLDivElement>>;
-export declare const DsNotistackAlertWarning: React.ForwardRefExoticComponent<AlertMessageProps & React.RefAttributes<HTMLDivElement>>;
-export declare const DsNotistackAlertInfo: React.ForwardRefExoticComponent<AlertMessageProps & React.RefAttributes<HTMLDivElement>>;
+export declare const DsNotistackAlertDefault: React.ForwardRefExoticComponent<Omit<AlertMessageProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const DsNotistackAlertSuccess: React.ForwardRefExoticComponent<Omit<AlertMessageProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const DsNotistackAlertError: React.ForwardRefExoticComponent<Omit<AlertMessageProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const DsNotistackAlertWarning: React.ForwardRefExoticComponent<Omit<AlertMessageProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const DsNotistackAlertInfo: React.ForwardRefExoticComponent<Omit<AlertMessageProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/Components/DsNotistack/AlertMessage.Component.js

@@ -2,23 +2,14 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import React, { Component } from 'react';
 import { closeSnackbar } from 'notistack';
 import { DsToast } from '../DsToast';
-const AlertMessageDefaultProps = {
-    toastVariant: 'filled',
-    message: '',
-    onClose: props => undefined
-};
 class AlertMessage extends Component {
-    static defaultProps = AlertMessageDefaultProps;
     handleClose = () => {
-        const { id, onClose } = this.props;
-        if (onClose && typeof onClose === 'function') {
-            onClose(this.props);
-        }
+        const { id } = this.props;
         closeSnackbar(id);
     };
     render() {
-        const { forwardedRef, message, toastVariant, variant, icon, action, sx } = this.props;
-        return (_jsx(DsToast, { forwardedRef: forwardedRef, variant: toastVariant, color: variant, sx: sx, icon: icon, action: action, onClose: this.handleClose, children: message }));
+        const { ref, toastVariant, variant, message, id, autoHideDuration, hideIconVariant, anchorOrigin, persist, iconVariant, ...restProps } = this.props;
+        return (_jsx(DsToast, { ...restProps, variant: toastVariant, color: variant, onClose: this.handleClose, children: message }));
     }
 }
 export const DsNotistackAlertDefault = React.forwardRef((props, ref) => {

package/dist/Components/DsNotistack/DsNotistack.Types.d.ts

@@ -1,12 +1,10 @@
-import { SharedProps, SnackbarKey, SnackbarMessage, SnackbarProviderProps } from 'notistack';
+import { OptionsObject, SnackbarKey, SnackbarMessage, SnackbarProviderProps } from 'notistack';
 import { DsToastProps } from '../DsToast';
 export interface DsNotistackProviderProps extends SnackbarProviderProps {
 }
 export type DsNotistackKey = SnackbarKey;
-export interface EnqueNotistackProps extends SharedProps {
+export interface NotiStackMessage {
     message: SnackbarMessage;
-    key?: DsNotistackKey;
-    toastVariant?: Omit<DsToastProps['variant'], 'standard'>;
-    icon?: DsToastProps['icon'];
 }
-export declare const DsNotistackDefaultProps: DsNotistackProviderProps;
+export interface EnqueNotistackProps extends OptionsObject, NotiStackMessage, Pick<DsToastProps, Exclude<keyof DsToastProps, keyof OptionsObject>> {
+}

package/dist/Components/DsNotistack/DsNotistack.Types.js

@@ -1 +1 @@
-export const DsNotistackDefaultProps = {};
+export {};

package/dist/Components/DsProgressIndicator/DsProgressIndicator.Component.js

@@ -25,7 +25,7 @@ export class DsProgressIndicator extends Component {
         const squareSize = this.props['ds-variant'] === 'fraction' ? '48px' : '32px';
         const fillPercentage = Math.round((activeStep / steps) * 100);
         const fillColor = isSuccess ? 'success' : isError ? 'error' : 'secondary';
-        return (_jsxs(DsBox, { display: "flex", position: "relative", height: squareSize, width: squareSize, children: [_jsx(DsCircularProgress, { variant: "determinate", value: 100, sx: { color: 'var(--ds-colour-stateDisabledSurface)' }, size: squareSize, thickness: 4 }), _jsx(DsCircularProgress, { disableShrink: true, variant: "determinate", color: fillColor, value: fillPercentage, size: squareSize, thickness: 4, style: {
+        return (_jsxs(DsBox, { display: "flex", position: "relative", height: squareSize, width: squareSize, children: [_jsx(DsCircularProgress, { variant: "determinate", value: 100, sx: { color: 'var(--ds-colour-stateDisabledSurface)' }, size: squareSize, thickness: 4 }), _jsx(DsCircularProgress, { variant: "determinate", color: fillColor, value: fillPercentage, size: squareSize, thickness: 4, style: {
                         position: 'absolute'
                     } }), _jsx(DsTypography, { variant: "subheadingSemiboldDefault", sx: {
                         position: 'absolute',

package/dist/Components/DsSelect/DsSelect.Component.js

@@ -13,13 +13,13 @@ export class DsSelect extends PureComponent {
     static defaultProps = DsSelectDefaultProps;
     selectRef = React.createRef();
     render() {
-        const { id, name, placeholder, label, labelSupportText, color, helperText, success, error, sx, fullWidth, children, options, disabled, FormControlProps, InputLabelProps, FormHelperTextProps, ...selectProps } = this.props;
+        const { id, name, placeholder, label, labelSupportText, color, helperText, success, error, sx, fullWidth, children, options, disabled, FormControlProps, InputLabelProps, FormHelperTextProps, required, ...selectProps } = this.props;
         const customColor = success ? 'success' : color;
         const valueMap = options.reduce((acc, item) => {
             acc.set(item.value, item.label);
             return acc;
         }, new Map());
-        return (_jsxs(DsFormControl, { fullWidth: fullWidth, color: customColor, error: error, sx: sx, disabled: disabled, ...FormControlProps, children: [_jsx(DsInputLabel, { label: label, labelSupportText: labelSupportText, error: error, success: success, htmlFor: id || name, disabled: disabled, ...InputLabelProps }), _jsxs(Select, { ref: this.selectRef, id: id, name: name, IconComponent: IconComponent, displayEmpty: true, input: _jsx(DsInputBase, {}), renderValue: value => {
+        return (_jsxs(DsFormControl, { fullWidth: fullWidth, color: customColor, error: error, sx: sx, disabled: disabled, required: required, ...FormControlProps, children: [_jsx(DsInputLabel, { label: label, labelSupportText: labelSupportText, error: error, success: success, htmlFor: id || name, disabled: disabled, ...InputLabelProps }), _jsxs(Select, { ref: this.selectRef, id: id, name: name, IconComponent: IconComponent, displayEmpty: true, input: _jsx(DsInputBase, {}), renderValue: value => {
                         if (!value || (value instanceof Array && !value.length)) {
                             return (_jsx(DsTypography, { variant: "bodyRegularMedium", color: "text.disabled", children: placeholder }));
                         }

package/dist/Components/DsSelect/DsSelect.Types.js

@@ -1,5 +1,7 @@
 export const DsSelectDefaultProps = {
     options: [],
+    variant: 'filled',
+    defaultValue: '',
     MenuProps: {
         anchorOrigin: {
             vertical: 'bottom',

package/dist/Components/DsToast/DsToast.Component.js

@@ -2,13 +2,13 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { PureComponent } from 'react';
 import Alert from '@mui/material/Alert';
 import { DsRemixIcon } from '../DsRemixIcon';
-const CloseIcon = (props) => (_jsx(DsRemixIcon, { ...props, fontSize: "mild", className: "ri-close-line" }));
+const CloseIcon = (props) => {
+    const { ownerState, ...restProps } = props;
+    return (_jsx(DsRemixIcon, { fontSize: "mild", className: "ri-close-line", ...restProps }));
+};
 export class DsToast extends PureComponent {
     render() {
         const { forwardedRef, ...restProps } = this.props;
-        return (_jsx(Alert, { ref: forwardedRef, ...restProps, components: {
-                ...this.props.components,
-                CloseIcon
-            } }));
+        return (_jsx(Alert, { ref: forwardedRef, ...restProps, slots: { closeIcon: CloseIcon, ...restProps?.slots } }));
     }
 }

package/dist/Theme/componentOverrides.d.ts

@@ -1292,7 +1292,6 @@ declare const componentOverrides: {
                 };
             };
             endAdornment: {
-                top: string;
                 right: string;
                 display: string;
                 alignItems: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@am92/react-design-system",
-  "version": "2.6.0",
+  "version": "2.7.0",
   "description": "ReactJS Design System using Material UI",
   "sideEffects": false,
   "types": "dist/index.d.ts",
@@ -19,7 +19,7 @@
     "@mui/lab": "5.0.0-alpha.155",
     "@mui/material": "~5.16.7",
     "@mui/system": "~5.16.7",
-    "@mui/x-charts": "^7.17.0",
+    "@mui/x-charts": "7.15.0",
     "@mui/x-date-pickers": "~6.19.5",
     "date-fns": "~2.30.0",
     "lottie-react": "~2.4.0",