From b7a9cbfc684048746e37f609ec6f42449faabca4 Mon Sep 17 00:00:00 2001 From: Adam <2363879+adamdotdevin@users.noreply.github.com> Date: Mon, 15 Dec 2025 10:56:03 -0600 Subject: fix: share page --- packages/ui/src/context/data.tsx | 2 +- packages/ui/src/context/marked.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) (limited to 'packages/ui/src/context') diff --git a/packages/ui/src/context/data.tsx b/packages/ui/src/context/data.tsx index 265178e10..16efe7779 100644 --- a/packages/ui/src/context/data.tsx +++ b/packages/ui/src/context/data.tsx @@ -1,6 +1,6 @@ import type { Message, Session, Part, FileDiff, SessionStatus } from "@opencode-ai/sdk/v2" import { createSimpleContext } from "./helper" -import { PreloadMultiFileDiffResult } from "@pierre/precision-diffs/ssr" +import { PreloadMultiFileDiffResult } from "@pierre/diffs/ssr" type Data = { session: Session[] diff --git a/packages/ui/src/context/marked.tsx b/packages/ui/src/context/marked.tsx index 0d9c44758..f4d85519d 100644 --- a/packages/ui/src/context/marked.tsx +++ b/packages/ui/src/context/marked.tsx @@ -2,7 +2,7 @@ import { marked } from "marked" import markedShiki from "marked-shiki" import { bundledLanguages, type BundledLanguage } from "shiki" import { createSimpleContext } from "./helper" -import { getSharedHighlighter, registerCustomTheme, ThemeRegistrationResolved } from "@pierre/precision-diffs" +import { getSharedHighlighter, registerCustomTheme, ThemeRegistrationResolved } from "@pierre/diffs" registerCustomTheme("OpenCode", () => { return Promise.resolve({ -- cgit v1.2.3 From 56452d886d8f34841900ba969d489b5fa49bbad7 Mon Sep 17 00:00:00 2001 From: Dax Raad Date: Mon, 15 Dec 2025 17:13:00 -0500 Subject: fix dialog root complexity --- packages/desktop/src/app.tsx | 78 ++++++------ packages/desktop/src/hooks/use-providers.ts | 2 +- packages/desktop/src/pages/directory-layout.tsx | 5 +- packages/ui/src/context/dialog.tsx | 153 +++++++++++++++--------- 4 files changed, 136 insertions(+), 102 deletions(-) (limited to 'packages/ui/src/context') diff --git a/packages/desktop/src/app.tsx b/packages/desktop/src/app.tsx index bc6f082a4..789a8fa2d 100644 --- a/packages/desktop/src/app.tsx +++ b/packages/desktop/src/app.tsx @@ -12,7 +12,7 @@ import { GlobalSDKProvider } from "@/context/global-sdk" import { TerminalProvider } from "@/context/terminal" import { PromptProvider } from "@/context/prompt" import { NotificationProvider } from "@/context/notification" -import { DialogProvider, DialogRoot } from "@opencode-ai/ui/context/dialog" +import { DialogProvider } from "@opencode-ai/ui/context/dialog" import { CommandProvider } from "@/context/command" import Layout from "@/pages/layout" import Home from "@/pages/home" @@ -36,46 +36,46 @@ const url = export function App() { return ( - - - - - - - - - ( - + + + + + + + + + + ( {props.children} - - )} - > - - - } /> - ( - - - - - - - - )} - /> - - - - - - - - - + )} + > + + + } /> + ( + + + + + + + + )} + /> + + + + + + + + + + ) } diff --git a/packages/desktop/src/hooks/use-providers.ts b/packages/desktop/src/hooks/use-providers.ts index 501ff9d0c..4a73fa055 100644 --- a/packages/desktop/src/hooks/use-providers.ts +++ b/packages/desktop/src/hooks/use-providers.ts @@ -6,8 +6,8 @@ import { createMemo } from "solid-js" export const popularProviders = ["opencode", "anthropic", "github-copilot", "openai", "google", "openrouter", "vercel"] export function useProviders() { - const params = useParams() const globalSync = useGlobalSync() + const params = useParams() const currentDirectory = createMemo(() => base64Decode(params.dir ?? "")) const providers = createMemo(() => { if (currentDirectory()) { diff --git a/packages/desktop/src/pages/directory-layout.tsx b/packages/desktop/src/pages/directory-layout.tsx index 0dbb3f6d6..c909a373d 100644 --- a/packages/desktop/src/pages/directory-layout.tsx +++ b/packages/desktop/src/pages/directory-layout.tsx @@ -6,7 +6,6 @@ import { LocalProvider } from "@/context/local" import { base64Decode } from "@opencode-ai/util/encode" import { DataProvider } from "@opencode-ai/ui/context" import { iife } from "@opencode-ai/util/iife" -import { DialogRoot } from "@opencode-ai/ui/context/dialog" export default function Layout(props: ParentProps) { const params = useParams() @@ -21,9 +20,7 @@ export default function Layout(props: ParentProps) { const sync = useSync() return ( - - {props.children} - + {props.children} ) })} diff --git a/packages/ui/src/context/dialog.tsx b/packages/ui/src/context/dialog.tsx index af5da06f9..fae0c57b4 100644 --- a/packages/ui/src/context/dialog.tsx +++ b/packages/ui/src/context/dialog.tsx @@ -1,79 +1,116 @@ -import { For, Show, type JSX } from "solid-js" -import { createStore } from "solid-js/store" -import { createSimpleContext } from "@opencode-ai/ui/context" +import { + createContext, + createMemo, + createSignal, + getOwner, + Owner, + ParentProps, + runWithOwner, + Show, + useContext, + type JSX, +} from "solid-js" +import { Dialog as Kobalte } from "@kobalte/core/dialog" -type DialogElement = JSX.Element | (() => JSX.Element) +type DialogElement = () => JSX.Element -export const { use: useDialog, provider: DialogProvider } = createSimpleContext({ - name: "Dialog", - init: () => { - const [store, setStore] = createStore({ - stack: [] as { - element: DialogElement - onClose?: () => void - }[], - }) +const Context = createContext>() - return { - get stack() { - return store.stack - }, - push(element: DialogElement, onClose?: () => void) { - setStore("stack", (s) => [...s, { element, onClose }]) - }, - pop() { - const current = store.stack.at(-1) - current?.onClose?.() - setStore("stack", store.stack.slice(0, -1)) - }, - replace(element: DialogElement, onClose?: () => void) { - for (const item of store.stack) { - item.onClose?.() - } - setStore("stack", [{ element, onClose }]) - }, - clear() { - for (const item of store.stack) { - item.onClose?.() - } - setStore("stack", []) - }, - } - }, -}) +function init() { + const [store, setStore] = createSignal< + { + element: DialogElement + onClose?: () => void + owner: Owner + }[] + >([]) -import { Dialog as Kobalte } from "@kobalte/core/dialog" + return { + get stack() { + return store() + }, + push(element: DialogElement, owner: Owner, onClose?: () => void) { + setStore((s) => [...s, { element, onClose, owner }]) + }, + pop() { + const current = store().at(-1) + current?.onClose?.() + setStore((stack) => stack.slice(0, -1)) + }, + replace(element: DialogElement, owner: Owner, onClose?: () => void) { + for (const item of store()) { + item.onClose?.() + } + setStore([{ element, onClose, owner }]) + }, + clear() { + for (const item of store()) { + item.onClose?.() + } + setStore([]) + }, + } +} -export function DialogRoot(props: { children?: JSX.Element }) { - const dialog = useDialog() +export function DialogProvider(props: ParentProps) { + const ctx = init() + const last = createMemo(() => ctx.stack.at(-1)) return ( - <> + {props.children} - 0}> -
- - {(item, index) => ( - +
+ + {(item) => + runWithOwner(item().owner, () => { + return ( { if (!open) { - item.onClose?.() - dialog.pop() + item().onClose?.() + ctx.pop() } }} > - {typeof item.element === "function" ? item.element() : item.element} + {item().element()} - - )} - -
-
- + ) + }) + } + +
+
) } + +export function useDialog() { + const ctx = useContext(Context) + const owner = getOwner() + if (!owner) { + throw new Error("useDialog must be used within a DialogProvider") + } + if (!ctx) { + throw new Error("useDialog must be used within a DialogProvider") + } + return { + get stack() { + return ctx.stack + }, + replace(element: DialogElement, onClose?: () => void) { + ctx.replace(element, owner, onClose) + }, + push(element: DialogElement, onClose?: () => void) { + ctx.push(element, owner, onClose) + }, + pop() { + ctx.pop() + }, + clear() { + ctx.clear() + }, + } +} -- cgit v1.2.3 From dbbcf0b8d041245a8b8feeff159d0bb9801b9924 Mon Sep 17 00:00:00 2001 From: Dax Raad Date: Mon, 15 Dec 2025 18:14:30 -0500 Subject: tui: fix model selection dialog to properly replace current dialog instead of creating nested dialogs --- packages/desktop/src/components/prompt-input.tsx | 4 +- packages/desktop/src/context/notification.tsx | 1 + packages/ui/src/context/dialog.tsx | 70 +++++++++++++----------- 3 files changed, 41 insertions(+), 34 deletions(-) (limited to 'packages/ui/src/context') diff --git a/packages/desktop/src/components/prompt-input.tsx b/packages/desktop/src/components/prompt-input.tsx index 840710152..f2821c3c7 100644 --- a/packages/desktop/src/components/prompt-input.tsx +++ b/packages/desktop/src/components/prompt-input.tsx @@ -864,7 +864,9 @@ export const PromptInput: Component = (props) => { as="div" variant="ghost" onClick={() => - dialog.push(() => (providers.paid().length > 0 ? : )) + dialog.replace(() => + providers.paid().length > 0 ? : , + ) } > {local.model.current()?.name ?? "Select model"} diff --git a/packages/desktop/src/context/notification.tsx b/packages/desktop/src/context/notification.tsx index 9843066ea..839ebfad7 100644 --- a/packages/desktop/src/context/notification.tsx +++ b/packages/desktop/src/context/notification.tsx @@ -58,6 +58,7 @@ export const { use: useNotification, provider: NotificationProvider } = createSi time: Date.now(), viewed: false, } + console.log(event) switch (event.type) { case "session.idle": { const sessionID = event.properties.sessionID diff --git a/packages/ui/src/context/dialog.tsx b/packages/ui/src/context/dialog.tsx index fae0c57b4..50e41c596 100644 --- a/packages/ui/src/context/dialog.tsx +++ b/packages/ui/src/context/dialog.tsx @@ -1,7 +1,9 @@ import { createContext, + createEffect, createMemo, createSignal, + For, getOwner, Owner, ParentProps, @@ -11,6 +13,7 @@ import { type JSX, } from "solid-js" import { Dialog as Kobalte } from "@kobalte/core/dialog" +import { iife } from "@opencode-ai/util/iife" type DialogElement = () => JSX.Element @@ -25,23 +28,49 @@ function init() { }[] >([]) - return { + const result = { get stack() { return store() }, - push(element: DialogElement, owner: Owner, onClose?: () => void) { - setStore((s) => [...s, { element, onClose, owner }]) - }, pop() { const current = store().at(-1) + if (!current) return current?.onClose?.() - setStore((stack) => stack.slice(0, -1)) + setStore((stack) => { + stack.pop() + return [...stack] + }) }, replace(element: DialogElement, owner: Owner, onClose?: () => void) { for (const item of store()) { item.onClose?.() } - setStore([{ element, onClose, owner }]) + setStore([ + { + element: () => + runWithOwner(owner, () => ( + + { + if (!open) { + onClose?.() + result.pop() + } + }} + > + + + {element()} + + + + )), + onClose, + owner, + }, + ]) }, clear() { for (const item of store()) { @@ -50,38 +79,16 @@ function init() { setStore([]) }, } + return result } export function DialogProvider(props: ParentProps) { const ctx = init() - const last = createMemo(() => ctx.stack.at(-1)) return ( {props.children}
- - {(item) => - runWithOwner(item().owner, () => { - return ( - { - if (!open) { - item().onClose?.() - ctx.pop() - } - }} - > - - - {item().element()} - - - ) - }) - } - + {(item) => <>{item.element()}}
) @@ -103,9 +110,6 @@ export function useDialog() { replace(element: DialogElement, onClose?: () => void) { ctx.replace(element, owner, onClose) }, - push(element: DialogElement, onClose?: () => void) { - ctx.push(element, owner, onClose) - }, pop() { ctx.pop() }, -- cgit v1.2.3 From 416a919c6dd4d5d0727850c983fed7cd3273dcf5 Mon Sep 17 00:00:00 2001 From: Dax Raad Date: Mon, 15 Dec 2025 18:21:54 -0500 Subject: tui: fix dialog replacement to prevent nested dialogs from showing simultaneously --- packages/ui/src/context/dialog.tsx | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) (limited to 'packages/ui/src/context') diff --git a/packages/ui/src/context/dialog.tsx b/packages/ui/src/context/dialog.tsx index 50e41c596..b15d96991 100644 --- a/packages/ui/src/context/dialog.tsx +++ b/packages/ui/src/context/dialog.tsx @@ -22,6 +22,7 @@ const Context = createContext>() function init() { const [store, setStore] = createSignal< { + id: string element: DialogElement onClose?: () => void owner: Owner @@ -45,11 +46,13 @@ function init() { for (const item of store()) { item.onClose?.() } + const id = Math.random().toString(36) setStore([ { + id, element: () => runWithOwner(owner, () => ( - + { + console.log("store", ctx.stack.length) + }) return ( {props.children} -- cgit v1.2.3 From 112c58abf516e4523fb698b868a710c40b271559 Mon Sep 17 00:00:00 2001 From: Dax Raad Date: Mon, 15 Dec 2025 19:33:17 -0500 Subject: tui: refactor dialog system to use single active dialog instead of stack --- .../src/components/dialog-connect-provider.tsx | 22 ++-- .../desktop/src/components/dialog-select-file.tsx | 2 +- .../src/components/dialog-select-model-unpaid.tsx | 6 +- .../desktop/src/components/dialog-select-model.tsx | 6 +- .../src/components/dialog-select-provider.tsx | 2 +- packages/desktop/src/components/prompt-input.tsx | 4 +- packages/desktop/src/context/command.tsx | 6 +- packages/desktop/src/context/notification.tsx | 2 +- packages/desktop/src/pages/layout.tsx | 2 +- packages/desktop/src/pages/session.tsx | 8 +- packages/ui/src/context/dialog.tsx | 122 +++++++++------------ 11 files changed, 78 insertions(+), 104 deletions(-) (limited to 'packages/ui/src/context') diff --git a/packages/desktop/src/components/dialog-connect-provider.tsx b/packages/desktop/src/components/dialog-connect-provider.tsx index 4660e1398..0d6737815 100644 --- a/packages/desktop/src/components/dialog-connect-provider.tsx +++ b/packages/desktop/src/components/dialog-connect-provider.tsx @@ -108,20 +108,18 @@ export function DialogConnectProvider(props: { provider: string }) { async function complete() { await globalSDK.client.global.dispose() - setTimeout(() => { - showToast({ - variant: "success", - icon: "circle-check", - title: `${provider().name} connected`, - description: `${provider().name} models are now available to use.`, - }) - dialog.replace(() => ) - }, 1000) + dialog.close() + showToast({ + variant: "success", + icon: "circle-check", + title: `${provider().name} connected`, + description: `${provider().name} models are now available to use.`, + }) } function goBack() { if (methods().length === 1) { - dialog.replace(() => ) + dialog.show(() => ) return } if (store.authorization) { @@ -133,7 +131,7 @@ export function DialogConnectProvider(props: { provider: string }) { setStore("methodIndex", undefined) return } - dialog.replace(() => ) + dialog.show(() => ) } return ( @@ -352,7 +350,7 @@ export function DialogConnectProvider(props: { provider: string }) { }) if (result.error) { // TODO: show error - dialog.clear() + dialog.close() return } await complete() diff --git a/packages/desktop/src/components/dialog-select-file.tsx b/packages/desktop/src/components/dialog-select-file.tsx index b719e15d2..61c518719 100644 --- a/packages/desktop/src/components/dialog-select-file.tsx +++ b/packages/desktop/src/components/dialog-select-file.tsx @@ -27,7 +27,7 @@ export function DialogSelectFile() { if (path) { tabs().open("file://" + path) } - dialog.clear() + dialog.close() }} > {(i) => ( diff --git a/packages/desktop/src/components/dialog-select-model-unpaid.tsx b/packages/desktop/src/components/dialog-select-model-unpaid.tsx index 7cdb24915..77e493d3c 100644 --- a/packages/desktop/src/components/dialog-select-model-unpaid.tsx +++ b/packages/desktop/src/components/dialog-select-model-unpaid.tsx @@ -42,7 +42,7 @@ export const DialogSelectModelUnpaid: Component = () => { local.model.set(x ? { modelID: x.id, providerID: x.provider.id } : undefined, { recent: true, }) - dialog.clear() + dialog.close() }} > {(i) => ( @@ -75,7 +75,7 @@ export const DialogSelectModelUnpaid: Component = () => { }} onSelect={(x) => { if (!x) return - dialog.replace(() => ) + dialog.show(() => ) }} > {(i) => ( @@ -105,7 +105,7 @@ export const DialogSelectModelUnpaid: Component = () => { class="w-full justify-start px-[11px] py-3.5 gap-4.5 text-14-medium" icon="dot-grid" onClick={() => { - dialog.replace(() => ) + dialog.show(() => ) }} > View all providers diff --git a/packages/desktop/src/components/dialog-select-model.tsx b/packages/desktop/src/components/dialog-select-model.tsx index f0b2e6db9..622ab15fb 100644 --- a/packages/desktop/src/components/dialog-select-model.tsx +++ b/packages/desktop/src/components/dialog-select-model.tsx @@ -28,7 +28,7 @@ export const DialogSelectModel: Component<{ provider?: string }> = (props) => { class="h-7 -my-1 text-14-medium" icon="plus-small" tabIndex={-1} - onClick={() => dialog.replace(() => )} + onClick={() => dialog.show(() => )} > Connect provider @@ -57,7 +57,7 @@ export const DialogSelectModel: Component<{ provider?: string }> = (props) => { local.model.set(x ? { modelID: x.id, providerID: x.provider.id } : undefined, { recent: true, }) - dialog.clear() + dialog.close() }} > {(i) => ( @@ -75,7 +75,7 @@ export const DialogSelectModel: Component<{ provider?: string }> = (props) => { diff --git a/packages/desktop/src/components/dialog-select-provider.tsx b/packages/desktop/src/components/dialog-select-provider.tsx index 8da10b1d5..52fac7073 100644 --- a/packages/desktop/src/components/dialog-select-provider.tsx +++ b/packages/desktop/src/components/dialog-select-provider.tsx @@ -34,7 +34,7 @@ export const DialogSelectProvider: Component = () => { }} onSelect={(x) => { if (!x) return - dialog.replace(() => ) + dialog.show(() => ) }} > {(i) => ( diff --git a/packages/desktop/src/components/prompt-input.tsx b/packages/desktop/src/components/prompt-input.tsx index f2821c3c7..6e147242d 100644 --- a/packages/desktop/src/components/prompt-input.tsx +++ b/packages/desktop/src/components/prompt-input.tsx @@ -864,9 +864,7 @@ export const PromptInput: Component = (props) => { as="div" variant="ghost" onClick={() => - dialog.replace(() => - providers.paid().length > 0 ? : , - ) + dialog.show(() => (providers.paid().length > 0 ? : )) } > {local.model.current()?.name ?? "Select model"} diff --git a/packages/desktop/src/context/command.tsx b/packages/desktop/src/context/command.tsx index d4ef8e166..8fd76ee21 100644 --- a/packages/desktop/src/context/command.tsx +++ b/packages/desktop/src/context/command.tsx @@ -128,7 +128,7 @@ function DialogCommand(props: { options: CommandOption[] }) { groupBy={(x) => x.category ?? ""} onSelect={(option) => { if (option) { - dialog.clear() + dialog.close() option.onSelect?.("palette") } }} @@ -174,8 +174,8 @@ export const { use: useCommand, provider: CommandProvider } = createSimpleContex const suspended = () => suspendCount() > 0 const showPalette = () => { - if (dialog.stack.length === 0) { - dialog.replace(() => !x.disabled)} />) + if (!dialog.active) { + dialog.show(() => !x.disabled)} />) } } diff --git a/packages/desktop/src/context/notification.tsx b/packages/desktop/src/context/notification.tsx index 045361630..ee15bc34a 100644 --- a/packages/desktop/src/context/notification.tsx +++ b/packages/desktop/src/context/notification.tsx @@ -59,7 +59,7 @@ export const { use: useNotification, provider: NotificationProvider } = createSi time: Date.now(), viewed: false, } - switch (event?.type) { + switch (event.type) { case "session.idle": { const sessionID = event.properties.sessionID const [syncStore] = globalSync.child(directory) diff --git a/packages/desktop/src/pages/layout.tsx b/packages/desktop/src/pages/layout.tsx index 2f0c6e050..27852967a 100644 --- a/packages/desktop/src/pages/layout.tsx +++ b/packages/desktop/src/pages/layout.tsx @@ -217,7 +217,7 @@ export default function Layout(props: ParentProps) { ]) function connectProvider() { - dialog.replace(() => ) + dialog.show(() => ) } function navigateToProject(directory: string | undefined) { diff --git a/packages/desktop/src/pages/session.tsx b/packages/desktop/src/pages/session.tsx index 9167ef7b7..390872d36 100644 --- a/packages/desktop/src/pages/session.tsx +++ b/packages/desktop/src/pages/session.tsx @@ -176,7 +176,7 @@ export default function Page() { category: "File", keybind: "mod+p", slash: "open", - onSelect: () => dialog.replace(() => ), + onSelect: () => dialog.show(() => ), }, // { // id: "theme.toggle", @@ -245,7 +245,7 @@ export default function Page() { category: "Model", keybind: "mod+'", slash: "model", - onSelect: () => dialog.replace(() => ), + onSelect: () => dialog.show(() => ), }, { id: "agent.cycle", @@ -320,7 +320,7 @@ export default function Page() { const handleKeyDown = (event: KeyboardEvent) => { if ((document.activeElement as HTMLElement)?.dataset?.component === "terminal") return - if (dialog.stack.length > 0) return + if (dialog.active) return if (event.key === "PageUp" || event.key === "PageDown") { const scrollContainer = document.querySelector('[data-slot="session-turn-content"]') as HTMLElement @@ -613,7 +613,7 @@ export default function Page() { icon="plus-small" variant="ghost" iconSize="large" - onClick={() => dialog.replace(() => )} + onClick={() => dialog.show(() => )} /> diff --git a/packages/ui/src/context/dialog.tsx b/packages/ui/src/context/dialog.tsx index b15d96991..71fc63806 100644 --- a/packages/ui/src/context/dialog.tsx +++ b/packages/ui/src/context/dialog.tsx @@ -1,9 +1,7 @@ import { createContext, createEffect, - createMemo, createSignal, - For, getOwner, Owner, ParentProps, @@ -13,73 +11,58 @@ import { type JSX, } from "solid-js" import { Dialog as Kobalte } from "@kobalte/core/dialog" -import { iife } from "@opencode-ai/util/iife" type DialogElement = () => JSX.Element const Context = createContext>() function init() { - const [store, setStore] = createSignal< - { - id: string - element: DialogElement - onClose?: () => void - owner: Owner - }[] - >([]) + const [active, setActive] = createSignal< + | { + id: string + element: DialogElement + onClose?: () => void + owner: Owner + } + | undefined + >() const result = { - get stack() { - return store() - }, - pop() { - const current = store().at(-1) - if (!current) return - current?.onClose?.() - setStore((stack) => { - stack.pop() - return [...stack] - }) + get active() { + return active() }, - replace(element: DialogElement, owner: Owner, onClose?: () => void) { - for (const item of store()) { - item.onClose?.() - } - const id = Math.random().toString(36) - setStore([ - { - id, - element: () => - runWithOwner(owner, () => ( - - { - if (!open) { - onClose?.() - result.pop() - } - }} - > - - - {element()} - - - - )), - onClose, - owner, - }, - ]) + close() { + active()?.onClose?.() + setActive(undefined) }, - clear() { - for (const item of store()) { - item.onClose?.() - } - setStore([]) + show(element: DialogElement, owner: Owner, onClose?: () => void) { + active()?.onClose?.() + const id = Math.random().toString(36).slice(2) + setActive({ + id, + element: () => + runWithOwner(owner, () => ( + + { + if (!open) { + console.log("closing") + result.close() + } + }} + > + + + {element()} + + + + )), + onClose, + owner, + }) }, } @@ -89,14 +72,12 @@ function init() { export function DialogProvider(props: ParentProps) { const ctx = init() createEffect(() => { - console.log("store", ctx.stack.length) + console.log("active", ctx.active) }) return ( {props.children} -
- {(item) => <>{item.element()}} -
+
{ctx.active?.element?.()}
) } @@ -111,17 +92,14 @@ export function useDialog() { throw new Error("useDialog must be used within a DialogProvider") } return { - get stack() { - return ctx.stack - }, - replace(element: DialogElement, onClose?: () => void) { - ctx.replace(element, owner, onClose) + get active() { + return ctx.active }, - pop() { - ctx.pop() + show(element: DialogElement, onClose?: () => void) { + ctx.show(element, owner, onClose) }, - clear() { - ctx.clear() + close() { + ctx.close() }, } } -- cgit v1.2.3