hys-ui 0.7.0 → 0.8.0

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

@@ -0,0 +1,277 @@
+import type { HysPopupTransition } from "../motion/popup";
+import type { Component, 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" | "daterange" | "weekrange" | "monthrange" | "quarterrange" | "yearrange" | "datetimerange";
+export type HysDatePickerView = "date" | "month" | "quarter" | "year" | "decade" | "time";
+export type HysDatePickerUnit = "date" | "week" | "month" | "quarter" | "year";
+export type HysDateDisplayFormat = string | ((date: Date) => string);
+export type HysDatePanelValues = readonly [HysDateScalar, HysDateScalar];
+export type HysDateDefaultTime = string | Date;
+export interface HysDateTimeOptions {
+    defaultValue?: HysDateDefaultTime | readonly [HysDateDefaultTime, HysDateDefaultTime];
+    format?: string;
+    use12Hours?: boolean;
+    hourStep?: number;
+    minuteStep?: number;
+    secondStep?: number;
+    hideDisabledOptions?: boolean;
+}
+export interface HysDatePopupOptions {
+    strategy?: "fixed" | "absolute";
+    offset?: number;
+    padding?: number;
+    flip?: boolean;
+}
+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[];
+    disabledHours?: () => readonly number[];
+    disabledMinutes?: (hour: number) => readonly number[];
+    disabledSeconds?: (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;
+    range?: "start" | "end";
+    rangeStart?: boolean;
+    rangeEnd?: boolean;
+    row?: number;
+    column?: number;
+}
+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 HysDateCalendarChange {
+    range: "start" | "end";
+    dates: readonly (Date | null)[];
+    formatted: readonly string[];
+}
+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;
+    value?: V;
+    defaultValue?: V;
+    clearValue?: V;
+    emptyValues?: readonly HysDatePickerValue[];
+    valueOnClear?: V | (() => V);
+    type?: HysDatePickerType;
+    picker?: HysDatePickerUnit;
+    valueType?: "string" | "date" | "timestamp";
+    valueFormat?: string;
+    format?: HysDateDisplayFormat | readonly HysDateDisplayFormat[];
+    inputFormats?: readonly string[];
+    disabled?: boolean | readonly [boolean, boolean];
+    readonly?: boolean;
+    size?: "sm" | "md" | "lg";
+    status?: "error" | "warning" | "success";
+    bordered?: boolean;
+    placeholder?: string | readonly [string, string];
+    id?: string | readonly [string, 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;
+    disabledHours?: (range: "start" | "end", from: Date | null) => readonly number[];
+    disabledMinutes?: (hour: number, range: "start" | "end", from: Date | null) => readonly number[];
+    disabledSeconds?: (hour: number, minute: number, range: "start" | "end", from: Date | null) => readonly number[];
+    firstDayOfWeek?: number;
+    firstWeekContainsDate?: number;
+    weekNumberFormatter?: (week: HysDatePickerWeek) => string;
+    disabledWeek?: (week: HysDatePickerWeek) => boolean;
+    weekValidation?: "any" | "full";
+    locale?: string;
+    messages?: Partial<HysDatePickerLocale>;
+    showWeekNumbers?: boolean;
+    showWeekNumber?: boolean;
+    showAdjacentDays?: boolean;
+    defaultPickerValue?: HysDateScalar | HysDatePanelValues;
+    panelValue?: HysDateScalar;
+    panelValues?: HysDatePanelValues;
+    mode?: HysDatePickerView;
+    defaultMode?: HysDatePickerView;
+    shortcuts?: readonly HysDateShortcut[];
+    presets?: readonly HysDateShortcut[];
+    ranges?: Readonly<Record<string, HysDateShortcut["value"]>>;
+    shortcutPlacement?: "top" | "start";
+    clearable?: boolean;
+    allowClear?: boolean;
+    editable?: boolean;
+    inputReadonly?: boolean;
+    showOnFocus?: boolean;
+    automaticDropdown?: boolean;
+    showToday?: boolean;
+    showNow?: boolean;
+    showFooter?: boolean;
+    showConfirm?: boolean;
+    showTime?: boolean | HysDateTimeOptions;
+    defaultTime?: HysDateDefaultTime | readonly [HysDateDefaultTime, HysDateDefaultTime];
+    dateFormat?: string;
+    timeFormat?: string;
+    use12Hours?: boolean;
+    hideDisabledOptions?: boolean;
+    arrowControl?: boolean;
+    hourStep?: number;
+    minuteStep?: number;
+    secondStep?: number;
+    showSeconds?: boolean;
+    rangeSeparator?: string;
+    separator?: 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 | "topLeft" | "topRight" | "bottomLeft" | "bottomRight";
+    appendTo?: string | HTMLElement | false;
+    teleported?: boolean;
+    getPopupContainer?: (trigger: HTMLElement) => HTMLElement;
+    fallbackPlacements?: readonly Placement[];
+    popperOptions?: HysDatePopupOptions;
+    popupWidth?: number | string;
+    popupClass?: string;
+    popupClassName?: string;
+    popperClass?: string;
+    popupStyle?: CSSProperties;
+    popperStyle?: CSSProperties | string;
+    prefixIcon?: Component | string;
+    clearIcon?: Component | string;
+    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;
+    "extra-footer"?: (context: {
+        dates: readonly (Date | null)[];
+        view: HysDatePickerView;
+    }) => any;
+    "date-render"?: (cell: HysDatePickerCell) => any;
+    "month-cell-render"?: (cell: HysDatePickerCell) => 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>;

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

@@ -5,7 +5,7 @@ export declare function positionFloating(anchor: DOMRect, size: {
 }, viewport: {
     width: number;
     height: number;
-}, placement: Placement, gap: number, padding: number, flip: boolean): {
+}, placement: Placement, gap: number, padding: number, flip: boolean, fallbackPlacements?: readonly Placement[]): {
     width: number;
     height: number;
     x: number;

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

@@ -38,9 +38,7 @@ export declare function useColorPicker(props: HysColorPickerProps, emit: (name:
     status: import("vue").ComputedRef<import("./formContext").HysFormStatus | undefined>;
     floating: {
         open: import("vue").Ref<boolean, boolean>;
-        style: import("vue").ComputedRef<{
-            zIndex: string;
-        }>;
+        style: import("vue").ComputedRef<Record<string, string>>;
         placement: import("vue").Ref<import("./useFloating").Placement, import("./useFloating").Placement>;
         update: () => void;
         show: (force?: boolean) => Promise<void>;

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

@@ -38,9 +38,7 @@ export declare function useContextMenu<N extends object>(props: HysContextMenuPr
     childStyles: import("vue").ShallowRef<Record<number, CSSProperties>, Record<number, CSSProperties>>;
     floating: {
         open: Ref<boolean, boolean>;
-        style: import("vue").ComputedRef<{
-            zIndex: string;
-        }>;
+        style: import("vue").ComputedRef<Record<string, string>>;
         placement: Ref<import("./useFloating").Placement, import("./useFloating").Placement>;
         update: () => void;
         show: (force?: boolean) => Promise<void>;

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

@@ -1,5 +1,5 @@
 import { type ComputedRef } from "vue";
-import { type HysDatePoint, type HysDatePickerProps, type HysDatePickerValue, type HysDatePickerView, type HysDatePickerChange } from "./datePicker";
+import { type HysDatePoint, type HysDatePickerProps, type HysDatePickerValue, type HysDatePickerChange } from "./datePicker";
 export declare function useDatePicker(props: HysDatePickerProps, range: ComputedRef<boolean>, blocked: ComputedRef<boolean>, emit: (name: string, ...args: any[]) => void, validate: () => void): {
     current: ComputedRef<HysDatePickerValue>;
     selected: ComputedRef<(HysDatePoint | null)[]>;
@@ -7,16 +7,16 @@ export declare function useDatePicker(props: HysDatePickerProps, range: Computed
     stage: import("vue").Ref<"end" | "start", "end" | "start">;
     preview: import("vue").Ref<number | undefined, number | undefined>;
     error: import("vue").Ref<string, string>;
-    view: ComputedRef<HysDatePickerView>;
-    rightView: import("vue").Ref<HysDatePickerView, HysDatePickerView>;
+    view: ComputedRef<import("./datePickerTypes").HysDatePickerView>;
+    rightView: import("vue").Ref<import("./datePickerTypes").HysDatePickerView, import("./datePickerTypes").HysDatePickerView>;
     panels: ComputedRef<number[]>;
     first: ComputedRef<number>;
     weekContains: ComputedRef<number>;
     time: ComputedRef<boolean>;
-    unit: ComputedRef<import("./datePicker").HysDatePickerUnit>;
+    unit: ComputedRef<import("./datePickerTypes").HysDatePickerUnit>;
     multiple: ComputedRef<boolean>;
     pattern: ComputedRef<string>;
-    displayPattern: ComputedRef<string>;
+    displayPattern: ComputedRef<import("./datePickerTypes").HysDateDisplayFormat>;
     words: ComputedRef<{
         today: string;
         now: string;
@@ -44,7 +44,7 @@ export declare function useDatePicker(props: HysDatePickerProps, range: Computed
         limit: string;
     }>;
     needsConfirm: ComputedRef<boolean>;
-    today: ComputedRef<HysDatePoint>;
+    today: import("vue").ShallowRef<HysDatePoint, HysDatePoint>;
     model: {
         current: ComputedRef<HysDatePickerValue>;
         commit: (value: HysDatePickerValue, update: (value: HysDatePickerValue) => void, change: (value: HysDatePickerValue) => void, notifyOnRequest?: boolean) => Promise<boolean>;
@@ -56,24 +56,33 @@ export declare function useDatePicker(props: HysDatePickerProps, range: Computed
     parse: (value: unknown) => HysDatePoint | undefined;
     boundary: (value: unknown) => HysDatePoint | undefined;
     points: (value?: HysDatePickerValue | undefined) => (HysDatePoint | null)[];
-    available: (day: number, endpoint?: number, rangeLimit?: boolean) => boolean;
-    periodAvailable: (start: number, end: number, endpoint?: number, rangeLimit?: boolean) => boolean;
-    validTime: (point: HysDatePoint, endpoint: number) => boolean;
+    available: (day: number, endpoint?: number, rangeLimit?: boolean, from?: HysDatePoint | null) => boolean;
+    periodAvailable: (start: number, end: number, endpoint?: number, rangeLimit?: boolean, fromPoint?: HysDatePoint | null) => boolean;
+    validTime: (point: HysDatePoint, endpoint: number, from?: HysDatePoint | null) => boolean;
     valid: (list: readonly (HysDatePoint | null)[], enforceLocks?: boolean) => boolean;
-    timeDisabled: (point: HysDatePoint, endpoint: number) => import("./datePicker").HysDateDisabledTime;
+    timeDisabled: (point: HysDatePoint, endpoint: number, from?: HysDatePoint | null) => {
+        hours: number[];
+        minutes: (hour: number) => number[];
+        seconds: (hour: number, minute: number) => number[];
+    };
     encode: (list: readonly (HysDatePoint | null)[]) => HysDatePickerValue;
     describe: (list?: (HysDatePoint | null)[]) => string[];
     empty: () => HysDatePickerValue;
     request: (value: HysDatePickerValue, source: HysDatePickerChange["source"], allowClear?: boolean) => Promise<boolean>;
     begin: () => void;
     setPanel: (day: number, index?: number) => boolean;
-    setMode: (mode: HysDatePickerView, index?: number) => boolean;
+    setMode: (mode: import("./datePickerTypes").HysDatePickerView, index?: number) => boolean;
     choose: (day: number) => Promise<boolean>;
     clear: () => Promise<boolean>;
     confirm: () => Promise<boolean>;
     setValue: (value: HysDatePickerValue) => Promise<boolean>;
     setTime: (index: number, second: number) => boolean;
+    editDraft: (index: number, text: string, format: string, part: "date" | "time") => boolean;
+    emitDraft: (endpoint: number) => void;
     input: (value: string, index?: number) => Promise<boolean>;
     pickShortcut: (index: number) => boolean;
+    shortcuts: ComputedRef<import("./datePickerTypes").HysDateShortcut[]>;
+    context: (day: number, endpoint: number, from?: HysDatePoint | null) => import("./datePickerTypes").HysDatePickerContext;
+    defaultSecond: (index: number) => number;
     locked: (endpoint: number) => boolean;
 };

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

@@ -26,14 +26,13 @@ export declare function useFloating(anchor: Readonly<Ref<FloatingAnchor | undefi
     closeOnEscape?: boolean;
     closeOnOutside?: boolean;
     autoAdjustOverflow?: boolean;
+    fallbackPlacements?: readonly Placement[];
     strategy?: "fixed" | "absolute";
     zIndex?: () => number | undefined;
     onPosition?: (position: FloatingPosition) => void;
 }): {
     open: Ref<boolean, boolean>;
-    style: import("vue").ComputedRef<{
-        zIndex: string;
-    }>;
+    style: import("vue").ComputedRef<Record<string, string>>;
     placement: Ref<Placement, Placement>;
     update: () => void;
     show: (force?: boolean) => Promise<void>;

package/dist/types/index.d.ts

@@ -157,7 +157,7 @@ export type { HysTransferKey, HysTransferSide, HysTransferOption, HysTransferFie
 export type { TreeNode, HysTreeKey, HysTreeValue, HysTreeNode, HysTreeFieldNames, HysTreeLoadContext, HysTreeLocale, HysTreeRecord, HysTreeCheckInfo, HysTreeSelectInfo, HysTreeDropPosition, HysTreeDropInfo, HysTreeNodeContext, HysTreeProps, HysTreeInstance } from './composables/tree';
 export type { HysTreeSelectNode, HysTreeSelectDataNode, HysTreeSelectLabelValue, HysTreeSelectValue, HysTreeSelectFieldNames, HysTreeSelectSimpleMode, HysTreeSelectStrategy, HysTreeSelectItem, HysTreeSelectChange, HysTreeSelectProps, HysTreeSelectInstance } from './composables/treeSelect';
 export type { HysCascaderKey, HysCascaderPath, HysCascaderValue, HysCascaderDataNode, HysCascaderNode, HysCascaderFieldNames, HysCascaderItem, HysCascaderOptionContext, HysCascaderLoadContext, HysCascaderChange, HysCascaderLocale, HysCascaderProps, HysCascaderInstance } from './composables/cascader';
-export type { HysDatePickerWeek, HysDateScalar, HysDatePickerValue, HysDateRangeValue, HysDatePickerType, HysDatePickerUnit, HysDatePickerView, HysDatePoint, HysDatePickerContext, HysDateDisabledTime, HysDateShortcut, HysDatePickerCell, HysDatePickerChange, HysDatePickerLocale, HysDatePickerProps, HysDateRangePickerProps, HysDatePickerInstance, HysDateRangePickerInstance, HysDatePickerSlots } from './composables/datePicker';
+export type { HysDatePickerWeek, HysDateScalar, HysDatePickerValue, HysDateRangeValue, HysDatePickerType, HysDatePickerUnit, HysDatePickerView, HysDateDisplayFormat, HysDatePanelValues, HysDateDefaultTime, HysDateTimeOptions, HysDatePopupOptions, HysDatePoint, HysDatePickerContext, HysDateDisabledTime, HysDateShortcut, HysDatePickerCell, HysDatePickerChange, HysDateCalendarChange, HysDatePickerLocale, HysDatePickerProps, HysDateRangePickerProps, HysDatePickerInstance, HysDateRangePickerInstance, HysDatePickerSlots } from './composables/datePicker';
 export type { HysModalDragEffect, HysModalSectionSize, HysModalSizeName, HysModalBeforeClose, HysModalCloseReason, HysModalType, HysModalInitialFocus, HysModalActionContext, HysModalPosition, HysModalSize, HysModalProps, HysModalSlotContext, HysModalSlots, HysModalInstance } from './composables/modal';
 export { useHysModal, createHysModal } from './composables/useHysModal';
 export type { HysModalResult, HysModalOptions, HysModalHandle, HysModalConfig, HysModalApi, HysModalService, HysModalServiceConfig } from './composables/useHysModal';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hys-ui",
-  "version": "0.7.0",
+  "version": "0.8.0",
   "description": "Themeable Vue 3 components with TypeScript and interactive documentation",
   "type": "module",
   "license": "MIT",