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?: Record<string, string>;
top?: string | number;
topUnit?: string;
zIndex?: number;
}
Type declaration
OptionalallowLocking ?: booleanControls whether items can be locked when
clickToOpenis false. By default, items can be locked.Optionalclasses?: Iterable<string>An iterable list of additional classes to add to the main slide layer element
OptionalclickTo ?: booleanOpen When true items are only opened / closed by click / keyboard interaction.
Optionalduration?: numberDuration of transition effect.
OptionaleasingIn ?: EasingReferenceEither the name of a Svelte easing function or a Svelte compatible easing function.
OptionaleasingOut ?: EasingReferenceEither the name of a Svelte easing function or a Svelte compatible easing function.
Optionalitems?: 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
conditionboolean 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.Optionalside?: "left" | "right"The side in layers parent element to display.
Optionalstyles?: Record<string, string>Additional inline styles to apply to the side slide layer. Useful for setting CSS variables.
Optionaltop?: string | numberA valid CSS value for the
toppositioning attribute for the top of the side slide layer.When top is a number it will be treated as pixels unless
topUnitis defined.OptionaltopUnit ?: stringWhen
topis defined as a number andtopUnitis 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. Eitherpxor%make the most sense depending on the layout constraints.OptionalzIndex ?: numberThe z-index for the side slide layer inside the parent element.
Props type alias for associated component.