@reusable-ui/orientationable/dist/orientationable.d.ts

A capability of UI to rotate its layout.

import { CssRule, CssStyleCollection, CssSelectorCollection, CssClassName } from '@cssfn/core';
export declare const createOrientationClass: (orientationName: OrientationName | OrientationWithDirectionName | undefined) => CssClassName | null;
export type OrientationName = 'inline' | 'block';
export interface OrientationableStuff {
    defaultOrientation: OrientationName;
    orientationInlineSelector: CssSelectorCollection;
    orientationBlockSelector: CssSelectorCollection;
    ifOrientationInline: (styles: CssStyleCollection) => CssRule;
    ifOrientationBlock: (styles: CssStyleCollection) => CssRule;
}
export type OrientationableOptions = Omit<Partial<OrientationableStuff>, 'ifOrientationInline' | 'ifOrientationBlock'>;
export declare const defaultInlineOrientationableOptions: OrientationableOptions;
export declare const defaultBlockOrientationableOptions: OrientationableOptions;
export declare const usesOrientationable: (options?: OrientationableOptions, defaultOptions?: OrientationableOptions) => OrientationableStuff;
export interface OrientationableProps {
    orientation?: OrientationName;
}
export declare const useOrientationable: ({ orientation }: OrientationableProps, defaultOptions?: OrientationableOptions) => {
    class: CssClassName | null;
    readonly isOrientationBlock: boolean;
    readonly isOrientationVertical: boolean;
    readonly 'aria-orientation': "vertical" | "horizontal";
};
export type OrientationWithDirectionName = 'inline-start' | 'inline-end' | 'block-start' | 'block-end';
export interface OrientationableWithDirectionStuff {
    defaultOrientation: OrientationWithDirectionName;
    orientationInlineStartSelector: CssSelectorCollection;
    orientationInlineEndSelector: CssSelectorCollection;
    orientationBlockStartSelector: CssSelectorCollection;
    orientationBlockEndSelector: CssSelectorCollection;
    ifOrientationInlineStart: (styles: CssStyleCollection) => CssRule;
    ifOrientationInlineEnd: (styles: CssStyleCollection) => CssRule;
    ifOrientationBlockStart: (styles: CssStyleCollection) => CssRule;
    ifOrientationBlockEnd: (styles: CssStyleCollection) => CssRule;
}
export type OrientationableWithDirectionOptions = Omit<Partial<OrientationableWithDirectionStuff>, 'ifOrientationInlineStart' | 'ifOrientationInlineEnd' | 'ifOrientationBlockStart' | 'ifOrientationBlockEnd'>;
export declare const defaultInlineStartOrientationableWithDirectionOptions: OrientationableWithDirectionOptions;
export declare const defaultInlineEndOrientationableWithDirectionOptions: OrientationableWithDirectionOptions;
export declare const defaultBlockStartOrientationableWithDirectionOptions: OrientationableWithDirectionOptions;
export declare const defaultBlockEndOrientationableWithDirectionOptions: OrientationableWithDirectionOptions;
export declare const usesOrientationableWithDirection: (options?: OrientationableWithDirectionOptions, defaultOptions?: OrientationableWithDirectionOptions) => OrientationableWithDirectionStuff & Pick<OrientationableStuff, 'ifOrientationInline' | 'ifOrientationBlock'>;
export interface OrientationableWithDirectionProps {
    orientation?: OrientationWithDirectionName;
}
export declare const useOrientationableWithDirection: ({ orientation }: OrientationableWithDirectionProps, defaultOptions?: OrientationableWithDirectionOptions) => {
    class: CssClassName | null;
    readonly orientation: OrientationWithDirectionName;
};