Description

Stacked on #9244 (base branch carp/mosaic-typography-stylex) — Icon's story needs the meta.styleEngine field that PR adds. Retarget to main once it merges.

Moves Icon off the Emotion slot-recipe engine onto StyleX. Same contract as the components migrated before it: a stable .cl-icon class plus a data-size attribute, with the consumer's className/style merged last.

The appearance.icons override path loses a layer. It only wrapped itself in Emotion's ClassNames to serialize the recipe's css into a real class — an override is authored in a consumer file with no jsx pragma, so its own css prop would be ignored. stylex.props() already returns a className, so the override is now cloned with the same merged props the built-in glyph gets:

const props = mergeStyleProps(themeProps('icon', { size }), stylex.props(styles.base, sizes[size]), className, style);

if (override) {
  const overrideClassName = (override.props as { className?: string }).className;
  return React.cloneElement(override, { ...rest, ...mergeStyleProps(props, overrideClassName) });
}

Everything the override path guaranteed is unchanged: overrides stay plain elements (so they serialize across the RSC boundary), Mosaic's sizing applies to them exactly as to the built-in glyph, the element's own className survives, call-site svg props are forwarded, and ref is still deliberately not forwarded to an override.

Consumers target .cl-icon + data-size instead of data-cl-slot="icon" and appearance.elements.icon, matching Button, Heading, and Text.

Checklist

• pnpm test runs as expected.
• pnpm build runs as expected.
• (If applicable) JSDoc comments have been added or updated for any package exports
• (If applicable) Documentation has been updated

Type of change

• 🐛 Bug fix
• 🌟 New feature
• 🔨 Breaking change
• 📖 Refactoring / dependency upgrade / documentation
• other: