hys-ui 0.1.1 → 0.3.0

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

@@ -0,0 +1,250 @@
+import type { HysPopupTransition } from '../motion/popup';
+import type { CSSProperties } from "vue";
+import type { Placement } from "./useFloating";
+export type HysDateScalar = string | Date | number;
+export type HysDatePickerValue = HysDateScalar | readonly (HysDateScalar | null)[] | null;
+export type HysDateRangeValue = readonly [HysDateScalar | null, HysDateScalar | null] | null;
+export type HysDatePickerType = "date" | "dates" | "week" | "weeks" | "month" | "months" | "quarter" | "quarters" | "year" | "years" | "datetime";
+export type HysDatePickerView = "date" | "month" | "quarter" | "year";
+export type HysDatePickerUnit = "date" | "week" | "month" | "quarter" | "year";
+export interface HysDatePoint {
+    day: number;
+    second: number;
+}
+export interface HysDatePickerContext {
+    range: "start" | "end";
+    from: Date | null;
+    iso: string;
+}
+export interface HysDateDisabledTime {
+    hours?: readonly number[];
+    minutes?: (hour: number) => readonly number[];
+    seconds?: (hour: number, minute: number) => readonly number[];
+}
+export interface HysDateShortcut {
+    label: string;
+    value: HysDatePickerValue | (() => HysDatePickerValue);
+    disabled?: boolean;
+}
+export interface HysDatePickerCell {
+    date: Date;
+    iso: string;
+    value: number;
+    end: number;
+    text: string;
+    type: HysDatePickerView;
+    outside: boolean;
+    disabled: boolean;
+    selected: boolean;
+    inRange: boolean;
+    today: boolean;
+    week: number;
+    weekYear: number;
+    weekStart: string;
+    weekEnd: string;
+}
+export interface HysDatePickerWeek {
+    year: number;
+    week: number;
+    start: string;
+    end: string;
+    dates: readonly string[];
+}
+export interface HysDatePickerChange {
+    source: "date" | "time" | "input" | "shortcut" | "clear" | "confirm" | "api";
+    dates: readonly (Date | null)[];
+    formatted: readonly string[];
+    weeks?: readonly (HysDatePickerWeek | null)[];
+}
+export interface HysDatePickerLocale {
+    today: string;
+    now: string;
+    clear: string;
+    cancel: string;
+    close: string;
+    confirm: string;
+    start: string;
+    end: string;
+    chooseStart: string;
+    chooseEnd: string;
+    invalid: string;
+    week: string;
+    year: string;
+    month: string;
+    back: string;
+    prevMonth: string;
+    nextMonth: string;
+    prevYear: string;
+    nextYear: string;
+    hour: string;
+    minute: string;
+    second: string;
+    empty: string;
+    limit: string;
+}
+export interface HysDatePickerProps<V extends HysDatePickerValue = HysDatePickerValue> {
+    popupTransition?: HysPopupTransition;
+    popupTransitionDuration?: number;
+    modelValue?: V;
+    defaultValue?: V;
+    clearValue?: V;
+    type?: HysDatePickerType;
+    valueType?: "string" | "date" | "timestamp";
+    valueFormat?: string;
+    format?: string;
+    inputFormats?: readonly string[];
+    disabled?: boolean | readonly [boolean, boolean];
+    readonly?: boolean;
+    size?: "sm" | "md" | "lg";
+    status?: "error" | "warning" | "success";
+    bordered?: boolean;
+    placeholder?: string;
+    label?: string;
+    ariaLabel?: string;
+    name?: string | readonly [string, string];
+    form?: string;
+    autofocus?: boolean;
+    min?: HysDateScalar;
+    max?: HysDateScalar;
+    disabledDate?: (date: Date, context: HysDatePickerContext) => boolean;
+    disabledTime?: (date: Date, context: HysDatePickerContext) => HysDateDisabledTime;
+    firstDayOfWeek?: number;
+    firstWeekContainsDate?: number;
+    weekNumberFormatter?: (week: HysDatePickerWeek) => string;
+    disabledWeek?: (week: HysDatePickerWeek) => boolean;
+    weekValidation?: "any" | "full";
+    locale?: string;
+    messages?: Partial<HysDatePickerLocale>;
+    showWeekNumbers?: boolean;
+    showAdjacentDays?: boolean;
+    defaultPickerValue?: HysDateScalar;
+    panelValue?: HysDateScalar;
+    mode?: HysDatePickerView;
+    defaultMode?: HysDatePickerView;
+    shortcuts?: readonly HysDateShortcut[];
+    clearable?: boolean;
+    editable?: boolean;
+    inputReadonly?: boolean;
+    showOnFocus?: boolean;
+    showToday?: boolean;
+    showNow?: boolean;
+    showFooter?: boolean;
+    showConfirm?: boolean;
+    showTime?: boolean;
+    defaultTime?: string | readonly [string, string];
+    hourStep?: number;
+    minuteStep?: number;
+    secondStep?: number;
+    showSeconds?: boolean;
+    rangeSeparator?: string;
+    startPlaceholder?: string;
+    endPlaceholder?: string;
+    allowEmpty?: readonly [boolean, boolean];
+    singlePanel?: boolean;
+    unlinkPanels?: boolean;
+    minRangeDays?: number;
+    maxRangeDays?: number;
+    rangeValidation?: "endpoints" | "continuous";
+    maxDates?: number;
+    open?: boolean;
+    defaultOpen?: boolean;
+    inline?: boolean;
+    placement?: Placement;
+    appendTo?: string | HTMLElement | false;
+    popupWidth?: number | string;
+    popupClass?: string;
+    popupStyle?: CSSProperties;
+    validateEvent?: boolean;
+    cellClassName?: (cell: HysDatePickerCell) => string;
+}
+export interface HysDateRangePickerProps<V extends HysDatePickerValue = HysDateRangeValue> extends HysDatePickerProps<V> {
+}
+export interface HysDatePickerInstance<V extends HysDatePickerValue = HysDatePickerValue> {
+    readonly element: HTMLElement | undefined;
+    readonly open: boolean;
+    readonly value: V;
+    readonly draft: readonly (Date | null)[];
+    focus: () => void;
+    blur: () => void;
+    show: () => Promise<boolean>;
+    hide: (restoreFocus?: boolean) => void;
+    handleOpen: () => Promise<boolean>;
+    handleClose: () => void;
+    clear: () => Promise<boolean>;
+    setValue: (value: V) => Promise<boolean>;
+    confirm: () => Promise<boolean>;
+    cancel: () => void;
+    showMonth: (value: HysDateScalar) => Promise<boolean>;
+    setMode: (view: HysDatePickerView) => boolean;
+}
+export interface HysDatePickerSlots {
+    "week-number"?: (week: HysDatePickerWeek & {
+        selected: boolean;
+        disabled: boolean;
+    }) => any;
+    default?: (cell: HysDatePickerCell) => any;
+    cell?: (cell: HysDatePickerCell) => any;
+    prefix?: () => any;
+    suffix?: () => any;
+    "clear-icon"?: () => any;
+    "prev-month"?: () => any;
+    "next-month"?: () => any;
+    "prev-year"?: () => any;
+    "next-year"?: () => any;
+    header?: (context: {
+        dates: readonly (Date | null)[];
+        view: HysDatePickerView;
+    }) => any;
+    footer?: (context: {
+        dates: readonly (Date | null)[];
+        confirm: () => Promise<boolean>;
+        cancel: () => void;
+        clear: () => Promise<boolean>;
+    }) => any;
+    shortcut?: (context: {
+        shortcut: HysDateShortcut;
+        index: number;
+    }) => any;
+    "range-separator"?: () => any;
+}
+export type HysDateRangePickerInstance<V extends HysDatePickerValue = HysDateRangeValue> = HysDatePickerInstance<V>;
+export declare const datePickerDefaults: {
+    readonly open: undefined;
+    readonly showConfirm: undefined;
+    readonly type: "date";
+    readonly clearable: false;
+    readonly editable: false;
+    readonly bordered: true;
+    readonly firstDayOfWeek: 1;
+    readonly locale: "zh-CN";
+    readonly showAdjacentDays: true;
+    readonly showToday: true;
+    readonly showNow: true;
+    readonly showFooter: true;
+    readonly showSeconds: true;
+    readonly singlePanel: true;
+    readonly rangeSeparator: " 至 ";
+    readonly hourStep: 1;
+    readonly minuteStep: 1;
+    readonly secondStep: 1;
+    readonly rangeValidation: "endpoints";
+    readonly validateEvent: true;
+    readonly appendTo: "body";
+};
+export declare const datePickerWords: HysDatePickerLocale;
+export declare const datePickerEnglish: HysDatePickerLocale;
+export declare const DATE_MIN: number, DATE_MAX: number;
+export declare const dateUnit: (type: string | undefined) => HysDatePickerUnit;
+export declare const dateMultiple: (type: string | undefined) => boolean;
+export declare function datePattern(type: string | undefined, time?: boolean): "YYYY-MM-DD" | "YYYY" | "YYYY-MM-DD HH:mm:ss" | "YYYY-MM" | "YYYY-[Q]Q";
+export declare function datePeriod(day: number, unit: HysDatePickerUnit, first?: number): [number, number];
+export declare function dateTimeString(second: number): string;
+export declare function dateTimeSeconds(value: string | undefined): number;
+export declare function dateWeek(day: number, first?: number, contains?: number): HysDatePickerWeek;
+export declare function dateFormat(point: HysDatePoint, pattern: string, first?: number, contains?: number): string;
+export declare function datePoint(value: unknown, pattern?: string, first?: number, contains?: number): HysDatePoint | undefined;
+export declare function dateNative(point: HysDatePoint): Date;
+export declare function dateEqual(a: HysDatePickerValue | undefined, b: HysDatePickerValue | undefined): boolean;
+export declare function dateClone<V extends HysDatePickerValue>(value: V): V;
+export declare function dateLocale(locale: string): Intl.DateTimeFormat;
+export declare function dateShift(day: number, months: number): number;

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

@@ -0,0 +1,102 @@
+import type { CSSProperties, VNodeChild } from "vue";
+import type { HysModalProps, HysModalActionContext, HysModalCloseReason, HysModalInitialFocus, HysModalSectionSize } from "./modal";
+export type HysDrawerPlacement = "left" | "right" | "top" | "bottom";
+export type HysDrawerSizeName = "xs" | "sm" | "md" | "lg" | "xl" | "full";
+export type HysDrawerCloseReason = HysModalCloseReason;
+export type HysDrawerActionContext = HysModalActionContext;
+export type HysDrawerInitialFocus = HysModalInitialFocus;
+export type HysDrawerSectionSize = HysModalSectionSize;
+export type HysDrawerBeforeClose = Function & {
+    invoke(reason: HysDrawerCloseReason, context: HysDrawerActionContext): boolean | void | Promise<boolean | void>;
+}["invoke"];
+export interface HysDrawerResizeOptions {
+    minSize?: number | string;
+    maxSize?: number | string;
+    step?: number;
+}
+export interface HysDrawerResizeInfo {
+    placement: HysDrawerPlacement;
+    cancelled: boolean;
+    accepted: boolean;
+}
+export interface HysDrawerPushOptions {
+    distance?: number | string;
+}
+export interface HysDrawerProps extends Pick<HysModalProps, "open" | "modelValue" | "defaultOpen" | "title" | "description" | "opacity" | "maskOpacity" | "width" | "height" | "fullscreen" | "defaultFullscreen" | "showFullscreen" | "closeOnMask" | "closeOnEscape" | "showClose" | "destroyOnClose" | "forceRender" | "modal" | "modalPenetrable" | "appendTo" | "lockScroll" | "trapFocus" | "restoreFocus" | "initialFocus" | "openDelay" | "closeDelay" | "transitionDuration" | "zIndex" | "headerClass" | "headerSize" | "footerSize" | "headerHeight" | "footerHeight" | "titleFontSize" | "bodyClass" | "footerClass" | "overlayClass" | "headerStyle" | "bodyStyle" | "footerStyle" | "maskStyle" | "ariaLabel" | "ariaLabelledby" | "ariaDescribedby" | "role" | "headerAriaLevel" | "closeText" | "fullscreenText" | "restoreText" | "footer" | "footerAlign" | "showCancel" | "okText" | "cancelText" | "okVariant" | "okButtonProps" | "cancelButtonProps" | "confirmLoading" | "confirmDisabled" | "cancelDisabled" | "closeWhileConfirming" | "loading" | "loadingText" | "showError" | "errorText" | "confirmOnCtrlEnter" | "closeOnConfirm"> {
+    beforeClose?: HysDrawerBeforeClose;
+    beforeConfirm?: (context: HysDrawerActionContext) => boolean | void | Promise<boolean | void>;
+    placement?: HysDrawerPlacement;
+    size?: HysDrawerSizeName | number | (string & {});
+    drawerClass?: string;
+    drawerStyle?: CSSProperties;
+    overlayStyle?: CSSProperties;
+    bodyTabindex?: number;
+    contained?: boolean;
+    withHeader?: boolean;
+    autofocus?: boolean;
+    transition?: "slide" | "fade" | "slide-fade" | "none" | false;
+    push?: boolean | HysDrawerPushOptions;
+    resizable?: boolean | HysDrawerResizeOptions;
+    resizeValue?: number | null;
+    defaultResizeValue?: number | null;
+    resetSizeOnClose?: boolean;
+    resizeText?: string;
+}
+export interface HysDrawerSlotContext {
+    close: (reasonOrEvent?: HysDrawerCloseReason | Event, event?: Event) => Promise<boolean>;
+    cancel: (event?: Event) => Promise<boolean>;
+    confirm: (event?: Event) => Promise<boolean>;
+    closing: boolean;
+    confirming: boolean;
+    busy: boolean;
+    error: string;
+    titleId: string;
+    descriptionId: string;
+    fullscreen: boolean;
+    toggleFullscreen: () => Promise<boolean>;
+    resizing: boolean;
+    size: number;
+    resetSize: () => Promise<boolean>;
+    pushed: boolean;
+}
+export interface HysDrawerSlots {
+    default?: (scope: HysDrawerSlotContext) => VNodeChild;
+    header?: (scope: HysDrawerSlotContext) => VNodeChild;
+    title?: (scope: HysDrawerSlotContext) => VNodeChild;
+    extra?: (scope: HysDrawerSlotContext) => VNodeChild;
+    footer?: (scope: HysDrawerSlotContext) => VNodeChild;
+    loading?: (scope: HysDrawerSlotContext) => VNodeChild;
+    "close-icon"?: (scope: HysDrawerSlotContext) => VNodeChild;
+    "fullscreen-icon"?: (scope: HysDrawerSlotContext) => VNodeChild;
+}
+export interface HysDrawerInstance {
+    readonly element: HTMLElement | undefined;
+    readonly body: HTMLElement | undefined;
+    readonly open: boolean;
+    readonly closing: boolean;
+    readonly confirming: boolean;
+    readonly fullscreen: boolean;
+    readonly resizing: boolean;
+    readonly size: number;
+    readonly pushed: boolean;
+    focus: () => void;
+    show: () => Promise<boolean>;
+    close: (reasonOrEvent?: HysDrawerCloseReason | Event, event?: Event) => Promise<boolean>;
+    hide: () => Promise<boolean>;
+    cancel: (event?: Event) => Promise<boolean>;
+    confirm: (event?: Event) => Promise<boolean>;
+    setFullscreen: (value: boolean) => Promise<boolean>;
+    toggleFullscreen: () => Promise<boolean>;
+    resizeTo: (value: number | string) => Promise<boolean>;
+    resetSize: () => Promise<boolean>;
+}
+export declare const drawerSizes: {
+    readonly xs: 280;
+    readonly sm: 360;
+    readonly md: 520;
+    readonly lg: 736;
+    readonly xl: 960;
+    readonly full: "100%";
+};
+export declare const drawerVertical: (placement?: HysDrawerPlacement) => placement is "top" | "bottom";
+export declare function drawerSize(props: HysDrawerProps): string | number;

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

@@ -0,0 +1,98 @@
+import type { CSSProperties, VNodeChild } from "vue";
+export type HysAlertTone = "info" | "primary" | "success" | "warning" | "danger";
+export type HysAlertEffect = "light" | "dark" | "outline";
+export type HysAlertTransition = "fade" | "slide" | "collapse" | "none";
+export interface HysAlertCloseContext {
+    reason: "button" | "api";
+    event?: Event;
+    signal: AbortSignal;
+}
+export interface HysAlertProps {
+    tone?: HysAlertTone;
+    title?: string;
+    description?: string;
+    closable?: boolean;
+    showIcon?: boolean;
+    center?: boolean;
+    visible?: boolean;
+    modelValue?: boolean;
+    defaultVisible?: boolean;
+    effect?: HysAlertEffect;
+    banner?: boolean;
+    bordered?: boolean;
+    size?: "sm" | "md" | "lg";
+    closeText?: string;
+    closeLabel?: string;
+    disabled?: boolean;
+    beforeClose?: (context: HysAlertCloseContext) => boolean | void | Promise<boolean | void>;
+    transition?: HysAlertTransition;
+    transitionDuration?: number;
+    appear?: boolean;
+    ariaLabel?: string;
+    ariaLive?: "off" | "polite" | "assertive";
+    ariaAtomic?: boolean;
+}
+export interface HysAlertSlotContext {
+    tone: HysAlertTone;
+    visible: boolean;
+    closing: boolean;
+    disabled: boolean;
+    close: () => Promise<boolean>;
+}
+export interface HysAlertSlots {
+    default?: (context: HysAlertSlotContext) => VNodeChild;
+    title?: (context: HysAlertSlotContext) => VNodeChild;
+    description?: (context: HysAlertSlotContext) => VNodeChild;
+    icon?: (context: HysAlertSlotContext) => VNodeChild;
+    action?: (context: HysAlertSlotContext) => VNodeChild;
+    "close-icon"?: (context: HysAlertSlotContext) => VNodeChild;
+}
+export interface HysAlertInstance {
+    readonly element: HTMLElement | undefined;
+    readonly visible: boolean;
+    readonly closing: boolean;
+    close: () => Promise<boolean>;
+    show: () => Promise<boolean>;
+}
+export type HysEmptyIllustration = "inbox" | "simple" | "default";
+export interface HysEmptyProps {
+    title?: string | false;
+    description?: string | false;
+    image?: string | false;
+    imageSize?: number;
+    imageStyle?: CSSProperties;
+    imageFit?: "contain" | "cover" | "fill" | "none" | "scale-down";
+    imageAlt?: string;
+    imageLoading?: "eager" | "lazy";
+    crossOrigin?: "" | "anonymous" | "use-credentials";
+    referrerPolicy?: ReferrerPolicy;
+    illustration?: HysEmptyIllustration;
+    size?: "sm" | "md" | "lg";
+    showImageLoading?: boolean;
+    ariaLabel?: string;
+    ariaLive?: "off" | "polite" | "assertive";
+}
+export interface HysEmptySlotContext {
+    title: string | false;
+    description: string | false;
+    imageLoading: boolean;
+    imageError: boolean;
+    retryImage: () => boolean;
+}
+export interface HysEmptySlots {
+    default?: (context: HysEmptySlotContext) => VNodeChild;
+    image?: (context: HysEmptySlotContext) => VNodeChild;
+    title?: (context: HysEmptySlotContext) => VNodeChild;
+    description?: (context: HysEmptySlotContext) => VNodeChild;
+    action?: (context: HysEmptySlotContext) => VNodeChild;
+    fallback?: (context: HysEmptySlotContext) => VNodeChild;
+}
+export interface HysEmptyInstance {
+    readonly element: HTMLElement | undefined;
+    readonly imageElement: HTMLImageElement | undefined;
+    readonly loadingImage: boolean;
+    readonly failedImage: boolean;
+    retryImage: () => boolean;
+}
+export declare function feedbackImage(value: string | false | undefined): string | undefined;
+export declare const feedbackNumber: (value: number | undefined, fallback: number, min: number, max: number) => number;

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

@@ -1,20 +1,116 @@
-import type { ComputedRef, InjectionKey, Ref } from 'vue';
+import { type ComputedRef, type InjectionKey, type Ref } from "vue";
+import type { RuleType, ValidateMessages } from "async-validator";
+import type { HysFormCol } from "./formLayout";
+export type HysFormPath = string | readonly (string | number)[];
+export type HysFormPaths = string | readonly HysFormPath[];
+export type HysFormTrigger = "blur" | "change";
+export type HysFormStatus = "idle" | "validating" | "success" | "warning" | "error";
+export type HysFormRuleType = RuleType;
+export type HysFormMessages = Partial<ValidateMessages>;
+export interface HysFormValidationContext {
+    path: string;
+    signal: AbortSignal;
+}
+export type HysFormValidateCallback = (valid: boolean, result: HysFormValidationResult) => void | Promise<void>;
+export interface HysFormFieldData {
+    name: HysFormPath;
+    value?: unknown;
+    errors?: string[];
+    warnings?: string[];
+}
 export interface HysFormRule {
+    type?: HysFormRuleType;
     required?: boolean;
-    message?: string;
+    message?: string | ((path?: string) => string);
     min?: number;
     max?: number;
-    pattern?: RegExp;
-    trigger?: 'blur' | 'change' | ('blur' | 'change')[];
-    validator?: (value: unknown, model: Record<string, unknown>) => boolean | string | void | Promise<boolean | string | void>;
+    len?: number;
+    enum?: Array<string | number | boolean | null | undefined>;
+    whitespace?: boolean;
+    pattern?: RegExp | string;
+    transform?: (value: unknown) => unknown;
+    fields?: HysFormRules;
+    defaultField?: HysFormRule | HysFormRule[];
+    trigger?: HysFormTrigger | HysFormTrigger[];
+    level?: "error" | "warning";
+    validator?: (value: unknown, model: Record<string, unknown>, context: HysFormValidationContext) => boolean | string | Error | void | Promise<boolean | string | Error | void>;
+    asyncValidator?: (value: unknown, callback: (error?: string | Error) => void, model: Record<string, unknown>, context: HysFormValidationContext) => void | Promise<void>;
+}
+export interface HysFormRules {
+    [path: string]: HysFormRule | HysFormRule[];
+}
+export interface HysFormValidationResult {
+    valid: boolean;
+    cancelled: boolean;
+    values: Record<string, unknown>;
+    errors: Record<string, string>;
+    warnings: Record<string, string>;
+    errorMessages: Record<string, string[]>;
+    warningMessages: Record<string, string[]>;
+}
+export interface HysFormFieldState {
+    status: HysFormStatus;
+    message: string;
+    warning: string;
+    validating: boolean;
+}
+export interface HysFormField {
+    path: ComputedRef<string>;
+    element: Ref<HTMLElement | undefined>;
+    rules: ComputedRef<HysFormRule[]>;
+    trigger: ComputedRef<HysFormTrigger | HysFormTrigger[]>;
+    dependencies?: ComputedRef<readonly HysFormPath[]>;
+    label: ComputedRef<string | undefined>;
+    validateFirst?: ComputedRef<boolean>;
+    preserve?: ComputedRef<boolean>;
+    validate: (trigger?: HysFormTrigger) => Promise<boolean>;
+    clearValidate: () => void;
+    resetField: () => void;
+    setInitialValue?: (value: unknown) => void;
+    focus: () => void;
 }
 export interface HysFormContext {
     model: ComputedRef<Record<string, unknown> | undefined>;
     resetting: Ref<boolean>;
+    suppressAutoBlur?: Ref<boolean>;
     errors: Ref<Record<string, string>>;
-    rules: ComputedRef<Record<string, HysFormRule | HysFormRule[]>>;
-    register: (name: string) => () => void;
-    validateField: (name: string, trigger?: 'blur' | 'change') => Promise<boolean>;
+    warnings: Ref<Record<string, string>>;
+    errorMessages: Ref<Record<string, string[]>>;
+    warningMessages: Ref<Record<string, string[]>>;
+    states: Ref<Record<string, HysFormFieldState>>;
+    rules: ComputedRef<HysFormRules>;
+    getRules: (path: HysFormPath) => HysFormRule[];
+    disabled: ComputedRef<boolean>;
+    size: ComputedRef<"sm" | "md" | "lg">;
+    labelPosition: ComputedRef<"top" | "left" | "right">;
+    labelWidth: ComputedRef<string>;
+    autoLabelWidth: ComputedRef<string>;
+    containerWidth: ComputedRef<number>;
+    columns: ComputedRef<number>;
+    labelAlign: ComputedRef<"left" | "right">;
+    labelWrap: ComputedRef<boolean>;
+    labelSuffix: ComputedRef<string>;
+    colon: ComputedRef<boolean>;
+    labelCol: ComputedRef<HysFormCol | undefined>;
+    wrapperCol: ComputedRef<HysFormCol | undefined>;
+    inlineFeedback: ComputedRef<boolean>;
+    feedbackIcon: ComputedRef<boolean>;
+    optionalMark: ComputedRef<string>;
+    validateFirst: ComputedRef<boolean>;
+    preserve: ComputedRef<boolean>;
+    setLabelWidth: (key: string, width?: number) => void;
+    showLabel: ComputedRef<boolean>;
+    showFeedback: ComputedRef<boolean>;
+    showRequiredMark: ComputedRef<boolean>;
+    requiredMarkPosition: ComputedRef<"left" | "right">;
+    validateTrigger: ComputedRef<HysFormTrigger | HysFormTrigger[]>;
+    validateOnRuleChange: ComputedRef<boolean>;
+    register: (field: HysFormField) => () => void;
+    validateField: (name: HysFormPath, trigger?: HysFormTrigger) => Promise<boolean>;
+    cancelField: (name: HysFormPath) => void;
+    clearValidate: (names?: HysFormPaths) => void;
+    resetFields: (names?: HysFormPaths) => void;
+    setFieldInitialValue: (name: HysFormPath, value: unknown) => void;
 }
 export declare const formKey: InjectionKey<HysFormContext>;
 export interface HysFieldContext {
@@ -24,6 +120,37 @@ export interface HysFieldContext {
     errorId: string;
     describedBy: ComputedRef<string | undefined>;
     required: ComputedRef<boolean>;
+    invalid?: ComputedRef<boolean>;
+    status?: ComputedRef<HysFormStatus>;
+    validate?: (trigger?: HysFormTrigger) => Promise<boolean>;
+    /** Temporarily defer model-watch validation during a continuous control gesture. */
+    deferChangeValidation?: () => () => void;
+    disabled?: ComputedRef<boolean>;
+    size?: ComputedRef<"sm" | "md" | "lg">;
 }
 export declare const fieldKey: InjectionKey<HysFieldContext>;
+/** Integrate a custom control with its nearest FormItem without DOM queries. */
+export declare function useHysFormItemContext(): {
+    id: ComputedRef<string | undefined>;
+    label: ComputedRef<string | undefined>;
+    disabled: ComputedRef<boolean>;
+    size: ComputedRef<"sm" | "md" | "lg">;
+    required: ComputedRef<boolean>;
+    invalid: ComputedRef<boolean>;
+    status: ComputedRef<HysFormStatus>;
+    error: ComputedRef<string | undefined>;
+    describedBy: ComputedRef<string | undefined>;
+    validate: (trigger?: HysFormTrigger) => Promise<boolean>;
+};
+export declare function useHysControlState(props: {
+    disabled?: boolean;
+    size?: "sm" | "md" | "lg";
+}): {
+    disabled: ComputedRef<boolean>;
+    size: ComputedRef<"sm" | "md" | "lg">;
+    label: ComputedRef<string | undefined>;
+};
+export declare function formPath(path: HysFormPath): string;
+export declare function formValue(model: Record<string, unknown> | undefined, path: HysFormPath): unknown;
+export declare function setFormValue(model: Record<string, unknown>, path: HysFormPath, value: unknown): void;
 export declare function focusHysField(control: HTMLElement | null | undefined): void;

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

@@ -0,0 +1,11 @@
+import { type Ref } from "vue";
+export type HysFormBreakpoint = "xs" | "sm" | "md" | "lg" | "xl" | "xxl";
+export type HysFormGridValue = number | Partial<Record<HysFormBreakpoint, number>>;
+export interface HysFormColSize {
+    span?: number;
+    offset?: number;
+}
+export type HysFormCol = HysFormColSize & Partial<Record<HysFormBreakpoint, number | HysFormColSize>>;
+export declare function resolveFormGrid(value: HysFormGridValue | undefined, width: number, fallback?: number): number;
+export declare function resolveFormCol(value: HysFormCol | undefined, width: number): HysFormColSize | undefined;
+export declare function useFormWidth(element: Ref<HTMLElement | undefined>): import("vue").ComputedRef<number>;

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

@@ -0,0 +1,13 @@
+import { type HysFormMessages, type HysFormRule, type HysFormRules, type HysFormValidationContext } from "./formContext";
+export declare function snapshotForm(value: unknown, seen?: WeakMap<object, unknown>): unknown;
+export declare function sameFormValue(a: unknown, b: unknown, seen?: WeakMap<object, object>): boolean;
+export interface HysFormRuleResult {
+    messages: string[];
+    fields: Record<string, string[]>;
+}
+export declare function runFormRules(name: string, value: unknown, rules: HysFormRule[], model: Record<string, unknown>, messages: HysFormMessages | undefined, context: HysFormValidationContext, first?: boolean): HysFormRuleResult | Promise<HysFormRuleResult>;
+/** Resolve a mounted leaf against object/array descriptors declared on parents. */
+export declare function nestedFormRules(path: string, rules: HysFormRules, model?: Record<string, unknown>): {
+    rules: HysFormRule[];
+    value: unknown;
+};