web-component-wrapper 0.0.337 → 0.0.341

package/React.d.ts

@@ -1,7 +1,7 @@
 import { Mapping } from 'clientnode/type';
-import React from 'react';
+import React, { HTMLAttributes } from 'react';
 import Web from './Web';
-import { ComponentType, ReactRenderItemFactory, ReactRenderItemsFactory, ReactRenderItems, WebComponentAPI } from './type';
+import { ComponentAdapter, ComponentType, ReactRenderItemFactory, ReactRenderItemsFactory, ReactRenderItems, WebComponentAPI } from './type';
 /**
  * Adapter for exposing a react component as web-component.
  * @property static:attachWebComponentAdapterIfNotExists - Indicates whether to
@@ -18,14 +18,21 @@ import { ComponentType, ReactRenderItemFactory, ReactRenderItemsFactory, ReactRe
  * reacts memorizing wrapper to cache component render results.
  * @property isWrapped - Indicates whether react component is wrapped already.
  */
-export declare class ReactWeb<TElement = HTMLElement> extends Web<TElement> {
+export declare class ReactWeb<TElement = HTMLElement, ExternalProperties extends Mapping<unknown> = Mapping<unknown>, InternalProperties extends Mapping<unknown> & {
+    children?: Array<React.ReactNode> | React.ReactNode;
+    dangerouslySetInnerHTML?: HTMLAttributes<TElement>['dangerouslySetInnerHTML'];
+    key?: string;
+    ref?: null | {
+        current?: ComponentAdapter;
+    };
+} = Mapping<unknown>> extends Web<TElement, ExternalProperties, InternalProperties> {
     static attachWebComponentAdapterIfNotExists: boolean;
     static content: ComponentType | string;
     static react: typeof React;
     static _name: string;
-    compiledSlots: Mapping<ReactRenderItemsFactory> & {
+    compiledSlots: (Mapping<ReactRenderItemsFactory> & {
         children?: ReactRenderItemsFactory;
-    };
+    });
     preparedSlots: Mapping<ReactRenderItems> & {
         children?: ReactRenderItems;
     };
@@ -51,7 +58,7 @@ export declare class ReactWeb<TElement = HTMLElement> extends Web<TElement> {
      *
      * @returns Nothing.
      */
-    reflectExternalProperties(properties: Mapping<unknown>): void;
+    reflectExternalProperties(properties: Partial<ExternalProperties>): void;
     /**
      * Method which does the rendering job. Should be called when ever state
      * changes should be projected to the hosts dom content.
@@ -167,7 +174,7 @@ export declare class ReactWeb<TElement = HTMLElement> extends Web<TElement> {
      *
      * @returns Nothing.
      */
-    prepareProperties(properties: Mapping<unknown>): void;
+    prepareProperties(properties: InternalProperties): void;
     /**
      * Updates current component instance and reflects newly determined
      * properties.

package/Web.d.ts

@@ -96,7 +96,7 @@ import { AttributesReflectionConfiguration, CompiledDomNodeTemplate, ComponentAd
  *
  * @property slots - Grabbed slots which where present in the connecting phase.
  */
-export declare class Web<TElement = HTMLElement> extends HTMLElement {
+export declare class Web<TElement = HTMLElement, ExternalProperties extends Mapping<unknown> = Mapping<unknown>, InternalProperties extends Mapping<unknown> = Mapping<unknown>> extends HTMLElement {
     static applyRootBinding: boolean;
     static content: unknown;
     static determineRootBinding: boolean;
@@ -130,15 +130,15 @@ export declare class Web<TElement = HTMLElement> extends HTMLElement {
     scope: Mapping<unknown>;
     domNodeEventBindings: Map<Node, EventCallbackMapping>;
     domNodeTemplateCache: CompiledDomNodeTemplate;
-    externalProperties: Mapping<unknown>;
+    externalProperties: ExternalProperties;
     ignoreAttributeUpdateObservations: boolean;
-    internalProperties: Mapping<unknown>;
+    internalProperties: InternalProperties;
     outputEventNames: Set<string>;
     instance: null | {
         current?: ComponentAdapter;
     };
     isRoot: boolean;
-    root: ShadowRoot | Web<TElement>;
+    root: ShadowRoot | Web<TElement, ExternalProperties, InternalProperties>;
     runDomConnectionAndRenderingInSameEventQueue: boolean;
     readonly self: typeof Web;
     slots: Mapping<HTMLElement> & {
@@ -417,7 +417,7 @@ export declare class Web<TElement = HTMLElement> extends HTMLElement {
      *
      * @returns Nothing.
      */
-    reflectExternalProperties(properties: Mapping<unknown>): void;
+    reflectExternalProperties(properties: Partial<ExternalProperties>): void;
     /**
      * Reflects wrapped component state back to web-component's attributes and
      * properties.
@@ -425,7 +425,7 @@ export declare class Web<TElement = HTMLElement> extends HTMLElement {
      *
      * @returns Nothing.
      */
-    reflectProperties(properties: Mapping<unknown>): void;
+    reflectProperties(properties: Partial<ExternalProperties>): void;
     /**
      * Triggers a new rendering cycle by respecting batch configuration.
      * @param reason - A description why rendering should be triggered.
@@ -441,7 +441,7 @@ export declare class Web<TElement = HTMLElement> extends HTMLElement {
      *
      * @returns Mapped properties or null if nothing could be mapped.
      */
-    reflectEventToProperties(name: string, parameters: Array<unknown>): Mapping<unknown> | null;
+    reflectEventToProperties(name: string, parameters: Array<unknown>): Partial<ExternalProperties> | null;
     /**
      * Evaluates given property value depending on its type specification and
      * registers in properties mapping object.

package/index.d.ts

@@ -1,3 +1,4 @@
+import { Mapping } from 'clientnode/type';
 import ReactWebImport from './React';
 import WebImport from './Web';
 import { ComponentType, WebComponentAPI, WebComponentConfiguration } from './type';
@@ -14,5 +15,5 @@ export declare const Web: typeof WebImport;
  *
  * @returns Generated object to register and retrieve generated web component.
  */
-export declare const wrapAsWebComponent: <Type extends ComponentType = ComponentType>(component: Type, nameHint?: string, configuration?: WebComponentConfiguration) => WebComponentAPI;
+export declare const wrapAsWebComponent: <Type extends ComponentType = ComponentType, ExternalProperties extends Mapping<unknown> = Mapping<unknown>, InternalProperties extends Mapping<unknown> = Mapping<unknown>, EventParameters extends unknown[] = unknown[]>(component: Type, nameHint?: string, configuration?: WebComponentConfiguration<ExternalProperties, InternalProperties, EventParameters>) => WebComponentAPI;
 export default wrapAsWebComponent;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "web-component-wrapper",
-  "version": "0.0.337",
+  "version": "0.0.341",
   "description": "Generic web-component base class and framework specific wrapper.",
   "keywords": [
     "component",

package/type.d.ts

@@ -11,9 +11,12 @@ export declare type CompiledDomNodeTemplateItem = {
 };
 export declare type CompiledDomNodeTemplate<NodeType = Node> = Map<NodeType, CompiledDomNodeTemplateItem>;
 export declare type EventCallbackMapping = Map<string, () => void>;
-export declare type EventMapping<ExternalPropertiesType = Mapping<unknown>, InternalPropertiesType = Mapping<unknown>> = [ExternalPropertiesType, InternalPropertiesType] | ExternalPropertiesType;
-export declare type EventMapper<E = Mapping<unknown>, I = Mapping<unknown>> = (..._parameter: Array<unknown>) => EventMapping<E, I>;
-export declare type EventToPropertyMapping<E = Mapping<unknown>, I = Mapping<unknown>> = Mapping<true | EventMapper<E, I>>;
+export declare type EventMapping<ExternalProperties extends Mapping<unknown> = Mapping<unknown>, InternalProperties extends Mapping<unknown> = Mapping<unknown>> = ([
+    Partial<ExternalProperties>,
+    Partial<InternalProperties>
+] | Partial<ExternalProperties>);
+export declare type EventMapper<E extends Mapping<unknown> = Mapping<unknown>, I extends Mapping<unknown> = Mapping<unknown>, P extends Array<unknown> = Array<unknown>> = (..._parameters: P) => EventMapping<E, I>;
+export declare type EventToPropertyMapping<E extends Mapping<unknown> = Mapping<unknown>, I extends Mapping<unknown> = Mapping<unknown>, P extends Array<unknown> = Array<unknown>> = Mapping<true | EventMapper<E, I, P>>;
 export declare type AttributesReflectionConfiguration = Array<string> | Map<string, string | ValueOf<typeof PropertyTypes>> | string | Mapping<ValueOf<typeof PropertyTypes> | string>;
 export declare type ScopeDeclaration = Array<string> | Mapping<unknown>;
 export declare type PreCompiledItem = {
@@ -26,11 +29,11 @@ export declare type ReactRenderItemsFactory = Array<ReactRenderItemFactory> | Re
 export declare type ReactRenderBaseItem = ReactElement | string | null;
 export declare type ReactRenderItem = ((..._parameters: Array<unknown>) => ReactRenderBaseItem) | ReactRenderBaseItem;
 export declare type ReactRenderItems = Array<ReactRenderItem> | ReactRenderItem;
-export interface WebComponentConfiguration {
+export interface WebComponentConfiguration<ExternalProperties extends Mapping<unknown> = Mapping<unknown>, InternalProperties extends Mapping<unknown> = Mapping<unknown>, EventParameters extends Array<unknown> = Array<unknown>> {
     attachWebComponentAdapterIfNotExists?: boolean;
     controllableProperties?: Array<string>;
-    eventToPropertyMapping?: EventToPropertyMapping;
-    internalProperties?: Mapping<unknown>;
+    eventToPropertyMapping?: EventToPropertyMapping<ExternalProperties, InternalProperties, EventParameters>;
+    internalProperties?: InternalProperties;
     propertiesToReflectAsAttributes?: AttributesReflectionConfiguration;
     propertyAliases?: Mapping;
     propTypes?: Mapping<ValueOf<typeof PropertyTypes>>;