Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/GoogleForCreators/web-stories-wp/llms.txt

Use this file to discover all available pages before exploring further.

Web Stories for WordPress provides several standalone npm packages that can be used to build Web Stories applications on any platform. These packages are published to npm and can be integrated into any JavaScript project.

​
Available Packages

Web Stories for WordPress publishes 25+ packages to npm. The core packages documented here are the most commonly used for building Web Stories applications.

​
Documented Packages

@googleforcreators/story-editor

The core Web Stories editor application

@googleforcreators/design-system

UI components for editor and dashboard

@googleforcreators/animation

Animation library for Web Stories

@googleforcreators/elements

Element type registration and management

​
Additional Packages

The following packages are also available on npm: Editor & Dashboard:
  • @googleforcreators/dashboard - Dashboard application
  • @googleforcreators/element-library - Pre-built element library
  • @googleforcreators/templates - Template management
  • @googleforcreators/text-sets - Pre-designed text sets
Media & Assets:
  • @googleforcreators/media - Media utilities
  • @googleforcreators/fonts - Font management
  • @googleforcreators/masks - Shape masks library
  • @googleforcreators/stickers - Sticker assets
Rendering & Output:
  • @googleforcreators/output - Story output rendering
  • @googleforcreators/moveable - Element movement and resizing
  • @googleforcreators/transform - Element transformations
Utilities:
  • @googleforcreators/date - Date utilities
  • @googleforcreators/dom - DOM utilities
  • @googleforcreators/i18n - Internationalization
  • @googleforcreators/migration - Data migration
  • @googleforcreators/patterns - Design patterns
  • @googleforcreators/react - React utilities
  • @googleforcreators/rich-text - Rich text editing
  • @googleforcreators/tracking - Analytics tracking
  • @googleforcreators/units - Unit conversion
  • @googleforcreators/url - URL utilities
Detailed documentation for these packages is forthcoming. For now, refer to the source code and TypeScript definitions.

​
Installation

All packages are available on npm and can be installed using your preferred package manager: 
npm install @googleforcreators/story-editor

​
Requirements

All packages require:
  • Node.js: >= 20, 22, or 24
  • npm: >= 7.3
  • React: 17.x (peer dependency)
  • styled-components: 5.x (peer dependency)

​
Package Structure

Each package follows a consistent structure:
  • dist/ - CommonJS build
  • dist-module/ - ES Module build
  • dist-types/ - TypeScript type definitions
  • src/ - Source code

​
TypeScript Support

All packages include TypeScript type definitions in the dist-types/ directory. Import types from the package: 
import type { Element, Page } from '@googleforcreators/elements';
import type { AnimationType } from '@googleforcreators/animation';

​
License

All packages are licensed under Apache-2.0.

​
Repository

Source code: github.com/GoogleForCreators/web-stories-wp

​
Next Steps

Story Editor

Learn how to integrate the story editor

Design System

Explore UI components