@vtex/faststore 0.0.7 → 0.0.10

package/dist/particles/incentives/incentives.js.map

@@ -1 +1 @@
-{"version":3,"file":"incentives.js","names":[],"sources":["../../../src/particles/incentives/incentives.tsx"],"sourcesContent":["import { type ContentValue, defineComponent, defineContentType } from '@vtex/fs-core';\nimport type { ComponentPropsWithRef } from 'react';\nimport { resolveSafeHref } from '../../utils/safe-href.js';\nimport { Icon } from '../icon/icon.js';\nimport { Image } from '../image/image.js';\nimport { NavigationLink } from '../navigation-link/navigation-link.js';\n\n// ---------------------------------------------------------------------------\n// Content model\n// ---------------------------------------------------------------------------\n\nexport const IncentivesContent = defineContentType({\n  id: 'incentives',\n  title: 'Incentives',\n  description: 'Store benefit highlights rendered as a strip in the footer.',\n  schema: {\n    type: 'object',\n    additionalProperties: false,\n    // `items` is deliberately optional. A missing element key already omits the component before any\n    // required check runs, so requiring the list would buy nothing and cost the prop fallback: an\n    // entry without it would be shape-invalid and the authored `items` never reached.\n    properties: {\n      items: {\n        type: 'array',\n        title: 'Incentive items',\n        // Author-time guidance only: no read-time gate enforces item bounds, so its one consumer is\n        // the Content Platform Admin's form. An empty list still reaches the component, which\n        // self-hides on it. No ceiling — the swatch has to lay out at any count regardless.\n        minItems: 1,\n        items: {\n          type: 'object',\n          additionalProperties: false,\n          // `title` alone. A nested required property is validated at read time and a violation omits\n          // the whole strip, so every entry here widens the blast radius of one under-filled item.\n          required: ['title'],\n          properties: {\n            // `minLength` on the title alone: it is the required property, so a blank one is the only\n            // blank that decides anything. Both lines render if present and drop if blank, which is\n            // guidance the Admin form has no reason to state differently for one of them.\n            title: { type: 'string', minLength: 1, title: 'Title' },\n            firstLineText: { type: 'string', title: 'First line' },\n            secondLineText: { type: 'string', title: 'Second line' },\n            // Optional, because a benefit strip links nowhere and a shortcut row links everywhere,\n            // and the two are the same shape. Author-time guidance only, deliberately identical to\n            // FooterLinkGroup's so the Admin form cannot reject a destination `resolveSafeHref`\n            // would have accepted; lookahead-free because that regex engine may be an RE2 family.\n            href: {\n              type: 'string',\n              minLength: 1,\n              title: 'Link',\n              format: 'uri-reference',\n              pattern: '^(?:https?://.*|mailto:.+|tel:.+|/(?:[^/].*)?)$',\n            },\n            // Inline rather than a named constant: the catalog scanner reads this file statically and\n            // rejects an identifier it cannot evaluate.\n            icon: {\n              type: 'string',\n              enum: ['truck', 'calendar', 'gift', 'store', 'shield-check'],\n              title: 'Icon',\n            },\n            iconUrl: {\n              type: 'string',\n              format: 'uri',\n              title: 'Custom icon',\n              widget: { 'ui:widget': 'media-gallery' },\n            },\n            alt: { type: 'string', title: 'Custom icon alt text' },\n          },\n        },\n      },\n    },\n  },\n});\n\n/**\n * The benefit glyphs the `icon` enum admits. Exported because a store's `global.json` has to list\n * them under `icons.include` for a CMS-chosen name to resolve at runtime — one import there instead\n * of five retyped strings, which is what keeps the layout task from silently missing one. Reading it\n * off the model rather than declaring it alongside makes the two impossible to drift apart.\n */\nexport const INCENTIVE_ICON_NAMES = IncentivesContent.schema.properties.items.items.properties.icon.enum;\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\n\ntype IncentivesContentValue = ContentValue<typeof IncentivesContent>;\n\n/** One incentive item, identical in the prop and the content channels. */\nexport type IncentiveItem = NonNullable<IncentivesContentValue['items']>[number];\n\ntype IncentiveIconName = NonNullable<IncentiveItem['icon']>;\n\nexport type IncentivesProps = ComponentPropsWithRef<'ul'> & {\n  /** Authored fallback list, rendered when no CMS entry supplies one. */\n  items?: readonly IncentiveItem[];\n  /** Injected by the compiler, sliced from the layout's composite content entry. */\n  $content?: IncentivesContentValue;\n};\n\n// ---------------------------------------------------------------------------\n// Definition\n// ---------------------------------------------------------------------------\n\nexport const IncentivesDefinition = defineComponent({\n  name: 'Incentives',\n  importPath: '@vtex/faststore/components',\n  component: Incentives,\n  content: IncentivesContent,\n  editor: { label: 'Incentives', category: 'content' },\n  schema: {\n    items: { type: 'array', label: 'Incentive items' },\n  },\n  guideline:\n    \"The store's value propositions as a strip of icon-and-copy items, the whole list CMS-editable: each item carries a title, up to two description lines, either a predefined icon or an uploaded one, and an optional href that turns the whole block into a link. Every predefined icon name must be listed in the store's icons.include. Renders nothing when unconfigured. See incentives.md.\",\n});\n\n// ---------------------------------------------------------------------------\n// Implementation\n// ---------------------------------------------------------------------------\n\n/**\n * The three glyph states an item can reach, kept as a union so \"at most one source\" is a property of\n * the type rather than of how the resolver happens to build it. `alt` belongs to the uploaded member\n * alone, since a sprite glyph has nothing to name.\n */\ntype ResolvedGlyph =\n  | { icon: IncentiveIconName; src?: undefined; alt?: undefined }\n  | { icon?: undefined; src: string; alt?: string }\n  | { icon?: undefined; src?: undefined; alt?: undefined };\n\n/**\n * An item that can render: a non-blank title, its surviving description lines, a glyph state, and a\n * destination the allowlist cleared. The title is the item's identity, so it is the only part whose\n * absence drops the item.\n */\ntype ResolvedIncentive = { title: string; lines: string[]; href: string | null } & ResolvedGlyph;\n\n/**\n * The item's destination, or null for both \"none authored\" and \"the allowlist refused it\". Unlike the\n * link group and the social row, where a link is the whole point, a refusal here costs the anchor\n * alone — an unlinked item is this component's ordinary shape, so the glyph and copy still render.\n */\nfunction resolveHref(raw: string | undefined, index: number): string | null {\n  // Absent and blank are \"no link\", not a rejection, so neither reaches the allowlist or the log.\n  if (!raw?.trim()) return null;\n\n  const destination = resolveSafeHref(raw);\n  if (!destination.safe) {\n    // A bounded reason and no authored value, the convention the content runtime's own log follows.\n    console.warn('[Incentives] link destination rejected', { index, reason: destination.reason });\n    return null;\n  }\n\n  return destination.href;\n}\n\n/**\n * Drops every item with no title to show, and every description line that would render empty.\n * Neither read-time gate enforces `minLength`, so both blanks reach the component. The asymmetry is\n * deliberate: an icon with no label is not an incentive, while a missing line is supplementary.\n */\nfunction resolveIncentives(items: readonly IncentiveItem[]): ResolvedIncentive[] {\n  const resolved: ResolvedIncentive[] = [];\n\n  items.forEach((item, index) => {\n    if (!item.title.trim()) return;\n\n    const lines = [item.firstLineText, item.secondLineText].filter((line): line is string => Boolean(line?.trim()));\n    const href = resolveHref(item.href, index);\n\n    if (item.iconUrl?.trim()) {\n      resolved.push({ title: item.title, lines, href, src: item.iconUrl, alt: item.alt });\n    } else if (item.icon) {\n      resolved.push({ title: item.title, lines, href, icon: item.icon });\n    } else {\n      resolved.push({ title: item.title, lines, href });\n    }\n  });\n\n  return resolved;\n}\n\n/**\n * The item's glyph, or nothing. Presence decides the channel — an upload first, then a predefined\n * sprite name — and an item carrying neither renders as copy alone rather than an empty slot.\n */\nfunction IncentiveGlyph({ item }: { item: ResolvedIncentive }) {\n  if (item.src !== undefined) {\n    return <Image src={item.src} alt={item.alt} data-fs-incentive-icon=\"\" />;\n  }\n\n  if (item.icon !== undefined) {\n    return <Icon name={item.icon} data-fs-incentive-icon=\"\" />;\n  }\n\n  return null;\n}\n\n/**\n * The glyph and copy an item renders in both forms. Kept whole rather than split across the linked\n * and unlinked branches so the anchor wraps the entire block: on a shortcut row the pictogram is\n * half the click target, and a link around the label alone leaves it dead.\n */\nfunction IncentiveBody({ item }: { item: ResolvedIncentive }) {\n  return (\n    <>\n      <IncentiveGlyph item={item} />\n      <p data-fs-text=\"\" data-fs-incentive-title=\"\">\n        {item.title}\n      </p>\n      {item.lines.map((line, lineIndex) => (\n        <p key={lineIndex} data-fs-text=\"\" data-fs-incentive-description=\"\">\n          {line}\n        </p>\n      ))}\n    </>\n  );\n}\n\nexport function Incentives({ items, $content, className, ...props }: IncentivesProps) {\n  const resolved = resolveIncentives($content?.items ?? items ?? []);\n\n  if (resolved.length === 0) return null;\n\n  // `role` precedes the spread so a consumer can still override it.\n  return (\n    // biome-ignore lint/a11y/noRedundantRoles: WebKit drops the implicit list role from a ul whose computed `list-style` is `none` — exactly what this component's swatch sets — so the explicit role is what holds the semantics the list was chosen for.\n    <ul role=\"list\" {...props} className={className} data-fs-incentives=\"\">\n      {resolved.map((item, index) => (\n        <li key={index} data-fs-incentive=\"\">\n          {item.href === null ? (\n            <IncentiveBody item={item} />\n          ) : (\n            // No `target`: these are the store's own shortcuts, not the outbound profiles the social\n            // row forces a new tab for.\n            <NavigationLink href={item.href} data-fs-incentive-link=\"\">\n              <IncentiveBody item={item} />\n            </NavigationLink>\n          )}\n        </li>\n      ))}\n    </ul>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"incentives.js","names":[],"sources":["../../../src/particles/incentives/incentives.tsx"],"sourcesContent":["import { type ContentValue, defineComponent, defineContentType } from '@vtex/fs-core';\nimport type { ComponentPropsWithRef } from 'react';\nimport type { PageRef } from '../../sdk/navigation/types.js';\nimport { resolveSafeHref } from '../../utils/safe-href.js';\nimport { Icon } from '../icon/icon.js';\nimport { Image } from '../image/image.js';\nimport { NavigationLink } from '../navigation-link/navigation-link.js';\n\n// ---------------------------------------------------------------------------\n// Content model\n// ---------------------------------------------------------------------------\n\nexport const IncentivesContent = defineContentType({\n  id: 'incentives',\n  title: 'Incentives',\n  description: 'Store benefit highlights rendered as a strip in the footer.',\n  schema: {\n    type: 'object',\n    additionalProperties: false,\n    // `items` is deliberately optional. A missing element key already omits the component before any\n    // required check runs, so requiring the list would buy nothing and cost the prop fallback: an\n    // entry without it would be shape-invalid and the authored `items` never reached.\n    properties: {\n      items: {\n        type: 'array',\n        title: 'Incentive items',\n        // Author-time guidance only: no read-time gate enforces item bounds, so its one consumer is\n        // the Content Platform Admin's form. An empty list still reaches the component, which\n        // self-hides on it. No ceiling — the swatch has to lay out at any count regardless.\n        minItems: 1,\n        items: {\n          type: 'object',\n          additionalProperties: false,\n          // `title` alone. A nested required property is validated at read time and a violation omits\n          // the whole strip, so every entry here widens the blast radius of one under-filled item.\n          required: ['title'],\n          properties: {\n            // `minLength` on the title alone: it is the required property, so a blank one is the only\n            // blank that decides anything. Both lines render if present and drop if blank, which is\n            // guidance the Admin form has no reason to state differently for one of them.\n            title: { type: 'string', minLength: 1, title: 'Title' },\n            firstLineText: { type: 'string', title: 'First line' },\n            secondLineText: { type: 'string', title: 'Second line' },\n            // Optional, because a benefit strip links nowhere and a shortcut row links everywhere,\n            // and the two are the same shape. Author-time guidance only, deliberately identical to\n            // FooterLinkGroup's so the Admin form cannot reject a destination `resolveSafeHref`\n            // would have accepted; lookahead-free because that regex engine may be an RE2 family.\n            href: {\n              type: 'string',\n              minLength: 1,\n              title: 'Link',\n              format: 'uri-reference',\n              pattern: '^(?:https?://.*|mailto:.+|tel:.+|/(?:[^/].*)?)$',\n            },\n            // Inline rather than a named constant: the catalog scanner reads this file statically and\n            // rejects an identifier it cannot evaluate.\n            icon: {\n              type: 'string',\n              enum: ['truck', 'calendar', 'gift', 'store', 'shield-check'],\n              title: 'Icon',\n            },\n            iconUrl: {\n              type: 'string',\n              format: 'uri',\n              title: 'Custom icon',\n              widget: { 'ui:widget': 'media-gallery' },\n            },\n            alt: { type: 'string', title: 'Custom icon alt text' },\n          },\n        },\n      },\n    },\n  },\n});\n\n/**\n * The benefit glyphs the `icon` enum admits. Exported because a store's foundation has to list\n * them under `icons.include` for a CMS-chosen name to resolve at runtime — one import there instead\n * of five retyped strings, which is what keeps the layout task from silently missing one. Reading it\n * off the model rather than declaring it alongside makes the two impossible to drift apart.\n */\nexport const INCENTIVE_ICON_NAMES = IncentivesContent.schema.properties.items.items.properties.icon.enum;\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\n\ntype IncentivesContentValue = ContentValue<typeof IncentivesContent>;\n\ntype IncentiveContentItem = NonNullable<IncentivesContentValue['items']>[number];\n\n/** One incentive item. The prop accepts a page reference; a CMS href stays a string. */\nexport type IncentiveItem = Omit<IncentiveContentItem, 'href'> & {\n  href?: PageRef | string;\n};\n\ntype IncentiveIconName = NonNullable<IncentiveItem['icon']>;\n\nexport type IncentivesProps = ComponentPropsWithRef<'ul'> & {\n  /** Authored fallback list, rendered when no CMS entry supplies one. */\n  items?: readonly IncentiveItem[];\n  /** Injected by the compiler, sliced from the layout's composite content entry. */\n  $content?: IncentivesContentValue;\n};\n\n// ---------------------------------------------------------------------------\n// Definition\n// ---------------------------------------------------------------------------\n\nexport const IncentivesDefinition = defineComponent({\n  name: 'Incentives',\n  importPath: '@vtex/faststore/components',\n  component: Incentives,\n  content: IncentivesContent,\n  editor: { label: 'Incentives', category: 'content' },\n  schema: {\n    items: { type: 'array', label: 'Incentive items' },\n  },\n  guideline:\n    \"The store's value propositions as a strip of icon-and-copy items, the whole list CMS-editable: each item carries a title, up to two description lines, either a predefined icon or an uploaded one, and an optional href that turns the whole block into a link. Every predefined icon name must be listed in the store's icons.include. Renders nothing when unconfigured. See incentives.md.\",\n});\n\n// ---------------------------------------------------------------------------\n// Implementation\n// ---------------------------------------------------------------------------\n\n/**\n * The three glyph states an item can reach, kept as a union so \"at most one source\" is a property of\n * the type rather than of how the resolver happens to build it. `alt` belongs to the uploaded member\n * alone, since a sprite glyph has nothing to name.\n */\ntype ResolvedGlyph =\n  | { icon: IncentiveIconName; src?: undefined; alt?: undefined }\n  | { icon?: undefined; src: string; alt?: string }\n  | { icon?: undefined; src?: undefined; alt?: undefined };\n\n/**\n * An item that can render: a non-blank title, its surviving description lines, a glyph state, and a\n * destination the allowlist cleared. The title is the item's identity, so it is the only part whose\n * absence drops the item.\n */\ntype ResolvedIncentive = { title: string; lines: string[]; href: PageRef | string | null } & ResolvedGlyph;\n\n/**\n * The item's destination, or null for both \"none authored\" and \"the allowlist refused it\". Unlike the\n * link group and the social row, where a link is the whole point, a refusal here costs the anchor\n * alone — an unlinked item is this component's ordinary shape, so the glyph and copy still render.\n */\nfunction readItems(\n  content: readonly IncentiveContentItem[] | undefined,\n  authored: readonly IncentiveItem[] | undefined,\n): readonly IncentiveItem[] {\n  if (content !== undefined) return content;\n  return authored ?? [];\n}\n\nfunction resolveHref(raw: PageRef | string | undefined, index: number): PageRef | string | null {\n  // A page reference skips the string allowlist. Absent is \"no link\", not a rejection.\n  if (typeof raw !== 'string') return raw ?? null;\n  // Blank is \"no link\", not a rejection, so it never reaches the allowlist or the log.\n  if (!raw.trim()) return null;\n\n  const destination = resolveSafeHref(raw);\n  if (!destination.safe) {\n    // A bounded reason and no authored value, the convention the content runtime's own log follows.\n    console.warn('[Incentives] link destination rejected', { index, reason: destination.reason });\n    return null;\n  }\n\n  return destination.href;\n}\n\n/**\n * Drops every item with no title to show, and every description line that would render empty.\n * Neither read-time gate enforces `minLength`, so both blanks reach the component. The asymmetry is\n * deliberate: an icon with no label is not an incentive, while a missing line is supplementary.\n */\nfunction resolveIncentives(items: readonly IncentiveItem[]): ResolvedIncentive[] {\n  const resolved: ResolvedIncentive[] = [];\n\n  items.forEach((item, index) => {\n    if (!item.title.trim()) return;\n\n    const lines = [item.firstLineText, item.secondLineText].filter((line): line is string => Boolean(line?.trim()));\n    const href = resolveHref(item.href, index);\n\n    if (item.iconUrl?.trim()) {\n      resolved.push({ title: item.title, lines, href, src: item.iconUrl, alt: item.alt });\n    } else if (item.icon) {\n      resolved.push({ title: item.title, lines, href, icon: item.icon });\n    } else {\n      resolved.push({ title: item.title, lines, href });\n    }\n  });\n\n  return resolved;\n}\n\n/**\n * The item's glyph, or nothing. Presence decides the channel — an upload first, then a predefined\n * sprite name — and an item carrying neither renders as copy alone rather than an empty slot.\n */\nfunction IncentiveGlyph({ item }: { item: ResolvedIncentive }) {\n  if (item.src !== undefined) {\n    return <Image src={item.src} alt={item.alt} data-fs-incentive-icon=\"\" />;\n  }\n\n  if (item.icon !== undefined) {\n    return <Icon name={item.icon} data-fs-incentive-icon=\"\" />;\n  }\n\n  return null;\n}\n\n/**\n * The glyph and copy an item renders in both forms. Kept whole rather than split across the linked\n * and unlinked branches so the anchor wraps the entire block: on a shortcut row the pictogram is\n * half the click target, and a link around the label alone leaves it dead.\n */\nfunction IncentiveBody({ item }: { item: ResolvedIncentive }) {\n  return (\n    <>\n      <IncentiveGlyph item={item} />\n      <p data-fs-text=\"\" data-fs-incentive-title=\"\">\n        {item.title}\n      </p>\n      {item.lines.map((line, lineIndex) => (\n        <p key={lineIndex} data-fs-text=\"\" data-fs-incentive-description=\"\">\n          {line}\n        </p>\n      ))}\n    </>\n  );\n}\n\nexport function Incentives({ items, $content, className, ...props }: IncentivesProps) {\n  const resolved = resolveIncentives(readItems($content?.items, items));\n\n  if (resolved.length === 0) return null;\n\n  // `role` precedes the spread so a consumer can still override it.\n  return (\n    // biome-ignore lint/a11y/noRedundantRoles: WebKit drops the implicit list role from a ul whose computed `list-style` is `none` — exactly what this component's swatch sets — so the explicit role is what holds the semantics the list was chosen for.\n    <ul role=\"list\" {...props} className={className} data-fs-incentives=\"\">\n      {resolved.map((item, index) => (\n        <li key={index} data-fs-incentive=\"\">\n          {item.href === null ? (\n            <IncentiveBody item={item} />\n          ) : (\n            // No `target`: these are the store's own shortcuts, not the outbound profiles the social\n            // row forces a new tab for.\n            <NavigationLink href={item.href} data-fs-incentive-link=\"\">\n              <IncentiveBody item={item} />\n            </NavigationLink>\n          )}\n        </li>\n      ))}\n    </ul>\n  );\n}\n"],"mappings":"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"}

package/dist/particles/logo/logo.d.ts

@@ -1,6 +1,7 @@
 import { ContentValue } from "../../core/dist/define-content-type.js";
 import { ComponentDefinition } from "../../core/dist/define-component.js";
 import "../../core/dist/index.js";
+import { PageRef } from "../../sdk/navigation/types.js";
 import { ComponentPropsWithRef } from "react";
 //#region src/particles/logo/logo.d.ts
 export declare const LogoContent: {
@@ -41,8 +42,8 @@ export type LogoProps = Omit<ComponentPropsWithRef<'div'>, 'children'> & {
   src?: string;
   /** Accessible alt text. Optional: the render gate, not the type, requires a resolved value. */
   alt?: string;
-  /** Navigation destination; defaults to the configured home. Dropped when it fails the safety check. */
-  href?: string;
+  /** Navigation destination; defaults to the home page. A string that fails the safety check is dropped. */
+  href?: PageRef | string;
   /** Image loading strategy. `eager` suits the above-the-fold header; author `lazy` below it. */
   loading?: 'lazy' | 'eager';
   /** Merchant-authored logo, sliced from the page/layout content entry; wins over the props when

package/dist/particles/logo/logo.js

@@ -55,8 +55,8 @@ const LogoDefinition = defineComponent({
 			label: "Alt Text"
 		},
 		href: {
-			type: "string",
-			default: "/",
+			type: "link",
+			default: { standard: "home" },
 			label: "Link Destination"
 		},
 		loading: {
@@ -67,13 +67,12 @@ const LogoDefinition = defineComponent({
 	},
 	guideline: "Brand logo linking to the configured home; a CMS entry overrides its src, alt, and href at runtime. Every prop is optional: an element bound to a CMS entry should author none of them, so an unconfigured store renders no logo instead of a placeholder. Author src and alt only where no entry supplies them, never as a fallback beside one. Size it responsively with a swatch on data-fs-logo, and reach the mark itself through data-fs-logo-image. A destination that is not an http, https, mailto, tel, or site-relative URL is dropped and the image renders unlinked. Loads eagerly for the above-the-fold header; set loading to lazy below the fold. Composes the Image and NavigationLink particles."
 });
-function Logo({ src, alt, href = "/", loading = "eager", $content, className, ...props }) {
+function Logo({ src, alt, href = { standard: "home" }, loading = "eager", $content, className, ...props }) {
 	const logoSrc = $content?.src?.trim() ? $content.src : src;
 	const logoAlt = $content?.alt ?? alt;
 	const logoHref = $content?.href?.trim() ? $content.href : href;
 	if (!logoSrc || !logoAlt?.trim()) return null;
-	const destination = resolveSafeHref(logoHref);
-	if (!destination.safe) console.warn("[Logo] link destination rejected", { reason: destination.reason });
+	const destination = resolveLogoHref(logoHref);
 	const image = /* @__PURE__ */ jsx(Image, {
 		src: logoSrc,
 		alt: logoAlt,
@@ -84,12 +83,25 @@ function Logo({ src, alt, href = "/", loading = "eager", $content, className, ..
 		...props,
 		className,
 		"data-fs-logo": "",
-		children: destination.safe ? /* @__PURE__ */ jsx(NavigationLink, {
-			href: destination.href,
+		children: destination === null ? image : /* @__PURE__ */ jsx(NavigationLink, {
+			href: destination,
 			children: image
-		}) : image
+		})
 	});
 }
+/**
+* A page reference skips the string allowlist. A string is checked, and a refusal drops the link.
+* No read-time validator enforces `format` or `pattern`, so this is the only gate on a CMS string.
+*/
+function resolveLogoHref(href) {
+	if (typeof href !== "string") return href;
+	const destination = resolveSafeHref(href);
+	if (!destination.safe) {
+		console.warn("[Logo] link destination rejected", { reason: destination.reason });
+		return null;
+	}
+	return destination.href;
+}
 //#endregion
 export { Logo, LogoContent, LogoDefinition };
 

package/dist/particles/logo/logo.js.map

@@ -1 +1 @@
-{"version":3,"file":"logo.js","names":[],"sources":["../../../src/particles/logo/logo.tsx"],"sourcesContent":["import { type ContentValue, defineComponent, defineContentType } from '@vtex/fs-core';\nimport type { ComponentPropsWithRef } from 'react';\nimport { resolveSafeHref } from '../../utils/safe-href.js';\nimport { Image } from '../image/image.js';\nimport { NavigationLink } from '../navigation-link/navigation-link.js';\n\n// `src` declares no `format`: a store's logo is usually a root-relative path served from its\n// `public/` folder (`/logo.svg`), which JSON Schema's `uri` format rejects.\nexport const LogoContent = defineContentType({\n  id: 'logo',\n  title: 'Logo',\n  description: 'Brand logo asset, alt text, and link destination.',\n  schema: {\n    type: 'object',\n    additionalProperties: false,\n    // `src` is optional so an entry authoring `alt` alone still validates: a slice missing a\n    // required property is shape-invalid, and the boundary drops the element instead of the field.\n    required: ['alt'],\n    properties: {\n      src: { type: 'string', minLength: 1, title: 'Source URL', widget: { 'ui:widget': 'media-gallery' } },\n      alt: { type: 'string', minLength: 1, title: 'Alt text' },\n      href: {\n        type: 'string',\n        minLength: 1,\n        title: 'Link destination',\n        format: 'uri-reference',\n        // The set `resolveSafeHref` admits, so the Admin form cannot reject a destination the render\n        // gate would have kept. Author-time only and lookahead-free, as in the sibling particles.\n        pattern: '^(?:https?://.*|mailto:.+|tel:.+|/(?:[^/].*)?)$',\n      },\n    },\n  },\n});\n\n/** Props for {@link Logo}. Extends native `<div>` attributes (the styling root). */\nexport type LogoProps = Omit<ComponentPropsWithRef<'div'>, 'children'> & {\n  /** Brand logo asset URL. Optional: the render gate, not the type, requires a resolved value. */\n  src?: string;\n  /** Accessible alt text. Optional: the render gate, not the type, requires a resolved value. */\n  alt?: string;\n  /** Navigation destination; defaults to the configured home. Dropped when it fails the safety check. */\n  href?: string;\n  /** Image loading strategy. `eager` suits the above-the-fold header; author `lazy` below it. */\n  loading?: 'lazy' | 'eager';\n  /** Merchant-authored logo, sliced from the page/layout content entry; wins over the props when\n   *  present. Absent in a non-CMS store — the props are the fallback. */\n  $content?: ContentValue<typeof LogoContent>;\n};\n\nexport const LogoDefinition = defineComponent<LogoProps>({\n  name: 'Logo',\n  importPath: '@vtex/faststore/components',\n  component: Logo,\n  content: LogoContent,\n  editor: { label: 'Logo', category: 'content' },\n  schema: {\n    src: { type: 'string', label: 'Source URL' },\n    alt: { type: 'string', label: 'Alt Text' },\n    href: { type: 'string', default: '/', label: 'Link Destination' },\n    loading: { type: ['lazy', 'eager'] as const, default: 'eager', label: 'Loading' },\n  },\n  guideline:\n    'Brand logo linking to the configured home; a CMS entry overrides its src, alt, and href at runtime. Every prop is optional: an element bound to a CMS entry should author none of them, so an unconfigured store renders no logo instead of a placeholder. Author src and alt only where no entry supplies them, never as a fallback beside one. Size it responsively with a swatch on data-fs-logo, and reach the mark itself through data-fs-logo-image. A destination that is not an http, https, mailto, tel, or site-relative URL is dropped and the image renders unlinked. Loads eagerly for the above-the-fold header; set loading to lazy below the fold. Composes the Image and NavigationLink particles.',\n});\n\nexport function Logo({ src, alt, href = '/', loading = 'eager', $content, className, ...props }: LogoProps) {\n  // The optional content fields fall through when blank, so clearing one in the Admin reads as\n  // unauthored. `alt` is required in the model, so a blank value is a violation the gate rejects.\n  const logoSrc = $content?.src?.trim() ? $content.src : src;\n  const logoAlt = $content?.alt ?? alt;\n  const logoHref = $content?.href?.trim() ? $content.href : href;\n\n  if (!logoSrc || !logoAlt?.trim()) {\n    return null;\n  }\n\n  // No read-time validator enforces `format` or `pattern`, so this is the only gate on the CMS value.\n  const destination = resolveSafeHref(logoHref);\n  if (!destination.safe) {\n    // A bounded reason and no authored value, the convention the content runtime's own log follows.\n    console.warn('[Logo] link destination rejected', { reason: destination.reason });\n  }\n\n  const image = <Image src={logoSrc} alt={logoAlt} loading={loading} data-fs-logo-image=\"\" />;\n\n  return (\n    <div {...props} className={className} data-fs-logo=\"\">\n      {destination.safe ? <NavigationLink href={destination.href}>{image}</NavigationLink> : image}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;AAQA,MAAa,cAAc,kBAAkB;CAC3C,IAAI;CACJ,OAAO;CACP,aAAa;CACb,QAAQ;EACN,MAAM;EACN,sBAAsB;EAGtB,UAAU,CAAC,KAAK;EAChB,YAAY;GACV,KAAK;IAAE,MAAM;IAAU,WAAW;IAAG,OAAO;IAAc,QAAQ,EAAE,aAAa,gBAAgB;GAAE;GACnG,KAAK;IAAE,MAAM;IAAU,WAAW;IAAG,OAAO;GAAW;GACvD,MAAM;IACJ,MAAM;IACN,WAAW;IACX,OAAO;IACP,QAAQ;IAGR,SAAS;GACX;EACF;CACF;AACF,CAAC;AAiBD,MAAa,iBAAiB,gBAA2B;CACvD,MAAM;CACN,YAAY;CACZ,WAAW;CACX,SAAS;CACT,QAAQ;EAAE,OAAO;EAAQ,UAAU;CAAU;CAC7C,QAAQ;EACN,KAAK;GAAE,MAAM;GAAU,OAAO;EAAa;EAC3C,KAAK;GAAE,MAAM;GAAU,OAAO;EAAW;EACzC,MAAM;GAAE,MAAM;GAAU,SAAS;GAAK,OAAO;EAAmB;EAChE,SAAS;GAAE,MAAM,CAAC,QAAQ,OAAO;GAAY,SAAS;GAAS,OAAO;EAAU;CAClF;CACA,WACE;AACJ,CAAC;AAED,SAAgB,KAAK,EAAE,KAAK,KAAK,OAAO,KAAK,UAAU,SAAS,UAAU,WAAW,GAAG,SAAoB;CAG1G,MAAM,UAAU,UAAU,KAAK,KAAK,IAAI,SAAS,MAAM;CACvD,MAAM,UAAU,UAAU,OAAO;CACjC,MAAM,WAAW,UAAU,MAAM,KAAK,IAAI,SAAS,OAAO;CAE1D,IAAI,CAAC,WAAW,CAAC,SAAS,KAAK,GAC7B,OAAO;CAIT,MAAM,cAAc,gBAAgB,QAAQ;CAC5C,IAAI,CAAC,YAAY,MAEf,QAAQ,KAAK,oCAAoC,EAAE,QAAQ,YAAY,OAAO,CAAC;CAGjF,MAAM,QAAQ,oBAAC,OAAD;EAAO,KAAK;EAAS,KAAK;EAAkB;EAAS,sBAAmB;CAAI,CAAA;CAE1F,OACE,oBAAC,OAAD;EAAK,GAAI;EAAkB;EAAW,gBAAa;EAChD,UAAA,YAAY,OAAO,oBAAC,gBAAD;GAAgB,MAAM,YAAY;GAAO,UAAA;EAAsB,CAAA,IAAI;CACpF,CAAA;AAET"}
+{"version":3,"file":"logo.js","names":[],"sources":["../../../src/particles/logo/logo.tsx"],"sourcesContent":["import { type ContentValue, defineComponent, defineContentType } from '@vtex/fs-core';\nimport type { ComponentPropsWithRef } from 'react';\nimport type { PageRef } from '../../sdk/navigation/types.js';\nimport { resolveSafeHref } from '../../utils/safe-href.js';\nimport { Image } from '../image/image.js';\nimport { NavigationLink } from '../navigation-link/navigation-link.js';\n\n// `src` declares no `format`: a store's logo is usually a root-relative path served from its\n// `public/` folder (`/logo.svg`), which JSON Schema's `uri` format rejects.\nexport const LogoContent = defineContentType({\n  id: 'logo',\n  title: 'Logo',\n  description: 'Brand logo asset, alt text, and link destination.',\n  schema: {\n    type: 'object',\n    additionalProperties: false,\n    // `src` is optional so an entry authoring `alt` alone still validates: a slice missing a\n    // required property is shape-invalid, and the boundary drops the element instead of the field.\n    required: ['alt'],\n    properties: {\n      src: { type: 'string', minLength: 1, title: 'Source URL', widget: { 'ui:widget': 'media-gallery' } },\n      alt: { type: 'string', minLength: 1, title: 'Alt text' },\n      href: {\n        type: 'string',\n        minLength: 1,\n        title: 'Link destination',\n        format: 'uri-reference',\n        // The set `resolveSafeHref` admits, so the Admin form cannot reject a destination the render\n        // gate would have kept. Author-time only and lookahead-free, as in the sibling particles.\n        pattern: '^(?:https?://.*|mailto:.+|tel:.+|/(?:[^/].*)?)$',\n      },\n    },\n  },\n});\n\n/** Props for {@link Logo}. Extends native `<div>` attributes (the styling root). */\nexport type LogoProps = Omit<ComponentPropsWithRef<'div'>, 'children'> & {\n  /** Brand logo asset URL. Optional: the render gate, not the type, requires a resolved value. */\n  src?: string;\n  /** Accessible alt text. Optional: the render gate, not the type, requires a resolved value. */\n  alt?: string;\n  /** Navigation destination; defaults to the home page. A string that fails the safety check is dropped. */\n  href?: PageRef | string;\n  /** Image loading strategy. `eager` suits the above-the-fold header; author `lazy` below it. */\n  loading?: 'lazy' | 'eager';\n  /** Merchant-authored logo, sliced from the page/layout content entry; wins over the props when\n   *  present. Absent in a non-CMS store — the props are the fallback. */\n  $content?: ContentValue<typeof LogoContent>;\n};\n\nexport const LogoDefinition = defineComponent<LogoProps>({\n  name: 'Logo',\n  importPath: '@vtex/faststore/components',\n  component: Logo,\n  content: LogoContent,\n  editor: { label: 'Logo', category: 'content' },\n  schema: {\n    src: { type: 'string', label: 'Source URL' },\n    alt: { type: 'string', label: 'Alt Text' },\n    href: { type: 'link', default: { standard: 'home' }, label: 'Link Destination' },\n    loading: { type: ['lazy', 'eager'] as const, default: 'eager', label: 'Loading' },\n  },\n  guideline:\n    'Brand logo linking to the configured home; a CMS entry overrides its src, alt, and href at runtime. Every prop is optional: an element bound to a CMS entry should author none of them, so an unconfigured store renders no logo instead of a placeholder. Author src and alt only where no entry supplies them, never as a fallback beside one. Size it responsively with a swatch on data-fs-logo, and reach the mark itself through data-fs-logo-image. A destination that is not an http, https, mailto, tel, or site-relative URL is dropped and the image renders unlinked. Loads eagerly for the above-the-fold header; set loading to lazy below the fold. Composes the Image and NavigationLink particles.',\n});\n\nexport function Logo({\n  src,\n  alt,\n  href = { standard: 'home' },\n  loading = 'eager',\n  $content,\n  className,\n  ...props\n}: LogoProps) {\n  // The optional content fields fall through when blank, so clearing one in the Admin reads as\n  // unauthored. `alt` is required in the model, so a blank value is a violation the gate rejects.\n  const logoSrc = $content?.src?.trim() ? $content.src : src;\n  const logoAlt = $content?.alt ?? alt;\n  // A non-blank CMS string wins, and a refusal drops the link rather than falling back to the prop.\n  const logoHref = $content?.href?.trim() ? $content.href : href;\n\n  if (!logoSrc || !logoAlt?.trim()) {\n    return null;\n  }\n\n  const destination = resolveLogoHref(logoHref);\n  const image = <Image src={logoSrc} alt={logoAlt} loading={loading} data-fs-logo-image=\"\" />;\n\n  return (\n    <div {...props} className={className} data-fs-logo=\"\">\n      {destination === null ? image : <NavigationLink href={destination}>{image}</NavigationLink>}\n    </div>\n  );\n}\n\n/**\n * A page reference skips the string allowlist. A string is checked, and a refusal drops the link.\n * No read-time validator enforces `format` or `pattern`, so this is the only gate on a CMS string.\n */\nfunction resolveLogoHref(href: PageRef | string): PageRef | string | null {\n  if (typeof href !== 'string') return href;\n\n  const destination = resolveSafeHref(href);\n  if (!destination.safe) {\n    // A bounded reason and no authored value, the convention the content runtime's own log follows.\n    console.warn('[Logo] link destination rejected', { reason: destination.reason });\n    return null;\n  }\n\n  return destination.href;\n}\n"],"mappings":";;;;;;;;AASA,MAAa,cAAc,kBAAkB;CAC3C,IAAI;CACJ,OAAO;CACP,aAAa;CACb,QAAQ;EACN,MAAM;EACN,sBAAsB;EAGtB,UAAU,CAAC,KAAK;EAChB,YAAY;GACV,KAAK;IAAE,MAAM;IAAU,WAAW;IAAG,OAAO;IAAc,QAAQ,EAAE,aAAa,gBAAgB;GAAE;GACnG,KAAK;IAAE,MAAM;IAAU,WAAW;IAAG,OAAO;GAAW;GACvD,MAAM;IACJ,MAAM;IACN,WAAW;IACX,OAAO;IACP,QAAQ;IAGR,SAAS;GACX;EACF;CACF;AACF,CAAC;AAiBD,MAAa,iBAAiB,gBAA2B;CACvD,MAAM;CACN,YAAY;CACZ,WAAW;CACX,SAAS;CACT,QAAQ;EAAE,OAAO;EAAQ,UAAU;CAAU;CAC7C,QAAQ;EACN,KAAK;GAAE,MAAM;GAAU,OAAO;EAAa;EAC3C,KAAK;GAAE,MAAM;GAAU,OAAO;EAAW;EACzC,MAAM;GAAE,MAAM;GAAQ,SAAS,EAAE,UAAU,OAAO;GAAG,OAAO;EAAmB;EAC/E,SAAS;GAAE,MAAM,CAAC,QAAQ,OAAO;GAAY,SAAS;GAAS,OAAO;EAAU;CAClF;CACA,WACE;AACJ,CAAC;AAED,SAAgB,KAAK,EACnB,KACA,KACA,OAAO,EAAE,UAAU,OAAO,GAC1B,UAAU,SACV,UACA,WACA,GAAG,SACS;CAGZ,MAAM,UAAU,UAAU,KAAK,KAAK,IAAI,SAAS,MAAM;CACvD,MAAM,UAAU,UAAU,OAAO;CAEjC,MAAM,WAAW,UAAU,MAAM,KAAK,IAAI,SAAS,OAAO;CAE1D,IAAI,CAAC,WAAW,CAAC,SAAS,KAAK,GAC7B,OAAO;CAGT,MAAM,cAAc,gBAAgB,QAAQ;CAC5C,MAAM,QAAQ,oBAAC,OAAD;EAAO,KAAK;EAAS,KAAK;EAAkB;EAAS,sBAAmB;CAAI,CAAA;CAE1F,OACE,oBAAC,OAAD;EAAK,GAAI;EAAkB;EAAW,gBAAa;EAChD,UAAA,gBAAgB,OAAO,QAAQ,oBAAC,gBAAD;GAAgB,MAAM;GAAc,UAAA;EAAsB,CAAA;CACvF,CAAA;AAET;;;;;AAMA,SAAS,gBAAgB,MAAiD;CACxE,IAAI,OAAO,SAAS,UAAU,OAAO;CAErC,MAAM,cAAc,gBAAgB,IAAI;CACxC,IAAI,CAAC,YAAY,MAAM;EAErB,QAAQ,KAAK,oCAAoC,EAAE,QAAQ,YAAY,OAAO,CAAC;EAC/E,OAAO;CACT;CAEA,OAAO,YAAY;AACrB"}

package/dist/particles/navigation-link/navigation-link.d.ts

@@ -1,8 +1,7 @@
 import { ContentValue } from "../../core/dist/define-content-type.js";
 import { ComponentDefinition } from "../../core/dist/define-component.js";
 import "../../core/dist/index.js";
-import { ComponentPropsWithRef } from "react";
-import Link from "next/link";
+import { StorefrontLinkProps } from "../../sdk/navigation/storefront-link.js";
 //#region src/particles/navigation-link/navigation-link.d.ts
 export declare const NavigationLinkContent: {
   readonly id: "navigation-link";
@@ -32,7 +31,7 @@ export declare const NavigationLinkContent: {
     };
   };
 };
-export type NavigationLinkProps = ComponentPropsWithRef<typeof Link> & {
+export type NavigationLinkProps = StorefrontLinkProps & {
   /** Merchant-authored link, sliced from the page/layout content entry; wins over the props field by
    *  field when present. Absent in a non-CMS store — the props are the fallback. */
   $content?: ContentValue<typeof NavigationLinkContent>;

package/dist/particles/navigation-link/navigation-link.js

@@ -3,8 +3,8 @@ import { defineComponent } from "../../core/dist/define-component.js";
 import { defineContentType } from "../../core/dist/define-content-type.js";
 import "../../core/dist/index.js";
 import { resolveSafeHref } from "../../utils/safe-href.js";
+import { StorefrontLink } from "../../sdk/navigation/storefront-link.js";
 import { jsx } from "react/jsx-runtime";
-import Link from "next/link";
 //#region src/particles/navigation-link/navigation-link.tsx
 const NavigationLinkContent = defineContentType({
 	id: "navigation-link",
@@ -45,7 +45,7 @@ const NavigationLinkDefinition = defineComponent({
 	},
 	schema: {
 		href: {
-			type: "string",
+			type: "link",
 			label: "URL"
 		},
 		target: {
@@ -54,7 +54,7 @@ const NavigationLinkDefinition = defineComponent({
 			label: "Target"
 		}
 	},
-	guideline: "Client-side navigation link built on Next.js Link. Use for all internal navigation to avoid full-page reloads. Set target to _blank to open the destination in a new tab; when you do, write an \"(opens in new tab)\" cue into the link text, because the component adds no announcement of its own. A CMS entry overrides the link text, href, and target at runtime; a destination it supplies that is not an http, https, mailto, tel, or site-relative URL is refused and the authored href stands."
+	guideline: "Client-side navigation link that renders StorefrontLink, where href is a page reference or a logical path. Use for all internal navigation to avoid full-page reloads. Set target to _blank to open the destination in a new tab; when you do, write an \"(opens in new tab)\" cue into the link text, because the component adds no announcement of its own. A CMS entry overrides the link text, href, and target at runtime; a destination it supplies that is not an http, https, mailto, tel, or site-relative URL is refused and the authored href stands."
 });
 function NavigationLink({ href, className, children, target, rel, $content, ...props }) {
 	const entryDestination = $content?.href?.trim() ? resolveSafeHref($content.href) : null;
@@ -66,7 +66,7 @@ function NavigationLink({ href, className, children, target, rel, $content, ...p
 	const relTokens = rel?.split(/\s+/).filter(Boolean) ?? [];
 	const present = new Set(relTokens.map((token) => token.toLowerCase()));
 	const safeRel = opensNewTab ? [...relTokens, ...["noopener", "noreferrer"].filter((token) => !present.has(token))].join(" ") : rel;
-	return /* @__PURE__ */ jsx(Link, {
+	return /* @__PURE__ */ jsx(StorefrontLink, {
 		...props,
 		href: linkHref,
 		target: linkTarget,

package/dist/particles/navigation-link/navigation-link.js.map

@@ -1 +1 @@
-{"version":3,"file":"navigation-link.js","names":[],"sources":["../../../src/particles/navigation-link/navigation-link.tsx"],"sourcesContent":["'use client';\n\nimport { type ContentValue, defineComponent, defineContentType } from '@vtex/fs-core';\nimport Link from 'next/link';\nimport type { ComponentPropsWithRef } from 'react';\nimport { resolveSafeHref } from '../../utils/safe-href.js';\n\n// Only `text` is required — an entry that just retitles a link should not force the merchant to\n// retype its destination.\nexport const NavigationLinkContent = defineContentType({\n  id: 'navigation-link',\n  title: 'Navigation Link',\n  description: 'Link label, destination, and whether it opens in a new tab.',\n  schema: {\n    type: 'object',\n    additionalProperties: false,\n    required: ['text'],\n    properties: {\n      text: { type: 'string', minLength: 1, title: 'Label' },\n      href: {\n        type: 'string',\n        title: 'Destination',\n        // `uri-reference` rather than `uri`, which rejects the root-relative paths most navigation\n        // targets are. Author-time guidance only and lookahead-free, as in the sibling particles;\n        // the empty alternative is this model's own, since clearing the field has to stay saveable.\n        format: 'uri-reference',\n        pattern: '^$|^(?:https?://.*|mailto:.+|tel:.+|/(?:[^/].*)?)$',\n      },\n      target: { type: 'string', enum: ['_self', '_blank'], title: 'Target' },\n    },\n  },\n});\n\nexport type NavigationLinkProps = ComponentPropsWithRef<typeof Link> & {\n  /** Merchant-authored link, sliced from the page/layout content entry; wins over the props field by\n   *  field when present. Absent in a non-CMS store — the props are the fallback. */\n  $content?: ContentValue<typeof NavigationLinkContent>;\n};\n\nexport const NavigationLinkDefinition = defineComponent<NavigationLinkProps>({\n  name: 'NavigationLink',\n  importPath: '@vtex/faststore/components',\n  component: NavigationLink,\n  content: NavigationLinkContent,\n  editor: { label: 'Navigation Link', category: 'navigation' },\n  schema: {\n    href: { type: 'string', label: 'URL' },\n    target: { type: ['_self', '_blank'] as const, default: '_self', label: 'Target' },\n  },\n  guideline:\n    'Client-side navigation link built on Next.js Link. Use for all internal navigation to avoid full-page reloads. Set target to _blank to open the destination in a new tab; when you do, write an \"(opens in new tab)\" cue into the link text, because the component adds no announcement of its own. A CMS entry overrides the link text, href, and target at runtime; a destination it supplies that is not an http, https, mailto, tel, or site-relative URL is refused and the authored href stands.',\n});\n\nexport function NavigationLink({ href, className, children, target, rel, $content, ...props }: NavigationLinkProps) {\n  // Resolve the entry before deriving anything from `target`: a _blank arriving from the CMS needs the\n  // same tab-nabbing defense as an authored one. `href` and `text` fall back on a blank entry field so\n  // a cleared value keeps the authored link rather than emitting an empty destination or label.\n  // Only the entry's destination goes through the allowlist: the prop comes from the store's own\n  // source, while nothing enforces the model's shape on the value the Admin supplies. A refused\n  // destination falls back the same way a cleared one does.\n  const entryDestination = $content?.href?.trim() ? resolveSafeHref($content.href) : null;\n  if (entryDestination && !entryDestination.safe) {\n    // A bounded reason and no authored value, the convention the content runtime's own log follows.\n    console.warn('[NavigationLink] link destination rejected', { reason: entryDestination.reason });\n  }\n  const linkHref = entryDestination?.safe ? entryDestination.href : href;\n  const linkTarget = $content?.target ?? target;\n  const linkText = $content?.text?.trim() ? $content.text : children;\n\n  // Target keywords are ASCII case-insensitive per HTML, so _BLANK opens a new tab just like _blank.\n  const opensNewTab = linkTarget?.toLowerCase() === '_blank';\n  // Append rather than replace: a composing matter may pass its own rel, and the tab-nabbing defense has to survive it.\n  // Link types are case-insensitive too, so a caller-passed NOOPENER already counts as noopener.\n  const relTokens = rel?.split(/\\s+/).filter(Boolean) ?? [];\n  const present = new Set(relTokens.map((token) => token.toLowerCase()));\n  const safeRel = opensNewTab\n    ? [...relTokens, ...['noopener', 'noreferrer'].filter((token) => !present.has(token))].join(' ')\n    : rel;\n\n  return (\n    <Link {...props} href={linkHref} target={linkTarget} rel={safeRel} className={className} data-fs-navigation-link=\"\">\n      {linkText}\n    </Link>\n  );\n}\n"],"mappings":";;;;;;;;AASA,MAAa,wBAAwB,kBAAkB;CACrD,IAAI;CACJ,OAAO;CACP,aAAa;CACb,QAAQ;EACN,MAAM;EACN,sBAAsB;EACtB,UAAU,CAAC,MAAM;EACjB,YAAY;GACV,MAAM;IAAE,MAAM;IAAU,WAAW;IAAG,OAAO;GAAQ;GACrD,MAAM;IACJ,MAAM;IACN,OAAO;IAIP,QAAQ;IACR,SAAS;GACX;GACA,QAAQ;IAAE,MAAM;IAAU,MAAM,CAAC,SAAS,QAAQ;IAAG,OAAO;GAAS;EACvE;CACF;AACF,CAAC;AAQD,MAAa,2BAA2B,gBAAqC;CAC3E,MAAM;CACN,YAAY;CACZ,WAAW;CACX,SAAS;CACT,QAAQ;EAAE,OAAO;EAAmB,UAAU;CAAa;CAC3D,QAAQ;EACN,MAAM;GAAE,MAAM;GAAU,OAAO;EAAM;EACrC,QAAQ;GAAE,MAAM,CAAC,SAAS,QAAQ;GAAY,SAAS;GAAS,OAAO;EAAS;CAClF;CACA,WACE;AACJ,CAAC;AAED,SAAgB,eAAe,EAAE,MAAM,WAAW,UAAU,QAAQ,KAAK,UAAU,GAAG,SAA8B;CAOlH,MAAM,mBAAmB,UAAU,MAAM,KAAK,IAAI,gBAAgB,SAAS,IAAI,IAAI;CACnF,IAAI,oBAAoB,CAAC,iBAAiB,MAExC,QAAQ,KAAK,8CAA8C,EAAE,QAAQ,iBAAiB,OAAO,CAAC;CAEhG,MAAM,WAAW,kBAAkB,OAAO,iBAAiB,OAAO;CAClE,MAAM,aAAa,UAAU,UAAU;CACvC,MAAM,WAAW,UAAU,MAAM,KAAK,IAAI,SAAS,OAAO;CAG1D,MAAM,cAAc,YAAY,YAAY,MAAM;CAGlD,MAAM,YAAY,KAAK,MAAM,KAAK,CAAC,CAAC,OAAO,OAAO,KAAK,CAAC;CACxD,MAAM,UAAU,IAAI,IAAI,UAAU,KAAK,UAAU,MAAM,YAAY,CAAC,CAAC;CACrE,MAAM,UAAU,cACZ,CAAC,GAAG,WAAW,GAAG,CAAC,YAAY,YAAY,CAAC,CAAC,QAAQ,UAAU,CAAC,QAAQ,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,IAC7F;CAEJ,OACE,oBAAC,MAAD;EAAM,GAAI;EAAO,MAAM;EAAU,QAAQ;EAAY,KAAK;EAAoB;EAAW,2BAAwB;EAC9G,UAAA;CACG,CAAA;AAEV"}
+{"version":3,"file":"navigation-link.js","names":[],"sources":["../../../src/particles/navigation-link/navigation-link.tsx"],"sourcesContent":["'use client';\n\nimport { type ContentValue, defineComponent, defineContentType } from '@vtex/fs-core';\nimport { StorefrontLink, type StorefrontLinkProps } from '../../sdk/navigation/storefront-link.js';\nimport { resolveSafeHref } from '../../utils/safe-href.js';\n\n// Only `text` is required — an entry that just retitles a link should not force the merchant to\n// retype its destination.\nexport const NavigationLinkContent = defineContentType({\n  id: 'navigation-link',\n  title: 'Navigation Link',\n  description: 'Link label, destination, and whether it opens in a new tab.',\n  schema: {\n    type: 'object',\n    additionalProperties: false,\n    required: ['text'],\n    properties: {\n      text: { type: 'string', minLength: 1, title: 'Label' },\n      href: {\n        type: 'string',\n        title: 'Destination',\n        // `uri-reference` rather than `uri`, which rejects the root-relative paths most navigation\n        // targets are. Author-time guidance only and lookahead-free, as in the sibling particles;\n        // the empty alternative is this model's own, since clearing the field has to stay saveable.\n        format: 'uri-reference',\n        pattern: '^$|^(?:https?://.*|mailto:.+|tel:.+|/(?:[^/].*)?)$',\n      },\n      target: { type: 'string', enum: ['_self', '_blank'], title: 'Target' },\n    },\n  },\n});\n\nexport type NavigationLinkProps = StorefrontLinkProps & {\n  /** Merchant-authored link, sliced from the page/layout content entry; wins over the props field by\n   *  field when present. Absent in a non-CMS store — the props are the fallback. */\n  $content?: ContentValue<typeof NavigationLinkContent>;\n};\n\nexport const NavigationLinkDefinition = defineComponent<NavigationLinkProps>({\n  name: 'NavigationLink',\n  importPath: '@vtex/faststore/components',\n  component: NavigationLink,\n  content: NavigationLinkContent,\n  editor: { label: 'Navigation Link', category: 'navigation' },\n  schema: {\n    href: { type: 'link', label: 'URL' },\n    target: { type: ['_self', '_blank'] as const, default: '_self', label: 'Target' },\n  },\n  guideline:\n    'Client-side navigation link that renders StorefrontLink, where href is a page reference or a logical path. Use for all internal navigation to avoid full-page reloads. Set target to _blank to open the destination in a new tab; when you do, write an \"(opens in new tab)\" cue into the link text, because the component adds no announcement of its own. A CMS entry overrides the link text, href, and target at runtime; a destination it supplies that is not an http, https, mailto, tel, or site-relative URL is refused and the authored href stands.',\n});\n\nexport function NavigationLink({ href, className, children, target, rel, $content, ...props }: NavigationLinkProps) {\n  // Resolve the entry before deriving anything from `target`: a _blank arriving from the CMS needs the\n  // same tab-nabbing defense as an authored one. `href` and `text` fall back on a blank entry field so\n  // a cleared value keeps the authored link rather than emitting an empty destination or label.\n  // Only the entry's destination goes through the allowlist: the prop comes from the store's own\n  // source, while nothing enforces the model's shape on the value the Admin supplies. A refused\n  // destination falls back the same way a cleared one does.\n  const entryDestination = $content?.href?.trim() ? resolveSafeHref($content.href) : null;\n  if (entryDestination && !entryDestination.safe) {\n    // A bounded reason and no authored value, the convention the content runtime's own log follows.\n    console.warn('[NavigationLink] link destination rejected', { reason: entryDestination.reason });\n  }\n  const linkHref = entryDestination?.safe ? entryDestination.href : href;\n  const linkTarget = $content?.target ?? target;\n  const linkText = $content?.text?.trim() ? $content.text : children;\n\n  // Target keywords are ASCII case-insensitive per HTML, so _BLANK opens a new tab just like _blank.\n  const opensNewTab = linkTarget?.toLowerCase() === '_blank';\n  // Append rather than replace: a composing matter may pass its own rel, and the tab-nabbing defense has to survive it.\n  // Link types are case-insensitive too, so a caller-passed NOOPENER already counts as noopener.\n  const relTokens = rel?.split(/\\s+/).filter(Boolean) ?? [];\n  const present = new Set(relTokens.map((token) => token.toLowerCase()));\n  const safeRel = opensNewTab\n    ? [...relTokens, ...['noopener', 'noreferrer'].filter((token) => !present.has(token))].join(' ')\n    : rel;\n\n  return (\n    <StorefrontLink\n      {...props}\n      href={linkHref}\n      target={linkTarget}\n      rel={safeRel}\n      className={className}\n      data-fs-navigation-link=\"\"\n    >\n      {linkText}\n    </StorefrontLink>\n  );\n}\n"],"mappings":";;;;;;;;AAQA,MAAa,wBAAwB,kBAAkB;CACrD,IAAI;CACJ,OAAO;CACP,aAAa;CACb,QAAQ;EACN,MAAM;EACN,sBAAsB;EACtB,UAAU,CAAC,MAAM;EACjB,YAAY;GACV,MAAM;IAAE,MAAM;IAAU,WAAW;IAAG,OAAO;GAAQ;GACrD,MAAM;IACJ,MAAM;IACN,OAAO;IAIP,QAAQ;IACR,SAAS;GACX;GACA,QAAQ;IAAE,MAAM;IAAU,MAAM,CAAC,SAAS,QAAQ;IAAG,OAAO;GAAS;EACvE;CACF;AACF,CAAC;AAQD,MAAa,2BAA2B,gBAAqC;CAC3E,MAAM;CACN,YAAY;CACZ,WAAW;CACX,SAAS;CACT,QAAQ;EAAE,OAAO;EAAmB,UAAU;CAAa;CAC3D,QAAQ;EACN,MAAM;GAAE,MAAM;GAAQ,OAAO;EAAM;EACnC,QAAQ;GAAE,MAAM,CAAC,SAAS,QAAQ;GAAY,SAAS;GAAS,OAAO;EAAS;CAClF;CACA,WACE;AACJ,CAAC;AAED,SAAgB,eAAe,EAAE,MAAM,WAAW,UAAU,QAAQ,KAAK,UAAU,GAAG,SAA8B;CAOlH,MAAM,mBAAmB,UAAU,MAAM,KAAK,IAAI,gBAAgB,SAAS,IAAI,IAAI;CACnF,IAAI,oBAAoB,CAAC,iBAAiB,MAExC,QAAQ,KAAK,8CAA8C,EAAE,QAAQ,iBAAiB,OAAO,CAAC;CAEhG,MAAM,WAAW,kBAAkB,OAAO,iBAAiB,OAAO;CAClE,MAAM,aAAa,UAAU,UAAU;CACvC,MAAM,WAAW,UAAU,MAAM,KAAK,IAAI,SAAS,OAAO;CAG1D,MAAM,cAAc,YAAY,YAAY,MAAM;CAGlD,MAAM,YAAY,KAAK,MAAM,KAAK,CAAC,CAAC,OAAO,OAAO,KAAK,CAAC;CACxD,MAAM,UAAU,IAAI,IAAI,UAAU,KAAK,UAAU,MAAM,YAAY,CAAC,CAAC;CACrE,MAAM,UAAU,cACZ,CAAC,GAAG,WAAW,GAAG,CAAC,YAAY,YAAY,CAAC,CAAC,QAAQ,UAAU,CAAC,QAAQ,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,IAC7F;CAEJ,OACE,oBAAC,gBAAD;EACE,GAAI;EACJ,MAAM;EACN,QAAQ;EACR,KAAK;EACM;EACX,2BAAwB;EAEvB,UAAA;CACa,CAAA;AAEpB"}

package/dist/particles/navigation-link-list/navigation-link-list.d.ts

@@ -1,6 +1,7 @@
 import { ContentValue } from "../../core/dist/define-content-type.js";
 import { ComponentDefinition } from "../../core/dist/define-component.js";
 import "../../core/dist/index.js";
+import { PageRef } from "../../sdk/navigation/types.js";
 import { ComponentPropsWithRef } from "react";
 //#region src/particles/navigation-link-list/navigation-link-list.d.ts
 export declare const NavigationLinkListContent: {
@@ -45,8 +46,11 @@ export declare const NavigationLinkListContent: {
   };
 };
 type NavigationLinkListContentValue = ContentValue<typeof NavigationLinkListContent>;
-/** One authored link. Derived from the model so the prop and content channels cannot drift. */
-export type NavigationLinkListLink = NonNullable<NavigationLinkListContentValue['links']>[number];
+type NavigationLinkListContentLink = NonNullable<NavigationLinkListContentValue['links']>[number];
+/** One authored link. The prop accepts a page reference; a CMS href stays a string. */
+export type NavigationLinkListLink = Omit<NavigationLinkListContentLink, 'href'> & {
+  href: PageRef | string;
+};
 export type NavigationLinkListProps = ComponentPropsWithRef<'ul'> & {
   /** Authored fallback for the link list, used when no CMS entry supplies one. */
   links?: readonly NavigationLinkListLink[];

package/dist/particles/navigation-link-list/navigation-link-list.js

@@ -59,25 +59,36 @@ const NavigationLinkListDefinition = defineComponent({
 	} },
 	guideline: "The list of navigation links as one CMS-editable collection, so a merchant adds, removes and reorders them without a deployment. Owns its own <ul>, so compose it directly under NavigationMenuRoot for the desktop bar and inside DrawerPopup for the mobile panel — reference the same element id from both and one entry feeds both surfaces. See navigation-link-list.md."
 });
+function readLinks(content, authored) {
+	if (content !== void 0) return content;
+	return authored ?? [];
+}
+function resolveDestination(href, index) {
+	if (typeof href !== "string") return href;
+	const destination = resolveSafeHref(href);
+	if (!destination.safe) {
+		console.warn("[NavigationLinkList] link destination rejected", {
+			index,
+			reason: destination.reason
+		});
+		return null;
+	}
+	return destination.href;
+}
 function resolveLinks(links) {
 	const resolved = [];
 	links.forEach((link, index) => {
 		if (link.label.trim().length === 0) return;
-		const destination = resolveSafeHref(link.href);
-		if (!destination.safe) console.warn("[NavigationLinkList] link destination rejected", {
-			index,
-			reason: destination.reason
-		});
 		resolved.push({
 			label: link.label,
-			href: destination.safe ? destination.href : null,
+			href: resolveDestination(link.href, index),
 			target: link.target
 		});
 	});
 	return resolved;
 }
 function NavigationLinkList({ links, $content, className, ...props }) {
-	const resolved = resolveLinks($content?.links ?? links ?? []);
+	const resolved = resolveLinks(readLinks($content?.links, links));
 	if (resolved.length === 0) return null;
 	return /* @__PURE__ */ jsx("ul", {
 		...props,

package/dist/particles/navigation-link-list/navigation-link-list.js.map

@@ -1 +1 @@
-{"version":3,"file":"navigation-link-list.js","names":[],"sources":["../../../src/particles/navigation-link-list/navigation-link-list.tsx"],"sourcesContent":["import { type ContentValue, defineComponent, defineContentType } from '@vtex/fs-core';\nimport type { ComponentPropsWithRef } from 'react';\nimport { resolveSafeHref } from '../../utils/safe-href.js';\nimport { NavigationLink } from '../navigation-link/navigation-link.js';\n\n// ---------------------------------------------------------------------------\n// Content model\n// ---------------------------------------------------------------------------\n\nexport const NavigationLinkListContent = defineContentType({\n  id: 'navigation-link-list',\n  title: 'Navigation Links',\n  description: 'The ordered list of navigation links, editable without a deployment.',\n  schema: {\n    type: 'object',\n    additionalProperties: false,\n    // `links` is not required, for the reason FooterLinkGroup records: a missing element key already\n    // omits the component, so requiring it would only cost the prop fallback its shape validity.\n    properties: {\n      links: {\n        type: 'array',\n        title: 'Links',\n        minItems: 1,\n        items: {\n          type: 'object',\n          additionalProperties: false,\n          required: ['label', 'href'],\n          properties: {\n            label: { type: 'string', minLength: 1, title: 'Label' },\n            href: {\n              type: 'string',\n              minLength: 1,\n              title: 'URL',\n              format: 'uri-reference',\n              // Author-time guidance only, and lookahead-free so the Admin's RE2-family engine takes it.\n              pattern: '^(?:https?://.*|mailto:.+|tel:.+|/(?:[^/].*)?)$',\n            },\n            target: { type: 'string', enum: ['_self', '_blank'], default: '_self', title: 'Open in' },\n          },\n        },\n      },\n    },\n  },\n});\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\n\ntype NavigationLinkListContentValue = ContentValue<typeof NavigationLinkListContent>;\n\n/** One authored link. Derived from the model so the prop and content channels cannot drift. */\nexport type NavigationLinkListLink = NonNullable<NavigationLinkListContentValue['links']>[number];\n\nexport type NavigationLinkListProps = ComponentPropsWithRef<'ul'> & {\n  /** Authored fallback for the link list, used when no CMS entry supplies one. */\n  links?: readonly NavigationLinkListLink[];\n  /** Injected by the compiler, sliced from the page's or layout's composite content entry. */\n  $content?: NavigationLinkListContentValue;\n};\n\n// ---------------------------------------------------------------------------\n// Definition\n// ---------------------------------------------------------------------------\n\nexport const NavigationLinkListDefinition = defineComponent({\n  name: 'NavigationLinkList',\n  importPath: '@vtex/faststore/components',\n  component: NavigationLinkList,\n  content: NavigationLinkListContent,\n  editor: { label: 'Navigation Links', category: 'navigation' },\n  schema: {\n    links: { type: 'array', label: 'Links' },\n  },\n  guideline:\n    'The list of navigation links as one CMS-editable collection, so a merchant adds, removes and reorders them without a deployment. Owns its own <ul>, so compose it directly under NavigationMenuRoot for the desktop bar and inside DrawerPopup for the mobile panel — reference the same element id from both and one entry feeds both surfaces. See navigation-link-list.md.',\n});\n\n// ---------------------------------------------------------------------------\n// Implementation\n// ---------------------------------------------------------------------------\n\n/** A resolved link, ready to render. A null `href` is a destination the allowlist refused. */\ntype ResolvedLink = {\n  label: string;\n  href: string | null;\n  target: NavigationLinkListLink['target'];\n};\n\nfunction resolveLinks(links: readonly NavigationLinkListLink[]): ResolvedLink[] {\n  const resolved: ResolvedLink[] = [];\n\n  links.forEach((link, index) => {\n    // `minLength` is enforced by neither the runtime slice nor the preflight, so a blank label\n    // reaches the component. Drop the link: an anchor with no accessible name is a WCAG failure.\n    if (link.label.trim().length === 0) {\n      return;\n    }\n    const destination = resolveSafeHref(link.href);\n    if (!destination.safe) {\n      console.warn('[NavigationLinkList] link destination rejected', { index, reason: destination.reason });\n    }\n    resolved.push({\n      label: link.label,\n      href: destination.safe ? destination.href : null,\n      target: link.target,\n    });\n  });\n\n  return resolved;\n}\n\nexport function NavigationLinkList({ links, $content, className, ...props }: NavigationLinkListProps) {\n  // An entry supplying `links: []` beats an authored prop: a merchant who cleared the list cleared it.\n  // `minItems` guides the Admin form only, so that empty list still reaches this component.\n  const resolved = resolveLinks($content?.links ?? links ?? []);\n\n  if (resolved.length === 0) {\n    return null;\n  }\n\n  return (\n    <ul {...props} className={className} data-fs-navigation-link-list=\"\">\n      {resolved.map((link, index) => (\n        <li key={index} data-fs-navigation-link-list-item=\"\">\n          {link.href === null ? (\n            <span data-fs-text=\"\" data-fs-navigation-link-list-text=\"\">\n              {link.label}\n            </span>\n          ) : (\n            // `target` reaches NavigationLink as a prop, which is where the tab-nabbing defense\n            // lives: it derives rel from the resolved target, so `_blank` carries noopener/noreferrer.\n            <NavigationLink href={link.href} target={link.target}>\n              {link.label}\n            </NavigationLink>\n          )}\n        </li>\n      ))}\n    </ul>\n  );\n}\n"],"mappings":";;;;;;;AASA,MAAa,4BAA4B,kBAAkB;CACzD,IAAI;CACJ,OAAO;CACP,aAAa;CACb,QAAQ;EACN,MAAM;EACN,sBAAsB;EAGtB,YAAY,EACV,OAAO;GACL,MAAM;GACN,OAAO;GACP,UAAU;GACV,OAAO;IACL,MAAM;IACN,sBAAsB;IACtB,UAAU,CAAC,SAAS,MAAM;IAC1B,YAAY;KACV,OAAO;MAAE,MAAM;MAAU,WAAW;MAAG,OAAO;KAAQ;KACtD,MAAM;MACJ,MAAM;MACN,WAAW;MACX,OAAO;MACP,QAAQ;MAER,SAAS;KACX;KACA,QAAQ;MAAE,MAAM;MAAU,MAAM,CAAC,SAAS,QAAQ;MAAG,SAAS;MAAS,OAAO;KAAU;IAC1F;GACF;EACF,EACF;CACF;AACF,CAAC;AAsBD,MAAa,+BAA+B,gBAAgB;CAC1D,MAAM;CACN,YAAY;CACZ,WAAW;CACX,SAAS;CACT,QAAQ;EAAE,OAAO;EAAoB,UAAU;CAAa;CAC5D,QAAQ,EACN,OAAO;EAAE,MAAM;EAAS,OAAO;CAAQ,EACzC;CACA,WACE;AACJ,CAAC;AAaD,SAAS,aAAa,OAA0D;CAC9E,MAAM,WAA2B,CAAC;CAElC,MAAM,SAAS,MAAM,UAAU;EAG7B,IAAI,KAAK,MAAM,KAAK,CAAC,CAAC,WAAW,GAC/B;EAEF,MAAM,cAAc,gBAAgB,KAAK,IAAI;EAC7C,IAAI,CAAC,YAAY,MACf,QAAQ,KAAK,kDAAkD;GAAE;GAAO,QAAQ,YAAY;EAAO,CAAC;EAEtG,SAAS,KAAK;GACZ,OAAO,KAAK;GACZ,MAAM,YAAY,OAAO,YAAY,OAAO;GAC5C,QAAQ,KAAK;EACf,CAAC;CACH,CAAC;CAED,OAAO;AACT;AAEA,SAAgB,mBAAmB,EAAE,OAAO,UAAU,WAAW,GAAG,SAAkC;CAGpG,MAAM,WAAW,aAAa,UAAU,SAAS,SAAS,CAAC,CAAC;CAE5D,IAAI,SAAS,WAAW,GACtB,OAAO;CAGT,OACE,oBAAC,MAAD;EAAI,GAAI;EAAkB;EAAW,gCAA6B;EAC/D,UAAA,SAAS,KAAK,MAAM,UACnB,oBAAC,MAAD;GAAgB,qCAAkC;GAC/C,UAAA,KAAK,SAAS,OACb,oBAAC,QAAD;IAAM,gBAAa;IAAG,qCAAkC;IACrD,UAAA,KAAK;GACF,CAAA,IAIN,oBAAC,gBAAD;IAAgB,MAAM,KAAK;IAAM,QAAQ,KAAK;IAC3C,UAAA,KAAK;GACQ,CAAA;EAEhB,GAZK,KAYL,CACL;CACC,CAAA;AAER"}
+{"version":3,"file":"navigation-link-list.js","names":[],"sources":["../../../src/particles/navigation-link-list/navigation-link-list.tsx"],"sourcesContent":["import { type ContentValue, defineComponent, defineContentType } from '@vtex/fs-core';\nimport type { ComponentPropsWithRef } from 'react';\nimport type { PageRef } from '../../sdk/navigation/types.js';\nimport { resolveSafeHref } from '../../utils/safe-href.js';\nimport { NavigationLink } from '../navigation-link/navigation-link.js';\n\n// ---------------------------------------------------------------------------\n// Content model\n// ---------------------------------------------------------------------------\n\nexport const NavigationLinkListContent = defineContentType({\n  id: 'navigation-link-list',\n  title: 'Navigation Links',\n  description: 'The ordered list of navigation links, editable without a deployment.',\n  schema: {\n    type: 'object',\n    additionalProperties: false,\n    // `links` is not required, for the reason FooterLinkGroup records: a missing element key already\n    // omits the component, so requiring it would only cost the prop fallback its shape validity.\n    properties: {\n      links: {\n        type: 'array',\n        title: 'Links',\n        minItems: 1,\n        items: {\n          type: 'object',\n          additionalProperties: false,\n          required: ['label', 'href'],\n          properties: {\n            label: { type: 'string', minLength: 1, title: 'Label' },\n            href: {\n              type: 'string',\n              minLength: 1,\n              title: 'URL',\n              format: 'uri-reference',\n              // Author-time guidance only, and lookahead-free so the Admin's RE2-family engine takes it.\n              pattern: '^(?:https?://.*|mailto:.+|tel:.+|/(?:[^/].*)?)$',\n            },\n            target: { type: 'string', enum: ['_self', '_blank'], default: '_self', title: 'Open in' },\n          },\n        },\n      },\n    },\n  },\n});\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\n\ntype NavigationLinkListContentValue = ContentValue<typeof NavigationLinkListContent>;\n\ntype NavigationLinkListContentLink = NonNullable<NavigationLinkListContentValue['links']>[number];\n\n/** One authored link. The prop accepts a page reference; a CMS href stays a string. */\nexport type NavigationLinkListLink = Omit<NavigationLinkListContentLink, 'href'> & {\n  href: PageRef | string;\n};\n\nexport type NavigationLinkListProps = ComponentPropsWithRef<'ul'> & {\n  /** Authored fallback for the link list, used when no CMS entry supplies one. */\n  links?: readonly NavigationLinkListLink[];\n  /** Injected by the compiler, sliced from the page's or layout's composite content entry. */\n  $content?: NavigationLinkListContentValue;\n};\n\n// ---------------------------------------------------------------------------\n// Definition\n// ---------------------------------------------------------------------------\n\nexport const NavigationLinkListDefinition = defineComponent({\n  name: 'NavigationLinkList',\n  importPath: '@vtex/faststore/components',\n  component: NavigationLinkList,\n  content: NavigationLinkListContent,\n  editor: { label: 'Navigation Links', category: 'navigation' },\n  schema: {\n    links: { type: 'array', label: 'Links' },\n  },\n  guideline:\n    'The list of navigation links as one CMS-editable collection, so a merchant adds, removes and reorders them without a deployment. Owns its own <ul>, so compose it directly under NavigationMenuRoot for the desktop bar and inside DrawerPopup for the mobile panel — reference the same element id from both and one entry feeds both surfaces. See navigation-link-list.md.',\n});\n\n// ---------------------------------------------------------------------------\n// Implementation\n// ---------------------------------------------------------------------------\n\n/** A resolved link, ready to render. A null `href` is a destination the allowlist refused. */\ntype ResolvedLink = {\n  label: string;\n  href: PageRef | string | null;\n  target: NavigationLinkListLink['target'];\n};\n\nfunction readLinks(\n  content: readonly NavigationLinkListContentLink[] | undefined,\n  authored: readonly NavigationLinkListLink[] | undefined,\n): readonly NavigationLinkListLink[] {\n  if (content !== undefined) return content;\n  return authored ?? [];\n}\n\nfunction resolveDestination(href: PageRef | string, index: number): PageRef | string | null {\n  if (typeof href !== 'string') return href;\n\n  const destination = resolveSafeHref(href);\n  if (!destination.safe) {\n    console.warn('[NavigationLinkList] link destination rejected', { index, reason: destination.reason });\n    return null;\n  }\n  return destination.href;\n}\n\nfunction resolveLinks(links: readonly NavigationLinkListLink[]): ResolvedLink[] {\n  const resolved: ResolvedLink[] = [];\n\n  links.forEach((link, index) => {\n    // `minLength` is enforced by neither the runtime slice nor the preflight, so a blank label\n    // reaches the component. Drop the link: an anchor with no accessible name is a WCAG failure.\n    if (link.label.trim().length === 0) {\n      return;\n    }\n    resolved.push({\n      label: link.label,\n      href: resolveDestination(link.href, index),\n      target: link.target,\n    });\n  });\n\n  return resolved;\n}\n\nexport function NavigationLinkList({ links, $content, className, ...props }: NavigationLinkListProps) {\n  // An entry supplying `links: []` beats an authored prop: a merchant who cleared the list cleared it.\n  // `minItems` guides the Admin form only, so that empty list still reaches this component.\n  const resolved = resolveLinks(readLinks($content?.links, links));\n\n  if (resolved.length === 0) {\n    return null;\n  }\n\n  return (\n    <ul {...props} className={className} data-fs-navigation-link-list=\"\">\n      {resolved.map((link, index) => (\n        <li key={index} data-fs-navigation-link-list-item=\"\">\n          {link.href === null ? (\n            <span data-fs-text=\"\" data-fs-navigation-link-list-text=\"\">\n              {link.label}\n            </span>\n          ) : (\n            // `target` reaches NavigationLink as a prop, which is where the tab-nabbing defense\n            // lives: it derives rel from the resolved target, so `_blank` carries noopener/noreferrer.\n            <NavigationLink href={link.href} target={link.target}>\n              {link.label}\n            </NavigationLink>\n          )}\n        </li>\n      ))}\n    </ul>\n  );\n}\n"],"mappings":";;;;;;;AAUA,MAAa,4BAA4B,kBAAkB;CACzD,IAAI;CACJ,OAAO;CACP,aAAa;CACb,QAAQ;EACN,MAAM;EACN,sBAAsB;EAGtB,YAAY,EACV,OAAO;GACL,MAAM;GACN,OAAO;GACP,UAAU;GACV,OAAO;IACL,MAAM;IACN,sBAAsB;IACtB,UAAU,CAAC,SAAS,MAAM;IAC1B,YAAY;KACV,OAAO;MAAE,MAAM;MAAU,WAAW;MAAG,OAAO;KAAQ;KACtD,MAAM;MACJ,MAAM;MACN,WAAW;MACX,OAAO;MACP,QAAQ;MAER,SAAS;KACX;KACA,QAAQ;MAAE,MAAM;MAAU,MAAM,CAAC,SAAS,QAAQ;MAAG,SAAS;MAAS,OAAO;KAAU;IAC1F;GACF;EACF,EACF;CACF;AACF,CAAC;AA0BD,MAAa,+BAA+B,gBAAgB;CAC1D,MAAM;CACN,YAAY;CACZ,WAAW;CACX,SAAS;CACT,QAAQ;EAAE,OAAO;EAAoB,UAAU;CAAa;CAC5D,QAAQ,EACN,OAAO;EAAE,MAAM;EAAS,OAAO;CAAQ,EACzC;CACA,WACE;AACJ,CAAC;AAaD,SAAS,UACP,SACA,UACmC;CACnC,IAAI,YAAY,KAAA,GAAW,OAAO;CAClC,OAAO,YAAY,CAAC;AACtB;AAEA,SAAS,mBAAmB,MAAwB,OAAwC;CAC1F,IAAI,OAAO,SAAS,UAAU,OAAO;CAErC,MAAM,cAAc,gBAAgB,IAAI;CACxC,IAAI,CAAC,YAAY,MAAM;EACrB,QAAQ,KAAK,kDAAkD;GAAE;GAAO,QAAQ,YAAY;EAAO,CAAC;EACpG,OAAO;CACT;CACA,OAAO,YAAY;AACrB;AAEA,SAAS,aAAa,OAA0D;CAC9E,MAAM,WAA2B,CAAC;CAElC,MAAM,SAAS,MAAM,UAAU;EAG7B,IAAI,KAAK,MAAM,KAAK,CAAC,CAAC,WAAW,GAC/B;EAEF,SAAS,KAAK;GACZ,OAAO,KAAK;GACZ,MAAM,mBAAmB,KAAK,MAAM,KAAK;GACzC,QAAQ,KAAK;EACf,CAAC;CACH,CAAC;CAED,OAAO;AACT;AAEA,SAAgB,mBAAmB,EAAE,OAAO,UAAU,WAAW,GAAG,SAAkC;CAGpG,MAAM,WAAW,aAAa,UAAU,UAAU,OAAO,KAAK,CAAC;CAE/D,IAAI,SAAS,WAAW,GACtB,OAAO;CAGT,OACE,oBAAC,MAAD;EAAI,GAAI;EAAkB;EAAW,gCAA6B;EAC/D,UAAA,SAAS,KAAK,MAAM,UACnB,oBAAC,MAAD;GAAgB,qCAAkC;GAC/C,UAAA,KAAK,SAAS,OACb,oBAAC,QAAD;IAAM,gBAAa;IAAG,qCAAkC;IACrD,UAAA,KAAK;GACF,CAAA,IAIN,oBAAC,gBAAD;IAAgB,MAAM,KAAK;IAAM,QAAQ,KAAK;IAC3C,UAAA,KAAK;GACQ,CAAA;EAEhB,GAZK,KAYL,CACL;CACC,CAAA;AAER"}

package/dist/particles/order-details-back/order-details-back.d.ts

@@ -0,0 +1,28 @@
+import { ContentValue } from "../../core/dist/define-content-type.js";
+import { ComponentDefinition } from "../../core/dist/define-component.js";
+import "../../core/dist/index.js";
+import { ComponentPropsWithRef } from "react";
+//#region src/particles/order-details-back/order-details-back.d.ts
+export declare const OrderDetailsBackContent: {
+  readonly id: "order-details-back";
+  readonly title: "Order Details Back";
+  readonly description: "The link back to the order list.";
+  readonly schema: {
+    readonly type: "object";
+    readonly additionalProperties: false;
+    readonly properties: {
+      readonly label: {
+        readonly type: "string";
+        readonly title: "Label";
+      };
+    };
+  };
+};
+export type OrderDetailsBackContentValue = ContentValue<typeof OrderDetailsBackContent>;
+export type OrderDetailsBackProps = ComponentPropsWithRef<'a'> & {
+  $content?: OrderDetailsBackContentValue;
+};
+export declare const OrderDetailsBackDefinition: ComponentDefinition<OrderDetailsBackProps>;
+export declare function OrderDetailsBack({ className, ref, $content, ...props }: OrderDetailsBackProps): import("react/jsx-runtime").JSX.Element;
+//#endregion
+//# sourceMappingURL=order-details-back.d.ts.map

package/dist/particles/order-details-back/order-details-back.js

@@ -0,0 +1,52 @@
+"use client";
+import { defineComponent } from "../../core/dist/define-component.js";
+import { defineContentType } from "../../core/dist/define-content-type.js";
+import "../../core/dist/index.js";
+import { useIntl } from "../../sdk/i18n/client.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/particles/order-details-back/order-details-back.tsx
+const LIST_HREF = "/pvt/orders";
+const OrderDetailsBackContent = defineContentType({
+	id: "order-details-back",
+	title: "Order Details Back",
+	description: "The link back to the order list.",
+	schema: {
+		type: "object",
+		additionalProperties: false,
+		properties: { label: {
+			type: "string",
+			title: "Label"
+		} }
+	}
+});
+const OrderDetailsBackDefinition = defineComponent({
+	name: "OrderDetailsBack",
+	importPath: "@vtex/faststore/components",
+	component: OrderDetailsBack,
+	content: OrderDetailsBackContent,
+	editor: {
+		label: "Order Details Back",
+		category: "action"
+	},
+	schema: {},
+	guideline: "The return from one order to the order list. Place it first on the order page when the layout has no account breadcrumb. The label is content; a blank field keeps the catalogue."
+});
+function authored(value, fallback) {
+	return value?.trim() || fallback;
+}
+function OrderDetailsBack({ className, ref, $content, ...props }) {
+	const intl = useIntl();
+	const label = authored($content?.label, intl.formatMessage({ id: "fs/order.back-to-orders" }));
+	return /* @__PURE__ */ jsx("a", {
+		...props,
+		ref,
+		href: LIST_HREF,
+		className,
+		"data-fs-order-details-back": "",
+		children: label
+	});
+}
+//#endregion
+export { OrderDetailsBack, OrderDetailsBackContent, OrderDetailsBackDefinition };
+
+//# sourceMappingURL=order-details-back.js.map

package/dist/particles/order-details-back/order-details-back.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"order-details-back.js","names":[],"sources":["../../../src/particles/order-details-back/order-details-back.tsx"],"sourcesContent":["'use client';\n\nimport { type ContentValue, defineComponent, defineContentType } from '@vtex/fs-core';\nimport type { ComponentPropsWithRef } from 'react';\nimport { useIntl } from '../../sdk/i18n/client.js';\n\nconst LIST_HREF = '/pvt/orders';\n\nexport const OrderDetailsBackContent = defineContentType({\n  id: 'order-details-back',\n  title: 'Order Details Back',\n  description: 'The link back to the order list.',\n  schema: {\n    type: 'object',\n    additionalProperties: false,\n    properties: {\n      label: { type: 'string', title: 'Label' },\n    },\n  },\n});\n\nexport type OrderDetailsBackContentValue = ContentValue<typeof OrderDetailsBackContent>;\n\nexport type OrderDetailsBackProps = ComponentPropsWithRef<'a'> & {\n  $content?: OrderDetailsBackContentValue;\n};\n\nexport const OrderDetailsBackDefinition = defineComponent<OrderDetailsBackProps>({\n  name: 'OrderDetailsBack',\n  importPath: '@vtex/faststore/components',\n  component: OrderDetailsBack,\n  content: OrderDetailsBackContent,\n  editor: { label: 'Order Details Back', category: 'action' },\n  schema: {},\n  guideline:\n    'The return from one order to the order list. Place it first on the order page when the layout has no account breadcrumb. The label is content; a blank field keeps the catalogue.',\n});\n\nfunction authored(value: string | undefined, fallback: string): string {\n  const trimmed = value?.trim();\n  return trimmed || fallback;\n}\n\nexport function OrderDetailsBack({ className, ref, $content, ...props }: OrderDetailsBackProps) {\n  const intl = useIntl();\n  const label = authored($content?.label, intl.formatMessage({ id: 'fs/order.back-to-orders' }));\n\n  return (\n    <a {...props} ref={ref} href={LIST_HREF} className={className} data-fs-order-details-back=\"\">\n      {label}\n    </a>\n  );\n}\n"],"mappings":";;;;;;;AAMA,MAAM,YAAY;AAElB,MAAa,0BAA0B,kBAAkB;CACvD,IAAI;CACJ,OAAO;CACP,aAAa;CACb,QAAQ;EACN,MAAM;EACN,sBAAsB;EACtB,YAAY,EACV,OAAO;GAAE,MAAM;GAAU,OAAO;EAAQ,EAC1C;CACF;AACF,CAAC;AAQD,MAAa,6BAA6B,gBAAuC;CAC/E,MAAM;CACN,YAAY;CACZ,WAAW;CACX,SAAS;CACT,QAAQ;EAAE,OAAO;EAAsB,UAAU;CAAS;CAC1D,QAAQ,CAAC;CACT,WACE;AACJ,CAAC;AAED,SAAS,SAAS,OAA2B,UAA0B;CAErE,OADgB,OAAO,KAAK,KACV;AACpB;AAEA,SAAgB,iBAAiB,EAAE,WAAW,KAAK,UAAU,GAAG,SAAgC;CAC9F,MAAM,OAAO,QAAQ;CACrB,MAAM,QAAQ,SAAS,UAAU,OAAO,KAAK,cAAc,EAAE,IAAI,0BAA0B,CAAC,CAAC;CAE7F,OACE,oBAAC,KAAD;EAAG,GAAI;EAAY;EAAK,MAAM;EAAsB;EAAW,8BAA2B;EACvF,UAAA;CACA,CAAA;AAEP"}

package/dist/particles/order-status-badge/order-status-badge.d.ts

@@ -0,0 +1,19 @@
+import { ComponentDefinition } from "../../core/dist/define-component.js";
+import "../../core/dist/index.js";
+import { ComponentPropsWithRef } from "react";
+//#region src/particles/order-status-badge/order-status-badge.d.ts
+export type OrderStatusState = 'ongoing' | 'completed' | 'cancelled';
+export type OrderStatusTone = 'neutral' | 'progress' | 'success' | 'danger';
+export type OrderStatusMessageKey = 'cancelled' | 'cancellation-requested' | 'in-progress' | 'delivered' | 'shipped' | 'ready-for-pickup' | 'collected' | 'placeholder';
+/** Per-label sentences. A blank value keeps the catalogue sentence for that label. */
+export type OrderStatusMessages = Partial<Record<OrderStatusMessageKey, string>>;
+export type OrderStatusBadgeProps = Omit<ComponentPropsWithRef<'span'>, 'children'> & {
+  state: OrderStatusState;
+  tone: OrderStatusTone;
+  label: string;
+  messages?: OrderStatusMessages;
+};
+export declare const OrderStatusBadgeDefinition: ComponentDefinition<OrderStatusBadgeProps>;
+export declare function OrderStatusBadge({ state, tone, label, messages, className, ...props }: OrderStatusBadgeProps): import("react/jsx-runtime").JSX.Element;
+//#endregion
+//# sourceMappingURL=order-status-badge.d.ts.map

package/dist/particles/order-status-badge/order-status-badge.js

@@ -0,0 +1,50 @@
+"use client";
+import { defineComponent } from "../../core/dist/define-component.js";
+import "../../core/dist/index.js";
+import { useIntl } from "../../sdk/i18n/client.js";
+import { Badge } from "../badge/badge.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/particles/order-status-badge/order-status-badge.tsx
+const ORDER_STATUS_MESSAGES = {
+	cancelled: "fs/order-status.cancelled",
+	"cancellation-requested": "fs/order-status.cancellation-requested",
+	"in-progress": "fs/order-status.in-progress",
+	delivered: "fs/order-status.delivered",
+	shipped: "fs/order-status.shipped",
+	"ready-for-pickup": "fs/order-status.ready-for-pickup",
+	collected: "fs/order-status.collected"
+};
+function orderStatusMessageId(label) {
+	if (!Object.hasOwn(ORDER_STATUS_MESSAGES, label)) return "fs/order-status.placeholder";
+	return ORDER_STATUS_MESSAGES[label] ?? "fs/order-status.placeholder";
+}
+const OrderStatusBadgeDefinition = defineComponent({
+	name: "OrderStatusBadge",
+	importPath: "@vtex/faststore/components",
+	component: OrderStatusBadge,
+	editor: {
+		label: "Order Status Badge",
+		category: "content"
+	},
+	schema: {},
+	guideline: "Shopper-facing order status. Pass the completion view, the label id, and a tone. A messages entry replaces the catalogue sentence for that label; a blank entry and an unknown label keep the catalogue."
+});
+function messageKey(label) {
+	return Object.hasOwn(ORDER_STATUS_MESSAGES, label) ? label : "placeholder";
+}
+function OrderStatusBadge({ state, tone, label, messages, className, ...props }) {
+	const intl = useIntl();
+	const authored = messages?.[messageKey(label)]?.trim();
+	return /* @__PURE__ */ jsx(Badge, {
+		...props,
+		className,
+		"data-fs-order-status-badge": "",
+		"data-fs-order-status-badge-state": state,
+		"data-fs-order-status-badge-tone": tone,
+		children: authored || intl.formatMessage({ id: orderStatusMessageId(label) })
+	});
+}
+//#endregion
+export { OrderStatusBadge, OrderStatusBadgeDefinition };
+
+//# sourceMappingURL=order-status-badge.js.map

package/dist/particles/order-status-badge/order-status-badge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"order-status-badge.js","names":[],"sources":["../../../src/particles/order-status-badge/order-status-badge.tsx"],"sourcesContent":["'use client';\n\nimport { defineComponent } from '@vtex/fs-core';\nimport type { ComponentPropsWithRef } from 'react';\nimport { useIntl } from '../../sdk/i18n/client.js';\nimport type { MessageId } from '../../sdk/i18n/locales.js';\nimport { Badge } from '../badge/badge.js';\n\nexport type OrderStatusState = 'ongoing' | 'completed' | 'cancelled';\n\nexport type OrderStatusTone = 'neutral' | 'progress' | 'success' | 'danger';\n\nexport type OrderStatusMessageKey =\n  | 'cancelled'\n  | 'cancellation-requested'\n  | 'in-progress'\n  | 'delivered'\n  | 'shipped'\n  | 'ready-for-pickup'\n  | 'collected'\n  | 'placeholder';\n\n/** Per-label sentences. A blank value keeps the catalogue sentence for that label. */\nexport type OrderStatusMessages = Partial<Record<OrderStatusMessageKey, string>>;\n\nexport type OrderStatusBadgeProps = Omit<ComponentPropsWithRef<'span'>, 'children'> & {\n  state: OrderStatusState;\n  tone: OrderStatusTone;\n  label: string;\n  messages?: OrderStatusMessages;\n};\n\nconst ORDER_STATUS_MESSAGES: Record<string, MessageId> = {\n  cancelled: 'fs/order-status.cancelled',\n  'cancellation-requested': 'fs/order-status.cancellation-requested',\n  'in-progress': 'fs/order-status.in-progress',\n  delivered: 'fs/order-status.delivered',\n  shipped: 'fs/order-status.shipped',\n  'ready-for-pickup': 'fs/order-status.ready-for-pickup',\n  collected: 'fs/order-status.collected',\n};\n\nfunction orderStatusMessageId(label: string): MessageId {\n  // Bracket access walks Object.prototype, so \"constructor\" would skip the placeholder.\n  if (!Object.hasOwn(ORDER_STATUS_MESSAGES, label)) {\n    return 'fs/order-status.placeholder';\n  }\n\n  return ORDER_STATUS_MESSAGES[label] ?? 'fs/order-status.placeholder';\n}\n\nexport const OrderStatusBadgeDefinition = defineComponent<OrderStatusBadgeProps>({\n  name: 'OrderStatusBadge',\n  importPath: '@vtex/faststore/components',\n  component: OrderStatusBadge,\n  editor: { label: 'Order Status Badge', category: 'content' },\n  schema: {},\n  guideline:\n    'Shopper-facing order status. Pass the completion view, the label id, and a tone. A messages entry replaces the catalogue sentence for that label; a blank entry and an unknown label keep the catalogue.',\n});\n\nfunction messageKey(label: string): OrderStatusMessageKey {\n  return Object.hasOwn(ORDER_STATUS_MESSAGES, label) ? (label as OrderStatusMessageKey) : 'placeholder';\n}\n\nexport function OrderStatusBadge({ state, tone, label, messages, className, ...props }: OrderStatusBadgeProps) {\n  const intl = useIntl();\n  const authored = messages?.[messageKey(label)]?.trim();\n\n  return (\n    <Badge\n      {...props}\n      className={className}\n      data-fs-order-status-badge=\"\"\n      data-fs-order-status-badge-state={state}\n      data-fs-order-status-badge-tone={tone}\n    >\n      {authored || intl.formatMessage({ id: orderStatusMessageId(label) })}\n    </Badge>\n  );\n}\n"],"mappings":";;;;;;;AAgCA,MAAM,wBAAmD;CACvD,WAAW;CACX,0BAA0B;CAC1B,eAAe;CACf,WAAW;CACX,SAAS;CACT,oBAAoB;CACpB,WAAW;AACb;AAEA,SAAS,qBAAqB,OAA0B;CAEtD,IAAI,CAAC,OAAO,OAAO,uBAAuB,KAAK,GAC7C,OAAO;CAGT,OAAO,sBAAsB,UAAU;AACzC;AAEA,MAAa,6BAA6B,gBAAuC;CAC/E,MAAM;CACN,YAAY;CACZ,WAAW;CACX,QAAQ;EAAE,OAAO;EAAsB,UAAU;CAAU;CAC3D,QAAQ,CAAC;CACT,WACE;AACJ,CAAC;AAED,SAAS,WAAW,OAAsC;CACxD,OAAO,OAAO,OAAO,uBAAuB,KAAK,IAAK,QAAkC;AAC1F;AAEA,SAAgB,iBAAiB,EAAE,OAAO,MAAM,OAAO,UAAU,WAAW,GAAG,SAAgC;CAC7G,MAAM,OAAO,QAAQ;CACrB,MAAM,WAAW,WAAW,WAAW,KAAK,EAAE,EAAE,KAAK;CAErD,OACE,oBAAC,OAAD;EACE,GAAI;EACO;EACX,8BAA2B;EAC3B,oCAAkC;EAClC,mCAAiC;EAEhC,UAAA,YAAY,KAAK,cAAc,EAAE,IAAI,qBAAqB,KAAK,EAAE,CAAC;CAC9D,CAAA;AAEX"}

package/dist/particles/payment-methods/payment-methods.d.ts

@@ -50,7 +50,7 @@ export declare const PaymentMethodsContent: {
 };
 /**
  * The payment glyphs the base icon dialect carries, and so the only names `method` admits. Exported
- * because a store's `global.json` has to list them under `icons.include` for a CMS-chosen name to
+ * because a store's foundation has to list them under `icons.include` for a CMS-chosen name to
  * resolve at runtime — one import there instead of ten retyped strings. Reading it off the model
  * rather than declaring it beside one makes the two impossible to drift apart.
  */

package/dist/particles/payment-methods/payment-methods.js

@@ -61,7 +61,7 @@ const PaymentMethodsContent = defineContentType({
 });
 /**
 * The payment glyphs the base icon dialect carries, and so the only names `method` admits. Exported
-* because a store's `global.json` has to list them under `icons.include` for a CMS-chosen name to
+* because a store's foundation has to list them under `icons.include` for a CMS-chosen name to
 * resolve at runtime — one import there instead of ten retyped strings. Reading it off the model
 * rather than declaring it beside one makes the two impossible to drift apart.
 */