Migrate stories format to JSON

With this change, I'm noticing that storybook reports errors in "id" conflicts. For example: We have the banner component conflicting with banner--tall because they both define themselves as a "CL Components/Examples/Banner" in the *.stories.json file

(I think this might be a storybook 7 issue specifically)

Is this why I'm getting these errors when running ddev yarn storybook? (total n00b at Storybook, DDEV, Docker, etc.)

🚨 Unable to index files:
WARN - ./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.json,./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.yml: Duplicate stories with id: cl-components-examples-banner--1-default
WARN - ./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.json,./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.yml: Duplicate stories with id: cl-components-examples-banner--2-no-image
WARN - ./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.json,./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.yml: Duplicate stories with id: cl-components-examples-banner--3-with-body
WARN - ./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.json,./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.yml: Duplicate stories with id: cl-components-examples-banner--4-with-card
WARN - ./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.json,./web/modules/contrib/sdc_examples/components/my-banner/my-banner.stories.json: Duplicate stories with id: cl-components-examples-banner--1-default
WARN - ./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.json,./web/modules/contrib/sdc_examples/components/my-banner/my-banner.stories.json: Duplicate stories with id: cl-components-examples-banner--2-no-image
WARN - ./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.json,./web/modules/contrib/sdc_examples/components/my-banner/my-banner.stories.json: Duplicate stories with id: cl-components-examples-banner--3-with-body
WARN - ./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.json,./web/modules/contrib/sdc_examples/components/my-banner/my-banner.stories.yml: Duplicate stories with id: cl-components-examples-banner--1-default
WARN - ./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.json,./web/modules/contrib/sdc_examples/components/my-banner/my-banner.stories.yml: Duplicate stories with id: cl-components-examples-banner--2-no-image
WARN - ./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.json,./web/modules/contrib/sdc_examples/components/my-banner/my-banner.stories.yml: Duplicate stories with id: cl-components-examples-banner--3-with-body
WARN - ./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.json,./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.yml: Duplicate stories with id: cl-components-examples-button--1-default
WARN - ./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.json,./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.yml: Duplicate stories with id: cl-components-examples-button--2-like
WARN - ./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.json,./web/modules/contrib/sdc_examples/components/my-button/my-button.stories.json: Duplicate stories with id: cl-components-examples-button--1-default
WARN - ./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.json,./web/modules/contrib/sdc_examples/components/my-button/my-button.stories.json: Duplicate stories with id: cl-components-examples-button--2-like
WARN - ./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.json,./web/modules/contrib/sdc_examples/components/my-button/my-button.stories.yml: Duplicate stories with id: cl-components-examples-button--1-default
WARN - ./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.json,./web/modules/contrib/sdc_examples/components/my-button/my-button.stories.yml: Duplicate stories with id: cl-components-examples-button--2-like
WARN - ./web/modules/contrib/sdc_examples/components/my-card--light/my-card--light.stories.json,./web/modules/contrib/sdc_examples/components/my-card--light/my-card--light.stories.yml: Duplicate stories with id: cl-components-examples-card-light--1-default
WARN - ./web/modules/contrib/sdc_examples/components/my-card/my-card.stories.json,./web/modules/contrib/sdc_examples/components/my-card/my-card.stories.yml: Duplicate stories with id: cl-components-examples-card--1-default
WARN - ./web/modules/contrib/sdc_examples/components/my-cta/my-cta.stories.json,./web/modules/contrib/sdc_examples/components/my-cta/my-cta.stories.yml: Duplicate stories with id: cl-components-examples-call-to-action--1-default
WARN - ./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.json,./web/modules/contrib/sdc_examples/sdc_examples_replacements/components/my-button--primary/my-button--primary.stories.json: Duplicate stories with id: cl-components-examples-button--1-default
WARN - ./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.json,./web/modules/contrib/sdc_examples/sdc_examples_replacements/components/my-button--primary/my-button--primary.stories.json: Duplicate stories with id: cl-components-examples-button--2-like
WARN - ./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.json,./web/modules/contrib/sdc_examples/sdc_examples_replacements/components/my-button--primary/my-button--primary.stories.yml: Duplicate stories with id: cl-components-examples-button--1-default
WARN - ./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.json,./web/modules/contrib/sdc_examples/sdc_examples_replacements/components/my-button--primary/my-button--primary.stories.yml: Duplicate stories with id: cl-components-examples-button--2-like

@dalemoore @cosmicdreams If you set up storybook to only monitor the .yml's, not the .json's that'll fix some of the warnings:

stories: [
    "../web/modules/**/*.stories.mdx",
    "../web/modules/**/*.stories.@(yml)",
    "../web/themes/**/*.stories.mdx",
    "../web/themes/**/*.stories.@(yml)"
]

I'll also post an MR in a minute, changing some of the IDs in the yamls to solve the duplicate ID warnings.

Correct MR is https://git.drupalcode.org/project/sdc_examples/-/merge_requests/5

basvredeling → closed merge request !4