Skip to content

zidane-ui/extensions

import { … } from 'zidane-ui/extensions'ui/src/extensions/index.ts

Components#

ExtensionComponentComponent#

Draws an extension component behind an error boundary, with the item's fallback in its place when it can't.

ExtensionComponentsProviderComponent#

Supplies the loader ExtensionComponent resolves components through. ExtensionsProvider's loadModule mounts one.

ExtensionDialogHostComponent#

Shows routed dialogs on the modal layer and toasts in place. Renders nothing without host.dialogs.

ExtensionDialogViewComponent#

One dialog's surface, in a ModalShell (render it on the modal layer). Toasts aren't drawn here.

ExtensionRendererComponent#

Draws for with the first extension renderer that draws it, else the default view or the markdown fallback.

ExtensionScopeComponent#

Marks the subtree as an extension's UI, for the author hooks. ExtensionComponent sets it; set it yourself to host an extension's UI some other way.

ExtensionScreenComponent#

Draws one extension screen's body, or why there is none.

ExtensionSettingsPageComponent#

Draws one extension settings page. Draws nothing when no extension offers id.

ExtensionSettingsPagesComponent#

Draws the extension settings pages and the settings.section slot.

ExtensionSettingsSectionComponent#

Renders the extensions' locked settings, catalog changes and integrations for the folder in view, over the nearest extensions host (settings, integrations; one left out shows nothing of its part).

ExtensionSettingsWirePageComponent#

One page of an extension's settings: a definition page's rows (its sections, in order), or a SettingsPage item (its component, else its own rows). Draws nothing without an extensions host.

ExtensionSlotComponent#

Draws the extension items of one slot. Draws nothing when there are none.

ExtensionsProviderComponent#

Provides an ExtensionsHost, the ui.tsx loader and optional label overrides to the extension components below it.

ExtensionTitlebarComponent#

The extensions' app.titlebar items: small chips, lowest order first, at most eight per extension. The desktop app puts it in its title bar right of the window controls and the sidebar toggle, the web app in its header. Each item takes clicks inside a window drag region (zg-no-drag), so the bar around it still moves the window. Draws nothing when there are none.

ExtensionWebviewComponent#

Draws one extension webview with its RPC bridge. Draws nothing when no extension offers id or its URL resolves to null.

LinkSessionScopeComponent#

Names the session the links below were clicked in, for the extensions' link handlers.

An anchor that opens href in a new tab, offered to the extensions' link handlers first.

SettingsWireFormComponent#

Draws settings rows over the settings wire.

Functions#

extensionSettingsEntryIdFunction#

The section id of an extension's entry under the Extensions section.

extensionSettingsGroupIdFunction#

The section id of an extension's own group.

extensionSettingsPageIdFunction#

The section id of one page of an extension's own group.

useCarryExtensionsContextFunction#

Returns wrap(node), which puts this tree's extensions host, ui.tsx loader and labels around a node rendered elsewhere: the app's modal layer sits above the providers, so a dialog or screen opened on it carries them in.

useExtensionFunction#

The extension whose UI renders here. Throws outside an extension's component.

useExtensionEffectRouterFunction#

The effect router of the nearest ExtensionsProvider, or null (no provider, or a host without effects).

useExtensionEffectsFunction#

Applies the ctx.ui / ctx.composer calls routed to this client with handler (open the panel, navigate, edit the composer, notify) and reports back what it did. Each call reaches one handler (see ExtensionEffectsOptions), so it is never applied twice. A handler that throws, or returns nothing for a call that expects an answer, reports "did nothing".

The kit applies some calls itself, wherever the part they need is mounted: a composer edit in the composer it is for, navigate({ screen }) on the modal layer (ExtensionDialogHost). An app's handler gets the rest.

useExtensionExportFunction#

The component an extension exports under name, once its module loaded: undefined while loading, null when there is none (no loader, a failed load, a missing export).

useExtensionItemsFunction#

The items of one token, re-rendering when they change. Empty outside an ExtensionsProvider.

useExtensionModuleLoaderFunction#

The loader from the nearest ExtensionComponentsProvider, or null.

useExtensionScopeFunction#

The extension whose UI renders here, or null outside one.

useExtensionScreenFunction#

Returns open(id), which shows an extension screen (or webview) on the modal layer. false when there is no such screen or webview, or no modal layer.

useExtensionSettingsFunction#

This extension's settings: values, locked keys and a setter.

useExtensionSettingsSectionsFunction#

The extensions' settings entries, groups and search entries for SettingsShell (see the module comment). Empty without an extensions host, or one without settings.

useExtensionsHostFunction#

The ExtensionsHost from the nearest ExtensionsProvider, or null outside one.

useExtensionsLabelsFunction#

Returns the extensions components' strings: the defaults merged with any overrides.

useLinkRouterFunction#

The LinkRouter of the nearest extensions host.

useRpcFunction#

A client for one RPC contract: each property is a method (await rpc.add({ n: 1 })). Calls run as this extension's UI, so its own internal methods are allowed. A method's error rejects as an ExtensionsHostError with { code: 'rpc', type, message, data }; without RPC here, unavailable.

useStoreFunction#

A typed store of this extension (ctx.storage.store(name, …) on the backend): its value, and a setter the backend validates. Every window and client sees a write.

Constants#

KIT_EFFECT_PRIORITYConstant#

The priority of the kit's own effect handlers: above an app's default 0.

Interfaces#

ExtensionComponentPropsInterface#

Props for ExtensionComponent.

ExtensionComponentsProviderPropsInterface#

Props for ExtensionComponentsProvider.

ExtensionDialogHostPropsInterface#

Props for ExtensionDialogHost.

ExtensionDialogViewPropsInterface#

Props for ExtensionDialogView.

ExtensionEffectsOptionsInterface#

Options of useExtensionEffects.

ExtensionInfoInterface#

What useExtension returns.

ExtensionRendererPropsInterface#

Props for ExtensionRenderer.

ExtensionScopePropsInterface#

Props for ExtensionScope.

ExtensionScreenPropsInterface#

Props for ExtensionScreen.

ExtensionSettingsPagePropsInterface#

Props for ExtensionSettingsPage.

ExtensionSettingsPagesPropsInterface#

Props for ExtensionSettingsPages.

ExtensionSettingsSectionPropsInterface#

Props for ExtensionSettingsSection.

ExtensionSettingsSectionsInterface#

What useExtensionSettingsSections returns.

ExtensionSettingsSectionsOptionsInterface#

Options of useExtensionSettingsSections.

ExtensionSettingsViewInterface#

What useExtensionSettings returns.

ExtensionSettingsWirePagePropsInterface#

Props for ExtensionSettingsWirePage.

ExtensionSlotPropsInterface#

Props for ExtensionSlot.

ExtensionsProviderPropsInterface#

Props for ExtensionsProvider.

ExtensionWebviewPropsInterface#

Props for ExtensionWebview.

LinkOpenOptionsInterface#

Where a link was opened, as LinkRouter takes it.

LinkRouterInterface#

Opens links through the extensions' link handlers.

LinkSessionScopePropsInterface#

Props for LinkSessionScope.

RoutedLinkPropsInterface#

Props for RoutedLink: an anchor's, plus where it is.

SettingsWireActionStateInterface#

An action row's outcome, as the parent reports it.

SettingsWireFormPropsInterface#

Props for SettingsWireForm.

UseStoreOptionsInterface#

Options of useStore.

Types#

ExtensionEffectHandlerType#

Applies one effect: whether it did (or the open panel ids for panel-state; nothing for notify).

ExtensionModuleLoaderType#

Loads an extension's ui.tsx module: its exports by name.

ExtensionTitlebarPropsType#

Props for ExtensionTitlebar.

LinkRouterSourceType#

Where a link is, for the router: a source the link handlers see, or 'auth', a sign-in page the router never offers to them.

RpcClientType#

A contract's methods by name. Type it with your contract's method signatures.

RpcMethodCallerType#

A method of an RPC contract, as useRpc gives it.