[ @sdxc/ui/mixins ]

attachmentTrigger

Turns an Attachment.Trigger's whole card into a single activation target, following its href or opening the <dialog> its commandfor names.

View as Markdown Open in GitHub Open in ChatGPT Open in Claude

import { attachmentTrigger } from "@sdxc/ui/mixins";

Usage

Makes an Attachment.Trigger's whole card activatable as a link or dialog trigger through the same href/commandfor attributes resolveAction reads; an aria-disabled="true" host ignores every activation, and nested controls keep answering their own click, tap, and keypress independently.

Signature

attachmentTrigger(): MixinDescriptor<HTMLElement>

Returns a mixin descriptor for an Attachment.Trigger's mix prop.

Examples

<Attachment.Trigger href="/files/quarterly-report.pdf" mix={attachmentTrigger()}>
	<Attachment state="done">
		<Attachment.Media><FileTextIcon aria-hidden /></Attachment.Media>
		<Attachment.Content>
			<Attachment.Title>quarterly-report.pdf</Attachment.Title>
		</Attachment.Content>
		<Attachment.Actions>
			<Attachment.Action aria-label={t("attachment.download")}>
				<DownloadIcon />
			</Attachment.Action>
		</Attachment.Actions>
	</Attachment>
</Attachment.Trigger>

<Attachment.Trigger commandfor="quarterly-report-preview" mix={attachmentTrigger()}>
	<Attachment state="done">
		<Attachment.Media><FileTextIcon aria-hidden /></Attachment.Media>
		<Attachment.Content>
			<Attachment.Title>quarterly-report.pdf</Attachment.Title>
		</Attachment.Content>
	</Attachment>
</Attachment.Trigger>
<Dialog id="quarterly-report-preview">...</Dialog>

The events, constants and types its module publishes, each imported from @sdxc/ui/mixins too.

Event