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

package/dist/lib/index.d.ts

@@ -1,12 +1,13 @@
 import { PluginPackage } from '@embedpdf/core';
+import { UIPluginConfig, UIState } from './types';
 import { UIPlugin } from './ui-plugin';
-import { UIPluginConfig, UIPluginState } from './types';
-import { UIPluginAction } from './actions';
-export declare const UIPluginPackage: PluginPackage<UIPlugin, UIPluginConfig, UIPluginState, UIPluginAction>;
-export * from './manifest';
+import { UIAction } from './actions';
+export declare const UIPluginPackage: PluginPackage<UIPlugin, UIPluginConfig, UIState, UIAction>;
 export * from './ui-plugin';
 export * from './types';
-export * from './ui-component';
+export * from './schema';
+export * from './manifest';
 export * from './utils';
-export * from './menu/types';
-export * from './menu/utils';
+export * from './selectors';
+export * from './actions';
+export { generateUIStylesheet, extractCategories, getStylesheetConfig, type StylesheetConfig, } from './utils/stylesheet-generator';

package/dist/lib/reducer.d.ts

@@ -1,5 +1,5 @@
-import { Reducer } from '@embedpdf/core';
-import { UIPluginState } from './types';
-import { UIPluginAction } from './actions';
-export declare const initialState: UIPluginState;
-export declare const uiReducer: Reducer<UIPluginState, UIPluginAction>;
+import { UIState, UIDocumentState } from './types';
+import { UIAction } from './actions';
+export declare const initialDocumentState: UIDocumentState;
+export declare const initialState: UIState;
+export declare const uiReducer: (state: UIState | undefined, action: UIAction) => UIState;

package/dist/lib/schema.d.ts

@@ -0,0 +1,257 @@
+/**
+ * Top-level UI Schema
+ */
+export interface UISchema {
+    id: string;
+    version: string;
+    toolbars: Record<string, ToolbarSchema>;
+    menus: Record<string, MenuSchema>;
+    panels: Record<string, PanelSchema>;
+    selectionMenus: Record<string, SelectionMenuSchema>;
+}
+export interface ToolbarPosition {
+    placement: 'top' | 'bottom' | 'left' | 'right';
+    slot?: string;
+    order?: number;
+}
+export interface VisibilityDependency {
+    /** Menu whose visible items determine this element's visibility */
+    menuId?: string;
+    /** Direct item IDs this element depends on */
+    itemIds?: string[];
+}
+export interface CustomComponentItem {
+    type: 'custom';
+    id: string;
+    componentId: string;
+    props?: Record<string, any>;
+    categories?: string[];
+    visibilityDependsOn?: VisibilityDependency;
+}
+/**
+ * Toolbar item types
+ */
+export type ToolbarItem = CommandButtonItem | TabGroupItem | DividerItem | SpacerItem | GroupItem | CustomComponentItem;
+/**
+ * Toolbar definition
+ */
+export interface ToolbarSchema {
+    id: string;
+    position: ToolbarPosition;
+    permanent?: boolean;
+    items: ToolbarItem[];
+    responsive?: ResponsiveRules;
+    categories?: string[];
+    visibilityDependsOn?: VisibilityDependency;
+}
+export interface TabGroupItem {
+    type: 'tab-group';
+    id: string;
+    tabs: TabItem[];
+    defaultTab?: string;
+    variant?: 'pills' | 'underline' | 'enclosed';
+    alignment?: 'start' | 'center' | 'end';
+    categories?: string[];
+    visibilityDependsOn?: VisibilityDependency;
+}
+export interface TabItem {
+    id: string;
+    commandId: string;
+    variant?: 'icon' | 'text' | 'icon-text';
+    categories?: string[];
+    visibilityDependsOn?: VisibilityDependency;
+}
+export interface CommandButtonItem {
+    type: 'command-button';
+    id: string;
+    commandId: string;
+    variant?: 'icon' | 'text' | 'icon-text' | 'tab';
+    size?: 'sm' | 'md' | 'lg';
+    /** Categories this item belongs to (hidden when ANY category is disabled) */
+    categories?: string[];
+    visibilityDependsOn?: VisibilityDependency;
+}
+export interface DividerItem {
+    type: 'divider';
+    id: string;
+    orientation?: 'vertical' | 'horizontal';
+    categories?: string[];
+    visibilityDependsOn?: VisibilityDependency;
+}
+export interface SpacerItem {
+    type: 'spacer';
+    id: string;
+    flex?: boolean;
+    categories?: string[];
+    visibilityDependsOn?: VisibilityDependency;
+}
+export interface GroupItem {
+    type: 'group';
+    id: string;
+    items: ToolbarItem[];
+    gap?: number;
+    alignment?: 'start' | 'center' | 'end';
+    categories?: string[];
+    visibilityDependsOn?: VisibilityDependency;
+}
+/**
+ * Menu definition - pure structure, no trigger info
+ */
+export interface MenuSchema {
+    id: string;
+    items: MenuItem[];
+    responsive?: ResponsiveRules;
+    categories?: string[];
+    visibilityDependsOn?: VisibilityDependency;
+}
+/**
+ * Menu item types
+ */
+export type MenuItem = MenuCommandItem | MenuSectionItem | MenuSubmenuItem | MenuDividerItem | MenuCustomItem;
+export interface MenuCommandItem {
+    type: 'command';
+    id: string;
+    commandId: string;
+    categories?: string[];
+    visibilityDependsOn?: VisibilityDependency;
+}
+export interface MenuSectionItem {
+    type: 'section';
+    id: string;
+    labelKey?: string;
+    label?: string;
+    items: MenuItem[];
+    categories?: string[];
+    visibilityDependsOn?: VisibilityDependency;
+}
+export interface MenuSubmenuItem {
+    type: 'submenu';
+    id: string;
+    labelKey?: string;
+    label?: string;
+    icon?: string;
+    menuId: string;
+    categories?: string[];
+    visibilityDependsOn?: VisibilityDependency;
+}
+export interface MenuDividerItem {
+    type: 'divider';
+    id: string;
+    categories?: string[];
+    visibilityDependsOn?: VisibilityDependency;
+}
+export interface MenuCustomItem {
+    type: 'custom';
+    id: string;
+    componentId: string;
+    props?: Record<string, any>;
+    categories?: string[];
+    visibilityDependsOn?: VisibilityDependency;
+}
+/**
+ * Panel definition (sidebars, overlays, modals)
+ */
+export interface PanelSchema {
+    id: string;
+    type: 'sidebar' | 'overlay' | 'modal' | 'popover';
+    position?: PanelPosition;
+    content: PanelContent;
+    collapsible?: boolean;
+    defaultOpen?: boolean;
+    closeOnClickOutside?: boolean;
+    width?: string;
+    height?: string;
+    minWidth?: string;
+    minHeight?: string;
+    maxWidth?: string;
+    maxHeight?: string;
+    categories?: string[];
+    visibilityDependsOn?: VisibilityDependency;
+}
+export interface PanelPosition {
+    placement: 'left' | 'right' | 'top' | 'bottom';
+    slot?: string;
+    order?: number;
+}
+/**
+ * Panel content types
+ */
+export type PanelContent = TabsPanelContent | ComponentPanelContent;
+export interface TabsPanelContent {
+    type: 'tabs';
+    tabs: PanelTab[];
+    defaultTab?: string;
+}
+export interface PanelTab {
+    id: string;
+    labelKey?: string;
+    label?: string;
+    icon?: string;
+    componentId: string;
+    categories?: string[];
+    visibilityDependsOn?: VisibilityDependency;
+}
+export interface ComponentPanelContent {
+    type: 'component';
+    componentId: string;
+    props?: Record<string, any>;
+}
+export interface ResponsiveRules {
+    breakpoints: Record<string, BreakpointRule>;
+    localeOverrides?: LocaleOverrides;
+}
+export interface BreakpointRule {
+    minWidth?: number;
+    maxWidth?: number;
+    hide?: string[];
+    show?: string[];
+}
+/**
+ * Locale-based responsive overrides
+ * Allows grouping languages and adjusting show/hide rules per breakpoint
+ */
+export interface LocaleOverrides {
+    groups: LocaleVisibilityGroup[];
+}
+export interface LocaleVisibilityGroup {
+    id: string;
+    locales: string[];
+    description?: string;
+    breakpoints: Record<string, LocaleBreakpointOverride>;
+}
+export interface LocaleBreakpointOverride {
+    hide?: string[];
+    show?: string[];
+    replaceHide?: string[];
+    replaceShow?: string[];
+}
+export type SelectionMenuItem = SelectionMenuCommandItem | SelectionMenuDividerItem | SelectionMenuGroupItem;
+export interface SelectionMenuCommandItem {
+    type: 'command-button';
+    id: string;
+    commandId: string;
+    variant?: 'icon' | 'text' | 'icon-text';
+    categories?: string[];
+    visibilityDependsOn?: VisibilityDependency;
+}
+export interface SelectionMenuDividerItem {
+    type: 'divider';
+    id: string;
+    categories?: string[];
+    visibilityDependsOn?: VisibilityDependency;
+}
+export interface SelectionMenuGroupItem {
+    type: 'group';
+    id: string;
+    items: SelectionMenuItem[];
+    gap?: number;
+    categories?: string[];
+    visibilityDependsOn?: VisibilityDependency;
+}
+export interface SelectionMenuSchema {
+    id: string;
+    items: SelectionMenuItem[];
+    categories?: string[];
+    visibilityDependsOn?: VisibilityDependency;
+    responsive?: ResponsiveRules;
+}

package/dist/lib/selectors.d.ts

@@ -0,0 +1,16 @@
+import { UIState, UIDocumentState, ToolbarSlotState, PanelSlotState } from './types';
+export type PluginsSlice = Record<string, any>;
+export declare function selectUIState(plugins: PluginsSlice): UIState | null;
+export declare function selectUIDocumentState(plugins: PluginsSlice, documentId: string): UIDocumentState | null;
+export declare function selectToolbarSlot(plugins: PluginsSlice, documentId: string, placement: string, slot: string): ToolbarSlotState | null;
+/**
+ * Is a toolbar open in this slot?
+ * If toolbarId is provided, also matches that specific toolbar.
+ */
+export declare function isToolbarOpen(plugins: PluginsSlice, documentId: string, placement: string, slot: string, toolbarId?: string): boolean;
+export declare function selectPanelSlot(plugins: PluginsSlice, documentId: string, placement: string, slot: string): PanelSlotState | null;
+/**
+ * Is a panel open in this slot?
+ * If panelId is provided, also matches that specific panel.
+ */
+export declare function isPanelOpen(plugins: PluginsSlice, documentId: string, placement: string, slot: string, panelId?: string): boolean;