Interface SubAspectComponentOptions

Configuration options for the SubAspectComponent.

SubAspectComponentOptions

Content:

interface SubAspectComponentOptions {
    backgroundColor: string;
    children: ReactNode;
    showControls?: boolean;
    containerWidthFraction?: number;
    containerHeightFraction?: number;
    defaultFractionSub?: number;
    style?: object;
    renderContent?: ((options: {
        defaultContent: ReactNode;
        dimensions: {
            width: number;
            height: number;
        };
    }) => ReactNode);
    renderContainer?: ((options: {
        defaultContainer: ReactNode;
        dimensions: {
            width: number;
            height: number;
        };
    }) => ReactNode);
}

Properties

backgroundColor children showControls? containerWidthFraction? containerHeightFraction? defaultFractionSub? style? renderContent? renderContainer?

Properties

backgroundColor

backgroundColor: string

Background color for the sub-aspect container

children

children: ReactNode

Child components to render inside the sub-aspect container

Dimensions (Responsive):

OptionalshowControls

showControls?: boolean

Whether controls are visible (affects height calculation with defaultFractionSub)

Styling:

OptionalcontainerWidthFraction

containerWidthFraction?: number

Fraction of window width to use (0.0 to 1.0)

OptionalcontainerHeightFraction

containerHeightFraction?: number

Fraction of window height to use (0.0 to 1.0)

OptionaldefaultFractionSub

defaultFractionSub?: number

Additional height adjustment fraction when controls are visible

Display Control:

Optionalstyle

style?: object

Additional custom styles to apply to the container

Advanced Render Overrides:

OptionalrenderContent

renderContent?: ((options: {
    defaultContent: ReactNode;
    dimensions: {
        width: number;
        height: number;
    };
}) => ReactNode)

Optional custom renderer for content (receives defaultContent and dimensions)

OptionalrenderContainer

renderContainer?: ((options: {
    defaultContainer: ReactNode;
    dimensions: {
        width: number;
        height: number;
    };
}) => ReactNode)

Optional custom renderer for outer container (receives defaultContainer and dimensions)

Settings

Member Visibility

On This Page

Properties