Skip to content

Commit a4b13c0

Browse files
dmaildmail
committed
work
1 parent 666a357 commit a4b13c0

2 files changed

Lines changed: 42 additions & 40 deletions

File tree

‎packages/frontend/navi/src/control/demos/4_input_textual_demo.html‎

Lines changed: 38 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -565,8 +565,8 @@ <h3 id="interactivity-form">Inside Form</h3>
565565
<Input
566566
defaultValue="Hello World!"
567567
placeholder="Enter text..."
568-
uiAction={(v) => {
569-
push("uiAction", v);
568+
uiAction={(v, e) => {
569+
push("uiAction", v, e);
570570
}}
571571
/>
572572
</div>
@@ -576,11 +576,11 @@ <h3 id="interactivity-form">Inside Form</h3>
576576
</label>
577577
<Input
578578
value={controlledValue}
579-
uiAction={(v) => {
580-
push("uiAction", v);
579+
uiAction={(v, e) => {
580+
push("uiAction", v, e);
581581
}}
582-
action={(v) => {
583-
push("action", v);
582+
action={(v, e) => {
583+
push("action", v, e);
584584
setControlledValue(v);
585585
}}
586586
placeholder="Controlled input"
@@ -605,11 +605,11 @@ <h3 id="interactivity-form">Inside Form</h3>
605605
<Box flex="y" spacing="s">
606606
<Input
607607
placeholder="Type something..."
608-
uiAction={(v) => {
609-
push("uiAction", v);
608+
uiAction={(v, e) => {
609+
push("uiAction", v, e);
610610
}}
611-
action={(v) => {
612-
push("action", v);
611+
action={(v, e) => {
612+
push("action", v, e);
613613
}}
614614
/>
615615
<CallLog entries={entries} onClear={clear} />
@@ -634,11 +634,11 @@ <h3 id="interactivity-form">Inside Form</h3>
634634
<Input
635635
placeholder="Type something..."
636636
autoComplete="off"
637-
uiAction={(v) => {
638-
push("uiAction", v);
637+
uiAction={(v, e) => {
638+
push("uiAction", v, e);
639639
}}
640-
action={async (value) => {
641-
push("action", value);
640+
action={async (value, e) => {
641+
push("action", value, e);
642642
await delay(1000);
643643
}}
644644
/>
@@ -662,11 +662,11 @@ <h3 id="interactivity-form">Inside Form</h3>
662662
<Box flex="y" spacing="s">
663663
<Input
664664
placeholder="Type something (debounced 600ms)..."
665-
uiAction={(v) => {
666-
push("uiAction", v);
665+
uiAction={(v, e) => {
666+
push("uiAction", v, e);
667667
}}
668-
action={async (value) => {
669-
push("action", value);
668+
action={async (value, e) => {
669+
push("action", value, e);
670670
await new Promise((resolve) => setTimeout(resolve, 1500));
671671
}}
672672
actionDebounce={600}
@@ -692,11 +692,11 @@ <h3 id="interactivity-form">Inside Form</h3>
692692
<Input
693693
placeholder="Type something (debounced 600ms)..."
694694
value={searchValueSignal}
695-
uiAction={(v) => {
696-
push("uiAction", v);
695+
uiAction={(v, e) => {
696+
push("uiAction", v, e);
697697
}}
698-
action={async (value) => {
699-
push("action", value);
698+
action={async (value, e) => {
699+
push("action", value, e);
700700
await new Promise((resolve) => setTimeout(resolve, 1500));
701701
searchValueSignal.value = value;
702702
}}
@@ -722,11 +722,11 @@ <h3 id="interactivity-form">Inside Form</h3>
722722
<Box flex="y" spacing="s">
723723
<Input
724724
placeholder="Type and press Enter or blur..."
725-
uiAction={(v) => {
726-
push("uiAction", v);
725+
uiAction={(v, e) => {
726+
push("uiAction", v, e);
727727
}}
728-
action={async (value) => {
729-
push("action", value);
728+
action={async (value, e) => {
729+
push("action", value, e);
730730
await new Promise((resolve) => setTimeout(resolve, 1500));
731731
}}
732732
actionAfterChange
@@ -760,12 +760,12 @@ <h3 id="interactivity-form">Inside Form</h3>
760760
<Box flex="y" spacing="s">
761761
<Input
762762
placeholder="Type something (with abort)..."
763-
uiAction={(v) => {
764-
push("uiAction", v);
763+
uiAction={(v, e) => {
764+
push("uiAction", v, e);
765765
}}
766-
action={(value) => {
766+
action={(value, e) => {
767767
const abortSignal = cancelPrevious();
768-
push("action", value);
768+
push("action", value, e);
769769
setTimeout(() => {
770770
if (!abortSignal.aborted) {
771771
push("action resolved", value);
@@ -798,11 +798,11 @@ <h3 id="interactivity-form">Inside Form</h3>
798798
<Input
799799
name="username"
800800
value={username}
801-
uiAction={(v) => {
802-
push("uiAction", v);
801+
uiAction={(v, e) => {
802+
push("uiAction", v, e);
803803
}}
804-
action={(v) => {
805-
push("action", v);
804+
action={(v, e) => {
805+
push("action", v, e);
806806
setUsername(v);
807807
}}
808808
placeholder="Enter username"
@@ -851,11 +851,11 @@ <h3 id="interactivity-form">Inside Form</h3>
851851
<Input
852852
name="search"
853853
defaultValue="cats"
854-
uiAction={(v) => {
855-
push("uiAction", v);
854+
uiAction={(v, e) => {
855+
push("uiAction", v, e);
856856
}}
857-
action={async (value) => {
858-
push("action", value);
857+
action={async (value, e) => {
858+
push("action", value, e);
859859
await delay(600);
860860
}}
861861
actionAfterChange

‎packages/frontend/navi/src/control/demos/utils/call_log.jsx‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -157,6 +157,7 @@ export const CallLog = ({ entries, onClear }) => {
157157
}
158158
>
159159
{entry.type}
160+
{entry.eventType ? ` (${entry.eventType})` : ""}
160161
</span>
161162
<span className="value">← {formatValue(entry.value)}</span>
162163
</div>
@@ -174,8 +175,9 @@ const formatValue = (value) => {
174175

175176
export const useCallLog = () => {
176177
const [entries, setEntries] = useState([]);
177-
const push = (type, value) => {
178-
setEntries((prev) => [...prev, { type, value }]);
178+
const push = (type, value, event) => {
179+
const eventType = event?.type;
180+
setEntries((prev) => [...prev, { type, value, eventType }]);
179181
};
180182
const clear = () => {
181183
setEntries([]);

0 commit comments

Comments
 (0)