@epam/ai-dial-modulify-ui 0.42.0-rc.10 → 0.42.0-rc.11

package/index.esm.js

@@ -9401,7 +9401,6 @@ const DATA_CUSTOMIZE_ID = 'data-customize-id';
 class ComponentBuilder {
     constructor(component) {
         this.htmlReplacements = {};
-        this.baseComponent = () => null;
         this.usedMethods = new Set();
         this.stylesFn = () => ({});
         this.classNamesFn = () => ({ host: [], component: [] });
@@ -9462,9 +9461,7 @@ class ComponentBuilder {
         }
         else {
             this.htmlReplacements = htmlContentFnOrBlocks;
-            this.htmlContentFn = ((children, state, handlers) => {
-                return this.applyHTMLReplacements(children, state, handlers);
-            });
+            this.htmlContentFn = ((children, state, handlers) => this.applyHTMLReplacements(children, state, handlers));
         }
         return this;
     }
@@ -9487,8 +9484,8 @@ class ComponentBuilder {
         return this;
     }
     build(options = {}) {
-        const Component = (props) => {
-            var _a, _b, _c, _d, _e, _f, _g;
+        const BuiltComponent = (props) => {
+            var _a, _b, _c, _d, _e, _f, _g, _h;
             const [componentState, setComponentState] = reactExports.useState({});
             const classNames = this.useClassNames(componentState);
             const handlers = this.useHandlers(componentState, setComponentState);
@@ -9505,21 +9502,21 @@ class ComponentBuilder {
                 ? this.baseComponent(Object.assign({}, props))
                 : reactExports.createElement(this.baseComponent, Object.assign({}, props)));
             const typedReactElement = reactElement;
-            const renderedChildren = reactExports.cloneElement(typedReactElement, Object.assign(Object.assign({}, typedReactElement.props), { className: composeClassNames(typedReactElement.props.className, composedComponentClassNames) }));
-            const Wrapper = composedHostClassNames || Object.keys((_e = handlers.host) !== null && _e !== void 0 ? _e : {}).length
+            const renderedChildren = reactExports.cloneElement(typedReactElement, Object.assign(Object.assign({}, typedReactElement.props), { className: composeClassNames((_e = typedReactElement.props.className) !== null && _e !== void 0 ? _e : '', composedComponentClassNames) }));
+            const Wrapper = composedHostClassNames || Object.keys((_f = handlers.host) !== null && _f !== void 0 ? _f : {}).length
                 ? 'div'
                 : reactExports.Fragment;
             const wrapperProps = Wrapper === 'div'
                 ? Object.assign({ className: composedHostClassNames }, handlers.host) : {};
-            return (jsxRuntimeExports.jsx(Wrapper, Object.assign({}, wrapperProps, { children: (_g = (_f = this.htmlContentFn) === null || _f === void 0 ? void 0 : _f.call(this, renderedChildren, componentState, handlers.component)) !== null && _g !== void 0 ? _g : renderedChildren })));
+            return (jsxRuntimeExports.jsx(Wrapper, Object.assign({}, wrapperProps, { children: (_h = (_g = this.htmlContentFn) === null || _g === void 0 ? void 0 : _g.call(this, renderedChildren, componentState, handlers.component)) !== null && _h !== void 0 ? _h : renderedChildren })));
         };
-        Object.defineProperty(Component, 'name', {
+        Object.defineProperty(BuiltComponent, 'name', {
             value: this.baseComponent.name,
             writable: false,
             configurable: true,
             enumerable: false,
         });
-        return (options === null || options === void 0 ? void 0 : options.reactMemo) ? reactExports.memo(Component) : Component;
+        return (options === null || options === void 0 ? void 0 : options.reactMemo) ? reactExports.memo(BuiltComponent) : BuiltComponent;
     }
     applyHTMLReplacements(children, state, handlers) {
         return reactExports.Children.map(children, (child) => {

package/package.json

@@ -2,7 +2,7 @@
   "name": "@epam/ai-dial-modulify-ui",
   "description": "Modulify Toolkit (UI) for turning a monolith-like project into a modular one",
   "homepage": "https://dialx.ai",
-  "version": "0.42.0-rc.10",
+  "version": "0.42.0-rc.11",
   "dependencies": {},
   "type": "module",
   "bugs": {

package/src/lib/ComponentBuilder.d.ts

@@ -1,8 +1,9 @@
-import { DependencyList, Dispatch, EffectCallback, FC, PropsWithChildren, ReactNode, SetStateAction } from 'react';
+import { DependencyList, Dispatch, EffectCallback, FC, ReactNode, SetStateAction } from 'react';
 import { Styles } from 'react-jss';
 export declare const DATA_CUSTOMIZE_ID = "data-customize-id";
 export type CB_State = Record<string, unknown>;
-export type CB_StateFn = (state: CB_State, setState: Dispatch<SetStateAction<CB_State>>) => void;
+export type CB_SetState = Dispatch<SetStateAction<CB_State>>;
+export type CB_StateFn = (state: CB_State, setState: CB_SetState) => void;
 export interface CB_Styles {
     host?: Styles;
     component?: Styles;
@@ -17,36 +18,35 @@ export interface CB_Effect {
     effect: EffectCallback;
     dependencies: DependencyList;
 }
-export type CB_EffectsFn = (state?: CB_State, setState?: Dispatch<SetStateAction<CB_State>>) => CB_Effect[];
+export type CB_EffectsFn = (state?: CB_State, setState?: CB_SetState) => CB_Effect[];
 type CB_HostHandlers = Record<string, (...args: unknown[]) => unknown>;
 type CB_ComponentHandlers = Record<string, (...args: unknown[]) => unknown>;
 export interface CB_Handlers {
     host?: CB_HostHandlers;
     component?: CB_ComponentHandlers;
 }
-export type CB_HandlersFn = (state?: CB_State, setState?: Dispatch<SetStateAction<CB_State>>) => CB_Handlers;
+export type CB_HandlersFn = (state?: CB_State, setState?: CB_SetState) => CB_Handlers;
 export type CB_HTMLContentFn = (children?: ReactNode | ReactNode[], state?: CB_State, handlers?: CB_Handlers['component']) => ReactNode;
-type ComponentProps<P> = P extends FC<infer Props> ? PropsWithChildren<Props> : never;
-export declare class ComponentBuilder<Component extends FC<PropsWithChildren<any>>, BlockIds extends string, Props extends ComponentProps<Component> = ComponentProps<Component>> {
+export declare class ComponentBuilder<P extends object, Component extends FC<P>, BlockIds extends string = never> {
     private htmlReplacements;
+    private readonly baseComponent;
     private constructor();
-    static use<Component extends FC<PropsWithChildren<any>>, BlockIds extends string = ''>(component: Component): ComponentBuilder<Component, BlockIds, ComponentProps<Component>>;
+    static use<BlockIds extends string = never, P extends object = object>(component: FC<P>): ComponentBuilder<P, FC<P>, BlockIds>;
     updateClassNames(updateFn: (classNames: CB_ClassNames, state?: CB_State) => CB_ClassNames): this;
     updateStyles(updateFn: (css: CB_Styles, state?: CB_State) => CB_Styles): this;
     updateHTML(htmlContentFnOrBlocks: CB_HTMLContentFn | Partial<Record<BlockIds, CB_HTMLContentFn>>): this;
-    updateHandlers(updateFn: (handlers: CB_Handlers, state?: CB_State, setState?: Dispatch<SetStateAction<CB_State>>) => CB_Handlers): this;
+    updateHandlers(updateFn: (handlers: CB_Handlers, state?: CB_State, setState?: CB_SetState) => CB_Handlers): this;
     addState(stateFn: CB_StateFn): this;
     addEffects(effectsFn: CB_EffectsFn): this;
     build(options?: {
         reactMemo?: boolean;
-    }): ((props: Props) => import("react/jsx-runtime").JSX.Element) | import("react").MemoExoticComponent<(props: Props) => import("react/jsx-runtime").JSX.Element>;
-    private readonly baseComponent;
+    }): FC<P> | import("react").NamedExoticComponent<P>;
     private usedMethods;
     private stylesFn;
     private classNamesFn;
     private htmlContentFn;
     private handlersFn;
-    private stateFn;
+    private stateFn?;
     private effectsFn;
     private useClassNames;
     private useStyles;

package/src/lib/Inversify.d.ts

@@ -1,22 +1,18 @@
-import { FC, PropsWithChildren } from 'react';
-export type PropsFrom<Component> = Component extends FC<infer Props> ? Props : never;
-type ComponentProps<P> = P extends FC<infer Props> ? PropsWithChildren<Props> : never;
-type OriginalComponent<P extends NonNullable<any> = NonNullable<any>> = FC<PropsWithChildren<P>>;
-type ComponentImplementation<OC extends OriginalComponent> = FC<ComponentProps<OC>>;
-interface ComponentResolve<OC extends OriginalComponent> {
-    instance: () => ComponentImplementation<OC> | undefined;
-    bind: (componentFactory: (component: OC) => ComponentImplementation<OC>) => ComponentImplementation<OC>;
+import { FC } from 'react';
+interface ComponentResolve<P extends object> {
+    instance: () => FC<P> | undefined;
+    bind: (componentFactory: (component: FC<P>) => FC<P>) => FC<P>;
     unbind: () => void;
-    render: () => ComponentImplementation<OC> & {
-        original: OC;
+    render: () => FC<P> & {
+        original: FC<P>;
     };
 }
 export declare class Inversify {
     private static container;
-    static register<OC extends OriginalComponent>(name: string, component: OC): ComponentImplementation<OC> & {
-        original: OC;
+    static register<P extends object>(name: string, component: FC<P>): FC<P> & {
+        original: FC<P>;
     };
-    static resolve<OC extends OriginalComponent>(component: OC): ComponentResolve<OC>;
+    static resolve<P extends object>(component: FC<P>): ComponentResolve<P>;
     private static bindImplementation;
     private static renderImplementation;
 }