jude/reminder-dashboard
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Use blur to set value

Browse Source
This commit is contained in:
jude 2023-11-19 11:29:10 +00:00
parent 67ce9077b6
commit 76c8afd45f
3 changed files with 23 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/Reminder/Embed/Fields/Field.tsx
View File

@ -1,6 +1,6 @@
export const Field = ({ title, value, inlined, index, onUpdate }) => {
export const Field = ({ title, value, inline, index, onUpdate }) => {
return (
<div data-inlined={inlined ? "1" : "0"} class="embed-field-box" key={index}>
<div data-inlined={inline ? "1" : "0"} class="embed-field-box" key={index}>
<label class="is-sr-only" for="embedFieldTitle">
Field Title
</label>
@ -24,7 +24,7 @@ export const Field = ({ title, value, inlined, index, onUpdate }) => {
onClick={() => {
onUpdate({
index,
inlined: !inlined,
inline: !inline,
});
}}
>

4
src/components/Reminder/Embed/Fields/index.tsx
View File

@ -6,7 +6,7 @@ export const Fields = () => {
return (
<div class={"embed-multifield-box"}>
{[...embed_fields, { value: "", title: "", inlined: true }].map((field, index) => (
{[...embed_fields, { value: "", title: "", inline: true }].map((field, index) => (
<Field
{...field}
index={index}
@ -15,7 +15,7 @@ export const Fields = () => {
...reminder,
embed_fields: [
...reminder.embed_fields,
{ value: "", title: "", inlined: true },
{ value: "", title: "", inline: true },
]
.map((f, i) => {
if (i === index) {

18
src/components/Reminder/TimeInput.tsx
View File

@ -58,6 +58,9 @@ export const TimeInput = ({ defaultValue, onInput }) => {
minimumIntegerDigits: 4,
useGrouping: false,
})}
onBlur={(ev) => {
setTime(time.set({ year: ev.currentTarget.value }));
}}
></input>{" "}
</label>
-
@ -75,6 +78,9 @@ export const TimeInput = ({ defaultValue, onInput }) => {
maxlength={2}
placeholder="12"
value={time?.month.toLocaleString("en-US", { minimumIntegerDigits: 2 })}
onBlur={(ev) => {
setTime(time.set({ month: ev.currentTarget.value }));
}}
></input>{" "}
</label>
-
@ -92,6 +98,9 @@ export const TimeInput = ({ defaultValue, onInput }) => {
maxlength={2}
placeholder="25"
value={time?.day.toLocaleString("en-US", { minimumIntegerDigits: 2 })}
onBlur={(ev) => {
setTime(time.set({ day: ev.currentTarget.value }));
}}
></input>{" "}
</label>
<label style={{ marginLeft: "8px" }}>
@ -108,6 +117,9 @@ export const TimeInput = ({ defaultValue, onInput }) => {
maxlength={2}
placeholder="12"
value={time?.hour.toLocaleString("en-US", { minimumIntegerDigits: 2 })}
onBlur={(ev) => {
setTime(time.set({ hour: ev.currentTarget.value }));
}}
></input>{" "}
</label>
:
@ -127,6 +139,9 @@ export const TimeInput = ({ defaultValue, onInput }) => {
value={time?.minute.toLocaleString("en-US", {
minimumIntegerDigits: 2,
})}
onBlur={(ev) => {
setTime(time.set({ minute: ev.currentTarget.value }));
}}
></input>{" "}
</label>
:
@ -146,6 +161,9 @@ export const TimeInput = ({ defaultValue, onInput }) => {
value={time?.second.toLocaleString("en-US", {
minimumIntegerDigits: 2,
})}
onBlur={(ev) => {
setTime(time.set({ second: ev.currentTarget.value }));
}}
></input>{" "}
</label>
</div>