import * as _dereekb_rxjs from '@dereekb/rxjs';
import * as rxjs from 'rxjs';
import * as i0 from '@angular/core';
import { EnvironmentProviders } from '@angular/core';
import { Maybe } from '@dereekb/util';
import { AbstractSyncForgeFormDirective } from '@dereekb/dbx-form';
import { DbxStyleDemoControls, DbxStyleDemoStyleTemplateKey, DbxStyleDemoSectionId, DbxStyleDemoControlsService, DbxStyleDemoSectionGroup } from '@dereekb/dbx-web/style-demo';
import { FormConfig } from '@ng-forge/dynamic-forms';
import { AbstractPopoverDirective } from '@dereekb/dbx-web';

/**
 * Abstract base for the slim style-demo controls form components ({@link DbxFormStyleDemoPresetsComponent},
 * {@link DbxFormStyleDemoSectionsComponent}).
 *
 * Keeps a single `pickablechipfield` form in two-way sync with the playground's {@link DbxStyleDemoControls} (read from
 * the `controls` input). The controls UI lives in dbx-form because the pickable chip field is a `@dereekb/dbx-form`
 * field, which `@dereekb/dbx-web` cannot import.
 *
 * Both sync directions are driven off the form's state stream so they survive the component being recreated each time
 * the panel/popover reopens:
 *
 * - **Controls → form (seed):** {@link dbxFormSourceObservableFromStream} in `'reset'` mode re-pushes the controls
 *   state into the form every time the form enters its RESET state. This covers the initial ready transition — which
 *   only fires once the forge field delegate has registered — so the chips seed from the live service state even though the
 *   delegate's `init` ignores the context's pending initial value. The `isSettingValue` guard filters the synchronous
 *   reset feedback `setValue` produces, exactly as `DbxFormSourceDirective` documents.
 * - **Form → controls (write-back):** only genuine user edits are applied. `setValue` marks the form pristine and
 *   untouched, so every seed / reset / initialization emission is `pristine: true`; the pickable chip field marks its
 *   control dirty on toggle, so a user edit is the only `pristine: false` emission. Filtering on that keeps init/reset
 *   noise from ever wiping the live service state.
 *
 * This directive is demo/debug-only and disposable — it is not a dbx-form core runtime primitive.
 *
 * @typeParam V - The form value type (a subset of the controls state: enabled sections or active presets).
 */
declare abstract class AbstractDbxFormStyleDemoControlsFormDirective<V extends object> extends AbstractSyncForgeFormDirective<V> {
    /**
     * The playground control surface to keep the chip field in sync with.
     */
    readonly controls: i0.InputSignal<Maybe<DbxStyleDemoControls>>;
    /**
     * Guards the controls→form seed against the `setValue` → `resetForm` feedback loop: set before `setValue` and cleared
     * on the next microtask, so the synchronous reset emission `setValue` triggers on the stream is filtered out.
     */
    private _isSettingValue;
    /**
     * Builds the form value from the controls service signals.
     */
    protected abstract readControlsValue(controls: DbxStyleDemoControls): V;
    /**
     * Diff-applies the form value to the controls service via its setters, writing only the deltas.
     */
    protected abstract applyValueToControls(controls: DbxStyleDemoControls, value: V): void;
    /**
     * The controls state as a form value, recomputed whenever the controls signals change.
     */
    private readonly _controlsValue$;
    /**
     * Controls → form: seed the form with the controls state on every RESET (see class docs).
     */
    protected readonly _seedFormSub: _dereekb_rxjs.SubscriptionObject<rxjs.Subscription>;
    /**
     * Form → controls: write back only genuine user edits (`pristine: false`), diff-applied as deltas (see class docs).
     */
    protected readonly _writeBackSub: _dereekb_rxjs.SubscriptionObject<rxjs.Subscription>;
    static ɵfac: i0.ɵɵFactoryDeclaration<AbstractDbxFormStyleDemoControlsFormDirective<any>, never>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<AbstractDbxFormStyleDemoControlsFormDirective<any>, never, never, { "controls": { "alias": "controls"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
}

/**
 * Form value for the {@link DbxFormStyleDemoPresetsComponent}: the keys of the active style-lever presets.
 */
interface DbxFormStyleDemoPresetsFormValue {
    readonly presets: DbxStyleDemoStyleTemplateKey[];
}
/**
 * Slim chip-field controls UI picking which style-lever presets are active, kept in two-way sync with the playground's
 * {@link DbxStyleDemoControls}. Presets restyle the whole app, so this is what the global "Style Controls" detach panel
 * renders.
 *
 * Because the chip field is a `dbx-forge` field, the host app must register its forge field declarations (the demo
 * app does so via `provideDbxFormConfiguration()` + `provideDbxForgeFormFieldDeclarations()`).
 *
 * This component is demo/debug-only and disposable — it is not a dbx-form core runtime primitive.
 */
declare class DbxFormStyleDemoPresetsComponent extends AbstractDbxFormStyleDemoControlsFormDirective<DbxFormStyleDemoPresetsFormValue> {
    readonly formConfig: FormConfig;
    protected readControlsValue(controls: DbxStyleDemoControls): DbxFormStyleDemoPresetsFormValue;
    protected applyValueToControls(controls: DbxStyleDemoControls, value: DbxFormStyleDemoPresetsFormValue): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<DbxFormStyleDemoPresetsComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<DbxFormStyleDemoPresetsComponent, "dbx-form-style-demo-presets", never, {}, {}, never, never, true, never>;
}

/**
 * Form value for the {@link DbxFormStyleDemoSectionsComponent}: the ids of the enabled (visible) sections.
 */
interface DbxFormStyleDemoSectionsFormValue {
    readonly sections: DbxStyleDemoSectionId[];
}
/**
 * Slim chip-field controls UI picking which showcase sections are visible, kept in two-way sync with the playground's
 * {@link DbxStyleDemoControls}. Sections only affect the `<dbx-style-demo>` playground page, so this renders inside a
 * popover opened from the playground header rather than the global controls panel.
 *
 * Because the chip field is a `dbx-forge` field, the host app must register its forge field declarations (the demo
 * app does so via `provideDbxFormConfiguration()` + `provideDbxForgeFormFieldDeclarations()`).
 *
 * This component is demo/debug-only and disposable — it is not a dbx-form core runtime primitive.
 */
declare class DbxFormStyleDemoSectionsComponent extends AbstractDbxFormStyleDemoControlsFormDirective<DbxFormStyleDemoSectionsFormValue> {
    readonly formConfig: FormConfig;
    protected readControlsValue(controls: DbxStyleDemoControls): DbxFormStyleDemoSectionsFormValue;
    protected applyValueToControls(controls: DbxStyleDemoControls, value: DbxFormStyleDemoSectionsFormValue): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<DbxFormStyleDemoSectionsComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<DbxFormStyleDemoSectionsComponent, "dbx-form-style-demo-sections", never, {}, {}, never, never, true, never>;
}

/**
 * Popover that renders {@link DbxFormStyleDemoSectionsComponent} inside the shared popover chrome, registered as the
 * style-demo sections component via `DBX_STYLE_DEMO_SECTIONS_COMPONENT` (see `provideDbxFormStyleDemo()`).
 *
 * `DbxStyleDemoControlsService` opens this through `DbxPopoverService`, anchored to the playground header's "Sections"
 * button, because sections only affect the `<dbx-style-demo>` playground page (unlike presets, which restyle the whole
 * app). `dbx-popover-scroll-content` gives the long sections list correct scrolling. The component reads the same
 * {@link DbxStyleDemoControlsService} instance and forwards it to the sections component, which owns the chip field and
 * the controls↔form sync.
 *
 * This component is demo/debug-only and disposable — it is not a dbx-form core runtime primitive.
 */
declare class DbxFormStyleDemoSectionsPopoverComponent extends AbstractPopoverDirective {
    readonly controlsService: DbxStyleDemoControlsService;
    static ɵfac: i0.ɵɵFactoryDeclaration<DbxFormStyleDemoSectionsPopoverComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<DbxFormStyleDemoSectionsPopoverComponent, "dbx-form-style-demo-sections-popover", never, {}, {}, never, never, true, never>;
}

/**
 * Detach panel that renders {@link DbxFormStyleDemoPresetsComponent} inside the shared detach chrome, registered as the
 * style-demo controls component via `DBX_STYLE_DEMO_CONTROLS_COMPONENT` (see `provideDbxFormStyleDemo()`).
 *
 * `DbxStyleDemoControlsService` opens this through `DbxDetachService`, so the panel survives navigation and is available
 * app-wide. It renders the presets chips (which restyle the whole app); sections (which only affect the playground page)
 * live in their own popover opened from the playground header. The component reads the same
 * {@link DbxStyleDemoControlsService} instance and forwards it to the presets component, which owns the chip field and
 * the controls↔form sync. Scrolling within the fixed-height pane comes from `.dbx-detach-content-container`.
 *
 * This component is demo/debug-only and disposable — it is not a dbx-form core runtime primitive.
 */
declare class DbxFormStyleDemoControlsDetachComponent {
    readonly controlsService: DbxStyleDemoControlsService;
    static ɵfac: i0.ɵɵFactoryDeclaration<DbxFormStyleDemoControlsDetachComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<DbxFormStyleDemoControlsDetachComponent, "dbx-form-style-demo-controls-detach", never, {}, {}, never, never, true, never>;
}

/**
 * Style-demo section rendering a representative `<dbx-forge>` form (name, email, select, textarea, checkbox, toggle)
 * so the form-field surfaces are visible in the playground. Fields paint from the `--mat-form-field-*` and surface
 * tokens, so they respond live to the Shape and Surface levers and flip with light/dark.
 *
 * Requires the host app to register its forge field declarations (the demo app does so via
 * `provideDbxFormConfiguration()` + `provideDbxForgeFormFieldDeclarations()`).
 *
 * @dbxDocsUiExample
 * @dbxDocsUiExampleSlug style-demo-form-fields
 * @dbxDocsUiExampleCategory style-demo
 * @dbxDocsUiExampleSummary A representative dbx-forge form (name, email, select, textarea, checkbox, toggle).
 * @dbxDocsUiExampleRelated text, value-selection, checkbox
 */
declare class DbxFormStyleDemoFieldsSectionComponent extends AbstractSyncForgeFormDirective<object> {
    readonly formConfig: FormConfig;
    static ɵfac: i0.ɵɵFactoryDeclaration<DbxFormStyleDemoFieldsSectionComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<DbxFormStyleDemoFieldsSectionComponent, "dbx-form-style-demo-fields-section", never, {}, {}, never, never, true, never>;
}

/**
 * The `@dereekb/dbx-form/style-demo` section group.
 */
declare const DBX_FORM_STYLE_DEMO_SECTION_GROUP: DbxStyleDemoSectionGroup;
/**
 * Registers the `@dereekb/dbx-form/style-demo` sections with the `<dbx-style-demo>` playground, registers
 * {@link DbxFormStyleDemoControlsDetachComponent} as the global style-demo controls (presets) detach panel, and registers
 * {@link DbxFormStyleDemoSectionsPopoverComponent} as the style-demo sections popover opened from the playground header.
 *
 * The Form Fields section, the controls panel, and the sections popover all render `<dbx-forge>` forms, so the host app
 * must register its forge field declarations (e.g. `provideDbxFormConfiguration()` + `provideDbxForgeFormFieldDeclarations()`) for them to render.
 *
 * Pair with `provideDbxStyleDemo()` (the shell from `@dereekb/dbx-web/style-demo`).
 *
 * @returns EnvironmentProviders contributing the form sections, the controls detach component, and the sections popover component.
 *
 * @__NO_SIDE_EFFECTS__
 */
declare function provideDbxFormStyleDemo(): EnvironmentProviders;

export { AbstractDbxFormStyleDemoControlsFormDirective, DBX_FORM_STYLE_DEMO_SECTION_GROUP, DbxFormStyleDemoControlsDetachComponent, DbxFormStyleDemoFieldsSectionComponent, DbxFormStyleDemoPresetsComponent, DbxFormStyleDemoSectionsComponent, DbxFormStyleDemoSectionsPopoverComponent, provideDbxFormStyleDemo };
export type { DbxFormStyleDemoPresetsFormValue, DbxFormStyleDemoSectionsFormValue };