- toast-close now composes the canonical <IconButton rounded="full"> via soma's child snippet (keeps the round dismiss shape); removed the bespoke [data-toast-close] chrome + the orphaned --toast-close-* recipe tokens; the toast item grid still places it in the trailing column. aria-label routes through the common close label. - Per the close-family decision: variant/color defer to Button's canonical defaults (solid/primary) across the family — no hardcoded ghost/neutral. banner-close dropped its ghost/neutral defaults to match popover/dialog/drawer. - component-visual-attrs manifest: toast-close delegates icon-only to IconButton. Verified in browser (toast close = round solid-primary ✕, correctly placed). svelte-check + orphan test clean for touched files. Excludes words/palabras/chronos. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>active-uix
parent
0a43225ec2
commit
7092450734
@ -1,27 +1,41 @@
|
||||
<script lang="ts">
|
||||
/**
|
||||
* Eidos `Toast.Close` — composes the canonical `<IconButton>` via soma's
|
||||
* `child` snippet (no bespoke close chrome — it inherits Button's chrome,
|
||||
* focus ring and disabled). `rounded='full'` keeps the toast's round dismiss
|
||||
* shape; `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 Toast from '$soma/components/toast';
|
||||
import { IconButton } from '$uix/eidos/components/icon-button';
|
||||
import { SvgX } from '$uix/eidos/components/svg';
|
||||
import type { ToastCloseProps } from './types';
|
||||
|
||||
let { children, ...rest }: ToastCloseProps = $props();
|
||||
let {
|
||||
variant,
|
||||
size,
|
||||
color,
|
||||
'aria-label': ariaLabel,
|
||||
child: outerChild,
|
||||
children,
|
||||
...rest
|
||||
}: ToastCloseProps = $props();
|
||||
|
||||
const eidos = ActiveEidos.require();
|
||||
const resolvedSize = $derived(size ?? 'sm');
|
||||
const closeLabel = $derived(ariaLabel ?? eidos.langs.ts('#?common.buttons.close|Close'));
|
||||
</script>
|
||||
|
||||
<Toast.Close {...rest} data-icon-only={!children ? '' : undefined}>
|
||||
{#if children}
|
||||
{@render children?.()}
|
||||
<Toast.Close {...rest}>
|
||||
{#snippet child({ props })}
|
||||
{#if outerChild}
|
||||
{@render outerChild({ props })}
|
||||
{:else}
|
||||
<svg
|
||||
viewBox="0 0 24 24"
|
||||
width="14"
|
||||
height="14"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<line x1="18" y1="6" x2="6" y2="18" />
|
||||
<line x1="6" y1="6" x2="18" y2="18" />
|
||||
</svg>
|
||||
<IconButton {...props} {variant} size={resolvedSize} {color} rounded="full" aria-label={closeLabel}>
|
||||
{#if children}{@render children()}{:else}<SvgX />{/if}
|
||||
</IconButton>
|
||||
{/if}
|
||||
{/snippet}
|
||||
</Toast.Close>
|
||||
|
||||
Loading…
Reference in new issue