import { ButtonHTMLAttributes } from 'react'; import { ChoiceValue } from '@viamedici-spc/configurator-ts'; import { ChoiceValueId } from '@viamedici-spc/configurator-ts'; import { ComponentType } from 'react'; import { ConstraintExplanation } from '@viamedici-spc/configurator-ts'; import { ControlType } from 'framer'; import { CSSProperties } from 'react'; import { ExplainQuestion as CustomExplainQuestion } from '@viamedici-spc/configurator-ts'; import { DecisionExplanation } from '@viamedici-spc/configurator-ts'; import { DecisionsExplainAnswer } from '@viamedici-spc/configurator-ts'; import { ExplainQuestionParam } from '@viamedici-spc/configurator-ts'; import { ForwardRefExoticComponent } from 'react'; import { ForwardRefRenderFunction } from 'react'; import { GlobalAttributeId } from '@viamedici-spc/configurator-ts'; import { HTMLAttributes } from 'react'; import { JSX as JSX_2 } from 'react/jsx-runtime'; import NumericFormat from 'react-number-format'; import { PropsWithChildren } from 'react'; import { PropsWithoutRef } from 'react'; import { default as React_2 } from 'react'; import { ReactElement } from 'react'; import { ReactNode } from 'react'; import { Ref } from 'react'; import { RefAttributes } from 'react'; import { UseExplainResult as UseExplainResult_2 } from '@viamedici-spc/configurator-react'; export declare const attributeIdPropertyControls: { attributeId: { title: string; type: ControlType.String; }; componentPath: { title: string; type: ControlType.String; }; sharedConfigurationModel: { title: string; type: ControlType.String; }; }; export declare type AttributeIdProps = { attributeId: string; componentPath: string; sharedConfigurationModel: string; }; /** * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ export declare const AttributeName: ComponentType>; /** * @framerIntrinsicWidth 300 * @framerIntrinsicHeight 35 * * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight fixed */ export declare const BooleanSelect: ComponentType, "ref"> & RefAttributes, "ref"> & RefAttributes, "ref"> & RefAttributes>; declare type BorderProps = { radius: number; border: { color: string; width: number; isMixedWidth: boolean; widthTop: number; widthRight: number; widthBottom: number; widthLeft: number; }; }; declare type BoxProps = PaddingProps & BorderProps & { fill: string; backdropFilter: string; shadow: string; filter: string; }; declare type ButtonProps = BoxProps & StaticTextProps & { fillHover: string; focusOutline: { color: string; size: number; offset: number; }; }; /** * @framerIntrinsicWidth 300 * @framerIntrinsicHeight 35 * * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight fixed */ export declare const ChoiceSelect: ComponentType, "ref"> & RefAttributes, "ref"> & RefAttributes, "ref"> & RefAttributes>; export declare const choiceValueIdPropertyControls: { choiceValueId: { title: string; type: ControlType.String; }; }; export declare type ChoiceValueIdProps = { choiceValueId: string; }; /** * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ declare const ChoiceValueList: React_2.ComponentType, "ref"> & React_2.RefAttributes>; export { ChoiceValueList } export { ChoiceValueList as ChoiceValueListRenderer } /** * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ export declare const ChoiceValueName: ComponentType>; export declare type ChoiceValueNames = ReadonlyMap; declare type ChoiceValueSorting = { defaultRules: SortingRule[]; attributes: Array; }; declare type ChoiceValueSortingProps = { choiceValueSorting: ChoiceValueSorting & { jsonDefinition: string; }; }; export declare function cloneChildrenWithProps(children: ReactNode, additionalProps: PropsWithChildrenAndRef): ReactNode; /** * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ export declare const Colorize: ComponentType>; declare type CommonExplainProps = { header: ExplainHeaderProps; attributeName: TextProps; attributeValue: PaddingProps & { add: TextProps & BorderProps & { fill: string; iconFill: string; iconColor: string; }; remove: TextProps & BorderProps & { fill: string; iconFill: string; iconColor: string; }; componentDecisionStateIncludedLabel: string; componentDecisionStateExcludedLabel: string; booleanDecisionStateTrueLabel: string; booleanDecisionStateFalseLabel: string; }; applySolutionButton: ButtonProps & MarginProps; closeButton: ButtonProps; infoMessage: TextProps & { whyIsStateNotPossibleQuestion: string; whyConfigurationIsNotSatisfiedQuestion: string; whyAttributeIsNotSatisfiedQuestion: string; generalConflictQuestion: string; failedToExplainText: string; failedToExplainHintText: string; noExplanationFoundText: string; noSolutionFoundText: string; }; useCustomExplain: boolean; }; /** * @framerIntrinsicWidth 300 * @framerIntrinsicHeight 35 * * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight fixed */ export declare const ComponentSelect: ComponentType, "ref"> & RefAttributes, "ref"> & RefAttributes, "ref"> & RefAttributes>; declare type Condition = "none" | "explicit" | "implicit" | "blocked" | "available" | "immutable"; declare type Condition_2 = "none" | "explicit" | "implicit" | "blocked" | "available" | "interactive"; /** * These annotations control how your component sizes * Learn more: https://www.framer.com/developers/#code-components-auto-sizing * * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ export declare const Configuration: ComponentType<{ configurationModelNotFoundContent?: ReactNode; accessTokenInvalidContent?: ReactNode; accessTokenRestrictionContent?: ReactNode; errorContent?: ReactNode; } & ChoiceValueSortingProps & LocalizationProps & WizardAttributeRelationsProps & { hcaBaseUrl: string; sessionCreation: "client-side" | "server-side"; accessToken?: string; sessionCreateUrl?: string; sessionDeleteUrl?: string; deploymentName: string; channel: string; explainDialogProps: ExplainDialogProps; explainPopoverProps: ExplainPopoverProps; customExplainPopover?: ReactNode; explainConstraints: boolean; trimming: boolean; attributeRelations: { jsonDefinition: string; }; } & { children?: ReactNode; } & RefAttributes>; declare type ConfigurationOverrideableProps = Partial>; export declare type ConfigurationPropOverrides = ConfigurationOverrideableProps; declare type ConfigurationProps = InitializationErrorProps & ChoiceValueSortingProps & LocalizationProps & WizardAttributeRelationsProps & { hcaBaseUrl: string; sessionCreation: "client-side" | "server-side"; accessToken?: string; sessionCreateUrl?: string; sessionDeleteUrl?: string; deploymentName: string; channel: string; explainDialogProps: ExplainDialogProps; explainPopoverProps: ExplainPopoverProps; customExplainPopover?: ReactNode; explainConstraints: boolean; trimming: boolean; attributeRelations: { jsonDefinition: string; }; }; export declare const ConfigurationPropsProvider: ComponentType> & { children?: ReactNode; } & RefAttributes>; /** * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ export declare const CustomExplainApplySolution: ComponentType>; /** * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ export declare const CustomExplainAttributeList: React_2.ComponentType, "ref"> & React_2.RefAttributes>; /** * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ export declare const CustomExplainAttributeValueList: React_2.ComponentType, "ref"> & React_2.RefAttributes>; /** * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ export declare const CustomExplainPopover: ComponentType>; export { CustomExplainQuestion } declare type DisplayMode = "dialog" | "popover"; export declare function explainableComponent(Component: ForwardRefRenderFunction): ComponentType & RefAttributes> & RefAttributes> & RefAttributes> & RefAttributes>; declare type ExplainContext = { switchMode: (displayMode: DisplayMode) => void; explain: (question: ExplainQuestionParam, displayMode: DisplayMode, controlId?: string) => Promise; handleExplainAnswer: (explainAnswer: DecisionsExplainAnswer, displayMode: DisplayMode, controlId?: string) => Promise; applySolution: UseExplainResult_2["applySolution"]; dismiss: () => void; /** * Is Null if there is no ongoing explain process. */ process: ExplainProcess | null; }; declare type ExplainDialogProps = CommonExplainProps & { dialogBox: BoxProps; explanationCard: BoxProps & MarginProps; constraintExplanation: { configurationModelId: TextProps; ruleId: TextProps; }; decisionExplanationSolutionsTitle: StaticTextProps; constraintExplanationSolutionsTitle: StaticTextProps; scrollShadowBorder: string; }; declare type ExplainHeaderProps = { subject: TextProps & { configurationSubjectTitle: string; generalConflictTitle: string; }; suffix: TextProps & { isBlockedSuffix: string; isNotSatisfiedSuffix: string; }; }; declare type ExplainIntentionFilter = "any" | "add" | "remove"; declare type ExplainPopoverProps = CommonExplainProps & { popoverBox: BoxProps; listSeparator: string; arrow: string; subline: StaticTextProps; showConstraintsButton: ButtonProps & MarginProps; showMoreButton: ButtonProps & MarginProps; customPopover?: ReactNode; }; declare type ExplainProcess = { /** * Is Null if the explanation process is not the result of an ExplainQuestion. */ explainQuestion: CustomExplainQuestion | null; displayMode: DisplayMode; /** * Is Null if no controlId was provided. */ controlId: string | null; hasError: boolean; /** * Is Null in case of an error. */ decisionExplanations: ReadonlyArray | null; /** * Is Null in case of an error. */ constraintExplanations: ReadonlyArray | null; }; declare type ExplainProps = { explain: DisplayMode | "disabled"; }; declare type Filter = { selection: SelectionState_5; condition: Condition_2; }; declare type FilterMode = "some" | "every"; export declare function getItemTemplate(itemTemplate: ReactNode): ReactElement | null; export declare type HostParameters = Record; /** * Provides the custom parameters passed in from the host page to descendant components via * {@link useHostParameters} / {@link useHostParameter}. Works transparently for both native and * iframe embedding. Safe to nest (the outermost provider owns the store) and safe outside any host * (empty set). * * `Configuration` already wraps its subtree with this provider, so components inside the * configurator can read parameters without any setup. Place it as an outer wrapper on the canvas * when a parameter must be available above `Configuration` (e.g. to drive `deploymentName`); the * inner provider then yields to the outer one, so there is still only a single store. */ export declare const HostParametersProvider: ComponentType<{ children?: ReactNode; } & RefAttributes>; declare type InitializationErrorProps = Props_3; /** * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ export declare const InitializationRetry: ComponentType<{ children?: ReactNode; } & RefAttributes>; declare type InputStateColors = { fill: string; color: string; borderColor: string; }; declare type LocalizationProps = { localization: { jsonDefinition: string; }; }; declare type MarginProps = { margin: number; marginTop: number; marginRight: number; marginBottom: number; marginLeft: number; isMixedMargin: boolean; }; /** * @framerIntrinsicWidth 300 * @framerIntrinsicHeight 35 * * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight fixed */ export declare const NumericInput: ComponentType>, "ref"> & RefAttributes, "ref"> & RefAttributes, "ref"> & RefAttributes>; declare type PaddingProps = { padding: number; paddingTop: number; paddingRight: number; paddingBottom: number; paddingLeft: number; isMixedPadding: boolean; }; export declare function parseGlobalAttributeId(a: AttributeIdProps): GlobalAttributeId; /** * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ export declare const PopoverClose: ForwardRefExoticComponent & { appearance?: "auto" | "none"; } & RefAttributes>; export declare function PropagateHeight(props: PropsWithChildren): JSX_2.Element; declare type Props = { enabledChildren: ReactNode; disabledChildren: ReactNode; }; declare type Props_10 = { content?: ReactNode; failedToExplainContent?: ReactNode; noExplanationFoundContent?: ReactNode; noSolutionFoundContent?: ReactNode; }; declare type Props_2 = { color: string; style?: CSSProperties; }; declare type Props_3 = { configurationModelNotFoundContent?: ReactNode; accessTokenInvalidContent?: ReactNode; accessTokenRestrictionContent?: ReactNode; errorContent?: ReactNode; }; declare type Props_4 = { index: TemplateSlotIndex; }; declare type Props_5 = { target: "file" | "clipboard"; fileName: string; fileExtension: string; }; declare type Props_6 = { delay: number; }; declare type Props_7 = { children: ReactNode; }; declare type Props_8 = { itemTemplate: ReactNode; style?: CSSProperties; intentionFilter: ExplainIntentionFilter; }; declare type Props_9 = { itemTemplate: ReactNode; style?: CSSProperties; }; declare type PropsWithChildrenAndRef = HTMLAttributes & { ref?: Ref; }; export declare const ReplaceText: ComponentType>; declare type ReplaceTextProps = { children: ReactNode; mode: "replace" | "set-prop"; replaceString: string; elementName: string; propName: string; }; /** * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ export declare const ResetConfiguration: ComponentType>; /** * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ export declare const RestoreConfiguration: ComponentType, "ref"> & RefAttributes, "ref"> & RefAttributes, "ref"> & RefAttributes>; /** * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ export declare const SatisfactionIndicator: ComponentType, "ref"> & RefAttributes, "ref"> & RefAttributes, "ref"> & RefAttributes>; /** * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ export declare function ScrollIntoView(props: Props_6): JSX_2.Element; /** * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ export declare const SelectedNumericValue: ComponentType>; /** * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ export declare const SelectionIndicator: ComponentType, "ref"> & RefAttributes>; declare type SelectionState = "undefined" | "included" | "excluded" | "true" | "false"; declare type SelectionState_2 = "undefined" | "included" | "excluded" | "true" | "false" | "numeric"; declare type SelectionState_3 = "undefined" | "included" | "excluded" | "true" | "false" | "numeric"; declare type SelectionState_4 = "undefined" | "included" | "excluded" | "true" | "false" | "numeric"; declare type SelectionState_5 = "undefined" | "included" | "excluded"; /** * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ export declare const SelectionToggle: ComponentType, "ref"> & RefAttributes, "ref"> & RefAttributes, "ref"> & RefAttributes>; /** * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ export declare const SetSelection: ComponentType, "ref"> & RefAttributes, "ref"> & RefAttributes, "ref"> & RefAttributes>; /** * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ export declare const SetSelections: ComponentType, "ref"> & RefAttributes, "ref"> & RefAttributes, "ref"> & RefAttributes>; export declare const SetTemplateSlots: ComponentType<{ template?: ReactNode; } & { content1?: ReactNode; content2?: ReactNode; content3?: ReactNode; content4?: ReactNode; content5?: ReactNode; } & RefAttributes>; export declare function Singleton(props: PropsWithChildren<{ singletonId: string; }>): JSX_2.Element; /** * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ export declare function Slot(props: PropsWithChildren): ReactNode; declare type SortingRule = { regex: string; direction: "asc" | "desc"; mode: "isMatch" | "string" | "numeric"; description?: string; }; declare type StaticTextProps = TextProps & { staticText: string; }; /** * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ export declare function StoreConfiguration(props: PropsWithChildren): ReactNode; /** * @framerSupportedLayoutWidth any * @framerSupportedLayoutHeight any */ export declare const TemplateSlot: ComponentType>; declare type TemplateSlotIndex = 1 | 2 | 3 | 4 | 5; declare type TextProps = { color: string; text: { fontFamily?: string; fontSize?: number; fontStyle?: string; fontWeight?: string; textAlign?: "left" | "right" | "center"; letterSpacing?: string | number; lineHeight?: string | number; }; }; export declare function useAttributeName(attributeId: GlobalAttributeId): string | undefined; export declare function useChoiceValueName(attributeId: GlobalAttributeId, choiceValueId: ChoiceValueId): string | undefined; export declare function useChoiceValueNames(attributeId: GlobalAttributeId): ChoiceValueNames; export declare const useControlId: () => string; export declare function useDebounceValue(sourceValue: TValue, setSourceValue: (value: TValue) => void, inputValue: TValue, setInputValue: (value: TValue) => void, wait?: number): { flush: () => void; }; export declare function useExplain(): UseExplainResult; export declare function useExplainProcess(): UseExplainProcessResult | null; export declare type UseExplainProcessResult = ExplainProcess & { switchMode: ExplainContext["switchMode"]; applySolution: ExplainContext["applySolution"]; dismiss: ExplainContext["dismiss"]; }; export declare type UseExplainResult = { explain: ExplainContext["explain"]; handleExplainAnswer: ExplainContext["handleExplainAnswer"]; }; /** A single host parameter by key, or `undefined` if not set. */ export declare function useHostParameter(key: string): string | undefined; /** All host parameters as a string→string dictionary. Re-renders on change (shallow compare). */ export declare function useHostParameters(): HostParameters; export declare function useRenderPlaceholder(): boolean; export declare function useSortedChoiceValues(attributeId: GlobalAttributeId, choiceValues?: ReadonlyArray): ReadonlyArray; declare type Variant = { selection: SelectionState_4; condition: Condition; content: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10; useInDesignTime: boolean; }; export declare function withControlId(Component: ComponentType): ComponentType & RefAttributes>; export declare function withErrorBoundary(Component: ComponentType): ComponentType & RefAttributes>; export declare function withFullSize(Component: ComponentType): ComponentType & RefAttributes>; declare type WizardAttributeRelationsProps = { wizardAttributeRelations: { wizardSteps: WizardStep[]; }; }; declare type WizardStep = { name: string; attributes: AttributeIdProps[]; }; export { }