Specify exact versions of new packages, add missing return type on FilterBar components, format linked doc file

Author: michaelmaillot

docs/documentation/docs/controls/FilterBar.md

@@ -79,10 +79,10 @@ The `FilterBar` control can be configured with the following properties:
 | onRemoveFilter | (label: string, value: string) => void | no | Callback function called after clicking a singular filter pill | |
 
 ## IFilterBarItem
-| Property | Type | Required | Description | Default |
-| ---- | ---- | ---- | ---- | ---- |
-| label | string | yes | Filter label | |
-| value | string | yes | Filter value | |
 
+| Property | Type   | Required | Description  | Default |
+| -------- | ------ | -------- | ------------ | ------- |
+| label    | string | yes      | Filter label |         |
+| value    | string | yes      | Filter value |         |
 
 ![](https://telemetry.sharepointpnp.com/sp-dev-fx-controls-react/wiki/controls/FilterBar)

package-lock.json

@@ -36,7 +36,7 @@
     "@fluentui/styles": "0.66.5",
     "@fluentui/theme": "^2.6.6",
     "@iconify/react": "^4.1.1",
-    "@juggle/resize-observer": "^3.4.0",
+    "@juggle/resize-observer": "3.4.0",
     "@microsoft/decorators": "1.20.0",
     "@microsoft/mgt-react": "3.1.3",
     "@microsoft/mgt-spfx": "3.1.3",
@@ -55,7 +55,7 @@
     "@microsoft/sp-property-pane": "1.20.0",
     "@microsoft/sp-webpart-base": "1.20.0",
     "@monaco-editor/loader": "^1.3.1",
-    "@nuvemerudita/react-controls": "^1.0.0",
+    "@nuvemerudita/react-controls": "1.0.0",
     "@pnp/common": "2.5.0",
     "@pnp/odata": "2.5.0",
     "@pnp/sp": "2.5.0",

package.json

@@ -31,7 +31,7 @@ export interface IFilterPillBarProps {
 
 export const FilterBar: React.FunctionComponent<IFilterPillBarProps> = (props: IFilterPillBarProps) => {
 
-    const orderedArray = (arr: IFilterBarItem[]) => {
+    const orderedArray = (arr: IFilterBarItem[]): IFilterBarItem[] => {
         const ret: IFilterBarItem[] = [];
         arr.map(i => {
             const index = findLastIndex(ret, r => r.label === i.label);
@@ -65,14 +65,14 @@ export const FilterBar: React.FunctionComponent<IFilterPillBarProps> = (props: I
         return acc;
     }, []);
 
-    const clearAll = () => {
+    const clearAll = (): void => {
 
         if (props.onClearFilters) {
             props.onClearFilters();
         }
     }
 
-    const pillClick = (label?: string, value?: string) => {
+    const pillClick = (label?: string, value?: string): void => {
         console.log(label, value);
         if (props.onRemoveFilter) {
             props.onRemoveFilter(label as string, value as string);

src/controls/filterBar/FilterlBar.tsx

@@ -12,15 +12,15 @@ export interface IOverflowPillProps  {
     items: IFilterBarItemGroup[];
 }
 
-export const OverflowPill = (props: IOverflowPillProps) => {
+export const OverflowPill = (props: IOverflowPillProps): JSX.Element => {
     const [overlayVisible, {toggle: toggleOverlayVisible}] = useBoolean(false);
     const divId = useId('callout-div');
 
     const onClick: React.MouseEventHandler<HTMLDivElement> = (event) => {
         toggleOverlayVisible();
     } 
 
-    const pillClick = (label, value) => {
+    const pillClick = (label, value): void => {
         if (props.onClick)
         {
             props.onClick(label, value);

src/controls/filterBar/OverflowPill.tsx

@@ -10,15 +10,16 @@ export interface IPillProps  {
     value?: string;
     field?: string;
 }
-export const Pill = (props: IPillProps) => {
+export const Pill = (props: IPillProps): JSX.Element => {
 
-    const onClick = (event) => {
+    const onClick = (event): void => {
         if (props.onClick)
         {
             props.onClick(props.field, props.value);
         }
     }
 
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     const buttonProps: any = {
         title: props.clearAll ? strings.ClearAllFiltersTitle: strings.ClearFilterTitle,
         className: `${styles.pill} ${props.clearAll ? `${styles.pill} ${styles.clearAll}` : ""}`,

src/controls/filterBar/Pill.tsx

@@ -10,7 +10,7 @@ export interface IPillGroupProps {
 
 export const PillGroup: React.FunctionComponent<IPillGroupProps> = (props) => {
 
-    const onClick = (label, value) => {
+    const onClick = (label, value): void => {
         if (props.onRemoveFilter)
         {
             props.onRemoveFilter(label, value);