float-panel-close now composes the canonical <IconButton> via soma's child snippet (variant/color defer to Button defaults; aria-label via the common close label). Extracted [data-float-panel-close] from the shared chrome selector so Action + StageTrigger keep their square-button styling while Close inherits button.css. No recipe change (the shared --float-panel-button-size etc. stay for the siblings). Verified in browser (solid-primary icon close, "Cerrar"). Completes the close family (dialog/drawer/popover/banner/toast/float-panel). Excludes words/palabras/chronos. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>active-uix
parent
7092450734
commit
a32608dadd
@ -1,10 +1,40 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
|
/**
|
||||||
|
* Eidos `FloatPanel.Close` — composes the canonical `<IconButton>` via soma's
|
||||||
|
* `child` snippet (no bespoke close chrome — it inherits Button's chrome, focus
|
||||||
|
* ring and disabled). `variant` / `color` defer to Button's canonical defaults;
|
||||||
|
* the accessible name routes through langs ("Cerrar"). A `child` snippet
|
||||||
|
* bypasses IconButton.
|
||||||
|
*/
|
||||||
|
import { ActiveEidos } from '$uix/eidos';
|
||||||
import * as FloatPanel from '$soma/components/float-panel';
|
import * as FloatPanel from '$soma/components/float-panel';
|
||||||
|
import { IconButton } from '$uix/eidos/components/icon-button';
|
||||||
|
import { SvgX } from '$uix/eidos/components/svg';
|
||||||
import type { FloatPanelCloseProps } from './types';
|
import type { FloatPanelCloseProps } from './types';
|
||||||
|
|
||||||
let { children, ...rest }: FloatPanelCloseProps = $props();
|
let {
|
||||||
|
variant,
|
||||||
|
size,
|
||||||
|
color,
|
||||||
|
'aria-label': ariaLabel,
|
||||||
|
child: outerChild,
|
||||||
|
children,
|
||||||
|
...rest
|
||||||
|
}: FloatPanelCloseProps = $props();
|
||||||
|
|
||||||
|
const eidos = ActiveEidos.require();
|
||||||
|
const resolvedSize = $derived(size ?? 'sm');
|
||||||
|
const closeLabel = $derived(ariaLabel ?? eidos.langs.ts('#?common.buttons.close|Close'));
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<FloatPanel.Close {...rest}>
|
<FloatPanel.Close {...rest}>
|
||||||
{@render children?.()}
|
{#snippet child({ props })}
|
||||||
|
{#if outerChild}
|
||||||
|
{@render outerChild({ props })}
|
||||||
|
{:else}
|
||||||
|
<IconButton {...props} {variant} size={resolvedSize} {color} aria-label={closeLabel}>
|
||||||
|
{#if children}{@render children()}{:else}<SvgX />{/if}
|
||||||
|
</IconButton>
|
||||||
|
{/if}
|
||||||
|
{/snippet}
|
||||||
</FloatPanel.Close>
|
</FloatPanel.Close>
|
||||||
|
|||||||
Loading…
Reference in new issue