nuxt-x-marketing

AffiliateDisclosure

FTC-compliant affiliate disclosure in subtle, banner, or inline variants with optional dismiss persistence.

AffiliateDisclosure

An FTC-compliant affiliate disclosure in three display modes. Use subtle for per-section disclosures, banner for a full-width site-level notice, and inline for inline text. Dismiss state is persisted to localStorage only when dismissible is true and a storageKey is set.

Components

`<XMarkAffiliateDisclosure />`

<!-- Subtle box (most common — used by ProductGrid and ComparisonTable) -->
<XMarkAffiliateDisclosure
  text="This page contains affiliate links. As an Amazon Associate, we earn from qualifying purchases at no extra cost to you."
  variant="subtle"
  :dismissible="true"
  storage-key="affiliate-disclosure-products"
/>

<!-- Full-width banner -->
<XMarkAffiliateDisclosure
  text="Some links on this site are affiliate links."
  variant="banner"
/>

<!-- Inline sentence -->
<p>
  We recommend the Sony XM5
  <XMarkAffiliateDisclosure
    text="(affiliate link)"
    variant="inline"
    :dismissible="false"
  />
  for most users.
</p>

Props

Prop	Type	Default	Description
`text`	`string`	Default Amazon associate disclosure	Disclosure message text.
`variant`	`string`	`'subtle'`	Display style: `'subtle'`, `'banner'`, `'inline'`.
`icon`	`string`	`'i-lucide-info'`	Icon shown alongside the text.
`dismissible`	`boolean`	`false`	Show dismiss button. When `true` and `storageKey` is set, dismissed state is persisted to `localStorage`.
`storageKey`	`string`	`'affiliate-disclosure-dismissed'`	localStorage key for persisting dismissed state. Has no effect unless `dismissible` is `true`.

Emits

Event	Description
`dismiss`	Fired when the user dismisses the disclosure (only when `dismissible` is `true`).

AI Context

category: Affiliate
package: "@xenterprises/nuxt-x-marketing"
components:
  - XMarkAffiliateDisclosure
use-when: >
  Adding FTC-compliant affiliate disclosures to any page or section containing
  affiliate links. Integrated automatically into XMarkAffiliateProductGrid,
  XMarkAffiliateComparisonTable, and XMarkAffiliateProductDetail via the
  disclosure prop.
typical-page-section: Top of any page or section containing affiliate links.

Edit this pageorReport an issue

AffiliateProductDetail

Full-page affiliate product review with image gallery, pros/cons, specs table, editorial verdict, score badge, and sticky buy box.

SectionStitch

SVG section divider with 10 shape variants (diagonal, slant, concave, convex, tilt, waves, clouds, peaks, scallop, arrow), configurable colors, height, glow line, and directional flips.