mirror of
https://github.com/windmill-labs/windmill.git
synced 2026-08-18 16:02:10 +00:00
add hover edit button for resource pickers (#7340)
* feat: add hover edit button for disabled resource pickers When a resource picker is disabled but has a value selected, show an edit button on hover that allows editing the selected resource. This provides a way to modify the resource even when the picker itself is disabled. Changes: - Added hover state tracking to ResourcePicker component - Edit button (Pen icon) appears on hover when picker is disabled and has a value - Button opens ResourceEditorDrawer for the selected resource - Added ARIA role="group" for accessibility compliance Fixes #7339 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: windmill-internal-app[bot] <windmill-internal-app[bot]@users.noreply.github.com> * Update ResourcePicker.svelte --------- Co-authored-by: claude[bot] <41898282+claude[bot]@users.noreply.github.com> Co-authored-by: windmill-internal-app[bot] <windmill-internal-app[bot]@users.noreply.github.com> Co-authored-by: Ruben Fiszel <ruben@windmill.dev>
This commit is contained in:
@@ -153,6 +153,7 @@
|
||||
let appConnect: AppConnect | undefined = $state()
|
||||
let resourceEditor: ResourceEditorDrawer | undefined = $state()
|
||||
let dbManagerDrawer: DbManagerDrawer | undefined = $state()
|
||||
let hovering = $state(false)
|
||||
</script>
|
||||
|
||||
<AppConnect
|
||||
@@ -177,7 +178,12 @@
|
||||
/>
|
||||
<!-- {JSON.stringify({ value, collection })} -->
|
||||
<div class="flex flex-col w-full items-start {className}">
|
||||
<div class="flex flex-row w-full items-center">
|
||||
<div
|
||||
class="flex flex-row w-full items-center relative"
|
||||
role="group"
|
||||
onmouseenter={() => (hovering = true)}
|
||||
onmouseleave={() => (hovering = false)}
|
||||
>
|
||||
<Select
|
||||
{disabled}
|
||||
{disablePortal}
|
||||
@@ -267,6 +273,19 @@
|
||||
</div>
|
||||
{/snippet}
|
||||
</Select>
|
||||
{#if value && hovering}
|
||||
<div class="absolute right-2 z-20">
|
||||
<Button
|
||||
variant="subtle"
|
||||
size="xs2"
|
||||
wrapperClasses="pl-1"
|
||||
btnClasses="hover:bg-surface-tertiary"
|
||||
on:click={() => resourceEditor?.initEdit?.(value ?? '')}
|
||||
startIcon={{ icon: Pen }}
|
||||
iconOnly
|
||||
/>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
{#if showSchemaExplorer && value && assetCanBeExplored({ kind: 'resource', path: value }, { resource_type: resourceType })}
|
||||
<ExploreAssetButton
|
||||
|
||||
Reference in New Issue
Block a user