@nanahoshi/mona-ui 0.1.0

package/types/nanahoshi-mona-ui-internal-tree.d.ts

@@ -0,0 +1,391 @@
+import * as _angular_core from '@angular/core';
+import { TemplateRef } from '@angular/core';
+import { ImmutableSet, Selector, List, Predicate } from '@mirei/ts-collections';
+import { Observable, Subject, BehaviorSubject, ReplaySubject } from 'rxjs';
+import { PreventableEvent, FilterableOptions, FilterChangeEvent } from '@nanahoshi/mona-ui/common';
+
+interface CheckableOptions {
+    /**
+     * @description Determines whether checking a node should also check its children.
+     * Only applicable when `mode` is set to `multiple`.
+     */
+    checkChildren?: boolean;
+    /**
+     * @description Determines whether checking a node should also check its disabled children.
+     * Only applicable when `mode` is set to `multiple`.
+     */
+    checkDisabledChildren?: boolean;
+    /**
+     * @description Determines whether checking a node should also check its parents.
+     * Only applicable when `mode` is set to `multiple`.
+     */
+    checkParents?: boolean;
+    /**
+     * @description Determines whether only the children of the node should be checkable.
+     */
+    childrenOnly?: boolean;
+    /**
+     * @description Determines if the checkboxes are enabled.
+     */
+    enabled?: boolean;
+    /**
+     * @description Specifies the check mode.
+     */
+    mode?: "multiple" | "single";
+}
+
+type DataStructure = "flat" | "hierarchical";
+
+interface DisableOptions {
+    /**
+     * @description Determines whether the children of the node should be disabled as well.
+     */
+    disableChildren: boolean;
+    /**
+     * @description Determines if the disabling is enabled.
+     */
+    enabled: boolean;
+}
+
+interface DraggableOptions {
+    /**
+     * @description Determines if the dragging is enabled.
+     */
+    enabled: boolean;
+}
+
+interface NodeItem<T> {
+    data: T;
+    hasChildren: boolean;
+    uid: string;
+}
+
+declare class TreeNode<T> {
+    readonly checked: _angular_core.WritableSignal<boolean>;
+    readonly children: _angular_core.WritableSignal<ImmutableSet<TreeNode<T>>>;
+    readonly data: T;
+    readonly loading: _angular_core.WritableSignal<boolean>;
+    readonly uid: string;
+    index: string;
+    parent: TreeNode<T> | null;
+    constructor(data: T);
+    clone(): TreeNode<T>;
+    isDescendantOf(node: TreeNode<T>): boolean;
+    get nodeItem(): NodeItem<T>;
+}
+
+type DropPosition = "before" | "after" | "inside" | "outside";
+interface DropPositionChangeEvent<T> {
+    position: DropPosition;
+    targetNode: TreeNode<T> | null;
+}
+
+interface ExpandableOptions {
+    /**
+     * @description Determines if the expanding is enabled.
+     */
+    enabled: boolean;
+}
+
+declare class NodeCheckEvent<T> extends PreventableEvent {
+    #private;
+    constructor(node: TreeNode<T>, event: MouseEvent | KeyboardEvent);
+    get nodeItem(): NodeItem<T>;
+}
+
+declare class NodeClickEvent<T> extends PreventableEvent {
+    #private;
+    constructor(node: TreeNode<T>, event: MouseEvent);
+    get nodeItem(): NodeItem<T>;
+}
+
+declare abstract class NodeEvent<T> extends PreventableEvent<MouseEvent | TouchEvent> {
+    #private;
+    protected constructor(type: string, node: TreeNode<T>, event: MouseEvent | TouchEvent);
+    get nodeItem(): NodeItem<T>;
+}
+
+declare class NodeDragEndEvent<T> extends NodeEvent<T> {
+    constructor(node: TreeNode<T>, event: MouseEvent | TouchEvent);
+}
+
+declare class NodeDragEvent<T> {
+    #private;
+    constructor(node: TreeNode<T>, targetNode: TreeNode<T> | null, event: MouseEvent | TouchEvent);
+    get nodeItem(): NodeItem<T>;
+    get originalEvent(): MouseEvent | TouchEvent;
+    get targetNodeItem(): NodeItem<T> | null;
+    get type(): string;
+}
+declare class InternalNodeDragEvent<T> {
+    #private;
+    constructor(dragEvent: NodeDragEvent<T>, dropAllowed: boolean);
+    get dragEvent(): NodeDragEvent<T>;
+    get dropAllowed(): boolean;
+}
+
+declare class NodeDragStartEvent<T> extends NodeEvent<T> {
+    constructor(node: TreeNode<T>, event: MouseEvent | TouchEvent);
+}
+
+interface NodeMoveSnapshot {
+    readonly originalIndex: number;
+    readonly originalParentUid: string | null;
+    readonly sourceNodeUid: string;
+}
+
+interface ITreeView<T> {
+    moveNode(source: NodeItem<T>, target: NodeItem<T>, position: DropPosition): NodeMoveSnapshot | null;
+    undoMoveNode(snapshot: NodeMoveSnapshot): void;
+}
+
+declare class NodeDropEvent<T> extends NodeEvent<T> {
+    #private;
+    constructor(params: NodeDropEventArgs<T>);
+    get position(): DropPosition;
+    get sourceNode(): NodeItem<T>;
+    get targetNode(): NodeItem<T>;
+    get treeView(): ITreeView<T>;
+}
+declare class NodeDropEventSansTree<T> extends NodeEvent<T> {
+    #private;
+    constructor(params: NodeDropEventArgsSansTree<T>);
+    get event(): MouseEvent | TouchEvent;
+    get position(): DropPosition;
+    get sourceNode(): TreeNode<T>;
+    get targetNode(): TreeNode<T>;
+}
+interface NodeDropEventArgs<T> {
+    event: MouseEvent | TouchEvent;
+    position: DropPosition;
+    sourceNode: TreeNode<T>;
+    targetNode: TreeNode<T>;
+    treeView: ITreeView<T>;
+}
+type NodeDropEventArgsSansTree<T> = Omit<NodeDropEventArgs<T>, "treeView">;
+
+declare class NodeSelectEvent<T> extends PreventableEvent {
+    #private;
+    constructor(node: TreeNode<T>, event: MouseEvent | KeyboardEvent);
+    get nodeItem(): NodeItem<T>;
+}
+
+interface TreeNodeCheckEvent<T> {
+    checked: boolean;
+    node: TreeNode<T>;
+}
+
+interface TreeNodeExpandEvent<T> {
+    expanded: boolean;
+    node: TreeNode<T>;
+}
+
+interface TreeNodeSelectEvent<T> {
+    node: TreeNode<T>;
+    selected: boolean;
+}
+
+type SelectableOptions = {
+    /**
+     * @description Determines if the selection functionality is active.
+     */
+    enabled: boolean;
+    /**
+     * @description Determines whether only the children of the node should be selectable.
+     */
+    childrenOnly: boolean;
+} & (SingleSelectionConfig | MultipleSelectionConfig);
+interface SingleSelectionConfig {
+    /**
+     * @description Allows only one item to be selected at a time.
+     */
+    mode: "single";
+    /**
+     * @description Determines if clicking an already selected item will deselect it.
+     */
+    toggleable?: boolean;
+}
+interface MultipleSelectionConfig {
+    /**
+     * @description Allows multiple items to be selected simultaneously.
+     */
+    mode: "multiple";
+}
+
+type ChildrenSelector<T> = string | Selector<T, Iterable<T> | Observable<Iterable<T>>>;
+type NodeKeySelector<T, K = any> = string | Selector<T, K> | null;
+
+declare class TreeService<T> {
+    #private;
+    readonly animationTemporarilyDisabled: _angular_core.WritableSignal<boolean>;
+    readonly animationEnabled: _angular_core.WritableSignal<boolean>;
+    readonly blur$: Subject<FocusEvent>;
+    readonly checkBy: _angular_core.WritableSignal<NodeKeySelector<T>>;
+    readonly checkableOptions: _angular_core.WritableSignal<CheckableOptions>;
+    readonly checkedKeys$: Observable<ImmutableSet<any>>;
+    readonly children: _angular_core.WritableSignal<ChildrenSelector<T>>;
+    readonly disableBy: _angular_core.WritableSignal<NodeKeySelector<T>>;
+    readonly disableOptions: _angular_core.WritableSignal<DisableOptions>;
+    readonly disabledKeys: _angular_core.WritableSignal<ImmutableSet<any>>;
+    readonly draggableOptions: _angular_core.WritableSignal<DraggableOptions>;
+    readonly dragging: _angular_core.WritableSignal<boolean>;
+    readonly dragging$: Observable<boolean>;
+    readonly dropAllowed: _angular_core.WritableSignal<boolean>;
+    readonly dropPositionChange$: BehaviorSubject<DropPositionChangeEvent<T> | null>;
+    readonly dropPositionSignal: _angular_core.Signal<DropPositionChangeEvent<T> | null>;
+    readonly expandBy: _angular_core.WritableSignal<NodeKeySelector<T>>;
+    readonly expandableOptions: _angular_core.WritableSignal<ExpandableOptions>;
+    readonly expandedKeys: _angular_core.Signal<ImmutableSet<any>>;
+    readonly expandedKeys$: Observable<ImmutableSet<any>>;
+    readonly filterableOptions: _angular_core.WritableSignal<FilterableOptions>;
+    readonly filter$: ReplaySubject<string>;
+    readonly filterChange$: Subject<FilterChangeEvent>;
+    readonly filterPlaceholder: _angular_core.WritableSignal<string>;
+    readonly filterText: _angular_core.Signal<string>;
+    readonly focus$: Subject<FocusEvent>;
+    readonly navigatedNode: _angular_core.WritableSignal<TreeNode<T> | null>;
+    readonly nodeCheck$: Subject<NodeCheckEvent<T>>;
+    readonly nodeCheckChange$: Subject<TreeNodeCheckEvent<T>>;
+    readonly nodeClick$: Subject<NodeClickEvent<T>>;
+    readonly nodeDrag$: Subject<InternalNodeDragEvent<T>>;
+    readonly nodeDragEnd$: Subject<NodeDragEndEvent<T>>;
+    readonly nodeDragStart$: Subject<NodeDragStartEvent<T>>;
+    readonly nodeDrop$: Subject<NodeDropEventSansTree<T>>;
+    readonly nodeExpand$: Subject<TreeNodeExpandEvent<T>>;
+    readonly nodeSelect$: Subject<NodeSelectEvent<T>>;
+    readonly nodeSelectChange$: Subject<TreeNodeSelectEvent<T>>;
+    readonly nodeSet: _angular_core.WritableSignal<ImmutableSet<TreeNode<T>>>;
+    readonly nodeTemplate: _angular_core.WritableSignal<TemplateRef<any> | null>;
+    readonly selectBy: _angular_core.WritableSignal<NodeKeySelector<T>>;
+    readonly selectableOptions: _angular_core.WritableSignal<SelectableOptions>;
+    readonly selectedKeys: _angular_core.WritableSignal<ImmutableSet<any>>;
+    readonly selectedKeys$: Observable<ImmutableSet<any>>;
+    readonly selectedNodes: _angular_core.Signal<ImmutableSet<TreeNode<T>>>;
+    readonly selectionChange$: Subject<NodeItem<T>>;
+    readonly textField: _angular_core.WritableSignal<string | Selector<T, string>>;
+    readonly viewNodeSet: _angular_core.Signal<ImmutableSet<TreeNode<T>>>;
+    constructor();
+    static flatten<T>(nodes: Iterable<TreeNode<T>>): List<TreeNode<T>>;
+    clearFilter(): void;
+    detachNode(node: TreeNode<T>): void;
+    getNodeByUid(uid: string): TreeNode<T> | null;
+    getNodeElementId(uid: string): string;
+    getNodeText(node: TreeNode<T>): string;
+    hasChildren(node: TreeNode<T> | null): boolean;
+    insertNodeAtIndex(node: TreeNode<T>, parentUid: string | null, index: number): void;
+    isCheckable(node: TreeNode<T>): boolean;
+    isChecked(node: TreeNode<T>): boolean;
+    isDisabled(node: TreeNode<T>): boolean;
+    isExpanded(node: TreeNode<T>): boolean;
+    isIndeterminate(node: TreeNode<T>): boolean;
+    isNavigated(node: TreeNode<T>): boolean;
+    isSelected(node: TreeNode<T>): boolean;
+    isTreeFiltered(): boolean;
+    isVisible(node: TreeNode<T>): boolean;
+    loadNodeChildren(node: TreeNode<T>): void;
+    moveNode(sourceNode: TreeNode<T>, targetNode: TreeNode<T>, position: DropPosition): void;
+    navigate(direction: "next" | "previous" | "first" | "last"): TreeNode<T> | null;
+    notifySelectionChange(node: TreeNode<T>): void;
+    setAnimationEnabled(enabled: boolean): void;
+    setChildrenSelector(selector: string | Selector<T, Iterable<T> | Observable<Iterable<T>>>): void;
+    setCheckBy(selector: NodeKeySelector<T>): void;
+    setCheckableOptions(options: Partial<CheckableOptions>): void;
+    setCheckedKeys(keys: Iterable<any>): void;
+    setData(data: Iterable<T>): void;
+    setDataStructure(structure: DataStructure): void;
+    setDisableBy(selector: NodeKeySelector<T>): void;
+    setDisableOptions(options: Partial<DisableOptions>): void;
+    setDisabledKeys(keys: Iterable<any>): void;
+    setDraggableOptions(options: Partial<DraggableOptions>): void;
+    setExpandBy(selector: NodeKeySelector<T>): void;
+    setExpandableOptions(options: Partial<ExpandableOptions>): void;
+    setExpandedKeys(keys: Iterable<any>): void;
+    setFilterableOptions(options: Partial<FilterableOptions>): void;
+    setFlatIdField(field: string): void;
+    setFlatParentIdField(field: string): void;
+    setHasCheckboxPredicate(fn: ((data: T, uid: string) => boolean) | null): void;
+    setHasChildrenPredicate(predicate: Predicate<any> | null): void;
+    setNodeCheck(node: TreeNode<T>, checked: boolean): void;
+    setNodeExpand(node: TreeNode<T>, expanded: boolean): void;
+    setNodeSelect(node: TreeNode<T>, selected: boolean): void;
+    setSelectBy(selector: NodeKeySelector<T>): void;
+    setSelectableOptions(options: Partial<SelectableOptions>): void;
+    setSelectedDataItems(dataItems: Iterable<T>): void;
+    setSelectedKeys(keys: Iterable<any>): void;
+    setTextField(selector: string | Selector<T, string>): void;
+    getCheckKey(node: TreeNode<T>): any;
+    getDisableKey(node: TreeNode<T>): any;
+    private applyCheckedKeysToNodes;
+    private computeVisibleUids;
+    private createFlatNodes;
+    private createHierarchicalNodes;
+    private createNodeDictionary;
+    private createNodes;
+    private getExpandKey;
+    private getChildNodes;
+    private getDataItemSelectKey;
+    private getParentNodes;
+    private getSelectKey;
+    private isAnyParentCollapsed;
+    private isAnyParentDisabled;
+    private isFiltered;
+    private loadCheckedKeysForChildren;
+    private moveNodeAfter;
+    private moveNodeBefore;
+    private moveNodeInside;
+    private navigateToNextNode;
+    private navigateToPreviousNode;
+    private recalculateCheckedAncestors;
+    private restoreExpandedChildren;
+    private updateNodeIndices;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TreeService<any>, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<TreeService<any>>;
+}
+
+declare class TreeComponent<T> {
+    #private;
+    protected readonly activeDescendantId: _angular_core.Signal<string | null>;
+    protected readonly baseClass: _angular_core.Signal<string>;
+    readonly ariaLabel: _angular_core.InputSignal<string>;
+    readonly treeService: TreeService<T>;
+    readonly nodeTemplate: _angular_core.Signal<TemplateRef<any> | undefined>;
+    readonly data: _angular_core.InputSignal<Iterable<T> | undefined>;
+    constructor();
+    private handleMouseMoveWhileDragging;
+    private isMouseOutsideTree;
+    private notifyDropPositionChange;
+    private setFocusSubscription;
+    private setKeydownSubscription;
+    private setNodeDragHandlerSubscription;
+    private setSubscriptions;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TreeComponent<any>, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TreeComponent<any>, "mona-tree", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; }, {}, ["nodeTemplate"], never, true, never>;
+}
+
+declare class TreeNodeTemplateDirective {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TreeNodeTemplateDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TreeNodeTemplateDirective, "ng-template[monaTreeNodeTemplate]", never, {}, {}, never, never, true, never>;
+}
+
+/**
+ * Moves a node within a generic flat tree structure that uses parentId references.
+ * @param treeData - The flat array of tree nodes.
+ * @param event - The drag-and-drop event payload.
+ * @param idKey - The property key used to uniquely identify each node (e.g., 'id').
+ * @param parentIdKey - The property key holding the parent node's id, or null for roots (e.g., 'parentId').
+ * @returns A new array representing the updated flat tree, with the moved node's parentIdKey updated.
+ */
+declare function moveFlatTreeNode<T extends Record<string, any>>(treeData: Iterable<T>, event: NodeDropEvent<T>, idKey: keyof T, parentIdKey: keyof T): T[];
+
+/**
+ * Moves a node within a generic hierarchical tree structure.
+ * @param treeData - The array of tree nodes.
+ * @param event - The drag-and-drop event payload.
+ * @param idKey - The property key used to identify nodes (e.g., 'id').
+ * @param childrenKey - The property key containing the nested items (e.g., 'items').
+ * @returns A new array representing the updated tree structure.
+ */
+declare function moveTreeNode<T extends Record<string, any>>(treeData: Iterable<T>, event: NodeDropEvent<T>, idKey: keyof T, childrenKey: keyof T): T[];
+
+export { InternalNodeDragEvent, NodeCheckEvent, NodeClickEvent, NodeDragEndEvent, NodeDragEvent, NodeDragStartEvent, NodeDropEvent, NodeDropEventSansTree, NodeEvent, NodeSelectEvent, TreeComponent, TreeNode, TreeNodeTemplateDirective, TreeService, moveFlatTreeNode, moveTreeNode };
+export type { CheckableOptions, ChildrenSelector, DataStructure, DisableOptions, DraggableOptions, DropPosition, DropPositionChangeEvent, ExpandableOptions, ITreeView, NodeDropEventArgs, NodeDropEventArgsSansTree, NodeItem, NodeKeySelector, NodeMoveSnapshot, SelectableOptions, TreeNodeCheckEvent, TreeNodeExpandEvent, TreeNodeSelectEvent };

package/types/nanahoshi-mona-ui-internal.d.ts

@@ -0,0 +1,136 @@
+import * as i0 from '@angular/core';
+import { ElementRef, DestroyRef, Signal } from '@angular/core';
+import { Observable } from 'rxjs';
+import { OverlayRef } from '@angular/cdk/overlay';
+
+type AttributeConfig = Record<string, unknown>;
+
+declare class AttributeBinderDirective {
+    #private;
+    readonly attributes: i0.InputSignal<AttributeConfig>;
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<AttributeBinderDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<AttributeBinderDirective, "[monaAttributeBinder]", never, { "attributes": { "alias": "monaAttributeBinder"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface ColorScheme {
+    colors: string[];
+    columns: number;
+    name: string;
+}
+
+interface RGB {
+    r: number | null;
+    g: number | null;
+    b: number | null;
+}
+interface RGBA extends RGB {
+    a: number | null;
+}
+interface HSV {
+    h: number | null;
+    s: number | null;
+    v: number | null;
+}
+interface HSVA extends HSV {
+    a: number | null;
+}
+type RGBChannel = keyof RGB;
+type RGBAChannel = keyof RGBA;
+type HSVChannel = keyof HSV;
+type Channel = RGBAChannel | HSVChannel;
+interface HSL {
+    h: number | null;
+    s: number | null;
+    l: number | null;
+}
+interface HSLA extends HSL {
+    a: number | null;
+}
+
+declare const isValidHex: (hex: string) => boolean;
+declare const isValidHsla: (hslaText: string) => boolean;
+declare const isValidRgb: (rgbText: string) => boolean;
+
+declare const hex2rgba: (hex: string) => RGBA;
+
+declare const hsla2hsva: (hue: number | null, saturation: number | null, lightness: number | null, alpha: number | null) => HSVA;
+
+declare const hsva2rgba: (hue: number | null, saturation: number | null, value: number | null, alpha: number | null) => RGBA;
+
+declare const rgba2hex: (r: number | null, g: number | null, b: number | null, a: number | null) => string;
+
+declare const rgba2hsla: (red: number | null, green: number | null, blue: number | null, alpha: number | null) => HSLA;
+
+declare const rgba2hsva: (r: number | null, g: number | null, b: number | null, a: number | null) => HSVA;
+
+declare const string2Hsla: (hslText: string) => HSLA;
+
+declare const string2rgba: (rgbText: string) => RGBA;
+
+type Action<P = void, R = void> = (arg: P) => R;
+
+/**
+ * Generates a unique control ID for an element.
+ * The ID consists of a prefix, a random hexadecimal string, and a suffix.
+ * @param {number} [level=0] - The nesting level of the element. This increases the length of the generated ID.
+ * @param {number} [length=7] - The base length of the random part of the ID.
+ * @returns {string} A unique control ID string for use for elements.
+ */
+declare const createElementControlId: (level?: number, length?: number) => string;
+
+declare function focusElement(host: HTMLElement, element: HTMLElement | ElementRef<HTMLElement> | string): void;
+
+declare const rxFromResize: (target: Element | Iterable<Element>, options?: ResizeObserverOptions) => Observable<ResizeObserverEntry[]>;
+
+declare const rxTimeout: (destroyRef: DestroyRef, fn: Action, delay?: number) => void;
+
+type VariantInputs<T> = {
+    [K in keyof T]-?: Signal<T[K]>;
+};
+
+declare const restoreOverlayScroll: (overlayRef: OverlayRef, element: HTMLElement) => void;
+
+interface WindowStyleSettings {
+    maxHeight?: number;
+    maxWidth?: number;
+    minHeight?: number;
+    minWidth?: number;
+    top?: number;
+    left?: number;
+    windowClass?: string | string[];
+}
+declare const setWindowStyles: (element: HTMLElement, settings: WindowStyleSettings) => void;
+
+/**
+ * Converts a number or a string into a CSS-compliant value.
+ * - If the input is a number (e.g., 100), it appends 'px'.
+ * - If the input is a numeric string (e.g., "100"), it appends 'px'.
+ * - If the input is a string with a unit (e.g., "100px", "10rem"), it returns it as is.
+ *
+ * @param value The number or string to convert.
+ * @returns A CSS-compliant string value.
+ */
+declare const toCssValue: (value: number | string | undefined | null) => string;
+
+declare enum NavigationKeys {
+    ArrowUp = "ArrowUp",
+    ArrowDown = "ArrowDown",
+    ArrowLeft = "ArrowLeft",
+    ArrowRight = "ArrowRight",
+    Enter = "Enter",
+    Escape = "Escape",
+    Home = "Home",
+    End = "End",
+    PageDown = "PageDown",
+    PageUp = "PageUp",
+    Space = " "
+}
+declare const NavigationKeysList: string[];
+declare const isNavigationKey: (key: string) => boolean;
+
+declare const isTypeaheadKey: (key: string) => boolean;
+declare const setupTypeahead: (typeaheadKey$: Observable<string>) => Observable<string>;
+
+export { AttributeBinderDirective, NavigationKeys, NavigationKeysList, createElementControlId, focusElement, hex2rgba, hsla2hsva, hsva2rgba, isNavigationKey, isTypeaheadKey, isValidHex, isValidHsla, isValidRgb, restoreOverlayScroll, rgba2hex, rgba2hsla, rgba2hsva, rxFromResize, rxTimeout, setWindowStyles, setupTypeahead, string2Hsla, string2rgba, toCssValue };
+export type { Action, AttributeConfig, Channel, ColorScheme, HSL, HSLA, HSV, HSVA, HSVChannel, RGB, RGBA, RGBAChannel, RGBChannel, VariantInputs, WindowStyleSettings };