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

package/dist/lib/types.d.ts

@@ -1,203 +1,186 @@
-import { CoreState } from '@embedpdf/core';
-import { UI_PLUGIN_ID } from './manifest';
-import { UIComponent } from './ui-component';
-import { MenuRegistry, MenuManagerCapabilities, IconProps } from './menu/types';
-import { SetHeaderVisiblePayload, TogglePanelPayload, UpdateComponentStatePayload } from './actions';
-export interface UIPluginConfig {
-    enabled: boolean;
-    components: Record<string, UIComponentType>;
-    menuItems?: MenuRegistry;
-}
-export interface UIPluginState {
-    panel: {
-        [id: string]: PanelState;
-    };
-    header: {
-        [id: string]: HeaderState;
-    };
-    groupedItems: {
-        [id: string]: {};
-    };
-    divider: {
-        [id: string]: {};
-    };
-    iconButton: {
-        [id: string]: {};
-    };
-    tabButton: {
-        [id: string]: {};
-    };
-    selectButton: {
-        [id: string]: {};
-    };
-    custom: {
-        [id: string]: any;
-    };
-    floating: {
-        [id: string]: FloatingState;
-    };
-    commandMenu: {
-        [id: string]: CommandMenuState;
-    };
-}
-export type NavbarPlacement = 'top' | 'bottom' | 'left' | 'right';
-export interface childrenFunctionOptions {
-    context?: Record<string, any>;
-    filter?: (childId: string) => boolean;
-}
-export type UICapability = MenuManagerCapabilities & {
-    registerComponentRenderer: (type: string, renderer: (props: any, children: (options?: childrenFunctionOptions) => any[], context?: Record<string, any>) => any) => void;
-    getComponent: <T extends BaseUIComponent<any, any, any>>(id: string) => UIComponent<T> | undefined;
-    getCommandMenu: () => UIComponent<CommandMenuComponent> | undefined;
-    hideCommandMenu: () => void;
-    getHeadersByPlacement: (placement: 'top' | 'bottom' | 'left' | 'right') => UIComponent<HeaderComponent<any>>[];
-    getPanelsByLocation: (location: 'left' | 'right') => UIComponent<PanelComponent<any>>[];
-    getFloatingComponents: (viewportPosition?: 'inside' | 'outside') => UIComponent<FloatingComponent>[];
-    addSlot: (parentId: string, slotId: string, priority?: number) => void;
-    registerComponent: (componentId: string, componentProps: UIComponentType) => UIComponent<any>;
-    togglePanel: (payload: TogglePanelPayload) => void;
-    setHeaderVisible: (payload: SetHeaderVisiblePayload) => void;
-    updateComponentState: <T>(payload: UpdateComponentStatePayload<T>) => void;
-};
-export interface BaseUIComponent<TProps, TInitial = undefined, TStore = any> {
-    id: string;
-    type: string;
-    render?: string;
-    /**
-     * A function that returns a context object for the component's children.
-     */
-    getChildContext?: ((props: TProps) => Record<string, any>) | Record<string, any>;
-    /**
-     * A function that returns a partial set of props from the initial state.
-     */
-    props?: ((init: TInitial) => TProps) | TProps;
-    /**
-     * An object containing the initial state for the component, typed as TInitial.
-     */
-    initialState?: TInitial;
-    /**
-     * A function that, on store changes, returns new or changed props to update
-     * the component with (Redux-like).
-     */
-    mapStateToProps?: (storeState: TStore, ownProps: TProps) => TProps;
-}
-export interface Slot {
-    componentId: string;
+import { BasePluginConfig, EventHook } from '@embedpdf/core';
+import { UISchema } from './schema';
+import { StylesheetConfig } from './utils';
+export * from './schema';
+export interface UIPluginConfig extends BasePluginConfig {
+    /** UI schema */
+    schema: UISchema;
+    /** Categories to disable at initialization */
+    disabledCategories?: string[];
+    /** Config for stylesheet generation */
+    stylesheetConfig?: StylesheetConfig;
+}
+export interface UIState {
+    documents: Record<string, UIDocumentState>;
+    /** Globally disabled categories */
+    disabledCategories: string[];
+}
+/**
+ * Toolbar slot state
+ */
+export interface ToolbarSlotState {
+    toolbarId: string;
+    isOpen: boolean;
+}
+/**
+ * Panel slot state
+ */
+export interface PanelSlotState {
+    panelId: string;
+    isOpen: boolean;
+}
+export interface UIDocumentState {
+    activeToolbars: Record<string, ToolbarSlotState>;
+    activePanels: Record<string, PanelSlotState>;
+    activeModal: string | null;
+    openMenus: Record<string, OpenMenuState>;
+    panelTabs: Record<string, string>;
+}
+/**
+ * Responsive visibility rule for a single item at a specific breakpoint
+ */
+export interface ResponsiveVisibilityRule {
+    breakpointId: string;
+    minWidth?: number;
+    maxWidth?: number;
+    visible: boolean;
     priority: number;
-    className?: string;
-}
-export interface PanelState {
-    open: boolean;
-    visibleChild: string | null;
-}
-export interface PanelProps {
-    location: 'left' | 'right';
-    open: boolean;
-    visibleChild: string | null;
-    [name: string]: any;
-}
-export interface PanelComponent<TStore = any> extends BaseUIComponent<PanelProps, PanelState, TStore> {
-    type: 'panel';
-    slots: Slot[];
-}
-export interface HeaderState {
-    visible?: boolean;
-    visibleChild?: string | null;
-}
-export interface HeaderProps {
-    placement: 'top' | 'bottom' | 'left' | 'right';
-    style?: Record<string, string>;
-    visible?: boolean;
-    visibleChild?: string | null;
-}
-export interface HeaderComponent<TStore = any> extends BaseUIComponent<HeaderProps, HeaderState, TStore> {
-    type: 'header';
-    slots: Slot[];
-}
-export interface GroupedItemsProps {
-    justifyContent?: 'start' | 'center' | 'end';
-    grow?: number;
-    gap?: number;
-}
-export interface GroupedItemsComponent<TStore = any> extends BaseUIComponent<GroupedItemsProps, undefined, TStore> {
-    type: 'groupedItems';
-    slots: Slot[];
-}
-export interface DividerComponent<TStore = any> extends BaseUIComponent<undefined, undefined, TStore> {
-    type: 'divider';
-}
-export interface IconButtonProps {
-    active?: boolean;
-    disabled?: boolean;
-    commandId?: string;
-    iconProps?: IconProps;
-    onClick?: () => void;
-    label?: string;
-    img?: string;
-    color?: string;
-}
-export interface IconButtonComponent<TStore = any> extends BaseUIComponent<IconButtonProps, undefined, TStore> {
-    type: 'iconButton';
-}
-export interface TabButtonProps {
-    active?: boolean;
-    commandId?: string;
-    onClick?: () => void;
-    label: string;
-}
-export interface TabButtonComponent<TStore = any> extends BaseUIComponent<TabButtonProps, undefined, TStore> {
-    type: 'tabButton';
-}
-export interface SelectButtonProps {
-    active?: boolean;
-    commandIds: string[];
-    menuCommandId: string;
-    activeCommandId: string;
-}
-export interface SelectButtonComponent<TStore = any> extends BaseUIComponent<SelectButtonProps, undefined, TStore> {
-    type: 'selectButton';
-}
-export interface CustomComponent<TStore = any> extends BaseUIComponent<any, any, TStore> {
-    type: 'custom';
-    render: string;
-    slots?: Slot[];
-}
-export interface FloatingState {
-    [name: string]: any;
-}
-export interface FloatingComponentProps {
-    scrollerPosition: 'inside' | 'outside';
-    [name: string]: any;
-}
-export interface FloatingComponent<TStore = any> extends BaseUIComponent<FloatingComponentProps, FloatingState, TStore> {
-    type: 'floating';
-    slots?: Slot[];
-}
-export interface CommandMenuState {
-    triggerElement?: HTMLElement;
-    activeCommand: string | null;
-    open: boolean;
-    position?: 'top' | 'bottom' | 'left' | 'right';
-    flatten?: boolean;
-}
-export interface CommandMenuProps {
-    triggerElement?: HTMLElement;
-    activeCommand: string | null;
-    open: boolean;
-    position?: 'top' | 'bottom' | 'left' | 'right';
-    flatten?: boolean;
-}
-export interface CommandMenuComponent<TStore = any> extends BaseUIComponent<CommandMenuProps, CommandMenuState, TStore> {
-    type: 'commandMenu';
-}
-export type WithComponentId<TProps> = TProps & {
-    id: string;
-};
-export type ComponentRenderFunction<TProps> = (props: WithComponentId<TProps>, children: (options?: childrenFunctionOptions) => any[], context?: Record<string, any>) => any;
-export interface GlobalStoreState<TPlugins extends Record<string, any> = {}> {
-    core: CoreState;
-    plugins: {
-        [UI_PLUGIN_ID]: UIPluginState;
-    } & TPlugins;
-}
-export type UIComponentType<TStore = any> = GroupedItemsComponent<TStore> | DividerComponent<TStore> | IconButtonComponent<TStore> | TabButtonComponent<TStore> | HeaderComponent<TStore> | PanelComponent<TStore> | CustomComponent<TStore> | FloatingComponent<TStore> | CommandMenuComponent<TStore> | SelectButtonComponent<TStore>;
+}
+/**
+ * Computed responsive metadata for an item
+ */
+export interface ResponsiveItemMetadata {
+    itemId: string;
+    /** Always true for SSR/hydration - actual visibility controlled by CSS/styles */
+    shouldRender: boolean;
+    /** Ordered rules from lowest to highest breakpoint */
+    visibilityRules: ResponsiveVisibilityRule[];
+    /** Quick lookup: is visible at default/base size? */
+    defaultVisible: boolean;
+}
+/**
+ * Result of processing all responsive rules
+ */
+export interface ResponsiveMetadata {
+    items: Map<string, ResponsiveItemMetadata>;
+    breakpoints: Map<string, {
+        minWidth?: number;
+        maxWidth?: number;
+    }>;
+}
+export interface ToolbarChangedData {
+    placement: string;
+    slot: string;
+    toolbarId: string;
+}
+export interface ToolbarChangedEvent extends ToolbarChangedData {
+    documentId: string;
+}
+export interface PanelChangedData {
+    placement: string;
+    slot: string;
+    panelId: string;
+}
+export interface PanelChangedEvent extends PanelChangedData {
+    documentId: string;
+}
+export interface ModalChangedData {
+    modalId: string | null;
+}
+export interface ModalChangedEvent extends ModalChangedData {
+    documentId: string;
+}
+export interface MenuChangedData {
+    menuId: string;
+    isOpen: boolean;
+}
+export interface MenuChangedEvent extends MenuChangedData {
+    documentId: string;
+}
+export interface OpenMenuState {
+    menuId: string;
+    triggeredByCommandId?: string;
+    triggeredByItemId?: string;
+}
+export interface UIScope {
+    setActiveToolbar(placement: string, slot: string, toolbarId: string): void;
+    getActiveToolbar(placement: string, slot: string): string | null;
+    closeToolbarSlot(placement: string, slot: string): void;
+    isToolbarOpen(placement: string, slot: string, toolbarId?: string): boolean;
+    setActivePanel(placement: string, slot: string, panelId: string, activeTab?: string): void;
+    getActivePanel(placement: string, slot: string): string | null;
+    closePanelSlot(placement: string, slot: string): void;
+    togglePanel(placement: string, slot: string, panelId: string, activeTab?: string): void;
+    setPanelTab(panelId: string, tabId: string): void;
+    getPanelTab(panelId: string): string | null;
+    isPanelOpen(placement: string, slot: string, panelId?: string): boolean;
+    openModal(modalId: string): void;
+    closeModal(): void;
+    getActiveModal(): string | null;
+    openMenu(menuId: string, triggeredByCommandId: string, triggeredByItemId: string): void;
+    closeMenu(menuId: string): void;
+    toggleMenu(menuId: string, triggeredByCommandId: string, triggeredByItemId: string): void;
+    closeAllMenus(): void;
+    isMenuOpen(menuId: string): boolean;
+    getOpenMenus(): OpenMenuState[];
+    getSchema(): UISchema;
+    getState(): UIDocumentState;
+    onToolbarChanged: EventHook<{
+        placement: string;
+        slot: string;
+        toolbarId: string;
+    }>;
+    onPanelChanged: EventHook<{
+        placement: string;
+        slot: string;
+        panelId: string;
+    }>;
+    onModalChanged: EventHook<{
+        modalId: string | null;
+    }>;
+    onMenuChanged: EventHook<{
+        menuId: string;
+        isOpen: boolean;
+    }>;
+}
+export interface UICapability {
+    setActiveToolbar(placement: string, slot: string, toolbarId: string, documentId?: string): void;
+    setActivePanel(placement: string, slot: string, panelId: string, documentId?: string, activeTab?: string): void;
+    togglePanel(placement: string, slot: string, panelId: string, documentId?: string, activeTab?: string): void;
+    openModal(modalId: string, documentId?: string): void;
+    openMenu(menuId: string, triggeredByCommandId: string, triggeredByItemId: string, documentId?: string): void;
+    toggleMenu(menuId: string, triggeredByCommandId: string, triggeredByItemId: string, documentId?: string): void;
+    forDocument(documentId: string): UIScope;
+    getSchema(): UISchema;
+    mergeSchema(partial: Partial<UISchema>): void;
+    disableCategory(category: string): void;
+    enableCategory(category: string): void;
+    toggleCategory(category: string): void;
+    setDisabledCategories(categories: string[]): void;
+    getDisabledCategories(): string[];
+    isCategoryDisabled(category: string): boolean;
+    onToolbarChanged: EventHook<{
+        documentId: string;
+        placement: string;
+        slot: string;
+        toolbarId: string;
+    }>;
+    onPanelChanged: EventHook<{
+        documentId: string;
+        placement: string;
+        slot: string;
+        panelId: string;
+    }>;
+    onModalChanged: EventHook<{
+        documentId: string;
+        modalId: string | null;
+    }>;
+    onMenuChanged: EventHook<{
+        documentId: string;
+        menuId: string;
+        isOpen: boolean;
+    }>;
+    onCategoryChanged: EventHook<{
+        disabledCategories: string[];
+    }>;
+}

package/dist/lib/ui-plugin.d.ts

@@ -1,23 +1,71 @@
-import { BasePlugin, PluginRegistry } from '@embedpdf/core';
-import { UICapability, UIPluginConfig, UIPluginState } from './types';
-import { UIPluginAction } from './actions';
-export declare class UIPlugin extends BasePlugin<UIPluginConfig, UICapability, UIPluginState, UIPluginAction> {
+import { BasePlugin, Listener, PluginRegistry, Unsubscribe } from '@embedpdf/core';
+import { UICapability, UIPluginConfig, UIState } from './types';
+import { UIAction } from './actions';
+export declare class UIPlugin extends BasePlugin<UIPluginConfig, UICapability, UIState, UIAction> {
     static readonly id: "ui";
-    private componentRenderers;
-    private components;
-    private config;
-    private mapStateCallbacks;
-    private globalStoreSubscription;
-    private menuManager;
+    private schema;
+    private stylesheetConfig;
+    private cachedStylesheet;
+    private cachedLocale;
+    private i18n;
+    private i18nCleanup;
+    private readonly categoryChanged$;
+    private readonly stylesheetInvalidated$;
+    private readonly toolbarChanged$;
+    private readonly panelChanged$;
+    private readonly modalChanged$;
+    private readonly menuChanged$;
     constructor(id: string, registry: PluginRegistry, config: UIPluginConfig);
     initialize(): Promise<void>;
-    private setupCommandEventHandlers;
-    private addComponent;
-    private buildComponents;
-    private linkGroupedItems;
-    private setInitialStateUIComponents;
-    private onGlobalStoreChange;
-    private addSlot;
-    protected buildCapability(): UICapability;
     destroy(): Promise<void>;
+    protected onDocumentLoadingStarted(documentId: string): void;
+    protected onDocumentClosed(documentId: string): void;
+    /**
+     * Handle locale changes from i18n plugin.
+     * Invalidates stylesheet and emits change event.
+     */
+    private handleLocaleChange;
+    /**
+     * Get the generated CSS stylesheet.
+     * Automatically regenerates if locale has changed.
+     * This is pure logic - DOM injection is handled by framework layer.
+     */
+    getStylesheet(): string;
+    /**
+     * Get the current locale (if i18n is available)
+     */
+    getLocale(): string | null;
+    /**
+     * Regenerate stylesheet (call after schema changes)
+     */
+    invalidateStylesheet(): void;
+    onStylesheetInvalidated(listener: Listener<void>): Unsubscribe;
+    private disableCategoryImpl;
+    private enableCategoryImpl;
+    private toggleCategoryImpl;
+    private setDisabledCategoriesImpl;
+    protected buildCapability(): UICapability;
+    private createUIScope;
+    private getDocumentState;
+    private getDocumentStateOrThrow;
+    private setToolbarForDocument;
+    private getToolbarForDocument;
+    private closeToolbarForDocument;
+    private isToolbarOpenForDocument;
+    private setPanelForDocument;
+    private getPanelForDocument;
+    private closePanelForDocument;
+    private togglePanelForDocument;
+    private isPanelOpenForDocument;
+    private setPanelTabForDocument;
+    private getPanelTabForDocument;
+    private openModalForDocument;
+    private closeModalForDocument;
+    private getActiveModalForDocument;
+    private openMenuForDocument;
+    private closeMenuForDocument;
+    private toggleMenuForDocument;
+    private closeAllMenusForDocument;
+    private isMenuOpenForDocument;
+    private getOpenMenusForDocument;
 }

package/dist/lib/utils/consts.d.ts

@@ -0,0 +1,25 @@
+/**
+ * Using 'embedpdf' prefix to avoid conflicts with other libraries.
+ */
+export declare const UI_ATTRIBUTES: {
+    /** Root element marker */
+    readonly ROOT: "data-epdf";
+    /** Style element marker for deduplication */
+    readonly STYLES: "data-epdf-s";
+    /** Item ID for responsive and dependency rules */
+    readonly ITEM: "data-epdf-i";
+    /** Item categories for category-based hiding */
+    readonly CATEGORIES: "data-epdf-cat";
+    /** Disabled categories list on root element */
+    readonly DISABLED_CATEGORIES: "data-epdf-dis";
+};
+/**
+ * CSS selectors derived from attributes
+ */
+export declare const UI_SELECTORS: {
+    readonly ROOT: "[data-epdf]";
+    readonly STYLES: "[data-epdf-s]";
+    readonly ITEM: (id: string) => string;
+    readonly CATEGORIES: (category: string) => string;
+    readonly DISABLED_CATEGORY: (category: string) => string;
+};

package/dist/lib/utils/index.d.ts

@@ -0,0 +1,5 @@
+export * from './responsive-utils';
+export * from './schema-merger';
+export * from './stylesheet-generator';
+export * from './ui-props';
+export * from './consts';

package/dist/lib/utils/responsive-utils.d.ts

@@ -0,0 +1,10 @@
+import { ToolbarSchema, MenuSchema, ResponsiveMetadata, ResponsiveItemMetadata, SelectionMenuSchema } from '../types';
+/**
+ * Processes responsive configuration and returns metadata for all items
+ * This is framework-agnostic and lives in plugin-ui
+ */
+export declare function resolveResponsiveMetadata(schema: ToolbarSchema | MenuSchema | SelectionMenuSchema, currentLocale?: string): ResponsiveMetadata | null;
+/**
+ * Get responsive metadata for a specific item
+ */
+export declare function getItemResponsiveMetadata(itemId: string, schema: ToolbarSchema | MenuSchema, currentLocale?: string): ResponsiveItemMetadata | null;

package/dist/lib/utils/schema-merger.d.ts

@@ -0,0 +1,15 @@
+import { UISchema } from '../types';
+/**
+ * Deep merge UI schemas
+ * Allows users to override/extend default schema
+ */
+export declare function mergeUISchema(base: UISchema, override: Partial<UISchema>): UISchema;
+/**
+ * Helper to remove items from schema
+ */
+export declare function removeFromSchema(schema: UISchema, options: {
+    toolbars?: string[];
+    menus?: string[];
+    panels?: string[];
+    commands?: string[];
+}): UISchema;

package/dist/lib/utils/stylesheet-generator.d.ts

@@ -0,0 +1,40 @@
+import { UISchema } from '../types';
+export interface StylesheetConfig {
+    /** Use container queries (@container) instead of media queries (@media). Default: true */
+    useContainerQueries?: boolean;
+}
+export interface StylesheetGenerationOptions {
+    config?: StylesheetConfig;
+    /** Current locale for locale-aware responsive rules */
+    locale?: string;
+}
+/**
+ * Generates complete CSS stylesheet for UI visibility.
+ *
+ * Includes:
+ * 1. Responsive visibility rules (container queries or media queries)
+ * 2. Category visibility rules
+ * 3. Breakpoint-aware dependency rules
+ *
+ * This is pure logic - no DOM manipulation.
+ *
+ * @param schema - The UI schema to generate CSS for
+ * @param options - Generation options including config and locale
+ * @returns Generated CSS string
+ */
+export declare function generateUIStylesheet(schema: UISchema, options?: StylesheetGenerationOptions): string;
+/**
+ * Extract all unique categories from the schema.
+ * Useful for building UI to toggle categories.
+ *
+ * @param schema - The UI schema to extract categories from
+ * @returns Sorted array of unique category names
+ */
+export declare function extractCategories(schema: UISchema): string[];
+/**
+ * Get the stylesheet configuration with defaults applied.
+ *
+ * @param config - Optional partial configuration
+ * @returns Complete configuration with defaults
+ */
+export declare function getStylesheetConfig(config?: StylesheetConfig): Required<StylesheetConfig>;

package/dist/lib/utils/ui-props.d.ts

@@ -0,0 +1,14 @@
+import { UI_ATTRIBUTES } from './consts';
+export interface UIItemLike {
+    id: string;
+    categories?: string[];
+}
+export interface UIItemProps {
+    [UI_ATTRIBUTES.ITEM]: string;
+    [UI_ATTRIBUTES.CATEGORIES]?: string;
+}
+/**
+ * Get data attribute props for a UI item.
+ * Spread these onto the wrapper element for CSS-based visibility control.
+ */
+export declare function getUIItemProps<T extends Record<string, string | undefined> = Record<string, never>>(item: UIItemLike, extra?: T): UIItemProps & T;

package/dist/preact/adapter.d.ts

@@ -1,5 +1,7 @@
-export { Fragment } from 'preact';
-export { useEffect, useRef, useState, useCallback, useMemo } from 'preact/hooks';
+import { FunctionComponent } from 'preact';
+export { Fragment, createContext } from 'preact';
+export { useEffect, useRef, useState, useCallback, useMemo, useContext } from 'preact/hooks';
 export type { ComponentChildren as ReactNode } from 'preact';
 export type CSSProperties = import('preact').JSX.CSSProperties;
 export type HTMLAttributes<T = any> = import('preact').JSX.HTMLAttributes<T extends EventTarget ? T : never>;
+export type ComponentType<P = any> = FunctionComponent<P>;

package/dist/preact/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("preact/jsx-runtime"),t=require("@embedpdf/core/preact"),n=require("@embedpdf/plugin-ui");require("preact");const o=require("preact/hooks"),r=()=>t.useCapability(n.UIPlugin.id);function i({component:t,parentContext:n={}}){const[r,l]=o.useState({});o.useEffect((()=>{const e=()=>l({});return t.onUpdate(e)&&l({}),()=>t.offUpdate(e)}),[t]);const s=t.getChildContext(n),d=t.getRenderer();if(!d)throw new Error(`No renderer for type: ${t.getRenderType}`);return d(t.props,(function(n){const o=(null==n?void 0:n.context)?{...s,...n.context}:s;return t.getChildren().filter((({id:e})=>!(null==n?void 0:n.filter)||n.filter(e))).map((({component:t,id:n,className:r})=>r?e.jsx("div",{className:r,children:e.jsx(i,{component:t,parentContext:o},n)}):e.jsx(i,{component:t,parentContext:o},n)))}),s)}exports.PluginUIProvider=function({children:t}){const{provides:n}=r(),o=t=>t.map((t=>e.jsx(i,{component:t},t.props.id)));return t({headers:{top:o((null==n?void 0:n.getHeadersByPlacement("top"))||[]),bottom:o((null==n?void 0:n.getHeadersByPlacement("bottom"))||[]),left:o((null==n?void 0:n.getHeadersByPlacement("left"))||[]),right:o((null==n?void 0:n.getHeadersByPlacement("right"))||[])},panels:{left:o((null==n?void 0:n.getPanelsByLocation("left"))||[]),right:o((null==n?void 0:n.getPanelsByLocation("right"))||[])},floating:{insideScroller:o((null==n?void 0:n.getFloatingComponents("inside"))||[]),outsideScroller:o((null==n?void 0:n.getFloatingComponents("outside"))||[])},commandMenu:(null==n?void 0:n.getCommandMenu())?e.jsx(i,{component:n.getCommandMenu()}):null})},exports.useUICapability=r,exports.useUIPlugin=()=>t.usePlugin(n.UIPlugin.id),Object.keys(n).forEach((e=>{"default"===e||Object.prototype.hasOwnProperty.call(exports,e)||Object.defineProperty(exports,e,{enumerable:!0,get:()=>n[e]})}));
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@embedpdf/core/preact"),n=require("@embedpdf/plugin-ui"),t=require("preact"),r=require("preact/hooks"),o=require("preact/jsx-runtime"),s=()=>e.useCapability(n.UIPlugin.id),u=()=>e.usePlugin(n.UIPlugin.id),l=e=>{const{provides:n}=s(),[t,o]=r.useState(null);return r.useEffect(()=>{if(!n)return;const t=n.forDocument(e);o(t.getState());const r=t.onToolbarChanged(()=>o(t.getState())),s=t.onPanelChanged(()=>o(t.getState())),u=t.onModalChanged(()=>o(t.getState())),l=t.onMenuChanged(()=>o(t.getState()));return()=>{r(),s(),u(),l()}},[n,e]),t},c=t.createContext(null);function i({children:e}){const n=r.useRef(new Map),t={register:r.useCallback((e,t,r)=>{const o=`${e}:${t}`;n.current.set(o,r)},[]),unregister:r.useCallback((e,t)=>{const r=`${e}:${t}`;n.current.delete(r)},[]),getAnchor:r.useCallback((e,t)=>{const r=`${e}:${t}`;return n.current.get(r)||null},[])};return o.jsx(c.Provider,{value:t,children:e})}function a(){const e=r.useContext(c);if(!e)throw new Error("useAnchorRegistry must be used within UIProvider");return e}const d=t.createContext(null);function p({children:e,initialComponents:n={}}){const t=r.useRef(new Map(Object.entries(n))),s={register:r.useCallback((e,n)=>{t.current.set(e,n)},[]),unregister:r.useCallback(e=>{t.current.delete(e)},[]),get:r.useCallback(e=>t.current.get(e),[]),has:r.useCallback(e=>t.current.has(e),[]),getRegisteredIds:r.useCallback(()=>Array.from(t.current.keys()),[])};return o.jsx(d.Provider,{value:s,children:e})}function f(){const e=r.useContext(d);if(!e)throw new Error("useComponentRegistry must be used within UIProvider");return e}const m=t.createContext(null);function h({children:e,renderers:n}){return o.jsx(m.Provider,{value:n,children:e})}function g(){const e=r.useContext(m);if(!e)throw new Error("useRenderers must be used within UIProvider");return e}function I({container:e,documentId:n}){const t=l(n),{provides:u}=s(),c=a(),i=g(),[d,p]=r.useState(null),f=(null==t?void 0:t.openMenus)||{},m=null==u?void 0:u.getSchema();r.useEffect(()=>{const e=Object.keys(f);if(e.length>0){const t=e[0];if(!t)return void p(null);const r=f[t];if(r&&r.triggeredByItemId){const e=c.getAnchor(n,r.triggeredByItemId);p({menuId:t,anchorEl:e})}else p(null)}else p(null)},[f,c,n]);if(!d||!m)return null;const h=m.menus[d.menuId];if(!h)return console.warn(`Menu "${d.menuId}" not found in schema`),null;const I=i.menu;return o.jsx(I,{schema:h,documentId:n,anchorEl:d.anchorEl,onClose:()=>{d&&(null==u||u.forDocument(n).closeMenu(d.menuId))},container:e})}function v({children:e,...t}){const{plugin:l}=u(),{provides:c}=s(),[i,a]=r.useState([]),d=r.useRef(null),p=r.useRef(null),f=r.useRef(null),m=r.useCallback(e=>{const t=f.current;if(f.current=e,e&&e!==t&&l){const t=function(e){const n=e.getRootNode();return n instanceof ShadowRoot?n:document.head}(e);p.current=t;const r=t.querySelector(n.UI_SELECTORS.STYLES);if(r)return d.current=r,void(r.textContent=l.getStylesheet());const o=l.getStylesheet(),s=document.createElement("style");s.setAttribute(n.UI_ATTRIBUTES.STYLES,""),s.textContent=o,t instanceof ShadowRoot?t.insertBefore(s,t.firstChild):t.appendChild(s),d.current=s}},[l]);r.useEffect(()=>()=>{var e;(null==(e=d.current)?void 0:e.parentNode)&&!f.current&&d.current.remove(),d.current=null,p.current=null},[]),r.useEffect(()=>{if(l)return l.onStylesheetInvalidated(()=>{d.current&&(d.current.textContent=l.getStylesheet())})},[l]),r.useEffect(()=>{if(c)return a(c.getDisabledCategories()),c.onCategoryChanged(({disabledCategories:e})=>{a(e)})},[c]);const h=r.useMemo(()=>i.length>0?i.join(" "):void 0,[i]),g={[n.UI_ATTRIBUTES.ROOT]:"",[n.UI_ATTRIBUTES.DISABLED_CATEGORIES]:h};return o.jsx("div",{ref:m,...g,...t,style:{containerType:"inline-size",...t.style},children:e})}exports.AnchorRegistryProvider=i,exports.ComponentRegistryProvider=p,exports.RenderersProvider=h,exports.UIProvider=function({children:e,documentId:n,components:t={},renderers:r,menuContainer:s,...u}){return o.jsx(i,{children:o.jsx(p,{initialComponents:t,children:o.jsx(h,{renderers:r,children:o.jsxs(v,{...u,children:[e,o.jsx(I,{documentId:n,container:s})]})})})})},exports.useAnchorRegistry=a,exports.useComponentRegistry=f,exports.useItemRenderer=function(){const e=f();return{renderCustomComponent:(n,t,r)=>{const s=e.get(n);return s?o.jsx(s,{documentId:t,...r||{}}):(console.error(`Component "${n}" not found in registry`),null)}}},exports.useRegisterAnchor=function(e,n){const t=a(),o=r.useRef(null),s=r.useRef(e),u=r.useRef(n);return s.current=e,u.current=n,r.useCallback(e=>{const n=o.current;o.current=e,e?e!==n&&t.register(s.current,u.current,e):n&&t.unregister(s.current,u.current)},[t])},exports.useRenderers=g,exports.useSchemaRenderer=function(e){const n=g(),{provides:t}=s(),r=null==t?void 0:t.getSchema(),u=l(e);return{renderToolbar:(s,l)=>{if(!r||!t||!u)return null;const c=`${s}-${l}`,i=u.activeToolbars[c];if(!i)return null;const a=r.toolbars[i.toolbarId];if(!a)return console.warn(`Toolbar "${i.toolbarId}" not found in schema`),null;const d=!a.permanent?()=>{t.forDocument(e).closeToolbarSlot(s,l)}:void 0,p=n.toolbar;return o.jsx(p,{schema:a,documentId:e,isOpen:i.isOpen,onClose:d},i.toolbarId)},renderPanel:(s,l)=>{if(!r||!t||!u)return null;const c=`${s}-${l}`,i=u.activePanels[c];if(!i)return null;const a=r.panels[i.panelId];if(!a)return console.warn(`Panel "${i.panelId}" not found in schema`),null;const d=n.panel;return o.jsx(d,{schema:a,documentId:e,isOpen:i.isOpen,onClose:()=>{t.forDocument(e).closePanelSlot(s,l)}},i.panelId)},getActiveToolbars:()=>u?Object.entries(u.activeToolbars).map(([e,n])=>{const[t,r]=e.split("-");return{placement:t,slot:r,toolbarId:n.toolbarId,isOpen:n.isOpen}}):[],getActivePanels:()=>u?Object.entries(u.activePanels).map(([e,n])=>{const[t,r]=e.split("-");return{placement:t,slot:r,panelId:n.panelId,isOpen:n.isOpen}}):[]}},exports.useSelectionMenu=function(e,n){var t;const{provides:u}=s(),l=g(),c=r.useCallback(t=>{var r;const s=null==u?void 0:u.getSchema(),c=null==(r=null==s?void 0:s.selectionMenus)?void 0:r[e];if(!c)return null;if(!t.selected)return null;const i=l.selectionMenu;return o.jsx(i,{schema:c,documentId:n,props:t})},[u,l,e,n]),i=null==u?void 0:u.getSchema();if(null==(t=null==i?void 0:i.selectionMenus)?void 0:t[e])return c},exports.useUICapability=s,exports.useUIPlugin=u,exports.useUISchema=()=>{const{provides:e}=s();return(null==e?void 0:e.getSchema())??null},exports.useUIState=l,Object.keys(n).forEach(e=>{"default"===e||Object.prototype.hasOwnProperty.call(exports,e)||Object.defineProperty(exports,e,{enumerable:!0,get:()=>n[e]})});
 //# sourceMappingURL=index.cjs.map