@mtes-mct/monitor-ui 24.11.0 → 24.11.2

package/fields/Toggle/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/Toggle/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EAA0B,KAAK,WAAW,IAAI,iBAAiB,EAAE,MAAM,QAAQ,CAAA;AAgBtF,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,iBAAiB,EAAE,IAAI,GAAG,SAAS,GAAG,gBAAgB,GAAG,IAAI,GAAG,UAAU,CAAC,GAAG;IAC3G,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,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,UAAU,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;IAChC,aAAa,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;IACnC,uBAAuB,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;IAC7C,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,GAAG,SAAS,KAAK,IAAI,CAAA;CACpD,CAAA;AACD,wBAAgB,MAAM,CAAC,EACrB,OAAe,EACf,SAAS,EACT,MAAM,EACN,QAAgB,EAChB,KAAK,EACL,oBAA4B,EAC5B,aAAqB,EACrB,OAAe,EACf,UAAkB,EAClB,aAAqB,EACrB,uBAA+B,EAC/B,KAAK,EACL,QAAQ,EACR,QAAgB,EAChB,KAAK,EACL,GAAG,aAAa,EACjB,EAAE,WAAW,2CAgCb"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/Toggle/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EAA0B,KAAK,WAAW,IAAI,iBAAiB,EAAE,MAAM,QAAQ,CAAA;AAgBtF,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,iBAAiB,EAAE,IAAI,GAAG,SAAS,GAAG,gBAAgB,GAAG,IAAI,GAAG,UAAU,CAAC,GAAG;IAC3G,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,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,UAAU,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;IAChC,aAAa,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;IACnC,uBAAuB,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;IAC7C,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAA;CACxC,CAAA;AACD,wBAAgB,MAAM,CAAC,EACrB,OAAe,EACf,SAAS,EACT,MAAM,EACN,QAAgB,EAChB,KAAK,EACL,oBAA4B,EAC5B,aAAqB,EACrB,OAAe,EACf,UAAkB,EAClB,aAAqB,EACrB,uBAA+B,EAC/B,KAAK,EACL,QAAQ,EACR,QAAgB,EAChB,KAAK,EACL,GAAG,aAAa,EACjB,EAAE,WAAW,2CAgCb"}

package/fields/shared/StyledInputBox.d.ts

@@ -4,7 +4,7 @@ type StyledInputBoxProps = CommonFieldStyleProps & {
     $hasIcon: boolean;
     $size: Size;
 };
-export declare const inputStyle: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<StyledInputBoxProps, import("styled-components").DefaultTheme>>;
-export declare const StyledInputBox: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, StyledInputBoxProps, never>;
+export declare const inputStyle: import("styled-components").RuleSet<StyledInputBoxProps>;
+export declare const StyledInputBox: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledInputBoxProps>> & string;
 export {};
 //# sourceMappingURL=StyledInputBox.d.ts.map

package/fields/shared/StyledInputBox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StyledInputBox.d.ts","sourceRoot":"","sources":["../../../src/fields/shared/StyledInputBox.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAA;AASjC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAA;AAEpD,KAAK,mBAAmB,GAAG,qBAAqB,GAAG;IACjD,QAAQ,EAAE,OAAO,CAAA;IACjB,KAAK,EAAE,IAAI,CAAA;CACZ,CAAA;AAaD,eAAO,MAAM,UAAU,gKAoCtB,CAAA;AAED,eAAO,MAAM,cAAc,0HAuB1B,CAAA"}
+{"version":3,"file":"StyledInputBox.d.ts","sourceRoot":"","sources":["../../../src/fields/shared/StyledInputBox.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAA;AASjC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAA;AAEpD,KAAK,mBAAmB,GAAG,qBAAqB,GAAG;IACjD,QAAQ,EAAE,OAAO,CAAA;IACjB,KAAK,EAAE,IAAI,CAAA;CACZ,CAAA;AAaD,eAAO,MAAM,UAAU,0DAoCtB,CAAA;AAED,eAAO,MAAM,cAAc,wPAuB1B,CAAA"}

package/fields/shared/StyledRsuiteCalendarBox.d.ts

@@ -1,5 +1,5 @@
-export declare const StyledRsuiteCalendarBox: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
+export declare const StyledRsuiteCalendarBox: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
     $isDoubleCalendar?: boolean;
     $isRightAligned?: boolean;
-}, never>;
+}>> & string;
 //# sourceMappingURL=StyledRsuiteCalendarBox.d.ts.map

package/fields/shared/StyledRsuiteCalendarBox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StyledRsuiteCalendarBox.d.ts","sourceRoot":"","sources":["../../../src/fields/shared/StyledRsuiteCalendarBox.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,uBAAuB;wBACd,OAAO;sBACT,OAAO;SAmQ1B,CAAA"}
+{"version":3,"file":"StyledRsuiteCalendarBox.d.ts","sourceRoot":"","sources":["../../../src/fields/shared/StyledRsuiteCalendarBox.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,uBAAuB;wBACd,OAAO;sBACT,OAAO;YAmQ1B,CAAA"}

package/fields/shared/StyledRsuitePickerBox.d.ts

@@ -1,3 +1,3 @@
 import type { CommonPickerFieldStyleProps } from './types';
-export declare const StyledRsuitePickerBox: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, CommonPickerFieldStyleProps, never>;
+export declare const StyledRsuitePickerBox: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, CommonPickerFieldStyleProps>> & string;
 //# sourceMappingURL=StyledRsuitePickerBox.d.ts.map

package/fields/shared/StyledRsuitePickerBox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StyledRsuitePickerBox.d.ts","sourceRoot":"","sources":["../../../src/fields/shared/StyledRsuitePickerBox.ts"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,SAAS,CAAA;AAE1D,eAAO,MAAM,qBAAqB,kIAoTjC,CAAA"}
+{"version":3,"file":"StyledRsuitePickerBox.d.ts","sourceRoot":"","sources":["../../../src/fields/shared/StyledRsuitePickerBox.ts"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,SAAS,CAAA;AAE1D,eAAO,MAAM,qBAAqB,gQAoTjC,CAAA"}

package/index.js

@@ -22020,7 +22020,7 @@ const SecondaryDropdownItem = styled(Dropdown$1.Item)`
   padding: 4px;
   width: 30px;
   height: 30px;
-  :hover {
+  &:hover {
     background-color: ${(p)=>p.theme.color.cultured};
     border: 1px solid ${(p)=>p.theme.color.lightGray};
     color: ${(p)=>p.theme.color.blueYonder};
@@ -22096,19 +22096,19 @@ const PrimaryDropdown = styled(Dropdown$1)`
     font-size: 13px;
     padding: 3px ${(p)=>p.$hasTitle ? 12 : 6}px ${(p)=>p.$hasIcon ? '4px' : '5px'};
 
-    :hover {
+    &:hover {
       background-color: ${(p)=>p.theme.color.blueYonder};
       border: 1px solid ${(p)=>p.theme.color.blueYonder};
       color: ${(p)=>p.theme.color.white};
     }
 
-    :active {
+    &:active {
       background-color: ${(p)=>p.theme.color.blueGray};
       border: 1px solid ${(p)=>p.theme.color.blueGray};
       color: ${(p)=>p.theme.color.white};
     }
 
-    :disabled {
+    &:disabled {
       background-color: ${(p)=>p.theme.color.lightGray};
       border: 1px solid ${(p)=>p.theme.color.lightGray};
       color: ${(p)=>p.theme.color.cultured};
@@ -53741,24 +53741,23 @@ function Button$1({ Icon, isActive, title, ...originalProps }) {
 const MenuButton = styled(IconButton)`
   animation: none;
   background: ${(p)=>p.$isActive ? p.theme.color.blueGray : 'none'};
-  border: 0;
+  border: none;
   border-bottom: solid 0.5px ${(p)=>p.theme.color.slateGray};
   color: ${(p)=>p.$isActive ? p.theme.color.white : p.theme.color.gainsboro};
   padding: 18px;
   height: 64px;
 
-  :hover,
-  :focus {
+  &:hover,
+  &:focus {
     background: ${(p)=>p.$isActive ? p.theme.color.blueGray : 'rgba(255, 255, 255, 0.125)'};
-    border: 0;
     border: none;
     color: ${(p)=>p.theme.color.white};
   }
 
-  :first-child {
+  &:first-child {
     border-top: solid 0.5px ${(p)=>p.theme.color.slateGray};
 
-    :hover {
+    &:hover {
       border: none;
     }
   }
@@ -53862,21 +53861,21 @@ const PrimaryIconButton = styled(BaseIconButton)`
   border-color: ${(p)=>p.theme.color.lightGray};
   color: ${(p)=>p.theme.color.charcoal};
 
-  :hover,
+  &:hover,
   &._hover {
     background-color: ${(p)=>p.theme.color.lightGray};
     border-color: ${(p)=>p.theme.color.lightGray};
     color: ${(p)=>p.theme.color.blueYonder};
   }
 
-  :active,
+  &:active,
   &._active {
     background-color: ${(p)=>p.theme.color.lightGray};
     border-color: ${(p)=>p.theme.color.lightGray};
     color: ${(p)=>p.theme.color.blueGray};
   }
 
-  :disabled,
+  &:disabled,
   &._disabled {
     background-color: ${(p)=>p.theme.color.lightGray};
     border-color: ${(p)=>p.theme.color.lightGray};
@@ -53892,21 +53891,21 @@ const SecondaryIconButton = styled(BaseIconButton)`
   border-color: ${(p)=>p.theme.color.blueYonder};
   color: ${(p)=>p.theme.color.white};
 
-  :hover,
+  &:hover,
   &._hover {
     background-color: ${(p)=>p.theme.color.blueYonder};
     border-color: ${(p)=>p.theme.color.blueYonder};
     color: ${(p)=>p.theme.color.blueYonder25};
   }
 
-  :active,
+  &:active,
   &._active {
     background-color: ${(p)=>p.theme.color.blueYonder};
     border-color: ${(p)=>p.theme.color.blueYonder};
     color: ${(p)=>p.theme.color.blueYonder25};
   }
 
-  :disabled,
+  &:disabled,
   &._disabled {
     background-color: ${(p)=>p.theme.color.blueYonder};
     border-color: ${(p)=>p.theme.color.blueYonder};
@@ -54061,6 +54060,7 @@ const Box$c = styled.div`
 function LinkButton({ children, className, Icon, size = Size.NORMAL, ...props }) {
     const controlledClassName = classnames('Element-LinkButton', className);
     return /*#__PURE__*/ jsx(StyledLinkButton$1, {
+        $isDisabled: props.disabled,
         $size: size,
         className: controlledClassName,
         ...props,
@@ -54089,7 +54089,7 @@ const StyledLinkButton$1 = styled.button`
   align-items: flex-end;
   background: transparent;
   color: ${(p)=>p.theme.color.slateGray};
-  cursor: ${(p)=>p.disabled ? 'none' : 'pointer'};
+  cursor: ${(p)=>p.$isDisabled ? 'none' : 'pointer'};
   display: flex;
   flex-direction: row;
   font-size: ${(p)=>FONT_SIZE$1[p.$size]};
@@ -54552,7 +54552,7 @@ const FieldError = styled.p.attrs((props)=>({
         className: classnames('Element-FieldError', props.className)
     }))`
   color: ${(p)=>p.theme.color.maximumRed};
-  display: ${(p)=>p.isDisabled ? 'none' : 'block'};
+  display: ${(p)=>p.$isDisabled ? 'none' : 'block'};
   font-size: 13px;
   font-style: italic;
   line-height: 1.3846;
@@ -54569,7 +54569,7 @@ const Label = styled.label.attrs((props)=>({
         className: classnames('Element-Label', props.className)
     }))`
   color: ${(p)=>// eslint-disable-next-line no-nested-ternary
-    p.$idDisabled ? p.theme.color.lightGray : p.$hasError ? p.theme.color.maximumRed : p.theme.color.slateGray};
+    p.$isDisabled ? p.theme.color.lightGray : p.$hasError ? p.theme.color.maximumRed : p.theme.color.slateGray};
   display: ${(p)=>p.$isHidden ? 'none' : 'block'};
   font-size: 13px;
   line-height: 1.3846;
@@ -54983,7 +54983,7 @@ const StyledRsuiteCheckbox = styled(Checkbox$1)`
     > label {
       /* TODO Check that with Adeline. */
       color: ${(p)=>// eslint-disable-next-line no-nested-ternary
-    p.$isDisabled || p.$isReadOnly ? p.theme.color.lightGray : p.theme.color.gunMetal};
+    p.$isDisabled ?? p.$isReadOnly ? p.theme.color.lightGray : p.theme.color.gunMetal};
       font-size: 13px;
       font-weight: 500;
       line-height: 1;
@@ -55009,7 +55009,7 @@ const StyledRsuiteCheckbox = styled(Checkbox$1)`
 
           /* Checkmark */
           &:after {
-            border-color: ${(p)=>p.$isReadOnly || p.$isTransparent ? p.theme.color.charcoal : p.theme.color.cultured};
+            border-color: ${(p)=>p.$isReadOnly ?? p.$isTransparent ? p.theme.color.charcoal : p.theme.color.cultured};
             bottom: 0;
             left: 0;
             right: 0;
@@ -55513,7 +55513,7 @@ function CheckPicker({ className, customSearch, customSearchMinQueryLength = 1,
         style: style,
         children: [
             /*#__PURE__*/ jsx(Label, {
-                $idDisabled: disabled,
+                $isDisabled: disabled,
                 $isHidden: isLabelHidden,
                 $isRequired: isRequired,
                 htmlFor: originalProps.name,
@@ -67018,7 +67018,7 @@ const Box$4 = styled.div`
   position: relative;
   user-select: none;
 
-  :hover {
+  &:hover {
     border: solid 1px
       ${(p)=>p.$isFocused ? getFieldBorderColorFactoryForState('focus')(p) : getFieldBorderColorFactoryForState('hover')(p)};
     color: ${(p)=>p.$isFocused ? getFieldBorderColorFactoryForState('focus')(p) : getFieldBorderColorFactoryForState('hover')(p)};
@@ -68079,7 +68079,7 @@ function MultiCascader({ className, disabled = false, error, isErrorMessageHidde
         style: style,
         children: [
             /*#__PURE__*/ jsx(Label, {
-                $idDisabled: disabled,
+                $isDisabled: disabled,
                 $isHidden: isLabelHidden,
                 $isRequired: isRequired,
                 htmlFor: originalProps.name,
@@ -68212,7 +68212,7 @@ function MultiSelect({ className, customSearch, customSearchMinQueryLength = 1,
         style: style,
         children: [
             /*#__PURE__*/ jsx(Label, {
-                $idDisabled: disabled,
+                $isDisabled: disabled,
                 $isHidden: isLabelHidden,
                 $isRequired: isRequired,
                 htmlFor: originalProps.name,
@@ -68360,7 +68360,7 @@ const StyledRsuiteRadio = styled(Radio$1)`
     > label {
       /* TODO Check that with Adeline. */
       color: ${(p)=>// eslint-disable-next-line no-nested-ternary
-    p.$isDisabled || p.$isReadOnly ? p.theme.color.lightGray : p.theme.color.gunMetal};
+    p.$isDisabled ?? p.$isReadOnly ? p.theme.color.lightGray : p.theme.color.gunMetal};
       font-size: 13px;
       font-weight: 500;
       line-height: 1;
@@ -68468,11 +68468,11 @@ readOnly = false, renderMenuItem, style, value }) {
         options,
         optionValueKey
     ]);
-    const handleChange = useCallback((nextRsuiteDataItemValue)=>{
+    const handleChange = useCallback((nextRsuiteDataItemValue, _event)=>{
         if (!onChange || readOnly) {
             return;
         }
-        const nextOptionValue = getSelectedOptionValueFromSelectedRsuiteDataItemValue(rsuiteData, nextRsuiteDataItemValue);
+        const nextOptionValue = getSelectedOptionValueFromSelectedRsuiteDataItemValue(rsuiteData, String(nextRsuiteDataItemValue));
         onChange(nextOptionValue);
     }, [
         onChange,
@@ -68492,7 +68492,7 @@ readOnly = false, renderMenuItem, style, value }) {
                 $isInline: isInline,
                 name: name,
                 onChange: handleChange,
-                value: selectedRsuiteValue,
+                value: selectedRsuiteValue ?? '',
                 children: rsuiteData.map((rsuiteDataItem)=>/*#__PURE__*/ jsx(Radio, {
                         checked: value !== undefined && lodashExports.eq(rsuiteDataItem.optionValue, value),
                         disabled: !!rsuiteDataItem.isDisabled || disabled,
@@ -68768,7 +68768,7 @@ function NumberInput({ areArrowsHidden = false, className, disabled = false, err
         style: style,
         children: [
             /*#__PURE__*/ jsx(Label, {
-                $idDisabled: disabled,
+                $isDisabled: disabled,
                 $isHidden: isLabelHidden,
                 $isRequired: isRequired,
                 htmlFor: name,
@@ -68879,78 +68879,6 @@ const InputWithUnit = styled(BaseInput)`
   flex-grow: 1;
 `;
 
-const PADDING = {
-    [Size.LARGE]: '8px 16px 10px',
-    [Size.NORMAL]: '3px 8px 7px',
-    [Size.SMALL]: '3px 8px 6px'
-};
-const PADDING_WITH_ICON = {
-    [Size.LARGE]: '8px 48px 10px 16px',
-    [Size.NORMAL]: '3px 38px 6px 8px',
-    [Size.SMALL]: '3px 38px 6px 8px'
-};
-const inputStyle = css`
-  background-color: ${getFieldBackgroundColorFactory()};
-  border: solid 1px ${getFieldBorderColorFactoryForState('default')};
-  border-radius: 0;
-  color: ${(p)=>p.theme.color.gunMetal};
-  ${(p)=>p.$isReadOnly && `cursor: default;`}
-  font-size: 13px;
-  font-weight: 500;
-  line-height: 19px;
-  padding: 3px 8px 6px;
-  vertical-align: center;
-  width: 100%;
-
-  &::placeholder {
-    color: ${getFieldPlaceholderColorFactoryForState('default')};
-  }
-
-  &:hover {
-    background-color: ${getFieldBackgroundColorFactory()};
-    border: solid 1px ${getFieldBorderColorFactoryForState('hover')} !important;
-
-    &::placeholder {
-      color: ${getFieldPlaceholderColorFactoryForState('hover')};
-    }
-  }
-
-  &:active,
-  &:focus {
-    background-color: ${getFieldBackgroundColorFactory()};
-    border: solid 1px ${getFieldBorderColorFactoryForState('focus')} !important;
-    outline: 0;
-
-    &::placeholder {
-      color: ${getFieldPlaceholderColorFactoryForState('focus')};
-    }
-  }
-`;
-const StyledInputBox = styled.div`
-  display: flex;
-  position: relative;
-  width: 100%;
-
-  > .rs-auto-complete {
-    display: flex;
-    flex-grow: 1;
-  }
-
-  > input,
-  > .rs-auto-complete > input {
-    ${inputStyle}
-    padding: ${(p)=>p.$hasIcon ? PADDING_WITH_ICON[p.$size] : PADDING[p.$size]};
-    line-height: 1;
-    flex-grow: 1;
-  }
-
-  > .Element-IconBox {
-    position: absolute;
-    right: ${(p)=>p.$size === Size.LARGE ? '16px' : '8px'};
-    top: ${(p)=>p.$size === Size.LARGE ? '10px' : '5px'};
-  }
-`;
-
 const internationalFormat = {
     definitions: {
         '#': /[1-9]/,
@@ -68980,13 +68908,13 @@ const defaultFormat = {
 };
 /**
  * FIXME (01/07/2024): This lib has probably a bug, I opened an issue : https://github.com/uNmAnNeR/imaskjs/issues/1053
- */ const PhoneInput = /*#__PURE__*/ forwardRef(({ disabled = false, error, isErrorMessageHidden = false, isLabelHidden = false, isLight = false, isRequired = false, isTransparent = false, isUndefinedWhenDisabled = false, label, name, onChange, value, ...props }, ref)=>{
+ */ const PhoneInput = /*#__PURE__*/ forwardRef(({ disabled = false, error, isErrorMessageHidden = false, isLabelHidden = false, isLight = false, isRequired = false, isTransparent = false, isUndefinedWhenDisabled = false, label, name, onChange, readOnly = false, value, ...props }, ref)=>{
     useFieldUndefineEffect(isUndefinedWhenDisabled && !!disabled, undefined, ()=>onChange(''));
     return /*#__PURE__*/ jsxs(Field$2, {
         className: "Field-PhoneInput",
         children: [
             /*#__PURE__*/ jsx(Label, {
-                $idDisabled: disabled,
+                $isDisabled: disabled,
                 $isHidden: isLabelHidden,
                 $isRequired: isRequired,
                 htmlFor: name,
@@ -68997,6 +68925,7 @@ const defaultFormat = {
                 $hasError: !!error,
                 $isDisabled: disabled,
                 $isLight: isLight,
+                $isReadOnly: readOnly,
                 $isTransparent: isTransparent,
                 disabled: disabled,
                 dispatch: (appended, dynamicMasked)=>{
@@ -69035,7 +68964,41 @@ const defaultFormat = {
     });
 });
 const StyledIMaskInput = styled(IMaskInput)`
-  ${inputStyle}
+  background-color: ${getFieldBackgroundColorFactory()};
+  border: solid 1px ${getFieldBorderColorFactoryForState('default')};
+  border-radius: 0;
+  color: ${(p)=>p.theme.color.gunMetal};
+  cursor: default;
+  font-size: 13px;
+  font-weight: 500;
+  line-height: 19px;
+  padding: 3px 8px 6px;
+  vertical-align: center;
+  width: 100%;
+
+  &::placeholder {
+    color: ${getFieldPlaceholderColorFactoryForState('default')};
+  }
+
+  &:hover {
+    background-color: ${getFieldBackgroundColorFactory()};
+    border: solid 1px ${getFieldBorderColorFactoryForState('hover')} !important;
+
+    &::placeholder {
+      color: ${getFieldPlaceholderColorFactoryForState('hover')};
+    }
+  }
+
+  &:active,
+  &:focus {
+    background-color: ${getFieldBackgroundColorFactory()};
+    border: solid 1px ${getFieldBorderColorFactoryForState('focus')} !important;
+    outline: 0;
+
+    &::placeholder {
+      color: ${getFieldPlaceholderColorFactoryForState('focus')};
+    }
+  }
 `;
 
 function getRichBooleanFromRichBooleanOptionValues(optionValues) {
@@ -69152,6 +69115,78 @@ function RichBooleanCheckbox({ falseOptionLabel, onChange, trueOptionLabel, valu
     return selectedOption;
 }
 
+const PADDING = {
+    [Size.LARGE]: '8px 16px 10px',
+    [Size.NORMAL]: '3px 8px 7px',
+    [Size.SMALL]: '3px 8px 6px'
+};
+const PADDING_WITH_ICON = {
+    [Size.LARGE]: '8px 48px 10px 16px',
+    [Size.NORMAL]: '3px 38px 6px 8px',
+    [Size.SMALL]: '3px 38px 6px 8px'
+};
+const inputStyle = css`
+  background-color: ${getFieldBackgroundColorFactory()};
+  border: solid 1px ${getFieldBorderColorFactoryForState('default')};
+  border-radius: 0;
+  color: ${(p)=>p.theme.color.gunMetal};
+  ${(p)=>p.$isReadOnly && `cursor: default;`}
+  font-size: 13px;
+  font-weight: 500;
+  line-height: 19px;
+  padding: 3px 8px 6px;
+  vertical-align: center;
+  width: 100%;
+
+  &::placeholder {
+    color: ${getFieldPlaceholderColorFactoryForState('default')};
+  }
+
+  &:hover {
+    background-color: ${getFieldBackgroundColorFactory()};
+    border: solid 1px ${getFieldBorderColorFactoryForState('hover')} !important;
+
+    &::placeholder {
+      color: ${getFieldPlaceholderColorFactoryForState('hover')};
+    }
+  }
+
+  &:active,
+  &:focus {
+    background-color: ${getFieldBackgroundColorFactory()};
+    border: solid 1px ${getFieldBorderColorFactoryForState('focus')} !important;
+    outline: 0;
+
+    &::placeholder {
+      color: ${getFieldPlaceholderColorFactoryForState('focus')};
+    }
+  }
+`;
+const StyledInputBox = styled.div`
+  display: flex;
+  position: relative;
+  width: 100%;
+
+  > .rs-auto-complete {
+    display: flex;
+    flex-grow: 1;
+  }
+
+  > input,
+  > .rs-auto-complete > input {
+    ${inputStyle}
+    padding: ${(p)=>p.$hasIcon ? PADDING_WITH_ICON[p.$size] : PADDING[p.$size]};
+    line-height: 1;
+    flex-grow: 1;
+  }
+
+  > .Element-IconBox {
+    position: absolute;
+    right: ${(p)=>p.$size === Size.LARGE ? '16px' : '8px'};
+    top: ${(p)=>p.$size === Size.LARGE ? '10px' : '5px'};
+  }
+`;
+
 function Search({ className, customSearch = undefined, customSearchMinQueryLength = 1, disabled = false, error, isErrorMessageHidden = false, isLabelHidden, isLight = false, isRequired = false, isSearchIconHidden = true, isTransparent = false, isUndefinedWhenDisabled = false, key, label, MenuItem, onChange, onQuery, options = [], optionValueKey, popupWidth, readOnly = false, size = Size.NORMAL, style, value, ...originalProps }) {
     // eslint-disable-next-line no-null/no-null
     const boxRef = useRef(null);
@@ -69254,7 +69289,7 @@ function Search({ className, customSearch = undefined, customSearchMinQueryLengt
         style: style,
         children: [
             /*#__PURE__*/ jsx(Label, {
-                $idDisabled: disabled,
+                $isDisabled: disabled,
                 $isHidden: isLabelHidden,
                 $isRequired: isRequired,
                 htmlFor: originalProps.name,
@@ -69418,7 +69453,7 @@ function Select({ className, customSearch, customSearchMinQueryLength = 1, disab
         style: style,
         children: [
             /*#__PURE__*/ jsx(Label, {
-                $idDisabled: disabled,
+                $isDisabled: disabled,
                 $isHidden: isLabelHidden,
                 $isRequired: isRequired,
                 htmlFor: originalProps.name,
@@ -69493,7 +69528,7 @@ function Textarea({ className, disabled = false, error, isErrorMessageHidden = f
         style: style,
         children: [
             /*#__PURE__*/ jsx(Label, {
-                $idDisabled: disabled,
+                $isDisabled: disabled,
                 $isHidden: isLabelHidden,
                 $isRequired: isRequired,
                 htmlFor: originalProps.name,
@@ -69596,7 +69631,7 @@ function TextInput({ className, disabled = false, error, Icon, isErrorMessageHid
         style: style,
         children: [
             /*#__PURE__*/ jsx(Label, {
-                $idDisabled: disabled,
+                $isDisabled: disabled,
                 $isHidden: isLabelHidden,
                 $isRequired: isRequired,
                 htmlFor: name,
@@ -69759,7 +69794,7 @@ function Toggle({ checked = false, className, dataCy, disabled = false, error, i
         style: style,
         children: [
             /*#__PURE__*/ jsx(Label, {
-                $idDisabled: disabled,
+                $isDisabled: disabled,
                 $isHidden: isLabelHidden,
                 $isRequired: isRequired,
                 htmlFor: originalProps.name,
@@ -69775,7 +69810,7 @@ function Toggle({ checked = false, className, dataCy, disabled = false, error, i
                 checked: checked,
                 "data-cy": dataCy,
                 disabled: disabled,
-                onChange: onChange,
+                onChange: (isChecked)=>onChange?.(isChecked),
                 readOnly: readOnly,
                 ...originalProps
             }, key),

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mtes-mct/monitor-ui",
   "description": "Common React components, hooks, utilities and CSS stylesheets for MonitorFish, MonitorEnv and RapportNav.",
-  "version": "24.11.0",
+  "version": "24.11.2",
   "license": "AGPL-3.0",
   "type": "module",
   "engines": {
@@ -9,7 +9,7 @@
   },
   "dependencies": {
     "@babel/runtime": "7.26.0",
-    "@tanstack/react-table": "8.20.5",
+    "@tanstack/react-table": "8.20.6",
     "@tanstack/react-virtual": "beta",
     "prop-types": "15.8.1",
     "tslib": "2.8.1"

package/symbols/Dot.d.ts

@@ -3,5 +3,5 @@ export type DotProps = {
     $borderColor?: string;
     $size?: number;
 };
-export declare const Dot: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, DotProps, never>;
+export declare const Dot: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, DotProps>> & string;
 //# sourceMappingURL=Dot.d.ts.map

package/symbols/Dot.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Dot.d.ts","sourceRoot":"","sources":["../../src/symbols/Dot.tsx"],"names":[],"mappings":"AAEA,MAAM,MAAM,QAAQ,GAAG;IACrB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AACD,eAAO,MAAM,GAAG,gHAWf,CAAA"}
+{"version":3,"file":"Dot.d.ts","sourceRoot":"","sources":["../../src/symbols/Dot.tsx"],"names":[],"mappings":"AAEA,MAAM,MAAM,QAAQ,GAAG;IACrB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AACD,eAAO,MAAM,GAAG,+OAWf,CAAA"}

package/symbols/ExclamationPoint.d.ts

@@ -4,5 +4,5 @@ export type ExclamationPointProps = HTMLAttributes<HTMLSpanElement> & {
     color?: string | undefined;
     size?: number;
 };
-export declare const ExclamationPoint: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, ExclamationPointProps, never>;
+export declare const ExclamationPoint: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, ExclamationPointProps>> & string;
 //# sourceMappingURL=ExclamationPoint.d.ts.map

package/symbols/ExclamationPoint.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExclamationPoint.d.ts","sourceRoot":"","sources":["../../src/symbols/ExclamationPoint.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAG3C,MAAM,MAAM,qBAAqB,GAAG,cAAc,CAAC,eAAe,CAAC,GAAG;IACpE,eAAe,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IACpC,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAA;AAID,eAAO,MAAM,gBAAgB,6HAgB5B,CAAA"}
+{"version":3,"file":"ExclamationPoint.d.ts","sourceRoot":"","sources":["../../src/symbols/ExclamationPoint.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAG3C,MAAM,MAAM,qBAAqB,GAAG,cAAc,CAAC,eAAe,CAAC,GAAG;IACpE,eAAe,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IACpC,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAA;AAID,eAAO,MAAM,gBAAgB,4OAgB5B,CAAA"}

package/tables/DataTable/SortingIcon.d.ts

@@ -1,4 +1,4 @@
-export declare const SortingIcon: import("styled-components").StyledComponent<any, import("styled-components").DefaultTheme, {
+export declare const SortingIcon: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<any, {
     $isDescending?: boolean;
-}, string | number | symbol>;
+}>> & (string | (string & Omit<any, keyof import("react").Component<any, {}, any>>));
 //# sourceMappingURL=SortingIcon.d.ts.map

package/tables/DataTable/SortingIcon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SortingIcon.d.ts","sourceRoot":"","sources":["../../../src/tables/DataTable/SortingIcon.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,WAAW;oBACN,OAAO;4BASxB,CAAA"}
+{"version":3,"file":"SortingIcon.d.ts","sourceRoot":"","sources":["../../../src/tables/DataTable/SortingIcon.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,WAAW;oBACN,OAAO;oFASxB,CAAA"}

package/tables/SimpleTable/CellLoader.d.ts

@@ -1,2 +1,2 @@
-export declare const CellLoader: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+export declare const CellLoader: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 //# sourceMappingURL=CellLoader.d.ts.map

package/tables/SimpleTable/CellLoader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CellLoader.d.ts","sourceRoot":"","sources":["../../../src/tables/SimpleTable/CellLoader.tsx"],"names":[],"mappings":"AAWA,eAAO,MAAM,UAAU,yGAiBtB,CAAA"}
+{"version":3,"file":"CellLoader.d.ts","sourceRoot":"","sources":["../../../src/tables/SimpleTable/CellLoader.tsx"],"names":[],"mappings":"AAWA,eAAO,MAAM,UAAU,6NAiBtB,CAAA"}

package/tables/SimpleTable/Td.d.ts

@@ -1,6 +1,10 @@
 import type { TdHTMLAttributes } from 'react';
-export declare const Td: import("styled-components").StyledComponent<"td", import("styled-components").DefaultTheme, TdHTMLAttributes<HTMLTableCellElement> & {
+type TdProps = TdHTMLAttributes<HTMLTableCellElement> & {
     $isCenter?: boolean | undefined;
     $isLoading?: boolean | undefined;
-}, keyof TdHTMLAttributes<HTMLTableCellElement> | "$isCenter" | "$isLoading">;
+};
+export declare const Td: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<TdHTMLAttributes<HTMLTableDataCellElement>, HTMLTableDataCellElement>, Omit<import("react").DetailedHTMLProps<TdHTMLAttributes<HTMLTableDataCellElement>, HTMLTableDataCellElement>, "ref"> & {
+    ref?: ((instance: HTMLTableDataCellElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLTableDataCellElement> | null | undefined;
+}>, TdProps>, never>> & string;
+export {};
 //# sourceMappingURL=Td.d.ts.map

package/tables/SimpleTable/Td.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Td.d.ts","sourceRoot":"","sources":["../../../src/tables/SimpleTable/Td.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,OAAO,CAAA;AAM7C,eAAO,MAAM,EAAE;gBAHD,OAAO,GAAG,SAAS;iBAClB,OAAO,GAAG,SAAS;6EAyBjC,CAAA"}
+{"version":3,"file":"Td.d.ts","sourceRoot":"","sources":["../../../src/tables/SimpleTable/Td.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,OAAO,CAAA;AAE7C,KAAK,OAAO,GAAG,gBAAgB,CAAC,oBAAoB,CAAC,GAAG;IACtD,SAAS,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;IAC/B,UAAU,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;CACjC,CAAA;AACD,eAAO,MAAM,EAAE;;8BAuBd,CAAA"}