@lovince/ui-vue 0.0.0-stage → 0.1.1

package/dist/components/sortable.d.ts

@@ -0,0 +1,140 @@
+import { PropType } from 'vue';
+import { Orientation } from '@lovince/ui-headless';
+/**
+ * A list people put in order: dragged by a handle, or from the keyboard —
+ * Space picks an item up, the arrows move it, Space drops it and Escape puts
+ * it back. Every step is announced, so the order is never changed unseen.
+ */
+export declare const SortableRoot: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    as: {
+        default: string;
+        type: PropType<string | import('vue').Component>;
+    };
+    /** The values in their order. */
+    modelValue: {
+        type: PropType<string[]>;
+        default: undefined;
+    };
+    defaultValue: {
+        type: PropType<string[]>;
+        default: () => never[];
+    };
+    orientation: {
+        type: PropType<Orientation>;
+        default: string;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>[], {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    'update:modelValue': (order: string[]) => boolean;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    as: {
+        default: string;
+        type: PropType<string | import('vue').Component>;
+    };
+    /** The values in their order. */
+    modelValue: {
+        type: PropType<string[]>;
+        default: undefined;
+    };
+    defaultValue: {
+        type: PropType<string[]>;
+        default: () => never[];
+    };
+    orientation: {
+        type: PropType<Orientation>;
+        default: string;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((order: string[]) => any) | undefined;
+}>, {
+    as: string | import('vue').Component;
+    asChild: boolean;
+    disabled: boolean;
+    orientation: Orientation;
+    modelValue: string[];
+    defaultValue: string[];
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const SortableItem: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    as: {
+        default: string;
+        type: PropType<string | import('vue').Component>;
+    };
+    value: {
+        type: StringConstructor;
+        required: true;
+    };
+    /** How the item is named in announcements; defaults to its text. */
+    textValue: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    as: {
+        default: string;
+        type: PropType<string | import('vue').Component>;
+    };
+    value: {
+        type: StringConstructor;
+        required: true;
+    };
+    /** How the item is named in announcements; defaults to its text. */
+    textValue: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>> & Readonly<{}>, {
+    as: string | import('vue').Component;
+    asChild: boolean;
+    textValue: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const SortableHandle: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    readonly as: {
+        readonly default: "button";
+        readonly type: PropType<string | import('vue').Component>;
+    };
+    readonly asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    readonly as: {
+        readonly default: "button";
+        readonly type: PropType<string | import('vue').Component>;
+    };
+    readonly asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>> & Readonly<{}>, {
+    readonly as: string | import('vue').Component;
+    readonly asChild: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/dist/components/splitter.d.ts

@@ -0,0 +1,167 @@
+import { PropType } from 'vue';
+import { Direction, Orientation } from '@lovince/ui-headless';
+/**
+ * Panels with draggable dividers between them — the WAI-ARIA window splitter.
+ * Sizes are percentages of the group, one per panel, and always add up to 100.
+ */
+export declare const SplitterGroup: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    modelValue: {
+        type: PropType<number[]>;
+        default: undefined;
+    };
+    orientation: {
+        type: PropType<Orientation>;
+        default: string;
+    };
+    dir: {
+        type: PropType<Direction>;
+        default: string;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** Percent moved per arrow key press. */
+    keyboardStep: {
+        type: NumberConstructor;
+        default: number;
+    };
+    as: {
+        readonly type: PropType<string | import('vue').Component>;
+        readonly default: "div";
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    'update:modelValue': (sizes: number[]) => boolean;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    modelValue: {
+        type: PropType<number[]>;
+        default: undefined;
+    };
+    orientation: {
+        type: PropType<Orientation>;
+        default: string;
+    };
+    dir: {
+        type: PropType<Direction>;
+        default: string;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** Percent moved per arrow key press. */
+    keyboardStep: {
+        type: NumberConstructor;
+        default: number;
+    };
+    as: {
+        readonly type: PropType<string | import('vue').Component>;
+        readonly default: "div";
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((sizes: number[]) => any) | undefined;
+}>, {
+    as: string | import('vue').Component;
+    asChild: boolean;
+    disabled: boolean;
+    dir: Direction;
+    orientation: Orientation;
+    keyboardStep: number;
+    modelValue: number[];
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const SplitterPanel: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    /** Starting size in percent; panels without one share what is left. */
+    defaultSize: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+    minSize: {
+        type: NumberConstructor;
+        default: number;
+    };
+    maxSize: {
+        type: NumberConstructor;
+        default: number;
+    };
+    as: {
+        readonly type: PropType<string | import('vue').Component>;
+        readonly default: "div";
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    /** Starting size in percent; panels without one share what is left. */
+    defaultSize: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+    minSize: {
+        type: NumberConstructor;
+        default: number;
+    };
+    maxSize: {
+        type: NumberConstructor;
+        default: number;
+    };
+    as: {
+        readonly type: PropType<string | import('vue').Component>;
+        readonly default: "div";
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>> & Readonly<{}>, {
+    as: string | import('vue').Component;
+    asChild: boolean;
+    defaultSize: number;
+    minSize: number;
+    maxSize: number;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const SplitterHandle: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    as: {
+        default: string;
+        type: PropType<string | import('vue').Component>;
+    };
+    label: {
+        type: StringConstructor;
+        default: string;
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    as: {
+        default: string;
+        type: PropType<string | import('vue').Component>;
+    };
+    label: {
+        type: StringConstructor;
+        default: string;
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>> & Readonly<{}>, {
+    as: string | import('vue').Component;
+    asChild: boolean;
+    label: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/dist/components/tabs.d.ts

@@ -0,0 +1,183 @@
+import { PropType } from 'vue';
+import { ActivationMode, Direction, Orientation } from '@lovince/ui-headless';
+export declare const TabsRoot: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    modelValue: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    defaultValue: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    orientation: {
+        type: PropType<Orientation>;
+        default: string;
+    };
+    dir: {
+        type: PropType<Direction>;
+        default: string;
+    };
+    /** Automatic selects on arrow-key focus; manual waits for Enter or Space. */
+    activationMode: {
+        type: PropType<ActivationMode>;
+        default: string;
+    };
+    loop: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    as: {
+        readonly type: PropType<string | import('vue').Component>;
+        readonly default: "div";
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    'update:modelValue': (value: string) => boolean;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    modelValue: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    defaultValue: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    orientation: {
+        type: PropType<Orientation>;
+        default: string;
+    };
+    dir: {
+        type: PropType<Direction>;
+        default: string;
+    };
+    /** Automatic selects on arrow-key focus; manual waits for Enter or Space. */
+    activationMode: {
+        type: PropType<ActivationMode>;
+        default: string;
+    };
+    loop: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    as: {
+        readonly type: PropType<string | import('vue').Component>;
+        readonly default: "div";
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+}>, {
+    as: string | import('vue').Component;
+    asChild: boolean;
+    dir: Direction;
+    orientation: Orientation;
+    loop: boolean;
+    activationMode: ActivationMode;
+    modelValue: string;
+    defaultValue: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const TabsList: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    readonly as: {
+        readonly type: PropType<string | import('vue').Component>;
+        readonly default: "div";
+    };
+    readonly asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    readonly as: {
+        readonly type: PropType<string | import('vue').Component>;
+        readonly default: "div";
+    };
+    readonly asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>> & Readonly<{}>, {
+    readonly as: string | import('vue').Component;
+    readonly asChild: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const TabsTrigger: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    value: {
+        type: StringConstructor;
+        required: true;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    as: {
+        readonly default: "button";
+        readonly type: PropType<string | import('vue').Component>;
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    value: {
+        type: StringConstructor;
+        required: true;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    as: {
+        readonly default: "button";
+        readonly type: PropType<string | import('vue').Component>;
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>> & Readonly<{}>, {
+    as: string | import('vue').Component;
+    asChild: boolean;
+    disabled: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const TabsContent: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    value: {
+        type: StringConstructor;
+        required: true;
+    };
+    as: {
+        readonly type: PropType<string | import('vue').Component>;
+        readonly default: "div";
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    value: {
+        type: StringConstructor;
+        required: true;
+    };
+    as: {
+        readonly type: PropType<string | import('vue').Component>;
+        readonly default: "div";
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>> & Readonly<{}>, {
+    as: string | import('vue').Component;
+    asChild: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/dist/components/toast.d.ts

@@ -0,0 +1,192 @@
+import { PropType, ShallowRef } from 'vue';
+import { Toast } from '@lovince/ui-headless';
+/** One queue per app, so `toast()` works from anywhere — a store, a composable, an event handler. */
+export declare const toastStore: import('@lovince/ui-headless').ToastStore;
+export declare const toast: import('@lovince/ui-headless').ToastApi;
+/** The live list of toasts, for rendering a viewport. */
+export declare const useToasts: () => ShallowRef<readonly Toast[]>;
+/**
+ * Where toasts appear. A live region that exists before any toast does. The
+ * hotkey moves focus into it; timers pause while it is hovered or focused,
+ * or the tab is hidden.
+ */
+export declare const ToastViewport: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    as: {
+        default: string;
+        type: PropType<string | import('vue').Component>;
+    };
+    hotkey: {
+        type: StringConstructor;
+        default: string;
+    };
+    label: {
+        type: StringConstructor;
+        default: string;
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    as: {
+        default: string;
+        type: PropType<string | import('vue').Component>;
+    };
+    hotkey: {
+        type: StringConstructor;
+        default: string;
+    };
+    label: {
+        type: StringConstructor;
+        default: string;
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>> & Readonly<{}>, {
+    as: string | import('vue').Component;
+    asChild: boolean;
+    label: string;
+    hotkey: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const ToastRoot: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    as: {
+        default: string;
+        type: PropType<string | import('vue').Component>;
+    };
+    toast: {
+        type: PropType<Toast>;
+        required: true;
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    as: {
+        default: string;
+        type: PropType<string | import('vue').Component>;
+    };
+    toast: {
+        type: PropType<Toast>;
+        required: true;
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>> & Readonly<{}>, {
+    as: string | import('vue').Component;
+    asChild: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const ToastTitle: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    as: {
+        default: string;
+        type: PropType<string | import('vue').Component>;
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}> | null, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    as: {
+        default: string;
+        type: PropType<string | import('vue').Component>;
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>> & Readonly<{}>, {
+    as: string | import('vue').Component;
+    asChild: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const ToastDescription: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    as: {
+        default: string;
+        type: PropType<string | import('vue').Component>;
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}> | null, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    as: {
+        default: string;
+        type: PropType<string | import('vue').Component>;
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>> & Readonly<{}>, {
+    as: string | import('vue').Component;
+    asChild: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+/** Runs the toast's action, then dismisses it. Renders nothing when the toast has none. */
+export declare const ToastAction: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    readonly as: {
+        readonly default: "button";
+        readonly type: PropType<string | import('vue').Component>;
+    };
+    readonly asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}> | null, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    readonly as: {
+        readonly default: "button";
+        readonly type: PropType<string | import('vue').Component>;
+    };
+    readonly asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>> & Readonly<{}>, {
+    readonly as: string | import('vue').Component;
+    readonly asChild: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const ToastClose: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    label: {
+        type: StringConstructor;
+        default: string;
+    };
+    as: {
+        readonly default: "button";
+        readonly type: PropType<string | import('vue').Component>;
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    label: {
+        type: StringConstructor;
+        default: string;
+    };
+    as: {
+        readonly default: "button";
+        readonly type: PropType<string | import('vue').Component>;
+    };
+    asChild: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+}>> & Readonly<{}>, {
+    as: string | import('vue').Component;
+    asChild: boolean;
+    label: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;