feat(snaps):Add disabled state for Snap UI interactive components

[david0xd]

Description

This PR integrates new Snaps UI feature for disabling interactive UI components.

Related issues

Fixes: #29669

Related Pull Requests

MetaMask/snaps#3030

Manual testing steps

1. Make new Snap with custom UI using interactive UI components specified in the task linked under "related issues".
2. Add flag disabled={true} to these components.
3. Check that components with disabled flag are not clickable and their styling is different (opacity 0.5).

Screenshots/Recordings

Before

disabled state was not available before, nothing to show here.

After

Screen.Recording.2025-01-24.at.16.53.37.mov

Pre-merge author checklist

• I've followed MetaMask Contributor Docs and MetaMask Extension Coding Standards.
• I've completed the PR template to the best of my ability
• I’ve included tests if applicable
• I’ve documented my code using JSDoc format if applicable
• I’ve applied the right labels on the PR (see labeling guidelines). Not required for external contributors.

Pre-merge reviewer checklist

• I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
• I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.

[github-actions]

CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes.

[metamaskbot]

Builds ready [6c745ce]

• builds: chrome, firefox
• builds (flask): chrome, firefox
• builds (MMI): chrome
• builds (test): chrome, firefox
• builds (test-flask): chrome, firefox
• build viz: Build System
• mv3: Bundle Size Stats
• mv2: E2e Actions Stats
• storybook: Storybook
• typescript migration: Dashboard
• all artifacts
• bundle viz:

  • background: 0, 1, 2, 3, 4, 5, 6, 7
  • common: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13
  • ui: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13
  • content-script: 0
  • offscreen: 0

Page Load Metrics (1858 ± 84 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	251	2249	1649	550	264
		domContentLoaded	1517	2226	1807	154	74
		load	1531	2255	1858	174	84
		domInteractive	27	85	41	15	7
		backgroundConnect	13	292	56	58	28
		firstReactRender	16	110	42	29	14
		getState	5	104	25	26	12
		initialActions	0	1	0	0	0
		loadScripts	1098	1705	1334	140	67
		setupStore	8	80	22	22	11
		uiStartup	1756	2767	2146	254	122

Bundle size diffs

• background: 0 Bytes (0.00%)
• ui: 988 Bytes (0.01%)
• common: 0 Bytes (0.00%)

[metamaskbot]

Builds ready [662cbbf]

• builds: chrome, firefox
• builds (flask): chrome, firefox
• builds (MMI): chrome
• builds (test): chrome, firefox
• builds (test-flask): chrome, firefox
• build viz: Build System
• mv3: Bundle Size Stats
• mv2: E2e Actions Stats
• storybook: Storybook
• typescript migration: Dashboard
• all artifacts
• bundle viz:

  • background: 0, 1, 2, 3, 4, 5, 6, 7
  • common: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13
  • ui: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13
  • content-script: 0
  • offscreen: 0

Page Load Metrics (1684 ± 90 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	227	2351	1614	367	176
		domContentLoaded	1473	2260	1648	174	84
		load	1491	2356	1684	187	90
		domInteractive	25	77	42	19	9
		backgroundConnect	7	97	41	29	14
		firstReactRender	16	82	39	23	11
		getState	3	54	15	13	6
		initialActions	0	1	0	0	0
		loadScripts	993	1707	1200	153	73
		setupStore	7	59	14	14	7
		uiStartup	1664	2685	1932	224	107

Bundle size diffs

• background: 0 Bytes (0.00%)
• ui: 1.01 KiB (0.01%)
• common: 0 Bytes (0.00%)