@volverjs/ui-vue 0.0.10-beta.4 → 0.0.10-beta.40

package/src/test/expect.ts

@@ -1,88 +1,83 @@
-import { expect } from '@storybook/jest'
-import { userEvent } from '@storybook/testing-library'
+/* eslint-disable unused-imports/no-unused-vars */
+/* eslint-disable ts/no-namespace */
+import { userEvent, expect } from '@storybook/test'
 import { axe } from 'jest-axe'
 import { sleep } from '@/test/sleep'
 
 declare global {
-	// eslint-disable-next-line @typescript-eslint/no-namespace
-	namespace jest {
-		// eslint-disable-next-line
-		interface Matchers<R> {
-			toBeChecked: (expected?: HTMLElement) => CustomMatcherResult
-		}
-		// eslint-disable-next-line
-		interface Matchers<R> {
-			toBeClicked: (expected?: HTMLElement) => CustomMatcherResult
-		}
-		// eslint-disable-next-line
-		interface Matchers<R> {
-			toHaveClass: (
-				className: string | string[],
-				expected?: HTMLElement,
-			) => CustomMatcherResult
-		}
-		// eslint-disable-next-line
-		interface Matchers<R> {
-			toHaveImgChild: (
-				imgTag: string,
-				expected?: HTMLElement,
-			) => CustomMatcherResult
-		}
-	}
+    namespace jest {
+        interface Matchers<R> {
+            toBeChecked: (expected?: HTMLElement) => CustomMatcherResult
+        }
+        interface Matchers<R> {
+            toBeClicked: (expected?: HTMLElement) => CustomMatcherResult
+        }
+        interface Matchers<R> {
+            toHaveClass: (
+                className: string | string[],
+                expected?: HTMLElement,
+            ) => CustomMatcherResult
+        }
+        interface Matchers<R> {
+            toHaveImgChild: (
+                imgTag: string,
+                expected?: HTMLElement,
+            ) => CustomMatcherResult
+        }
+    }
 }
 
 expect.extend({
-	async toBeChecked(checkbox: HTMLInputElement) {
-		await checkbox.click()
-		await sleep()
-		if (checkbox.checked) {
-			return {
-				pass: true,
-				message: () => `Checkbox is checked`,
-			}
-		}
-		return {
-			pass: false,
-			message: () => `Checkbox is not checked`,
-		}
-	},
-	async toBeClicked(element: HTMLElement) {
-		const result = {
-			pass: false,
-			message: () => "Click event don't works",
-		}
-		element.addEventListener('click', () => {
-			result.pass = true
-			result.message = () => `Click event works`
-		})
-		await userEvent.click(element)
-		return result
-	},
-	async toHaveNoViolations(element: HTMLElement) {
-		const results = await axe(element)
-		return {
-			pass: results.violations.length === 0,
-			message: () => 'Element has violations',
-		}
-	},
-	async toHaveClass(element: HTMLElement, className: string | string[]) {
-		const classes = !Array.isArray(className) ? [className] : className
-		return {
-			pass: classes.every((cssClass) =>
-				element.classList.contains(cssClass),
-			),
-			message: () =>
+    async toBeChecked(checkbox: HTMLInputElement) {
+        await checkbox.click()
+        await sleep()
+        if (checkbox.checked) {
+            return {
+                pass: true,
+                message: () => `Checkbox is checked`,
+            }
+        }
+        return {
+            pass: false,
+            message: () => `Checkbox is not checked`,
+        }
+    },
+    async toBeClicked(element: HTMLElement) {
+        const result = {
+            pass: false,
+            message: () => 'Click event don\'t works',
+        }
+        element.addEventListener('click', () => {
+            result.pass = true
+            result.message = () => `Click event works`
+        })
+        await userEvent.click(element)
+        return result
+    },
+    async toHaveNoViolations(element: HTMLElement) {
+        const results = await axe(element)
+        return {
+            pass: results.violations.length === 0,
+            message: () => 'Element has violations',
+        }
+    },
+    async toHaveClass(element: HTMLElement, className: string | string[]) {
+        const classes = !Array.isArray(className) ? [className] : className
+        return {
+            pass: classes.every(cssClass =>
+                element.classList.contains(cssClass),
+            ),
+            message: () =>
 				`One of these classes doesn't exist: ${classes.join(', ')}`,
-		}
-	},
-	async toHaveImgChild(element: HTMLElement, imgTag: string) {
-		const img = element.getElementsByTagName(imgTag)
-		return {
-			pass: img.length === 1,
-			message: () =>
-				`${imgTag} not exist!`,
-		}
-	},
+        }
+    },
+    async toHaveImgChild(element: HTMLElement, imgTag: string) {
+        const img = element.getElementsByTagName(imgTag)
+        return {
+            pass: img.length === 1,
+            message: () => `${imgTag} not exist!`,
+        }
+    },
 })
 
 export { expect }

package/src/test/options.ts

@@ -1,17 +1,18 @@
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export const getOptionValue = (args: any, index: number) => {
-	if (args.options && args.options.length > index) {
-		let value = args.options[index]
-		if (args.valueKey) {
-			if (typeof args.valueKey === 'function') {
-				value = args.valueKey(value)
-			} else if (typeof value === 'object') {
-				value = value[args.valueKey]
-			}
-		} else if (typeof value === 'object') {
-			value = value.value
-		}
-		return value
-	}
-	return undefined
+export function getOptionValue(args: any, index: number) {
+    if (args.options && args.options.length > index) {
+        let value = args.options[index]
+        if (args.valueKey) {
+            if (typeof args.valueKey === 'function') {
+                value = args.valueKey(value)
+            }
+            else if (typeof value === 'object') {
+                value = value[args.valueKey]
+            }
+        }
+        else if (typeof value === 'object') {
+            value = value.value
+        }
+        return value
+    }
+    return undefined
 }

package/src/test/sleep.ts

@@ -1,2 +1,3 @@
-export const sleep = async (ms = 300) =>
-	await new Promise((resolve) => setTimeout(resolve, ms))
+export async function sleep(ms = 300) {
+    return await new Promise(resolve => setTimeout(resolve, ms))
+}

package/src/test/types.d.ts

@@ -1,17 +1,17 @@
 export interface PlayAttributes {
-	canvasElement: HTMLElement
-	// eslint-disable-next-line
+    canvasElement: HTMLElement
+    // eslint-disable-next-line
 	args: Record<string, any>
-	name?: string
+    name?: string
 }
 
 interface ComponentConfig {
-	isClickDisabled?: boolean
-	className?: string | string[] | null
-	slotContent?: string | null
-	customText?: string | null
-	customElement?: HTMLElement | HTMLOrSVGElement | null
-	isVertical?: boolean
-	child?: number
-	propName?: string
+    isClickDisabled?: boolean
+    className?: string | string[] | null
+    slotContent?: string | null
+    customText?: string | null
+    customElement?: HTMLElement | HTMLOrSVGElement | null
+    isVertical?: boolean
+    child?: number
+    propName?: string
 }

package/src/types/alert.ts

@@ -1,20 +1,24 @@
-export type AlertModifiers =
-	| 'success'
-	| 'info'
-	| 'warning'
-	| 'danger'
-	| 'brand'
-	| 'accent'
+import type { VvIconProps } from '@/components/VvIcon'
+import type { AlertRole } from '@/constants'
+
+export type AlertModifier =
+    | 'success'
+    | 'info'
+    | 'warning'
+    | 'danger'
+    | 'brand'
+    | 'accent'
+    | string
 
 export type Alert = {
-	id: string | number
-	group: string
-	title?: string
-	icon: string | Record<string, unknown>
-	content?: string
-	footer?: string
-	modifiers: AlertModifiers
-	dismissable: boolean
-	autoClose: number
-	timestamp: number
+    id: string | number
+    title?: string
+    icon?: string | VvIconProps
+    content?: string
+    footer?: string
+    modifiers?: AlertModifier | AlertModifier[]
+    dismissable?: boolean
+    autoClose?: number
+    closeLabel?: string
+    role?: AlertRole
 }

package/src/types/blurhash.ts

@@ -0,0 +1,21 @@
+class ValidationError extends Error {}
+export type BlurhashWorkerType = {
+    encode: (
+        pixels: Uint8ClampedArray,
+        width: number,
+        height: number,
+        componentX: number,
+        componentY: number,
+    ) => string
+    decode: (
+        blurhash: string,
+        width: number,
+        height: number,
+        punch?: number,
+    ) => Uint8ClampedArray
+    isBlurhashValid: (blurhash: string) => {
+        result: boolean
+        errorReason?: string
+    }
+    ValidationError: ValidationError
+}

package/src/types/generic.ts

@@ -1,6 +1,5 @@
 export type Nullable<T> = T | null | undefined
 
-export type Option = {
-	options?: Option[],
-	[key: string]: unknown,
+export type Option = Record<string | number | symbol, any> & {
+    options?: Option[]
 }

package/src/types/group.ts

@@ -1,44 +1,52 @@
 import type { Ref } from 'vue'
-
-/**
- * State shared for a group of elements
- */
-export default interface GroupState {
-	// The key of the group
-	[itemKey: string]: Ref<unknown> | unknown | undefined
-	key: string | number | symbol
-}
+import type { Emitter } from 'mitt'
 
 /**
  * State shared in a group of inputs
  */
-export interface InputGroupState extends GroupState {
-	readonly: Ref<boolean>
-	disabled: Ref<boolean>
-	valid: Ref<boolean>
-	invalid: Ref<boolean>
+export type InputGroupState = {
+    modelValue: Ref<unknown>
+    readonly: Ref<boolean>
+    disabled: Ref<boolean>
+    valid: Ref<boolean>
+    invalid: Ref<boolean>
 }
 
 /**
  * State shared in a group of buttons
  */
-export interface ButtonGroupState extends GroupState {
-	modelValue: Ref<
+export type ButtonGroupState = {
+    modelValue: Ref<
 		string | number | boolean | (string | number | boolean)[] | undefined
 	>
-	disabled: Ref<boolean>
-	toggle: Ref<boolean>
-	multiple: Ref<boolean>
-	unselectable: Ref<boolean>
-	modifiers: Ref<string | string[] | undefined>
+    disabled: Ref<boolean>
+    toggle: Ref<boolean>
+    multiple: Ref<boolean>
+    unselectable: Ref<boolean>
+    modifiers: Ref<string | string[] | undefined>
 }
 
 /**
  * State shared in a group of accordions
  */
-export interface AccordionGroupState extends GroupState {
-	collapse: Ref<boolean>
-	disabled: Ref<boolean>
-	modifiers: Ref<string[] | string | undefined>
-	not: Ref<boolean>
+export type AccordionGroupBusEvents = {
+    toggle: { name: string, value: boolean }
+    register: { name: string }
+    unregister: { name: string }
+    expand: { name?: string | string[] }
+    collapse: { name?: string | string[] }
+}
+export type AccordionGroupState = {
+    disabled: Ref<boolean>
+    modifiers: Ref<string[] | string | undefined>
+    bus: Emitter<AccordionGroupBusEvents>
+}
+
+/**
+ * State shared in a group of alerts
+ */
+export type AlertGroupBusEvents = { close: string }
+export type AlertGroupState = {
+    name?: Ref<string | undefined>
+    bus?: Emitter<AlertGroupBusEvents>
 }

package/src/types/index.ts

@@ -0,0 +1,7 @@
+export * from './alert'
+export * from './floating-ui'
+export * from './generic'
+export * from './group'
+export * from './nav'
+export * from './blurhash'
+export * from './input-file'

package/src/types/input-file.ts

@@ -0,0 +1,18 @@
+export type UploadedFile<Source = undefined> = Source extends undefined
+    ? {
+            name: string
+            size: number
+            type: string
+            url?: string
+            thumbnailUrl?: string
+            lastModified?: number
+        }
+    : {
+            name: string
+            size: number
+            type: string
+            url?: string
+            thumbnailUrl?: string
+            lastModified?: number
+            source: Source
+        }

package/src/types/nav.ts

@@ -1,19 +1,18 @@
-import type { AnchorTarget } from '@/constants'
-
 export type NavItem = {
-	label: string
-	ariaLabel?: string
-	title?: string
-	to?: string | Record<string, unknown>
-	href?: string
-	target?: `${AnchorTarget}`
-	rel?: string
-	disabled?: boolean
-	current?: boolean
-	class?: string | string[]
-	on?: Record<'click' | string, () => void>
+    label: string
+    ariaLabel?: string
+    title?: string
+    to?: string | Record<string, unknown>
+    href?: string
+    target?: string
+    rel?: string
+    disabled?: boolean
+    current?: boolean
+    class?: string | string[]
+    on?: Record<'click' | string, () => void>
+    data?: Record<string, unknown>
 }
 
 export type NavItemTab = NavItem & {
-	tab?: string
+    tab?: string
 }