fix(di): fix partial merge of registries

Author: Vittly

packages/di/di.tsx

@@ -220,7 +220,6 @@ export class Registry {
       if (!otherRegistryEntities.hasOwnProperty(entityName)) continue
 
       clone.entities[entityName] = this.mergeEntities(
-        this.id,
         clone.entities[entityName],
         otherRegistryEntities[entityName],
       )
@@ -232,19 +231,12 @@ export class Registry {
   /**
    * Returns extended or replaced entity
    *
-   * @param id entity entry id
    * @param base base implementation
    * @param overrides overridden implementation
    */
-  private mergeEntities(
-    id: string,
-    base: IRegistryEntity,
-    overrides: IRegistryEntity,
-  ): IRegistryEntity {
+  private mergeEntities(base: IRegistryEntity, overrides: IRegistryEntity): IRegistryEntity {
     if (isOverload(overrides)) {
-      if (!base && __DEV__) {
-        throw new Error(`Overload has no base in Registry '${id}'.`)
-      }
+      if (!base) return overrides
 
       if (isOverload(base)) {
         // If both entities are hocs, then create compose-hoc

packages/di/test/di.test.tsx

@@ -243,6 +243,40 @@ describe('@bem-react/di', () => {
         expect(render(<AppSuperExtended />).text()).toEqual('super extended content')
       })
 
+      test('should partially extend components in registry', () => {
+        const baseRegistry = new Registry({ id: 'registry' })
+        const extendedLeftRegistry = new Registry({ id: 'registry' })
+        const extendedRightRegistry = new Registry({ id: 'registry' })
+        const Left: React.FC = () => <span>left</span>
+        const Right: React.FC = () => <span>right</span>
+        const Extension = (Base: React.FC) => () => (
+          <div>
+            extended <Base />
+          </div>
+        )
+
+        baseRegistry.fill({ Left, Right })
+        extendedLeftRegistry.extends<React.FC>('Left', Extension)
+        extendedRightRegistry.extends<React.FC>('Right', Extension)
+
+        const AppPresenter: React.FC = () => (
+          <RegistryConsumer id="registry">
+            {({ Left, Right }) => (
+              <>
+                <Left />
+                <Right />
+              </>
+            )}
+          </RegistryConsumer>
+        )
+
+        const App = withRegistry(baseRegistry)(AppPresenter)
+        const AppExtended = withRegistry(extendedLeftRegistry, extendedRightRegistry)(App)
+
+        expect(render(<App />).text()).toEqual('leftright')
+        expect(render(<AppExtended />).text()).toEqual('extended leftextended right')
+      })
+
       test('should extend other values in registry', () => {
         const baseRegistry = new Registry({ id: 'registry' }).fill({
           prop: 'foo',