hys-ui 0.1.1 → 0.3.0

package/dist/types/composables/useDialog.d.ts

@@ -1,4 +1,17 @@
-import { type Ref } from 'vue';
-export declare function useDialog(open: Ref<boolean>, dialog: Ref<HTMLElement | undefined>, close: () => void): {
-    active: Ref<boolean, boolean>;
+import { type Ref } from "vue";
+interface DialogOptions {
+    lockScroll?: () => boolean;
+    trapFocus?: () => boolean;
+    restoreFocus?: () => boolean;
+    initialFocus?: () => HTMLElement | false | undefined;
+    zIndex?: () => number | undefined;
+    onOpenAutoFocus?: (event: Event) => void;
+    onCloseAutoFocus?: (event: Event) => void;
+    childVisible?: () => boolean;
+}
+export declare function useDialog(open: Ref<boolean>, dialog: Ref<HTMLElement | undefined>, close: () => void, options?: DialogOptions): {
+    active: import("vue").ComputedRef<boolean>;
+    zIndex: import("vue").ComputedRef<number>;
+    focus: () => void;
 };
+export {};

package/dist/types/composables/useDrawerPush.d.ts

@@ -0,0 +1,6 @@
+import { type Ref, type CSSProperties } from "vue";
+import type { HysDrawerProps } from "./drawer";
+export declare function useDrawerPush(props: HysDrawerProps, shown: Readonly<Ref<boolean>>, fullscreen: Readonly<Ref<boolean>>): {
+    pushed: import("vue").ComputedRef<boolean>;
+    style: import("vue").ComputedRef<CSSProperties>;
+};

package/dist/types/composables/useDrawerResize.d.ts

@@ -0,0 +1,27 @@
+import { type Ref } from "vue";
+import { type HysDrawerProps } from "./drawer";
+export declare function useDrawerResize(props: HysDrawerProps, root: Ref<HTMLElement | undefined>, panel: Ref<HTMLElement | undefined>, shown: Readonly<Ref<boolean>>, fullscreen: Readonly<Ref<boolean>>, busy: Readonly<Ref<boolean>>, emit: (name: string, ...args: any[]) => void): {
+    handle: Ref<HTMLElement | undefined, HTMLElement | undefined>;
+    resizing: Ref<boolean, boolean>;
+    size: import("vue").ComputedRef<number>;
+    vertical: import("vue").ComputedRef<boolean>;
+    limits: (availableSize?: number) => {
+        min: number;
+        max: number;
+    };
+    model: {
+        current: import("vue").ComputedRef<number | null>;
+        commit: (value: number | null, update: (value: number | null) => void, change: (value: number | null) => void, notifyOnRequest?: boolean) => Promise<boolean>;
+        reset: () => void;
+        invalidate: () => void;
+        isLive: () => boolean;
+    };
+    resolvedSize: import("vue").ComputedRef<number | undefined>;
+    start: (event: PointerEvent) => void;
+    stop: (cancelled?: boolean) => Promise<boolean>;
+    keyboard: (event: KeyboardEvent) => Promise<void>;
+    resizeTo: (value: number | string) => Promise<boolean>;
+    reset: () => Promise<boolean>;
+    measure: () => void;
+    resetAfterClose: () => void;
+};

package/dist/types/composables/useFloating.d.ts

@@ -1,5 +1,13 @@
-import { type Ref } from 'vue';
-export type Placement = 'bottom-start' | 'bottom-end' | 'top-start' | 'top-end' | 'right' | 'left';
+import { type Ref } from "vue";
+export type Placement = "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end";
+export interface FloatingPosition {
+    anchor: DOMRect;
+    width: number;
+    height: number;
+    x: number;
+    y: number;
+    placement: Placement;
+}
 export interface FloatingAnchor {
     getBoundingClientRect(): DOMRect;
     contains(node: Node | null): boolean;
@@ -10,14 +18,28 @@ export declare function useFloating(anchor: Readonly<Ref<FloatingAnchor | undefi
     placement?: Placement;
     gap?: number;
     padding?: number;
-    matchWidth?: boolean | 'min' | (() => boolean | 'min');
+    matchWidth?: boolean | "min" | (() => boolean | "min");
+    width?: () => number | string | undefined;
+    maxWidth?: () => number | string | undefined;
+    requestOpen?: (open: boolean, restoreFocus?: boolean) => boolean | void;
+    closeOnTab?: boolean;
+    closeOnEscape?: boolean;
+    closeOnOutside?: boolean;
+    autoAdjustOverflow?: boolean;
+    strategy?: "fixed" | "absolute";
+    zIndex?: () => number | undefined;
+    onPosition?: (position: FloatingPosition) => void;
 }): {
     open: Ref<boolean, boolean>;
-    style: Ref<Record<string, string>, Record<string, string>>;
+    style: import("vue").ComputedRef<{
+        zIndex: string;
+    }>;
     placement: Ref<Placement, Placement>;
     update: () => void;
-    show: () => Promise<void>;
-    close: (restore?: boolean) => void;
+    show: (force?: boolean) => Promise<void>;
+    close: (restore?: boolean, force?: boolean) => void;
     toggle: () => void | Promise<void>;
     restoringFocus: Ref<boolean, boolean>;
+    schedule: () => void;
+    isTop: () => boolean;
 };

package/dist/types/composables/useGanttDependencies.d.ts

@@ -0,0 +1,83 @@
+import { type ComputedRef, type Ref } from "vue";
+import type { HysGanttDependencyChange, HysGanttDependencyInvalid, HysGanttDependencyMove, HysGanttDependencyReason, HysGanttScrollOptions } from "./gantt";
+type Id = string | number;
+interface Task {
+    id: Id;
+    title: string;
+    disabled?: boolean;
+    dependencies?: Id[];
+}
+interface Position {
+    x: number;
+    y: number;
+    w: number;
+    index: number;
+}
+interface Draft {
+    sourceId: Id;
+    previousTargetId?: Id;
+    targetId?: Id;
+    mode: "pointer" | "keyboard";
+    point: {
+        x: number;
+        y: number;
+    };
+    reason: HysGanttDependencyReason | null;
+}
+interface Context<T extends Task> {
+    items: () => readonly T[];
+    rows: () => readonly T[];
+    enabled: ComputedRef<boolean>;
+    live: () => boolean;
+    root: Ref<HTMLElement | undefined>;
+    viewport: Ref<HTMLElement | null>;
+    grid: Ref<HTMLElement | null>;
+    labelWidth: () => number;
+    rowHeight: () => number;
+    position: (id: Id) => Position | undefined;
+    locate: (id: Id, options?: HysGanttScrollOptions) => Promise<boolean>;
+    cancelTask: () => void;
+    update: (items: T[], info: HysGanttDependencyChange | HysGanttDependencyMove) => boolean;
+    change: (item: T) => void;
+    added: (info: HysGanttDependencyChange, item: T) => void;
+    removed: (info: HysGanttDependencyChange, item: T) => void;
+    moved: (info: HysGanttDependencyMove, item: T, previousItem: T) => void;
+    invalid: (info: HysGanttDependencyInvalid) => void;
+}
+export declare function ganttDependencyPath(from: {
+    x: number;
+    y: number;
+    w: number;
+}, to: {
+    x: number;
+    y: number;
+}, rowHeight?: number): string;
+export declare function ganttDependencyPickPath(from: {
+    x: number;
+    y: number;
+    w: number;
+}, to: {
+    x: number;
+    y: number;
+}, rowHeight?: number): string;
+export declare function useGanttDependencies<T extends Task>(ctx: Context<T>): {
+    draft: import("vue").ShallowRef<Draft | undefined, Draft | undefined>;
+    selected: ComputedRef<HysGanttDependencyChange | undefined>;
+    message: Ref<string, string>;
+    path: ComputedRef<string>;
+    add: (sourceId: Id, targetId: Id) => Promise<boolean>;
+    remove: (sourceId: Id, targetId: Id) => Promise<boolean>;
+    moveTarget: (sourceId: Id, previousTargetId: Id, targetId: Id) => Promise<boolean>;
+    cancel: (clearMessage?: boolean) => void;
+    beginPointer: (event: PointerEvent, source: Id, previousTargetId?: Id) => void;
+    move: (event: PointerEvent) => void;
+    end: (event: PointerEvent) => void;
+    lost: (event: PointerEvent) => void;
+    clickSource: (event: MouseEvent, id: Id, previousTargetId?: Id) => void;
+    beginKeyboard: (source: Id, previousTargetId?: Id) => void;
+    key: (event: KeyboardEvent) => void;
+    selectEdge: (event: Event, sourceId: Id, targetId: Id) => void;
+    clearSelected: () => void;
+    submit: (targetId?: Id) => Promise<boolean>;
+};
+export {};

package/dist/types/composables/useGanttHistory.d.ts

@@ -0,0 +1,42 @@
+import type { HysGanttHistoryEntry, HysGanttHistoryInvalid, HysGanttHistoryState } from "./gantt";
+type Id = string | number;
+type Field = "start" | "end" | "dependencies";
+export interface GanttHistoryTask {
+    id: Id;
+    start: string;
+    end: string;
+    dependencies?: Id[];
+    disabled?: boolean;
+}
+interface Snapshot {
+    id: Id;
+    start: string;
+    end: string;
+    dependencies?: Id[];
+}
+export declare function useGanttHistory<T extends GanttHistoryTask>(ctx: {
+    items: () => readonly T[];
+    enabled: () => boolean;
+    limit: () => number;
+    live: () => boolean;
+    allowed: (item: T, fields: Field[], next: Partial<Snapshot>) => boolean;
+    send: (items: T[]) => void;
+    change: (item: T) => void;
+    beforeReplay: () => void;
+    external: () => void;
+    state: (state: HysGanttHistoryState) => void;
+    replay: (action: "undo" | "redo", entry: HysGanttHistoryEntry) => void;
+    invalid: (info: HysGanttHistoryInvalid) => void;
+}): {
+    capture: (items: T[], info: Omit<HysGanttHistoryEntry, "taskIds">) => boolean;
+    clear: () => void;
+    undo: () => Promise<boolean>;
+    redo: () => Promise<boolean>;
+    state: import("vue").ComputedRef<HysGanttHistoryState>;
+    canUndo: import("vue").ComputedRef<boolean>;
+    canRedo: import("vue").ComputedRef<boolean>;
+    pending: import("vue").Ref<boolean, boolean>;
+    enabled: import("vue").ComputedRef<boolean>;
+    message: import("vue").Ref<string, string>;
+};
+export {};

package/dist/types/composables/useGanttLabelResize.d.ts

@@ -0,0 +1,23 @@
+import { type Ref } from "vue";
+export declare function useGanttLabelResize(options: {
+    width: () => number;
+    min: () => number;
+    max: () => number;
+    enabled: () => boolean;
+    available: Ref<number>;
+    live: () => boolean;
+    start: () => void;
+    update: (width: number) => void;
+    commit: (width: number) => void;
+}): {
+    width: import("vue").ComputedRef<number>;
+    minimum: import("vue").ComputedRef<number>;
+    maximum: import("vue").ComputedRef<number>;
+    resizing: Ref<boolean, boolean>;
+    down: (event: PointerEvent) => void;
+    move: (event: PointerEvent) => void;
+    up: (event: PointerEvent) => void;
+    cancel: () => void;
+    key: (event: KeyboardEvent) => void;
+    reset: () => void;
+};

package/dist/types/composables/useHysModal.d.ts

@@ -0,0 +1,44 @@
+import { type VNodeChild } from "vue";
+import { type HysConfig } from "../config";
+import type { HysModalProps, HysModalActionContext, HysModalCloseReason, HysModalSlotContext } from "./modal";
+export interface HysModalResult {
+    action: "confirm" | "cancel" | "destroy" | "owner-dispose";
+    reason: HysModalCloseReason | "destroy" | "owner-dispose";
+}
+export interface HysModalOptions extends Omit<HysModalProps, "open" | "modelValue" | "defaultOpen" | "fullscreen" | "appendTo"> {
+    content?: VNodeChild | ((context: HysModalSlotContext) => VNodeChild);
+    onOk?: (context: HysModalActionContext) => boolean | void | Promise<boolean | void>;
+    onCancel?: (context: HysModalActionContext) => boolean | void | Promise<boolean | void>;
+    onAfterClose?: (result: HysModalResult) => void;
+}
+export interface HysModalHandle {
+    readonly id: string;
+    readonly closed: Promise<HysModalResult>;
+    update(options: Partial<HysModalOptions>): void;
+    confirm(): Promise<boolean>;
+    cancel(): Promise<boolean>;
+    close(): Promise<boolean>;
+    destroy(): void;
+}
+export interface HysModalConfig {
+    defaults?: HysModalOptions;
+    appendTo?: string | HTMLElement;
+}
+export interface HysModalApi {
+    show(options: HysModalOptions): HysModalHandle;
+    confirm(options: HysModalOptions | string): HysModalHandle;
+    info(options: HysModalOptions | string): HysModalHandle;
+    success(options: HysModalOptions | string): HysModalHandle;
+    warning(options: HysModalOptions | string): HysModalHandle;
+    error(options: HysModalOptions | string): HysModalHandle;
+    destroyAll(): void;
+}
+export interface HysModalService extends HysModalApi {
+    dispose(): void;
+}
+export interface HysModalServiceConfig extends HysModalConfig, HysConfig {
+}
+/** Call in setup. Dialogs inherit ancestor providers and are disposed when their owner leaves. */
+export declare function useHysModal(config?: HysModalConfig): HysModalApi;
+/** Standalone browser service. Call dispose when its owning application is destroyed. */
+export declare function createHysModal(config?: HysModalServiceConfig): HysModalService;

package/dist/types/composables/useModal.d.ts

@@ -0,0 +1,62 @@
+import { type Ref } from "vue";
+import type { HysModalProps, HysModalCloseReason } from "./modal";
+export declare function useModal(props: HysModalProps, dialog: Ref<HTMLElement | undefined>, emit: (name: string, ...args: any[]) => void, options?: {
+    interaction?: boolean;
+}): {
+    model: {
+        current: import("vue").ComputedRef<boolean>;
+        commit: (value: boolean, update: (value: boolean) => void, change: (value: boolean) => void, notifyOnRequest?: boolean) => Promise<boolean>;
+        reset: () => void;
+        invalidate: () => void;
+        isLive: () => boolean;
+    };
+    alpha: (value: number) => number;
+    fullscreen: import("vue").ComputedRef<boolean>;
+    live: Ref<boolean, boolean>;
+    state: {
+        active: import("vue").ComputedRef<boolean>;
+        zIndex: import("vue").ComputedRef<number>;
+        focus: () => void;
+    };
+    shown: Ref<boolean, boolean>;
+    engaged: Ref<boolean, boolean>;
+    rendered: Ref<boolean, boolean>;
+    leaving: Ref<boolean, boolean>;
+    error: Ref<string, string>;
+    confirming: import("vue").ComputedRef<boolean>;
+    closing: import("vue").ComputedRef<boolean>;
+    busy: import("vue").ComputedRef<boolean>;
+    motion: import("vue").ComputedRef<boolean>;
+    interaction: {
+        position: import("vue").ShallowRef<import("./modal").HysModalPosition, import("./modal").HysModalPosition>;
+        dimensions: import("vue").ShallowRef<import("./modal").HysModalSize | undefined, import("./modal").HysModalSize | undefined>;
+        previewing: Ref<boolean, boolean>;
+        previewLayer: Ref<HTMLElement | undefined, HTMLElement | undefined>;
+        getPosition: () => import("./modal").HysModalPosition;
+        getDimensions: () => import("./modal").HysModalSize | undefined;
+        dragging: Ref<boolean, boolean>;
+        resizing: Ref<boolean, boolean>;
+        gesturing: import("vue").ComputedRef<boolean>;
+        start: (event: PointerEvent, kind: "drag" | "resize") => void;
+        stop: (cancel?: boolean) => void;
+        headerKey: (event: KeyboardEvent) => void;
+        resizeKey: (event: KeyboardEvent) => void;
+        resetPosition: () => void;
+        resetSize: () => void;
+        setPosition: (next: import("./modal").HysModalPosition) => void;
+        setSize: (next: import("./modal").HysModalSize) => void;
+        clampViewport: () => void;
+        activate(): void;
+    };
+    show: () => Promise<boolean>;
+    requestClose: (reasonOrEvent?: HysModalCloseReason | Event, event?: Event) => Promise<boolean>;
+    confirm: (event?: Event) => Promise<boolean>;
+    cancel: (event?: Event) => Promise<boolean>;
+    setFullscreen: (value: boolean) => Promise<boolean>;
+    toggleFullscreen: () => Promise<boolean>;
+    afterEnter: () => Promise<void>;
+    afterLeave: () => Promise<void>;
+    key: (event: KeyboardEvent) => void;
+    maskDown: (event: PointerEvent) => void;
+    maskUp: (event: PointerEvent) => void;
+};

package/dist/types/composables/useModalInteraction.d.ts

@@ -0,0 +1,27 @@
+import { type Ref } from "vue";
+import { type HysModalProps, type HysModalPosition, type HysModalSize } from "./modal";
+export declare function useModalInteraction(props: HysModalProps, dialog: Ref<HTMLElement | undefined>, visible: Readonly<Ref<boolean>>, fullscreen: Readonly<Ref<boolean>>, emit: (name: string, ...args: any[]) => void, options?: {
+    beforeStart?: () => void;
+    motion?: () => boolean;
+    enabled?: boolean;
+}): {
+    position: import("vue").ShallowRef<HysModalPosition, HysModalPosition>;
+    dimensions: import("vue").ShallowRef<HysModalSize | undefined, HysModalSize | undefined>;
+    previewing: Ref<boolean, boolean>;
+    previewLayer: Ref<HTMLElement | undefined, HTMLElement | undefined>;
+    getPosition: () => HysModalPosition;
+    getDimensions: () => HysModalSize | undefined;
+    dragging: Ref<boolean, boolean>;
+    resizing: Ref<boolean, boolean>;
+    gesturing: import("vue").ComputedRef<boolean>;
+    start: (event: PointerEvent, kind: "drag" | "resize") => void;
+    stop: (cancel?: boolean) => void;
+    headerKey: (event: KeyboardEvent) => void;
+    resizeKey: (event: KeyboardEvent) => void;
+    resetPosition: () => void;
+    resetSize: () => void;
+    setPosition: (next: HysModalPosition) => void;
+    setSize: (next: HysModalSize) => void;
+    clampViewport: () => void;
+    activate(): void;
+};