@mtes-mct/monitor-ui 2.1.0 → 2.2.0

package/CHANGELOG.md

@@ -1,3 +1,18 @@
+## [2.1.1](https://github.com/MTES-MCT/monitor-ui/compare/v2.1.0...v2.1.1) (2022-12-15)
+
+
+### Bug Fixes
+
+* **formiks:** remove set undefined on destruction ([#137](https://github.com/MTES-MCT/monitor-ui/issues/137)) ([fd375ae](https://github.com/MTES-MCT/monitor-ui/commit/fd375aec5047ba3aad31237bec4863f56fb1043f))
+
+# [2.1.0](https://github.com/MTES-MCT/monitor-ui/compare/v2.0.0...v2.1.0) (2022-12-15)
+
+
+### Features
+
+* **elements:** add isLight & hasBorder props to Fieldset ([#134](https://github.com/MTES-MCT/monitor-ui/issues/134)) ([761ea73](https://github.com/MTES-MCT/monitor-ui/commit/761ea733f1441c32986b64f2ad6be4541073a485))
+* **fields:** add MultiZoneEditor ([#135](https://github.com/MTES-MCT/monitor-ui/issues/135)) ([8a3d653](https://github.com/MTES-MCT/monitor-ui/commit/8a3d6537484f8a0b85289f6903e5567cdef0673b))
+
 # [2.0.0](https://github.com/MTES-MCT/monitor-ui/compare/v1.14.0...v2.0.0) (2022-12-14)
 
 

package/elements/Label.d.ts

@@ -1,6 +1,6 @@
 import type { LabelHTMLAttributes } from 'react';
 export type LabelProps = LabelHTMLAttributes<HTMLLabelElement> & {
-    isHidden: boolean;
+    isHidden?: boolean;
 };
 export declare const Label: import("styled-components").StyledComponent<"label", import("styled-components").DefaultTheme, {
     isHidden?: boolean | undefined;

package/elements/TagGroup.d.ts

@@ -0,0 +1,3 @@
+import type { HTMLAttributes } from 'react';
+export type TagGroupProps = HTMLAttributes<HTMLDivElement>;
+export declare const TagGroup: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;

package/index.d.ts

@@ -10,6 +10,7 @@ export { IconButton } from './elements/IconButton';
 export { Label } from './elements/Label';
 export { Legend } from './elements/Legend';
 export { Tag } from './elements/Tag';
+export { TagGroup } from './elements/TagGroup';
 export { AutoComplete } from './fields/AutoComplete';
 export { Checkbox } from './fields/Checkbox';
 export { DateRangePicker } from './fields/DateRangePicker';
@@ -43,6 +44,7 @@ export type { IconButtonProps } from './elements/IconButton';
 export type { LabelProps } from './elements/Label';
 export type { LegendProps } from './elements/Legend';
 export type { TagProps } from './elements/Tag';
+export type { TagGroupProps } from './elements/TagGroup';
 export type { AutoCompleteProps } from './fields/AutoComplete';
 export type { CheckboxProps } from './fields/Checkbox';
 export type { DateRangePickerProps } from './fields/DateRangePicker';

package/index.js

@@ -1679,6 +1679,7 @@ const Box$7 = styled.span `
   color: ${p => (p.$color ? p.$color : p.theme.color.gunMetal)};
   display: inline-flex;
   font-size: 13px;
+  line-height: 1.4;
   padding: 1px 8px 3px 8px;
 
   /* Bullet components are a span */
@@ -1707,6 +1708,14 @@ const TertiaryTag = styled(Box$7) `
   color: ${p => p.theme.color.white};
 `;
 
+const TagGroup = styled.div `
+  display: flex;
+
+  > span:not(:first-child) {
+    margin-left: 8px;
+  }
+`;
+
 // eslint-lint-disable-next-line @typescript-eslint/naming-convention
 class HTTPError extends Error {
     constructor(response, request, options) {
@@ -4851,36 +4860,20 @@ function FormikAutoComplete({ name, ...originalProps }) {
     const [field, , helpers] = useField(name);
     // eslint-disable-next-line react-hooks/exhaustive-deps, @typescript-eslint/naming-convention
     const defaultValue = useMemo(() => field.value, []);
-    const handleChange = useCallback((nextValue) => {
-        helpers.setValue(nextValue);
-    }, 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    []);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    useEffect(() => () => helpers.setValue(undefined), []);
-    return jsx(AutoComplete, { defaultValue: defaultValue, name: name, onChange: handleChange, ...originalProps });
+    return jsx(AutoComplete, { defaultValue: defaultValue, name: name, onChange: helpers.setValue, ...originalProps });
 }
 
 function FormikCheckbox({ name, ...originalProps }) {
     const [field, , helpers] = useField(name);
     // eslint-disable-next-line react-hooks/exhaustive-deps, @typescript-eslint/naming-convention
     const defaultChecked = useMemo(() => Boolean(field.value), []);
-    const handleChange = useCallback((isChecked) => {
-        helpers.setValue(isChecked);
-    }, 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    []);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    useEffect(() => () => helpers.setValue(undefined), []);
-    return jsx(Checkbox, { defaultChecked: defaultChecked, name: name, onChange: handleChange, ...originalProps });
+    return jsx(Checkbox, { defaultChecked: defaultChecked, name: name, onChange: helpers.setValue, ...originalProps });
 }
 
 function FormikDatePicker({ name, ...originalProps }) {
     const [field, , helpers] = useField(name);
     // eslint-disable-next-line react-hooks/exhaustive-deps
     const defaultValue = useMemo(() => field.value, []);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    useEffect(() => () => helpers.setValue(undefined), []);
     return jsx(DatePicker, { defaultValue: defaultValue, onChange: helpers.setValue, ...originalProps });
 }
 
@@ -4888,8 +4881,6 @@ function FormikDateRangePicker({ name, ...originalProps }) {
     const [field, , helpers] = useField(name);
     // eslint-disable-next-line react-hooks/exhaustive-deps
     const defaultValue = useMemo(() => field.value, []);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    useEffect(() => () => helpers.setValue(undefined), []);
     return jsx(DateRangePicker, { defaultValue: defaultValue, onChange: helpers.setValue, ...originalProps });
 }
 
@@ -4905,85 +4896,43 @@ function FormikMultiCheckbox({ name, ...originalProps }) {
     const [field, , helpers] = useField(name);
     // eslint-disable-next-line react-hooks/exhaustive-deps
     const defaultValue = useMemo(() => field.value, []);
-    const handleChange = useCallback((nextValue) => {
-        helpers.setValue(nextValue);
-    }, 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    []);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    useEffect(() => () => helpers.setValue(undefined), []);
-    return jsx(MultiCheckbox, { defaultValue: defaultValue, name: name, onChange: handleChange, ...originalProps });
+    return jsx(MultiCheckbox, { defaultValue: defaultValue, name: name, onChange: helpers.setValue, ...originalProps });
 }
 
 function FormikMultiSelect({ name, ...originalProps }) {
     const [field, , helpers] = useField(name);
     // eslint-disable-next-line react-hooks/exhaustive-deps
     const defaultValue = useMemo(() => field.value, []);
-    const handleChange = useCallback((nextValue) => {
-        helpers.setValue(nextValue);
-    }, 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    []);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    useEffect(() => () => helpers.setValue(undefined), []);
-    return jsx(MultiSelect, { defaultValue: defaultValue, name: name, onChange: handleChange, ...originalProps });
+    return jsx(MultiSelect, { defaultValue: defaultValue, name: name, onChange: helpers.setValue, ...originalProps });
 }
 
 function FormikMultiRadio({ name, ...originalProps }) {
     const [field, , helpers] = useField(name);
     // eslint-disable-next-line react-hooks/exhaustive-deps
     const defaultValue = useMemo(() => field.value, []);
-    const handleChange = useCallback((nextValue) => {
-        helpers.setValue(nextValue);
-    }, 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    []);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    useEffect(() => () => helpers.setValue(undefined), []);
-    return jsx(MultiRadio, { defaultValue: defaultValue, name: name, onChange: handleChange, ...originalProps });
+    return jsx(MultiRadio, { defaultValue: defaultValue, name: name, onChange: helpers.setValue, ...originalProps });
 }
 
 function FormikSelect({ name, ...originalProps }) {
     const [field, , helpers] = useField(name);
     // eslint-disable-next-line react-hooks/exhaustive-deps
     const defaultValue = useMemo(() => field.value, []);
-    const handleChange = useCallback((nextValue) => {
-        helpers.setValue(nextValue);
-    }, 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    []);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    useEffect(() => () => helpers.setValue(undefined), []);
-    return jsx(Select, { defaultValue: defaultValue, name: name, onChange: handleChange, ...originalProps });
+    return jsx(Select, { defaultValue: defaultValue, name: name, onChange: helpers.setValue, ...originalProps });
 }
 
 function FormikTextarea({ name, ...originalProps }) {
     const [field, , helpers] = useField(name);
     // eslint-disable-next-line react-hooks/exhaustive-deps
     const defaultValue = useMemo(() => field.value, []);
-    const handleChange = useCallback((nextValue) => {
-        helpers.setValue(nextValue);
-    }, 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    []);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    useEffect(() => () => helpers.setValue(undefined), []);
-    return jsx(Textarea, { defaultValue: defaultValue, name: name, onChange: handleChange, ...originalProps });
+    return jsx(Textarea, { defaultValue: defaultValue, name: name, onChange: helpers.setValue, ...originalProps });
 }
 
 function FormikTextInput({ name, ...originalProps }) {
     const [field, , helpers] = useField(name);
     // eslint-disable-next-line react-hooks/exhaustive-deps
     const defaultValue = useMemo(() => field.value, []);
-    const handleChange = useCallback((nextValue) => {
-        helpers.setValue(nextValue);
-    }, 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    []);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    useEffect(() => () => helpers.setValue(undefined), []);
-    return jsx(TextInput, { defaultValue: defaultValue, name: name, onChange: handleChange, ...originalProps });
+    return jsx(TextInput, { defaultValue: defaultValue, name: name, onChange: helpers.setValue, ...originalProps });
 }
 
-export { Accent, AutoComplete, Button, Checkbox, DatePicker, DateRangePicker, Dropdown, Field$2 as Field, Fieldset, FormikAutoComplete, FormikCheckbox, FormikDatePicker, FormikDateRangePicker, FormikEffect, FormikMultiCheckbox, FormikMultiRadio, FormikMultiSelect, FormikSelect, FormikTextInput, FormikTextarea, GlobalStyle, index as Icon, IconButton, Label, Legend, MultiCheckbox, MultiRadio, MultiSelect, MultiZoneEditor, Select, Size, THEME, Tag$1 as Tag, TextInput, Textarea, ThemeProvider };
+export { Accent, AutoComplete, Button, Checkbox, DatePicker, DateRangePicker, Dropdown, Field$2 as Field, Fieldset, FormikAutoComplete, FormikCheckbox, FormikDatePicker, FormikDateRangePicker, FormikEffect, FormikMultiCheckbox, FormikMultiRadio, FormikMultiSelect, FormikSelect, FormikTextInput, FormikTextarea, GlobalStyle, index as Icon, IconButton, Label, Legend, MultiCheckbox, MultiRadio, MultiSelect, MultiZoneEditor, Select, Size, THEME, Tag$1 as Tag, TagGroup, TextInput, Textarea, ThemeProvider };
 //# sourceMappingURL=index.js.map