@blockbite/docs 0.1.1

package/src/04-ai-studio/02-mistral.mdx

@@ -0,0 +1,38 @@
+---
+title: "Mistral"
+description: "Using Mistral models inside AI Studio flows."
+tags: ["ai", "mistral"]
+---
+
+# Mistral
+
+Mistral can be used for fast generation tasks and iterative content shaping.
+
+Creating a Mistral key takes a few steps in the Mistral console, then you paste that key into Blockbite AI settings. Follow this sequence once per environment.
+
+## 1. Open API Keys in Mistral AI Studio
+
+Go to AI Studio and open the `API Keys` area from the left navigation.
+
+![Mistral AI Studio sidebar with API Keys](/docs/screenshots/mistral/create-key.png#w=960&h=600)
+
+## 2. Create a new key
+
+From the API keys page, click `Create new key`, then set a key name and optional expiration.
+
+![Create new key button](/docs/screenshots/mistral/api-keys.png#w=960&h=600)
+![Create new key popup](/docs/screenshots/mistral/create-key-popup.png#w=960&h=600)
+
+- `Key name`: Friendly label to identify the key usage.
+- `Expiration`: Optional auto-expiry date for key rotation.
+- `Create new key`: Generates the key value (copy it immediately).
+
+## 3. Connect the key in Blockbite
+
+Paste the generated key into `Blockbite Settings > AI > API Keys`, then click `Connect` to enable Mistral in integrations.
+
+## Tips
+
+- Keep prompts scoped to one transformation per request.
+- Provide expected output format explicitly.
+- Validate generated structure before applying to production blocks.

package/src/04-ai-studio/03-openrouter.mdx

@@ -0,0 +1,15 @@
+---
+title: "OpenRouter"
+description: "Configure and use OpenRouter as an AI provider in AI Studio."
+tags: ["ai", "openrouter"]
+---
+
+# OpenRouter
+
+OpenRouter provides access to multiple model backends through one interface.
+
+## Good practice
+
+- Select model based on latency, cost, and task complexity.
+- Keep provider settings versioned per environment.
+- Add fallback model strategy for critical workflows.

package/src/04-ai-studio/04-prompting.mdx

@@ -0,0 +1,19 @@
+---
+title: "Prompting"
+description: "Prompt structures that produce reliable Blockbite outputs."
+tags: ["ai", "prompting"]
+---
+
+# Prompting
+
+Reliable prompts are explicit, constrained, and testable.
+
+## Template
+
+1. Task objective
+2. Input context
+3. Output format
+4. Constraints
+5. Acceptance criteria
+
+Prefer short prompts with strict output schemas over long narrative prompts.

package/src/04-ai-studio/05-examples.mdx

@@ -0,0 +1,20 @@
+---
+title: "Examples"
+description: "Reference prompt examples for common AI Studio tasks."
+tags: ["ai", "examples"]
+---
+
+# Examples
+
+## Dynamic template prompt example (UI)
+
+This example shows how the AI template editor is configured for a dynamic-template flow. The active tab defines the output stack, and the system template locks the generation constraints.
+
+![Dynamic template prompt example](/docs/screenshots/settings/ai/dynamic-template-prompt-example.png#w=960&h=600)
+
+- `Liquid / Alpine / HTML / TailwindCss`: Sets the expected output stack.
+- `JavaScript`: Alternative mode when JS output is required.
+- `PLATFORM`: Chooses the provider (shown: `Mistral`).
+- `MODEL`: Chooses the model variant (shown: `ministral-8b-2512`).
+- `SYSTEM TEMPLATE`: Instruction block that defines hard constraints and output rules.
+- `Update`: Saves the edited template prompt.

package/src/05-dynamic-content/01-creating-dynamic-fields.mdx

@@ -0,0 +1,15 @@
+---
+title: "Creating Dynamic Fields"
+description: "Define dynamic fields for reusable, data-driven blocks."
+tags: ["dynamic", "fields"]
+---
+
+# Creating Dynamic Fields
+
+Dynamic fields map external or runtime values into block content.
+
+## Field design tips
+
+- Use stable field keys.
+- Define type and fallback for each field.
+- Keep field names semantic (`heroTitle`, `ctaUrl`).

package/src/05-dynamic-content/02-dynamic-templates.mdx

@@ -0,0 +1,18 @@
+---
+title: "Dynamic Templates"
+description: "Template patterns built on top of dynamic fields."
+tags: ["dynamic", "templates"]
+---
+
+# Dynamic Templates
+
+Dynamic templates combine fixed layout with field-driven content.
+
+## Build sequence
+
+1. Create fields.
+2. Bind fields to template nodes.
+3. Define defaults and empty states.
+4. Validate in the template block preview.
+
+See also: [Core Concepts: Dynamic Templates](/docs/core-concepts/dynamic-templates)

package/src/05-dynamic-content/03-the-dynamic-template-block.mdx

@@ -0,0 +1,16 @@
+---
+title: "Dynamic Template Block"
+description: "Use Dynamic Template Block in real page compositions."
+tags: ["dynamic", "block"]
+---
+
+# Dynamic Template Block
+
+Dynamic Template Block is the runtime wrapper that renders template + data.
+
+## Runtime checklist
+
+- Required fields are present.
+- Fallbacks are configured.
+- Empty states are user-safe.
+- Render output matches schema constraints.

package/src/06-atom-blocks/01-button.mdx

@@ -0,0 +1,13 @@
+---
+title: "Button"
+description: "Atomic button block usage and variant guidance."
+tags: ["atom", "button"]
+---
+
+# Button
+
+Use `button` for primary and secondary actions.
+
+- Keep action text explicit.
+- Support disabled/loading states.
+- Prefer token-based variants.

package/src/06-atom-blocks/02-group.mdx

@@ -0,0 +1,11 @@
+---
+title: "Group"
+description: "Group block for layout and hierarchy composition."
+tags: ["atom", "group"]
+---
+
+# Group
+
+`group` clusters related atoms into one layout container.
+
+Use it to control alignment, spacing, and shared semantics.

package/src/06-atom-blocks/03-frame.mdx

@@ -0,0 +1,11 @@
+---
+title: "Frame"
+description: "Frame block as a structural wrapper for regions and sections."
+tags: ["atom", "frame"]
+---
+
+# Frame
+
+`frame` defines structural boundaries for content areas.
+
+Use frames for section-level layout, visual grouping, and responsive bounds.

package/src/06-atom-blocks/04-icon.mdx

@@ -0,0 +1,11 @@
+---
+title: "Icon"
+description: "Icon atom block and SVG integration basics."
+tags: ["atom", "icon"]
+---
+
+# Icon
+
+`icon` renders token-aware SVG assets.
+
+Keep icon sizing and stroke style consistent across variants.

package/src/06-atom-blocks/05-shape.mdx

@@ -0,0 +1,11 @@
+---
+title: "Shape"
+description: "Use shape atoms for decorative and structural geometry."
+tags: ["atom", "shape"]
+---
+
+# Shape
+
+`shape` supports basic geometric elements for decoration or layout scaffolding.
+
+Prefer reusable shape tokens over one-off custom vectors.

package/src/06-atom-blocks/06-richtext-auto.mdx

@@ -0,0 +1,11 @@
+---
+title: "Richtext Auto"
+description: "Auto-formatting rich text atom with safe defaults."
+tags: ["atom", "richtext"]
+---
+
+# Richtext Auto
+
+`richtext auto` adapts content formatting using configured typography tokens.
+
+Use for authored content where formatting should remain controlled.

package/src/06-atom-blocks/07-richtext-group.mdx

@@ -0,0 +1,11 @@
+---
+title: "Richtext Group"
+description: "Compose multiple rich text nodes as one reusable text unit."
+tags: ["atom", "richtext"]
+---
+
+# Richtext Group
+
+`richtext group` combines heading/body/meta text into one structured unit.
+
+Define clear field bindings for each child text node.

package/src/07-addons/01-figma.mdx

@@ -0,0 +1,11 @@
+---
+title: "Figma"
+description: "Figma addon integration and synchronization basics."
+tags: ["addons", "figma"]
+---
+
+# Figma
+
+The Figma addon connects design assets and structure into Blockbite workflows.
+
+Use it to reduce manual translation between design and implementation.

package/src/07-addons/02-responsive-compiler.mdx

@@ -0,0 +1,15 @@
+---
+title: "Responsive Compiler"
+description: "Compile responsive behavior from design intent to block output."
+tags: ["addons", "responsive"]
+---
+
+# Responsive Compiler
+
+Responsive Compiler converts breakpoint intent into consistent responsive rules.
+
+## Validation points
+
+- Breakpoint coverage is complete.
+- Layout shifts are intentional.
+- Text and media remain readable at all sizes.

package/src/08-experimental/01-purge-optimize.mdx

@@ -0,0 +1,26 @@
+---
+title: "Purge Optimize"
+description: "Experimental optimization flow for reducing output size."
+tags: ["experimental", "optimize"]
+---
+
+# Purge Optimize
+
+`purge optimize` is experimental and may change without notice.
+
+Use it to reduce generated output by removing unused styles and fragments.
+
+Validate thoroughly before production rollout.
+
+![Optimization and security settings](/docs/screenshots/settings/optimze-and-security.png#w=960&h=600)
+
+## Controls in Optimization & Security
+
+This tab combines build optimization and runtime safety toggles. Use it carefully, especially when enabling less restrictive template rendering.
+
+- `Minify Js`: Minifies exported JavaScript files.
+- `Minify Css`: Minifies exported CSS files.
+- `Hide default pattern categories`: Unregisters default WordPress pattern categories.
+- `Allow unfiltered dynamic templates`: Bypasses HTML sanitization for dynamic templates (recommended only for trusted authors).
+- Purge warning panel: Highlights backup requirements and risk before purge operations.
+- `I have backed up my database and uploads/blockbite folder`: Explicit confirmation toggle before purge-related actions.

package/src/08-experimental/02-nextjs.mdx

@@ -0,0 +1,26 @@
+---
+title: "Nextjs"
+description: "Experimental Next.js integration notes."
+tags: ["experimental", "nextjs"]
+---
+
+# Nextjs
+
+This integration path is experimental and focused on exposing Blockbite data to external Next.js applications. The settings below control the REST endpoints used by your frontend.
+
+![Next.js settings tab](/docs/screenshots/settings/nextjs.png#w=960&h=612)
+
+## Controls in the NextJs tab
+
+- `Enable Next.js REST routes`: Turns the Next.js endpoint set on or off.
+- `NEXT HOME ENDPOINT`: Base endpoint for homepage content.
+- `NEXT ITEM ENDPOINT`: Fetch a single page/post by slug and type.
+- `NEXT ITEMS ENDPOINT`: Fetch a collection by content type.
+- `NEXT SEARCH ENDPOINT`: Search endpoint with `query` and `limit` parameters.
+- `NEXT CONFIG ENDPOINT`: Returns integration/configuration data for the Next.js consumer.
+
+## API response example
+
+The response contains page metadata and an array of Blockbite blocks. Each block can include `blockName`, `id`, and `innerHTML`, which you can render in your Next.js app.
+
+![REST API JSON example with innerHTML](/docs/screenshots/nextjs/rest-api-with-inner-html.png#w=960&h=600)

package/src/09-more/01-usefull-links.mdx

@@ -0,0 +1,13 @@
+---
+title: "Usefull Links"
+description: "Handy links for platform docs and integrations."
+tags: ["links", "resources"]
+---
+
+# Usefull Links
+
+- [Tailwind CSS Documentation](https://tailwindcss.com/docs)
+- [Next.js Documentation](https://nextjs.org/docs)
+- [MDN Web Docs](https://developer.mozilla.org/)
+- [OpenRouter Docs](https://openrouter.ai/docs)
+- [Mistral Documentation](https://docs.mistral.ai/)

package/src/10-advanced-guides/01-creating-bites.mdx

@@ -0,0 +1,9 @@
+---
+title: "Creating Bites"
+description: "A description for Creating Bites."
+tags: []
+---
+
+# Creating Bites
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit.

package/src/10-advanced-guides/02-platform-sync.mdx

@@ -0,0 +1,27 @@
+---
+title: "Platform Sync"
+description: "Connect your project and export it to the Blockbite platform."
+tags: ["platform", "sync", "projects"]
+---
+
+# Platform Sync
+
+Platform Sync links your WordPress installation to your Blockbite account so you can push project updates. Configure this once per site/environment.
+
+## Project setup tab
+
+Open `Blockbite Settings > Projects` and connect your project.
+
+![Projects settings tab](/docs/screenshots/settings/projects.png#w=960&h=600)
+
+- `PROJECT TOKEN`: Secret token from your Blockbite account.
+- Visibility icon in token field: Show or hide the token while editing.
+- `Connect`: Validates and stores the project connection.
+- `Download figma media on page save`: Downloads referenced Figma assets into the WordPress media library during save.
+
+## Export to platform
+
+After connecting, use export to push the project to Blockbite.
+
+- `Export Project`: Sends your current project to the Blockbite platform.
+- Export notice: Dynamic content sources are not exported.

package/src/11-cli/01-command-reference.mdx

@@ -0,0 +1,144 @@
+---
+title: "CLI Commands"
+description: "WP-CLI command reference for using the Blockbite plugin."
+tags: ["cli", "wp-cli", "plugin"]
+---
+
+# CLI Commands
+
+This page lists the plugin usage commands for Blockbite via WP-CLI.
+
+## Base command aliases
+
+Both prefixes are supported:
+
+```bash
+wp bb ...
+wp blockbite ...
+```
+
+## All registered command roots
+
+```bash
+wp bb nodes
+wp bb compile
+wp bb changes
+wp bb dev <on|off|status|watch>
+wp bb cdn <list|add|remove|set|clear>
+wp blockbite migrate-namespaces
+wp blockbite figma nodes
+wp blockbite compiler
+wp blockbite changes
+wp blockbite dev <on|off|status|watch>
+wp blockbite cdn <list|add|remove|set|clear>
+```
+
+Examples:
+
+```bash
+wp bb nodes --all
+wp blockbite figma nodes --all
+```
+
+## Nodes sync commands
+
+Main command:
+
+```bash
+wp bb nodes --all
+```
+
+Namespace-scoped sync:
+
+```bash
+wp bb nodes --namespaces=[clients,services]
+```
+
+Create-only bootstrap mode:
+
+```bash
+wp bb nodes --namespaces=[clients,services] --create
+```
+
+Sync with dynamic fields:
+
+```bash
+wp bb nodes --namespaces=[clients,services] --fields
+```
+
+Force rebuild fields (requires `--fields`):
+
+```bash
+wp bb nodes --namespaces=[clients,services] --fields --fields-force
+```
+
+Sync bite patterns:
+
+```bash
+wp bb nodes --namespaces=[clients,services] --bite-patterns
+```
+
+Sync fields + bite patterns:
+
+```bash
+wp bb nodes --namespaces=[clients,services] --fields --bite-patterns
+```
+
+## Changes commands
+
+Generate JSON changesets between exports:
+
+```bash
+wp bb changes
+wp bb changes --pull=false
+wp bb changes --from=20260220-211333 --to=20260221-082527
+wp bb changes --time=20260221-082527
+```
+
+## Frontend dev mode commands
+
+```bash
+wp bb dev on
+wp bb dev status
+wp bb dev watch
+wp bb dev watch --interval=500
+wp bb dev watch --once
+wp bb dev off
+```
+
+## CDN library commands
+
+```bash
+wp bb cdn list
+wp bb cdn list --format=json
+wp bb cdn list --format=ids
+wp bb cdn add --ids=swiper_element,alpine_core
+wp bb cdn remove --ids=swiper_element
+wp bb cdn set --ids=swiper_element,alpine_core,gsap_core,gsap_scrolltrigger
+wp bb cdn clear
+```
+
+## Namespace migration command
+
+```bash
+wp blockbite migrate-namespaces
+```
+
+## Legacy commands (disabled)
+
+These still exist as aliases but return an error and instruct you to use `bb nodes`:
+
+```bash
+wp bb compile
+wp blockbite compiler
+```
+
+## With DDEV
+
+Prefix any command with DDEV:
+
+```bash
+ddev wp --path=/var/www/html bb nodes --namespaces=[clients,services]
+ddev wp --path=/var/www/html bb dev watch
+ddev wp --path=/var/www/html bb cdn list
+```

package/src/doc-home.mdx

@@ -0,0 +1,73 @@
+# Blockbite Documentation
+
+This documentation is organized by feature area. Start with Core Concepts, then move into Design Framework and Dynamic Content.
+
+## Core Concepts
+
+- [Introduction](/docs/core-concepts/introduction)
+- [Tailwind & Visual Editor](/docs/core-concepts/tailwind-css)
+- [Design Panel Basics](/docs/core-concepts/design-panel-basics)
+- [Code Editor & Live Preview](/docs/core-concepts/code-editor-livepreview)
+- [Deprecating Presets](/docs/core-concepts/deprecating-presets)
+- [Dynamic Templates](/docs/core-concepts/dynamic-templates)
+- [Fills](/docs/core-concepts/fills)
+- [CDN Libraries](/docs/core-concepts/cdn-libraries)
+
+## Design Framework
+
+- [Introduction](/docs/design-framework/introduction)
+- [Design Tokens](/docs/design-framework/design-tokens)
+- [Schema (v1)](/docs/design-framework/schema-v1)
+- [Svgs](/docs/design-framework/svgs)
+- [Bite Components](/docs/design-framework/bite-components)
+- [Block Patterns](/docs/design-framework/block-patterns)
+- [Namespaces](/docs/design-framework/namespaces)
+
+## Ai Studio
+
+- [Introduction](/docs/ai-studio/introduction)
+- [Mistral](/docs/ai-studio/mistral)
+- [OpenRouter](/docs/ai-studio/openrouter)
+- [Prompting](/docs/ai-studio/prompting)
+- [Examples](/docs/ai-studio/examples)
+
+## Dynamic Content
+
+- [Creating Dynamic Fields](/docs/dynamic-content/creating-dynamic-fields)
+- [Dynamic Templates](/docs/dynamic-content/dynamic-templates)
+- [Dynamic Template Block](/docs/dynamic-content/the-dynamic-template-block)
+
+## Atom Blocks
+
+- [Button](/docs/atom-blocks/button)
+- [Group](/docs/atom-blocks/group)
+- [Frame](/docs/atom-blocks/frame)
+- [Icon](/docs/atom-blocks/icon)
+- [Shape](/docs/atom-blocks/shape)
+- [Richtext Auto](/docs/atom-blocks/richtext-auto)
+- [Richtext Group](/docs/atom-blocks/richtext-group)
+
+## Addons
+
+- [Figma](/docs/addons/figma)
+- [Responsive Compiler](/docs/addons/responsive-compiler)
+
+## Experimental
+
+- [Purge Optimize](/docs/experimental/purge-optimize)
+- [Nextjs](/docs/experimental/nextjs)
+
+## More
+
+- [Usefull Links](/docs/more/usefull-links)
+
+## CLI
+
+- [Command Reference](/docs/cli/command-reference)
+
+## Introduction
+
+- [Installation](/docs/introduction/installation)
+- [Getting Started](/docs/introduction/getting-started)
+- [Contributing](/docs/introduction/contributing)
+- [Quick Learn](/docs/introduction/quick-learn)