@evance/evance-ui 1.0.0

package/dist/composables/position.d.ts

@@ -0,0 +1,19 @@
+import { CSSProperties, PropType } from 'vue';
+import { AnchorSelector } from '../util';
+
+export interface PositionProps {
+    position?: AnchorSelector;
+}
+export declare const makePositionProps: <Defaults extends {
+    position?: unknown;
+} = {}>(defaults?: Defaults | undefined) => {
+    position: unknown extends Defaults["position"] ? PropType<AnchorSelector> : {
+        type: PropType<unknown extends Defaults["position"] ? AnchorSelector : NonNullable<AnchorSelector> | Defaults["position"]>;
+        default: unknown extends Defaults["position"] ? AnchorSelector : NonNullable<AnchorSelector> | Defaults["position"];
+    };
+};
+export type Position = 'top' | 'bottom' | 'left' | 'right';
+export type Alignment = 'left' | 'right' | 'center';
+export declare function usePosition(props: PositionProps, opposite?: boolean, offset?: (side: string) => number): {
+    positionStyles: import('vue').ComputedRef<CSSProperties>;
+};

package/dist/composables/resizeObserver.d.ts

@@ -0,0 +1,13 @@
+import { DeepReadonly, Ref } from 'vue';
+
+interface ResizeState {
+    resizeRef: Ref<HTMLElement | undefined>;
+    contentRect: DeepReadonly<Ref<DOMRectReadOnly | undefined>>;
+}
+/**
+ * # Resize Observer
+ * @param callback
+ * @param box
+ */
+export declare function useResizeObserver(callback?: ResizeObserverCallback, box?: 'content' | 'border'): ResizeState;
+export {};

package/dist/composables/rounded.d.ts

@@ -0,0 +1,26 @@
+import { Ref } from 'vue';
+
+type RoundedValue = boolean | string | number | null | undefined;
+export interface RoundedProps {
+    rounded?: RoundedValue;
+    tile?: boolean;
+}
+type RoundedData = {
+    roundedClasses: Ref<string[]>;
+};
+export declare const makeRoundedProps: <Defaults extends {
+    rounded?: unknown;
+} = {}>(defaults?: Defaults | undefined) => {
+    rounded: unknown extends Defaults["rounded"] ? {
+        type: (StringConstructor | BooleanConstructor | NumberConstructor)[];
+        default: undefined;
+    } : Omit<{
+        type: (StringConstructor | BooleanConstructor | NumberConstructor)[];
+        default: undefined;
+    }, "type" | "default"> & {
+        type: import('vue').PropType<unknown extends Defaults["rounded"] ? string | number | boolean : Defaults["rounded"] | NonNullable<string | number | boolean>>;
+        default: unknown extends Defaults["rounded"] ? string | number | boolean : Defaults["rounded"] | NonNullable<string | number | boolean>;
+    };
+};
+export declare function useRounded(props: RoundedProps | Ref<RoundedValue>): RoundedData;
+export {};

package/dist/composables/router.d.ts

@@ -0,0 +1,75 @@
+import { ClickEventListeners } from '../util';
+import { ComputedRef, PropType, Ref, SetupContext } from 'vue';
+import { NavigationGuardNext, RouteLocationRaw, Router, useLink } from 'vue-router';
+
+/**
+ * # RouterLink or Href Props
+ *
+ * We need to be able to accommodate `<a href="">` links
+ * as well as `<router-link to="...">` links.
+ *
+ * This is an important distinction in Evance since we use both.
+ *
+ */
+export interface RouterLinkOrHrefProps {
+    href?: string;
+    replace?: boolean;
+    to?: RouteLocationRaw;
+    exact?: boolean;
+}
+/**
+ * # Use RouterLink or Href
+ */
+export interface UseRouterLinkOrHref extends Omit<Partial<ReturnType<typeof useLink>>, 'href'> {
+    isLink: ComputedRef<boolean>;
+    isClickable: ComputedRef<boolean>;
+    href: Ref<string | undefined>;
+}
+/**
+ * # Is Clickable Link
+ * @param props
+ * @param attrs
+ */
+export declare function isClickableLink(props: RouterLinkOrHrefProps & ClickEventListeners, attrs: SetupContext['attrs']): ComputedRef<boolean>;
+/**
+ * # Is RouterLink or Href
+ * @param props
+ */
+export declare function isRouterLinkOrHref(props: RouterLinkOrHrefProps): ComputedRef<boolean>;
+/**
+ * # Make Router Props
+ */
+export declare const makeRouterLinkOrHrefProps: <Defaults extends {
+    href?: unknown;
+    replace?: unknown;
+    to?: unknown;
+    exact?: unknown;
+} = {}>(defaults?: Defaults | undefined) => {
+    href: unknown extends Defaults["href"] ? StringConstructor : {
+        type: PropType<unknown extends Defaults["href"] ? string : string | Defaults["href"]>;
+        default: unknown extends Defaults["href"] ? string : string | Defaults["href"];
+    };
+    replace: unknown extends Defaults["replace"] ? BooleanConstructor : {
+        type: PropType<unknown extends Defaults["replace"] ? boolean : boolean | Defaults["replace"]>;
+        default: unknown extends Defaults["replace"] ? boolean : boolean | Defaults["replace"];
+    };
+    to: unknown extends Defaults["to"] ? PropType<RouteLocationRaw> : {
+        type: PropType<unknown extends Defaults["to"] ? RouteLocationRaw : Defaults["to"] | NonNullable<RouteLocationRaw>>;
+        default: unknown extends Defaults["to"] ? RouteLocationRaw : Defaults["to"] | NonNullable<RouteLocationRaw>;
+    };
+    exact: unknown extends Defaults["exact"] ? BooleanConstructor : {
+        type: PropType<unknown extends Defaults["exact"] ? boolean : boolean | Defaults["exact"]>;
+        default: unknown extends Defaults["exact"] ? boolean : boolean | Defaults["exact"];
+    };
+};
+/**
+ * # Use Router Link or Href
+ *
+ * This is heavily "inspired" by Vuetify.
+ * https://github.com/vuetifyjs/vuetify/blob/master/packages/vuetify/src/composables/router.tsx
+ *
+ * @param props
+ * @param attrs
+ */
+export declare function useRouterLinkOrHref(props: RouterLinkOrHrefProps, attrs: SetupContext['attrs']): UseRouterLinkOrHref;
+export declare function useBackButton(router: Router | undefined, callback: (next: NavigationGuardNext) => void): void;

package/dist/composables/scopeId.d.ts

@@ -0,0 +1,5 @@
+export declare function useScopeId(): {
+    scopeId: {
+        [x: string]: string;
+    } | undefined;
+};

package/dist/composables/selectLink.d.ts

@@ -0,0 +1,9 @@
+import { UseRouterLinkOrHref } from './router.ts';
+
+/**
+ * # useSelectLink
+ *
+ * @param link
+ * @param select
+ */
+export declare function useSelectLink(link: UseRouterLinkOrHref, select?: (value: boolean, e?: Event) => void): void;

package/dist/composables/size.d.ts

@@ -0,0 +1,30 @@
+export declare enum Size {
+    default = "medium",
+    xSmall = "x-small",
+    small = "small",
+    medium = "medium",
+    large = "large",
+    xLarge = "x-large"
+}
+export declare const predefinedSizes: Size[];
+export interface SizeProps {
+    size?: string | number;
+}
+export declare const makeSizeProps: <Defaults extends {
+    size?: unknown;
+} = {}>(defaults?: Defaults | undefined) => {
+    size: unknown extends Defaults["size"] ? {
+        type: (StringConstructor | NumberConstructor)[];
+        default: Size;
+    } : Omit<{
+        type: (StringConstructor | NumberConstructor)[];
+        default: Size;
+    }, "type" | "default"> & {
+        type: import('vue').PropType<unknown extends Defaults["size"] ? string | number : NonNullable<string | number> | Defaults["size"]>;
+        default: unknown extends Defaults["size"] ? string | number : NonNullable<string | number> | Defaults["size"];
+    };
+};
+export declare function useSize(props: SizeProps): import('vue').ToRefs<{
+    sizeClasses: string | undefined;
+    sizeStyles: {};
+}>;

package/dist/composables/ssrBoot.d.ts

@@ -0,0 +1,9 @@
+/**
+ * # useSsrBoot
+ */
+export declare function useSsrBoot(): {
+    ssrBootStyles: import('vue').ComputedRef<{
+        transition: string;
+    } | undefined>;
+    isBooted: Readonly<import('vue').Ref<boolean>>;
+};

package/dist/composables/stack.d.ts

@@ -0,0 +1,19 @@
+import { ComponentInternalInstance, Ref } from 'vue';
+
+export declare function getComponentIndex(component: ComponentInternalInstance): number;
+export declare function getLastZIndex(): number | undefined;
+export declare function getNextZIndex(fallback: number): number;
+export declare function isTopComponent(component: ComponentInternalInstance): boolean;
+/**
+ * # Use Stack
+ * @param isActive
+ * @param zIndex
+ * @param isDisableGlobalStack
+ */
+export declare function useStack(isActive: Readonly<Ref<boolean>>, zIndex: Readonly<Ref<string | number>>, isDisableGlobalStack: boolean): {
+    isTopGlobal: Readonly<Ref<boolean>>;
+    isTopLocal: import('vue').ComputedRef<boolean>;
+    stackStyles: import('vue').ComputedRef<{
+        zIndex: number;
+    }>;
+};

package/dist/composables/tag.d.ts

@@ -0,0 +1,17 @@
+export interface TagProps {
+    tag: string;
+}
+export declare const makeTagProps: <Defaults extends {
+    tag?: unknown;
+} = {}>(defaults?: Defaults | undefined) => {
+    tag: unknown extends Defaults["tag"] ? {
+        type: StringConstructor;
+        default: string;
+    } : Omit<{
+        type: StringConstructor;
+        default: string;
+    }, "type" | "default"> & {
+        type: import('vue').PropType<unknown extends Defaults["tag"] ? string : string | Defaults["tag"]>;
+        default: unknown extends Defaults["tag"] ? string : string | Defaults["tag"];
+    };
+};

package/dist/composables/teleport.d.ts

@@ -0,0 +1,13 @@
+import { Ref } from 'vue';
+
+export type TeleportTarget = boolean | string | Element;
+/**
+ * # Use Teleport
+ *
+ * `target` where we want to teleport to.
+ * `container` MUST be a CSS class selector (defaults to '.ev-teleport').
+ *
+ * @param target
+ * @param container
+ */
+export declare function useTeleport(target: Ref<TeleportTarget>, container?: string): import('vue').ComputedRef<Element | null>;

package/dist/composables/toggleScope.d.ts

@@ -0,0 +1,3 @@
+import { WatchSource } from 'vue';
+
+export declare function useToggleScope(source: WatchSource<boolean>, fn: (reset: () => void) => void): void;

package/dist/composables/validation.d.ts

@@ -0,0 +1,107 @@
+import { FormField } from '../modules/Form/FormField.ts';
+import { PropType } from 'vue';
+
+/**
+ * # Validation Error
+ *
+ * Represents a single error message with a name identifier.
+ */
+export interface ValidationError {
+    name: number | string;
+    message: string;
+}
+/**
+ * # Validation Result
+ */
+export type ValidationResult = string | boolean;
+/**
+ * # Validator
+ */
+export type Validator = ValidationResult | PromiseLike<ValidationResult> | ((value: any) => ValidationResult) | ((value: any) => PromiseLike<ValidationResult>);
+/**
+ * # Validate On Event
+ */
+export type ValidateOnEvent = 'blur' | 'input' | 'submit';
+/**
+ * # Form Field Props
+ */
+export interface FormFieldProps {
+    id?: string;
+    disabled?: boolean;
+    error?: boolean;
+    focused?: boolean;
+    name?: string;
+    readonly?: boolean;
+    validators: Validator[];
+    modelValue?: any;
+    validateOn?: ValidateOnEvent | `${ValidateOnEvent} lazy` | `lazy ${ValidateOnEvent}` | 'lazy';
+    validationValue?: any;
+}
+/**
+ * # Make Form Field Props
+ */
+export declare const makeFormFieldProps: <Defaults extends {
+    focused?: unknown;
+    id?: unknown;
+    disabled?: unknown;
+    error?: unknown;
+    name?: unknown;
+    readonly?: unknown;
+    validators?: unknown;
+    modelValue?: unknown;
+    validateOn?: unknown;
+    validationValue?: unknown;
+} = {}>(defaults?: Defaults | undefined) => {
+    focused: unknown extends Defaults["focused"] ? BooleanConstructor : {
+        type: PropType<unknown extends Defaults["focused"] ? boolean : boolean | Defaults["focused"]>;
+        default: unknown extends Defaults["focused"] ? boolean : boolean | Defaults["focused"];
+    };
+    id: unknown extends Defaults["id"] ? StringConstructor : {
+        type: PropType<unknown extends Defaults["id"] ? string : string | Defaults["id"]>;
+        default: unknown extends Defaults["id"] ? string : string | Defaults["id"];
+    };
+    disabled: unknown extends Defaults["disabled"] ? BooleanConstructor : {
+        type: PropType<unknown extends Defaults["disabled"] ? boolean : boolean | Defaults["disabled"]>;
+        default: unknown extends Defaults["disabled"] ? boolean : boolean | Defaults["disabled"];
+    };
+    error: unknown extends Defaults["error"] ? BooleanConstructor : {
+        type: PropType<unknown extends Defaults["error"] ? boolean : boolean | Defaults["error"]>;
+        default: unknown extends Defaults["error"] ? boolean : boolean | Defaults["error"];
+    };
+    name: unknown extends Defaults["name"] ? StringConstructor : {
+        type: PropType<unknown extends Defaults["name"] ? string : string | Defaults["name"]>;
+        default: unknown extends Defaults["name"] ? string : string | Defaults["name"];
+    };
+    readonly: unknown extends Defaults["readonly"] ? BooleanConstructor : {
+        type: PropType<unknown extends Defaults["readonly"] ? boolean : boolean | Defaults["readonly"]>;
+        default: unknown extends Defaults["readonly"] ? boolean : boolean | Defaults["readonly"];
+    };
+    validators: unknown extends Defaults["validators"] ? {
+        type: PropType<Validator[]>;
+        default: never[];
+    } : Omit<{
+        type: PropType<Validator[]>;
+        default: never[];
+    }, "type" | "default"> & {
+        type: PropType<unknown extends Defaults["validators"] ? Validator[] : Validator[] | Defaults["validators"]>;
+        default: unknown extends Defaults["validators"] ? Validator[] : Validator[] | Defaults["validators"];
+    };
+    modelValue: unknown extends Defaults["modelValue"] ? null : {
+        type: PropType<unknown extends Defaults["modelValue"] ? any : any>;
+        default: unknown extends Defaults["modelValue"] ? any : any;
+    };
+    validateOn: unknown extends Defaults["validateOn"] ? PropType<ValidateOnEvent | "input lazy" | "blur lazy" | "submit lazy" | "lazy input" | "lazy blur" | "lazy submit" | "lazy" | undefined> : {
+        type: PropType<unknown extends Defaults["validateOn"] ? ValidateOnEvent | "input lazy" | "blur lazy" | "submit lazy" | "lazy input" | "lazy blur" | "lazy submit" | "lazy" | undefined : NonNullable<ValidateOnEvent | "input lazy" | "blur lazy" | "submit lazy" | "lazy input" | "lazy blur" | "lazy submit" | "lazy" | undefined> | Defaults["validateOn"]>;
+        default: unknown extends Defaults["validateOn"] ? ValidateOnEvent | "input lazy" | "blur lazy" | "submit lazy" | "lazy input" | "lazy blur" | "lazy submit" | "lazy" | undefined : NonNullable<ValidateOnEvent | "input lazy" | "blur lazy" | "submit lazy" | "lazy input" | "lazy blur" | "lazy submit" | "lazy" | undefined> | Defaults["validateOn"];
+    };
+    validationValue: unknown extends Defaults["validationValue"] ? null : {
+        type: PropType<unknown extends Defaults["validationValue"] ? any : any>;
+        default: unknown extends Defaults["validationValue"] ? any : any;
+    };
+};
+/**
+ * # Use Form Field
+ * @param props
+ * @param group
+ */
+export declare function useFormField(props: FormFieldProps, group?: FormField | undefined): FormField;

package/dist/composables/virtual.d.ts

@@ -0,0 +1,43 @@
+import { ComputedRef, Ref } from 'vue';
+
+type VirtualProps = {
+    itemHeight?: number | string;
+};
+export interface VirtualItem {
+    raw: any;
+    index: number;
+}
+/**
+ * # Make Virtual Props
+ */
+export declare const makeVirtualProps: <Defaults extends {
+    itemHeight?: unknown;
+} = {}>(defaults?: Defaults | undefined) => {
+    itemHeight: unknown extends Defaults["itemHeight"] ? {
+        type: (StringConstructor | NumberConstructor)[];
+        default: number;
+    } : Omit<{
+        type: (StringConstructor | NumberConstructor)[];
+        default: number;
+    }, "type" | "default"> & {
+        type: import('vue').PropType<unknown extends Defaults["itemHeight"] ? string | number : NonNullable<string | number> | Defaults["itemHeight"]>;
+        default: unknown extends Defaults["itemHeight"] ? string | number : NonNullable<string | number> | Defaults["itemHeight"];
+    };
+};
+/**
+ * # Use Virtual
+ * @param props
+ * @param items
+ * @param offset
+ */
+export declare function useVirtual<T>(props: VirtualProps, items: Ref<readonly T[]>, offset?: Ref<number>): {
+    containerRef: Ref<HTMLElement | undefined>;
+    computedItems: ComputedRef<VirtualItem[]>;
+    itemHeight: import('vue').WritableComputedRef<number>;
+    paddingTop: ComputedRef<number>;
+    paddingBottom: ComputedRef<number>;
+    scrollToIndex: (index: number) => void;
+    handleScroll: () => void;
+    handleItemResize: (index: number, height: number) => void;
+};
+export {};

package/dist/directives/click-outside.d.ts

@@ -0,0 +1,50 @@
+import { DirectiveBinding } from 'vue';
+
+/**
+ * ## Click Outside Args
+ *
+ * Allows us to accept custom arguments from v-click-outside attributes.
+ * - `handler` the function to execute
+ * - `condition` an optional function which determines whether the `handler` should be called.
+ *              Effectively, this allows us to pause the event.
+ * - `include`  an optional array of elements to include when evaluating the click outside event.
+ */
+interface ClickOutsideArgs {
+    handler: (e: MouseEvent) => void;
+    condition?: (e: Event) => boolean;
+    include?: () => HTMLElement[];
+}
+/**
+ * ## Click Outside Binding
+ */
+interface ClickOutsideBinding extends DirectiveBinding {
+    value: ((e: MouseEvent) => void) | ClickOutsideArgs;
+}
+interface ClickOutsideHTMLElement extends HTMLElement {
+    __clickOutside?: any;
+}
+/**
+ * # Click Outside Directive
+ *
+ * There are two handlers:
+ * 1. onClick - handles click events, which are triggered after...
+ * 2. onMouseDown - determines if the mouse was outside before the click event finished.
+ *
+ * This helps us get over an issue we had previously, where mouse dragging during a click
+ * caused dialogs to close unwantedly.
+ */
+export declare const clickOutside: {
+    /**
+     * Add event listeners when the component is mounted.
+     * @param el
+     * @param binding
+     */
+    mounted(el: ClickOutsideHTMLElement, binding: ClickOutsideBinding): void;
+    /**
+     * Remove event listeners when the component is unmounted.
+     * @param el
+     * @param binding
+     */
+    unmounted(el: ClickOutsideHTMLElement, binding: ClickOutsideBinding): void;
+};
+export default clickOutside;

package/dist/directives/index.d.ts

@@ -0,0 +1,4 @@
+export * from './click-outside';
+export * from './intersect';
+export * from './slots';
+export * from './touch';

package/dist/directives/intersect.d.ts

@@ -0,0 +1,32 @@
+import { DirectiveBinding } from 'vue/dist/vue';
+
+type ObserverHandler = (isIntersecting: boolean, entries: IntersectionObserverEntry[], observer: IntersectionObserver) => void;
+interface ObserveHTMLElement extends HTMLElement {
+    _observe?: {
+        init: boolean;
+        observer: IntersectionObserver;
+    }[];
+}
+export interface ObserverDirectiveBinding extends Omit<DirectiveBinding, 'modifiers' | 'value'> {
+    value?: ObserverHandler | {
+        handler: ObserverHandler;
+        options?: IntersectionObserverInit;
+    };
+    modifiers: {
+        once?: boolean;
+        quiet?: boolean;
+    };
+}
+/**
+ * # Mounted
+ */
+declare function mounted(el: ObserveHTMLElement, binding: ObserverDirectiveBinding): void;
+/**
+ * # Unmounted
+ */
+declare function unmounted(el: ObserveHTMLElement, binding: ObserverDirectiveBinding): void;
+export declare const Intersect: {
+    mounted: typeof mounted;
+    unmounted: typeof unmounted;
+};
+export default Intersect;

package/dist/directives/slots.d.ts

@@ -0,0 +1,7 @@
+import { VNode } from 'vue';
+import { DirectiveBinding } from 'vue/dist/vue';
+
+export declare const SlotsDirective: {
+    beforeMount(el: HTMLElement, binding: DirectiveBinding, vnode: VNode): void;
+};
+export default SlotsDirective;

package/dist/directives/touch.d.ts

@@ -0,0 +1,52 @@
+import { DirectiveBinding } from 'vue';
+
+export interface TouchHandlers {
+    start?: (wrapperEvent: {
+        originalEvent: TouchEvent;
+    } & TouchData) => void;
+    end?: (wrapperEvent: {
+        originalEvent: TouchEvent;
+    } & TouchData) => void;
+    move?: (wrapperEvent: {
+        originalEvent: TouchEvent;
+    } & TouchData) => void;
+    left?: (wrapper: TouchData) => void;
+    right?: (wrapper: TouchData) => void;
+    up?: (wrapper: TouchData) => void;
+    down?: (wrapper: TouchData) => void;
+}
+export interface TouchData {
+    touchstartX: number;
+    touchstartY: number;
+    touchmoveX: number;
+    touchmoveY: number;
+    touchendX: number;
+    touchendY: number;
+    offsetX: number;
+    offsetY: number;
+}
+export type TouchWrapper = TouchHandlers & TouchData;
+export interface TouchValue extends TouchHandlers {
+    parent?: boolean;
+    options?: AddEventListenerOptions;
+}
+export interface TouchStoredHandlers {
+    touchstart: (e: TouchEvent) => void;
+    touchend: (e: TouchEvent) => void;
+    touchmove: (e: TouchEvent) => void;
+}
+export interface TouchDirectiveBinding extends Omit<DirectiveBinding, 'value'> {
+    value?: TouchValue;
+}
+type TouchableElement = HTMLElement & {
+    _touchHandlers?: {
+        [key: string | number]: TouchStoredHandlers;
+    };
+};
+declare function mounted(el: TouchableElement, binding: TouchDirectiveBinding): void;
+declare function unmounted(el: HTMLElement, binding: TouchDirectiveBinding): void;
+export declare const Touch: {
+    mounted: typeof mounted;
+    unmounted: typeof unmounted;
+};
+export default Touch;

package/dist/entry-bundler.d.ts

@@ -0,0 +1,11 @@
+import { EvanceUiOptions } from './framework.ts';
+
+import * as components from './components';
+import * as directives from './directives';
+import * as services from './services';
+export declare const createEvanceUi: (options?: EvanceUiOptions) => {
+    install: (app: import('vue').App<any>) => void;
+    display: import('./composables/display.ts').DisplayInstance;
+};
+export { components, directives, services };
+export * from './composables';