refactor(toolkit): type source any with proper types

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:
2026-06-15 16:55:07 +07:00
parent 44848bc9e6
commit aa2938cb34
283 changed files with 3505 additions and 3482 deletions
@@ -22,9 +22,9 @@ function addTag() {
</script>
<template>
<div class="flex w-full max-w-md flex-col gap-4">
<div class="demo-stack max-w-md">
<div class="flex items-center justify-between">
<span class="text-xs font-medium uppercase tracking-wide text-(--fg-subtle)">useCloned</span>
<span class="demo-label">useCloned</span>
<span
class="inline-flex items-center gap-1.5 rounded-md border px-2 py-0.5 text-xs font-medium transition"
:class="isModified
@@ -40,40 +40,40 @@ function addTag() {
</div>
<div class="grid grid-cols-2 gap-3">
<div class="rounded-xl border border-(--border) bg-(--bg-elevated) p-4">
<p class="mb-2 text-xs font-medium uppercase tracking-wide text-(--fg-subtle)">Source</p>
<dl class="space-y-1.5 text-sm text-(--fg)">
<div class="demo-card p-4">
<p class="demo-label mb-2">Source</p>
<dl class="space-y-1.5 text-sm text-fg">
<div class="flex justify-between gap-2">
<dt class="text-(--fg-muted)">name</dt>
<dt class="text-fg-muted">name</dt>
<dd class="truncate font-medium">{{ original.name }}</dd>
</div>
<div class="flex justify-between gap-2">
<dt class="text-(--fg-muted)">role</dt>
<dt class="text-fg-muted">role</dt>
<dd class="font-medium">{{ original.role }}</dd>
</div>
<div class="flex justify-between gap-2">
<dt class="text-(--fg-muted)">tags</dt>
<dd class="font-mono text-xs text-(--fg-muted)">{{ original.tags.length }}</dd>
<dt class="text-fg-muted">tags</dt>
<dd class="font-mono text-xs text-fg-muted">{{ original.tags.length }}</dd>
</div>
</dl>
</div>
<div class="rounded-xl border border-(--border) bg-(--bg-elevated) p-4">
<p class="mb-2 text-xs font-medium uppercase tracking-wide text-(--fg-subtle)">Cloned (editable)</p>
<dl class="space-y-1.5 text-sm text-(--fg)">
<div class="demo-card p-4">
<p class="demo-label mb-2">Cloned (editable)</p>
<dl class="space-y-1.5 text-sm text-fg">
<div class="flex justify-between gap-2">
<dt class="text-(--fg-muted)">name</dt>
<dt class="text-fg-muted">name</dt>
<dd class="truncate font-medium">{{ cloned.name }}</dd>
</div>
<div class="flex justify-between gap-2">
<dt class="text-(--fg-muted)">role</dt>
<dt class="text-fg-muted">role</dt>
<dd class="font-medium">{{ cloned.role }}</dd>
</div>
<div class="flex flex-wrap justify-end gap-1">
<span
v-for="tag in cloned.tags"
:key="tag"
class="inline-flex items-center rounded-md border border-(--border) bg-(--bg-inset) px-1.5 py-0.5 font-mono text-[0.65rem] text-(--fg-muted)"
class="inline-flex items-center rounded-md border border-border bg-bg-inset px-1.5 py-0.5 font-mono text-[0.65rem] text-fg-muted"
>
{{ tag }}
</span>
@@ -85,21 +85,21 @@ function addTag() {
<div class="flex flex-wrap gap-2">
<button
type="button"
class="inline-flex items-center justify-center gap-1.5 rounded-lg border border-(--border) bg-(--bg-elevated) px-3 py-1.5 text-sm font-medium text-(--fg) transition hover:border-(--border-strong) hover:bg-(--bg-inset) active:scale-[0.98] cursor-pointer"
class="demo-btn"
@click="bumpOriginal"
>
Cycle source role
</button>
<button
type="button"
class="inline-flex items-center justify-center gap-1.5 rounded-lg border border-(--border) bg-(--bg-elevated) px-3 py-1.5 text-sm font-medium text-(--fg) transition hover:border-(--border-strong) hover:bg-(--bg-inset) active:scale-[0.98] cursor-pointer"
class="demo-btn"
@click="addTag"
>
Edit clone
</button>
<button
type="button"
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 disabled:cursor-not-allowed disabled:opacity-40 disabled:active:scale-100"
class="demo-btn-primary disabled:cursor-not-allowed disabled:opacity-40 disabled:active:scale-100"
:disabled="!isModified"
@click="sync()"
>
@@ -107,7 +107,7 @@ function addTag() {
</button>
</div>
<p class="text-xs text-(--fg-subtle)">
<p class="text-xs text-fg-subtle">
Editing the source auto-resyncs the clone. Editing the clone marks it modified without touching the source.
</p>
</div>