builder-settings-types 0.0.461 → 0.0.463

package/dist/components/actions/action.d.ts

@@ -0,0 +1,8 @@
+import { IDrawable } from '../../base/drawable';
+export type ActionType = "remove" | "show-hide" | "expand-collapse";
+export declare abstract class Action<T = any> implements IDrawable {
+    abstract readonly type: ActionType;
+    onChange?: (value: T) => void;
+    abstract draw(): HTMLElement;
+    setOnChange(onChange: (value: T) => void): void;
+}

package/dist/components/actions/actionFactory.d.ts

@@ -0,0 +1,6 @@
+import { Action, ActionType } from './action';
+export type ActionInitContext = {
+    onShowHide?: (hidden: boolean) => void;
+    onExpandCollapse?: (collapsed: boolean) => void;
+};
+export declare function createActions(types: ActionType[], context: ActionInitContext): Map<ActionType, Action>;

package/dist/components/actions/actionWrapper.d.ts

@@ -0,0 +1,6 @@
+import { Action } from './action';
+export declare class ActionWrapper {
+    private actions;
+    constructor(actions: Action[]);
+    wrapSetting(settingElement: HTMLElement): HTMLElement;
+}

package/dist/components/actions/actionsCollection.d.ts

@@ -0,0 +1,25 @@
+import { Action, ActionType } from './action';
+export type SettingAction = "show-hide";
+export type SettingGroupAction = Exclude<ActionType, "remove">;
+export declare class RemoveAction extends Action<void> {
+    readonly type: "remove";
+    draw(): HTMLElement;
+}
+export declare class ShowHideAction extends Action<boolean> {
+    readonly type: "show-hide";
+    private button;
+    hide: boolean;
+    /** Syncs visual state from the parent. Does not fire onChange to avoid circular calls. */
+    setHide(hide: boolean): void;
+    private updateIcon;
+    draw(): HTMLElement;
+}
+export declare class ExpandCollapseAction extends Action<boolean> {
+    readonly type: "expand-collapse";
+    private button;
+    isCollapsed: boolean;
+    /** Syncs visual state from the parent. Does not fire onChange to avoid circular calls. */
+    setIsCollapsed(collapsed: boolean): void;
+    private updateIcon;
+    draw(): HTMLElement;
+}

package/dist/components/button/button.d.ts

@@ -0,0 +1,13 @@
+export interface ButtonProps {
+    icon?: string;
+    label?: string;
+    onClick?: () => void;
+}
+export declare class Button {
+    private buttonElement;
+    constructor(props: ButtonProps);
+    getElement(): HTMLButtonElement;
+    setIcon(icon: string): void;
+    setLabel(label: string): void;
+    setOnClick(onClick: () => void): void;
+}

package/dist/components/draggable/draggable.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Makes an element draggable (mouse + touch/pointer), clamped to viewport so it
+ * can't be dragged out of view.
+ *
+ * Notes:
+ * - The element should be positioned (`position: fixed` or `absolute`).
+ * - Uses Pointer Events so it works for mouse, touch, pen.
+ * - Clamps using the element's bounding box and the visual viewport when available.
+ */
+export declare function makeDraggableWithinViewport(element: HTMLElement, opts?: {
+    /** Leave this many pixels visible at minimum (prevents fully hiding the element). */
+    margin?: number;
+    /**
+     * If true, use `position: fixed` coordinates. If false, uses element's offsetParent.
+     * Default: auto (fixed if computed position is fixed; otherwise absolute).
+     */
+    coordinateSpace?: "auto" | "fixed" | "offsetParent";
+    /** Optional handle; if omitted, the element itself is the handle. */
+    handle?: HTMLElement;
+}): () => void;

package/dist/components/popup/popup.d.ts

@@ -0,0 +1,51 @@
+/**
+ * Minimal reusable popup that:
+ * - renders into document.body (overlay optional)
+ * - accepts arbitrary content (string | Node | (() => Node))
+ * - optionally draggable by its header using makeDraggableWithinViewport()
+ */
+export type PopupContent = string | Node | (() => Node);
+export interface PopupOptions {
+    title?: string;
+    content: PopupContent;
+    /** Show a dim overlay behind the popup. Default: 'transparent' */
+    overlay?: 'transparent' | 'solid';
+    /** Close on overlay click. Default: true */
+    closeOnOverlayClick?: boolean;
+    /** Close on Escape. Default: true */
+    closeOnEscape?: boolean;
+    /** Enable dragging by header. Default: true */
+    draggable?: boolean;
+    /** Margin from viewport edges when clamping/dragging (min distance in px). Default: 16 */
+    margin?: number;
+    /** Initial position in viewport pixels, or a function called when opening (popup is in DOM). Default: centered with margin */
+    initialPosition?: {
+        x: number;
+        y: number;
+    } | ((popupEl: HTMLElement) => {
+        x: number;
+        y: number;
+    });
+    /** Width in px (or CSS width string). Default: 420 */
+    width?: number | string;
+    /** Additional class on the popup root. */
+    className?: string;
+    /** Called when popup closes */
+    onClose?: () => void;
+}
+export declare class Popup {
+    private options;
+    private overlayEl?;
+    private rootEl;
+    private headerEl;
+    private bodyEl;
+    private cleanupDrag?;
+    private onKeyDownBound;
+    constructor(options: PopupOptions);
+    open(): this;
+    close(): void;
+    setContent(content: PopupContent): void;
+    setTitle(title: string): void;
+    get element(): HTMLDivElement;
+    private clampIntoView;
+}

package/dist/components/select/select.d.ts

@@ -0,0 +1,53 @@
+export interface SelectOption {
+    name: string;
+    value: string | object;
+}
+export interface SelectProps {
+    options?: SelectOption[];
+    getOptions?: () => SelectOption[];
+    getOptionsAsync?: () => Promise<SelectOption[]>;
+    placeholder?: string;
+    loadingText?: string;
+    preserveButtonContent?: boolean;
+    value?: string | object;
+    dataTestId?: string;
+    leftColumn?: HTMLElement;
+    button?: HTMLButtonElement;
+    onChange?: (value: string | object, option: SelectOption) => void;
+}
+export declare class Select {
+    private props;
+    private container;
+    private buttonEl;
+    private optionsListEl;
+    private svgContainer;
+    private options;
+    private isOpen;
+    private isLoading;
+    private selectedIndex;
+    private clickOutsideListener;
+    private resizeListener;
+    private scrollListener;
+    private mutationObserver;
+    constructor(props?: SelectProps);
+    draw(): HTMLElement;
+    open(): void;
+    close(): void;
+    setOptions(options: SelectOption[], preserveSelection?: boolean): void;
+    setValue(value: string | object): void;
+    setSelectedIndex(index: number | null, { emitChange }?: {
+        emitChange?: boolean;
+    }): void;
+    getSelectedOption(): SelectOption | null;
+    destroy(): void;
+    private createOptionElement;
+    private handleOptionSelect;
+    private showDropdown;
+    private hideDropdown;
+    private updateDropdownPosition;
+    private refreshOptionsList;
+    private updateButtonText;
+    private fetchAsyncOptions;
+    private attachGlobalListeners;
+    private setupMutationObserver;
+}

package/dist/groups/borderSettingsSet.d.ts

@@ -2,6 +2,7 @@ import { SettingGroup } from '../base/settings-group/settingsGroup';
 import { CornerSettings, SideSettings } from '../settings/multi-settings';
 import { CORNER, DEFAULT_KEY } from '../settings/multi-settings/utils/enum';
 import { GradientSetting } from '../settings/gradient-settings/GradientSetting';
+import { SettingGroupAction } from '../components/actions/actionsCollection';
 export declare class BorderSettingSet extends SettingGroup<{
     color: GradientSetting;
     radius: CornerSettings;
@@ -12,6 +13,7 @@ export declare class BorderSettingSet extends SettingGroup<{
         radius?: number | Partial<Record<CORNER, number>>;
         size?: number | Partial<Record<DEFAULT_KEY, number>>;
         collapsed?: boolean;
+        actions?: SettingGroupAction[];
     });
     getValues(): {
         color: unknown;

package/dist/groups/effectSettingsSet.d.ts

@@ -0,0 +1,29 @@
+import { InputTypes } from '../base/settings';
+import { SettingGroup, SettingGroupProps } from '../base/settings-group/settingsGroup';
+import { ExtractSettingValues } from '../types';
+export declare class EffectSettings extends SettingGroup<{}> {
+    inputType: InputTypes;
+    private selectComponent;
+    private triggerButton;
+    private popup;
+    private icons;
+    private options;
+    constructor(props: SettingGroupProps<{}>);
+    private onChangeSetting;
+    private createTriggerButton;
+    private getPopupPosition;
+    private getSettingContentWithoutTitle;
+    private createPopup;
+    private changeContent;
+    private getSettingValue;
+    resetActionStates({ includeInTree, hide, collapsed }?: {
+        includeInTree?: boolean;
+        hide?: boolean;
+        collapsed?: boolean;
+    }): void;
+    drawWithActions(baseEl: HTMLElement): HTMLElement;
+    draw(): HTMLElement;
+    getValues(): ExtractSettingValues<{}>;
+    setIncludeInTree(includeInTree: boolean): void;
+    destroy(): void;
+}

package/dist/groups/shadowSettingsSet.d.ts

@@ -1,6 +1,7 @@
 import { SettingGroup } from '../base/settings-group/settingsGroup';
 import { GradientSetting } from '../settings/gradient-settings/GradientSetting';
 import { NumberSetting } from '../settings/number-settings/numberSettings';
+export declare const shadowIcon = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"17\" height=\"17\" viewBox=\"0 0 17 17\" fill=\"none\">\n<rect x=\"3.4115\" y=\"3.44287\" width=\"12.9308\" height=\"12.9308\" rx=\"1.5\" fill=\"#B7BFC5\"/>\n<path d=\"M0.834106 2.78764C0.834106 1.71642 1.7025 0.848022 2.77372 0.848022L11.8252 0.848022C12.8965 0.848022 13.7649 1.71642 13.7649 2.78764L13.7649 11.8392C13.7649 12.9104 12.8965 13.7788 11.8252 13.7788L2.77372 13.7788C1.7025 13.7788 0.834106 12.9104 0.834106 11.8392L0.834106 2.78764Z\" fill=\"white\"/>\n<path d=\"M12.5866 2.70661C12.5866 2.11574 12.1081 1.63724 11.5172 1.63724L2.70661 1.63724C2.11574 1.63724 1.63724 2.11574 1.63724 2.70661L1.63724 11.5172C1.63724 12.1081 2.11574 12.5866 2.70661 12.5866L11.5172 12.5866C12.1081 12.5866 12.5866 12.1081 12.5866 11.5172L12.5866 2.70661ZM14.2238 11.5172C14.2238 13.0118 13.0118 14.2238 11.5172 14.2238L2.70661 14.2238C1.21206 14.2238 4.05377e-08 13.0118 0 11.5172L0 2.70661C0 1.21206 1.21206 4.05377e-08 2.70661 0L11.5172 0C13.0118 0 14.2238 1.21206 14.2238 2.70661L14.2238 11.5172Z\" fill=\"#637381\"/>\n</svg>";
 export declare class ShadowSetting extends SettingGroup<{
     x: NumberSetting;
     y: NumberSetting;