@arqel-dev/fields-advanced

Advanced React input components for Arqel — RichText, Markdown, Code, Repeater, Builder, KeyValue, Tags, Wizard. Sibling do pacote PHP arqel-dev/fields-advanced: o PHP define os types/setters; este pacote JS provê o render layer.

Status

🚧 Pre-alpha — FIELDS-ADV-018 (scoped) entregue: skeleton do pacote + lazy registry para 8 component slots. Cada slot ainda renderiza um placeholder; as implementações concretas chegam em FIELDS-ADV-010..017.

Install

pnpm add @arqel-dev/fields-advanced @arqel-dev/ui @arqel-dev/types

Usage

// resources/js/app.tsx
import '@arqel-dev/ui/styles.css';
import '@arqel-dev/fields/register';            // built-ins (text, number, ...)
import '@arqel-dev/fields-advanced/register';   // side effect: lazy register dos 8 slots

import { createArqelApp } from '@arqel-dev/react/inertia';

createArqelApp({ appName: 'Acme', pages: import.meta.glob('./Pages/**/*.tsx') });

Cada registerField() envolve um import() dinâmico em React.lazy, então o chunk só é carregado quando o field correspondente renderizar pela primeira vez (Suspense boundary required no app shell — ver @arqel-dev/ui).

Subpath imports

import { RichTextInput } from '@arqel-dev/fields-advanced/rich-text';
import { MarkdownInput } from '@arqel-dev/fields-advanced/markdown';
import { CodeInput }     from '@arqel-dev/fields-advanced/code';
import { RepeaterInput } from '@arqel-dev/fields-advanced/repeater';
import { BuilderInput }  from '@arqel-dev/fields-advanced/builder';
import { KeyValueInput } from '@arqel-dev/fields-advanced/key-value';
import { TagsInput }     from '@arqel-dev/fields-advanced/tags';
import { WizardInput }   from '@arqel-dev/fields-advanced/wizard';

Links

• Documentação — em construção
• PLANNING — tickets FIELDS-ADV-*