You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
41 lines
1.3 KiB
41 lines
1.3 KiB
<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 { IconButton } from '$uix/eidos/components/icon-button';
|
|
import { SvgX } from '$uix/eidos/components/svg';
|
|
import type { FloatPanelCloseProps } from './types';
|
|
|
|
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>
|
|
|
|
<FloatPanel.Close {...rest}>
|
|
{#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>
|