josenanodev-react-components-library 0.0.24 → 0.0.26

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.
Files changed (9) hide show
  1. package/dist/cjs/components/Multicalendar/Multicalendar.d.ts +1 -1
  2. package/dist/cjs/components/Multicalendar/Multicalendar.js +16 -1
  3. package/dist/cjs/components/Multicalendar/types.d.ts +1 -0
  4. package/dist/cjs/components/SearchBar/SearchBar.js +0 -13
  5. package/dist/esm/components/Multicalendar/Multicalendar.d.ts +1 -1
  6. package/dist/esm/components/Multicalendar/Multicalendar.js +16 -1
  7. package/dist/esm/components/Multicalendar/types.d.ts +1 -0
  8. package/dist/esm/components/SearchBar/SearchBar.js +1 -14
  9. package/package.json +1 -1
package/dist/cjs/components/Multicalendar/Multicalendar.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  /// <reference types="react" />
2
2
  import "./Multicalendar.css";
3
3
  import { MulticalendarPropsType } from "./types";
4
- declare const Multicalendar: ({ multicalendarId, ReactCellChildren, ReactListElementChildren, listElementsIdsArray, language, pastDatesVisible, cellsWidth, cellsHeight, verticalAxisWidth, horizontalAxisHeight, pastDaysInitialQuantity, futureDaysInitialQuantity, chunkRenderX, chunkRenderY, dynamicDaysQuantity, draggingOverDateCells, waitTimeForCalls, callsOnScrollingMoves, callsOnScrollingStops, aditionalControlsComponents, upperLeftComponent, }: MulticalendarPropsType) => JSX.Element;
4
+ declare const Multicalendar: ({ multicalendarId, ReactCellChildren, ReactListElementChildren, listElementsIdsArray, language, pastDatesVisible, cellsWidth, cellsHeight, verticalAxisWidth, horizontalAxisHeight, pastDaysInitialQuantity, futureDaysInitialQuantity, chunkRenderX, chunkRenderY, dynamicDaysQuantity, draggingOverDateCells, waitTimeForCalls, callsOnInitialView, callsOnScrollingMoves, callsOnScrollingStops, aditionalControlsComponents, upperLeftComponent, }: MulticalendarPropsType) => JSX.Element;
5
5
  export default Multicalendar;
package/dist/cjs/components/Multicalendar/Multicalendar.js CHANGED
@@ -42,7 +42,7 @@ const useWindowsSize_1 = __importDefault(require("../../hooks/useWindowsSize"));
42
42
  const sqlToJsDate_1 = __importDefault(require("../../utils/sqlToJsDate"));
43
43
  //Services
44
44
  const MulticalendarStatesAndSettings_1 = require("../../Services/MulticalendarStatesAndSettings");
45
- const Multicalendar = ({ multicalendarId, ReactCellChildren, ReactListElementChildren, listElementsIdsArray, language, pastDatesVisible = true, cellsWidth = 120, cellsHeight = 80, verticalAxisWidth = 280, horizontalAxisHeight = 148, pastDaysInitialQuantity = 365, futureDaysInitialQuantity = 365, chunkRenderX = 0, chunkRenderY = 0, dynamicDaysQuantity = false, draggingOverDateCells = false, waitTimeForCalls = 500, callsOnScrollingMoves, callsOnScrollingStops, aditionalControlsComponents, upperLeftComponent, }) => {
45
+ const Multicalendar = ({ multicalendarId, ReactCellChildren, ReactListElementChildren, listElementsIdsArray, language, pastDatesVisible = true, cellsWidth = 120, cellsHeight = 80, verticalAxisWidth = 280, horizontalAxisHeight = 148, pastDaysInitialQuantity = 365, futureDaysInitialQuantity = 365, chunkRenderX = 0, chunkRenderY = 0, dynamicDaysQuantity = false, draggingOverDateCells = false, waitTimeForCalls = 500, callsOnInitialView, callsOnScrollingMoves, callsOnScrollingStops, aditionalControlsComponents, upperLeftComponent, }) => {
46
46
  //Constantes del componente
47
47
  const origin = {
48
48
  x: pastDatesVisible ? Math.ceil(pastDaysInitialQuantity) * cellsWidth : 0,
@@ -55,6 +55,7 @@ const Multicalendar = ({ multicalendarId, ReactCellChildren, ReactListElementChi
55
55
  const gridWrapperRef = (0, react_1.useRef)(null);
56
56
  //Estados
57
57
  const [firtsCall, setFirtsCall] = (0, react_1.useState)(false);
58
+ const [firtsCallOnInitialViewDone, setFirtsCallOnInitialViewDone] = (0, react_1.useState)(false);
58
59
  const [windowWidth, windowHeight] = (0, useWindowsSize_1.default)();
59
60
  const [futureDaysQuantity, setFutureDaysQuantity] = (0, react_1.useState)(Math.ceil(futureDaysInitialQuantity));
60
61
  const [pastDaysQuantity, setPastDaysQuantity] = (0, react_1.useState)(pastDatesVisible ? Math.ceil(pastDaysInitialQuantity) : 0);
@@ -99,6 +100,20 @@ const Multicalendar = ({ multicalendarId, ReactCellChildren, ReactListElementChi
99
100
  }
100
101
  }
101
102
  }, [firtsCall]);
103
+ (0, react_1.useEffect)(() => {
104
+ if (!firtsCallOnInitialViewDone &&
105
+ visibleListElementsIds.length > 0 &&
106
+ visibleDates.length > 0 &&
107
+ callsOnInitialView) {
108
+ setFirtsCallOnInitialViewDone(true);
109
+ callsOnInitialView(visibleListElementsIds, visibleDates);
110
+ }
111
+ }, [
112
+ firtsCallOnInitialViewDone,
113
+ visibleListElementsIds,
114
+ visibleDates,
115
+ callsOnInitialView,
116
+ ]);
102
117
  (0, react_1.useEffect)(() => {
103
118
  // Posicionamiento inicial en X
104
119
  if (gridWrapperRef.current !== null) {
package/dist/cjs/components/Multicalendar/types.d.ts CHANGED
@@ -18,6 +18,7 @@ export interface MulticalendarPropsType {
18
18
  draggingOverDateCells?: boolean;
19
19
  dynamicDaysQuantity?: boolean;
20
20
  waitTimeForCalls?: number;
21
+ callsOnInitialView?: (visibleIds: string[] | number[], visibleDates: Date[]) => void;
21
22
  callsOnScrollingMoves?: (visibleIds: string[] | number[], visibleDates: Date[]) => void;
22
23
  callsOnScrollingStops?: (visibleIds: string[] | number[], visibleDates: Date[]) => void;
23
24
  aditionalControlsComponents?: JSX.Element | JSX.Element[]
package/dist/cjs/components/SearchBar/SearchBar.js CHANGED
@@ -30,19 +30,6 @@ const bs_1 = require("react-icons/bs");
30
30
  const SearchBar = ({ actionOnEnter = () => { }, actionOnAlteringText = () => { }, actionOnEmptyText = () => { }, optionsButtonVisible, actionOnClickOptionsButton = () => { }, placeholder = "", initialValue = "", disabled = false, }) => {
31
31
  //Estados
32
32
  const [searchValue, setSearchValue] = (0, react_1.useState)(initialValue);
33
- const [cachedSearchValue, setCachedSearchValue] = (0, react_1.useState)(initialValue);
34
- //useEffect
35
- (0, react_1.useEffect)(() => {
36
- if (searchValue !== cachedSearchValue) {
37
- if (searchValue !== "") {
38
- actionOnAlteringText(searchValue);
39
- }
40
- else if (searchValue === "") {
41
- actionOnEmptyText();
42
- }
43
- setCachedSearchValue(searchValue);
44
- }
45
- }, [searchValue, cachedSearchValue, actionOnAlteringText, actionOnEmptyText]);
46
33
  return (react_1.default.createElement("form", { className: "search-bar", onSubmit: (e) => {
47
34
  e.preventDefault();
48
35
  let searchElement = e.target.elements.namedItem("search-bar-name");
package/dist/esm/components/Multicalendar/Multicalendar.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  /// <reference types="react" />
2
2
  import "./Multicalendar.css";
3
3
  import { MulticalendarPropsType } from "./types";
4
- declare const Multicalendar: ({ multicalendarId, ReactCellChildren, ReactListElementChildren, listElementsIdsArray, language, pastDatesVisible, cellsWidth, cellsHeight, verticalAxisWidth, horizontalAxisHeight, pastDaysInitialQuantity, futureDaysInitialQuantity, chunkRenderX, chunkRenderY, dynamicDaysQuantity, draggingOverDateCells, waitTimeForCalls, callsOnScrollingMoves, callsOnScrollingStops, aditionalControlsComponents, upperLeftComponent, }: MulticalendarPropsType) => JSX.Element;
4
+ declare const Multicalendar: ({ multicalendarId, ReactCellChildren, ReactListElementChildren, listElementsIdsArray, language, pastDatesVisible, cellsWidth, cellsHeight, verticalAxisWidth, horizontalAxisHeight, pastDaysInitialQuantity, futureDaysInitialQuantity, chunkRenderX, chunkRenderY, dynamicDaysQuantity, draggingOverDateCells, waitTimeForCalls, callsOnInitialView, callsOnScrollingMoves, callsOnScrollingStops, aditionalControlsComponents, upperLeftComponent, }: MulticalendarPropsType) => JSX.Element;
5
5
  export default Multicalendar;
package/dist/esm/components/Multicalendar/Multicalendar.js CHANGED
@@ -14,7 +14,7 @@ import useWindowSize from "../../hooks/useWindowsSize";
14
14
  import sqlToJsDate from "../../utils/sqlToJsDate";
15
15
  //Services
16
16
  import { eraseMulticalendarYScrollPosition, getMulticalendarYScrollPosition, } from "../../Services/MulticalendarStatesAndSettings";
17
- const Multicalendar = ({ multicalendarId, ReactCellChildren, ReactListElementChildren, listElementsIdsArray, language, pastDatesVisible = true, cellsWidth = 120, cellsHeight = 80, verticalAxisWidth = 280, horizontalAxisHeight = 148, pastDaysInitialQuantity = 365, futureDaysInitialQuantity = 365, chunkRenderX = 0, chunkRenderY = 0, dynamicDaysQuantity = false, draggingOverDateCells = false, waitTimeForCalls = 500, callsOnScrollingMoves, callsOnScrollingStops, aditionalControlsComponents, upperLeftComponent, }) => {
17
+ const Multicalendar = ({ multicalendarId, ReactCellChildren, ReactListElementChildren, listElementsIdsArray, language, pastDatesVisible = true, cellsWidth = 120, cellsHeight = 80, verticalAxisWidth = 280, horizontalAxisHeight = 148, pastDaysInitialQuantity = 365, futureDaysInitialQuantity = 365, chunkRenderX = 0, chunkRenderY = 0, dynamicDaysQuantity = false, draggingOverDateCells = false, waitTimeForCalls = 500, callsOnInitialView, callsOnScrollingMoves, callsOnScrollingStops, aditionalControlsComponents, upperLeftComponent, }) => {
18
18
  //Constantes del componente
19
19
  const origin = {
20
20
  x: pastDatesVisible ? Math.ceil(pastDaysInitialQuantity) * cellsWidth : 0,
@@ -27,6 +27,7 @@ const Multicalendar = ({ multicalendarId, ReactCellChildren, ReactListElementChi
27
27
  const gridWrapperRef = useRef(null);
28
28
  //Estados
29
29
  const [firtsCall, setFirtsCall] = useState(false);
30
+ const [firtsCallOnInitialViewDone, setFirtsCallOnInitialViewDone] = useState(false);
30
31
  const [windowWidth, windowHeight] = useWindowSize();
31
32
  const [futureDaysQuantity, setFutureDaysQuantity] = useState(Math.ceil(futureDaysInitialQuantity));
32
33
  const [pastDaysQuantity, setPastDaysQuantity] = useState(pastDatesVisible ? Math.ceil(pastDaysInitialQuantity) : 0);
@@ -71,6 +72,20 @@ const Multicalendar = ({ multicalendarId, ReactCellChildren, ReactListElementChi
71
72
  }
72
73
  }
73
74
  }, [firtsCall]);
75
+ useEffect(() => {
76
+ if (!firtsCallOnInitialViewDone &&
77
+ visibleListElementsIds.length > 0 &&
78
+ visibleDates.length > 0 &&
79
+ callsOnInitialView) {
80
+ setFirtsCallOnInitialViewDone(true);
81
+ callsOnInitialView(visibleListElementsIds, visibleDates);
82
+ }
83
+ }, [
84
+ firtsCallOnInitialViewDone,
85
+ visibleListElementsIds,
86
+ visibleDates,
87
+ callsOnInitialView,
88
+ ]);
74
89
  useEffect(() => {
75
90
  // Posicionamiento inicial en X
76
91
  if (gridWrapperRef.current !== null) {
package/dist/esm/components/Multicalendar/types.d.ts CHANGED
@@ -18,6 +18,7 @@ export interface MulticalendarPropsType {
18
18
  draggingOverDateCells?: boolean;
19
19
  dynamicDaysQuantity?: boolean;
20
20
  waitTimeForCalls?: number;
21
+ callsOnInitialView?: (visibleIds: string[] | number[], visibleDates: Date[]) => void;
21
22
  callsOnScrollingMoves?: (visibleIds: string[] | number[], visibleDates: Date[]) => void;
22
23
  callsOnScrollingStops?: (visibleIds: string[] | number[], visibleDates: Date[]) => void;
23
24
  aditionalControlsComponents?: JSX.Element | JSX.Element[]
package/dist/esm/components/SearchBar/SearchBar.js CHANGED
@@ -1,23 +1,10 @@
1
- import React, { useState, useEffect } from "react";
1
+ import React, { useState } from "react";
2
2
  import "./SearchBar.css";
3
3
  //Icons
4
4
  import { BsSearch, BsSliders } from "react-icons/bs";
5
5
  const SearchBar = ({ actionOnEnter = () => { }, actionOnAlteringText = () => { }, actionOnEmptyText = () => { }, optionsButtonVisible, actionOnClickOptionsButton = () => { }, placeholder = "", initialValue = "", disabled = false, }) => {
6
6
  //Estados
7
7
  const [searchValue, setSearchValue] = useState(initialValue);
8
- const [cachedSearchValue, setCachedSearchValue] = useState(initialValue);
9
- //useEffect
10
- useEffect(() => {
11
- if (searchValue !== cachedSearchValue) {
12
- if (searchValue !== "") {
13
- actionOnAlteringText(searchValue);
14
- }
15
- else if (searchValue === "") {
16
- actionOnEmptyText();
17
- }
18
- setCachedSearchValue(searchValue);
19
- }
20
- }, [searchValue, cachedSearchValue, actionOnAlteringText, actionOnEmptyText]);
21
8
  return (React.createElement("form", { className: "search-bar", onSubmit: (e) => {
22
9
  e.preventDefault();
23
10
  let searchElement = e.target.elements.namedItem("search-bar-name");
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "josenanodev-react-components-library",
3
- "version": "0.0.24",
3
+ "version": "0.0.26",
4
4
  "author": {
5
5
  "name": "Jose Carlos Cardenas Martinez"
6
6
  },