@agnos-ui/core 0.0.1-alpha.3 → 0.0.1-alpha.5

package/select.js

@@ -1,240 +0,0 @@
-import { asReadable, batch, computed, writable } from '@amadeus-it-group/tansu';
-import { createHasFocus } from './services/focustrack';
-import { stateStores, writablesForProps } from './services/stores';
-function defaultMatchFn(item, text) {
-    return JSON.stringify(item).toLowerCase().includes(text.toLowerCase());
-}
-function defaultItemId(item) {
-    return '' + item;
-}
-const defaultConfig = {
-    opened: false,
-    disabled: false,
-    items: [],
-    filterText: '',
-    loading: false,
-    selected: [],
-    itemId: defaultItemId,
-    matchFn: defaultMatchFn,
-    onFilterTextChange: undefined,
-    className: '',
-};
-/**
- * Create a SelectWidget with given config props
- * @param config - an optional alert config
- * @returns a SelectWidget
- */
-export function createSelect(config) {
-    // Props
-    const [{ opened$: _dirtyOpened$, items$, itemId$, matchFn$, onFilterTextChange$, ...otherProps }, patch] = writablesForProps(defaultConfig, config);
-    const { selected$, filterText$ } = otherProps;
-    const { hasFocus$, directive: hasFocusDirective } = createHasFocus();
-    const opened$ = computed(() => {
-        const _dirtyOpened = _dirtyOpened$();
-        const hasFocus = hasFocus$();
-        if (!hasFocus && _dirtyOpened) {
-            _dirtyOpened$.set(false);
-        }
-        return _dirtyOpened && hasFocus;
-    });
-    const highlightedIndex$ = (function () {
-        const store = writable(0);
-        const newStore = asReadable(store, {
-            set(index) {
-                const { length } = visible$();
-                if (index != undefined) {
-                    if (!length) {
-                        index = undefined;
-                    }
-                    else if (index < 0) {
-                        index = length - 1;
-                    }
-                    else if (index >= length) {
-                        index = 0;
-                    }
-                }
-                store.set(index);
-            },
-            update(fn) {
-                newStore.set(fn(store()));
-            },
-        });
-        return newStore;
-    })();
-    const visible$ = computed(() => {
-        const list = [];
-        if (opened$()) {
-            const selected = selected$();
-            const filterText = filterText$();
-            const matchFn = !filterText ? () => true : matchFn$();
-            const itemId = itemId$();
-            for (const item of items$()) {
-                if (matchFn(item, filterText)) {
-                    list.push({
-                        item,
-                        id: itemId(item),
-                        selected: selected.includes(item),
-                        select: function () {
-                            widget.api.select(this);
-                        }.bind(item),
-                        unselect: function () {
-                            widget.api.unselect(this);
-                        }.bind(item),
-                        toggle: function () {
-                            widget.api.toggleItem(this);
-                        }.bind(item),
-                    });
-                }
-            }
-        }
-        return list;
-    });
-    const highlighted$ = computed(() => {
-        const visible = visible$();
-        const highlightedIndex = highlightedIndex$();
-        return visible.length && highlightedIndex != undefined ? visible[highlightedIndex] : undefined;
-    });
-    const widget = {
-        ...stateStores({
-            visible$,
-            highlighted$,
-            opened$,
-            ...otherProps,
-        }),
-        patch,
-        api: {
-            clear() {
-                selected$.set([]);
-            },
-            select(item) {
-                widget.api.toggleItem(item, true);
-            },
-            unselect(item) {
-                widget.api.toggleItem(item, false);
-            },
-            toggleItem(item, selected) {
-                if (!items$().includes(item)) {
-                    return;
-                }
-                selected$.update((selectedItems) => {
-                    selectedItems = [...selectedItems];
-                    const index = selectedItems.indexOf(item);
-                    if (selected == null) {
-                        selected = index === -1;
-                    }
-                    if (selected && index === -1) {
-                        selectedItems.push(item);
-                    }
-                    else if (!selected && index !== -1) {
-                        selectedItems.splice(index, 1);
-                    }
-                    return selectedItems;
-                });
-            },
-            clearText() {
-                // FIXME: not implemented yet!
-            },
-            highlight(item) {
-                const index = visible$().findIndex((itemCtx) => itemCtx.item === item);
-                highlightedIndex$.set(index === -1 ? undefined : index);
-            },
-            highlightFirst() {
-                highlightedIndex$.set(0);
-            },
-            highlightPrevious() {
-                highlightedIndex$.update((highlightedIndex) => {
-                    return highlightedIndex != null ? highlightedIndex - 1 : -1;
-                });
-            },
-            highlightNext() {
-                highlightedIndex$.update((highlightedIndex) => {
-                    return highlightedIndex != null ? highlightedIndex + 1 : Infinity;
-                });
-            },
-            highlightLast() {
-                highlightedIndex$.set(-1);
-            },
-            focus(item) {
-                // FIXME: not implemented yet!
-            },
-            focusFirst() {
-                // FIXME: not implemented yet!
-            },
-            focusPrevious() {
-                // FIXME: not implemented yet!
-            },
-            focusNext() {
-                // FIXME: not implemented yet!
-            },
-            focusLast() {
-                // FIXME: not implemented yet!
-            },
-            open: () => widget.api.toggle(true),
-            close: () => widget.api.toggle(false),
-            toggle(isOpen) {
-                _dirtyOpened$.update((value) => (isOpen != null ? isOpen : !value));
-            },
-        },
-        directives: {
-            hasFocusDirective,
-        },
-        actions: {
-            onInput({ target }) {
-                const value = target.value;
-                batch(() => {
-                    patch({
-                        opened: value != null && value !== '',
-                        filterText: value,
-                    });
-                    onFilterTextChange$()?.(value);
-                });
-            },
-            onInputKeydown(e) {
-                const { ctrlKey, key } = e;
-                let keyManaged = true;
-                switch (key) {
-                    case 'ArrowDown': {
-                        const isOpen = opened$();
-                        if (isOpen) {
-                            if (ctrlKey) {
-                                widget.api.highlightLast();
-                            }
-                            else {
-                                widget.api.highlightNext();
-                            }
-                        }
-                        else {
-                            widget.api.open();
-                            widget.api.highlightFirst();
-                        }
-                        break;
-                    }
-                    case 'ArrowUp':
-                        if (ctrlKey) {
-                            widget.api.highlightFirst();
-                        }
-                        else {
-                            widget.api.highlightPrevious();
-                        }
-                        break;
-                    case 'Enter': {
-                        const itemCtx = highlighted$();
-                        if (itemCtx) {
-                            widget.api.toggleItem(itemCtx.item);
-                        }
-                        break;
-                    }
-                    case 'Escape':
-                        _dirtyOpened$.set(false);
-                        break;
-                    default:
-                        keyManaged = false;
-                }
-                if (keyManaged) {
-                    e.preventDefault();
-                }
-            },
-        },
-    };
-    return widget;
-}

package/services/index.d.ts

@@ -1,8 +0,0 @@
-export * from './siblingsInert';
-export * from './directiveUtils';
-export * from './focustrack';
-export * from './intersection';
-export * from './portal';
-export * from './stores';
-export * from './writables';
-export * from './navManager';

package/services/index.js

@@ -1,8 +0,0 @@
-export * from './siblingsInert';
-export * from './directiveUtils';
-export * from './focustrack';
-export * from './intersection';
-export * from './portal';
-export * from './stores';
-export * from './writables';
-export * from './navManager';

package/services/writables.d.ts

@@ -1,8 +0,0 @@
-import type { WritableWithDefaultOptions } from './stores';
-import { INVALID_VALUE } from './stores';
-export declare const testToNormalizeValue: <T>(filter: (value: T) => boolean) => (value: T) => typeof INVALID_VALUE | T;
-export declare const typeNumber: WritableWithDefaultOptions<number>;
-export declare const typeBoolean: WritableWithDefaultOptions<boolean>;
-export declare const typeString: WritableWithDefaultOptions<string>;
-export declare const typeFunction: WritableWithDefaultOptions<(...args: any[]) => any>;
-export declare const typeArray: WritableWithDefaultOptions<any[]>;

package/services/writables.js

@@ -1,30 +0,0 @@
-import { isArray, isBoolean, isFunction, isNumber, isString } from './checks';
-import { INVALID_VALUE } from './stores';
-export const testToNormalizeValue = (filter) => (value) => filter(value) ? value : INVALID_VALUE;
-export const typeNumber = {
-    normalizeValue: testToNormalizeValue(isNumber),
-};
-export const typeBoolean = {
-    normalizeValue: testToNormalizeValue(isBoolean),
-};
-export const typeString = {
-    normalizeValue: testToNormalizeValue(isString),
-};
-export const typeFunction = {
-    normalizeValue: testToNormalizeValue(isFunction),
-    equal: Object.is,
-};
-export const typeArray = {
-    normalizeValue: testToNormalizeValue(isArray),
-    equal: (a, b) => {
-        if (a === b) {
-            return true;
-        }
-        else {
-            if (a?.length !== b?.length) {
-                return false;
-            }
-            return a.every((val, index) => val === b[index]);
-        }
-    },
-};

package/transitions/bootstrap/collapse.d.ts

@@ -1,2 +0,0 @@
-export declare const collapseVerticalTransition: import("..").TransitionFn;
-export declare const collapseHorizontalTransition: import("..").TransitionFn;

package/transitions/bootstrap/fade.d.ts

@@ -1 +0,0 @@
-export declare const fadeTransition: import("..").TransitionFn;

package/transitions/bootstrap/index.d.ts

@@ -1,2 +0,0 @@
-export * from './collapse';
-export * from './fade';

package/transitions/bootstrap/index.js

@@ -1,2 +0,0 @@
-export * from './collapse';
-export * from './fade';

package/transitions/index.d.ts

@@ -1,5 +0,0 @@
-export * from './baseTransitions';
-export * from './cssTransitions';
-export * from './simpleClassTransition';
-import * as bootstrap from './bootstrap';
-export { bootstrap };

package/transitions/index.js

@@ -1,5 +0,0 @@
-export * from './baseTransitions';
-export * from './cssTransitions';
-export * from './simpleClassTransition';
-import * as bootstrap from './bootstrap';
-export { bootstrap };

package/transitions/utils.d.ts

@@ -1,20 +0,0 @@
-import type { ReadableSignal } from '@amadeus-it-group/tansu';
-export declare const promiseFromStore: <T>(store: ReadableSignal<T>, condition?: (value: T) => boolean) => {
-    promise: Promise<T>;
-    unsubscribe(): void;
-};
-export declare const promiseFromEvent: (element: EventTarget, event: string) => {
-    promise: Promise<Event>;
-    unsubscribe(): void;
-};
-export declare const promiseFromTimeout: (delay: number) => {
-    promise: Promise<void>;
-    unsubscribe(): void;
-};
-/**
- * Launch a reflow using a call to the provided html element getBoudingClientRect
- * @param element the html element
- */
-export declare function reflow(element?: HTMLElement): void;
-export declare const addClasses: (element: HTMLElement, classes?: string[]) => void;
-export declare const removeClasses: (element: HTMLElement, classes?: string[]) => void;

package/transitions/utils.js

@@ -1,83 +0,0 @@
-const noop = () => {
-    /* nothing to do*/
-};
-const truthyValue = (value) => !!value;
-export const promiseFromStore = (store, condition = truthyValue) => {
-    let resolve;
-    const promise = new Promise((r) => (resolve = r));
-    let unsubscribe = () => {
-        storeUnsubscribe();
-        unsubscribe = noop;
-    };
-    let storeUnsubscribe = noop;
-    storeUnsubscribe = store.subscribe((value) => {
-        if (condition(value)) {
-            resolve(value);
-            unsubscribe();
-        }
-    });
-    if (unsubscribe === noop) {
-        storeUnsubscribe();
-    }
-    return {
-        promise,
-        unsubscribe() {
-            unsubscribe();
-        },
-    };
-};
-export const promiseFromEvent = (element, event) => {
-    let resolve;
-    const promise = new Promise((r) => (resolve = r));
-    let unsubscribe = () => {
-        element.removeEventListener(event, eventListener);
-        unsubscribe = noop;
-    };
-    const eventListener = (event) => {
-        if (event.target === element) {
-            resolve(event);
-            unsubscribe();
-        }
-    };
-    element.addEventListener(event, eventListener);
-    return {
-        promise,
-        unsubscribe() {
-            unsubscribe();
-        },
-    };
-};
-export const promiseFromTimeout = (delay) => {
-    let timeout;
-    return {
-        promise: new Promise((r) => {
-            timeout = setTimeout(() => {
-                timeout = undefined;
-                r();
-            }, delay);
-        }),
-        unsubscribe() {
-            if (timeout) {
-                clearTimeout(timeout);
-                timeout = undefined;
-            }
-        },
-    };
-};
-/**
- * Launch a reflow using a call to the provided html element getBoudingClientRect
- * @param element the html element
- */
-export function reflow(element = document.body) {
-    element.getBoundingClientRect();
-}
-export const addClasses = (element, classes) => {
-    if (classes && classes.length > 0) {
-        element.classList.add(...classes);
-    }
-};
-export const removeClasses = (element, classes) => {
-    if (classes && classes.length > 0) {
-        element.classList.remove(...classes);
-    }
-};