@embedpdf/plugin-ui 1.0.0 → 1.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -22,15 +22,15 @@ var preact_exports = {};
22
22
  __export(preact_exports, {
23
23
  PluginUIProvider: () => PluginUIProvider,
24
24
  useIcon: () => useIcon,
25
- useUI: () => useUI,
26
- useUICapability: () => useUICapability
25
+ useUICapability: () => useUICapability,
26
+ useUIPlugin: () => useUIPlugin
27
27
  });
28
28
  module.exports = __toCommonJS(preact_exports);
29
29
 
30
30
  // src/preact/hooks/use-ui.ts
31
31
  var import_preact = require("@embedpdf/core/preact");
32
32
  var import_plugin_ui = require("@embedpdf/plugin-ui");
33
- var useUI = () => (0, import_preact.usePlugin)(import_plugin_ui.UIPlugin.id);
33
+ var useUIPlugin = () => (0, import_preact.usePlugin)(import_plugin_ui.UIPlugin.id);
34
34
  var useUICapability = () => (0, import_preact.useCapability)(import_plugin_ui.UIPlugin.id);
35
35
 
36
36
  // src/preact/hooks/use-icon.ts
@@ -124,7 +124,7 @@ function PluginUIProvider({ children }) {
124
124
  0 && (module.exports = {
125
125
  PluginUIProvider,
126
126
  useIcon,
127
- useUI,
128
- useUICapability
127
+ useUICapability,
128
+ useUIPlugin
129
129
  });
130
130
  //# sourceMappingURL=index.cjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/preact/index.ts","../../src/preact/hooks/use-ui.ts","../../src/preact/hooks/use-icon.ts","../../src/preact/components/component-wrapper.tsx","../../src/preact/components/plugin-ui-provider.tsx"],"sourcesContent":["export * from './components';\nexport * from './hooks';\n","import { useCapability, usePlugin } from '@embedpdf/core/preact';\nimport { UIPlugin } from '@embedpdf/plugin-ui';\n\nexport const useUI = () => usePlugin<UIPlugin>(UIPlugin.id);\nexport const useUICapability = () => useCapability<UIPlugin>(UIPlugin.id);\n","import { useUICapability } from './use-ui';\nimport { IconIdentifier, Icon as IconType, IconRegistry } from '@embedpdf/plugin-ui';\n\n/**\n * Hook to access icon functionality in React\n */\nexport function useIcon() {\n const { provides: uiProvides } = useUICapability();\n\n if (!uiProvides) {\n throw new Error('useIcon must be used within a UI context');\n }\n\n const {\n registerIcon,\n registerIcons,\n getIcon,\n getAllIcons,\n getSvgString,\n isSvgString,\n isSvgDataUri,\n dataUriToSvgString,\n svgStringToDataUri,\n } = uiProvides;\n\n return {\n registerIcon,\n registerIcons,\n getIcon,\n getAllIcons,\n getSvgString,\n isSvgString,\n isSvgDataUri,\n dataUriToSvgString,\n svgStringToDataUri,\n };\n}\n","import { useState, useEffect } from 'preact/hooks';\nimport { childrenFunctionOptions, UIComponent } from '@embedpdf/plugin-ui';\n\nexport function ComponentWrapper({\n component,\n parentContext = {},\n}: {\n component: UIComponent<any>;\n parentContext?: Record<string, any>;\n}) {\n const [_, forceUpdate] = useState({});\n\n useEffect(() => {\n const updateCallback = () => forceUpdate({});\n // If the component had updated before we attach the listener, force one re-render\n if (component.onUpdate(updateCallback)) {\n forceUpdate({});\n }\n return () => component.offUpdate(updateCallback);\n }, [component]);\n\n // Merge contexts from parent + the UIComponent's own child context\n const childContext = component.getChildContext(parentContext);\n\n // Instead of returning `component.render()`, we do the following:\n\n // 1) Look up the \"renderer function\" for this component type\n const renderer = component.getRenderer(); // We'll define getRenderer() below\n\n if (!renderer) {\n throw new Error(`No renderer for type: ${component.getRenderType}`);\n }\n\n // 2) Build a function that returns child wrappers\n function renderChildrenFn(options?: childrenFunctionOptions) {\n const merged = options?.context ? { ...childContext, ...options.context } : childContext;\n return component\n .getChildren()\n .filter(({ id }) => {\n // If filter function is provided, use it to determine if we should include this child\n return !options?.filter || options.filter(id);\n })\n .map(({ component: child, id, className }) =>\n className ? (\n <div className={className}>\n <ComponentWrapper key={id} component={child} parentContext={merged} />\n </div>\n ) : (\n <ComponentWrapper key={id} component={child} parentContext={merged} />\n ),\n );\n }\n\n // 3) Finally call the renderer with (props, childrenFn, context)\n return renderer(component.props, renderChildrenFn, childContext);\n}\n","/** @jsxImportSource preact */\nimport { h, JSX, ComponentChildren } from 'preact';\nimport { useUI, useUICapability } from '../hooks';\nimport { ComponentWrapper } from './component-wrapper';\nimport { UIComponent } from '@embedpdf/plugin-ui';\n\n/**\n * Interface for UI components organized by type/location\n */\nexport interface UIComponentsMap {\n headers: {\n top: JSX.Element[];\n bottom: JSX.Element[];\n left: JSX.Element[];\n right: JSX.Element[];\n };\n panels: {\n left: JSX.Element[];\n right: JSX.Element[];\n };\n floating: {\n insideScroller: JSX.Element[];\n outsideScroller: JSX.Element[];\n };\n commandMenu: JSX.Element | null;\n}\n\n/**\n * Props for the PluginUIProvider\n */\nexport interface PluginUIProviderProps {\n /**\n * Render function that receives UI components\n */\n children: (components: UIComponentsMap) => JSX.Element;\n}\n\n/**\n * PluginUIProvider collects all components from the UI plugin system\n * and provides them to a render function without imposing any structure.\n *\n * It uses the render props pattern for maximum flexibility.\n */\nexport function PluginUIProvider({ children }: PluginUIProviderProps) {\n const { provides: uiProvides } = useUICapability();\n\n // Helper function to wrap UIComponents as JSX elements\n const wrapComponents = (components: UIComponent<any>[]): JSX.Element[] => {\n return components.map((component) => (\n <ComponentWrapper key={component.props.id} component={component} />\n ));\n };\n\n // Collect and wrap all components from UI plugin\n const componentMap: UIComponentsMap = {\n headers: {\n top: wrapComponents(uiProvides?.getHeadersByPlacement('top') || []),\n bottom: wrapComponents(uiProvides?.getHeadersByPlacement('bottom') || []),\n left: wrapComponents(uiProvides?.getHeadersByPlacement('left') || []),\n right: wrapComponents(uiProvides?.getHeadersByPlacement('right') || []),\n },\n panels: {\n left: wrapComponents(uiProvides?.getPanelsByLocation('left') || []),\n right: wrapComponents(uiProvides?.getPanelsByLocation('right') || []),\n },\n floating: {\n insideScroller: wrapComponents(uiProvides?.getFloatingComponents('inside') || []),\n outsideScroller: wrapComponents(uiProvides?.getFloatingComponents('outside') || []),\n },\n commandMenu: uiProvides?.getCommandMenu() ? (\n <ComponentWrapper component={uiProvides.getCommandMenu()!} />\n ) : null,\n };\n\n // Let the consumer determine the layout structure through the render prop\n return children(componentMap);\n}\n"],"mappings":"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","names":["import_jsx_runtime"]}
1
+ {"version":3,"sources":["../../src/preact/index.ts","../../src/preact/hooks/use-ui.ts","../../src/preact/hooks/use-icon.ts","../../src/preact/components/component-wrapper.tsx","../../src/preact/components/plugin-ui-provider.tsx"],"sourcesContent":["export * from './components';\nexport * from './hooks';\n","import { useCapability, usePlugin } from '@embedpdf/core/preact';\nimport { UIPlugin } from '@embedpdf/plugin-ui';\n\nexport const useUIPlugin = () => usePlugin<UIPlugin>(UIPlugin.id);\nexport const useUICapability = () => useCapability<UIPlugin>(UIPlugin.id);\n","import { useUICapability } from './use-ui';\nimport { IconIdentifier, Icon as IconType, IconRegistry } from '@embedpdf/plugin-ui';\n\n/**\n * Hook to access icon functionality in React\n */\nexport function useIcon() {\n const { provides: uiProvides } = useUICapability();\n\n if (!uiProvides) {\n throw new Error('useIcon must be used within a UI context');\n }\n\n const {\n registerIcon,\n registerIcons,\n getIcon,\n getAllIcons,\n getSvgString,\n isSvgString,\n isSvgDataUri,\n dataUriToSvgString,\n svgStringToDataUri,\n } = uiProvides;\n\n return {\n registerIcon,\n registerIcons,\n getIcon,\n getAllIcons,\n getSvgString,\n isSvgString,\n isSvgDataUri,\n dataUriToSvgString,\n svgStringToDataUri,\n };\n}\n","import { useState, useEffect } from 'preact/hooks';\nimport { childrenFunctionOptions, UIComponent } from '@embedpdf/plugin-ui';\n\nexport function ComponentWrapper({\n component,\n parentContext = {},\n}: {\n component: UIComponent<any>;\n parentContext?: Record<string, any>;\n}) {\n const [_, forceUpdate] = useState({});\n\n useEffect(() => {\n const updateCallback = () => forceUpdate({});\n // If the component had updated before we attach the listener, force one re-render\n if (component.onUpdate(updateCallback)) {\n forceUpdate({});\n }\n return () => component.offUpdate(updateCallback);\n }, [component]);\n\n // Merge contexts from parent + the UIComponent's own child context\n const childContext = component.getChildContext(parentContext);\n\n // Instead of returning `component.render()`, we do the following:\n\n // 1) Look up the \"renderer function\" for this component type\n const renderer = component.getRenderer(); // We'll define getRenderer() below\n\n if (!renderer) {\n throw new Error(`No renderer for type: ${component.getRenderType}`);\n }\n\n // 2) Build a function that returns child wrappers\n function renderChildrenFn(options?: childrenFunctionOptions) {\n const merged = options?.context ? { ...childContext, ...options.context } : childContext;\n return component\n .getChildren()\n .filter(({ id }) => {\n // If filter function is provided, use it to determine if we should include this child\n return !options?.filter || options.filter(id);\n })\n .map(({ component: child, id, className }) =>\n className ? (\n <div className={className}>\n <ComponentWrapper key={id} component={child} parentContext={merged} />\n </div>\n ) : (\n <ComponentWrapper key={id} component={child} parentContext={merged} />\n ),\n );\n }\n\n // 3) Finally call the renderer with (props, childrenFn, context)\n return renderer(component.props, renderChildrenFn, childContext);\n}\n","/** @jsxImportSource preact */\nimport { h, JSX, ComponentChildren } from 'preact';\nimport { useUICapability } from '../hooks';\nimport { ComponentWrapper } from './component-wrapper';\nimport { UIComponent } from '@embedpdf/plugin-ui';\n\n/**\n * Interface for UI components organized by type/location\n */\nexport interface UIComponentsMap {\n headers: {\n top: JSX.Element[];\n bottom: JSX.Element[];\n left: JSX.Element[];\n right: JSX.Element[];\n };\n panels: {\n left: JSX.Element[];\n right: JSX.Element[];\n };\n floating: {\n insideScroller: JSX.Element[];\n outsideScroller: JSX.Element[];\n };\n commandMenu: JSX.Element | null;\n}\n\n/**\n * Props for the PluginUIProvider\n */\nexport interface PluginUIProviderProps {\n /**\n * Render function that receives UI components\n */\n children: (components: UIComponentsMap) => JSX.Element;\n}\n\n/**\n * PluginUIProvider collects all components from the UI plugin system\n * and provides them to a render function without imposing any structure.\n *\n * It uses the render props pattern for maximum flexibility.\n */\nexport function PluginUIProvider({ children }: PluginUIProviderProps) {\n const { provides: uiProvides } = useUICapability();\n\n // Helper function to wrap UIComponents as JSX elements\n const wrapComponents = (components: UIComponent<any>[]): JSX.Element[] => {\n return components.map((component) => (\n <ComponentWrapper key={component.props.id} component={component} />\n ));\n };\n\n // Collect and wrap all components from UI plugin\n const componentMap: UIComponentsMap = {\n headers: {\n top: wrapComponents(uiProvides?.getHeadersByPlacement('top') || []),\n bottom: wrapComponents(uiProvides?.getHeadersByPlacement('bottom') || []),\n left: wrapComponents(uiProvides?.getHeadersByPlacement('left') || []),\n right: wrapComponents(uiProvides?.getHeadersByPlacement('right') || []),\n },\n panels: {\n left: wrapComponents(uiProvides?.getPanelsByLocation('left') || []),\n right: wrapComponents(uiProvides?.getPanelsByLocation('right') || []),\n },\n floating: {\n insideScroller: wrapComponents(uiProvides?.getFloatingComponents('inside') || []),\n outsideScroller: wrapComponents(uiProvides?.getFloatingComponents('outside') || []),\n },\n commandMenu: uiProvides?.getCommandMenu() ? (\n <ComponentWrapper component={uiProvides.getCommandMenu()!} />\n ) : null,\n };\n\n // Let the consumer determine the layout structure through the render prop\n return children(componentMap);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,oBAAyC;AACzC,uBAAyB;AAElB,IAAM,cAAc,UAAM,yBAAoB,0BAAS,EAAE;AACzD,IAAM,kBAAkB,UAAM,6BAAwB,0BAAS,EAAE;;;ACEjE,SAAS,UAAU;AACxB,QAAM,EAAE,UAAU,WAAW,IAAI,gBAAgB;AAEjD,MAAI,CAAC,YAAY;AACf,UAAM,IAAI,MAAM,0CAA0C;AAAA,EAC5D;AAEA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;;;ACpCA,mBAAoC;AA6CxB;AA1CL,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA,gBAAgB,CAAC;AACnB,GAGG;AACD,QAAM,CAAC,GAAG,WAAW,QAAI,uBAAS,CAAC,CAAC;AAEpC,8BAAU,MAAM;AACd,UAAM,iBAAiB,MAAM,YAAY,CAAC,CAAC;AAE3C,QAAI,UAAU,SAAS,cAAc,GAAG;AACtC,kBAAY,CAAC,CAAC;AAAA,IAChB;AACA,WAAO,MAAM,UAAU,UAAU,cAAc;AAAA,EACjD,GAAG,CAAC,SAAS,CAAC;AAGd,QAAM,eAAe,UAAU,gBAAgB,aAAa;AAK5D,QAAM,WAAW,UAAU,YAAY;AAEvC,MAAI,CAAC,UAAU;AACb,UAAM,IAAI,MAAM,yBAAyB,UAAU,aAAa,EAAE;AAAA,EACpE;AAGA,WAAS,iBAAiB,SAAmC;AAC3D,UAAM,SAAS,SAAS,UAAU,EAAE,GAAG,cAAc,GAAG,QAAQ,QAAQ,IAAI;AAC5E,WAAO,UACJ,YAAY,EACZ,OAAO,CAAC,EAAE,GAAG,MAAM;AAElB,aAAO,CAAC,SAAS,UAAU,QAAQ,OAAO,EAAE;AAAA,IAC9C,CAAC,EACA;AAAA,MAAI,CAAC,EAAE,WAAW,OAAO,IAAI,UAAU,MACtC,YACE,4CAAC,SAAI,WACH,sDAAC,oBAA0B,WAAW,OAAO,eAAe,UAArC,EAA6C,GACtE,IAEA,4CAAC,oBAA0B,WAAW,OAAO,eAAe,UAArC,EAA6C;AAAA,IAExE;AAAA,EACJ;AAGA,SAAO,SAAS,UAAU,OAAO,kBAAkB,YAAY;AACjE;;;ACNM,IAAAA,sBAAA;AANC,SAAS,iBAAiB,EAAE,SAAS,GAA0B;AACpE,QAAM,EAAE,UAAU,WAAW,IAAI,gBAAgB;AAGjD,QAAM,iBAAiB,CAAC,eAAkD;AACxE,WAAO,WAAW,IAAI,CAAC,cACrB,6CAAC,oBAA0C,aAApB,UAAU,MAAM,EAA0B,CAClE;AAAA,EACH;AAGA,QAAM,eAAgC;AAAA,IACpC,SAAS;AAAA,MACP,KAAK,eAAe,YAAY,sBAAsB,KAAK,KAAK,CAAC,CAAC;AAAA,MAClE,QAAQ,eAAe,YAAY,sBAAsB,QAAQ,KAAK,CAAC,CAAC;AAAA,MACxE,MAAM,eAAe,YAAY,sBAAsB,MAAM,KAAK,CAAC,CAAC;AAAA,MACpE,OAAO,eAAe,YAAY,sBAAsB,OAAO,KAAK,CAAC,CAAC;AAAA,IACxE;AAAA,IACA,QAAQ;AAAA,MACN,MAAM,eAAe,YAAY,oBAAoB,MAAM,KAAK,CAAC,CAAC;AAAA,MAClE,OAAO,eAAe,YAAY,oBAAoB,OAAO,KAAK,CAAC,CAAC;AAAA,IACtE;AAAA,IACA,UAAU;AAAA,MACR,gBAAgB,eAAe,YAAY,sBAAsB,QAAQ,KAAK,CAAC,CAAC;AAAA,MAChF,iBAAiB,eAAe,YAAY,sBAAsB,SAAS,KAAK,CAAC,CAAC;AAAA,IACpF;AAAA,IACA,aAAa,YAAY,eAAe,IACtC,6CAAC,oBAAiB,WAAW,WAAW,eAAe,GAAI,IACzD;AAAA,EACN;AAGA,SAAO,SAAS,YAAY;AAC9B;","names":["import_jsx_runtime"]}
@@ -41,7 +41,7 @@ interface PluginUIProviderProps {
41
41
  */
42
42
  declare function PluginUIProvider({ children }: PluginUIProviderProps): h.JSX.Element;
43
43
 
44
- declare const useUI: () => {
44
+ declare const useUIPlugin: () => {
45
45
  plugin: UIPlugin | null;
46
46
  isLoading: boolean;
47
47
  ready: Promise<void>;
@@ -67,4 +67,4 @@ declare function useIcon(): {
67
67
  svgStringToDataUri: (svgString: string) => string;
68
68
  };
69
69
 
70
- export { PluginUIProvider, type PluginUIProviderProps, type UIComponentsMap, useIcon, useUI, useUICapability };
70
+ export { PluginUIProvider, type PluginUIProviderProps, type UIComponentsMap, useIcon, useUICapability, useUIPlugin };
@@ -41,7 +41,7 @@ interface PluginUIProviderProps {
41
41
  */
42
42
  declare function PluginUIProvider({ children }: PluginUIProviderProps): h.JSX.Element;
43
43
 
44
- declare const useUI: () => {
44
+ declare const useUIPlugin: () => {
45
45
  plugin: UIPlugin | null;
46
46
  isLoading: boolean;
47
47
  ready: Promise<void>;
@@ -67,4 +67,4 @@ declare function useIcon(): {
67
67
  svgStringToDataUri: (svgString: string) => string;
68
68
  };
69
69
 
70
- export { PluginUIProvider, type PluginUIProviderProps, type UIComponentsMap, useIcon, useUI, useUICapability };
70
+ export { PluginUIProvider, type PluginUIProviderProps, type UIComponentsMap, useIcon, useUICapability, useUIPlugin };
@@ -1,7 +1,7 @@
1
1
  // src/preact/hooks/use-ui.ts
2
2
  import { useCapability, usePlugin } from "@embedpdf/core/preact";
3
3
  import { UIPlugin } from "@embedpdf/plugin-ui";
4
- var useUI = () => usePlugin(UIPlugin.id);
4
+ var useUIPlugin = () => usePlugin(UIPlugin.id);
5
5
  var useUICapability = () => useCapability(UIPlugin.id);
6
6
 
7
7
  // src/preact/hooks/use-icon.ts
@@ -94,7 +94,7 @@ function PluginUIProvider({ children }) {
94
94
  export {
95
95
  PluginUIProvider,
96
96
  useIcon,
97
- useUI,
98
- useUICapability
97
+ useUICapability,
98
+ useUIPlugin
99
99
  };
100
100
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/preact/hooks/use-ui.ts","../../src/preact/hooks/use-icon.ts","../../src/preact/components/component-wrapper.tsx","../../src/preact/components/plugin-ui-provider.tsx"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/preact';\nimport { UIPlugin } from '@embedpdf/plugin-ui';\n\nexport const useUI = () => usePlugin<UIPlugin>(UIPlugin.id);\nexport const useUICapability = () => useCapability<UIPlugin>(UIPlugin.id);\n","import { useUICapability } from './use-ui';\nimport { IconIdentifier, Icon as IconType, IconRegistry } from '@embedpdf/plugin-ui';\n\n/**\n * Hook to access icon functionality in React\n */\nexport function useIcon() {\n const { provides: uiProvides } = useUICapability();\n\n if (!uiProvides) {\n throw new Error('useIcon must be used within a UI context');\n }\n\n const {\n registerIcon,\n registerIcons,\n getIcon,\n getAllIcons,\n getSvgString,\n isSvgString,\n isSvgDataUri,\n dataUriToSvgString,\n svgStringToDataUri,\n } = uiProvides;\n\n return {\n registerIcon,\n registerIcons,\n getIcon,\n getAllIcons,\n getSvgString,\n isSvgString,\n isSvgDataUri,\n dataUriToSvgString,\n svgStringToDataUri,\n };\n}\n","import { useState, useEffect } from 'preact/hooks';\nimport { childrenFunctionOptions, UIComponent } from '@embedpdf/plugin-ui';\n\nexport function ComponentWrapper({\n component,\n parentContext = {},\n}: {\n component: UIComponent<any>;\n parentContext?: Record<string, any>;\n}) {\n const [_, forceUpdate] = useState({});\n\n useEffect(() => {\n const updateCallback = () => forceUpdate({});\n // If the component had updated before we attach the listener, force one re-render\n if (component.onUpdate(updateCallback)) {\n forceUpdate({});\n }\n return () => component.offUpdate(updateCallback);\n }, [component]);\n\n // Merge contexts from parent + the UIComponent's own child context\n const childContext = component.getChildContext(parentContext);\n\n // Instead of returning `component.render()`, we do the following:\n\n // 1) Look up the \"renderer function\" for this component type\n const renderer = component.getRenderer(); // We'll define getRenderer() below\n\n if (!renderer) {\n throw new Error(`No renderer for type: ${component.getRenderType}`);\n }\n\n // 2) Build a function that returns child wrappers\n function renderChildrenFn(options?: childrenFunctionOptions) {\n const merged = options?.context ? { ...childContext, ...options.context } : childContext;\n return component\n .getChildren()\n .filter(({ id }) => {\n // If filter function is provided, use it to determine if we should include this child\n return !options?.filter || options.filter(id);\n })\n .map(({ component: child, id, className }) =>\n className ? (\n <div className={className}>\n <ComponentWrapper key={id} component={child} parentContext={merged} />\n </div>\n ) : (\n <ComponentWrapper key={id} component={child} parentContext={merged} />\n ),\n );\n }\n\n // 3) Finally call the renderer with (props, childrenFn, context)\n return renderer(component.props, renderChildrenFn, childContext);\n}\n","/** @jsxImportSource preact */\nimport { h, JSX, ComponentChildren } from 'preact';\nimport { useUI, useUICapability } from '../hooks';\nimport { ComponentWrapper } from './component-wrapper';\nimport { UIComponent } from '@embedpdf/plugin-ui';\n\n/**\n * Interface for UI components organized by type/location\n */\nexport interface UIComponentsMap {\n headers: {\n top: JSX.Element[];\n bottom: JSX.Element[];\n left: JSX.Element[];\n right: JSX.Element[];\n };\n panels: {\n left: JSX.Element[];\n right: JSX.Element[];\n };\n floating: {\n insideScroller: JSX.Element[];\n outsideScroller: JSX.Element[];\n };\n commandMenu: JSX.Element | null;\n}\n\n/**\n * Props for the PluginUIProvider\n */\nexport interface PluginUIProviderProps {\n /**\n * Render function that receives UI components\n */\n children: (components: UIComponentsMap) => JSX.Element;\n}\n\n/**\n * PluginUIProvider collects all components from the UI plugin system\n * and provides them to a render function without imposing any structure.\n *\n * It uses the render props pattern for maximum flexibility.\n */\nexport function PluginUIProvider({ children }: PluginUIProviderProps) {\n const { provides: uiProvides } = useUICapability();\n\n // Helper function to wrap UIComponents as JSX elements\n const wrapComponents = (components: UIComponent<any>[]): JSX.Element[] => {\n return components.map((component) => (\n <ComponentWrapper key={component.props.id} component={component} />\n ));\n };\n\n // Collect and wrap all components from UI plugin\n const componentMap: UIComponentsMap = {\n headers: {\n top: wrapComponents(uiProvides?.getHeadersByPlacement('top') || []),\n bottom: wrapComponents(uiProvides?.getHeadersByPlacement('bottom') || []),\n left: wrapComponents(uiProvides?.getHeadersByPlacement('left') || []),\n right: wrapComponents(uiProvides?.getHeadersByPlacement('right') || []),\n },\n panels: {\n left: wrapComponents(uiProvides?.getPanelsByLocation('left') || []),\n right: wrapComponents(uiProvides?.getPanelsByLocation('right') || []),\n },\n floating: {\n insideScroller: wrapComponents(uiProvides?.getFloatingComponents('inside') || []),\n outsideScroller: wrapComponents(uiProvides?.getFloatingComponents('outside') || []),\n },\n commandMenu: uiProvides?.getCommandMenu() ? (\n <ComponentWrapper component={uiProvides.getCommandMenu()!} />\n ) : null,\n };\n\n // Let the consumer determine the layout structure through the render prop\n return children(componentMap);\n}\n"],"mappings":"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","names":["jsx"]}
1
+ {"version":3,"sources":["../../src/preact/hooks/use-ui.ts","../../src/preact/hooks/use-icon.ts","../../src/preact/components/component-wrapper.tsx","../../src/preact/components/plugin-ui-provider.tsx"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/preact';\nimport { UIPlugin } from '@embedpdf/plugin-ui';\n\nexport const useUIPlugin = () => usePlugin<UIPlugin>(UIPlugin.id);\nexport const useUICapability = () => useCapability<UIPlugin>(UIPlugin.id);\n","import { useUICapability } from './use-ui';\nimport { IconIdentifier, Icon as IconType, IconRegistry } from '@embedpdf/plugin-ui';\n\n/**\n * Hook to access icon functionality in React\n */\nexport function useIcon() {\n const { provides: uiProvides } = useUICapability();\n\n if (!uiProvides) {\n throw new Error('useIcon must be used within a UI context');\n }\n\n const {\n registerIcon,\n registerIcons,\n getIcon,\n getAllIcons,\n getSvgString,\n isSvgString,\n isSvgDataUri,\n dataUriToSvgString,\n svgStringToDataUri,\n } = uiProvides;\n\n return {\n registerIcon,\n registerIcons,\n getIcon,\n getAllIcons,\n getSvgString,\n isSvgString,\n isSvgDataUri,\n dataUriToSvgString,\n svgStringToDataUri,\n };\n}\n","import { useState, useEffect } from 'preact/hooks';\nimport { childrenFunctionOptions, UIComponent } from '@embedpdf/plugin-ui';\n\nexport function ComponentWrapper({\n component,\n parentContext = {},\n}: {\n component: UIComponent<any>;\n parentContext?: Record<string, any>;\n}) {\n const [_, forceUpdate] = useState({});\n\n useEffect(() => {\n const updateCallback = () => forceUpdate({});\n // If the component had updated before we attach the listener, force one re-render\n if (component.onUpdate(updateCallback)) {\n forceUpdate({});\n }\n return () => component.offUpdate(updateCallback);\n }, [component]);\n\n // Merge contexts from parent + the UIComponent's own child context\n const childContext = component.getChildContext(parentContext);\n\n // Instead of returning `component.render()`, we do the following:\n\n // 1) Look up the \"renderer function\" for this component type\n const renderer = component.getRenderer(); // We'll define getRenderer() below\n\n if (!renderer) {\n throw new Error(`No renderer for type: ${component.getRenderType}`);\n }\n\n // 2) Build a function that returns child wrappers\n function renderChildrenFn(options?: childrenFunctionOptions) {\n const merged = options?.context ? { ...childContext, ...options.context } : childContext;\n return component\n .getChildren()\n .filter(({ id }) => {\n // If filter function is provided, use it to determine if we should include this child\n return !options?.filter || options.filter(id);\n })\n .map(({ component: child, id, className }) =>\n className ? (\n <div className={className}>\n <ComponentWrapper key={id} component={child} parentContext={merged} />\n </div>\n ) : (\n <ComponentWrapper key={id} component={child} parentContext={merged} />\n ),\n );\n }\n\n // 3) Finally call the renderer with (props, childrenFn, context)\n return renderer(component.props, renderChildrenFn, childContext);\n}\n","/** @jsxImportSource preact */\nimport { h, JSX, ComponentChildren } from 'preact';\nimport { useUICapability } from '../hooks';\nimport { ComponentWrapper } from './component-wrapper';\nimport { UIComponent } from '@embedpdf/plugin-ui';\n\n/**\n * Interface for UI components organized by type/location\n */\nexport interface UIComponentsMap {\n headers: {\n top: JSX.Element[];\n bottom: JSX.Element[];\n left: JSX.Element[];\n right: JSX.Element[];\n };\n panels: {\n left: JSX.Element[];\n right: JSX.Element[];\n };\n floating: {\n insideScroller: JSX.Element[];\n outsideScroller: JSX.Element[];\n };\n commandMenu: JSX.Element | null;\n}\n\n/**\n * Props for the PluginUIProvider\n */\nexport interface PluginUIProviderProps {\n /**\n * Render function that receives UI components\n */\n children: (components: UIComponentsMap) => JSX.Element;\n}\n\n/**\n * PluginUIProvider collects all components from the UI plugin system\n * and provides them to a render function without imposing any structure.\n *\n * It uses the render props pattern for maximum flexibility.\n */\nexport function PluginUIProvider({ children }: PluginUIProviderProps) {\n const { provides: uiProvides } = useUICapability();\n\n // Helper function to wrap UIComponents as JSX elements\n const wrapComponents = (components: UIComponent<any>[]): JSX.Element[] => {\n return components.map((component) => (\n <ComponentWrapper key={component.props.id} component={component} />\n ));\n };\n\n // Collect and wrap all components from UI plugin\n const componentMap: UIComponentsMap = {\n headers: {\n top: wrapComponents(uiProvides?.getHeadersByPlacement('top') || []),\n bottom: wrapComponents(uiProvides?.getHeadersByPlacement('bottom') || []),\n left: wrapComponents(uiProvides?.getHeadersByPlacement('left') || []),\n right: wrapComponents(uiProvides?.getHeadersByPlacement('right') || []),\n },\n panels: {\n left: wrapComponents(uiProvides?.getPanelsByLocation('left') || []),\n right: wrapComponents(uiProvides?.getPanelsByLocation('right') || []),\n },\n floating: {\n insideScroller: wrapComponents(uiProvides?.getFloatingComponents('inside') || []),\n outsideScroller: wrapComponents(uiProvides?.getFloatingComponents('outside') || []),\n },\n commandMenu: uiProvides?.getCommandMenu() ? (\n <ComponentWrapper component={uiProvides.getCommandMenu()!} />\n ) : null,\n };\n\n // Let the consumer determine the layout structure through the render prop\n return children(componentMap);\n}\n"],"mappings":"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","names":["jsx"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@embedpdf/plugin-ui",
3
- "version": "1.0.0",
3
+ "version": "1.0.1",
4
4
  "type": "module",
5
5
  "main": "./dist/index.cjs",
6
6
  "module": "./dist/index.js",
@@ -26,14 +26,14 @@
26
26
  "@types/react": "^18.2.0",
27
27
  "tsup": "^8.0.0",
28
28
  "typescript": "^5.0.0",
29
- "@embedpdf/models": "1.0.0",
30
- "@embedpdf/core": "1.0.0"
29
+ "@embedpdf/models": "1.0.1",
30
+ "@embedpdf/core": "1.0.1"
31
31
  },
32
32
  "peerDependencies": {
33
33
  "react": ">=16.8.0",
34
34
  "react-dom": ">=16.8.0",
35
35
  "preact": "^10.26.4",
36
- "@embedpdf/core": "1.0.0"
36
+ "@embedpdf/core": "1.0.1"
37
37
  },
38
38
  "files": [
39
39
  "dist",