@mtes-mct/monitor-ui 5.9.0 → 5.9.2

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+## [5.9.1](https://github.com/MTES-MCT/monitor-ui/compare/v5.9.0...v5.9.1) (2023-05-05)
+
+
+### Bug Fixes
+
+* **components:** add default class name to Dialog ([b74ea15](https://github.com/MTES-MCT/monitor-ui/commit/b74ea15a9ae9d629e99eb2917a2acc3b88936736))
+
+# [5.9.0](https://github.com/MTES-MCT/monitor-ui/compare/v5.8.1...v5.9.0) (2023-05-05)
+
+
+### Features
+
+* **components:** add Dialog ([89057d2](https://github.com/MTES-MCT/monitor-ui/commit/89057d25674f76b8298fc432a6bd1f521b25f605))
+
 ## [5.8.1](https://github.com/MTES-MCT/monitor-ui/compare/v5.8.0...v5.8.1) (2023-05-04)
 
 

package/components/Dialog/index.d.ts

@@ -1,8 +1,8 @@
-import type { HTMLAttributes } from 'react';
+import { HTMLAttributes } from 'react';
 export type DialogProps = HTMLAttributes<HTMLDivElement> & {
     isAbsolute?: boolean;
 };
-export declare function RawDialog({ children, isAbsolute, ...nativeProps }: DialogProps): JSX.Element;
+export declare function RawDialog({ children, className, isAbsolute, ...nativeProps }: DialogProps): JSX.Element;
 export declare namespace RawDialog {
     var displayName: string;
 }

package/elements/Button.d.ts

@@ -8,7 +8,7 @@ export type ButtonProps = Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'childre
     isFullWidth?: boolean | undefined;
     size?: Size | undefined;
 };
-export declare function Button({ accent, children, Icon, isFullWidth, onClick, size, type, ...nativeProps }: ButtonProps): JSX.Element;
+export declare function Button({ accent, children, Icon, isFullWidth, size, type, ...nativeProps }: ButtonProps): JSX.Element;
 export declare const PrimaryButton: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, {}, never>;
 export declare const SecondaryButton: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, {}, never>;
 export declare const TertiaryButton: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, {}, never>;

package/elements/IconButton.d.ts

@@ -9,4 +9,4 @@ export type IconButtonProps = Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'chi
     iconSize?: number | undefined;
     size?: Size | undefined;
 };
-export declare function IconButton({ accent, color, Icon, iconSize, onClick, size, type, ...nativeProps }: IconButtonProps): JSX.Element;
+export declare function IconButton({ accent, color, Icon, iconSize, size, type, ...nativeProps }: IconButtonProps): JSX.Element;

package/index.js

@@ -2163,6 +2163,68 @@ function ThemeProvider({ children, theme = {} }) {
     return jsx(UntypedStyledComponentsThemeProvider, { theme: finalTheme, children: children });
 }
 
+var classnames = {exports: {}};
+
+/*!
+	Copyright (c) 2018 Jed Watson.
+	Licensed under the MIT License (MIT), see
+	http://jedwatson.github.io/classnames
+*/
+
+(function (module) {
+	/* global define */
+
+	(function () {
+
+		var hasOwn = {}.hasOwnProperty;
+
+		function classNames() {
+			var classes = [];
+
+			for (var i = 0; i < arguments.length; i++) {
+				var arg = arguments[i];
+				if (!arg) continue;
+
+				var argType = typeof arg;
+
+				if (argType === 'string' || argType === 'number') {
+					classes.push(arg);
+				} else if (Array.isArray(arg)) {
+					if (arg.length) {
+						var inner = classNames.apply(null, arg);
+						if (inner) {
+							classes.push(inner);
+						}
+					}
+				} else if (argType === 'object') {
+					if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {
+						classes.push(arg.toString());
+						continue;
+					}
+
+					for (var key in arg) {
+						if (hasOwn.call(arg, key) && arg[key]) {
+							classes.push(key);
+						}
+					}
+				}
+			}
+
+			return classes.join(' ');
+		}
+
+		if (module.exports) {
+			classNames.default = classNames;
+			module.exports = classNames;
+		} else {
+			window.classNames = classNames;
+		}
+	}()); 
+} (classnames));
+
+var classnamesExports = classnames.exports;
+var classNames = /*@__PURE__*/getDefaultExportFromCjs(classnamesExports);
+
 const Action = styled.div `
   background-color: ${p => p.theme.color.white};
   border-bottom-left-radius: 2px;
@@ -2218,8 +2280,13 @@ const Title = styled.h4 `
   text-align: center;
 `;
 
-function RawDialog({ children, isAbsolute = false, ...nativeProps }) {
-    return (jsxs(Box$g, { "$isAbsolute": isAbsolute, ...nativeProps, onClick: e => e.stopPropagation(), children: [jsx(Overlay, { "$isAbsolute": isAbsolute }), jsx(Window, { "$isAbsolute": isAbsolute, children: children })] }));
+function stopMouseEventPropagation(event) {
+    event.stopPropagation();
+}
+
+function RawDialog({ children, className, isAbsolute = false, ...nativeProps }) {
+    const controlledClassName = useMemo(() => classNames('Component-Dialog', className), [className]);
+    return (jsxs(Box$g, { "$isAbsolute": isAbsolute, className: controlledClassName, ...nativeProps, onClick: stopMouseEventPropagation, children: [jsx(Overlay, { "$isAbsolute": isAbsolute }), jsx(Window, { "$isAbsolute": isAbsolute, children: children })] }));
 }
 const Box$g = styled.div `
   position: ${p => (p.$isAbsolute ? 'absolute' : 'fixed')};
@@ -2637,32 +2704,21 @@ function toWindowFeatures(features) {
         .join(',');
 }
 
-function stopMouseEventPropagation(event) {
-    event.stopPropagation();
-}
-
 const ICON_SIZE = {
     [Size.LARGE]: 20,
     [Size.NORMAL]: 20,
     [Size.SMALL]: 12
 };
-function Button({ accent = Accent.PRIMARY, children, Icon, isFullWidth = false, onClick, size = Size.NORMAL, type = 'button', ...nativeProps }) {
+function Button({ accent = Accent.PRIMARY, children, Icon, isFullWidth = false, size = Size.NORMAL, type = 'button', ...nativeProps }) {
     const commonChildren = useMemo(() => (jsxs(Fragment, { children: [Icon && jsx(Icon, { size: ICON_SIZE[size] }), children && jsx(ButtonLabel, { children: children })] })), [children, Icon, size]);
-    const handleClick = useCallback((event) => {
-        stopMouseEventPropagation(event);
-        if (onClick) {
-            onClick(event);
-        }
-    }, [onClick]);
     const commonProps = useMemo(() => ({
         as: StyledButton$1,
         children: commonChildren,
         isFullWidth,
-        onClick: handleClick,
         size,
         type,
         ...nativeProps
-    }), [commonChildren, isFullWidth, handleClick, nativeProps, size, type]);
+    }), [commonChildren, isFullWidth, nativeProps, size, type]);
     switch (accent) {
         case Accent.SECONDARY:
             return jsx(SecondaryButton, { ...commonProps });
@@ -2788,7 +2844,7 @@ const ICON_SIZE_IN_PX = {
     [Size.NORMAL]: 20,
     [Size.SMALL]: 14
 };
-function IconButton({ accent = Accent.PRIMARY, color, Icon, iconSize, onClick, size = Size.NORMAL, type = 'button', ...nativeProps }) {
+function IconButton({ accent = Accent.PRIMARY, color, Icon, iconSize, size = Size.NORMAL, type = 'button', ...nativeProps }) {
     const children = useMemo(() => jsx(Icon, { color: color, size: iconSize || ICON_SIZE_IN_PX[size] }), [color, Icon, iconSize, size]);
     const commonProps = useMemo(() => ({
         children,
@@ -2796,19 +2852,13 @@ function IconButton({ accent = Accent.PRIMARY, color, Icon, iconSize, onClick, s
         type,
         ...nativeProps
     }), [children, nativeProps, size, type]);
-    const handleClick = useCallback((event) => {
-        stopMouseEventPropagation(event);
-        if (onClick) {
-            onClick(event);
-        }
-    }, [onClick]);
     switch (accent) {
         case Accent.SECONDARY:
-            return jsx(SecondaryButton, { as: StyledButton, onClick: handleClick, ...commonProps });
+            return jsx(SecondaryButton, { as: StyledButton, ...commonProps });
         case Accent.TERTIARY:
-            return jsx(TertiaryButton, { as: StyledButton, onClick: handleClick, ...commonProps });
+            return jsx(TertiaryButton, { as: StyledButton, ...commonProps });
         default:
-            return jsx(PrimaryButton, { as: StyledButton, onClick: handleClick, ...commonProps });
+            return jsx(PrimaryButton, { as: StyledButton, ...commonProps });
     }
 }
 const PADDING = {
@@ -3247,68 +3297,6 @@ const StyledIconButton = styled(IconButton) `
   }
 `;
 
-var classnames = {exports: {}};
-
-/*!
-	Copyright (c) 2018 Jed Watson.
-	Licensed under the MIT License (MIT), see
-	http://jedwatson.github.io/classnames
-*/
-
-(function (module) {
-	/* global define */
-
-	(function () {
-
-		var hasOwn = {}.hasOwnProperty;
-
-		function classNames() {
-			var classes = [];
-
-			for (var i = 0; i < arguments.length; i++) {
-				var arg = arguments[i];
-				if (!arg) continue;
-
-				var argType = typeof arg;
-
-				if (argType === 'string' || argType === 'number') {
-					classes.push(arg);
-				} else if (Array.isArray(arg)) {
-					if (arg.length) {
-						var inner = classNames.apply(null, arg);
-						if (inner) {
-							classes.push(inner);
-						}
-					}
-				} else if (argType === 'object') {
-					if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {
-						classes.push(arg.toString());
-						continue;
-					}
-
-					for (var key in arg) {
-						if (hasOwn.call(arg, key) && arg[key]) {
-							classes.push(key);
-						}
-					}
-				}
-			}
-
-			return classes.join(' ');
-		}
-
-		if (module.exports) {
-			classNames.default = classNames;
-			module.exports = classNames;
-		} else {
-			window.classNames = classNames;
-		}
-	}()); 
-} (classnames));
-
-var classnamesExports = classnames.exports;
-var classNames = /*@__PURE__*/getDefaultExportFromCjs(classnamesExports);
-
 const Field$2 = styled.div.attrs(props => ({
     className: classNames('Element-Field', props.className)
 })) `