@factorearth/component-library 6.2.4-datefield.2 → 6.2.4-datefield.4
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.
|
@@ -8,7 +8,6 @@ interface DateFieldPickerProps {
|
|
|
8
8
|
value: string | null;
|
|
9
9
|
placeholder?: string;
|
|
10
10
|
moreHorizon?: React.JSX.Element;
|
|
11
|
-
headerRef?: React.RefObject<HTMLDivElement | null>;
|
|
12
11
|
}
|
|
13
|
-
export declare const DateFieldPicker: ({ colorPalette, handleBlur, handleChange, value, placeholder, moreHorizon
|
|
12
|
+
export declare const DateFieldPicker: ({ colorPalette, handleBlur, handleChange, value, placeholder, moreHorizon }: DateFieldPickerProps) => React.JSX.Element;
|
|
14
13
|
export {};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React, { useState,
|
|
1
|
+
import React, { useState, useEffect } from "react";
|
|
2
2
|
import styled from "@emotion/styled";
|
|
3
3
|
import { FiCalendar } from "react-icons/fi";
|
|
4
4
|
import DatePicker from "react-datepicker";
|
|
@@ -99,9 +99,9 @@ const DateFieldContainer = styled.div `
|
|
|
99
99
|
display: none;
|
|
100
100
|
}
|
|
101
101
|
`;
|
|
102
|
-
export const DateFieldPicker = ({ colorPalette, handleBlur, handleChange, value, placeholder, moreHorizon
|
|
102
|
+
export const DateFieldPicker = ({ colorPalette, handleBlur, handleChange, value, placeholder, moreHorizon }) => {
|
|
103
103
|
const [selectedDate, setSelectedDate] = useState(null);
|
|
104
|
-
const
|
|
104
|
+
const [open, setOpen] = useState(false);
|
|
105
105
|
useEffect(() => {
|
|
106
106
|
if (value) {
|
|
107
107
|
const date = new Date(value);
|
|
@@ -111,11 +111,6 @@ export const DateFieldPicker = ({ colorPalette, handleBlur, handleChange, value,
|
|
|
111
111
|
setSelectedDate(null);
|
|
112
112
|
}
|
|
113
113
|
}, [value]);
|
|
114
|
-
const handleIconClick = () => {
|
|
115
|
-
if (datePickerRef.current) {
|
|
116
|
-
datePickerRef.current.setOpen(true);
|
|
117
|
-
}
|
|
118
|
-
};
|
|
119
114
|
return (React.createElement(DateFieldContainer, { colorpalette: colorPalette },
|
|
120
115
|
React.createElement(DatePicker, { placeholderText: placeholder, selected: selectedDate, onChange: (date, e) => {
|
|
121
116
|
if (date && e?.type === "click") {
|
|
@@ -125,8 +120,7 @@ export const DateFieldPicker = ({ colorPalette, handleBlur, handleChange, value,
|
|
|
125
120
|
const dateString = `${year}-${month}-${day}`;
|
|
126
121
|
handleChange({ target: { value: dateString } });
|
|
127
122
|
setSelectedDate(date);
|
|
128
|
-
|
|
129
|
-
datePickerRef.current.setOpen(false);
|
|
123
|
+
setOpen(false);
|
|
130
124
|
}
|
|
131
125
|
if (e?.type === "change") {
|
|
132
126
|
let newValue = e?.target?.value;
|
|
@@ -144,36 +138,8 @@ export const DateFieldPicker = ({ colorPalette, handleBlur, handleChange, value,
|
|
|
144
138
|
console.log("Invalid date format");
|
|
145
139
|
}
|
|
146
140
|
}
|
|
147
|
-
}, onBlur: handleBlur,
|
|
148
|
-
|
|
149
|
-
name: "preventHeaderOverlap",
|
|
150
|
-
fn(state) {
|
|
151
|
-
if (!headerRef || !headerRef.current)
|
|
152
|
-
return state;
|
|
153
|
-
const headerRect = headerRef.current.getBoundingClientRect();
|
|
154
|
-
const proposedTop = state.y;
|
|
155
|
-
if (proposedTop < headerRect.bottom) {
|
|
156
|
-
const overlap = headerRect.bottom - proposedTop;
|
|
157
|
-
return {
|
|
158
|
-
...state,
|
|
159
|
-
y: proposedTop + overlap,
|
|
160
|
-
data: { adjusted: true }
|
|
161
|
-
};
|
|
162
|
-
}
|
|
163
|
-
return state;
|
|
164
|
-
},
|
|
165
|
-
},
|
|
166
|
-
{
|
|
167
|
-
name: "flip",
|
|
168
|
-
options: {
|
|
169
|
-
fallbackPlacements: ["bottom-start", "top-start"],
|
|
170
|
-
},
|
|
171
|
-
fn(state) {
|
|
172
|
-
return state;
|
|
173
|
-
}
|
|
174
|
-
}
|
|
175
|
-
] : undefined }),
|
|
176
|
-
React.createElement(DateIcon, { colorpalette: colorPalette, onClick: handleIconClick, morehorizon: moreHorizon ? "true" : "false" }),
|
|
141
|
+
}, onBlur: handleBlur, dateFormat: "yyyy-MM-dd", open: open }),
|
|
142
|
+
React.createElement(DateIcon, { colorpalette: colorPalette, onClick: () => setOpen(!open), morehorizon: moreHorizon ? "true" : "false" }),
|
|
177
143
|
moreHorizon && moreHorizon));
|
|
178
144
|
};
|
|
179
145
|
//# sourceMappingURL=DateField.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateField.js","sourceRoot":"","sources":["../../../lib/Atoms/DateField/DateField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,
|
|
1
|
+
{"version":3,"file":"DateField.js","sourceRoot":"","sources":["../../../lib/Atoms/DateField/DateField.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@factorearth/component-library",
|
|
3
|
-
"version": "6.2.4-datefield.
|
|
3
|
+
"version": "6.2.4-datefield.4",
|
|
4
4
|
"description": " A storybook component library for FactorEarth",
|
|
5
5
|
"author": "madtrx <marlin.makori@gmail.com>",
|
|
6
6
|
"homepage": "https://github.com/FactorEarth/RecordMiddleware#readme",
|
|
@@ -47,7 +47,7 @@
|
|
|
47
47
|
"access": "public",
|
|
48
48
|
"registry": "https://registry.npmjs.org/"
|
|
49
49
|
},
|
|
50
|
-
"gitHead": "
|
|
50
|
+
"gitHead": "66d65700ed08a68f47c9c4dfded920c9692e658d",
|
|
51
51
|
"dependencies": {
|
|
52
52
|
"@emotion/react": "^11.13.0",
|
|
53
53
|
"@emotion/styled": "^11.13.0",
|