Migrate Storybook Knobs to Controls

[alanorozco]

Storybook Knobs are deprecated and we should replace them with Controls.

General work

• Forbid using in new Stories (🏗 Update Storybook forbidden terms #35991)
• Install addon-controls (♻️ Use Storybook args (first round) #35915)
• Uninstall addon-knobs (🏗♻️🚮 Disable @storybook/addon-knobs #37681)
• Update extension template (♻️ Use Storybook args (first round) #35915)

Migrating Stories

For general guidance, see Storybook docs: How do I migrate from addon-knobs?

Please also make sure to follow our Style Recommendations.

You'll also have to remove the migrated files from this allowlist to pass CI. Files in this list are also disabled on Storybook, so you have to remove them from allowlist for them to show up at all.

amphtml/build-system/test-configs/forbidden-terms.js

Lines 720 to 724 in 375cfb5

	'@storybook/addon-knobs': {
	message:
	'The @storybook/addon-knobs package has been deprecated. Use Controls instead (`args` and `argTypes`). https://storybook.js.org/docs/react/essentials/controls',
	allowlist: [
	// TODO(#35923): Update existing files to use Controls instead.

Tasks

• Update Stories 0...15
  @alanorozco (♻️ Use Storybook args (first round) #35915)
• Update Stories 15...30
  @alanorozco (♻️ Use Storybook args (second round) #35930)
• Update Stories 30..34 (@dmanek)
  @dmanek (♻️ Migrate stories 30..34 to controls #37697)

  extensions/amp-date-display/1.0/storybook/Basic.amp.js
  extensions/amp-date-display/1.0/storybook/Basic.js
  extensions/amp-iframe/0.1/storybook/Basic.amp.js
  extensions/amp-iframe/1.0/storybook/Basic.amp.js
  extensions/amp-image-slider/0.1/storybook/Basic.amp.js
  

• Update Stories 35..39
  @kvchari (♻️ Migrate gallery 35..39 to controls #37727)

  extensions/amp-inline-gallery/1.0/storybook/Basic.js
  extensions/amp-stream-gallery/1.0/storybook/Basic.amp.js
  extensions/amp-stream-gallery/1.0/storybook/Basic.js
  extensions/amp-lightbox-gallery/1.0/storybook/Basic.amp.js
  extensions/amp-lightbox-gallery/1.0/storybook/Basic.js
  extensions/amp-lightbox/1.0/storybook/Basic.amp.js
  

• Update Stories 40..44
  @rbeckthomas (♻️Migrate Stories 40..44 to args #37729)

  extensions/amp-selector/1.0/storybook/Basic.amp.js
  extensions/amp-selector/1.0/storybook/Basic.js
  extensions/amp-sidebar/0.1/storybook/Basic.amp.js
  extensions/amp-sidebar/1.0/storybook/Basic.amp.js
  extensions/amp-sidebar/1.0/storybook/Basic.js
  

• Update Stories 45..49
  @rbeckthomas (♻️ Migrate Stories 45..49 to args #37850)

  extensions/amp-soundcloud/1.0/storybook/Basic.amp.js
  extensions/amp-soundcloud/1.0/storybook/Basic.js
  extensions/amp-lightbox/1.0/storybook/Basic.js
  extensions/amp-timeago/1.0/storybook/Basic.js
  

• Update Stories 50..53
  @alanorozco (♻️Migrate Stories 50..53 to args #37685)
• Update Stories 54..61 (video)
  @rbeckthomas (♻️ Migrate stories 54..61 to args #37860)

  extensions/amp-video/1.0/storybook/Basic.amp.js
  extensions/amp-video/1.0/storybook/Basic.js
  extensions/amp-video-iframe/1.0/storybook/Basic.amp.js
  extensions/amp-vimeo/1.0/storybook/Basic.amp.js
  extensions/amp-vimeo/1.0/storybook/Basic.js
  extensions/amp-youtube/0.1/storybook/Basic.amp.js
  extensions/amp-youtube/1.0/storybook/Basic.amp.js
  extensions/amp-youtube/1.0/storybook/Basic.js
  

• Update Stories 62..65
  @rbeckthomas (♻️Migrate Stories 62..65 to args #37730)

  src/builtins/storybook/amp-layout.amp.js
  src/preact/storybook/Context.js
  src/preact/storybook/Wrappers.js