@vigilkids/section-core

Framework-agnostic SDK for the OneX Section Renderer system. Provides shared types, bridge protocol, design tokens, and utilities used by both Vue renderer and admin editor.

Install

pnpm add @vigilkids/section-core

Exports

| Entry Point | Import | Content | |-------------|--------|---------| | Main | @vigilkids/section-core | Types, registry, utilities | | Bridge | @vigilkids/section-core/bridge | PostMessage protocol, PreviewBridge class | | Tokens | @vigilkids/section-core/tokens | Design tokens, product themes, Tailwind preset | | Transforms | @vigilkids/section-core/transforms | Data normalization, schema migration | | Utils | @vigilkids/section-core/utils | safeColor, safeUrl, keyboard helpers, breakpoints |

Key Types

import type { SectionsData, SectionInstance, BlockData, SectionDefinition } from '@vigilkids/section-core'

Bridge Protocol

import { PreviewBridge, validateBridgeMessage } from '@vigilkids/section-core/bridge'
import type { EditorToPreviewMessage, PreviewToEditorMessage } from '@vigilkids/section-core/bridge'

Product Themes

import { getProductTheme, PRODUCT_THEMES } from '@vigilkids/section-core/tokens'

const theme = getProductTheme('visiva')
// → { primary: '#1FB04F', text: '#1a1a1a', ... }

Keyboard Utilities

import { detectUndoRedo, isEditableTarget, isModKey } from '@vigilkids/section-core'

Compatibility

• Node.js ≥ 18
• ESM only (no CJS)
• TypeScript ≥ 5.0

License

MIT