@txstate-mws/svelte-components 1.0.4 → 1.1.0

package/components/PopupMenu.svelte.d.ts

@@ -1,44 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-import { Store } from '@txstate-mws/svelte-store';
-import type { GlueAlignOpts, GlueAlignStore } from '../actions';
-import type { PopupMenuItem } from '../types';
-declare const __propDef: {
-    props: {
-        menushown?: boolean;
-        menuContainerClass?: string;
-        menuClass?: string;
-        menuItemClass?: string;
-        menuItemHilitedClass?: string;
-        menuItemSelectedClass?: string;
-        items?: PopupMenuItem[];
-        buttonelement: HTMLElement;
-        align?: GlueAlignOpts;
-        cover?: boolean;
-        showSelected?: boolean;
-        width?: string | undefined;
-        computedalign?: Store<GlueAlignStore>;
-        usePortal?: HTMLElement | true | undefined;
-        emptyText?: string | undefined;
-        value?: string | undefined;
-    };
-    events: {
-        change: CustomEvent<any>;
-    } & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        default: {
-            item: PopupMenuItem;
-            label: string;
-            hilited: boolean;
-            selected: boolean;
-        };
-        noresults: {};
-    };
-};
-export declare type PopupMenuProps = typeof __propDef.props;
-export declare type PopupMenuEvents = typeof __propDef.events;
-export declare type PopupMenuSlots = typeof __propDef.slots;
-export default class PopupMenu extends SvelteComponentTyped<PopupMenuProps, PopupMenuEvents, PopupMenuSlots> {
-}
-export {};

package/components/ScreenReaderOnly.svelte.d.ts

@@ -1,20 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-declare const __propDef: {
-    props: {
-        id?: string | undefined;
-        arialive?: 'off' | 'assertive' | 'polite' | undefined;
-        ariaatomic?: boolean | 'false' | 'true' | undefined;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        default: {};
-    };
-};
-export declare type ScreenReaderOnlyProps = typeof __propDef.props;
-export declare type ScreenReaderOnlyEvents = typeof __propDef.events;
-export declare type ScreenReaderOnlySlots = typeof __propDef.slots;
-export default class ScreenReaderOnly extends SvelteComponentTyped<ScreenReaderOnlyProps, ScreenReaderOnlyEvents, ScreenReaderOnlySlots> {
-}
-export {};

package/components/index.d.ts

@@ -1,6 +0,0 @@
-export { default as CollapsingTable } from './CollapsingTable.svelte';
-export { default as FocusLock } from './FocusLock.svelte';
-export { default as ConditionalWrapper } from './ConditionalWrapper.svelte';
-export { default as Modal } from './Modal.svelte';
-export { default as PopupMenu } from './PopupMenu.svelte';
-export { default as ScreenReaderOnly } from './ScreenReaderOnly.svelte';

package/components/index.js

@@ -1,6 +0,0 @@
-export { default as CollapsingTable } from './CollapsingTable.svelte';
-export { default as FocusLock } from './FocusLock.svelte';
-export { default as ConditionalWrapper } from './ConditionalWrapper.svelte';
-export { default as Modal } from './Modal.svelte';
-export { default as PopupMenu } from './PopupMenu.svelte';
-export { default as ScreenReaderOnly } from './ScreenReaderOnly.svelte';

package/index.d.ts

@@ -1,4 +0,0 @@
-export * from './components/index.js';
-export * from './actions/index.js';
-export * from './types/index.js';
-export * from './util/index.js';

package/index.js

@@ -1,4 +0,0 @@
-export * from './components/index.js';
-export * from './actions/index.js';
-export * from './types/index.js';
-export * from './util/index.js';

package/types/CollapsingTable.d.ts

@@ -1,8 +0,0 @@
-export interface CollapsingTableColumn {
-    key: string;
-    title?: string;
-    width?: number;
-    neverhide?: boolean;
-    bodyCellClass?: string;
-    headerCellClass?: string;
-}

package/types/CollapsingTable.js

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

package/types/PopupMenu.d.ts

@@ -1,5 +0,0 @@
-export interface PopupMenuItem {
-    value: string;
-    label?: string;
-    disabled?: boolean;
-}

package/types/PopupMenu.js

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

package/types/index.d.ts

@@ -1,2 +0,0 @@
-export * from './CollapsingTable.js';
-export * from './PopupMenu.js';

package/types/index.js

@@ -1,2 +0,0 @@
-export * from './CollapsingTable.js';
-export * from './PopupMenu.js';

package/util/bodyoffset.d.ts

@@ -1,14 +0,0 @@
-export declare type ElementOffsets = Partial<ReturnType<typeof bodyOffset>>;
-export declare function bodyOffset(ele: HTMLElement): {
-    right: number;
-    bottom: number;
-    top: number;
-    left: number;
-};
-export declare function targetOffset(ele: HTMLElement, target: HTMLElement): {
-    right: number;
-    bottom: number;
-    top: number;
-    left: number;
-};
-export declare function sharedOffsetParent(a: HTMLElement, b: HTMLElement): HTMLElement;

package/util/bodyoffset.js

@@ -1,72 +0,0 @@
-export function bodyOffset(ele) {
-    return targetOffset(ele, document.body);
-}
-export function targetOffset(ele, target) {
-    const offset = targetOffsetRecursive(ele, target);
-    return {
-        ...offset,
-        right: target.offsetWidth - offset.left - ele.offsetWidth,
-        bottom: target.offsetHeight - offset.top - ele.offsetHeight
-    };
-}
-export function sharedOffsetParent(a, b) {
-    if (!a || !b)
-        return undefined;
-    if (a.contains(b) && a.firstElementChild.offsetParent === a)
-        return a;
-    if (b.contains(a) && b.firstElementChild.offsetParent === b)
-        return b;
-    let c = a.offsetParent;
-    while (c instanceof HTMLElement && !c.contains(b))
-        c = c.offsetParent;
-    return c;
-}
-function targetOffsetRecursive(ele, target, currentOffset) {
-    const { x, y } = getTranslate(ele);
-    const offset = {
-        top: ele.offsetTop + (currentOffset?.top ?? 0) + y,
-        left: ele.offsetLeft + (currentOffset?.left ?? 0) + x
-    };
-    if (ele.offsetParent instanceof HTMLElement && target !== ele.offsetParent && target.contains(ele.offsetParent))
-        return targetOffsetRecursive(ele.offsetParent, target, offset);
-    return offset;
-}
-function getTranslate(element) {
-    const style = window.getComputedStyle(element);
-    const matrix = style.transform;
-    // No transform property. Simply return 0 values.
-    if (matrix === 'none' || !matrix) {
-        return {
-            x: 0,
-            y: 0,
-            z: 0
-        };
-    }
-    // Can either be 2d or 3d transform
-    const matrixType = matrix.includes('3d') ? '3d' : '2d';
-    const matrixValues = matrix.match(/matrix.*\((.+)\)/)[1].split(', ');
-    // 2d matrices have 6 values
-    // Last 2 values are X and Y.
-    // 2d matrices does not have Z value.
-    if (matrixType === '2d') {
-        return {
-            x: Number(matrixValues[4]),
-            y: Number(matrixValues[5]),
-            z: 0
-        };
-    }
-    // 3d matrices have 16 values
-    // The 13th, 14th, and 15th values are X, Y, and Z
-    if (matrixType === '3d') {
-        return {
-            x: Number(matrixValues[12]),
-            y: Number(matrixValues[13]),
-            z: Number(matrixValues[14])
-        };
-    }
-    return {
-        x: 0,
-        y: 0,
-        z: 0
-    };
-}

package/util/index.d.ts

@@ -1,3 +0,0 @@
-export * from './bodyoffset.js';
-export * from './repositioned.js';
-export * from './util.js';

package/util/index.js

@@ -1,3 +0,0 @@
-export * from './bodyoffset.js';
-export * from './repositioned.js';
-export * from './util.js';

package/util/repositioned.d.ts

@@ -1,12 +0,0 @@
-import type { ElementOffsets } from './bodyoffset.js';
-export declare function watchForMutations(cb: () => void): {
-    destroy(): void;
-};
-export declare function watchForPositionChange(el: (HTMLElement | undefined)[] | HTMLElement | undefined, cb: ((offset: Required<ElementOffsets>) => void) | ((offsets: Required<ElementOffsets>[]) => void)): {
-    update(newEl: (HTMLElement | undefined)[] | HTMLElement | undefined, newCb: ((offset: Required<ElementOffsets>) => void) | ((offsets: Required<ElementOffsets>[]) => void)): void;
-    destroy: () => void;
-};
-export declare function watchForPositionChangeInContainer(el: HTMLElement | undefined, container: HTMLElement | undefined, cb: (offset: Required<ElementOffsets>) => void): {
-    update(newEl: HTMLElement | undefined, newContainer: HTMLElement | undefined, newCb: (offset: Required<ElementOffsets>) => void): void;
-    destroy: () => void;
-};

package/util/repositioned.js

@@ -1,81 +0,0 @@
-import { equal, isNotNull, randomid, toArray } from 'txstate-utils';
-import { bodyOffset, targetOffset } from './bodyoffset.js';
-const observers = new Map();
-let mutationobserver;
-export function watchForMutations(cb) {
-    function watch() {
-        for (const cb of observers.values())
-            cb();
-    }
-    if (observers.size === 0) {
-        mutationobserver ?? (mutationobserver = new MutationObserver(watch));
-        window.addEventListener('resize', watch, { passive: true });
-        mutationobserver.observe(document.body, {
-            subtree: true,
-            childList: true,
-            attributes: true,
-            characterData: true
-        });
-    }
-    const id = randomid();
-    observers.set(id, cb);
-    cb();
-    return {
-        destroy() {
-            observers.delete(id);
-            if (observers.size === 0) {
-                window.removeEventListener('resize', watch);
-                mutationobserver.disconnect();
-            }
-        }
-    };
-}
-export function watchForPositionChange(el, cb) {
-    let lastoffsets = [];
-    let els = toArray(el).filter(isNotNull);
-    function watch() {
-        const offsets = els.map(bodyOffset);
-        if (offsets.some((offset, i) => !equal(offset, lastoffsets[i]))) {
-            lastoffsets = offsets;
-            Array.isArray(el) ? cb(offsets) : cb(offsets[0]);
-        }
-    }
-    const { destroy } = watchForMutations(watch);
-    return {
-        update(newEl, newCb) {
-            const changed = newEl !== el || newCb !== cb;
-            if (changed) {
-                el = newEl;
-                els = toArray(el).filter(isNotNull);
-                cb = newCb;
-                watch();
-            }
-        },
-        destroy
-    };
-}
-export function watchForPositionChangeInContainer(el, container, cb) {
-    let lastoffset;
-    function watch() {
-        if (!el || !container)
-            return;
-        const offset = targetOffset(el, container);
-        if (!equal(offset, lastoffset)) {
-            lastoffset = offset;
-            cb(offset);
-        }
-    }
-    const { destroy } = watchForMutations(watch);
-    return {
-        update(newEl, newContainer, newCb) {
-            const changed = newEl !== el || newContainer !== container || newCb !== cb;
-            if (changed) {
-                el = newEl;
-                container = newContainer;
-                cb = newCb;
-                watch();
-            }
-        },
-        destroy
-    };
-}

package/util/util.d.ts

@@ -1,2 +0,0 @@
-export declare function classes(...classNames: (string | undefined)[]): string;
-export declare function debounced(fn: Function, timeout: number): (...args: any[]) => void;

package/util/util.js

@@ -1,10 +0,0 @@
-export function classes(...classNames) {
-    return classNames.filter(Boolean).join(' ');
-}
-export function debounced(fn, timeout) {
-    let timer;
-    return (...args) => {
-        clearTimeout(timer);
-        timer = setTimeout(() => fn(...args), timeout);
-    };
-}