Composables

Composable function names MUST be prefixed with use.

Composable file names MUST match the function name in camelCase.

Composables MUST return an object with named properties.

Reactive state exposed from composables SHOULD be wrapped with readonly() to prevent external mutations.

Example:

// File: useCart.ts
export function useCart() {
    const items = ref<CartItem[]>([])
    const isLoading = ref(false)

    const totalItems = computed(() =>
        items.value.reduce((sum, item) => sum + item.quantity, 0)
    )

    async function addItem(productId: number, quantity: number) {
        // ...
    }

    return {
        items: readonly(items),
        isLoading: readonly(isLoading),
        totalItems,
        addItem,
    }
}