robonen/tools
1
0
Fork 0
Code Issues 1 Pull Requests 2 Actions Packages Projects Releases Wiki Activity

refactor(toolkit): type source any with proper types

Browse Source 
Genuinely type composable any usages (useStepper/useStorage/useForm/
createEventHook/useSorted/etc.) as proper generics/unknown; keep idiomatic
any-function and overload-impl signatures with comments; skipped test -> .todo.
This commit is contained in:
Andrew Robonen
2026-06-15 16:55:07 +07:00
parent 44848bc9e6
commit aa2938cb34
283 changed files with 3505 additions and 3482 deletions
Download Patch File Download Diff File Expand all files Collapse all files
vue/toolkit/src/composables/storage/useStorage/demo.vue
+19 -19
View File
@@ -47,34 +47,34 @@ function removeTag(tag: string) {
</script>
<template>
<div class="w-full max-w-sm flex flex-col gap-4">
<div class="demo-stack max-w-sm">
<div class="flex items-center justify-between">
<span class="text-xs font-medium uppercase tracking-wide text-(--fg-subtle)">Custom storage backend</span>
<span class="inline-flex items-center gap-1.5 rounded-md border border-(--border) bg-(--bg-inset) px-2 py-0.5 text-xs font-medium text-(--fg-muted)">
<span class="demo-label">Custom storage backend</span>
<span class="demo-badge">
in-memory
</span>
</div>
<div class="rounded-xl border border-(--border) bg-(--bg-elevated) p-4 flex flex-col gap-3">
<span class="text-xs font-medium uppercase tracking-wide text-(--fg-subtle)">Tags (Set)</span>
<div class="demo-card p-4 flex flex-col gap-3">
<span class="demo-label">Tags (Set)</span>
<div class="flex flex-wrap gap-1.5 min-h-7">
<span
v-for="tag in tagList"
:key="tag"
class="inline-flex items-center gap-1.5 rounded-md border border-(--border) bg-(--bg-inset) px-2 py-0.5 text-xs font-medium text-(--fg-muted)"
class="demo-badge"
>
{{ tag }}
<button
type="button"
class="text-(--fg-subtle) transition hover:text-(--fg) cursor-pointer"
class="text-fg-subtle transition hover:text-fg cursor-pointer"
:aria-label="`Remove ${tag}`"
@click="removeTag(tag)"
>
&times;
</button>
</span>
<span v-if="tagList.length === 0" class="text-xs text-(--fg-subtle)">No tags yet</span>
<span v-if="tagList.length === 0" class="text-xs text-fg-subtle">No tags yet</span>
</div>
<form class="flex items-center gap-2" @submit.prevent="addTag">
@@ -82,34 +82,34 @@ function removeTag(tag: string) {
v-model="newTag.value"
type="text"
placeholder="add a tag…"
class="w-full rounded-lg border border-(--border) bg-(--bg) px-3 py-2 text-sm text-(--fg) placeholder:text-(--fg-subtle) transition focus:border-(--accent) focus:outline-none focus:ring-2 focus:ring-(--ring)"
class="demo-input"
>
<button
type="submit"
class="inline-flex items-center justify-center gap-1.5 rounded-lg border border-transparent bg-(--accent) px-3 py-1.5 text-sm font-medium text-(--accent-fg) transition hover:bg-(--accent-hover) active:scale-[0.98] cursor-pointer"
class="demo-btn-primary"
>
Add
</button>
</form>
</div>
<div class="rounded-xl border border-(--border) bg-(--bg-elevated) p-4 flex items-center justify-between">
<div class="demo-card p-4 flex items-center justify-between">
<div class="flex flex-col gap-0.5">
<span class="text-xs font-medium uppercase tracking-wide text-(--fg-subtle)">Ticket #</span>
<span class="text-xs text-(--fg-subtle)">zero-padded serializer</span>
<span class="demo-label">Ticket #</span>
<span class="text-xs text-fg-subtle">zero-padded serializer</span>
</div>
<div class="flex items-center gap-3">
<button
type="button"
class="inline-flex h-8 w-8 items-center justify-center rounded-lg border border-(--border) bg-(--bg-inset) text-(--fg) transition hover:border-(--border-strong) active:scale-[0.98] cursor-pointer"
class="inline-flex h-8 w-8 items-center justify-center rounded-lg border border-border bg-bg-inset text-fg transition hover:border-border-strong active:scale-[0.98] cursor-pointer"
@click="ticket = Math.max(0, ticket - 1)"
>
&minus;
</button>
<span class="font-mono text-2xl font-bold tabular-nums text-(--fg)">{{ ticket }}</span>
<span class="demo-stat text-2xl">{{ ticket }}</span>
<button
type="button"
class="inline-flex h-8 w-8 items-center justify-center rounded-lg border border-(--border) bg-(--bg-inset) text-(--fg) transition hover:border-(--border-strong) active:scale-[0.98] cursor-pointer"
class="inline-flex h-8 w-8 items-center justify-center rounded-lg border border-border bg-bg-inset text-fg transition hover:border-border-strong active:scale-[0.98] cursor-pointer"
@click="ticket = ticket + 1"
>
+
@@ -118,10 +118,10 @@ function removeTag(tag: string) {
</div>
<div class="flex flex-col gap-1.5">
<span class="text-xs font-medium uppercase tracking-wide text-(--fg-subtle)">Raw store contents</span>
<div class="rounded-lg border border-(--border) bg-(--bg-inset) p-3 font-mono text-xs text-(--fg) flex flex-col gap-1">
<span class="demo-label">Raw store contents</span>
<div class="rounded-lg border border-border bg-bg-inset p-3 font-mono text-xs text-fg flex flex-col gap-1">
<div v-for="[key, value] in storeEntries" :key="key" class="flex gap-2">
<span class="text-(--fg-subtle) shrink-0">{{ key }}</span>
<span class="text-fg-subtle shrink-0">{{ key }}</span>
<span class="truncate">{{ value }}</span>
</div>
</div>
vue/toolkit/src/composables/storage/useStorage/index.ts
+17 -17
View File
@@ -12,13 +12,13 @@ export interface StorageSerializer<T> {
write: (value: T) => string;
}
export const StorageSerializers: Record<string, StorageSerializer<any>> & {
export const StorageSerializers: Record<string, StorageSerializer<unknown>> & {
boolean: StorageSerializer<boolean>;
number: StorageSerializer<number>;
string: StorageSerializer<string>;
object: StorageSerializer<any>;
map: StorageSerializer<Map<any, any>>;
set: StorageSerializer<Set<any>>;
object: StorageSerializer<unknown>;
map: StorageSerializer<Map<unknown, unknown>>;
set: StorageSerializer<Set<unknown>>;
date: StorageSerializer<Date>;
} = {
boolean: {
@@ -35,15 +35,15 @@ export const StorageSerializers: Record<string, StorageSerializer<any>> & {
},
object: {
read: (v: string) => JSON.parse(v),
write: (v: any) => JSON.stringify(v),
write: (v: unknown) => JSON.stringify(v),
},
map: {
read: (v: string) => new Map(JSON.parse(v)),
write: (v: Map<any, any>) => JSON.stringify([...v.entries()]),
write: (v: Map<unknown, unknown>) => JSON.stringify([...v.entries()]),
},
set: {
read: (v: string) => new Set(JSON.parse(v)),
write: (v: Set<any>) => JSON.stringify([...v]),
write: (v: Set<unknown>) => JSON.stringify([...v]),
},
date: {
read: (v: string) => new Date(v),
@@ -112,15 +112,15 @@ export interface UseStorageOptions<T> extends ConfigurableFlush, ConfigurableWin
export type UseStorageReturn<T> = RemovableRef<T>;
export function guessSerializer<T>(value: T): StorageSerializer<T> {
if (isBoolean(value)) return StorageSerializers.boolean as any;
if (isNumber(value)) return StorageSerializers.number as any;
if (isString(value)) return StorageSerializers.string as any;
if (isMap(value)) return StorageSerializers.map as any;
if (isSet(value)) return StorageSerializers.set as any;
if (isDate(value)) return StorageSerializers.date as any;
if (isObject(value)) return StorageSerializers.object as any;
if (isBoolean(value)) return StorageSerializers.boolean as unknown as StorageSerializer<T>;
if (isNumber(value)) return StorageSerializers.number as unknown as StorageSerializer<T>;
if (isString(value)) return StorageSerializers.string as unknown as StorageSerializer<T>;
if (isMap(value)) return StorageSerializers.map as unknown as StorageSerializer<T>;
if (isSet(value)) return StorageSerializers.set as unknown as StorageSerializer<T>;
if (isDate(value)) return StorageSerializers.date as unknown as StorageSerializer<T>;
if (isObject(value)) return StorageSerializers.object as unknown as StorageSerializer<T>;
return StorageSerializers.object as any;
return StorageSerializers.object as unknown as StorageSerializer<T>;
}
export function shallowMerge<T>(stored: T, defaults: T): T {
@@ -175,7 +175,7 @@ export function useStorage<T>(
window = defaultWindow,
eventFilter,
initOnMounted = false,
onError = console.error, // eslint-disable-line no-console
onError = console.error,
} = options;
const defaults = toValue(initialValue);
@@ -346,7 +346,7 @@ export function useStorage<T>(
if (storage instanceof Storage)
useEventListener(window, 'storage', onStorageEvent, { passive: true });
else
useEventListener(window as any, customStorageEventName as any, onStorageCustomEvent as any);
useEventListener<CustomEvent<StorageEventLike>>(window, customStorageEventName, onStorageCustomEvent);
}
if (initOnMounted) {