From 2350dc664595c3a6a317293e7cb1efebf7324565 Mon Sep 17 00:00:00 2001 From: Tobias Diez Date: Fri, 28 Jun 2024 22:38:13 +0200 Subject: [PATCH] chore: move nuxt link test to showcase example (#618) Follow-up: https://github.com/nuxt-modules/storybook/issues/666 --- .../showcase/components/MyNuxtLink.stories.ts | 52 +++++++++++++++++++ .../showcase}/components/MyNuxtLink.vue | 0 2 files changed, 52 insertions(+) create mode 100644 examples/showcase/components/MyNuxtLink.stories.ts rename {packages/storybook-addon/playground => examples/showcase}/components/MyNuxtLink.vue (100%) diff --git a/examples/showcase/components/MyNuxtLink.stories.ts b/examples/showcase/components/MyNuxtLink.stories.ts new file mode 100644 index 00000000..7b4837ec --- /dev/null +++ b/examples/showcase/components/MyNuxtLink.stories.ts @@ -0,0 +1,52 @@ +import type { Meta, StoryObj } from '@storybook/vue3' + +import MyNuxtLink from './MyNuxtLink.vue' + +// More on how to set up stories at: https://storybook.js.org/docs/vue/writing-stories/introduction + +/** + * Shows how to use NuxtLink component + */ +const meta = { + title: 'Features/Nuxt Link', + component: MyNuxtLink, + // This component will have an automatically generated docsPage entry: https://storybook.js.org/docs/vue/writing-docs/autodocs + tags: ['autodocs'], + argTypes: { + default: { + control: 'text', + description: 'Link text', + }, + }, + args: { + default: 'Nuxt Link', + }, +} satisfies Meta + +export default meta +type Story = StoryObj +/* + *👇 Render functions are a framework specific feature to allow you control on how the component renders. + * See https://storybook.js.org/docs/vue/api/csf + * to learn how to use render functions. + */ + +export const NuxtLinkInCustomComponent: Story = { + args: {}, + render(args) { + return { + components: { MyNuxtLink }, + setup: () => ({ args }), + template: '{{ args.default }}', + } + }, +} +export const NuxtLinkInTemplate: Story = { + args: {}, + render(args) { + return { + setup: () => ({ args }), + template: '{{ args.default }}', + } + }, +} diff --git a/packages/storybook-addon/playground/components/MyNuxtLink.vue b/examples/showcase/components/MyNuxtLink.vue similarity index 100% rename from packages/storybook-addon/playground/components/MyNuxtLink.vue rename to examples/showcase/components/MyNuxtLink.vue