pieceofcake2 / storybook

v1.3.0 2026-10-18 16:30 UTC

Requires

• php: ^8.0
• composer/installers: ^1.0 || ^2.0
• pieceofcake2/cakephp: ^2.12

Requires (Dev)

• phpstan/phpstan: ^2.1
• phpunit/phpunit: ^9.6
• pieceofcake2/app: ^2.2
• pieceofcake2/phpcs-cakephp2: ^1.1
• pieceofcake2/phpstan-cakephp2: ^1.0

MIT

• cakephp
• cakephp2
• storybook
• vite

Published on Packagist.org on 2026-10-18 16:30 UTC

README

pieceofcake2/storybook renders the Elements of a CakePHP 2 application in Storybook. It is inspired by Storybook for Symfony. A story names an Element and its args, Storybook sends them to the application, and the application renders the Element with its own View class and helpers.

// stories/components/button.stories.ts
import type { Meta, StoryObj } from '@pieceofcake2/storybook';

const meta = {
    component: 'components/button', // templates/Elements/components/button.php
    args: { label: 'Apply', url: '/jobs/1' },
} satisfies Meta;

export default meta;

export const Primary: StoryObj<typeof meta> = {};

It consists of a CakePHP plugin, which provides the render endpoint (POST /_storybook/render), and a Storybook framework that uses Vite (@pieceofcake2/storybook, included in the Composer package).

Important

This plugin is for development only. Install it as a dev dependency (composer require --dev), and never install it in production. The render endpoint works only in debug mode.

Documentation

• Website: https://pieceofcake2.github.io/storybook/ (日本語: https://pieceofcake2.github.io/storybook/ja/)
• Markdown: docs/README.md (日本語: docs/ja/README.md) (for AI tools and offline reading)

The Markdown documentation is also included in the Composer package, in the plugin's directory: plugins/Storybook/docs/README.md (the location depends on your installer-paths).

Requirements

• PHP 8.0+
• pieceofcake2/cakephp 2.12+
• Node.js 20.19+, Storybook 10 and Vite 5 to 8
• To publish a static Storybook: playwright-core and Chrome or Chromium

Installation

composer require --dev pieceofcake2/storybook
npm install --save-dev storybook@^10 vite @pieceofcake2/storybook@file:plugins/Storybook/storybook

Then load the plugin with its routes when it is installed, and configure .storybook/main.ts. See Installation.

Develop the stories with storybook dev and the application running in debug mode. To publish Storybook (e.g. on a development server running with debug 0 and without the plugin), pre-render the stories into a static build, which does not request the application:

npx storybook build -o storybook-static
npx storybook-cakephp prerender --server http://127.0.0.1:8765 --dir storybook-static

See Publishing a Static Storybook.

Security

Only the name of an Element (under the allowed directories, Elements/components/ by default) and its args are sent to the application, never a template or code. The render endpoint exists only where the plugin is installed, and only in debug mode: production is deployed with composer install --no-dev, so it does not have the plugin. See Security and Keeping Storybook out of Production.

Contributing

See the contribution guidelines.

The Storybook framework is in storybook/. Its build (storybook/dist/) is committed, since applications install it from the Composer package without building it.

Origin

This package was created by pieceofcake2, which also maintains it. It is inspired by Storybook for Symfony, and parts of the Storybook framework are adapted from it (MIT License, Copyright (c) 2024 SensioLabs). See storybook/NOTICE.md.

License

MIT License. See LICENSE.