ui-components feat(#2947): update Notification Banner component for V2

Summary

Updates the Notification Banner component to support V2 design system with emphasis-based variants (High/Low emphasis), compact sizing, and enhanced accessibility while maintaining full backward compatibility with V1.

Changes

New Props

version ("1" | "2", default "1"): Controls V1 vs V2 styling
emphasis ("High" | "Low", optional): Controls emphasis level for V2 variants
- High: Bold colors (dark/colored backgrounds, white or dark text)
- Low: Subtle styling (light backgrounds, colored text, borders)
- Defaults to "High" when version="2" and emphasis not specified
compact (boolean, default false): Enables compact spacing (V2 only)
- Reduces gap: 16px → 8px
- Reduces padding: 24px → 16px (top/bottom)
- Responsive padding reductions at all breakpoints

V2 Features

1. Emphasis-Based Styling (6 Variants)

Information:

High: Blue background (#0077ad), white text, outline icon (inverted)
Low: Light blue background (#cbeaf7), blue text, filled icon, border

Important:

High: Yellow background (#f9ce2d), dark brown text (#4d3700), outline icon
Low: Light yellow background (#fef2c8), brown text (#8d6500), filled icon, border

Emergency:

High: Red background (#da291c), white text, outline icon (inverted)
Low: Light red background (#eeaea5), dark red text (#a91a10), filled icon, border

2. Icon Behavior

Icon Inversion Logic:

V1: All icons inverted (white) except important (black)
V2 High emphasis: All icons inverted except important (uses dark brown)
V2 Low emphasis: No icons inverted (all use default colors)

Icon Theme:

V1: All icons outline
V2 High emphasis: All icons outline
V2 Low emphasis: All icons filled (new GoA icon theme prop)

3. Smart Defaults (`effectiveEmphasis` Pattern)

Problem solved: When version="2" but emphasis not specified, CSS selectors fail without a .high or .low class.

Solution: Default emphasis to "High" automatically for V2:

  $: effectiveEmphasis = version === "2" && !emphasis ? "High" : emphasis;

Benefits:

Keeps emphasis prop optional (better API)
V2 always has a valid emphasis level
V1 remains unchanged (emphasis stays undefined)
Prevents CSS selector mismatch

4. Soft Deprecation: type="event"

V2 silently maps type="event" to type="information":

V1: type="event" displays calendar icon with info colors
V2: type="event" automatically becomes information (no breaking change)
Non-breaking migration path for existing implementations

5. Compact Spacing

Default spacing:

Gap: 16px
Padding (top/bottom): 24px
Padding (responsive): 16px/24px/64px by breakpoint

Compact spacing (compact={true}):

Gap: 8px (50% reduction)
Padding (top/bottom): 16px (33% reduction)
Padding (responsive): 8px/16px/32px (50% reduction)

feat(#2947): update Notification Banner component for V2

Summary

Changes

New Props

V2 Features

1. Emphasis-Based Styling (6 Variants)

2. Icon Behavior

3. Smart Defaults (effectiveEmphasis Pattern)

4. Soft Deprecation: type="event"

5. Compact Spacing

Related

3. Smart Defaults (`effectiveEmphasis` Pattern)