josenanodev-react-components-library 0.0.21 → 0.0.22

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
1
  /// <reference types="react" />
2
2
  import "./ParallelSelectionList.css";
3
3
  import { ParallelSelectionListPropsTypes } from "./types";
4
- declare const ParallelSelectionList: ({ dataList, applyAction, cancelAction, leftListTitle, rightListTitle, leftListApplyAllButtonText, rightListApplyAllButtonText, searchBarsVisible, applyButonText, cancelButtonText, preSelectedDatumsIds, listElementsHeight, }: ParallelSelectionListPropsTypes) => JSX.Element;
4
+ declare const ParallelSelectionList: ({ dataList, applyAction, cancelAction, onSelectionChange, leftListTitle, rightListTitle, leftListApplyAllButtonText, rightListApplyAllButtonText, searchBarsVisible, applyButonText, cancelButtonText, preSelectedDatumsIds, listElementsHeight, }: ParallelSelectionListPropsTypes) => JSX.Element;
5
5
  export default ParallelSelectionList;
@@ -10,7 +10,7 @@ require("./ParallelSelectionList.css");
10
10
  const bs_1 = require("react-icons/bs");
11
11
  //Hooks
12
12
  const useResizeObserver_1 = __importDefault(require("../../hooks/useResizeObserver"));
13
- const ParallelSelectionList = ({ dataList, applyAction, cancelAction, leftListTitle, rightListTitle, leftListApplyAllButtonText, rightListApplyAllButtonText, searchBarsVisible, applyButonText, cancelButtonText, preSelectedDatumsIds = [], listElementsHeight = 50, }) => {
13
+ const ParallelSelectionList = ({ dataList, applyAction, cancelAction, onSelectionChange, leftListTitle, rightListTitle, leftListApplyAllButtonText, rightListApplyAllButtonText, searchBarsVisible, applyButonText, cancelButtonText, preSelectedDatumsIds = [], listElementsHeight = 50, }) => {
14
14
  //Refs
15
15
  const leftListRef = (0, react_2.useRef)(null);
16
16
  const rightListRef = (0, react_2.useRef)(null);
@@ -36,6 +36,9 @@ const ParallelSelectionList = ({ dataList, applyAction, cancelAction, leftListTi
36
36
  }
37
37
  });
38
38
  setSelectedDatumsIds(selectedDatumsIdsClone);
39
+ if (onSelectionChange) {
40
+ onSelectionChange(selectedDatumsIdsClone);
41
+ }
39
42
  };
40
43
  const removeFromSelectedDatumsIds = (datumIdsArray) => {
41
44
  const selectedDatumsIdsClone = [...selectedDatumsIds];
@@ -45,6 +48,9 @@ const ParallelSelectionList = ({ dataList, applyAction, cancelAction, leftListTi
45
48
  }
46
49
  });
47
50
  setSelectedDatumsIds(selectedDatumsIdsClone);
51
+ if (onSelectionChange) {
52
+ onSelectionChange(selectedDatumsIdsClone);
53
+ }
48
54
  };
49
55
  //useEffects
50
56
  (0, react_2.useEffect)(() => {
@@ -2,6 +2,7 @@ export interface ParallelSelectionListPropsTypes {
2
2
  dataList: ListDatumType[];
3
3
  applyAction: (dataListId: ListDatumType["_id"][]) => void;
4
4
  cancelAction: Function;
5
+ onSelectionChange?: (dataListId: ListDatumType["_id"][]) => void;
5
6
  leftListTitle?: string;
6
7
  rightListTitle?: string;
7
8
  leftListApplyAllButtonText?: string;
@@ -1,6 +1,3 @@
1
1
  /// <reference types="react" />
2
- /**
3
- * Hook that alerts clicks outside of the passed ref
4
- */
5
2
  declare function useOutsideClick(elementRef: React.MutableRefObject<HTMLElement | null>, onOutsideClickAction: Function, elementsRefsExceptions?: React.MutableRefObject<HTMLElement | null>[]): void;
6
3
  export default useOutsideClick;
@@ -1,14 +1,8 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const react_1 = require("react");
4
- /**
5
- * Hook that alerts clicks outside of the passed ref
6
- */
7
4
  function useOutsideClick(elementRef, onOutsideClickAction, elementsRefsExceptions = []) {
8
5
  (0, react_1.useEffect)(() => {
9
- /**
10
- * Alert if clicked on outside of element
11
- */
12
6
  function handleClickOutside(event) {
13
7
  if (elementRef.current &&
14
8
  !elementRef.current.contains(event.target) &&
@@ -16,10 +10,8 @@ function useOutsideClick(elementRef, onOutsideClickAction, elementsRefsException
16
10
  onOutsideClickAction();
17
11
  }
18
12
  }
19
- // Bind the event listener
20
13
  document.addEventListener("mousedown", handleClickOutside);
21
14
  return () => {
22
- // Unbind the event listener on clean up
23
15
  document.removeEventListener("mousedown", handleClickOutside);
24
16
  };
25
17
  }, [elementRef, onOutsideClickAction, elementsRefsExceptions]);
@@ -1,5 +1,5 @@
1
1
  /// <reference types="react" />
2
2
  import "./ParallelSelectionList.css";
3
3
  import { ParallelSelectionListPropsTypes } from "./types";
4
- declare const ParallelSelectionList: ({ dataList, applyAction, cancelAction, leftListTitle, rightListTitle, leftListApplyAllButtonText, rightListApplyAllButtonText, searchBarsVisible, applyButonText, cancelButtonText, preSelectedDatumsIds, listElementsHeight, }: ParallelSelectionListPropsTypes) => JSX.Element;
4
+ declare const ParallelSelectionList: ({ dataList, applyAction, cancelAction, onSelectionChange, leftListTitle, rightListTitle, leftListApplyAllButtonText, rightListApplyAllButtonText, searchBarsVisible, applyButonText, cancelButtonText, preSelectedDatumsIds, listElementsHeight, }: ParallelSelectionListPropsTypes) => JSX.Element;
5
5
  export default ParallelSelectionList;
@@ -5,7 +5,7 @@ import "./ParallelSelectionList.css";
5
5
  import { BsChevronDoubleLeft, BsChevronDoubleRight, BsChevronLeft, BsChevronRight, BsSearch, } from "react-icons/bs";
6
6
  //Hooks
7
7
  import useResizeObserver from "../../hooks/useResizeObserver";
8
- const ParallelSelectionList = ({ dataList, applyAction, cancelAction, leftListTitle, rightListTitle, leftListApplyAllButtonText, rightListApplyAllButtonText, searchBarsVisible, applyButonText, cancelButtonText, preSelectedDatumsIds = [], listElementsHeight = 50, }) => {
8
+ const ParallelSelectionList = ({ dataList, applyAction, cancelAction, onSelectionChange, leftListTitle, rightListTitle, leftListApplyAllButtonText, rightListApplyAllButtonText, searchBarsVisible, applyButonText, cancelButtonText, preSelectedDatumsIds = [], listElementsHeight = 50, }) => {
9
9
  //Refs
10
10
  const leftListRef = useRef(null);
11
11
  const rightListRef = useRef(null);
@@ -31,6 +31,9 @@ const ParallelSelectionList = ({ dataList, applyAction, cancelAction, leftListTi
31
31
  }
32
32
  });
33
33
  setSelectedDatumsIds(selectedDatumsIdsClone);
34
+ if (onSelectionChange) {
35
+ onSelectionChange(selectedDatumsIdsClone);
36
+ }
34
37
  };
35
38
  const removeFromSelectedDatumsIds = (datumIdsArray) => {
36
39
  const selectedDatumsIdsClone = [...selectedDatumsIds];
@@ -40,6 +43,9 @@ const ParallelSelectionList = ({ dataList, applyAction, cancelAction, leftListTi
40
43
  }
41
44
  });
42
45
  setSelectedDatumsIds(selectedDatumsIdsClone);
46
+ if (onSelectionChange) {
47
+ onSelectionChange(selectedDatumsIdsClone);
48
+ }
43
49
  };
44
50
  //useEffects
45
51
  useEffect(() => {
@@ -2,6 +2,7 @@ export interface ParallelSelectionListPropsTypes {
2
2
  dataList: ListDatumType[];
3
3
  applyAction: (dataListId: ListDatumType["_id"][]) => void;
4
4
  cancelAction: Function;
5
+ onSelectionChange?: (dataListId: ListDatumType["_id"][]) => void;
5
6
  leftListTitle?: string;
6
7
  rightListTitle?: string;
7
8
  leftListApplyAllButtonText?: string;
@@ -1,6 +1,3 @@
1
1
  /// <reference types="react" />
2
- /**
3
- * Hook that alerts clicks outside of the passed ref
4
- */
5
2
  declare function useOutsideClick(elementRef: React.MutableRefObject<HTMLElement | null>, onOutsideClickAction: Function, elementsRefsExceptions?: React.MutableRefObject<HTMLElement | null>[]): void;
6
3
  export default useOutsideClick;
@@ -1,12 +1,6 @@
1
1
  import { useEffect } from "react";
2
- /**
3
- * Hook that alerts clicks outside of the passed ref
4
- */
5
2
  function useOutsideClick(elementRef, onOutsideClickAction, elementsRefsExceptions = []) {
6
3
  useEffect(() => {
7
- /**
8
- * Alert if clicked on outside of element
9
- */
10
4
  function handleClickOutside(event) {
11
5
  if (elementRef.current &&
12
6
  !elementRef.current.contains(event.target) &&
@@ -14,10 +8,8 @@ function useOutsideClick(elementRef, onOutsideClickAction, elementsRefsException
14
8
  onOutsideClickAction();
15
9
  }
16
10
  }
17
- // Bind the event listener
18
11
  document.addEventListener("mousedown", handleClickOutside);
19
12
  return () => {
20
- // Unbind the event listener on clean up
21
13
  document.removeEventListener("mousedown", handleClickOutside);
22
14
  };
23
15
  }, [elementRef, onOutsideClickAction, elementsRefsExceptions]);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "josenanodev-react-components-library",
3
- "version": "0.0.21",
3
+ "version": "0.0.22",
4
4
  "author": {
5
5
  "name": "Jose Carlos Cardenas Martinez"
6
6
  },