feat(note): align Note component with Fusion DS

[ibutakova]

Proposed behaviour

Align Note component with Fusion DS:

• Replace token-based colours and spacing with Fusion DS global tokens
• Render title as a semantic

  instead of Typography CSS-only variant

• Move inline ActionPopover into the body layout; provide default ellipsis icon button
• Replace status tooltip with inline elements; add locale.note.created() i18n key for "Created" label
• Add isValidISOString util to set machine-readable datetime attributes on elements
• Render @mention nodes as read-only pills
• Add spellCheck={false} to ReadOnlyEditor
• Conditionally render previews section to avoid empty DOM nodes
• Remove dead StatusIcon internal component
• Add WithInlineControlsWithoutTitle and WithMention stories

Current behaviour

Note component is not aligned with Fusion DS

Checklist

• Commits follow our style guide
• Related issues linked in commit messages if required
• Screenshots are included in the PR if useful
• All themes are supported if required
• Unit tests added or updated if required
• Playwright automation tests added or updated if required
• Storybook added or updated if required
• Translations added or updated (including creating or amending translation keys table in storybook) if required
• Typescript d.ts file added or updated if required
• Related docs have been updated if required

QA

• Tested in provided StackBlitz sandbox/Storybook
• Add new Playwright test coverage if required
• Carbon implementation matches Design System/designs
• UI Tests GitHub check reviewed if required

Additional context

Testing instructions

[DipperTheDan]

suggestion: You can use the ...none token values here instead. I can find the actual token names if you need them 👍🏻

[ibutakova]

Ah, that thing one more time. Thanks)

[designerlisa]

@ibutakova Thanks for the great work!
Luke has confirmed that 4px is deliberate update as the footer looked too large. All looks good!