@elementor/locations 0.6.1 → 0.6.2

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.
package/CHANGELOG.md CHANGED
@@ -3,6 +3,14 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [0.6.2](https://github.com/elementor/elementor-packages/compare/@elementor/locations@0.6.1...@elementor/locations@0.6.2) (2023-07-17)
7
+
8
+ **Note:** Version bump only for package @elementor/locations
9
+
10
+
11
+
12
+
13
+
6
14
  ## [0.6.1](https://github.com/elementor/elementor-packages/compare/@elementor/locations@0.6.0...@elementor/locations@0.6.1) (2023-07-17)
7
15
 
8
16
  **Note:** Version bump only for package @elementor/locations
package/dist/index.d.mts CHANGED
@@ -1,17 +1,17 @@
1
1
  import { ComponentType } from 'react';
2
2
 
3
3
  type AnyProps = object;
4
- type Filler<TProps extends object = AnyProps> = ComponentType<TProps>;
4
+ type InjectedComponent<TProps extends object = AnyProps> = ComponentType<TProps>;
5
5
  type Id = string;
6
6
  type Priority = number;
7
7
  type Injection<TProps extends object = AnyProps> = {
8
8
  id: Id;
9
- filler: Filler<TProps>;
9
+ component: InjectedComponent<TProps>;
10
10
  priority: Priority;
11
11
  };
12
12
  type InjectArgs<TProps extends object = AnyProps> = {
13
13
  id: Id;
14
- filler: Filler<TProps>;
14
+ component: InjectedComponent<TProps>;
15
15
  options?: {
16
16
  priority?: Priority;
17
17
  overwrite?: boolean;
@@ -27,4 +27,4 @@ type Location<TProps extends object = AnyProps> = {
27
27
  declare function createLocation<TProps extends object = AnyProps>(): Location<TProps>;
28
28
  declare function flushAllInjections(): void;
29
29
 
30
- export { AnyProps, Filler, Id, InjectArgs, Injection, Location, Priority, createLocation, flushAllInjections };
30
+ export { AnyProps, Id, InjectArgs, InjectedComponent, Injection, Location, Priority, createLocation, flushAllInjections };
package/dist/index.d.ts CHANGED
@@ -1,17 +1,17 @@
1
1
  import { ComponentType } from 'react';
2
2
 
3
3
  type AnyProps = object;
4
- type Filler<TProps extends object = AnyProps> = ComponentType<TProps>;
4
+ type InjectedComponent<TProps extends object = AnyProps> = ComponentType<TProps>;
5
5
  type Id = string;
6
6
  type Priority = number;
7
7
  type Injection<TProps extends object = AnyProps> = {
8
8
  id: Id;
9
- filler: Filler<TProps>;
9
+ component: InjectedComponent<TProps>;
10
10
  priority: Priority;
11
11
  };
12
12
  type InjectArgs<TProps extends object = AnyProps> = {
13
13
  id: Id;
14
- filler: Filler<TProps>;
14
+ component: InjectedComponent<TProps>;
15
15
  options?: {
16
16
  priority?: Priority;
17
17
  overwrite?: boolean;
@@ -27,4 +27,4 @@ type Location<TProps extends object = AnyProps> = {
27
27
  declare function createLocation<TProps extends object = AnyProps>(): Location<TProps>;
28
28
  declare function flushAllInjections(): void;
29
29
 
30
- export { AnyProps, Filler, Id, InjectArgs, Injection, Location, Priority, createLocation, flushAllInjections };
30
+ export { AnyProps, Id, InjectArgs, InjectedComponent, Injection, Location, Priority, createLocation, flushAllInjections };
package/dist/index.js CHANGED
@@ -38,7 +38,7 @@ module.exports = __toCommonJS(src_exports);
38
38
  // src/api.tsx
39
39
  var React2 = __toESM(require("react"));
40
40
 
41
- // src/components/filler-wrapper.tsx
41
+ // src/components/injected-component-wrapper.tsx
42
42
  var React = __toESM(require("react"));
43
43
  var import_react2 = require("react");
44
44
 
@@ -59,8 +59,8 @@ var ErrorBoundary = class extends import_react.Component {
59
59
  }
60
60
  };
61
61
 
62
- // src/components/filler-wrapper.tsx
63
- function FillerWrapper({ children }) {
62
+ // src/components/injected-component-wrapper.tsx
63
+ function InjectedComponentWrapper({ children }) {
64
64
  return /* @__PURE__ */ React.createElement(ErrorBoundary, { fallback: null }, /* @__PURE__ */ React.createElement(import_react2.Suspense, { fallback: null }, children));
65
65
  }
66
66
 
@@ -85,20 +85,20 @@ function createLocation() {
85
85
  function flushAllInjections() {
86
86
  flushInjectionsFns.forEach((flush) => flush());
87
87
  }
88
- function wrapFiller(FillerComponent) {
89
- return (props) => /* @__PURE__ */ React2.createElement(FillerWrapper, null, /* @__PURE__ */ React2.createElement(FillerComponent, { ...props }));
88
+ function wrapInjectedComponent(Component2) {
89
+ return (props) => /* @__PURE__ */ React2.createElement(InjectedComponentWrapper, null, /* @__PURE__ */ React2.createElement(Component2, { ...props }));
90
90
  }
91
91
  function createSlot(useInjections) {
92
92
  return (props) => {
93
93
  const injections = useInjections();
94
- return /* @__PURE__ */ React2.createElement(React2.Fragment, null, injections.map(({ id, filler: Component2 }) => /* @__PURE__ */ React2.createElement(Component2, { ...props, key: id })));
94
+ return /* @__PURE__ */ React2.createElement(React2.Fragment, null, injections.map(({ id, component: Component2 }) => /* @__PURE__ */ React2.createElement(Component2, { ...props, key: id })));
95
95
  };
96
96
  }
97
97
  function createGetInjections(injections) {
98
98
  return () => [...injections.values()].sort((a, b) => a.priority - b.priority);
99
99
  }
100
100
  function createInject(injections) {
101
- return ({ filler, id, options = {} }) => {
101
+ return ({ component, id, options = {} }) => {
102
102
  if (injections.has(id) && !options?.overwrite) {
103
103
  console.warn(
104
104
  `An injection with the id "${id}" already exists. Did you mean to use "options.overwrite"?`
@@ -107,7 +107,7 @@ function createInject(injections) {
107
107
  }
108
108
  injections.set(id, {
109
109
  id,
110
- filler: wrapFiller(filler),
110
+ component: wrapInjectedComponent(component),
111
111
  priority: options.priority ?? DEFAULT_PRIORITY
112
112
  });
113
113
  };
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/api.tsx","../src/components/filler-wrapper.tsx","../src/components/error-boundary.tsx"],"sourcesContent":["export * from './types';\nexport { createLocation, flushAllInjections } from './api';\n","import * as React from 'react';\nimport { Filler, Injection, InjectArgs, AnyProps, Location, Id } from './types';\nimport FillerWrapper from './components/filler-wrapper';\nimport { useMemo } from 'react';\n\ntype InjectionsMap<TProps extends object = AnyProps> = Map<Id, Injection<TProps>>\n\nconst DEFAULT_PRIORITY = 10;\n\n// Allow flushing all injections at once, for testing purposes.\nconst flushInjectionsFns: ( () => void )[] = [];\n\nexport function createLocation<TProps extends object = AnyProps>(): Location<TProps> {\n\tconst injections: InjectionsMap<TProps> = new Map();\n\n\tconst getInjections = createGetInjections( injections );\n\tconst useInjections = createUseInjections( getInjections );\n\tconst Slot = createSlot( useInjections );\n\tconst inject = createInject( injections );\n\n\t// Push the clear function to the flushInjectionsFns array, so we can flush all injections at once.\n\tflushInjectionsFns.push( () => injections.clear() );\n\n\treturn {\n\t\tinject,\n\t\tgetInjections,\n\t\tuseInjections,\n\t\tSlot,\n\t};\n}\n\nexport function flushAllInjections() {\n\tflushInjectionsFns.forEach( ( flush ) => flush() );\n}\n\nfunction wrapFiller<TProps extends object = AnyProps>( FillerComponent: Filler<TProps> ) {\n\treturn ( props: TProps ) => (\n\t\t<FillerWrapper>\n\t\t\t<FillerComponent { ...props } />\n\t\t</FillerWrapper>\n\t);\n}\n\nfunction createSlot<TProps extends object = AnyProps>( useInjections: Location<TProps>[ 'useInjections' ] ) {\n\treturn ( props: TProps ) => {\n\t\tconst injections = useInjections();\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ injections.map( ( { id, filler: Component } ) => (\n\t\t\t\t\t<Component { ...props } key={ id } />\n\t\t\t\t) ) }\n\t\t\t</>\n\t\t);\n\t};\n}\n\nfunction createGetInjections<TProps extends object = AnyProps>( injections: InjectionsMap<TProps> ) {\n\treturn () => [ ...injections.values() ]\n\t\t.sort( ( a, b ) => a.priority - b.priority );\n}\n\nfunction createInject<TProps extends object = AnyProps>( injections: InjectionsMap<TProps> ) {\n\treturn ( { filler, id, options = {} }: InjectArgs<TProps> ) => {\n\t\tif ( injections.has( id ) && ! options?.overwrite ) {\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.warn(\n\t\t\t\t`An injection with the id \"${ id }\" already exists. Did you mean to use \"options.overwrite\"?`,\n\t\t\t);\n\n\t\t\treturn;\n\t\t}\n\n\t\tinjections.set( id, {\n\t\t\tid,\n\t\t\tfiller: wrapFiller( filler ),\n\t\t\tpriority: options.priority ?? DEFAULT_PRIORITY,\n\t\t} );\n\t};\n}\n\nfunction createUseInjections<TProps extends object = AnyProps>( getInjections: Location<TProps>[ 'getInjections' ] ) {\n\treturn () => useMemo( () => getInjections(), [] );\n}\n","import * as React from 'react';\nimport { ReactNode, Suspense } from 'react';\nimport ErrorBoundary from './error-boundary';\n\nexport default function FillerWrapper( { children }: { children: ReactNode } ) {\n\treturn (\n\t\t<ErrorBoundary fallback={ null }>\n\t\t\t<Suspense fallback={ null }>\n\t\t\t\t{ children }\n\t\t\t</Suspense>\n\t\t</ErrorBoundary>\n\t);\n}\n","import { Component, ReactNode } from 'react';\n\ninterface Props {\n\tchildren?: ReactNode;\n\tfallback: ReactNode;\n}\n\ninterface State {\n\thasError: boolean;\n}\n\nexport default class ErrorBoundary extends Component<Props, State> {\n\tpublic state: State = {\n\t\thasError: false,\n\t};\n\n\tpublic static getDerivedStateFromError(): State {\n\t\t// Update state so the next render will show the fallback UI.\n\t\treturn { hasError: true };\n\t}\n\n\tpublic render() {\n\t\tif ( this.state.hasError ) {\n\t\t\treturn this.props.fallback;\n\t\t}\n\n\t\treturn this.props.children;\n\t}\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,IAAAA,SAAuB;;;ACAvB,YAAuB;AACvB,IAAAC,gBAAoC;;;ACDpC,mBAAqC;AAWrC,IAAqB,gBAArB,cAA2C,uBAAwB;AAAA,EAC3D,QAAe;AAAA,IACrB,UAAU;AAAA,EACX;AAAA,EAEA,OAAc,2BAAkC;AAE/C,WAAO,EAAE,UAAU,KAAK;AAAA,EACzB;AAAA,EAEO,SAAS;AACf,QAAK,KAAK,MAAM,UAAW;AAC1B,aAAO,KAAK,MAAM;AAAA,IACnB;AAEA,WAAO,KAAK,MAAM;AAAA,EACnB;AACD;;;ADxBe,SAAR,cAAgC,EAAE,SAAS,GAA6B;AAC9E,SACC,oCAAC,iBAAc,UAAW,QACzB,oCAAC,0BAAS,UAAW,QAClB,QACH,CACD;AAEF;;;ADTA,IAAAC,gBAAwB;AAIxB,IAAM,mBAAmB;AAGzB,IAAM,qBAAuC,CAAC;AAEvC,SAAS,iBAAqE;AACpF,QAAM,aAAoC,oBAAI,IAAI;AAElD,QAAM,gBAAgB,oBAAqB,UAAW;AACtD,QAAM,gBAAgB,oBAAqB,aAAc;AACzD,QAAM,OAAO,WAAY,aAAc;AACvC,QAAM,SAAS,aAAc,UAAW;AAGxC,qBAAmB,KAAM,MAAM,WAAW,MAAM,CAAE;AAElD,SAAO;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD;AACD;AAEO,SAAS,qBAAqB;AACpC,qBAAmB,QAAS,CAAE,UAAW,MAAM,CAAE;AAClD;AAEA,SAAS,WAA8C,iBAAkC;AACxF,SAAO,CAAE,UACR,qCAAC,qBACA,qCAAC,mBAAkB,GAAG,OAAQ,CAC/B;AAEF;AAEA,SAAS,WAA8C,eAAqD;AAC3G,SAAO,CAAE,UAAmB;AAC3B,UAAM,aAAa,cAAc;AAEjC,WACC,4DACG,WAAW,IAAK,CAAE,EAAE,IAAI,QAAQC,WAAU,MAC3C,qCAACA,YAAA,EAAY,GAAG,OAAQ,KAAM,IAAK,CAClC,CACH;AAAA,EAEF;AACD;AAEA,SAAS,oBAAuD,YAAoC;AACnG,SAAO,MAAM,CAAE,GAAG,WAAW,OAAO,CAAE,EACpC,KAAM,CAAE,GAAG,MAAO,EAAE,WAAW,EAAE,QAAS;AAC7C;AAEA,SAAS,aAAgD,YAAoC;AAC5F,SAAO,CAAE,EAAE,QAAQ,IAAI,UAAU,CAAC,EAAE,MAA2B;AAC9D,QAAK,WAAW,IAAK,EAAG,KAAK,CAAE,SAAS,WAAY;AAEnD,cAAQ;AAAA,QACP,6BAA8B,EAAG;AAAA,MAClC;AAEA;AAAA,IACD;AAEA,eAAW,IAAK,IAAI;AAAA,MACnB;AAAA,MACA,QAAQ,WAAY,MAAO;AAAA,MAC3B,UAAU,QAAQ,YAAY;AAAA,IAC/B,CAAE;AAAA,EACH;AACD;AAEA,SAAS,oBAAuD,eAAqD;AACpH,SAAO,UAAM,uBAAS,MAAM,cAAc,GAAG,CAAC,CAAE;AACjD;","names":["React","import_react","import_react","Component"]}
1
+ {"version":3,"sources":["../src/index.ts","../src/api.tsx","../src/components/injected-component-wrapper.tsx","../src/components/error-boundary.tsx"],"sourcesContent":["export * from './types';\nexport { createLocation, flushAllInjections } from './api';\n","import * as React from 'react';\nimport { InjectedComponent, Injection, InjectArgs, AnyProps, Location, Id } from './types';\nimport InjectedComponentWrapper from './components/injected-component-wrapper';\nimport { useMemo } from 'react';\n\ntype InjectionsMap<TProps extends object = AnyProps> = Map<Id, Injection<TProps>>\n\nconst DEFAULT_PRIORITY = 10;\n\n// Allow flushing all injections at once, for testing purposes.\nconst flushInjectionsFns: ( () => void )[] = [];\n\nexport function createLocation<TProps extends object = AnyProps>(): Location<TProps> {\n\tconst injections: InjectionsMap<TProps> = new Map();\n\n\tconst getInjections = createGetInjections( injections );\n\tconst useInjections = createUseInjections( getInjections );\n\tconst Slot = createSlot( useInjections );\n\tconst inject = createInject( injections );\n\n\t// Push the clear function to the flushInjectionsFns array, so we can flush all injections at once.\n\tflushInjectionsFns.push( () => injections.clear() );\n\n\treturn {\n\t\tinject,\n\t\tgetInjections,\n\t\tuseInjections,\n\t\tSlot,\n\t};\n}\n\nexport function flushAllInjections() {\n\tflushInjectionsFns.forEach( ( flush ) => flush() );\n}\n\nfunction wrapInjectedComponent<TProps extends object = AnyProps>( Component: InjectedComponent<TProps> ) {\n\treturn ( props: TProps ) => (\n\t\t<InjectedComponentWrapper>\n\t\t\t<Component { ...props } />\n\t\t</InjectedComponentWrapper>\n\t);\n}\n\nfunction createSlot<TProps extends object = AnyProps>( useInjections: Location<TProps>[ 'useInjections' ] ) {\n\treturn ( props: TProps ) => {\n\t\tconst injections = useInjections();\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ injections.map( ( { id, component: Component } ) => (\n\t\t\t\t\t<Component { ...props } key={ id } />\n\t\t\t\t) ) }\n\t\t\t</>\n\t\t);\n\t};\n}\n\nfunction createGetInjections<TProps extends object = AnyProps>( injections: InjectionsMap<TProps> ) {\n\treturn () => [ ...injections.values() ]\n\t\t.sort( ( a, b ) => a.priority - b.priority );\n}\n\nfunction createInject<TProps extends object = AnyProps>( injections: InjectionsMap<TProps> ) {\n\treturn ( { component, id, options = {} }: InjectArgs<TProps> ) => {\n\t\tif ( injections.has( id ) && ! options?.overwrite ) {\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.warn(\n\t\t\t\t`An injection with the id \"${ id }\" already exists. Did you mean to use \"options.overwrite\"?`,\n\t\t\t);\n\n\t\t\treturn;\n\t\t}\n\n\t\tinjections.set( id, {\n\t\t\tid,\n\t\t\tcomponent: wrapInjectedComponent( component ),\n\t\t\tpriority: options.priority ?? DEFAULT_PRIORITY,\n\t\t} );\n\t};\n}\n\nfunction createUseInjections<TProps extends object = AnyProps>( getInjections: Location<TProps>[ 'getInjections' ] ) {\n\treturn () => useMemo( () => getInjections(), [] );\n}\n","import * as React from 'react';\nimport { ReactNode, Suspense } from 'react';\nimport ErrorBoundary from './error-boundary';\n\nexport default function InjectedComponentWrapper( { children }: { children: ReactNode } ) {\n\treturn (\n\t\t<ErrorBoundary fallback={ null }>\n\t\t\t<Suspense fallback={ null }>\n\t\t\t\t{ children }\n\t\t\t</Suspense>\n\t\t</ErrorBoundary>\n\t);\n}\n","import { Component, ReactNode } from 'react';\n\ninterface Props {\n\tchildren?: ReactNode;\n\tfallback: ReactNode;\n}\n\ninterface State {\n\thasError: boolean;\n}\n\nexport default class ErrorBoundary extends Component<Props, State> {\n\tpublic state: State = {\n\t\thasError: false,\n\t};\n\n\tpublic static getDerivedStateFromError(): State {\n\t\t// Update state so the next render will show the fallback UI.\n\t\treturn { hasError: true };\n\t}\n\n\tpublic render() {\n\t\tif ( this.state.hasError ) {\n\t\t\treturn this.props.fallback;\n\t\t}\n\n\t\treturn this.props.children;\n\t}\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,IAAAA,SAAuB;;;ACAvB,YAAuB;AACvB,IAAAC,gBAAoC;;;ACDpC,mBAAqC;AAWrC,IAAqB,gBAArB,cAA2C,uBAAwB;AAAA,EAC3D,QAAe;AAAA,IACrB,UAAU;AAAA,EACX;AAAA,EAEA,OAAc,2BAAkC;AAE/C,WAAO,EAAE,UAAU,KAAK;AAAA,EACzB;AAAA,EAEO,SAAS;AACf,QAAK,KAAK,MAAM,UAAW;AAC1B,aAAO,KAAK,MAAM;AAAA,IACnB;AAEA,WAAO,KAAK,MAAM;AAAA,EACnB;AACD;;;ADxBe,SAAR,yBAA2C,EAAE,SAAS,GAA6B;AACzF,SACC,oCAAC,iBAAc,UAAW,QACzB,oCAAC,0BAAS,UAAW,QAClB,QACH,CACD;AAEF;;;ADTA,IAAAC,gBAAwB;AAIxB,IAAM,mBAAmB;AAGzB,IAAM,qBAAuC,CAAC;AAEvC,SAAS,iBAAqE;AACpF,QAAM,aAAoC,oBAAI,IAAI;AAElD,QAAM,gBAAgB,oBAAqB,UAAW;AACtD,QAAM,gBAAgB,oBAAqB,aAAc;AACzD,QAAM,OAAO,WAAY,aAAc;AACvC,QAAM,SAAS,aAAc,UAAW;AAGxC,qBAAmB,KAAM,MAAM,WAAW,MAAM,CAAE;AAElD,SAAO;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD;AACD;AAEO,SAAS,qBAAqB;AACpC,qBAAmB,QAAS,CAAE,UAAW,MAAM,CAAE;AAClD;AAEA,SAAS,sBAAyDC,YAAuC;AACxG,SAAO,CAAE,UACR,qCAAC,gCACA,qCAACA,YAAA,EAAY,GAAG,OAAQ,CACzB;AAEF;AAEA,SAAS,WAA8C,eAAqD;AAC3G,SAAO,CAAE,UAAmB;AAC3B,UAAM,aAAa,cAAc;AAEjC,WACC,4DACG,WAAW,IAAK,CAAE,EAAE,IAAI,WAAWA,WAAU,MAC9C,qCAACA,YAAA,EAAY,GAAG,OAAQ,KAAM,IAAK,CAClC,CACH;AAAA,EAEF;AACD;AAEA,SAAS,oBAAuD,YAAoC;AACnG,SAAO,MAAM,CAAE,GAAG,WAAW,OAAO,CAAE,EACpC,KAAM,CAAE,GAAG,MAAO,EAAE,WAAW,EAAE,QAAS;AAC7C;AAEA,SAAS,aAAgD,YAAoC;AAC5F,SAAO,CAAE,EAAE,WAAW,IAAI,UAAU,CAAC,EAAE,MAA2B;AACjE,QAAK,WAAW,IAAK,EAAG,KAAK,CAAE,SAAS,WAAY;AAEnD,cAAQ;AAAA,QACP,6BAA8B,EAAG;AAAA,MAClC;AAEA;AAAA,IACD;AAEA,eAAW,IAAK,IAAI;AAAA,MACnB;AAAA,MACA,WAAW,sBAAuB,SAAU;AAAA,MAC5C,UAAU,QAAQ,YAAY;AAAA,IAC/B,CAAE;AAAA,EACH;AACD;AAEA,SAAS,oBAAuD,eAAqD;AACpH,SAAO,UAAM,uBAAS,MAAM,cAAc,GAAG,CAAC,CAAE;AACjD;","names":["React","import_react","import_react","Component"]}
package/dist/index.mjs CHANGED
@@ -1,7 +1,7 @@
1
1
  // src/api.tsx
2
2
  import * as React2 from "react";
3
3
 
4
- // src/components/filler-wrapper.tsx
4
+ // src/components/injected-component-wrapper.tsx
5
5
  import * as React from "react";
6
6
  import { Suspense } from "react";
7
7
 
@@ -22,8 +22,8 @@ var ErrorBoundary = class extends Component {
22
22
  }
23
23
  };
24
24
 
25
- // src/components/filler-wrapper.tsx
26
- function FillerWrapper({ children }) {
25
+ // src/components/injected-component-wrapper.tsx
26
+ function InjectedComponentWrapper({ children }) {
27
27
  return /* @__PURE__ */ React.createElement(ErrorBoundary, { fallback: null }, /* @__PURE__ */ React.createElement(Suspense, { fallback: null }, children));
28
28
  }
29
29
 
@@ -48,20 +48,20 @@ function createLocation() {
48
48
  function flushAllInjections() {
49
49
  flushInjectionsFns.forEach((flush) => flush());
50
50
  }
51
- function wrapFiller(FillerComponent) {
52
- return (props) => /* @__PURE__ */ React2.createElement(FillerWrapper, null, /* @__PURE__ */ React2.createElement(FillerComponent, { ...props }));
51
+ function wrapInjectedComponent(Component2) {
52
+ return (props) => /* @__PURE__ */ React2.createElement(InjectedComponentWrapper, null, /* @__PURE__ */ React2.createElement(Component2, { ...props }));
53
53
  }
54
54
  function createSlot(useInjections) {
55
55
  return (props) => {
56
56
  const injections = useInjections();
57
- return /* @__PURE__ */ React2.createElement(React2.Fragment, null, injections.map(({ id, filler: Component2 }) => /* @__PURE__ */ React2.createElement(Component2, { ...props, key: id })));
57
+ return /* @__PURE__ */ React2.createElement(React2.Fragment, null, injections.map(({ id, component: Component2 }) => /* @__PURE__ */ React2.createElement(Component2, { ...props, key: id })));
58
58
  };
59
59
  }
60
60
  function createGetInjections(injections) {
61
61
  return () => [...injections.values()].sort((a, b) => a.priority - b.priority);
62
62
  }
63
63
  function createInject(injections) {
64
- return ({ filler, id, options = {} }) => {
64
+ return ({ component, id, options = {} }) => {
65
65
  if (injections.has(id) && !options?.overwrite) {
66
66
  console.warn(
67
67
  `An injection with the id "${id}" already exists. Did you mean to use "options.overwrite"?`
@@ -70,7 +70,7 @@ function createInject(injections) {
70
70
  }
71
71
  injections.set(id, {
72
72
  id,
73
- filler: wrapFiller(filler),
73
+ component: wrapInjectedComponent(component),
74
74
  priority: options.priority ?? DEFAULT_PRIORITY
75
75
  });
76
76
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/api.tsx","../src/components/filler-wrapper.tsx","../src/components/error-boundary.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Filler, Injection, InjectArgs, AnyProps, Location, Id } from './types';\nimport FillerWrapper from './components/filler-wrapper';\nimport { useMemo } from 'react';\n\ntype InjectionsMap<TProps extends object = AnyProps> = Map<Id, Injection<TProps>>\n\nconst DEFAULT_PRIORITY = 10;\n\n// Allow flushing all injections at once, for testing purposes.\nconst flushInjectionsFns: ( () => void )[] = [];\n\nexport function createLocation<TProps extends object = AnyProps>(): Location<TProps> {\n\tconst injections: InjectionsMap<TProps> = new Map();\n\n\tconst getInjections = createGetInjections( injections );\n\tconst useInjections = createUseInjections( getInjections );\n\tconst Slot = createSlot( useInjections );\n\tconst inject = createInject( injections );\n\n\t// Push the clear function to the flushInjectionsFns array, so we can flush all injections at once.\n\tflushInjectionsFns.push( () => injections.clear() );\n\n\treturn {\n\t\tinject,\n\t\tgetInjections,\n\t\tuseInjections,\n\t\tSlot,\n\t};\n}\n\nexport function flushAllInjections() {\n\tflushInjectionsFns.forEach( ( flush ) => flush() );\n}\n\nfunction wrapFiller<TProps extends object = AnyProps>( FillerComponent: Filler<TProps> ) {\n\treturn ( props: TProps ) => (\n\t\t<FillerWrapper>\n\t\t\t<FillerComponent { ...props } />\n\t\t</FillerWrapper>\n\t);\n}\n\nfunction createSlot<TProps extends object = AnyProps>( useInjections: Location<TProps>[ 'useInjections' ] ) {\n\treturn ( props: TProps ) => {\n\t\tconst injections = useInjections();\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ injections.map( ( { id, filler: Component } ) => (\n\t\t\t\t\t<Component { ...props } key={ id } />\n\t\t\t\t) ) }\n\t\t\t</>\n\t\t);\n\t};\n}\n\nfunction createGetInjections<TProps extends object = AnyProps>( injections: InjectionsMap<TProps> ) {\n\treturn () => [ ...injections.values() ]\n\t\t.sort( ( a, b ) => a.priority - b.priority );\n}\n\nfunction createInject<TProps extends object = AnyProps>( injections: InjectionsMap<TProps> ) {\n\treturn ( { filler, id, options = {} }: InjectArgs<TProps> ) => {\n\t\tif ( injections.has( id ) && ! options?.overwrite ) {\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.warn(\n\t\t\t\t`An injection with the id \"${ id }\" already exists. Did you mean to use \"options.overwrite\"?`,\n\t\t\t);\n\n\t\t\treturn;\n\t\t}\n\n\t\tinjections.set( id, {\n\t\t\tid,\n\t\t\tfiller: wrapFiller( filler ),\n\t\t\tpriority: options.priority ?? DEFAULT_PRIORITY,\n\t\t} );\n\t};\n}\n\nfunction createUseInjections<TProps extends object = AnyProps>( getInjections: Location<TProps>[ 'getInjections' ] ) {\n\treturn () => useMemo( () => getInjections(), [] );\n}\n","import * as React from 'react';\nimport { ReactNode, Suspense } from 'react';\nimport ErrorBoundary from './error-boundary';\n\nexport default function FillerWrapper( { children }: { children: ReactNode } ) {\n\treturn (\n\t\t<ErrorBoundary fallback={ null }>\n\t\t\t<Suspense fallback={ null }>\n\t\t\t\t{ children }\n\t\t\t</Suspense>\n\t\t</ErrorBoundary>\n\t);\n}\n","import { Component, ReactNode } from 'react';\n\ninterface Props {\n\tchildren?: ReactNode;\n\tfallback: ReactNode;\n}\n\ninterface State {\n\thasError: boolean;\n}\n\nexport default class ErrorBoundary extends Component<Props, State> {\n\tpublic state: State = {\n\t\thasError: false,\n\t};\n\n\tpublic static getDerivedStateFromError(): State {\n\t\t// Update state so the next render will show the fallback UI.\n\t\treturn { hasError: true };\n\t}\n\n\tpublic render() {\n\t\tif ( this.state.hasError ) {\n\t\t\treturn this.props.fallback;\n\t\t}\n\n\t\treturn this.props.children;\n\t}\n}\n"],"mappings":";AAAA,YAAYA,YAAW;;;ACAvB,YAAY,WAAW;AACvB,SAAoB,gBAAgB;;;ACDpC,SAAS,iBAA4B;AAWrC,IAAqB,gBAArB,cAA2C,UAAwB;AAAA,EAC3D,QAAe;AAAA,IACrB,UAAU;AAAA,EACX;AAAA,EAEA,OAAc,2BAAkC;AAE/C,WAAO,EAAE,UAAU,KAAK;AAAA,EACzB;AAAA,EAEO,SAAS;AACf,QAAK,KAAK,MAAM,UAAW;AAC1B,aAAO,KAAK,MAAM;AAAA,IACnB;AAEA,WAAO,KAAK,MAAM;AAAA,EACnB;AACD;;;ADxBe,SAAR,cAAgC,EAAE,SAAS,GAA6B;AAC9E,SACC,oCAAC,iBAAc,UAAW,QACzB,oCAAC,YAAS,UAAW,QAClB,QACH,CACD;AAEF;;;ADTA,SAAS,eAAe;AAIxB,IAAM,mBAAmB;AAGzB,IAAM,qBAAuC,CAAC;AAEvC,SAAS,iBAAqE;AACpF,QAAM,aAAoC,oBAAI,IAAI;AAElD,QAAM,gBAAgB,oBAAqB,UAAW;AACtD,QAAM,gBAAgB,oBAAqB,aAAc;AACzD,QAAM,OAAO,WAAY,aAAc;AACvC,QAAM,SAAS,aAAc,UAAW;AAGxC,qBAAmB,KAAM,MAAM,WAAW,MAAM,CAAE;AAElD,SAAO;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD;AACD;AAEO,SAAS,qBAAqB;AACpC,qBAAmB,QAAS,CAAE,UAAW,MAAM,CAAE;AAClD;AAEA,SAAS,WAA8C,iBAAkC;AACxF,SAAO,CAAE,UACR,qCAAC,qBACA,qCAAC,mBAAkB,GAAG,OAAQ,CAC/B;AAEF;AAEA,SAAS,WAA8C,eAAqD;AAC3G,SAAO,CAAE,UAAmB;AAC3B,UAAM,aAAa,cAAc;AAEjC,WACC,4DACG,WAAW,IAAK,CAAE,EAAE,IAAI,QAAQC,WAAU,MAC3C,qCAACA,YAAA,EAAY,GAAG,OAAQ,KAAM,IAAK,CAClC,CACH;AAAA,EAEF;AACD;AAEA,SAAS,oBAAuD,YAAoC;AACnG,SAAO,MAAM,CAAE,GAAG,WAAW,OAAO,CAAE,EACpC,KAAM,CAAE,GAAG,MAAO,EAAE,WAAW,EAAE,QAAS;AAC7C;AAEA,SAAS,aAAgD,YAAoC;AAC5F,SAAO,CAAE,EAAE,QAAQ,IAAI,UAAU,CAAC,EAAE,MAA2B;AAC9D,QAAK,WAAW,IAAK,EAAG,KAAK,CAAE,SAAS,WAAY;AAEnD,cAAQ;AAAA,QACP,6BAA8B,EAAG;AAAA,MAClC;AAEA;AAAA,IACD;AAEA,eAAW,IAAK,IAAI;AAAA,MACnB;AAAA,MACA,QAAQ,WAAY,MAAO;AAAA,MAC3B,UAAU,QAAQ,YAAY;AAAA,IAC/B,CAAE;AAAA,EACH;AACD;AAEA,SAAS,oBAAuD,eAAqD;AACpH,SAAO,MAAM,QAAS,MAAM,cAAc,GAAG,CAAC,CAAE;AACjD;","names":["React","Component"]}
1
+ {"version":3,"sources":["../src/api.tsx","../src/components/injected-component-wrapper.tsx","../src/components/error-boundary.tsx"],"sourcesContent":["import * as React from 'react';\nimport { InjectedComponent, Injection, InjectArgs, AnyProps, Location, Id } from './types';\nimport InjectedComponentWrapper from './components/injected-component-wrapper';\nimport { useMemo } from 'react';\n\ntype InjectionsMap<TProps extends object = AnyProps> = Map<Id, Injection<TProps>>\n\nconst DEFAULT_PRIORITY = 10;\n\n// Allow flushing all injections at once, for testing purposes.\nconst flushInjectionsFns: ( () => void )[] = [];\n\nexport function createLocation<TProps extends object = AnyProps>(): Location<TProps> {\n\tconst injections: InjectionsMap<TProps> = new Map();\n\n\tconst getInjections = createGetInjections( injections );\n\tconst useInjections = createUseInjections( getInjections );\n\tconst Slot = createSlot( useInjections );\n\tconst inject = createInject( injections );\n\n\t// Push the clear function to the flushInjectionsFns array, so we can flush all injections at once.\n\tflushInjectionsFns.push( () => injections.clear() );\n\n\treturn {\n\t\tinject,\n\t\tgetInjections,\n\t\tuseInjections,\n\t\tSlot,\n\t};\n}\n\nexport function flushAllInjections() {\n\tflushInjectionsFns.forEach( ( flush ) => flush() );\n}\n\nfunction wrapInjectedComponent<TProps extends object = AnyProps>( Component: InjectedComponent<TProps> ) {\n\treturn ( props: TProps ) => (\n\t\t<InjectedComponentWrapper>\n\t\t\t<Component { ...props } />\n\t\t</InjectedComponentWrapper>\n\t);\n}\n\nfunction createSlot<TProps extends object = AnyProps>( useInjections: Location<TProps>[ 'useInjections' ] ) {\n\treturn ( props: TProps ) => {\n\t\tconst injections = useInjections();\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ injections.map( ( { id, component: Component } ) => (\n\t\t\t\t\t<Component { ...props } key={ id } />\n\t\t\t\t) ) }\n\t\t\t</>\n\t\t);\n\t};\n}\n\nfunction createGetInjections<TProps extends object = AnyProps>( injections: InjectionsMap<TProps> ) {\n\treturn () => [ ...injections.values() ]\n\t\t.sort( ( a, b ) => a.priority - b.priority );\n}\n\nfunction createInject<TProps extends object = AnyProps>( injections: InjectionsMap<TProps> ) {\n\treturn ( { component, id, options = {} }: InjectArgs<TProps> ) => {\n\t\tif ( injections.has( id ) && ! options?.overwrite ) {\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.warn(\n\t\t\t\t`An injection with the id \"${ id }\" already exists. Did you mean to use \"options.overwrite\"?`,\n\t\t\t);\n\n\t\t\treturn;\n\t\t}\n\n\t\tinjections.set( id, {\n\t\t\tid,\n\t\t\tcomponent: wrapInjectedComponent( component ),\n\t\t\tpriority: options.priority ?? DEFAULT_PRIORITY,\n\t\t} );\n\t};\n}\n\nfunction createUseInjections<TProps extends object = AnyProps>( getInjections: Location<TProps>[ 'getInjections' ] ) {\n\treturn () => useMemo( () => getInjections(), [] );\n}\n","import * as React from 'react';\nimport { ReactNode, Suspense } from 'react';\nimport ErrorBoundary from './error-boundary';\n\nexport default function InjectedComponentWrapper( { children }: { children: ReactNode } ) {\n\treturn (\n\t\t<ErrorBoundary fallback={ null }>\n\t\t\t<Suspense fallback={ null }>\n\t\t\t\t{ children }\n\t\t\t</Suspense>\n\t\t</ErrorBoundary>\n\t);\n}\n","import { Component, ReactNode } from 'react';\n\ninterface Props {\n\tchildren?: ReactNode;\n\tfallback: ReactNode;\n}\n\ninterface State {\n\thasError: boolean;\n}\n\nexport default class ErrorBoundary extends Component<Props, State> {\n\tpublic state: State = {\n\t\thasError: false,\n\t};\n\n\tpublic static getDerivedStateFromError(): State {\n\t\t// Update state so the next render will show the fallback UI.\n\t\treturn { hasError: true };\n\t}\n\n\tpublic render() {\n\t\tif ( this.state.hasError ) {\n\t\t\treturn this.props.fallback;\n\t\t}\n\n\t\treturn this.props.children;\n\t}\n}\n"],"mappings":";AAAA,YAAYA,YAAW;;;ACAvB,YAAY,WAAW;AACvB,SAAoB,gBAAgB;;;ACDpC,SAAS,iBAA4B;AAWrC,IAAqB,gBAArB,cAA2C,UAAwB;AAAA,EAC3D,QAAe;AAAA,IACrB,UAAU;AAAA,EACX;AAAA,EAEA,OAAc,2BAAkC;AAE/C,WAAO,EAAE,UAAU,KAAK;AAAA,EACzB;AAAA,EAEO,SAAS;AACf,QAAK,KAAK,MAAM,UAAW;AAC1B,aAAO,KAAK,MAAM;AAAA,IACnB;AAEA,WAAO,KAAK,MAAM;AAAA,EACnB;AACD;;;ADxBe,SAAR,yBAA2C,EAAE,SAAS,GAA6B;AACzF,SACC,oCAAC,iBAAc,UAAW,QACzB,oCAAC,YAAS,UAAW,QAClB,QACH,CACD;AAEF;;;ADTA,SAAS,eAAe;AAIxB,IAAM,mBAAmB;AAGzB,IAAM,qBAAuC,CAAC;AAEvC,SAAS,iBAAqE;AACpF,QAAM,aAAoC,oBAAI,IAAI;AAElD,QAAM,gBAAgB,oBAAqB,UAAW;AACtD,QAAM,gBAAgB,oBAAqB,aAAc;AACzD,QAAM,OAAO,WAAY,aAAc;AACvC,QAAM,SAAS,aAAc,UAAW;AAGxC,qBAAmB,KAAM,MAAM,WAAW,MAAM,CAAE;AAElD,SAAO;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD;AACD;AAEO,SAAS,qBAAqB;AACpC,qBAAmB,QAAS,CAAE,UAAW,MAAM,CAAE;AAClD;AAEA,SAAS,sBAAyDC,YAAuC;AACxG,SAAO,CAAE,UACR,qCAAC,gCACA,qCAACA,YAAA,EAAY,GAAG,OAAQ,CACzB;AAEF;AAEA,SAAS,WAA8C,eAAqD;AAC3G,SAAO,CAAE,UAAmB;AAC3B,UAAM,aAAa,cAAc;AAEjC,WACC,4DACG,WAAW,IAAK,CAAE,EAAE,IAAI,WAAWA,WAAU,MAC9C,qCAACA,YAAA,EAAY,GAAG,OAAQ,KAAM,IAAK,CAClC,CACH;AAAA,EAEF;AACD;AAEA,SAAS,oBAAuD,YAAoC;AACnG,SAAO,MAAM,CAAE,GAAG,WAAW,OAAO,CAAE,EACpC,KAAM,CAAE,GAAG,MAAO,EAAE,WAAW,EAAE,QAAS;AAC7C;AAEA,SAAS,aAAgD,YAAoC;AAC5F,SAAO,CAAE,EAAE,WAAW,IAAI,UAAU,CAAC,EAAE,MAA2B;AACjE,QAAK,WAAW,IAAK,EAAG,KAAK,CAAE,SAAS,WAAY;AAEnD,cAAQ;AAAA,QACP,6BAA8B,EAAG;AAAA,MAClC;AAEA;AAAA,IACD;AAEA,eAAW,IAAK,IAAI;AAAA,MACnB;AAAA,MACA,WAAW,sBAAuB,SAAU;AAAA,MAC5C,UAAU,QAAQ,YAAY;AAAA,IAC/B,CAAE;AAAA,EACH;AACD;AAEA,SAAS,oBAAuD,eAAqD;AACpH,SAAO,MAAM,QAAS,MAAM,cAAc,GAAG,CAAC,CAAE;AACjD;","names":["React","Component"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elementor/locations",
3
- "version": "0.6.1",
3
+ "version": "0.6.2",
4
4
  "private": false,
5
5
  "author": "Elementor Team",
6
6
  "homepage": "https://elementor.com/",
@@ -34,5 +34,5 @@
34
34
  "peerDependencies": {
35
35
  "react": "18.x"
36
36
  },
37
- "gitHead": "fbb55b97a2581af49559479b6abf63f5acbfc28b"
37
+ "gitHead": "e27c0b852121946fcc32d5ce8a5a1551c93d87a6"
38
38
  }
@@ -11,17 +11,17 @@ describe( '@elementor/locations', () => {
11
11
 
12
12
  injectIntoTest( {
13
13
  id: 'test-1',
14
- filler: () => <div data-testid="element">First div</div>,
14
+ component: () => <div data-testid="element">First div</div>,
15
15
  } );
16
16
 
17
17
  injectIntoTest( {
18
18
  id: 'test-2',
19
- filler: () => <div data-testid="element">Second div</div>,
19
+ component: () => <div data-testid="element">Second div</div>,
20
20
  } );
21
21
 
22
22
  injectIntoTest2( {
23
23
  id: 'test-3',
24
- filler: () => <div data-testid="element">Should not exist</div>,
24
+ component: () => <div data-testid="element">Should not exist</div>,
25
25
  } );
26
26
 
27
27
  // Act.
@@ -41,19 +41,19 @@ describe( '@elementor/locations', () => {
41
41
 
42
42
  inject( {
43
43
  id: 'test-1',
44
- filler: () => <div data-testid="element">Third div</div>,
44
+ component: () => <div data-testid="element">Third div</div>,
45
45
  // Default priority is 10.
46
46
  } );
47
47
 
48
48
  inject( {
49
49
  id: 'test-2',
50
- filler: () => <div data-testid="element">First div</div>,
50
+ component: () => <div data-testid="element">First div</div>,
51
51
  options: { priority: 5 },
52
52
  } );
53
53
 
54
54
  inject( {
55
55
  id: 'test-3',
56
- filler: () => <div data-testid="element">Second div</div>,
56
+ component: () => <div data-testid="element">Second div</div>,
57
57
  options: { priority: 5 },
58
58
  } );
59
59
 
@@ -86,12 +86,12 @@ describe( '@elementor/locations', () => {
86
86
 
87
87
  inject( {
88
88
  id: 'test-1',
89
- filler: () => <div>First div</div>,
89
+ component: () => <div>First div</div>,
90
90
  } );
91
91
 
92
92
  inject( {
93
93
  id: 'test-2',
94
- filler: lazy( () => Promise.resolve( {
94
+ component: lazy( () => Promise.resolve( {
95
95
  default: () => <div>Second div</div>,
96
96
  } ) ),
97
97
  } );
@@ -110,18 +110,18 @@ describe( '@elementor/locations', () => {
110
110
  expect( queryByText( 'Second div' ) ).toBeTruthy();
111
111
  } );
112
112
 
113
- it( 'should error when injecting filler with the same name (without overwrite option)', async () => {
113
+ it( 'should error when injecting a component with the same name (without overwrite option)', async () => {
114
114
  // Arrange.
115
115
  const { inject, Slot } = createLocation();
116
116
 
117
117
  inject( {
118
118
  id: 'test',
119
- filler: () => <div>First div</div>,
119
+ component: () => <div>First div</div>,
120
120
  } );
121
121
 
122
122
  inject( {
123
123
  id: 'test',
124
- filler: () => <div>Second div</div>,
124
+ component: () => <div>Second div</div>,
125
125
  } );
126
126
 
127
127
  // Act
@@ -133,24 +133,24 @@ describe( '@elementor/locations', () => {
133
133
  expect( console ).toHaveWarned();
134
134
  } );
135
135
 
136
- it( 'should overwrite the filler if has same name', async () => {
136
+ it( 'should overwrite the injected component if has same name', async () => {
137
137
  // Arrange.
138
138
  const { inject, Slot } = createLocation();
139
139
 
140
140
  inject( {
141
141
  id: 'test',
142
- filler: () => <div>First div</div>,
142
+ component: () => <div>First div</div>,
143
143
  } );
144
144
 
145
145
  inject( {
146
146
  id: 'test',
147
- filler: () => <div>Second div</div>,
147
+ component: () => <div>Second div</div>,
148
148
  options: { overwrite: true },
149
149
  } );
150
150
 
151
151
  inject( {
152
152
  id: 'test-2',
153
- filler: () => <div>Third div</div>,
153
+ component: () => <div>Third div</div>,
154
154
  options: { overwrite: true },
155
155
  } );
156
156
 
@@ -169,13 +169,13 @@ describe( '@elementor/locations', () => {
169
169
 
170
170
  inject( {
171
171
  id: 'test-1',
172
- filler: () => <div />,
172
+ component: () => <div />,
173
173
  options: { priority: 5 },
174
174
  } );
175
175
 
176
176
  inject( {
177
177
  id: 'test-1',
178
- filler: () => <div />,
178
+ component: () => <div />,
179
179
  options: { overwrite: true },
180
180
  } );
181
181
 
@@ -184,25 +184,25 @@ describe( '@elementor/locations', () => {
184
184
  expect( getInjections()[ 0 ].priority ).toBe( 10 );
185
185
  } );
186
186
 
187
- it( 'should catch filler errors with error boundary', () => {
187
+ it( 'should catch injected component errors with error boundary', () => {
188
188
  // Arrange.
189
189
  const { inject, Slot } = createLocation();
190
190
 
191
191
  inject( {
192
192
  id: 'test-1',
193
- filler: () => <div>Test 1</div>,
193
+ component: () => <div>Test 1</div>,
194
194
  } );
195
195
 
196
196
  inject( {
197
197
  id: 'test-2',
198
- filler: () => {
198
+ component: () => {
199
199
  throw new Error( 'Error' );
200
200
  },
201
201
  } );
202
202
 
203
203
  inject( {
204
204
  id: 'test-3',
205
- filler: () => <div>Test 3</div>,
205
+ component: () => <div>Test 3</div>,
206
206
  } );
207
207
 
208
208
  // Act.
@@ -214,13 +214,13 @@ describe( '@elementor/locations', () => {
214
214
  expect( console ).toHaveErrored();
215
215
  } );
216
216
 
217
- it( 'should pass the props from Slot to a Filler', () => {
217
+ it( 'should pass the props from Slot to the injected component', () => {
218
218
  // Arrange.
219
219
  const { inject, Slot } = createLocation<{ text: string, number: number }>();
220
220
 
221
221
  inject( {
222
222
  id: 'test-1',
223
- filler: ( { text, number } ) => <div>{ text }: { number }</div>,
223
+ component: ( { text, number } ) => <div>{ text }: { number }</div>,
224
224
  } );
225
225
 
226
226
  // Act.
package/src/api.tsx CHANGED
@@ -1,6 +1,6 @@
1
1
  import * as React from 'react';
2
- import { Filler, Injection, InjectArgs, AnyProps, Location, Id } from './types';
3
- import FillerWrapper from './components/filler-wrapper';
2
+ import { InjectedComponent, Injection, InjectArgs, AnyProps, Location, Id } from './types';
3
+ import InjectedComponentWrapper from './components/injected-component-wrapper';
4
4
  import { useMemo } from 'react';
5
5
 
6
6
  type InjectionsMap<TProps extends object = AnyProps> = Map<Id, Injection<TProps>>
@@ -33,11 +33,11 @@ export function flushAllInjections() {
33
33
  flushInjectionsFns.forEach( ( flush ) => flush() );
34
34
  }
35
35
 
36
- function wrapFiller<TProps extends object = AnyProps>( FillerComponent: Filler<TProps> ) {
36
+ function wrapInjectedComponent<TProps extends object = AnyProps>( Component: InjectedComponent<TProps> ) {
37
37
  return ( props: TProps ) => (
38
- <FillerWrapper>
39
- <FillerComponent { ...props } />
40
- </FillerWrapper>
38
+ <InjectedComponentWrapper>
39
+ <Component { ...props } />
40
+ </InjectedComponentWrapper>
41
41
  );
42
42
  }
43
43
 
@@ -47,7 +47,7 @@ function createSlot<TProps extends object = AnyProps>( useInjections: Location<T
47
47
 
48
48
  return (
49
49
  <>
50
- { injections.map( ( { id, filler: Component } ) => (
50
+ { injections.map( ( { id, component: Component } ) => (
51
51
  <Component { ...props } key={ id } />
52
52
  ) ) }
53
53
  </>
@@ -61,7 +61,7 @@ function createGetInjections<TProps extends object = AnyProps>( injections: Inje
61
61
  }
62
62
 
63
63
  function createInject<TProps extends object = AnyProps>( injections: InjectionsMap<TProps> ) {
64
- return ( { filler, id, options = {} }: InjectArgs<TProps> ) => {
64
+ return ( { component, id, options = {} }: InjectArgs<TProps> ) => {
65
65
  if ( injections.has( id ) && ! options?.overwrite ) {
66
66
  // eslint-disable-next-line no-console
67
67
  console.warn(
@@ -73,7 +73,7 @@ function createInject<TProps extends object = AnyProps>( injections: InjectionsM
73
73
 
74
74
  injections.set( id, {
75
75
  id,
76
- filler: wrapFiller( filler ),
76
+ component: wrapInjectedComponent( component ),
77
77
  priority: options.priority ?? DEFAULT_PRIORITY,
78
78
  } );
79
79
  };
@@ -2,7 +2,7 @@ import * as React from 'react';
2
2
  import { ReactNode, Suspense } from 'react';
3
3
  import ErrorBoundary from './error-boundary';
4
4
 
5
- export default function FillerWrapper( { children }: { children: ReactNode } ) {
5
+ export default function InjectedComponentWrapper( { children }: { children: ReactNode } ) {
6
6
  return (
7
7
  <ErrorBoundary fallback={ null }>
8
8
  <Suspense fallback={ null }>
package/src/types.ts CHANGED
@@ -3,19 +3,19 @@ import { ComponentType } from 'react';
3
3
  // Allow passing the `key` prop even when there are no props for the component
4
4
  export type AnyProps = object;
5
5
 
6
- export type Filler<TProps extends object = AnyProps> = ComponentType<TProps>;
6
+ export type InjectedComponent<TProps extends object = AnyProps> = ComponentType<TProps>;
7
7
  export type Id = string;
8
8
  export type Priority = number;
9
9
 
10
10
  export type Injection<TProps extends object = AnyProps> = {
11
11
  id: Id;
12
- filler: Filler<TProps>;
12
+ component: InjectedComponent<TProps>;
13
13
  priority: Priority;
14
14
  }
15
15
 
16
16
  export type InjectArgs<TProps extends object = AnyProps> = {
17
17
  id: Id;
18
- filler: Filler<TProps>;
18
+ component: InjectedComponent<TProps>;
19
19
  options?: {
20
20
  priority?: Priority;
21
21
  overwrite?: boolean;