@wow-two-beta/ui-vue 0.0.2

package/dist/presentation/actions/button/Button.variants.d.ts

@@ -0,0 +1,311 @@
+import { VariantProps } from '../../../foundation/utils';
+import { TVReturnType } from 'tailwind-variants';
+import { TVConfig } from 'tailwind-variants/dist/config.js';
+/** Defines the Button visual surface style. */
+export declare const ButtonVariant: {
+    /** Refers to an opaque, filled surface. */
+    readonly Solid: "solid";
+    /** Refers to a muted/tinted fill. */
+    readonly Soft: "soft";
+    /** Refers to a subtle tinted fill + tone-colored border. */
+    readonly Surface: "surface";
+    /** Refers to a transparent fill + tone border. */
+    readonly Outline: "outline";
+    /** Refers to a borderless, transparent-at-rest button. */
+    readonly Ghost: "ghost";
+    /** Refers to a borderless button that reveals a bordered chip on hover/focus. */
+    readonly Reveal: "reveal";
+    /** Refers to an inline text link. */
+    readonly Link: "link";
+    /** Refers to a translucent glass wash + blur. */
+    readonly Glass: "glass";
+    /** Refers to a glass surface with a hairline border. */
+    readonly GlassSurface: "glass-surface";
+};
+export type ButtonVariant = (typeof ButtonVariant)[keyof typeof ButtonVariant];
+/** Defines the Button silhouette. */
+export declare const ButtonShape: {
+    /** Refers to the default (text-width) shape. */
+    readonly Default: "default";
+    /** Refers to a square (1:1) icon shape. */
+    readonly Square: "square";
+    /** Refers to a circular icon shape. */
+    readonly Circle: "circle";
+};
+export type ButtonShape = (typeof ButtonShape)[keyof typeof ButtonShape];
+/** Button visual surface — see Button.standard.md + Button.spec.md. */
+export declare const buttonVariants: TVReturnType<{
+    variant: {
+        solid: string;
+        soft: string;
+        surface: string;
+        outline: string;
+        ghost: string;
+        reveal: string;
+        link: string;
+        glass: string;
+        'glass-surface': string;
+    };
+    tone: {
+        primary: string;
+        neutral: string;
+        danger: string;
+        success: string;
+        warning: string;
+    };
+    size: {
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+    };
+    shape: {
+        default: string;
+        square: string;
+        circle: string;
+    };
+    fullWidth: {
+        true: string;
+        false: string;
+    };
+    wrap: {
+        true: string;
+        false: string;
+    };
+}, undefined, string[], TVConfig<{
+    variant: {
+        solid: string;
+        soft: string;
+        surface: string;
+        outline: string;
+        ghost: string;
+        reveal: string;
+        link: string;
+        glass: string;
+        'glass-surface': string;
+    };
+    tone: {
+        primary: string;
+        neutral: string;
+        danger: string;
+        success: string;
+        warning: string;
+    };
+    size: {
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+    };
+    shape: {
+        default: string;
+        square: string;
+        circle: string;
+    };
+    fullWidth: {
+        true: string;
+        false: string;
+    };
+    wrap: {
+        true: string;
+        false: string;
+    };
+}, {
+    variant: {
+        solid: string;
+        soft: string;
+        surface: string;
+        outline: string;
+        ghost: string;
+        reveal: string;
+        link: string;
+        glass: string;
+        'glass-surface': string;
+    };
+    tone: {
+        primary: string;
+        neutral: string;
+        danger: string;
+        success: string;
+        warning: string;
+    };
+    size: {
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+    };
+    shape: {
+        default: string;
+        square: string;
+        circle: string;
+    };
+    fullWidth: {
+        true: string;
+        false: string;
+    };
+    wrap: {
+        true: string;
+        false: string;
+    };
+}>, {
+    variant: {
+        solid: string;
+        soft: string;
+        surface: string;
+        outline: string;
+        ghost: string;
+        reveal: string;
+        link: string;
+        glass: string;
+        'glass-surface': string;
+    };
+    tone: {
+        primary: string;
+        neutral: string;
+        danger: string;
+        success: string;
+        warning: string;
+    };
+    size: {
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+    };
+    shape: {
+        default: string;
+        square: string;
+        circle: string;
+    };
+    fullWidth: {
+        true: string;
+        false: string;
+    };
+    wrap: {
+        true: string;
+        false: string;
+    };
+}, undefined, TVReturnType<{
+    variant: {
+        solid: string;
+        soft: string;
+        surface: string;
+        outline: string;
+        ghost: string;
+        reveal: string;
+        link: string;
+        glass: string;
+        'glass-surface': string;
+    };
+    tone: {
+        primary: string;
+        neutral: string;
+        danger: string;
+        success: string;
+        warning: string;
+    };
+    size: {
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+    };
+    shape: {
+        default: string;
+        square: string;
+        circle: string;
+    };
+    fullWidth: {
+        true: string;
+        false: string;
+    };
+    wrap: {
+        true: string;
+        false: string;
+    };
+}, undefined, string[], TVConfig<{
+    variant: {
+        solid: string;
+        soft: string;
+        surface: string;
+        outline: string;
+        ghost: string;
+        reveal: string;
+        link: string;
+        glass: string;
+        'glass-surface': string;
+    };
+    tone: {
+        primary: string;
+        neutral: string;
+        danger: string;
+        success: string;
+        warning: string;
+    };
+    size: {
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+    };
+    shape: {
+        default: string;
+        square: string;
+        circle: string;
+    };
+    fullWidth: {
+        true: string;
+        false: string;
+    };
+    wrap: {
+        true: string;
+        false: string;
+    };
+}, {
+    variant: {
+        solid: string;
+        soft: string;
+        surface: string;
+        outline: string;
+        ghost: string;
+        reveal: string;
+        link: string;
+        glass: string;
+        'glass-surface': string;
+    };
+    tone: {
+        primary: string;
+        neutral: string;
+        danger: string;
+        success: string;
+        warning: string;
+    };
+    size: {
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+    };
+    shape: {
+        default: string;
+        square: string;
+        circle: string;
+    };
+    fullWidth: {
+        true: string;
+        false: string;
+    };
+    wrap: {
+        true: string;
+        false: string;
+    };
+}>, unknown, unknown, undefined>>;
+export type ButtonVariants = VariantProps<typeof buttonVariants>;

package/dist/presentation/actions/button/Button.vue.d.ts

@@ -0,0 +1,119 @@
+import { ButtonType, PressEvent, ColorProp, ColorTone, PaddingProp, RadiusProp, SizePreset, SizeUnion, SizeValue } from '../../../foundation/utils';
+import { ButtonHTMLAttributes, VNodeChild, DefineComponent, ComputedRef, ComponentOptionsMixin, PublicProps, VNodeArrayChildren, VNode, RendererNode, RendererElement, ComponentProvideOptions } from 'vue';
+import { ButtonVariant, ButtonShape, ButtonVariants } from './Button.variants';
+type ButtonSizePreset = Extract<SizePreset, 'xs' | 'sm' | 'md' | 'lg' | 'xl'>;
+export type ButtonSize = SizeUnion<ButtonSizePreset>;
+export interface ButtonProps extends /* @vue-ignore */ Omit<ButtonHTMLAttributes, 'type' | 'disabled' | 'color' | 'onClick'>, Omit<ButtonVariants, 'size' | 'variant' | 'tone' | 'shape'> {
+    /** The visual surface style. */
+    variant?: ButtonVariant;
+    /** The semantic tone palette. */
+    tone?: ColorTone;
+    /** The button silhouette (default · square · circle). */
+    shape?: ButtonShape;
+    /** The size — preset name OR raw value OR explicit dim object; see `ButtonSize` for details. */
+    size?: ButtonSize;
+    /** The per-instance color override for the active `tone`. String → all slots derived; object → per-slot (bg/text/soft/softText/ring). Sets local CSS vars that `bg-{tone}` etc. pick up. */
+    color?: ColorProp;
+    /** The slot before children (logical start). Prefer the `leading` named slot; this prop stays for parity with the React API. */
+    leadingSlot?: VNodeChild;
+    /** The slot after children (logical end). Prefer the `trailing` named slot; this prop stays for parity with the React API. */
+    trailingSlot?: VNodeChild;
+    /** The content shown in place of children on hover / focus-visible (CSS-only swap — no JS hover state).
+       Idle → children visible; hover/focus-visible → `hoverSlot` visible. Pairs with `variant="reveal"`
+       for a reveal-on-hover icon swap. When undefined (and no `hover` slot), children render normally. */
+    hoverSlot?: VNodeChild;
+    /** The indicator shown in place of the built-in `<Spinner/>` when `isLoading` is true. Prefer the `loading` named slot. */
+    loadingSlot?: VNodeChild;
+    /** The action-loading state — replaces leading w/ spinner, sets aria-busy, blocks clicks. */
+    isLoading?: boolean;
+    /** The text that replaces children when loading. No default — consumer supplies (i18n). */
+    loadingText?: string;
+    /** The content-loading state — hides content (preserves dimensions) + shimmer. Mutually exclusive with `isLoading`. */
+    isSkeleton?: boolean;
+    /** The disabled state — removes from focus order, blocks clicks. Forwards to native `disabled`. Inherited from an enclosing `Field` when omitted. */
+    isDisabled?: boolean;
+    /** The full-width state — stretches to fill container width. */
+    isFullWidth?: boolean;
+    /** The multi-line state — allows label wrap; default truncates to single line. */
+    isMultiline?: boolean;
+    /** The as-child flag — renders as the single child element via `Primitive`'s `asChild` merge. */
+    asChild?: boolean;
+    /** The independent padding override (preset token or `{x, y}` object). */
+    padding?: PaddingProp;
+    /** The independent radius override (preset token or raw value). */
+    radius?: RadiusProp;
+    /** The explicit width override. Number = px; string = any CSS unit. */
+    width?: SizeValue;
+    /** The explicit height override. Number = px; string = any CSS unit. */
+    height?: SizeValue;
+    /** The min width reserved so the button doesn't reflow when its label morphs. */
+    minWidth?: SizeValue;
+    /** The min height reserved — symmetric with `minWidth`. */
+    minHeight?: SizeValue;
+    /** The square-size shorthand — applied as fallback for both `width` and `height`. Explicit `width`/`height` win when both are set. Pairs with `shape="square"` / `shape="circle"` for icon buttons. */
+    boxSize?: SizeValue;
+    /** The button type. Default `ButtonType.Button` — NOT browser-default `'submit'`. */
+    type?: ButtonType;
+    /** The long-press duration (ms). Default 500. Out-of-range values trigger a dev warning. */
+    longPressDelay?: number;
+    /** The click-throttle window (ms) — first wins; subsequent swallowed via `preventDefault()`. */
+    debounceMs?: number;
+}
+declare const _default: __VLS_WithSlots< DefineComponent<ButtonProps, {
+    el: ComputedRef<HTMLElement | null>;
+}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+    "press-start": (event: PressEvent<HTMLButtonElement>) => any;
+    "press-end": (event: PressEvent<HTMLButtonElement>) => any;
+    "long-press": (event: PressEvent<HTMLButtonElement>) => any;
+}, string, PublicProps, Readonly<ButtonProps> & Readonly<{
+    "onPress-start"?: ((event: PressEvent<HTMLButtonElement>) => any) | undefined;
+    "onPress-end"?: ((event: PressEvent<HTMLButtonElement>) => any) | undefined;
+    "onLong-press"?: ((event: PressEvent<HTMLButtonElement>) => any) | undefined;
+}>, {
+    type: ButtonType;
+    asChild: boolean;
+    isDisabled: boolean;
+    leadingSlot: string | number | boolean | void | VNodeArrayChildren | VNode<RendererNode, RendererElement, {
+        [key: string]: any;
+    }> | null;
+    trailingSlot: string | number | boolean | void | VNodeArrayChildren | VNode<RendererNode, RendererElement, {
+        [key: string]: any;
+    }> | null;
+    hoverSlot: string | number | boolean | void | VNodeArrayChildren | VNode<RendererNode, RendererElement, {
+        [key: string]: any;
+    }> | null;
+    loadingSlot: string | number | boolean | void | VNodeArrayChildren | VNode<RendererNode, RendererElement, {
+        [key: string]: any;
+    }> | null;
+    isLoading: boolean;
+    isSkeleton: boolean;
+    isFullWidth: boolean;
+    isMultiline: boolean;
+    longPressDelay: number;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>, {
+    default?: (props: {}) => any;
+} & {
+    loading?: (props: {}) => any;
+} & {
+    default?: (props: {}) => any;
+} & {
+    leading?: (props: {}) => any;
+} & {
+    default?: (props: {}) => any;
+} & {
+    hover?: (props: {}) => any;
+} & {
+    trailing?: (props: {}) => any;
+} & {
+    leading?: (props: {}) => any;
+} & {
+    default?: (props: {}) => any;
+} & {
+    trailing?: (props: {}) => any;
+}>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/presentation/actions/button/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Button, type ButtonProps, type ButtonSize } from './Button.vue';
+export { buttonVariants, ButtonVariant, ButtonShape, type ButtonVariants, } from './Button.variants';

package/dist/presentation/actions/buttonGroup/ButtonGroup.vue.d.ts

@@ -0,0 +1,22 @@
+import { HTMLAttributes, DefineComponent, ShallowRef, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+import { Orientation } from '../../../foundation/utils';
+export interface ButtonGroupProps extends /* @vue-ignore */ HTMLAttributes {
+    /** The visual orientation. Default `horizontal`. */
+    orientation?: Orientation;
+    /** The attached state — groups children with collapsed inner radii (connected look). Default `true`. */
+    isAttached?: boolean;
+}
+declare const _default: __VLS_WithSlots< DefineComponent<ButtonGroupProps, {
+    el: Readonly< ShallowRef<HTMLDivElement | null>>;
+}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ButtonGroupProps> & Readonly<{}>, {
+    orientation: Orientation;
+    isAttached: boolean;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>, {
+    default?: (props: {}) => any;
+}>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/presentation/actions/buttonGroup/index.d.ts

@@ -0,0 +1 @@
+export { default as ButtonGroup, type ButtonGroupProps } from './ButtonGroup.vue';

package/dist/presentation/actions/copyButton/CopyButton.vue.d.ts

@@ -0,0 +1,35 @@
+import { ButtonVariant, ButtonProps } from '../button';
+import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+type CopyButtonAttributes = Omit<ButtonProps, 'onClick' | 'children' | 'aria-label' | 'onError'> & {
+    'aria-label': string;
+};
+export interface CopyButtonProps extends /* @vue-ignore */ CopyButtonAttributes {
+    /** The text to copy when the button is activated. */
+    text: string;
+    /** The reset window for the `copied` state in ms. Default 2000. Set 0 to keep `copied` true until the next mount / explicit reset. */
+    resetAfter?: number;
+    /** The aria-label override while copied=true. Falls back to `aria-label` when omitted (i18n discipline — consumer supplies all user-facing strings). */
+    copiedAriaLabel?: string;
+    /** The visual surface style. Default `ghost`. */
+    variant?: ButtonVariant;
+}
+declare const _default: __VLS_WithSlots< DefineComponent<CopyButtonProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+    error: (error: Error) => any;
+}, string, PublicProps, Readonly<CopyButtonProps> & Readonly<{
+    onError?: ((error: Error) => any) | undefined;
+}>, {
+    variant: ButtonVariant;
+    resetAfter: number;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>, {
+    /** The content — receives `{ copied, error }` for a state-driven swap. Falls back to icon-only Copy/Check when omitted. */
+    default?: (props: {
+        copied: boolean;
+        error: Error | null;
+    }) => unknown;
+}>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/presentation/actions/copyButton/index.d.ts

@@ -0,0 +1 @@
+export { default as CopyButton, type CopyButtonProps } from './CopyButton.vue';

package/dist/presentation/actions/disclosureButton/DisclosureButton.vue.d.ts

@@ -0,0 +1,32 @@
+import { ButtonType, Side } from '../../../foundation/utils';
+import { ButtonHTMLAttributes, DefineComponent, ShallowRef, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+export interface DisclosureButtonProps extends /* @vue-ignore */ Omit<ButtonHTMLAttributes, 'children' | 'onChange'> {
+    /** The controlled open state. */
+    isOpen?: boolean;
+    /** The uncontrolled initial state. */
+    defaultOpen?: boolean;
+    /** The side the chevron sits on (`left` · `right`). Default `right`. */
+    chevronSide?: Side;
+    /** The button type. Default `ButtonType.Button`. */
+    type?: ButtonType;
+}
+declare const _default: __VLS_WithSlots< DefineComponent<DisclosureButtonProps, {
+    el: Readonly< ShallowRef<HTMLButtonElement | null>>;
+}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+    "open-change": (open: boolean) => any;
+}, string, PublicProps, Readonly<DisclosureButtonProps> & Readonly<{
+    "onOpen-change"?: ((open: boolean) => any) | undefined;
+}>, {
+    type: ButtonType;
+    isOpen: boolean;
+    defaultOpen: boolean;
+    chevronSide: Side;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>, {
+    default?: (props: {}) => any;
+}>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/presentation/actions/disclosureButton/index.d.ts

@@ -0,0 +1 @@
+export { default as DisclosureButton, type DisclosureButtonProps, } from './DisclosureButton.vue';

package/dist/presentation/actions/fab/FAB.variants.d.ts

@@ -0,0 +1,158 @@
+import { VariantProps } from '../../../foundation/utils';
+import { TVReturnType } from 'tailwind-variants';
+import { TVConfig } from 'tailwind-variants/dist/config.js';
+/** Defines the FAB's visual surface style. */
+export declare const FabVariant: {
+    /** Refers to the primary brand-filled surface. */
+    readonly Primary: "primary";
+    /** Refers to the neutral card surface with a hairline border. */
+    readonly Secondary: "secondary";
+    /** Refers to the destructive / error-filled surface. */
+    readonly Destructive: "destructive";
+};
+export type FabVariant = (typeof FabVariant)[keyof typeof FabVariant];
+/** Defines the FAB's diameter. */
+export declare const FabSize: {
+    /** Refers to the small (2.5rem) diameter. */
+    readonly Sm: "sm";
+    /** Refers to the medium (3.5rem) default diameter. */
+    readonly Md: "md";
+    /** Refers to the large (4rem) diameter. */
+    readonly Lg: "lg";
+};
+export type FabSize = (typeof FabSize)[keyof typeof FabSize];
+export declare const fabVariants: TVReturnType<{
+    variant: {
+        primary: string;
+        secondary: string;
+        destructive: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    position: {
+        'bottom-right': string;
+        'bottom-left': string;
+        'bottom-center': string;
+        'top-right': string;
+        'top-left': string;
+        'top-center': string;
+    };
+}, undefined, "fixed inline-flex items-center justify-center rounded-full shadow-lg transition-all hover:shadow-xl focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50", TVConfig<{
+    variant: {
+        primary: string;
+        secondary: string;
+        destructive: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    position: {
+        'bottom-right': string;
+        'bottom-left': string;
+        'bottom-center': string;
+        'top-right': string;
+        'top-left': string;
+        'top-center': string;
+    };
+}, {
+    variant: {
+        primary: string;
+        secondary: string;
+        destructive: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    position: {
+        'bottom-right': string;
+        'bottom-left': string;
+        'bottom-center': string;
+        'top-right': string;
+        'top-left': string;
+        'top-center': string;
+    };
+}>, {
+    variant: {
+        primary: string;
+        secondary: string;
+        destructive: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    position: {
+        'bottom-right': string;
+        'bottom-left': string;
+        'bottom-center': string;
+        'top-right': string;
+        'top-left': string;
+        'top-center': string;
+    };
+}, undefined, TVReturnType<{
+    variant: {
+        primary: string;
+        secondary: string;
+        destructive: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    position: {
+        'bottom-right': string;
+        'bottom-left': string;
+        'bottom-center': string;
+        'top-right': string;
+        'top-left': string;
+        'top-center': string;
+    };
+}, undefined, "fixed inline-flex items-center justify-center rounded-full shadow-lg transition-all hover:shadow-xl focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50", TVConfig<{
+    variant: {
+        primary: string;
+        secondary: string;
+        destructive: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    position: {
+        'bottom-right': string;
+        'bottom-left': string;
+        'bottom-center': string;
+        'top-right': string;
+        'top-left': string;
+        'top-center': string;
+    };
+}, {
+    variant: {
+        primary: string;
+        secondary: string;
+        destructive: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    position: {
+        'bottom-right': string;
+        'bottom-left': string;
+        'bottom-center': string;
+        'top-right': string;
+        'top-left': string;
+        'top-center': string;
+    };
+}>, unknown, unknown, undefined>>;
+export type FABVariants = VariantProps<typeof fabVariants>;