@embedpdf/plugin-ui 1.4.1 → 2.0.0-next.0

package/dist/shared-preact/types.d.ts

@@ -0,0 +1,67 @@
+import { ComponentType } from '../preact/adapter.ts';
+import { ToolbarSchema, PanelSchema, MenuSchema, SelectionMenuSchema } from '../lib/index.ts';
+import { SelectionMenuPropsBase } from '../preact/utils.ts';
+export type { SelectionMenuPropsBase };
+export type UIComponents = Record<string, ComponentType<BaseComponentProps>>;
+/**
+ * Base props that all custom components must accept
+ */
+export interface BaseComponentProps {
+    documentId: string;
+    [key: string]: any;
+}
+/**
+ * Props for toolbar renderer
+ * The app provides a component matching this contract
+ */
+export interface ToolbarRendererProps {
+    schema: ToolbarSchema;
+    documentId: string;
+    isOpen: boolean;
+    onClose?: () => void;
+    className?: string;
+}
+export type ToolbarRenderer = ComponentType<ToolbarRendererProps>;
+/**
+ * Props for panel renderer
+ * The app provides a component matching this contract
+ */
+export interface PanelRendererProps {
+    schema: PanelSchema;
+    documentId: string;
+    isOpen: boolean;
+    onClose: () => void;
+    className?: string;
+}
+export type PanelRenderer = ComponentType<PanelRendererProps>;
+/**
+ * Props for menu renderer
+ * The app provides a component matching this contract
+ */
+export interface MenuRendererProps {
+    schema: MenuSchema;
+    documentId: string;
+    anchorEl: HTMLElement | null;
+    onClose: () => void;
+    container?: HTMLElement | null;
+}
+export type MenuRenderer = ComponentType<MenuRendererProps>;
+/**
+ * Props for the selection menu renderer component
+ */
+export interface SelectionMenuRendererProps {
+    schema: SelectionMenuSchema;
+    documentId: string;
+    /** Full props from the layer including context */
+    props: SelectionMenuPropsBase;
+}
+export type SelectionMenuRenderer = ComponentType<SelectionMenuRendererProps>;
+/**
+ * All renderers the app must provide
+ */
+export interface UIRenderers {
+    toolbar: ToolbarRenderer;
+    panel: PanelRenderer;
+    menu: MenuRenderer;
+    selectionMenu: SelectionMenuRenderer;
+}

package/dist/shared-react/auto-menu-renderer.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Automatically renders menus when opened
+ *
+ * This component:
+ * 1. Listens to UI plugin state for open menus
+ * 2. Looks up anchor elements from the anchor registry
+ * 3. Renders menus using the user-provided menu renderer
+ */
+export interface AutoMenuRendererProps {
+    container?: HTMLElement | null;
+    documentId: string;
+}
+export declare function AutoMenuRenderer({ container, documentId }: AutoMenuRendererProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/shared-react/hooks/index.d.ts

@@ -1 +1,5 @@
 export * from './use-ui';
+export * from './use-register-anchor';
+export * from './use-item-renderer';
+export * from './use-schema-renderer';
+export * from './use-selection-menu';

package/dist/shared-react/hooks/use-item-renderer.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Helper utilities for building renderers
+ */
+export declare function useItemRenderer(): {
+    /**
+     * Render a custom component by ID
+     *
+     * @param componentId - Component ID from schema
+     * @param documentId - Document ID
+     * @param props - Additional props to pass to component
+     * @returns Rendered component or null if not found
+     */
+    renderCustomComponent: (componentId: string, documentId: string, props?: any) => import("react/jsx-runtime").JSX.Element | null;
+};

package/dist/shared-react/hooks/use-register-anchor.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Register a DOM element as an anchor for menus
+ *
+ * @param documentId - Document ID
+ * @param itemId - Item ID (typically matches the toolbar/menu item ID)
+ * @returns Ref callback to attach to the element
+ *
+ * @example
+ * ```tsx
+ * function ZoomButton({ documentId }: Props) {
+ *   const anchorRef = useRegisterAnchor(documentId, 'zoom-button');
+ *
+ *   return <button ref={anchorRef}>Zoom</button>;
+ * }
+ * ```
+ */
+export declare function useRegisterAnchor(documentId: string, itemId: string): (element: HTMLElement | null) => void;

package/dist/shared-react/hooks/use-schema-renderer.d.ts

@@ -0,0 +1,61 @@
+/**
+ * High-level hook for rendering UI from schema
+ *
+ * Provides simple functions to render toolbars and panels by placement+slot.
+ * Always passes isOpen state to renderers so they can control animations.
+ *
+ * Automatically subscribes to UI state changes for the given document.
+ */
+export declare function useSchemaRenderer(documentId: string): {
+    /**
+     * Render a toolbar by placement and slot
+     *
+     * Always renders with isOpen state when toolbar exists in slot.
+     *
+     * @param placement - 'top' | 'bottom' | 'left' | 'right'
+     * @param slot - Slot name (e.g. 'main', 'secondary')
+     *
+     * @example
+     * ```tsx
+     * {renderToolbar('top', 'main')}
+     * {renderToolbar('top', 'secondary')}
+     * ```
+     */
+    renderToolbar: (placement: "top" | "bottom" | "left" | "right", slot: string) => import("react/jsx-runtime").JSX.Element | null;
+    /**
+     * Render a panel by placement and slot
+     *
+     * ALWAYS renders (when panel exists in slot) with isOpen state.
+     * Your renderer controls whether to display or animate.
+     *
+     * @param placement - 'left' | 'right' | 'top' | 'bottom'
+     * @param slot - Slot name (e.g. 'main', 'secondary', 'inspector')
+     *
+     * @example
+     * ```tsx
+     * {renderPanel('left', 'main')}
+     * {renderPanel('right', 'main')}
+     * ```
+     */
+    renderPanel: (placement: "left" | "right" | "top" | "bottom", slot: string) => import("react/jsx-runtime").JSX.Element | null;
+    /**
+     * Helper: Get all active toolbars for this document
+     * Useful for batch rendering or debugging
+     */
+    getActiveToolbars: () => {
+        placement: string;
+        slot: string;
+        toolbarId: string;
+        isOpen: boolean;
+    }[];
+    /**
+     * Helper: Get all active panels for this document
+     * Useful for batch rendering or debugging
+     */
+    getActivePanels: () => {
+        placement: string;
+        slot: string;
+        panelId: string;
+        isOpen: boolean;
+    }[];
+};

package/dist/shared-react/hooks/use-selection-menu.d.ts

@@ -0,0 +1,11 @@
+import { SelectionMenuRenderFn } from '../../react/utils.ts';
+/**
+ * Creates a render function for a selection menu from the schema
+ *
+ * @param menuId - The selection menu ID from schema
+ * @param documentId - Document ID
+ * @returns A render function compatible with layer selectionMenu props
+ */
+export declare function useSelectionMenu<TContext extends {
+    type: string;
+}>(menuId: string, documentId: string): SelectionMenuRenderFn<TContext> | undefined;

package/dist/shared-react/hooks/use-ui.d.ts

@@ -1,11 +1,19 @@
-import { UIPlugin } from '../../lib/index.ts';
-export declare const useUIPlugin: () => {
-    plugin: UIPlugin | null;
+import { UIPlugin, UIDocumentState, UISchema } from '../../lib/index.ts';
+export declare const useUICapability: () => {
+    provides: Readonly<import('../../lib/index.ts').UICapability> | null;
     isLoading: boolean;
     ready: Promise<void>;
 };
-export declare const useUICapability: () => {
-    provides: Readonly<import('../../lib/index.ts').UICapability> | null;
+export declare const useUIPlugin: () => {
+    plugin: UIPlugin | null;
     isLoading: boolean;
     ready: Promise<void>;
 };
+/**
+ * Get UI state for a document
+ */
+export declare const useUIState: (documentId: string) => UIDocumentState | null;
+/**
+ * Get UI schema
+ */
+export declare const useUISchema: () => UISchema | null;

package/dist/shared-react/index.d.ts

@@ -1,3 +1,6 @@
-export * from './components';
 export * from './hooks';
+export * from './registries';
+export { UIProvider } from './provider';
+export type { UIProviderProps } from './provider';
+export * from './types';
 export * from '../lib/index.ts';

package/dist/shared-react/provider.d.ts

@@ -0,0 +1,68 @@
+import { ReactNode, ComponentType, HTMLAttributes } from '../react/adapter.ts';
+import { BaseComponentProps, UIRenderers } from './types';
+/**
+ * UIProvider Props
+ */
+export interface UIProviderProps extends HTMLAttributes<HTMLDivElement> {
+    children: ReactNode;
+    /**
+     * Document ID for this UI context
+     * Required for menu rendering
+     */
+    documentId: string;
+    /**
+     * Custom component registry
+     * Maps component IDs to components
+     */
+    components?: Record<string, ComponentType<BaseComponentProps>>;
+    /**
+     * REQUIRED: User-provided renderers
+     * These define how toolbars, panels, and menus are displayed
+     */
+    renderers: UIRenderers;
+    /**
+     * Optional: Container for menu portal
+     * Defaults to document.body
+     */
+    menuContainer?: HTMLElement | null;
+}
+/**
+ * UIProvider - Single provider for all UI plugin functionality
+ *
+ * Manages:
+ * - Anchor registry for menu positioning
+ * - Component registry for custom components
+ * - Renderers for toolbars, panels, and menus
+ * - Automatic menu rendering
+ *
+ * @example
+ * ```tsx
+ * <EmbedPDF engine={engine} plugins={plugins}>
+ *   {({ pluginsReady }) => (
+ *     pluginsReady && (
+ *       <DocumentContext>
+ *         {({ activeDocumentId }) => (
+ *           activeDocumentId && (
+ *             <UIProvider
+ *               documentId={activeDocumentId}
+ *               components={{
+ *                 'thumbnail-panel': ThumbnailPanel,
+ *                 'bookmark-panel': BookmarkPanel,
+ *               }}
+ *               renderers={{
+ *                 toolbar: ToolbarRenderer,
+ *                 panel: PanelRenderer,
+ *                 menu: MenuRenderer,
+ *               }}
+ *             >
+ *               <ViewerLayout />
+ *             </UIProvider>
+ *           )
+ *         )}
+ *       </DocumentContext>
+ *     )
+ *   )}
+ * </EmbedPDF>
+ * ```
+ */
+export declare function UIProvider({ children, documentId, components, renderers, menuContainer, ...restProps }: UIProviderProps): import("react/jsx-runtime").JSX.Element;

package/dist/shared-react/registries/anchor-registry.d.ts

@@ -0,0 +1,16 @@
+import { ReactNode } from '../../react/adapter.ts';
+/**
+ * Anchor Registry
+ *
+ * Tracks DOM elements for menu positioning.
+ * Each anchor is scoped by documentId and itemId.
+ */
+export interface AnchorRegistry {
+    register(documentId: string, itemId: string, element: HTMLElement): void;
+    unregister(documentId: string, itemId: string): void;
+    getAnchor(documentId: string, itemId: string): HTMLElement | null;
+}
+export declare function AnchorRegistryProvider({ children }: {
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function useAnchorRegistry(): AnchorRegistry;

package/dist/shared-react/registries/component-registry.d.ts

@@ -0,0 +1,20 @@
+import { ComponentType, ReactNode } from '../../react/adapter.ts';
+import { BaseComponentProps } from '../types';
+/**
+ * Component Registry
+ *
+ * Stores custom components that can be referenced in the UI schema.
+ */
+export interface ComponentRegistry {
+    register(id: string, component: ComponentType<BaseComponentProps>): void;
+    unregister(id: string): void;
+    get(id: string): ComponentType<BaseComponentProps> | undefined;
+    has(id: string): boolean;
+    getRegisteredIds(): string[];
+}
+export interface ComponentRegistryProviderProps {
+    children: ReactNode;
+    initialComponents?: Record<string, ComponentType<BaseComponentProps>>;
+}
+export declare function ComponentRegistryProvider({ children, initialComponents, }: ComponentRegistryProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function useComponentRegistry(): ComponentRegistry;

package/dist/shared-react/registries/index.d.ts

@@ -0,0 +1,3 @@
+export * from './anchor-registry';
+export * from './component-registry';
+export * from './renderers-registry';

package/dist/shared-react/registries/renderers-registry.d.ts

@@ -0,0 +1,8 @@
+import { ReactNode } from '../../react/adapter.ts';
+import { UIRenderers } from '../types';
+export interface RenderersProviderProps {
+    children: ReactNode;
+    renderers: UIRenderers;
+}
+export declare function RenderersProvider({ children, renderers }: RenderersProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function useRenderers(): UIRenderers;

package/dist/shared-react/root.d.ts

@@ -0,0 +1,12 @@
+import { ReactNode, HTMLAttributes } from '../react/adapter.ts';
+interface UIRootProps extends HTMLAttributes<HTMLDivElement> {
+    children: ReactNode;
+}
+/**
+ * Internal component that handles:
+ * 1. Injecting the generated stylesheet (into shadow root or document.head)
+ * 2. Managing the data-disabled-categories attribute
+ * 3. Updating styles on locale changes
+ */
+export declare function UIRoot({ children, ...restProps }: UIRootProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/shared-react/types.d.ts

@@ -0,0 +1,67 @@
+import { ComponentType } from '../react/adapter.ts';
+import { ToolbarSchema, PanelSchema, MenuSchema, SelectionMenuSchema } from '../lib/index.ts';
+import { SelectionMenuPropsBase } from '../react/utils.ts';
+export type { SelectionMenuPropsBase };
+export type UIComponents = Record<string, ComponentType<BaseComponentProps>>;
+/**
+ * Base props that all custom components must accept
+ */
+export interface BaseComponentProps {
+    documentId: string;
+    [key: string]: any;
+}
+/**
+ * Props for toolbar renderer
+ * The app provides a component matching this contract
+ */
+export interface ToolbarRendererProps {
+    schema: ToolbarSchema;
+    documentId: string;
+    isOpen: boolean;
+    onClose?: () => void;
+    className?: string;
+}
+export type ToolbarRenderer = ComponentType<ToolbarRendererProps>;
+/**
+ * Props for panel renderer
+ * The app provides a component matching this contract
+ */
+export interface PanelRendererProps {
+    schema: PanelSchema;
+    documentId: string;
+    isOpen: boolean;
+    onClose: () => void;
+    className?: string;
+}
+export type PanelRenderer = ComponentType<PanelRendererProps>;
+/**
+ * Props for menu renderer
+ * The app provides a component matching this contract
+ */
+export interface MenuRendererProps {
+    schema: MenuSchema;
+    documentId: string;
+    anchorEl: HTMLElement | null;
+    onClose: () => void;
+    container?: HTMLElement | null;
+}
+export type MenuRenderer = ComponentType<MenuRendererProps>;
+/**
+ * Props for the selection menu renderer component
+ */
+export interface SelectionMenuRendererProps {
+    schema: SelectionMenuSchema;
+    documentId: string;
+    /** Full props from the layer including context */
+    props: SelectionMenuPropsBase;
+}
+export type SelectionMenuRenderer = ComponentType<SelectionMenuRendererProps>;
+/**
+ * All renderers the app must provide
+ */
+export interface UIRenderers {
+    toolbar: ToolbarRenderer;
+    panel: PanelRenderer;
+    menu: MenuRenderer;
+    selectionMenu: SelectionMenuRenderer;
+}

package/dist/svelte/auto-menu-renderer.svelte.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Automatically renders menus when opened
+ *
+ * This component:
+ * 1. Listens to UI plugin state for open menus
+ * 2. Looks up anchor elements from the anchor registry
+ * 3. Renders menus using the user-provided menu renderer
+ */
+interface Props {
+    documentId: string;
+    container?: HTMLElement | null;
+}
+declare const AutoMenuRenderer: import('svelte', { with: { "resolution-mode": "import" } }).Component<Props, {}, "">;
+type AutoMenuRenderer = ReturnType<typeof AutoMenuRenderer>;
+export default AutoMenuRenderer;

package/dist/svelte/hooks/index.d.ts

@@ -0,0 +1,5 @@
+export * from './use-ui.svelte';
+export * from './use-register-anchor.svelte';
+export * from './use-item-renderer.svelte';
+export * from './use-schema-renderer.svelte';
+export * from './use-selection-menu.svelte';

package/dist/svelte/hooks/use-item-renderer.svelte.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Helper utilities for building renderers
+ */
+export declare function useItemRenderer(): {
+    /**
+     * Get a custom component by ID
+     *
+     * @param componentId - Component ID from schema
+     * @returns Component constructor or undefined if not found
+     *
+     * @example
+     * ```svelte
+     * <script lang="ts">
+     *   const { getCustomComponent } = useItemRenderer();
+     *   const MyComponent = getCustomComponent('my-component-id');
+     * </script>
+     *
+     * {#if MyComponent}
+     *   <MyComponent {documentId} {...props} />
+     * {/if}
+     * ```
+     */
+    getCustomComponent: (componentId: string) => import('svelte').Component<import('..').BaseComponentProps, {}, string> | undefined;
+};

package/dist/svelte/hooks/use-register-anchor.svelte.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Register a DOM element as an anchor for menus
+ *
+ * @param getDocumentId - Function returning document ID
+ * @param getItemId - Function returning item ID (typically matches the toolbar/menu item ID)
+ * @returns Function to attach to the element via use:action
+ *
+ * @example
+ *
+ * <script lang="ts">
+ *   const registerAnchor = useRegisterAnchor(() => documentId, () => 'zoom-button');
+ * </script>
+ *
+ * <button use:registerAnchor>Zoom</button>
+ *  */
+export declare function useRegisterAnchor(getDocumentId: () => string | null, getItemId: () => string): (element: HTMLElement) => {
+    destroy(): void;
+};

package/dist/svelte/hooks/use-schema-renderer.svelte.d.ts

@@ -0,0 +1,78 @@
+/**
+ * High-level hook for rendering UI from schema
+ *
+ * Provides information about active toolbars and panels by placement+slot.
+ * Always includes isOpen state so renderers can control animations.
+ *
+ * Use with Svelte's component binding to render toolbars and panels.
+ *
+ * @example
+ * ```svelte
+ * <script lang="ts">
+ *   const { getToolbarInfo, getPanelInfo } = useSchemaRenderer(() => documentId);
+ *
+ *   const topMainToolbar = $derived(getToolbarInfo('top', 'main'));
+ *   const leftMainPanel = $derived(getPanelInfo('left', 'main'));
+ * </script>
+ *
+ * {#if topMainToolbar}
+ *   {@const ToolbarRenderer = topMainToolbar.renderer}
+ *   <ToolbarRenderer
+ *     schema={topMainToolbar.schema}
+ *     documentId={topMainToolbar.documentId}
+ *     isOpen={topMainToolbar.isOpen}
+ *     onClose={topMainToolbar.onClose}
+ *   />
+ * {/if}
+ * ```
+ */
+export declare function useSchemaRenderer(getDocumentId: () => string | null): {
+    /**
+     * Get toolbar information by placement and slot
+     *
+     * @param placement - 'top' | 'bottom' | 'left' | 'right'
+     * @param slot - Slot name (e.g. 'main', 'secondary')
+     * @returns Toolbar info or null if no toolbar in slot
+     */
+    getToolbarInfo: (placement: "top" | "bottom" | "left" | "right", slot: string) => {
+        renderer: import('..').ToolbarRenderer;
+        schema: import('../../lib').ToolbarSchema;
+        documentId: string;
+        isOpen: boolean;
+        onClose: (() => void) | undefined;
+    } | null;
+    /**
+     * Get panel information by placement and slot
+     *
+     * @param placement - 'left' | 'right' | 'top' | 'bottom'
+     * @param slot - Slot name (e.g. 'main', 'secondary', 'inspector')
+     * @returns Panel info or null if no panel in slot
+     */
+    getPanelInfo: (placement: "left" | "right" | "top" | "bottom", slot: string) => {
+        renderer: import('..').PanelRenderer;
+        schema: import('../../lib').PanelSchema;
+        documentId: string;
+        isOpen: boolean;
+        onClose: () => void;
+    } | null;
+    /**
+     * Helper: Get all active toolbars for this document
+     * Useful for batch rendering or debugging
+     */
+    getActiveToolbars: () => {
+        placement: string;
+        slot: string;
+        toolbarId: string;
+        isOpen: boolean;
+    }[];
+    /**
+     * Helper: Get all active panels for this document
+     * Useful for batch rendering or debugging
+     */
+    getActivePanels: () => {
+        placement: string;
+        slot: string;
+        panelId: string;
+        isOpen: boolean;
+    }[];
+};

package/dist/svelte/hooks/use-selection-menu.svelte.d.ts

@@ -0,0 +1,9 @@
+import { SelectionMenuRenderFn } from '@embedpdf/utils/svelte';
+/**
+ * Hook for schema-driven selection menus
+ */
+export declare function useSelectionMenu<TContext extends {
+    type: string;
+}>(menuId: string | (() => string), getDocumentId: () => string): {
+    readonly renderFn: SelectionMenuRenderFn<TContext> | undefined;
+};

package/dist/svelte/hooks/use-ui.svelte.d.ts

@@ -0,0 +1,34 @@
+import { UIPlugin, UIDocumentState, UISchema, UIScope } from '../../lib';
+/**
+ * Hook to get the raw UI plugin instance.
+ */
+export declare const useUIPlugin: () => {
+    plugin: UIPlugin | null;
+    isLoading: boolean;
+    ready: Promise<void>;
+};
+/**
+ * Hook to get the UI plugin's capability API.
+ */
+export declare const useUICapability: () => {
+    provides: Readonly<import('../../lib').UICapability> | null;
+    isLoading: boolean;
+    ready: Promise<void>;
+};
+interface UseUIStateReturn {
+    provides: UIScope | null;
+    state: UIDocumentState | null;
+}
+/**
+ * Hook for UI state for a specific document
+ * @param getDocumentId Function that returns the document ID
+ */
+export declare const useUIState: (getDocumentId: () => string | null) => UseUIStateReturn;
+/**
+ * Hook to get UI schema
+ * Returns an object with a reactive getter for the schema
+ */
+export declare const useUISchema: () => {
+    readonly schema: UISchema | null;
+};
+export {};

package/dist/svelte/index.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@embedpdf/plugin-ui"),t=require("svelte/internal/client"),n=require("@embedpdf/core/svelte"),r=require("svelte");function o(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e)for(const n in e)if("default"!==n){const r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:()=>e[n]})}return t.default=e,Object.freeze(t)}require("svelte/internal/disclose-version");const s=o(t),i=()=>n.usePlugin(e.UIPlugin.id),l=()=>n.useCapability(e.UIPlugin.id),u=e=>{const t=l();let n=s.state(null);const r=s.derived(e),o=s.derived(()=>t.provides&&s.get(r)?t.provides.forDocument(s.get(r)):null);return s.user_effect(()=>{const e=t.provides,o=s.get(r);if(!e||!o)return void s.set(n,null);const i=e.forDocument(o);s.set(n,i.getState(),!0);const l=i.onToolbarChanged(()=>{s.set(n,i.getState(),!0)}),u=i.onPanelChanged(()=>{s.set(n,i.getState(),!0)}),c=i.onModalChanged(()=>{s.set(n,i.getState(),!0)}),d=i.onMenuChanged(()=>{s.set(n,i.getState(),!0)});return()=>{l(),u(),c(),d()}}),{get provides(){return s.get(o)},get state(){return s.get(n)}}},c=Symbol("AnchorRegistry");function d(){const e=new Map;return{register(t,n,r){const o=`${t}:${n}`;e.set(o,r)},unregister(t,n){const r=`${t}:${n}`;e.delete(r)},getAnchor(t,n){const r=`${t}:${n}`;return e.get(r)||null}}}function a(){const e=d();return r.setContext(c,e),e}function p(){const e=r.getContext(c);if(!e)throw new Error("useAnchorRegistry must be used within UIProvider");return e}const g=Symbol("ComponentRegistry");function f(e={}){const t=new Map(Object.entries(e));return{register(e,n){t.set(e,n)},unregister(e){t.delete(e)},get:e=>t.get(e),has:e=>t.has(e),getRegisteredIds:()=>Array.from(t.keys())}}function v(e={}){const t=f(e);return r.setContext(g,t),t}function m(){const e=r.getContext(g);if(!e)throw new Error("useComponentRegistry must be used within UIProvider");return e}const h=Symbol("Renderers");function I(e){r.setContext(h,e)}function b(){const e=r.getContext(h);if(!e)throw new Error("useRenderers must be used within UIProvider");return e}function y(e,t){s.push(t,!0);let n=s.prop(t,"container",3,null);const r=u(()=>t.documentId),o=l(),i=p(),c=b(),d=s.derived(()=>{var e;const n=(null==(e=r.state)?void 0:e.openMenus)||{},o=Object.keys(n);if(0===o.length)return null;const s=o[0];if(!s)return null;const l=n[s];if(!l||!l.triggeredByItemId)return null;return{menuId:s,anchorEl:i.getAnchor(t.documentId,l.triggeredByItemId)}}),a=s.derived(()=>{var e;return null==(e=o.provides)?void 0:e.getSchema()}),g=s.derived(()=>{if(!s.get(d)||!s.get(a))return null;const e=s.get(a).menus[s.get(d).menuId];return e||(console.warn(`Menu "${s.get(d).menuId}" not found in schema`),null)}),f=()=>{var e;s.get(d)&&(null==(e=r.provides)||e.closeMenu(s.get(d).menuId))},v=c.menu;var m=s.comment(),h=s.first_child(m),I=e=>{v(e,{get schema(){return s.get(g)},get documentId(){return t.documentId},get anchorEl(){return s.get(d).anchorEl},onClose:f,get container(){return n()}})};s.if(h,e=>{s.get(d)&&s.get(g)&&v&&e(I)}),s.append(e,m),s.pop()}var S=s.from_html("<div><!></div>");function C(t,n){s.push(n,!0);let r=s.rest_props(n,["$$slots","$$events","$$legacy","children","class"]);const{plugin:o}=i(),{provides:u}=l();let c=s.state(s.proxy([])),d=s.state(null),a=null,p=null;s.user_effect(()=>{if(!s.get(d)||!o)return void(p=null);p=function(e){const t=e.getRootNode();return t instanceof ShadowRoot?t:document.head}(s.get(d));const t=p.querySelector(e.UI_SELECTORS.STYLES);if(t)return a=t,void(t.textContent=o.getStylesheet());const n=o.getStylesheet(),r=document.createElement("style");return r.setAttribute(e.UI_ATTRIBUTES.STYLES,""),r.textContent=n,p instanceof ShadowRoot?p.insertBefore(r,p.firstChild):p.appendChild(r),a=r,()=>{(null==a?void 0:a.parentNode)&&a.remove(),a=null,p=null}}),s.user_effect(()=>{if(o)return o.onStylesheetInvalidated(()=>{a&&(a.textContent=o.getStylesheet())})}),s.user_effect(()=>{if(u)return s.set(c,u.getDisabledCategories(),!0),u.onCategoryChanged(e=>{s.set(c,e.disabledCategories,!0)})});const g=s.derived(()=>s.get(c).length>0?s.get(c).join(" "):void 0);var f=S();s.attribute_effect(f,()=>({...r,[e.UI_ATTRIBUTES.ROOT]:"",...s.get(g)?{[e.UI_ATTRIBUTES.DISABLED_CATEGORIES]:s.get(g)}:{},class:n.class,[s.STYLE]:{"container-type":"inline-size"}}));var v=s.child(f),m=e=>{var t=s.comment(),r=s.first_child(t);s.snippet(r,()=>n.children),s.append(e,t)};s.if(v,e=>{n.children&&e(m)}),s.reset(f),s.bind_this(f,e=>s.set(d,e),()=>s.get(d)),s.append(t,f),s.pop()}var x=s.from_html("<!> <!>",1);exports.AutoMenuRenderer=y,exports.UIProvider=function(e,t){s.push(t,!0);let n=s.prop(t,"components",19,()=>({})),r=s.prop(t,"menuContainer",3,null),o=s.rest_props(t,["$$slots","$$events","$$legacy","children","documentId","components","renderers","menuContainer","class"]);a(),v(n()),I(t.renderers),C(e,s.spread_props({get class(){return t.class}},()=>o,{children:(e,n)=>{var o=x(),i=s.first_child(o);s.snippet(i,()=>t.children),y(s.sibling(i,2),{get documentId(){return t.documentId},get container(){return r()}}),s.append(e,o)},$$slots:{default:!0}})),s.pop()},exports.createAnchorRegistry=d,exports.createComponentRegistry=f,exports.provideAnchorRegistry=a,exports.provideComponentRegistry=v,exports.provideRenderers=I,exports.useAnchorRegistry=p,exports.useComponentRegistry=m,exports.useItemRenderer=function(){const e=m();return{getCustomComponent:t=>{const n=e.get(t);if(n)return n;console.error(`Component "${t}" not found in registry`)}}},exports.useRegisterAnchor=function(e,t){const n=p();let r=s.state(null);const o=s.derived(e),i=s.derived(t);return s.user_effect(()=>{const e=s.get(o),t=s.get(i),l=s.get(r);if(l&&e&&t)return n.register(e,t,l),()=>{n.unregister(e,t)}}),e=>(s.set(r,e,!0),{destroy(){s.set(r,null)}})},exports.useRenderers=b,exports.useSchemaRenderer=function(e){const t=b(),n=l(),r=u(e);return{getToolbarInfo:(o,s)=>{var i;const l=null==(i=n.provides)?void 0:i.getSchema(),u=e();if(!(l&&r.provides&&r.state&&u))return null;const c=`${o}-${s}`,d=r.state.activeToolbars[c];if(!d)return null;const a=l.toolbars[d.toolbarId];if(!a)return console.warn(`Toolbar "${d.toolbarId}" not found in schema`),null;const p=!a.permanent?()=>{var e;null==(e=r.provides)||e.closeToolbarSlot(o,s)}:void 0;return{renderer:t.toolbar,schema:a,documentId:u,isOpen:d.isOpen,onClose:p}},getPanelInfo:(o,s)=>{var i;const l=null==(i=n.provides)?void 0:i.getSchema(),u=e();if(!(l&&r.provides&&r.state&&u))return null;const c=`${o}-${s}`,d=r.state.activePanels[c];if(!d)return null;const a=l.panels[d.panelId];if(!a)return console.warn(`Panel "${d.panelId}" not found in schema`),null;return{renderer:t.panel,schema:a,documentId:u,isOpen:d.isOpen,onClose:()=>{var e;null==(e=r.provides)||e.closePanelSlot(o,s)}}},getActiveToolbars:()=>r.state?Object.entries(r.state.activeToolbars).map(([e,t])=>{const[n,r]=e.split("-");return{placement:n,slot:r,toolbarId:t.toolbarId,isOpen:t.isOpen}}):[],getActivePanels:()=>r.state?Object.entries(r.state.activePanels).map(([e,t])=>{const[n,r]=e.split("-");return{placement:n,slot:r,panelId:t.panelId,isOpen:t.isOpen}}):[]}},exports.useSelectionMenu=function(e,t){const n=l(),r=b(),o="function"==typeof e?e:()=>e,i=s.derived(o),u=s.derived(t),c=s.derived(()=>{var e;return null==(e=n.provides)?void 0:e.getSchema()}),d=s.derived(()=>{var e,t;return null==(t=null==(e=s.get(c))?void 0:e.selectionMenus)?void 0:t[s.get(i)]}),a=s.derived(()=>{if(!s.get(d))return;const e=s.get(d),t=s.get(u),n=r.selectionMenu;return r=>r.selected?{component:n,props:{schema:e,documentId:t,props:r}}:null});return{get renderFn(){return s.get(a)}}},exports.useUICapability=l,exports.useUIPlugin=i,exports.useUISchema=()=>{const e=l();return{get schema(){var t;return(null==(t=e.provides)?void 0:t.getSchema())??null}}},exports.useUIState=u,Object.keys(e).forEach(t=>{"default"===t||Object.prototype.hasOwnProperty.call(exports,t)||Object.defineProperty(exports,t,{enumerable:!0,get:()=>e[t]})});
+//# sourceMappingURL=index.cjs.map