Type Alias Props
allowLocking?: boolean;
classes?: Iterable<string>;
clickToOpen?: boolean;
duration?: number;
easingIn?: EasingReference;
easingOut?: EasingReference;
items?: Iterable<
{
condition?: boolean
| () => boolean;
icon: string | TJSSvelteConfig;
svelte: TJSSvelteConfig;
title?: string;
},
>;
side?: "left"
| "right";
styles?: { [key: string]: string };
top?: string | number;
topUnit?: string;
zIndex?: number;
}
Type declaration
Optional
allowLocking?: booleanControls whether items can be locked when
clickToOpen
is false. By default, items can be locked.Optional
classes?: Iterable<string>An iterable list of additional classes to add to the main slide layer element
Optional
clickToOpen?: booleanWhen true items are only opened / closed by click / keyboard interaction.
Optional
duration?: numberDuration of transition effect.
Optional
easingIn?: EasingReferenceEither the name of a Svelte easing function or a Svelte compatible easing function.
Optional
easingOut?: EasingReferenceEither the name of a Svelte easing function or a Svelte compatible easing function.
Optional
items?: Iterable<
{
condition?: boolean
| () => boolean;
icon: string | TJSSvelteConfig;
svelte: TJSSvelteConfig;
title?: string;
},
>An iterable list of side slide items including icon (Font awesome string), a Svelte configuration object, and title.
You may provide a
condition
boolean or function that returns a boolean to hide the item. This is useful for adding items / panels only visible for the GM amongst other conditional tests.Optional
side?: "left" | "right"The side in layers parent element to display.
Optional
styles?: { [key: string]: string }Additional inline styles to apply to the side slide layer. Useful for setting CSS variables.
Optional
top?: string | numberA valid CSS value for the
top
positioning attribute for the top of the side slide layer.When top is a number it will be treated as pixels unless
topUnit
is defined.Optional
topUnit?: stringWhen
top
is defined as a number andtopUnit
is defined then it is used to create the top style. This facilitates creating a UI for editing side slide layer via a range input and separately storing the unit type.Examples are:
px
,%
,em
,rem
. Eitherpx
or%
make the most sense depending on the layout constraints.Optional
zIndex?: numberThe z-index for the side slide layer inside the parent element.
Props type alias for associated component.