@omnitend/dashboard-for-laravel 0.40.0 → 0.41.0

package/dist/components/extended/DXTablePagination.vue.d.ts

@@ -0,0 +1,50 @@
+import type { PaginationData } from "./DXTable.vue";
+interface Props {
+    /** The active pagination metadata (client-side / inertia / provider). */
+    pagination: PaginationData;
+    /** The effective page size, shown in the selector. */
+    perPage: number;
+    /** Page sizes offered by the selector. */
+    perPageOptions: number[];
+    /** Whether to render the pager (still hidden when there is only one page). */
+    showPagination: boolean;
+    /** Whether to render the per-page selector. */
+    showPerPageSelector: boolean;
+    /** Whether to render the item-count caption (the "X out of Z items" line). */
+    showCount: boolean;
+    /** Singular item noun for the info line (e.g. "product"). */
+    singularItemName: string;
+    /** Plural item noun for the info line (e.g. "products"). */
+    pluralItemName: string;
+    /** Whether a column filter is active — gates the "Filtered from N" note. */
+    hasActiveFilters: boolean;
+    /**
+     * Upper bound (px) on the pager ROW width at which the number window may
+     * collapse to the compact "current / last" status (#162). At or above it
+     * the full windowed pager always renders, whatever the page count.
+     *
+     * Default **576** — Bootstrap's `sm` breakpoint, i.e. the width the rest of
+     * the design system already treats as phone-sized. Its job is to GUARANTEE
+     * that a desktop-width table is never quietly downgraded: a 45-page window
+     * that doesn't quite fit at 800px should wrap (today's behaviour), not lose
+     * its numbers.
+     *
+     * Below it, compact engages only when the full pager genuinely would not
+     * fit on one line (see `fullPagerWidth`) — so a three-page pager still
+     * shows `1 2 3` on a phone, where "2 / 3" would be strictly worse.
+     *
+     * Measured on the ROW, not the viewport, so a table squeezed by a sidebar
+     * or inside a modal collapses even though the window is wide.
+     */
+    compactThreshold?: number;
+}
+declare const _default: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "page-change": (page: number) => any;
+    "per-page-change": (value: string | number | (string | number)[] | null) => any;
+}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
+    "onPage-change"?: ((page: number) => any) | undefined;
+    "onPer-page-change"?: ((value: string | number | (string | number)[] | null) => any) | undefined;
+}>, {
+    compactThreshold: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/components/extended/DXTableShell.vue.d.ts

@@ -0,0 +1,24 @@
+interface Props {
+    /** Wrap the content in a `DCard`. When false, render plain/borderless. */
+    card?: boolean;
+}
+declare var __VLS_5: {}, __VLS_7: {}, __VLS_9: {}, __VLS_11: {};
+type __VLS_Slots = {} & {
+    header?: (props: typeof __VLS_5) => any;
+} & {
+    default?: (props: typeof __VLS_7) => any;
+} & {
+    header?: (props: typeof __VLS_9) => any;
+} & {
+    default?: (props: typeof __VLS_11) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {
+    card: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/extended/DXUserAvatar.vue.d.ts

@@ -0,0 +1,40 @@
+import type { ColorVariant } from "bootstrap-vue-next";
+type __VLS_Props = {
+    /** The user whose initial is shown. The first letter of `name` is used. */
+    user?: {
+        name: string;
+        [key: string]: any;
+    } | null;
+    /** Overrides the initial derived from `user.name` (e.g. two-letter initials). */
+    initial?: string;
+    /** Show a notification dot on the avatar (e.g. unread updates). */
+    badge?: boolean;
+    /** Colour of the notification dot. */
+    badgeVariant?: ColorVariant;
+    /**
+     * Accessible text for the notification dot, announced to screen readers
+     * (the dot itself is a colour-only signal). Ignored unless `badge` is set.
+     */
+    badgeLabel?: string;
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    initial: string;
+    user: {
+        name: string;
+        [key: string]: any;
+    } | null;
+    badge: boolean;
+    badgeVariant: ColorVariant;
+    badgeLabel: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/extended/dxFieldContext.d.ts

@@ -0,0 +1,11 @@
+import type { ComputedRef, InjectionKey } from "vue";
+/**
+ * Lets `DXField` forward its `info-popover` slot to the `DXFieldLabel` it
+ * renders — at any of its several label sites — without repeating the forward
+ * at each one. The provided value is a render function for the popover body, or
+ * `null` when the field has no `info-popover` slot.
+ *
+ * Optional: a `DXFieldLabel` used standalone (no `DXField` ancestor) injects the
+ * default `null` and falls back to its own `popover` slot / `info` text.
+ */
+export declare const dxFieldInfoPopoverKey: InjectionKey<ComputedRef<(() => unknown) | null>>;

package/dist/composables/defineForm.d.ts

@@ -0,0 +1,41 @@
+import { type UseFormReturn } from "./useForm";
+import type { FieldDefinition } from "../types";
+/**
+ * Extended field definition that includes default value
+ */
+export interface FormFieldDefinition<TValue = any> extends FieldDefinition {
+    /**
+     * Default/initial value for the field. Optional: when omitted, the field
+     * seeds from its type (`false` for checkbox/switch, `[]` for
+     * checkbox-group/switch-list/repeater, `0` for numerics, `""` otherwise) —
+     * previously the type required this even though the runtime had a
+     * fallback, so typed consumers could never use it.
+     */
+    default?: TValue;
+}
+/**
+ * Infer data type from field definitions
+ */
+type InferFormData<TFields extends readonly FormFieldDefinition[]> = {
+    [K in TFields[number] as K["key"]]: K["default"];
+};
+/**
+ * Return type for defineForm
+ */
+export interface DefineFormReturn<TData extends Record<string, any>> {
+    form: UseFormReturn<TData>;
+    fields: FieldDefinition[];
+}
+/**
+ * Define a form with type-safe field definitions.
+ * Reduces duplication by inferring initial values from field definitions.
+ *
+ * @example
+ * const { form, fields } = defineForm([
+ *   { key: "email", type: "email", label: "Email", default: "", required: true },
+ *   { key: "password", type: "password", label: "Password", default: "", required: true },
+ *   { key: "remember", type: "checkbox", label: "Remember me", default: false },
+ * ] as const);
+ */
+export declare function defineForm<const TFields extends readonly FormFieldDefinition[]>(fieldDefinitions: TFields): DefineFormReturn<InferFormData<TFields>>;
+export {};

package/dist/composables/useAsyncOptions.d.ts

@@ -0,0 +1,20 @@
+import { type ComputedRef, type Ref } from "vue";
+import type { FieldDefinition, FieldOption } from "../types";
+/**
+ * Async option loading for a `DXField`: runs `field.optionsLoader` on mount and
+ * (when `field.reloadOptionsOnChange` is set) whenever the model changes,
+ * exposing the loaded options. A monotonic request token guards against
+ * out-of-order responses clobbering newer ones; loader failures are swallowed
+ * so the last good options (or the static `field.options` fallback) stay put.
+ *
+ * Extracted verbatim from DXField's inline logic (#135) — behaviour unchanged.
+ * `getField` is an accessor (props aren't destructurable without losing
+ * reactivity); `effectiveModel` is the model passed to the loader.
+ */
+export interface UseAsyncOptionsReturn {
+    /** Options returned by the most recent successful load, or null if none yet. */
+    loadedOptions: Ref<FieldOption[] | null>;
+    /** Trigger a load (no-op when the field has no `optionsLoader`). */
+    loadOptions: () => Promise<void>;
+}
+export declare function useAsyncOptions(getField: () => FieldDefinition, effectiveModel: ComputedRef<any> | Ref<any>): UseAsyncOptionsReturn;

package/dist/composables/useContainerWidth.d.ts

@@ -0,0 +1,96 @@
+/**
+ * useContainerWidth — container-query-style responsiveness for Vue components.
+ *
+ * Bootstrap's breakpoints are **media** queries: they only ever see the WINDOW.
+ * A dashboard page is narrowed by the persistent sidebar (and a form inside a
+ * modal is narrower still), so a component can have very little room while the
+ * viewport is wide — and no media query ever fires. This composable closes that
+ * gap by observing an element's **own rendered width** with a `ResizeObserver`
+ * and exposing it reactively, so the template can pick a layout from the space
+ * it actually has.
+ *
+ * ```ts
+ * const { containerRef, width, isBelow, isNarrowerThan } = useContainerWidth({
+ *   threshold: 640,
+ * });
+ * // <div ref="containerRef"> … </div>
+ * ```
+ *
+ * One observer can drive several independent decisions — `isBelow` uses the
+ * configured `threshold`, and `isNarrowerThan(n)` answers for any other width:
+ *
+ * ```ts
+ * const stacked = computed(() => isNarrowerThan(576));
+ * const hideDetailColumn = computed(() => isNarrowerThan(900));
+ * ```
+ */
+import { type Ref } from "vue";
+/**
+ * What to observe: a template ref, or a getter (so the element can be resolved
+ * lazily / conditionally — e.g. `() => enabled ? el.value : null` to observe
+ * nothing at all).
+ */
+export type ContainerWidthTarget = Ref<HTMLElement | null | undefined> | (() => HTMLElement | null | undefined);
+export interface UseContainerWidthOptions {
+    /**
+     * Width (px) that `isBelow` compares against. Omit if you only need
+     * `width` / `isNarrowerThan`. Pass a getter (`() => props.threshold`) when
+     * it can change at runtime — `isBelow` re-evaluates when it does.
+     */
+    threshold?: number | (() => number | undefined);
+    /**
+     * Hysteresis band (px) applied to `isBelow` only, to stop a layout flipping
+     * back and forth at the boundary. Once `isBelow` is true it stays true
+     * until the width reaches `threshold + hysteresis`.
+     *
+     * Defaults to `0` so `isBelow` means exactly `width < threshold` unless you
+     * ask for otherwise. Opt in whenever the layout you drive from it can
+     * change the observed width — the classic loop is: narrow layout is taller
+     * → an ancestor with `overflow:auto` gains a vertical scrollbar → the
+     * container loses ~15-17px → it crosses back over the threshold → repeat.
+     * A band wider than a scrollbar (24px is comfortable) breaks that cycle.
+     * (`isNarrowerThan` is deliberately raw — it holds no per-width state.)
+     */
+    hysteresis?: number;
+    /**
+     * Width assumed before the first measurement, and permanently where there
+     * is no `ResizeObserver` (SSR, or a very old browser).
+     *
+     * Defaults to `0` — i.e. "assume the narrowest until proven otherwise", so
+     * an unmeasured render picks the STACKED layout. That is the mobile-first
+     * choice and the safe one: a stacked layout is legible at every width,
+     * whereas a wide layout guessed wrongly truncates content. It also means
+     * the server-rendered markup matches the first client render.
+     */
+    initialWidth?: number;
+    /**
+     * Which box to report. `content-box` (default) is the space actually
+     * available to children — what a layout decision usually wants.
+     * `border-box` matches `getBoundingClientRect().width`.
+     */
+    box?: "content-box" | "border-box";
+    /**
+     * Extra debounce (ms) before publishing a new width. Defaults to `0`:
+     * `ResizeObserver` already batches to one delivery per frame, and the
+     * callback reads the size the observer *hands* it (no forced layout), so
+     * there is nothing to thrash. Set it only for genuinely expensive
+     * downstream work — a timer adds a frame of visible lag.
+     */
+    debounce?: number;
+}
+export interface UseContainerWidthReturn {
+    /** Bind to the element you want measured (`<div ref="containerRef">`). */
+    containerRef: Ref<HTMLElement | null>;
+    /** The observed width in px. `initialWidth` until first measured. */
+    width: Readonly<Ref<number>>;
+    /** False until a real measurement has landed (always false without a `ResizeObserver`). */
+    hasMeasured: Readonly<Ref<boolean>>;
+    /** `width < threshold`, with `hysteresis` applied. False when no `threshold` was given. */
+    isBelow: Readonly<Ref<boolean>>;
+    /** Raw `width < px`, for driving other decisions off the same observer. */
+    isNarrowerThan: (px: number) => boolean;
+    /** Disconnect early. Called automatically when the owning scope is disposed. */
+    stop: () => void;
+}
+export declare function useContainerWidth(options?: UseContainerWidthOptions): UseContainerWidthReturn;
+export declare function useContainerWidth(target: ContainerWidthTarget, options?: UseContainerWidthOptions): UseContainerWidthReturn;

package/dist/composables/useForm.d.ts

@@ -0,0 +1,46 @@
+import { type ComputedRef, type WritableComputedRef } from "vue";
+import { type ApiError } from "../utils/api";
+export interface ValidationErrors {
+    [key: string]: string[];
+}
+export type FormError = ApiError;
+export interface FormSubmitOptions<TPayload = unknown, TResponse = unknown> {
+    onSuccess?: (data: TResponse) => void;
+    onError?: (error: FormError) => void;
+    onBefore?: (payload: TPayload) => void;
+    onFinish?: () => void;
+    transform?: (payload: TPayload) => unknown;
+    preserveErrors?: boolean;
+    resetOnSuccess?: boolean;
+    signal?: AbortSignal;
+}
+export interface FormState<TData extends Record<string, any>> {
+    data: TData;
+    errors: ValidationErrors;
+    processing: boolean;
+    message: string;
+    touched: Record<string, boolean>;
+    recentlySuccessful: boolean;
+    shouldShowMessage: boolean;
+}
+export interface UseFormReturn<TData extends Record<string, any>> extends FormState<TData> {
+    hasErrors: ComputedRef<boolean>;
+    hasError: (field: keyof TData | string) => boolean;
+    getError: (field: keyof TData | string) => string;
+    getState: (field: keyof TData | string) => true | false | null;
+    setErrors: (errors?: ValidationErrors) => void;
+    setMessage: (message: string) => void;
+    clearErrors: () => void;
+    clearError: (field: keyof TData | string) => void;
+    reset: (only?: Array<keyof TData>) => void;
+    field: <K extends keyof TData>(key: K) => WritableComputedRef<TData[K]>;
+    fields: {
+        [K in keyof TData]: WritableComputedRef<TData[K]>;
+    };
+    submit: <TResponse = unknown>(method: "get" | "post" | "put" | "patch" | "delete", url: string, options?: FormSubmitOptions<TData, TResponse>) => Promise<TResponse>;
+    post: <TResponse = unknown>(url: string, options?: FormSubmitOptions<TData, TResponse>) => Promise<TResponse>;
+    put: <TResponse = unknown>(url: string, options?: FormSubmitOptions<TData, TResponse>) => Promise<TResponse>;
+    patch: <TResponse = unknown>(url: string, options?: FormSubmitOptions<TData, TResponse>) => Promise<TResponse>;
+    delete: <TResponse = unknown>(url: string, options?: FormSubmitOptions<TData, TResponse>) => Promise<TResponse>;
+}
+export declare function useForm<TData extends Record<string, any>>(initialData?: TData): UseFormReturn<TData>;

package/dist/composables/useResourceEditor.d.ts

@@ -0,0 +1,77 @@
+import { type Ref } from "vue";
+import type { FieldDefinition } from "../types";
+/**
+ * The subset of `DXTable`'s props the resource editor reads. Declared
+ * structurally (not imported from DXTable.vue) so the composable stays a
+ * lower-level dependency — DXTable imports the composable, not the reverse.
+ * DXTable's full `Props` is structurally assignable to this.
+ */
+export interface ResourceEditorProps<T = any> {
+    /** Field definitions for the edit/create modal (enables edit-on-row-click). */
+    editFields?: FieldDefinition[];
+    /** Tab definitions — only their `key` is read here (DXForm consumes the rest). */
+    editTabs?: Array<{
+        key: string;
+    }>;
+    /** Modal title, or a function of the edited row. */
+    editModalTitle?: string | ((item: any) => string);
+    /** `PUT` endpoint pattern for updates, e.g. `/api/products/:id`. */
+    editUrl?: string;
+    /** `GET` endpoint pattern to fetch the full record on open, e.g. `/api/products/:id`. */
+    showUrl?: string;
+    /** `DELETE` endpoint pattern, e.g. `/api/products/:id`. */
+    deleteUrl?: string;
+    /** `POST` endpoint for creating new items, e.g. `/api/products`. */
+    createUrl?: string;
+    /** Guard run before delete — a message short-circuits with a toast. Awaited. */
+    deleteGuard?: (item: T) => string | null | undefined | Promise<string | null | undefined>;
+    /** Guard run before save — a message aborts with a toast. Awaited. */
+    saveGuard?: (item: T | null, data: Record<string, any>) => string | null | undefined | Promise<string | null | undefined>;
+}
+/**
+ * The events the editor emits back through DXTable's `emit`. Declared as the
+ * exact call signatures it uses (a subset of DXTable's emits) so DXTable's typed
+ * `emit` is structurally assignable here.
+ */
+export interface ResourceEditorEmit<T = any> {
+    (event: 'rowCreated', item: any, response: any): void;
+    (event: 'createError', error: any): void;
+    (event: 'rowUpdated', item: T, response: any): void;
+    (event: 'editError', item: T, error: any): void;
+    (event: 'rowDeleted', item: T, response: any): void;
+    (event: 'deleteError', item: T, error: any): void;
+}
+export interface UseResourceEditorOptions {
+    /** Invalidate whichever data source is active, after a successful CRUD op. */
+    refresh: () => void;
+    /** Singular item noun (e.g. "product") — for toasts and the modal title. */
+    singularItemName: Ref<string>;
+}
+/**
+ * The resource editor for `DXTable` — the create/edit/delete concern lifted out
+ * of the god-component (#129). Owns the edit-modal state, form seeding and
+ * visibility rules, the `showUrl` full-record fetch, submission (create `POST` /
+ * edit `PUT` / delete), the success/error toasts, and the edit-modal slot-key
+ * computeds. It never touches the table's data source, sort, filter, per-page
+ * or pagination state — the only coupling back to the table is the `refresh`
+ * callback it calls after a successful op.
+ *
+ * DXTable keeps `handleRowClick` (which emits `rowClicked` regardless) and calls
+ * `openEdit` from it; `openEdit` is a no-op unless `editFields` are set.
+ */
+export declare function useResourceEditor<T = any>(props: ResourceEditorProps<T>, emit: ResourceEditorEmit<T>, options: UseResourceEditorOptions): {
+    showEditModal: Ref<boolean, boolean>;
+    editForm: Ref<any, any>;
+    editFormInstanceKey: Ref<number, number>;
+    activeTabIndex: Ref<number, number>;
+    selectedItem: [T | null] extends [Ref<any, any>] ? import("@vue/shared").IfAny<Ref<any, any> & T, Ref<Ref<any, any> & T, Ref<any, any> & T>, Ref<any, any> & T> : Ref<import("vue").UnwrapRef<T> | null, T | import("vue").UnwrapRef<T> | null>;
+    isCreateMode: Ref<boolean, boolean>;
+    pendingAction: Ref<"delete" | "save" | null, "delete" | "save" | null>;
+    editLoading: Ref<boolean, boolean>;
+    computedModalTitle: import("vue").ComputedRef<string>;
+    openEdit: (item: T) => void;
+    openCreate: () => void;
+    save: () => Promise<void>;
+    cancel: () => void;
+    remove: () => Promise<void>;
+};

package/dist/composables/useToast.d.ts

@@ -0,0 +1,2 @@
+import { useToast as useBvnToast } from "bootstrap-vue-next";
+export declare function useToast(): ReturnType<typeof useBvnToast>;