@blueprint-ts/core 4.1.0-beta.1 → 4.1.0-beta.3

package/dist/support/DeferredPromise.js

@@ -0,0 +1,55 @@
+var _a;
+/**
+ * A new instance of deferred is constructed by calling `new DeferredPromse<T>()`.
+ * The purpose of the deferred object is to expose the associated Promise
+ * instance APIs that can be used for signaling the successful
+ * or unsuccessful completion, as well as the state of the task.
+ * @export
+ * @class DeferredPromise
+ * @implements {Promise<T>}
+ * @template T
+ * @example
+ * const deferred = new DeferredPromse<string>();
+ * console.log(deferred.state); // 'pending'
+ *
+ * deferred
+ * .then(str => console.log(str))
+ * .catch(err => console.error(err));
+ *
+ * deferred.resolve('Foo');
+ * console.log(deferred.state); // 'fulfilled'
+ * // deferred.reject('Bar');
+ *
+ * https://gist.github.com/GFoley83/5877f6c09fbcfd62569c51dc91444cf0
+ */
+export class DeferredPromise {
+    get state() {
+        return this._state;
+    }
+    constructor() {
+        this[_a] = 'Promise';
+        this._state = 'pending';
+        this._promise = new Promise((resolve, reject) => {
+            this._resolve = resolve;
+            this._reject = reject;
+        });
+    }
+    then(onfulfilled, onrejected) {
+        return this._promise.then(onfulfilled, onrejected);
+    }
+    catch(onrejected) {
+        return this._promise.catch(onrejected);
+    }
+    finally(onfinally) {
+        return this._promise.finally(onfinally);
+    }
+    resolve(value) {
+        this._resolve(value);
+        this._state = 'fulfilled';
+    }
+    reject(reason) {
+        this._reject(reason);
+        this._state = 'rejected';
+    }
+}
+_a = Symbol.toStringTag;

package/dist/support/helpers.d.ts

@@ -0,0 +1,5 @@
+export declare const getCookie: (cname: string) => string;
+export declare const isObject: (item: unknown) => boolean;
+export declare const mergeDeep: (target: object, ...sources: object[]) => object;
+export declare const getDisplayablePages: (totalPages: number, pageNumber: number, displayPages?: number) => number[];
+export declare const isAtBottom: (scrollHeight: number, scrollTop: number, clientHeight: number) => boolean;

package/dist/support/helpers.js

@@ -0,0 +1,69 @@
+export const getCookie = (cname) => {
+    const name = cname + '=';
+    const decodedCookie = decodeURIComponent(document.cookie);
+    const ca = decodedCookie.split(';');
+    for (let i = 0; i < ca.length; i++) {
+        let c = ca[i];
+        if (c === undefined) {
+            return '';
+        }
+        while (c.charAt(0) == ' ') {
+            c = c.substring(1);
+        }
+        if (c.indexOf(name) == 0) {
+            return c.substring(name.length, c.length);
+        }
+    }
+    return '';
+};
+export const isObject = (item) => {
+    if (!item) {
+        return false;
+    }
+    if (Array.isArray(item)) {
+        return false;
+    }
+    return typeof item === 'object';
+};
+export const mergeDeep = (target, ...sources) => {
+    if (!sources.length)
+        return target;
+    const source = sources.shift();
+    if (isObject(target) && isObject(source)) {
+        for (const key in source) {
+            // @ts-expect-error unknown structure
+            if (isObject(source[key])) {
+                // @ts-expect-error unknown structure
+                if (!target[key])
+                    Object.assign(target, { [key]: {} });
+                // @ts-expect-error unknown structure
+                mergeDeep(target[key], source[key]);
+            }
+            else {
+                // @ts-expect-error unknown structure
+                Object.assign(target, { [key]: source[key] });
+            }
+        }
+    }
+    return mergeDeep(target, ...sources);
+};
+export const getDisplayablePages = (totalPages, pageNumber, displayPages = 4) => {
+    if (totalPages < displayPages) {
+        displayPages = totalPages;
+    }
+    let offset = 0;
+    const middlePage = Math.ceil(displayPages / 2);
+    if (pageNumber <= middlePage) {
+        offset = 0;
+    }
+    else if (pageNumber > totalPages - middlePage) {
+        offset = totalPages - displayPages;
+    }
+    else {
+        offset = pageNumber - middlePage;
+    }
+    return [...Array(displayPages).keys()].map((i) => i + 1 + offset);
+};
+export const isAtBottom = (scrollHeight, scrollTop, clientHeight) => {
+    return Math.abs(scrollHeight - scrollTop - clientHeight) <= 3.0;
+};

package/{src/support/index.ts → dist/support/index.d.ts}

@@ -1,4 +1,3 @@
-import { DeferredPromise } from './DeferredPromise'
-import { getCookie, getDisplayablePages, isAtBottom, isObject, mergeDeep } from './helpers'
-
-export { DeferredPromise, getCookie, getDisplayablePages, isAtBottom, isObject, mergeDeep }
+import { DeferredPromise } from './DeferredPromise';
+import { getCookie, getDisplayablePages, isAtBottom, isObject, mergeDeep } from './helpers';
+export { DeferredPromise, getCookie, getDisplayablePages, isAtBottom, isObject, mergeDeep };

package/dist/support/index.js

@@ -0,0 +1,3 @@
+import { DeferredPromise } from './DeferredPromise';
+import { getCookie, getDisplayablePages, isAtBottom, isObject, mergeDeep } from './helpers';
+export { DeferredPromise, getCookie, getDisplayablePages, isAtBottom, isObject, mergeDeep };

package/dist/vue/composables/useConfirmDialog.d.ts

@@ -0,0 +1,20 @@
+import { type Component } from 'vue';
+export declare enum ConfirmDialogSeverity {
+    INFO = "info",
+    WARNING = "warning",
+    DANGER = "danger"
+}
+export interface ConfirmDialogOptions {
+    getMessage(): string;
+    getSeverity(): ConfirmDialogSeverity;
+    getTitle(): string;
+    getOkText(): string;
+    getCancelText(): string;
+}
+/**
+ * The provided component needs to expose an "open" method, which
+ * should return a promise resolving into true or false.
+ */
+export default function (confirmDialogComponent: Component, querySelector?: string): {
+    openConfirmDialog: (options: ConfirmDialogOptions) => Promise<boolean>;
+};

package/dist/vue/composables/useConfirmDialog.js

@@ -0,0 +1,52 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { getCurrentInstance, h, onUnmounted, render } from 'vue';
+export var ConfirmDialogSeverity;
+(function (ConfirmDialogSeverity) {
+    ConfirmDialogSeverity["INFO"] = "info";
+    ConfirmDialogSeverity["WARNING"] = "warning";
+    ConfirmDialogSeverity["DANGER"] = "danger";
+})(ConfirmDialogSeverity || (ConfirmDialogSeverity = {}));
+/**
+ * The provided component needs to expose an "open" method, which
+ * should return a promise resolving into true or false.
+ */
+export default function (confirmDialogComponent, querySelector = 'body') {
+    const self = getCurrentInstance();
+    /**
+     * https://stackoverflow.com/a/78448128
+     */
+    function mountConfirmDialog(options) {
+        if (!(self === null || self === void 0 ? void 0 : self.appContext)) {
+            throw new Error('ConfirmationDialog: useConfirmDialog must be called inside a setup function');
+        }
+        const vNode = h(confirmDialogComponent, { options });
+        vNode.key = Symbol();
+        vNode.appContext = self.appContext;
+        render(vNode, document.querySelector(querySelector));
+        return vNode.component;
+    }
+    function unmountConfirmDialog() {
+        render(null, document.querySelector(querySelector));
+    }
+    onUnmounted(() => {
+        unmountConfirmDialog();
+    });
+    function openConfirmDialog(options) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const dialogComponent = mountConfirmDialog(options);
+            if ((dialogComponent === null || dialogComponent === void 0 ? void 0 : dialogComponent.exposed) == undefined || (dialogComponent === null || dialogComponent === void 0 ? void 0 : dialogComponent.exposed['open']) === undefined) {
+                throw new Error('ConfirmationDialog: Provided component does not expose an "open" method');
+            }
+            return dialogComponent === null || dialogComponent === void 0 ? void 0 : dialogComponent.exposed['open'];
+        });
+    }
+    return { openConfirmDialog };
+}

package/dist/vue/composables/useGlobalCheckbox.d.ts

@@ -0,0 +1,13 @@
+import { type Component, type Ref, type ComputedRef } from 'vue';
+interface UseGlobalCheckboxOptions<T> {
+    getAll: () => Promise<T[]>;
+    getPage: () => T[];
+    totalCount: () => number;
+}
+export default function <T>(dialog: Component, options: UseGlobalCheckboxOptions<T>, querySelector?: string): {
+    selectedRows: Ref<T[]>;
+    indeterminate: ComputedRef<boolean>;
+    checked: ComputedRef<boolean>;
+    handleGlobalCheckboxChange: (event: Event) => void;
+};
+export {};

package/dist/vue/composables/useGlobalCheckbox.js

@@ -0,0 +1,123 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { getCurrentInstance, shallowRef, computed, h, render, onUnmounted } from 'vue';
+export default function (dialog, options, querySelector = 'body') {
+    const self = getCurrentInstance();
+    const selectedRows = shallowRef([]);
+    function mountDialog() {
+        if (!(self === null || self === void 0 ? void 0 : self.appContext)) {
+            throw new Error('useGlobalCheckbox must be called inside a setup function');
+        }
+        const vNode = h(dialog, {
+            indeterminate: indeterminate.value,
+            checked: checked.value
+        });
+        vNode.key = Symbol();
+        vNode.appContext = self.appContext;
+        render(vNode, document.querySelector(querySelector));
+        return vNode.component;
+    }
+    function unmountConfirmDialog() {
+        render(null, document.querySelector(querySelector));
+    }
+    onUnmounted(() => {
+        unmountConfirmDialog();
+    });
+    const indeterminate = computed(() => {
+        const totalCount = options.totalCount();
+        return selectedRows.value.length > 0 && selectedRows.value.length < totalCount;
+    });
+    const checked = computed({
+        get: () => {
+            const totalCount = options.totalCount();
+            return selectedRows.value.length > 0 && selectedRows.value.length === totalCount;
+        },
+        set: (value) => {
+            if (!value) {
+                selectedRows.value = [];
+            }
+        }
+    });
+    // Check if all elements are already displayed on the current page
+    const isAllElementsOnCurrentPage = () => {
+        return options.getPage().length === options.totalCount();
+    };
+    function handleGlobalCheckboxChange(event) {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (!(event.target instanceof HTMLInputElement)) {
+                return;
+            }
+            const pageData = options.getPage();
+            // If all elements are on the current page, we can skip the dialog
+            // as both options would result in the same selection
+            const allElementsOnPage = isAllElementsOnCurrentPage();
+            // Case 1: Nothing is selected (unchecked state)
+            if (!checked.value && !indeterminate.value) {
+                if (allElementsOnPage) {
+                    // All elements are already on the current page, just select them
+                    selectedRows.value = [...pageData];
+                    return;
+                }
+                // We need preventDefault() here because we're showing a dialog
+                // and don't want the checkbox to be checked until the user makes a choice
+                event.preventDefault();
+                const mountedDialog = mountDialog();
+                if (!(mountedDialog === null || mountedDialog === void 0 ? void 0 : mountedDialog.exposed))
+                    return;
+                // When clicking the empty checkbox, ask if user wants current page or all entries
+                if (yield mountedDialog.exposed['open']) {
+                    // User clicked "All Elements" button
+                    selectedRows.value = yield options.getAll();
+                }
+                else {
+                    // User clicked "Current Page" button
+                    selectedRows.value = [...pageData];
+                }
+                return;
+            }
+            // Case 2: Indeterminate state (some items selected, not all)
+            if (indeterminate.value) {
+                if (allElementsOnPage) {
+                    // If all elements are on the page, just select them all
+                    selectedRows.value = [...pageData];
+                    return;
+                }
+                // We need preventDefault() here because we're showing a dialog
+                // and don't want the checkbox to be checked until the user makes a choice
+                event.preventDefault();
+                const mountedDialog = mountDialog();
+                if (!(mountedDialog === null || mountedDialog === void 0 ? void 0 : mountedDialog.exposed))
+                    return;
+                // When clicking the indeterminate checkbox, ask if the user wants all entries or unselect all
+                if (yield mountedDialog.exposed['open']) {
+                    // User clicked "All Elements" button
+                    selectedRows.value = yield options.getAll();
+                }
+                else {
+                    // User clicked "Discard" button
+                    selectedRows.value = [];
+                }
+                return;
+            }
+            // Case 3: Checked state (all items selected)
+            if (checked.value) {
+                // When all items are selected, we just clear the selection without a dialog
+                selectedRows.value = [];
+                return;
+            }
+        });
+    }
+    return {
+        selectedRows,
+        indeterminate,
+        checked,
+        handleGlobalCheckboxChange
+    };
+}

package/dist/vue/composables/useIsEmpty.d.ts

@@ -0,0 +1,4 @@
+export default function (): {
+    isEmpty: (value: unknown) => boolean;
+    isNotEmpty: (value: unknown) => boolean;
+};

package/dist/vue/composables/useIsEmpty.js

@@ -0,0 +1,27 @@
+import { isEmpty as _isEmpty } from 'lodash-es';
+export default function () {
+    function isObject(value) {
+        return typeof value === 'object' && !Array.isArray(value) && value !== null;
+    }
+    function isEmpty(value) {
+        // Check objects with lodash
+        if (isObject(value)) {
+            return _isEmpty(value);
+        }
+        // Check objects against their length property
+        if (Array.isArray(value)) {
+            return value.length === 0;
+        }
+        if (value === '' || value === null) {
+            return true;
+        }
+        return value === undefined;
+    }
+    function isNotEmpty(value) {
+        return !isEmpty(value);
+    }
+    return {
+        isEmpty,
+        isNotEmpty
+    };
+}

package/dist/vue/composables/useIsOpen.d.ts

@@ -0,0 +1,5 @@
+import { type Ref, type WritableComputedRef } from 'vue';
+export default function (callback?: (value: boolean) => void, delay?: number): {
+    isOpenKey: Ref<number>;
+    isOpen: WritableComputedRef<boolean>;
+};

package/dist/vue/composables/useIsOpen.js

@@ -0,0 +1,25 @@
+import { ref, computed } from 'vue';
+export default function (callback = () => { }, delay = 500) {
+    const internalIsOpen = ref(false);
+    const isOpenKey = ref(0);
+    const isOpen = computed({
+        get() {
+            return internalIsOpen.value;
+        },
+        set(value) {
+            // False means we close, so we increment the key
+            // Add delay to preserve the closing animation.
+            setTimeout(() => {
+                if (!value) {
+                    isOpenKey.value++;
+                }
+            }, delay);
+            internalIsOpen.value = value;
+            callback(value);
+        }
+    });
+    return {
+        isOpenKey,
+        isOpen
+    };
+}

package/dist/vue/composables/useIsOpenFromVar.d.ts

@@ -0,0 +1,6 @@
+import { type Ref, type ComputedRef } from 'vue';
+export default function <FromVarType>(defaultValue?: FromVarType | undefined, delay?: number): {
+    fromVar: ComputedRef<FromVarType | undefined>;
+    isOpenFromVar: ComputedRef<boolean>;
+    isOpenFromVarKey: Ref<number>;
+};

package/dist/vue/composables/useIsOpenFromVar.js

@@ -0,0 +1,45 @@
+import { ref, computed } from 'vue';
+import useIsEmpty from './useIsEmpty';
+export default function (defaultValue = undefined, delay = 500) {
+    const isOpenFromVarKey = ref(0);
+    const { isNotEmpty } = useIsEmpty();
+    const internalIsOpen = ref(false);
+    const internalFromVar = ref(defaultValue);
+    const isOpenFromVar = computed({
+        get() {
+            return internalIsOpen.value;
+        },
+        set(value) {
+            if (value) {
+                internalIsOpen.value = true;
+                internalFromVar.value = value;
+            }
+            else {
+                internalIsOpen.value = false;
+                setTimeout(() => {
+                    internalFromVar.value = defaultValue;
+                    isOpenFromVarKey.value++;
+                }, delay);
+            }
+        }
+    });
+    const fromVar = computed({
+        get() {
+            return internalFromVar.value;
+        },
+        set(value) {
+            if (isNotEmpty(value)) {
+                isOpenFromVar.value = true;
+                internalFromVar.value = value;
+            }
+            else {
+                isOpenFromVar.value = false;
+            }
+        }
+    });
+    return {
+        fromVar,
+        isOpenFromVar,
+        isOpenFromVarKey
+    };
+}

package/dist/vue/composables/useModelWrapper.d.ts

@@ -0,0 +1,9 @@
+import { type ModelValueProps } from '../contracts/ModelValueProps';
+import { type ModelValueOptions as ParentModelValueOptions } from '../contracts/ModelValueOptions';
+export interface ModelValueOptions<T> extends ParentModelValueOptions {
+    callback?: (value: T) => void;
+}
+/**
+ * @deprecated Use Vue 3.4+ `defineModel()` instead.
+ */
+export default function <T, EmitType>(props: ModelValueProps, emit: EmitType, options?: ModelValueOptions<T>): import("vue").WritableComputedRef<T, T>;

package/dist/vue/composables/useModelWrapper.js

@@ -0,0 +1,18 @@
+import { computed } from 'vue';
+/**
+ * @deprecated Use Vue 3.4+ `defineModel()` instead.
+ */
+export default function (props, emit, options = {}) {
+    const { name = 'modelValue', callback = () => { } } = options;
+    return computed({
+        get() {
+            /* @ts-expect-error Ignore type */
+            return props[name];
+        },
+        set(value) {
+            /* @ts-expect-error Ignore expression is not callable */
+            emit(`update:${name}`, value);
+            callback(value);
+        }
+    });
+}

package/dist/vue/composables/useOnOpen.d.ts

@@ -0,0 +1,7 @@
+import { type Ref } from 'vue';
+type Callback = () => void;
+export default function (ref: Ref<unknown>): {
+    onOpen: (callback: Callback) => void;
+    onClose: (callback: Callback) => void;
+};
+export {};

package/dist/vue/composables/useOnOpen.js

@@ -0,0 +1,25 @@
+import { nextTick, watch } from 'vue';
+export default function (ref) {
+    const openCallbacks = [];
+    const closeCallbacks = [];
+    watch(() => ref.value, (newValue, oldValue) => {
+        nextTick(() => {
+            if (newValue && !oldValue) {
+                openCallbacks.forEach((callback) => callback());
+            }
+            else if (!newValue && oldValue) {
+                closeCallbacks.forEach((callback) => callback());
+            }
+        });
+    });
+    function onOpen(callback) {
+        openCallbacks.push(callback);
+    }
+    function onClose(callback) {
+        closeCallbacks.push(callback);
+    }
+    return {
+        onOpen,
+        onClose
+    };
+}

package/{src/vue/contracts/ModelValueOptions.ts → dist/vue/contracts/ModelValueOptions.d.ts}

@@ -1,3 +1,3 @@
 export interface ModelValueOptions {
-  name?: string
+    name?: string;
 }

package/dist/vue/contracts/ModelValueOptions.js

@@ -0,0 +1 @@
+export {};

package/dist/vue/contracts/ModelValueProps.d.ts

@@ -0,0 +1,3 @@
+export interface ModelValueProps {
+    [key: string]: string | number | Array<unknown> | boolean | object;
+}

package/dist/vue/contracts/ModelValueProps.js

@@ -0,0 +1 @@
+export {};