Skip to content

chore(deps): update dependency @storybook/addon-svelte-csf to v5.0.4 #197

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Closed
renovate wants to merge 1 commit into from
Closed

chore(deps): update dependency @storybook/addon-svelte-csf to v5.0.4 #197

renovate wants to merge 1 commit into from

Conversation

@renovate
Copy link
Contributor

@renovate renovate bot commented May 8, 2025 •
edited
Loading

This PR contains the following updates:

Package Change Age Adoption Passing Confidence
@storybook/addon-svelte-csf =5.0.0-next.28 -> =5.0.4 age adoption passing confidence

Release Notes

storybookjs/addon-svelte-csf (@​storybook/addon-svelte-csf)

v5.0.4

Compare Source

🐛 Bug Fix
Authors: 1

v5.0.3

Compare Source

🐛 Bug Fix
Authors: 1

v5.0.2

Compare Source

🐛 Bug Fix
Authors: 2

v5.0.1

Compare Source

🐛 Bug Fix
Authors: 1

v5.0.0

Compare Source

Release Notes
Breaking: Add support for render in defineMeta, replacing setTemplate-function (#​295)
setTemplate-function removed in favor of render in defineMeta

The setTemplate-function has been removed. Instead reference your default snippet with the render-property in defineMeta:

<script module>
- import { defineMeta, setTemplate } from '@&#8203;storybook/addon-svelte-csf';
+ import { defineMeta } from '@&#8203;storybook/addon-svelte-csf';
  import MyComponent from './MyComponent.svelte';

  const { Story } = defineMeta({
    /* ... */
+   render: template
  });
</script>

-<script>
-  setTemplate(template);
-</script>

{#snippet template(args)}
  <MyComponent {...args}>
    ...
  </MyComponent>
{/snippet}

<Story name="With Default Template" />

This new API achieves the same thing, but in a less verbose way, and is closer aligned with Storybook's regular CSF. 🎉

[!IMPORTANT]
There is currently a bug in the Svelte language tools, which causes TypeScript to error with TS(2448): Block-scoped variable 'SNIPPET_NAMAE' used before its declaration.. Until that is fixed, you have to silent it with //@&#8203;ts-ignore or //@&#8203;ts-expect-error. See https://github.com/sveltejs/language-tools/issues/2653

Breaking: Rename children prop to template, require asChild for static stories (#​228)

This release contains breaking changes related to the children-API. The legacy API stays as-is to maintain backwards compatibility.

children renamed to template

The children-prop and children-snippet on Story has been renamed to template, to align better with Svelte's API and not be confused with Svelte's default children-snippet. If you have any stories using the children prop or snippet, you need to migrate them:

{#snippet template()}
  ...
{/snippet}

-<Story name="MyStory" children={template} />
+<Story name="MyStory" template={template} />

<Story name="MyStory">
-  {#snippet children(args)}
+  {#snippet template(args)}
    <MyComponent />
  {/snippet}
</Story>
Story children are now forwarded to components

Previously, to define static stories, you would just add children to a Story, and they would be the full story. To make it easier to pass children to your components in stories, the children are now instead forwarded to the component instead of replacing it completely.

Previously:

<script module>
  import { defineMeta } from '@&#8203;storybook/addon-svelte-csf';

  import MyComponent from './MyComponent.svelte';

  const { Story } = defineMeta({
    component: MyComponent,
  });
</script>

<!--
This story renders:

This would be the full story, ignoring the MyComponent in the meta
-->
<Story name="Static Story">
  This would be the full story, ignoring the MyComponent in the meta
</Story>

Now:

<script module>
  import { defineMeta } from '@&#8203;storybook/addon-svelte-csf';

  import MyComponent from './MyComponent.svelte';

  const { Story } = defineMeta({
    component: MyComponent,
  });
</script>

<!--
This story renders:

<MyComponent>
  This is now forwarded to the component
</MyComponent>
-->
<Story name="MyComponent children">This is now forwarded to the component</Story>

To get the same behavior as previously, a new asChild boolean prop has been introduced on the Story component. asChild is a common prop in UI libraries, where you want the children to be the output, instead of just being children of the Component. By adding that you can get the old behavior back, when you need more control over what the story renders:

<script module>
  import { defineMeta } from '@&#8203;storybook/addon-svelte-csf';

  import MyComponent from './MyComponent.svelte';

  const { Story } = defineMeta({
    component: MyComponent,
  });
</script>

<!--
This story renders:

This is the full story, ignoring the MyComponent in the meta
-->
<Story name="Static Story" asChild>
  This is the full story, ignoring the MyComponent in the meta
</Story>
Require Storybook 8.2.0 and above, support Storybook 9.0.0 prereleases (#​284)

The addon now requires Storybook 8.2.0 and upwards (was previously 8.0.0), and has a peer dependency on the storybook-package. That package should always be in your project anyway though.

💥 Breaking Change
🚀 Enhancement
🐛 Bug Fix
🏠 Internal
📝 Documentation
🧪 Tests
Authors: 12

v5.0.0-next.30

Compare Source

🐛 Bug Fix
🏠 Internal
📝 Documentation
Authors: 2

v5.0.0-next.29

Compare Source

Release Notes
Breaking: Add support for render in defineMeta, replacing setTemplate-function (#​295)
setTemplate-function removed in favor of render in defineMeta

The setTemplate-function has been removed. Instead reference your default snippet with the render-property in defineMeta:

<script module>
- import { defineMeta, setTemplate } from '@&#8203;storybook/addon-svelte-csf';
+ import { defineMeta } from '@&#8203;storybook/addon-svelte-csf';
  import MyComponent from './MyComponent.svelte';

  const { Story } = defineMeta({
    /* ... */
+   render: template
  });
</script>

-<script>
-  setTemplate(template);
-</script>

{#snippet template(args)}
  <MyComponent {...args}>
    ...
  </MyComponent>
{/snippet}

<Story name="With Default Template" />

This new API achieves the same thing, but in a less verbose way, and is closer aligned with Storybook's regular CSF. 🎉

[!IMPORTANT]
There is currently a bug in the Svelte language tools, which causes TypeScript to error with TS(2448): Block-scoped variable 'SNIPPET_NAMAE' used before its declaration.. Until that is fixed, you have to silent it with //@&#8203;ts-ignore or //@&#8203;ts-expect-error. See https://github.com/sveltejs/language-tools/issues/2653

Breaking: Rename children prop to template, require asChild for static stories (#​228)

This release contains breaking changes related to the children-API. The legacy API stays as-is to maintain backwards compatibility.

children renamed to template

The children-prop and children-snippet on Story has been renamed to template, to align better with Svelte's API and not be confused with Svelte's default children-snippet. If you have any stories using the children prop or snippet, you need to migrate them:

{#snippet template()}
  ...
{/snippet}

-<Story name="MyStory" children={template} />
+<Story name="MyStory" template={template} />

<Story name="MyStory">
-  {#snippet children(args)}
+  {#snippet template(args)}
    <MyComponent />
  {/snippet}
</Story>
Story children are now forwarded to components

Previously, to define static stories, you would just add children to a Story, and they would be the full story. To make it easier to pass children to your components in stories, the children are now instead forwarded to the component instead of replacing it completely.

Previously:

<script module>
  import { defineMeta } from '@&#8203;storybook/addon-svelte-csf';

  import MyComponent from './MyComponent.svelte';

  const { Story } = defineMeta({
    component: MyComponent,
  });
</script>

<!--
This story renders:

This would be the full story, ignoring the MyComponent in the meta
-->
<Story name="Static Story">
  This would be the full story, ignoring the MyComponent in the meta
</Story>

Now:

<script module>
  import { defineMeta } from '@&#8203;storybook/addon-svelte-csf';

  import MyComponent from './MyComponent.svelte';

  const { Story } = defineMeta({
    component: MyComponent,
  });
</script>

<!--
This story renders:

<MyComponent>
  This is now forwarded to the component
</MyComponent>
-->
<Story name="MyComponent children">
  This is now forwarded to the component
</Story>

To get the same behavior as previously, a new asChild boolean prop has been introduced on the Story component. asChild is a common prop in UI libraries, where you want the children to be the output, instead of just being children of the Component. By adding that you can get the old behavior back, when you need more control over what the story renders:

<script module>
  import { defineMeta } from '@&#8203;storybook/addon-svelte-csf';

  import MyComponent from './MyComponent.svelte';

  const { Story } = defineMeta({
    component: MyComponent,
  });
</script>

<!--
This story renders:

This is the full story, ignoring the MyComponent in the meta
-->
<Story name="Static Story" asChild>
  This is the full story, ignoring the MyComponent in the meta
</Story>
💥 Breaking Change
🚀 Enhancement
🐛 Bug Fix
🏠 Internal
📝 Documentation
Authors: 3

Configuration

📅 Schedule: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined).

🚦 Automerge: Disabled by config. Please merge this manually once you are satisfied.

♻ Rebasing: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.

🔕 Ignore: Close this PR and you won't be reminded about this update again.

  • If you want to rebase/retry this PR, check this box

This PR was generated by Mend Renovate. View the repository job log.

@renovate renovate bot added the dependencies Relates to dependencies label May 8, 2025
@renovate renovate bot requested review from ParkerH27 and lishaduck as code owners May 8, 2025 14:07
@renovate renovate bot added the dependencies Relates to dependencies label May 8, 2025
@renovate renovate bot force-pushed the renovate/storybook-addon-svelte-csf-5.x branch from f51517c to ada9314 Compare May 8, 2025 15:05
@renovate renovate bot force-pushed the renovate/storybook-addon-svelte-csf-5.x branch from ada9314 to a123482 Compare May 18, 2025 23:33
@renovate renovate bot changed the title chore(deps): update dependency @storybook/addon-svelte-csf to v5.0.0 chore(deps): update dependency @storybook/addon-svelte-csf to v5.0.1 May 18, 2025
@renovate renovate bot force-pushed the renovate/storybook-addon-svelte-csf-5.x branch from a123482 to bca97c0 Compare May 31, 2025 11:49
@renovate renovate bot changed the title chore(deps): update dependency @storybook/addon-svelte-csf to v5.0.1 chore(deps): update dependency @storybook/addon-svelte-csf to v5.0.3 May 31, 2025
@renovate renovate bot force-pushed the renovate/storybook-addon-svelte-csf-5.x branch from bca97c0 to 61edc3b Compare June 27, 2025 02:12
@renovate renovate bot changed the title chore(deps): update dependency @storybook/addon-svelte-csf to v5.0.3 chore(deps): update dependency @storybook/addon-svelte-csf to v5.0.4 Jun 27, 2025
@renovate
Copy link
Contributor Author

renovate bot commented Jun 27, 2025

⚠️ Artifact update problem

Renovate failed to update an artifact related to this branch. You probably do not want to merge this PR as-is.

♻ Renovate will retry this branch, including artifacts, only when one of the following happens:

  • any of the package files in this branch needs updating, or
  • the branch becomes conflicted, or
  • you click the rebase/retry checkbox if found above, or
  • you rename this PR's title to start with "rebase!" to trigger it manually

The artifact failure details are included below:

File name: pnpm-lock.yaml
 ERROR  Failed to switch pnpm to v10.12.2. Looks like pnpm CLI is missing at "/home/ubuntu/.local/share/pnpm/.tools/pnpm/10.12.2/bin" or is incorrect
spawnSync /home/ubuntu/.local/share/pnpm/.tools/pnpm/10.12.2/bin/pnpm ENOENT

@lishaduck lishaduck mentioned this pull request Jun 29, 2025
Merged
@lishaduck lishaduck closed this Jun 29, 2025
@renovate renovate bot deleted the renovate/storybook-addon-svelte-csf-5.x branch July 12, 2025 08:06
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@lishaduck lishaduck Awaiting requested review from lishaduck lishaduck is a code owner

@ParkerH27 ParkerH27 Awaiting requested review from ParkerH27 ParkerH27 is a code owner

Assignees

@lishaduck lishaduck

@ParkerH27 ParkerH27

Labels

dependencies Relates to dependencies

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@lishaduck @ParkerH27