@mtes-mct/monitor-ui 10.18.0 → 10.19.0

package/CHANGELOG.md

@@ -1,3 +1,15 @@
+## [10.18.0](https://github.com/MTES-MCT/monitor-ui/compare/v10.17.1...v10.18.0) (2024-01-09)
+
+
+### Features
+
+* **cypress:** add callback to waitForLastRequest command ([aaded2d](https://github.com/MTES-MCT/monitor-ui/commit/aaded2d43f462a6bbcffc8fa32cad526da4e7413))
+
+
+### Bug Fixes
+
+* **e2e:** fix test with border effect ([97c82c9](https://github.com/MTES-MCT/monitor-ui/commit/97c82c9b64dfd72a95bda104bb077d78b216b81a))
+
 ## [10.17.1](https://github.com/MTES-MCT/monitor-ui/compare/v10.17.0...v10.17.1) (2024-01-04)
 
 

package/fields/TextInput.d.ts

@@ -9,6 +9,7 @@ export type TextInputProps = Omit<InputProps, 'as' | 'defaultValue' | 'id' | 'on
     isErrorMessageHidden?: boolean | undefined;
     isLabelHidden?: boolean | undefined;
     isLight?: boolean | undefined;
+    isSearchInput?: boolean;
     isUndefinedWhenDisabled?: boolean | undefined;
     label: string;
     name: string;
@@ -16,5 +17,5 @@ export type TextInputProps = Omit<InputProps, 'as' | 'defaultValue' | 'id' | 'on
     size?: Size | undefined;
     value?: string | undefined;
 };
-export declare function TextInput({ className, error, Icon, isErrorMessageHidden, isLabelHidden, isLight, isUndefinedWhenDisabled, label, onChange, size, style, type, value, ...originalProps }: TextInputProps): import("react/jsx-runtime").JSX.Element;
+export declare function TextInput({ className, error, Icon, isErrorMessageHidden, isLabelHidden, isLight, isSearchInput, isUndefinedWhenDisabled, label, onChange, size, style, type, value, ...originalProps }: TextInputProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=TextInput.d.ts.map

package/fields/TextInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextInput.d.ts","sourceRoot":"","sources":["../../src/fields/TextInput.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,iBAAiB,EAAwB,MAAM,OAAO,CAAA;AAIpE,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AASnC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAA;AACzC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAA;AACxC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,WAAW,CAAA;AAE3C,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,UAAU,EAAE,IAAI,GAAG,cAAc,GAAG,IAAI,GAAG,UAAU,GAAG,MAAM,GAAG,OAAO,CAAC,GAAG;IAC5G,IAAI,CAAC,EAAE,iBAAiB,CAAC,SAAS,CAAC,GAAG,SAAS,CAAA;IAC/C,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IAC1B,oBAAoB,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;IAC1C,aAAa,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;IACnC,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;IAC7B,uBAAuB,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;IAC7C,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,EAAE,MAAM,GAAG,SAAS,KAAK,UAAU,CAAC,IAAI,CAAC,CAAC,GAAG,SAAS,CAAA;IAC5E,IAAI,CAAC,EAAE,IAAI,GAAG,SAAS,CAAA;IACvB,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;CAC3B,CAAA;AACD,wBAAgB,SAAS,CAAC,EACxB,SAAS,EACT,KAAK,EACL,IAAI,EACJ,oBAA4B,EAC5B,aAAqB,EACrB,OAAe,EACf,uBAA+B,EAC/B,KAAK,EACL,QAAQ,EACR,IAAkB,EAClB,KAAK,EACL,IAAa,EACb,KAAK,EACL,GAAG,aAAa,EACjB,EAAE,cAAc,2CAoDhB"}
+{"version":3,"file":"TextInput.d.ts","sourceRoot":"","sources":["../../src/fields/TextInput.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,iBAAiB,EAAwB,MAAM,OAAO,CAAA;AAIpE,OAAO,EAAU,IAAI,EAAE,MAAM,cAAc,CAAA;AAW3C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAA;AACzC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAA;AACxC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,WAAW,CAAA;AAE3C,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,UAAU,EAAE,IAAI,GAAG,cAAc,GAAG,IAAI,GAAG,UAAU,GAAG,MAAM,GAAG,OAAO,CAAC,GAAG;IAC5G,IAAI,CAAC,EAAE,iBAAiB,CAAC,SAAS,CAAC,GAAG,SAAS,CAAA;IAC/C,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IAC1B,oBAAoB,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;IAC1C,aAAa,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;IACnC,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;IAC7B,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,uBAAuB,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;IAC7C,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,EAAE,MAAM,GAAG,SAAS,KAAK,UAAU,CAAC,IAAI,CAAC,CAAC,GAAG,SAAS,CAAA;IAC5E,IAAI,CAAC,EAAE,IAAI,GAAG,SAAS,CAAA;IACvB,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;CAC3B,CAAA;AACD,wBAAgB,SAAS,CAAC,EACxB,SAAS,EACT,KAAK,EACL,IAAI,EACJ,oBAA4B,EAC5B,aAAqB,EACrB,OAAe,EACf,aAAqB,EACrB,uBAA+B,EAC/B,KAAK,EACL,QAAQ,EACR,IAAkB,EAClB,KAAK,EACL,IAAa,EACb,KAAK,EACL,GAAG,aAAa,EACjB,EAAE,cAAc,2CA6EhB"}

package/index.js

@@ -55738,7 +55738,7 @@ function Search({ baseContainer, className, customSearch = undefined, customSear
                                 onClick: clean,
                                 size: Size.SMALL
                             }),
-                            isSearchIconVisible && /*#__PURE__*/ jsx(Separator, {
+                            isSearchIconVisible && /*#__PURE__*/ jsx(Separator$1, {
                                 children: "|"
                             })
                         ]
@@ -55765,7 +55765,7 @@ const StyledCloseButton = styled(IconButton)`
 const StyledIconSearch = styled(Search$1)`
   margin: 10px 10px 10px 8px;
 `;
-const Separator = styled.div`
+const Separator$1 = styled.div`
   height: 40px;
   font-weight: 300;
   color: ${(p)=>p.theme.color.lightGray};
@@ -70196,7 +70196,7 @@ const StyledInput$1 = styled(Input)`
   }
 `;
 
-function TextInput({ className, error, Icon, isErrorMessageHidden = false, isLabelHidden = false, isLight = false, isUndefinedWhenDisabled = false, label, onChange, size = Size.NORMAL, style, type = 'text', value, ...originalProps }) {
+function TextInput({ className, error, Icon, isErrorMessageHidden = false, isLabelHidden = false, isLight = false, isSearchInput = false, isUndefinedWhenDisabled = false, label, onChange, size = Size.NORMAL, style, type = 'text', value, ...originalProps }) {
     const controlledClassname = useMemo(()=>classnames('Field-TextInput', className), [
         className
     ]);
@@ -70210,6 +70210,14 @@ function TextInput({ className, error, Icon, isErrorMessageHidden = false, isLab
         originalProps.disabled,
         originalProps.name
     ]);
+    const clean = useCallback(()=>{
+        if (!onChange) {
+            return;
+        }
+        onChange(undefined);
+    }, [
+        onChange
+    ]);
     const handleChange = useCallback((nextValue)=>{
         if (!onChange) {
             return;
@@ -70245,6 +70253,26 @@ function TextInput({ className, error, Icon, isErrorMessageHidden = false, isLab
                         value: value || '',
                         ...originalProps
                     }, key),
+                    isSearchInput && !Icon && /*#__PURE__*/ jsxs(IconsContainer, {
+                        $size: size,
+                        children: [
+                            value && /*#__PURE__*/ jsxs(Fragment, {
+                                children: [
+                                    /*#__PURE__*/ jsx(IconButton, {
+                                        accent: Accent.TERTIARY,
+                                        color: THEME.color.slateGray,
+                                        Icon: Close,
+                                        onClick: clean,
+                                        size: Size.SMALL
+                                    }),
+                                    /*#__PURE__*/ jsx(Separator, {})
+                                ]
+                            }),
+                            /*#__PURE__*/ jsx(Search$1, {
+                                color: THEME.color.slateGray
+                            })
+                        ]
+                    }),
                     Icon && /*#__PURE__*/ jsx(Icon, {
                         color: THEME.color.slateGray
                     })
@@ -70266,6 +70294,20 @@ const PADDING_WITH_ICON = {
     [Size.NORMAL]: '3px 38px 6px 8px',
     [Size.SMALL]: '3px 38px 6px 8px'
 };
+const IconsContainer = styled.div`
+  align-items: center;
+  display: flex;
+  position: absolute;
+  right: 5px;
+  top: ${(p)=>p.$size === Size.LARGE ? '10px' : '5px'};
+`;
+const Separator = styled.div`
+  border-right: 1px solid ${(p)=>p.theme.color.lightGray};
+  height: 20px;
+  margin-left: 4px;
+  margin-right: 6px;
+  padding-top: 3px;
+`;
 const StyledInput = styled(Input)`
   background-color: ${(p)=>p.$isLight ? p.theme.color.white : p.theme.color.gainsboro};
   border: solid 1px ${(p)=>p.$hasError ? p.theme.color.maximumRed : p.theme.color.gainsboro};
@@ -70294,7 +70336,6 @@ const StyledInput = styled(Input)`
 const InputBox = styled.div`
   position: relative;
   width: 100%;
-
   > .Element-IconBox {
     position: absolute;
     right: 10px;