Skip to content

[6.x] Fix CreateForm demos in Storybook #13576

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

Merged
jasonvarga merged 2 commits into from
Jan 15, 2026
+12 −9
Merged

[6.x] Fix CreateForm demos in Storybook #13576

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
a58eb13
Fix CreateForm embeds in Storybook
duncanmcclean Jan 15, 2026
0deb7ab
Add longer subtitles. Shorter ones look weird with the left-alignment
duncanmcclean Jan 15, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 8 additions & 1 deletion .storybook/preview.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ import PortalVue from 'portal-vue';
import FullscreenHeader from '@/components/publish/FullscreenHeader.vue';
import Portal from '@/components/portals/Portal.vue';
import PortalTargets from '@/components/portals/PortalTargets.vue';
import { portals, stacks } from '@api';
import {keys, portals, slug, stacks} from '@api';

// Intercept Inertia navigation and log to Actions tab.
router.on('before', (event) => {
Expand All @@ -31,6 +31,11 @@ setup(async (app) => {
linkToDocs: true,
paginationSize: 50,
paginationSizeOptions: [10, 25, 50, 100, 500],
sites: [{
handle: 'default',
lang: 'en',
}],
selectedSite: 'default',
};

return config[key] ?? null;
Expand All @@ -53,6 +58,8 @@ setup(async (app) => {
app.config.globalProperties.cp_url = (url) => url;
app.config.globalProperties.$portals = portals;
app.config.globalProperties.$stacks = stacks;
app.config.globalProperties.$slug = slug;
app.config.globalProperties.$keys = keys;

app.use(PortalVue, { portalName: 'v-portal' });

Expand Down
6 changes: 3 additions & 3 deletions resources/js/stories/CreateForm.stories.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ type Story = StoryObj<typeof meta>;
const defaultCode = `
<CreateForm
title="Create Collection"
subtitle="Collections are containers that hold entries"
subtitle="Collections are containers that hold entries representing articles, blog posts, products, events, or any other content type."
icon="collections"
:route="cp_url('collections/create')"
/>
Expand All @@ -42,7 +42,7 @@ const withoutHandleCode = `
<CreateForm
without-handle
title="Create Blueprint"
subtitle="Blueprints define and organize fields into content models"
subtitle="Blueprints define and organize fields into content models for collections, forms, and other data."
icon="blueprints"
:route="cp_url('blueprints/create')"
/>
Expand All @@ -64,7 +64,7 @@ export const _WithoutHandle: Story = {
const withInstructionsCode = `
<CreateForm
title="Create Collection"
subtitle="Collections are containers that hold entries"
subtitle="Collections are containers that hold entries representing articles, blog posts, products, events, or any other content type."
icon="collections"
:route="cp_url('collections/create')"
title-instructions="The display name for this collection"
Expand Down
6 changes: 1 addition & 5 deletions resources/js/stories/docs/CreateForm.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,6 @@ import * as CreateFormStories from '../CreateForm.stories';
# CreateForm
A pre-built form component for creating new resources with automatic slug generation. Includes title and handle fields with customizable instructions and automatic form submission.

Docs coming soon.

{/* Todo
<Canvas of={CreateFormStories._DocsIntro} sourceState={'shown'} />

## Without Handle
Expand All @@ -20,5 +17,4 @@ Add helpful instructions to guide users when filling out the form.
<Canvas of={CreateFormStories._WithInstructions} sourceState={'shown'} />

## Arguments
<ArgTypes of={CreateFormStories} />
*/}
<ArgTypes of={CreateFormStories} />