Skip to content

Commit f77acc2

Browse files
committed
fix(input): resize floating values on element resize
1 parent 67ec5b4 commit f77acc2

File tree

2 files changed

+16
-4
lines changed

2 files changed

+16
-4
lines changed

demo/components/DemoTooltips.svelte

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -54,9 +54,17 @@
5454
containerProps={{ style: 'margin-left: 6.75rem' }}
5555
options={[
5656
{ value: 'top', label: 'Top' },
57+
{ value: 'top-start', label: 'Top Start' },
58+
{ value: 'top-end', label: 'Top End' },
5759
{ value: 'right', label: 'Right' },
60+
{ value: 'right-start', label: 'Right Start' },
61+
{ value: 'right-end', label: 'Right End' },
5862
{ value: 'bottom', label: 'Bottom' },
63+
{ value: 'bottom-start', label: 'Bottom Start' },
64+
{ value: 'bottom-end', label: 'Bottom End' },
5965
{ value: 'left', label: 'Left' },
66+
{ value: 'left-start', label: 'Left Start' },
67+
{ value: 'left-end', label: 'Left End' },
6068
]}
6169
/>
6270

@@ -107,7 +115,7 @@
107115

108116
<NeoInput bind:value={content} bind:containerRef placeholder="Placeholder" rounded={options.rounded} />
109117

110-
<NeoTooltip {tooltip} target={containerRef} offset={8} width {...options} />
118+
<NeoTooltip {tooltip} target={containerRef} offset={8} width="min" {...options} />
111119
</div>
112120
</div>
113121

src/lib/inputs/common/NeoInput.svelte

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<script lang="ts">
22
import { wait } from '@dvcol/common-utils/common/promise';
3+
import { resize } from '@dvcol/svelte-utils/resize';
34
45
import type { FocusEventHandler, PointerEventHandler } from 'svelte/elements';
56
@@ -11,7 +12,7 @@
1112
import NeoLabel from '~/inputs/common/NeoLabel.svelte';
1213
import { NeoInputLabelPosition } from '~/inputs/common/neo-input.model.js';
1314
14-
import { toTransition, toTransitionProps } from '~/utils/action.utils.js';
15+
import { type ActionWithProps, toTransition, toTransitionProps } from '~/utils/action.utils.js';
1516
import {
1617
computeGlassFilter,
1718
computeHoverShadowElevation,
@@ -182,8 +183,8 @@
182183
};
183184
184185
$effect(() => {
185-
if (first) waitForTick();
186-
updateRefs();
186+
if (!first) return updateRefs();
187+
waitForTick();
187188
});
188189
189190
let visible = $state(false);
@@ -237,6 +238,7 @@
237238
class:neo-deep={elevation < -3}
238239
{disabled}
239240
{readonly}
241+
use:resize={updateRefs}
240242
{...beforeProps}
241243
>
242244
{@render before(context)}
@@ -271,6 +273,7 @@
271273
class:neo-deep={elevation < -3}
272274
{disabled}
273275
{readonly}
276+
use:resize={updateRefs}
274277
{...afterProps}
275278
>
276279
{@render after(context)}
@@ -377,6 +380,7 @@
377380
required={rest.required}
378381
{disabled}
379382
onclick={onLabelClick}
383+
use={{ use: resize, props: updateRefs } as ActionWithProps}
380384
{...labelProps}
381385
>
382386
{@render input()}

0 commit comments

Comments
 (0)