import type { QuestionnaireItem } from 'fhir/r4';
import type { UseResponsiveProps } from '../hooks/useResponsive';
import type { Breakpoints } from '@mui/material';
import type { RendererStrings } from '../i18n/rendererStrings';
/**
 * RendererConfig interface
 * Provides fine-grained control over the styling and behaviour of the renderer.
 *
 * @property requiredIndicatorPosition - Defines where the required asterisk (*) is placed relative to the label.
 *   - `"start"` (default): Asterisk appears before the label.
 *   - `"end"`: Asterisk appears after the label.
 *
 * @property itemResponsive - Controls responsive layout settings for item labels and fields.
 *   @property labelBreakpoints - Defines breakpoints for label width at different screen sizes.
 *     - Default: `{ xs: 12, md: 4 }`
 *   @property fieldBreakpoints - Defines breakpoints for field width at different screen sizes.
 *     - Default: `{ xs: 12, md: 8 }`
 *   @property columnGapPixels - Spacing (in pixels) between the label and the field.
 *     - Default: `32`
 *   @property rowGapPixels - Vertical spacing (in pixels) between stacked items.
 *     - Default: `4`
 *
 * @property showTabbedFormAt - Defines when the form should switch to a tabbed layout based on screen size.
 *   - Default: `{ query: 'up', start: 'md' }`
 *
 * @property tabListWidthOrResponsive - Configures the width of the tab list, either as a fixed number or responsive breakpoints.
 *   - Default: `{ tabListBreakpoints: { xs: 12, sm: 3, md: 3, lg: 2.75 }, tabContentBreakpoints: { xs: 12, sm: 9, md: 9, lg: 9.25 } }`
 *
 * @property tabListStickyTop - The pixel offset from the top of the viewport at which the tab list becomes sticky.
 *   Set this to the height of any sticky header in the consuming app so the tab list sticks immediately below it.
 *   - Default: `0`
 *
 * @property textFieldWidth - Defines the default width for text input fields (in pixels).
 *   - Default: `320`
 *
 * @property inputsFlexGrow - Determines whether input fields should grow to fill available space.
 *   - `false` (default): Inputs maintain their default size.
 *   - `true`: Inputs expand to fill space.
 *
 * @property reverseBooleanYesNo - If `true`, swaps "Yes" and "No" options for boolean fields.
 *   - Default: `false`
 *
 * @property hideClearButton - If `true`, hides the clear button on input fields.
 *   - Default: `false`
 *
 * @property hideQuantityComparatorField - If `true`, hides the quantity comparator field.
 *   - Default: `false`
 *
 * @property enableWhenAsReadOnly - Determines whether fields hidden by `enableWhen` logic should still be shown as read-only.
 *   - Can be `true` (all fields affected) or a `Set<QuestionnaireItem['type']>` to specify types.
 *   - Default: `false`
 *
 * @property disablePageCardView - If `true`, disables the card-style layout for pages.
 *   - Default: `false`
 *
 * @property disablePageButtons - If `true`, hides navigation buttons for pages.
 *   - Default: `false`
 *
 * @property disableTabButtons - If `true`, hides navigation buttons for tabs.
 *   - Default: `false`
 *
 * @property disableHeadingFocusOnTabSwitch - If `true`, disables automatic focus on the first heading when switching tabs.
 *  - Default: `false`
 *
 * @property hideQuestionnaireTitle - If `true`, suppresses the renderer's built-in rendering of `Questionnaire.title`.
 *   Set this to `true` when the consuming app already renders the title in its own header to avoid displaying it twice.
 *   - Default: `false`
 *
 * @property locale - BCP-47 locale tag (e.g. `'de-CH'`). Drives date formatting and calendar
 *   localisation only — it does **not** select renderer strings. Use `rendererStrings` to translate
 *   the renderer's own UI text. This does not translate `Questionnaire`-sourced text such as `item.text`.
 *   - Default: `undefined` (`DD/MM/YYYY` dates)
 *
 * @property rendererStrings - Consumer-supplied translations/overrides for the renderer's own UI text
 *   (such as the boolean Yes/No labels), merged on top of the English defaults. Supply as many or as
 *   few strings as you need; anything omitted stays English.
 *   - Default: `undefined` (English)
 *
 * @property readOnlyVisualStyle - If `true`, item.readOnly will result in form fields having MUI disabled property and styles (recommended from usability perspective). If `false`, item.readOnly will result in form fields having HTML readonly property (less stable, but recommended from accessibility perspective).
 *   - Default: `true`
 */
export interface RendererConfig {
    readOnlyVisualStyle?: 'disabled' | 'readonly';
    requiredIndicatorPosition?: 'start' | 'end';
    itemResponsive?: {
        labelBreakpoints: Partial<Breakpoints['values']>;
        fieldBreakpoints: Partial<Breakpoints['values']>;
        columnGapPixels: number;
        rowGapPixels: number;
    };
    showTabbedFormAt?: UseResponsiveProps;
    tabListWidthOrResponsive?: number | {
        tabListBreakpoints: Partial<Breakpoints['values']>;
        tabContentBreakpoints: Partial<Breakpoints['values']>;
    };
    tabListStickyTop?: number;
    textFieldWidth?: number;
    inputsFlexGrow?: boolean;
    reverseBooleanYesNo?: boolean;
    hideClearButton?: boolean;
    hideQuantityComparatorField?: boolean;
    enableWhenAsReadOnly?: boolean | Set<QuestionnaireItem['type']>;
    disablePageCardView?: boolean;
    disablePageButtons?: boolean;
    disableTabButtons?: boolean;
    disableHeadingFocusOnTabSwitch?: boolean;
    hideQuestionnaireTitle?: boolean;
    /** BCP-47 locale tag (e.g. `'de-CH'`). Drives date formatting and calendar localisation only — it does not select renderer strings. */
    locale?: string;
    /** Consumer-supplied translations for the renderer chrome, merged on top of the English defaults. */
    rendererStrings?: Partial<RendererStrings>;
}
/**
 * RendererConfigStore properties and methods
 *
 * @author Sean Fong
 */
export interface RendererConfigStoreType {
    readOnlyVisualStyle: 'disabled' | 'readonly';
    requiredIndicatorPosition: 'start' | 'end';
    itemResponsive: {
        labelBreakpoints: Partial<Breakpoints['values']>;
        fieldBreakpoints: Partial<Breakpoints['values']>;
        columnGapPixels: number;
        rowGapPixels: number;
    };
    tabListWidthOrResponsive: number | {
        tabListBreakpoints: Partial<Breakpoints['values']>;
        tabContentBreakpoints: Partial<Breakpoints['values']>;
    };
    tabListStickyTop: number;
    showTabbedFormAt: UseResponsiveProps;
    textFieldWidth: number;
    inputsFlexGrow: boolean;
    reverseBooleanYesNo: boolean;
    hideClearButton: boolean;
    hideQuantityComparatorField: boolean;
    enableWhenAsReadOnly: boolean | Set<QuestionnaireItem['type']>;
    disablePageCardView: boolean;
    disablePageButtons: boolean;
    disableTabButtons: boolean;
    disableHeadingFocusOnTabSwitch: boolean;
    hideQuestionnaireTitle: boolean;
    locale: string | undefined;
    rendererStrings: RendererStrings;
    setRendererConfig: (params: RendererConfig) => void;
}
/**
 * @author Sean Fong
 */
export declare const rendererConfigStore: import("zustand/vanilla").StoreApi<RendererConfigStoreType>;
export declare const useRendererConfigStore: import("zustand/vanilla").StoreApi<RendererConfigStoreType> & {
    use: {
        readOnlyVisualStyle: () => "disabled" | "readonly";
        requiredIndicatorPosition: () => "start" | "end";
        itemResponsive: () => {
            labelBreakpoints: Partial<Breakpoints["values"]>;
            fieldBreakpoints: Partial<Breakpoints["values"]>;
            columnGapPixels: number;
            rowGapPixels: number;
        };
        tabListWidthOrResponsive: () => number | {
            tabListBreakpoints: Partial<Breakpoints["values"]>;
            tabContentBreakpoints: Partial<Breakpoints["values"]>;
        };
        tabListStickyTop: () => number;
        showTabbedFormAt: () => UseResponsiveProps;
        textFieldWidth: () => number;
        inputsFlexGrow: () => boolean;
        reverseBooleanYesNo: () => boolean;
        hideClearButton: () => boolean;
        hideQuantityComparatorField: () => boolean;
        enableWhenAsReadOnly: () => boolean | Set<"string" | "boolean" | "display" | "group" | "question" | "decimal" | "integer" | "date" | "dateTime" | "time" | "text" | "url" | "choice" | "open-choice" | "attachment" | "reference" | "quantity">;
        disablePageCardView: () => boolean;
        disablePageButtons: () => boolean;
        disableTabButtons: () => boolean;
        disableHeadingFocusOnTabSwitch: () => boolean;
        hideQuestionnaireTitle: () => boolean;
        locale: () => string | undefined;
        rendererStrings: () => RendererStrings;
        setRendererConfig: () => (params: RendererConfig) => void;
    };
};