@servicetitan/web-components 30.3.1 → 31.1.0
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/dist/common.js +17 -13
- package/dist/common.js.map +1 -1
- package/dist/contexts/index.js +1 -0
- package/dist/contexts/index.js.map +1 -1
- package/dist/contexts/mfe-data-context.js +2 -2
- package/dist/contexts/mfe-data-context.js.map +1 -1
- package/dist/contexts/mfe-metadata-context.js +1 -0
- package/dist/contexts/mfe-metadata-context.js.map +1 -1
- package/dist/contexts/tests/mfe-data-context.test.js +21 -11
- package/dist/contexts/tests/mfe-data-context.test.js.map +1 -1
- package/dist/contexts/tests/mfe-metadata-context.test.js +28 -13
- package/dist/contexts/tests/mfe-metadata-context.test.js.map +1 -1
- package/dist/delayed.js +8 -5
- package/dist/delayed.js.map +1 -1
- package/dist/event-bus.js +79 -97
- package/dist/event-bus.js.map +1 -1
- package/dist/get-value-for-environment.js +9 -4
- package/dist/get-value-for-environment.js.map +1 -1
- package/dist/globals.js +7 -7
- package/dist/globals.js.map +1 -1
- package/dist/headless-loader.d.ts +5 -0
- package/dist/headless-loader.d.ts.map +1 -0
- package/dist/headless-loader.js +17 -0
- package/dist/headless-loader.js.map +1 -0
- package/dist/history-manager.js +59 -69
- package/dist/history-manager.js.map +1 -1
- package/dist/index.d.ts +2 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +3 -0
- package/dist/index.js.map +1 -1
- package/dist/loader.d.ts +10 -4
- package/dist/loader.d.ts.map +1 -1
- package/dist/loader.js +114 -79
- package/dist/loader.js.map +1 -1
- package/dist/register-headless.d.ts +9 -0
- package/dist/register-headless.d.ts.map +1 -0
- package/dist/register-headless.js +67 -0
- package/dist/register-headless.js.map +1 -0
- package/dist/register.js +182 -218
- package/dist/register.js.map +1 -1
- package/dist/render.js +11 -12
- package/dist/render.js.map +1 -1
- package/dist/types.d.ts +11 -0
- package/dist/types.d.ts.map +1 -1
- package/dist/types.js +2 -1
- package/dist/types.js.map +1 -1
- package/dist/utils/get-bundle-info.d.ts +4 -12
- package/dist/utils/get-bundle-info.d.ts.map +1 -1
- package/dist/utils/get-bundle-info.js +41 -52
- package/dist/utils/get-bundle-info.js.map +1 -1
- package/dist/utils/get-cache-setting.d.ts +2 -0
- package/dist/utils/get-cache-setting.d.ts.map +1 -0
- package/dist/utils/get-cache-setting.js +6 -0
- package/dist/utils/get-cache-setting.js.map +1 -0
- package/dist/utils/get-cached-metadata.d.ts +18 -0
- package/dist/utils/get-cached-metadata.d.ts.map +1 -0
- package/dist/utils/get-cached-metadata.js +47 -0
- package/dist/utils/get-cached-metadata.js.map +1 -0
- package/dist/utils/get-element-name.js +1 -0
- package/dist/utils/get-element-name.js.map +1 -1
- package/dist/utils/get-entry-points.js +11 -4
- package/dist/utils/get-entry-points.js.map +1 -1
- package/dist/utils/get-ld-service-token.js +3 -3
- package/dist/utils/get-ld-service-token.js.map +1 -1
- package/dist/utils/get-mfe-has-compatible-launchdarkly-version.d.ts +1 -1
- package/dist/utils/get-mfe-has-compatible-launchdarkly-version.d.ts.map +1 -1
- package/dist/utils/get-mfe-has-compatible-launchdarkly-version.js +4 -4
- package/dist/utils/get-mfe-has-compatible-launchdarkly-version.js.map +1 -1
- package/dist/utils/get-mfe-has-unique-chunk-namespace.d.ts +1 -1
- package/dist/utils/get-mfe-has-unique-chunk-namespace.d.ts.map +1 -1
- package/dist/utils/get-mfe-has-unique-chunk-namespace.js +1 -0
- package/dist/utils/get-mfe-has-unique-chunk-namespace.js.map +1 -1
- package/dist/utils/get-mfe-supports-rerendering.d.ts +1 -1
- package/dist/utils/get-mfe-supports-rerendering.d.ts.map +1 -1
- package/dist/utils/get-mfe-supports-rerendering.js +4 -4
- package/dist/utils/get-mfe-supports-rerendering.js.map +1 -1
- package/dist/utils/get-version-mismatches.d.ts +1 -1
- package/dist/utils/get-version-mismatches.d.ts.map +1 -1
- package/dist/utils/get-version-mismatches.js +19 -12
- package/dist/utils/get-version-mismatches.js.map +1 -1
- package/dist/utils/index.js +1 -0
- package/dist/utils/index.js.map +1 -1
- package/dist/utils/is-compatible.js +1 -0
- package/dist/utils/is-compatible.js.map +1 -1
- package/dist/utils/is-versioned-url.js +2 -1
- package/dist/utils/is-versioned-url.js.map +1 -1
- package/dist/utils/load-scripts.js +7 -6
- package/dist/utils/load-scripts.js.map +1 -1
- package/dist/utils/ttl-cache.js +26 -27
- package/dist/utils/ttl-cache.js.map +1 -1
- package/dist/utils/validate-bundle-info.js +13 -10
- package/dist/utils/validate-bundle-info.js.map +1 -1
- package/dist/utils/web-component.d.ts +1 -1
- package/dist/utils/web-component.d.ts.map +1 -1
- package/dist/utils/web-component.js +51 -24
- package/dist/utils/web-component.js.map +1 -1
- package/package.json +12 -12
- package/src/__mocks__/test-component.tsx +2 -0
- package/src/__tests__/headless-loader.test.tsx +123 -0
- package/src/__tests__/loader.test.tsx +36 -14
- package/src/__tests__/register-headless.test.tsx +98 -0
- package/src/headless-loader.tsx +21 -0
- package/src/index.ts +2 -0
- package/src/loader.tsx +58 -46
- package/src/register-headless.ts +81 -0
- package/src/types.ts +9 -0
- package/src/utils/__tests__/get-version-mismatches.test.ts +1 -1
- package/src/utils/get-bundle-info.ts +37 -60
- package/src/utils/get-cache-setting.ts +5 -0
- package/src/utils/get-cached-metadata.ts +72 -0
- package/src/utils/get-mfe-has-compatible-launchdarkly-version.ts +1 -1
- package/src/utils/get-mfe-has-unique-chunk-namespace.ts +1 -1
- package/src/utils/get-mfe-supports-rerendering.ts +1 -1
- package/src/utils/get-version-mismatches.ts +1 -1
- package/src/utils/web-component.tsx +8 -6
- package/dist/__mocks__/expect-styles-in-dom.d.ts +0 -3
- package/dist/__mocks__/expect-styles-in-dom.d.ts.map +0 -1
- package/dist/__mocks__/expect-styles-in-dom.js +0 -9
- package/dist/__mocks__/expect-styles-in-dom.js.map +0 -1
- package/dist/__mocks__/index.d.ts +0 -4
- package/dist/__mocks__/index.d.ts.map +0 -1
- package/dist/__mocks__/index.js +0 -4
- package/dist/__mocks__/index.js.map +0 -1
- package/dist/__mocks__/register-component.d.ts +0 -4
- package/dist/__mocks__/register-component.d.ts.map +0 -1
- package/dist/__mocks__/register-component.js +0 -14
- package/dist/__mocks__/register-component.js.map +0 -1
- package/dist/__mocks__/test-component.d.ts +0 -3
- package/dist/__mocks__/test-component.d.ts.map +0 -1
- package/dist/__mocks__/test-component.js +0 -15
- package/dist/__mocks__/test-component.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../src/utils/get-mfe-supports-rerendering.ts"],"sourcesContent":["import semver from 'semver';\nimport type { Metadata } from '../types';\n\n/*\n * Check if the MFE supports re-rendering itself when data changes\n *\n * `bundledWith.@servicetitan/web-components` is checked first, as that guarantees support\n * `dependencies.@servicetitan/web-components` is checked second, in the case of the MFE's startup\n * hasn't been updated to add web-components to bundledWith yet, and the MFE's web-component\n * dependency is set in it's own package's package.json instead of the monorepo's root package.json\n * `bundledWith.@servicetitan/startup` is checked third, with the hope that the startup version\n * matches web-components\n */\nexport function getMFESupportsRerendering(\n bundledWith: Metadata['bundledWith'],\n dependencies: Metadata['dependencies']\n) {\n return !!(\n isSupportedVersion(bundledWith?.['@servicetitan/web-components']) ??\n isSupportedVersion(dependencies?.['@servicetitan/web-components']) ??\n isSupportedVersion(bundledWith?.['@servicetitan/startup'])\n );\n}\n\nfunction isSupportedVersion(version?: string) {\n const minVersion = version && semver.minVersion(version);\n if (minVersion) {\n return semver.gte(minVersion, '22.12.0');\n }\n}\n"],"names":["semver","getMFESupportsRerendering","bundledWith","dependencies","isSupportedVersion","version","minVersion","gte"],"mappings":"AAAA,OAAOA,YAAY,SAAS;AAG5B;;;;;;;;;CASC,GACD,OAAO,SAASC,0BACZC,WAAoC,EACpCC,YAAsC;QAGlCC,qBAAAA;IADJ,OAAO,CAAC,CACJA,CAAAA,CAAAA,OAAAA,CAAAA,sBAAAA,mBAAmBF,wBAAAA,kCAAAA,WAAa,CAAC,+BAA+B,eAAhEE,iCAAAA,sBACAA,mBAAmBD,yBAAAA,mCAAAA,YAAc,CAAC,+BAA+B,eADjEC,kBAAAA,OAEAA,mBAAmBF,wBAAAA,kCAAAA,WAAa,CAAC,wBAAwB,CAAA;AAEjE;AAEA,SAASE,mBAAmBC,OAAgB;IACxC,MAAMC,aAAaD,WAAWL,OAAOM,UAAU,CAACD;IAChD,IAAIC,YAAY;QACZ,OAAON,OAAOO,GAAG,CAACD,YAAY;IAClC;AACJ"}
|
|
@@ -2,5 +2,5 @@ import { ExposedDependencies } from '../common';
|
|
|
2
2
|
export declare const getVersionMismatches: (exposedDependencies: ExposedDependencies, dependencies: Record<string, string>, sharedDependencies: Record<string, string>) => Record<string, {
|
|
3
3
|
host: string;
|
|
4
4
|
package: string;
|
|
5
|
-
}
|
|
5
|
+
}> | undefined;
|
|
6
6
|
//# sourceMappingURL=get-version-mismatches.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-version-mismatches.d.ts","sourceRoot":"","sources":["../../src/utils/get-version-mismatches.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,WAAW,CAAC;AAGhD,eAAO,MAAM,oBAAoB,GAC7B,qBAAqB,mBAAmB,EACxC,cAAc,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EACpC,oBAAoB,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;UAeT,MAAM;aAAW,MAAM;
|
|
1
|
+
{"version":3,"file":"get-version-mismatches.d.ts","sourceRoot":"","sources":["../../src/utils/get-version-mismatches.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,WAAW,CAAC;AAGhD,eAAO,MAAM,oBAAoB,GAC7B,qBAAqB,mBAAmB,EACxC,cAAc,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EACpC,oBAAoB,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;UAeT,MAAM;aAAW,MAAM;cAc3D,CAAC"}
|
|
@@ -1,23 +1,30 @@
|
|
|
1
1
|
import { isCompatible } from './is-compatible';
|
|
2
|
-
export const getVersionMismatches = (exposedDependencies, dependencies, sharedDependencies)
|
|
3
|
-
const mismatch = Object.entries(exposedDependencies).reduce((result, [dependency, { version: hostVersion }])
|
|
2
|
+
export const getVersionMismatches = (exposedDependencies, dependencies, sharedDependencies)=>{
|
|
3
|
+
const mismatch = Object.entries(exposedDependencies).reduce((result, [dependency, { version: hostVersion }])=>{
|
|
4
4
|
const packageVersion = dependencies[dependency];
|
|
5
|
-
if (packageVersion &&
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
5
|
+
if (packageVersion && !!sharedDependencies[dependency] && !isCompatible(hostVersion, packageVersion)) {
|
|
6
|
+
result[dependency] = {
|
|
7
|
+
host: hostVersion,
|
|
8
|
+
package: packageVersion
|
|
9
|
+
};
|
|
9
10
|
}
|
|
10
11
|
return result;
|
|
11
12
|
}, {});
|
|
12
|
-
for (const [dependency, variable] of Object.entries(sharedDependencies))
|
|
13
|
+
for (const [dependency, variable] of Object.entries(sharedDependencies)){
|
|
13
14
|
const packageVersion = dependencies[dependency];
|
|
14
15
|
if (!exposedDependencies[dependency]) {
|
|
15
|
-
mismatch[dependency] = {
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
16
|
+
mismatch[dependency] = {
|
|
17
|
+
host: 'missing',
|
|
18
|
+
package: packageVersion
|
|
19
|
+
};
|
|
20
|
+
} else if (exposedDependencies[dependency].variable !== variable) {
|
|
21
|
+
mismatch[dependency] = {
|
|
22
|
+
host: 'wrong global variable',
|
|
23
|
+
package: packageVersion
|
|
24
|
+
};
|
|
19
25
|
}
|
|
20
26
|
}
|
|
21
|
-
return mismatch;
|
|
27
|
+
return Object.keys(mismatch).length ? mismatch : undefined;
|
|
22
28
|
};
|
|
29
|
+
|
|
23
30
|
//# sourceMappingURL=get-version-mismatches.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../src/utils/get-version-mismatches.ts"],"sourcesContent":["import { ExposedDependencies } from '../common';\nimport { isCompatible } from './is-compatible';\n\nexport const getVersionMismatches = (\n exposedDependencies: ExposedDependencies,\n dependencies: Record<string, string>,\n sharedDependencies: Record<string, string>\n) => {\n const mismatch = Object.entries(exposedDependencies).reduce(\n (result, [dependency, { version: hostVersion }]) => {\n const packageVersion = dependencies[dependency];\n if (\n packageVersion &&\n !!sharedDependencies[dependency] &&\n !isCompatible(hostVersion, packageVersion)\n ) {\n result[dependency] = { host: hostVersion, package: packageVersion };\n }\n\n return result;\n },\n {} as Record<string, { host: string; package: string }>\n );\n\n for (const [dependency, variable] of Object.entries(sharedDependencies)) {\n const packageVersion = dependencies[dependency];\n\n if (!exposedDependencies[dependency]) {\n mismatch[dependency] = { host: 'missing', package: packageVersion };\n } else if (exposedDependencies[dependency].variable !== variable) {\n mismatch[dependency] = { host: 'wrong global variable', package: packageVersion };\n }\n }\n\n return Object.keys(mismatch).length ? mismatch : undefined;\n};\n"],"names":["isCompatible","getVersionMismatches","exposedDependencies","dependencies","sharedDependencies","mismatch","Object","entries","reduce","result","dependency","version","hostVersion","packageVersion","host","package","variable","keys","length","undefined"],"mappings":"AACA,SAASA,YAAY,QAAQ,kBAAkB;AAE/C,OAAO,MAAMC,uBAAuB,CAChCC,qBACAC,cACAC;IAEA,MAAMC,WAAWC,OAAOC,OAAO,CAACL,qBAAqBM,MAAM,CACvD,CAACC,QAAQ,CAACC,YAAY,EAAEC,SAASC,WAAW,EAAE,CAAC;QAC3C,MAAMC,iBAAiBV,YAAY,CAACO,WAAW;QAC/C,IACIG,kBACA,CAAC,CAACT,kBAAkB,CAACM,WAAW,IAChC,CAACV,aAAaY,aAAaC,iBAC7B;YACEJ,MAAM,CAACC,WAAW,GAAG;gBAAEI,MAAMF;gBAAaG,SAASF;YAAe;QACtE;QAEA,OAAOJ;IACX,GACA,CAAC;IAGL,KAAK,MAAM,CAACC,YAAYM,SAAS,IAAIV,OAAOC,OAAO,CAACH,oBAAqB;QACrE,MAAMS,iBAAiBV,YAAY,CAACO,WAAW;QAE/C,IAAI,CAACR,mBAAmB,CAACQ,WAAW,EAAE;YAClCL,QAAQ,CAACK,WAAW,GAAG;gBAAEI,MAAM;gBAAWC,SAASF;YAAe;QACtE,OAAO,IAAIX,mBAAmB,CAACQ,WAAW,CAACM,QAAQ,KAAKA,UAAU;YAC9DX,QAAQ,CAACK,WAAW,GAAG;gBAAEI,MAAM;gBAAyBC,SAASF;YAAe;QACpF;IACJ;IAEA,OAAOP,OAAOW,IAAI,CAACZ,UAAUa,MAAM,GAAGb,WAAWc;AACrD,EAAE"}
|
package/dist/utils/index.js
CHANGED
package/dist/utils/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../src/utils/index.ts"],"sourcesContent":["export * from './get-bundle-info';\nexport * from './get-element-name';\nexport * from './get-entry-points';\nexport * from './get-ld-service-token';\nexport * from './get-mfe-supports-rerendering';\nexport * from './get-version-mismatches';\nexport * from './is-versioned-url';\nexport * from './load-scripts';\nexport * from './ttl-cache';\nexport * from './validate-bundle-info';\nexport * from './web-component';\n"],"names":[],"mappings":"AAAA,cAAc,oBAAoB;AAClC,cAAc,qBAAqB;AACnC,cAAc,qBAAqB;AACnC,cAAc,yBAAyB;AACvC,cAAc,iCAAiC;AAC/C,cAAc,2BAA2B;AACzC,cAAc,qBAAqB;AACnC,cAAc,iBAAiB;AAC/B,cAAc,cAAc;AAC5B,cAAc,yBAAyB;AACvC,cAAc,kBAAkB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../src/utils/is-compatible.ts"],"sourcesContent":["import semver from 'semver';\n\nexport function isCompatible(hostVersion: string, packageVersion: string) {\n if (hostVersion === packageVersion) {\n return true;\n }\n\n if (hostVersion === '*') {\n return false;\n }\n\n if (packageVersion === '*') {\n return true;\n }\n\n // host and package have exact non-equal versions\n if (semver.valid(hostVersion) && semver.valid(packageVersion)) {\n return false;\n }\n\n // exact package version couldn't be compatible with host range\n if (semver.validRange(hostVersion) && semver.valid(packageVersion)) {\n return false;\n }\n\n // exact host version must be in package range\n if (semver.valid(hostVersion) && semver.validRange(packageVersion)) {\n return semver.satisfies(hostVersion, packageVersion);\n }\n\n // host range must be fully included in package range\n if (semver.validRange(hostVersion) && semver.validRange(packageVersion)) {\n return semver.subset(hostVersion, packageVersion);\n }\n\n return false;\n}\n"],"names":["semver","isCompatible","hostVersion","packageVersion","valid","validRange","satisfies","subset"],"mappings":"AAAA,OAAOA,YAAY,SAAS;AAE5B,OAAO,SAASC,aAAaC,WAAmB,EAAEC,cAAsB;IACpE,IAAID,gBAAgBC,gBAAgB;QAChC,OAAO;IACX;IAEA,IAAID,gBAAgB,KAAK;QACrB,OAAO;IACX;IAEA,IAAIC,mBAAmB,KAAK;QACxB,OAAO;IACX;IAEA,iDAAiD;IACjD,IAAIH,OAAOI,KAAK,CAACF,gBAAgBF,OAAOI,KAAK,CAACD,iBAAiB;QAC3D,OAAO;IACX;IAEA,+DAA+D;IAC/D,IAAIH,OAAOK,UAAU,CAACH,gBAAgBF,OAAOI,KAAK,CAACD,iBAAiB;QAChE,OAAO;IACX;IAEA,8CAA8C;IAC9C,IAAIH,OAAOI,KAAK,CAACF,gBAAgBF,OAAOK,UAAU,CAACF,iBAAiB;QAChE,OAAOH,OAAOM,SAAS,CAACJ,aAAaC;IACzC;IAEA,qDAAqD;IACrD,IAAIH,OAAOK,UAAU,CAACH,gBAAgBF,OAAOK,UAAU,CAACF,iBAAiB;QACrE,OAAOH,OAAOO,MAAM,CAACL,aAAaC;IACtC;IAEA,OAAO;AACX"}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import semver from 'semver';
|
|
2
|
-
export const isVersionedUrl = (url)
|
|
2
|
+
export const isVersionedUrl = (url)=>{
|
|
3
3
|
if (!url.includes('unpkg.')) {
|
|
4
4
|
return false;
|
|
5
5
|
}
|
|
6
6
|
const parts = url.split('@');
|
|
7
7
|
return !!semver.clean(parts[parts.length - 1]);
|
|
8
8
|
};
|
|
9
|
+
|
|
9
10
|
//# sourceMappingURL=is-versioned-url.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../src/utils/is-versioned-url.ts"],"sourcesContent":["import semver from 'semver';\n\nexport const isVersionedUrl = (url: string): boolean => {\n if (!url.includes('unpkg.')) {\n return false;\n }\n\n const parts = url.split('@');\n\n return !!semver.clean(parts[parts.length - 1]);\n};\n"],"names":["semver","isVersionedUrl","url","includes","parts","split","clean","length"],"mappings":"AAAA,OAAOA,YAAY,SAAS;AAE5B,OAAO,MAAMC,iBAAiB,CAACC;IAC3B,IAAI,CAACA,IAAIC,QAAQ,CAAC,WAAW;QACzB,OAAO;IACX;IAEA,MAAMC,QAAQF,IAAIG,KAAK,CAAC;IAExB,OAAO,CAAC,CAACL,OAAOM,KAAK,CAACF,KAAK,CAACA,MAAMG,MAAM,GAAG,EAAE;AACjD,EAAE"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
export function loadScripts({ urls, WebComponent }) {
|
|
2
|
-
return Promise.all(urls.js.map(url
|
|
3
|
-
const script = Array.from(document.scripts).find(({ src })
|
|
2
|
+
return Promise.all(urls.js.map((url)=>{
|
|
3
|
+
const script = Array.from(document.scripts).find(({ src })=>src === url);
|
|
4
4
|
if (!script) {
|
|
5
|
-
return new Promise(resolve
|
|
5
|
+
return new Promise((resolve)=>{
|
|
6
6
|
const script = document.createElement('script');
|
|
7
7
|
script.crossOrigin = 'anonymous';
|
|
8
|
-
script.onload = ()
|
|
8
|
+
script.onload = ()=>{
|
|
9
9
|
script.dataset.webComponent = WebComponent;
|
|
10
10
|
script.onload = null;
|
|
11
11
|
resolve();
|
|
@@ -16,9 +16,9 @@ export function loadScripts({ urls, WebComponent }) {
|
|
|
16
16
|
});
|
|
17
17
|
}
|
|
18
18
|
if (!script.dataset.webComponent) {
|
|
19
|
-
return new Promise(resolve
|
|
19
|
+
return new Promise((resolve)=>{
|
|
20
20
|
const originalOnload = script.onload;
|
|
21
|
-
script.onload = (...args)
|
|
21
|
+
script.onload = (...args)=>{
|
|
22
22
|
originalOnload === null || originalOnload === void 0 ? void 0 : originalOnload.call(script, ...args);
|
|
23
23
|
script.onload = null;
|
|
24
24
|
resolve();
|
|
@@ -28,4 +28,5 @@ export function loadScripts({ urls, WebComponent }) {
|
|
|
28
28
|
return Promise.resolve();
|
|
29
29
|
}));
|
|
30
30
|
}
|
|
31
|
+
|
|
31
32
|
//# sourceMappingURL=load-scripts.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../src/utils/load-scripts.ts"],"sourcesContent":["import { BundleInfo } from './get-bundle-info';\n\nexport function loadScripts({ urls, WebComponent }: BundleInfo) {\n return Promise.all(\n urls.js.map(url => {\n const script = Array.from(document.scripts).find(({ src }) => src === url);\n if (!script) {\n return new Promise<void>(resolve => {\n const script = document.createElement('script');\n\n script.crossOrigin = 'anonymous';\n script.onload = () => {\n script.dataset.webComponent = WebComponent;\n script.onload = null;\n resolve();\n };\n script.async = true;\n script.src = url;\n\n document.body.append(script);\n });\n }\n\n if (!script.dataset.webComponent) {\n return new Promise<void>(resolve => {\n const originalOnload = script.onload;\n script.onload = (...args) => {\n originalOnload?.call(script, ...args);\n script.onload = null;\n resolve();\n };\n });\n }\n\n return Promise.resolve();\n })\n );\n}\n"],"names":["loadScripts","urls","WebComponent","Promise","all","js","map","url","script","Array","from","document","scripts","find","src","resolve","createElement","crossOrigin","onload","dataset","webComponent","async","body","append","originalOnload","args","call"],"mappings":"AAEA,OAAO,SAASA,YAAY,EAAEC,IAAI,EAAEC,YAAY,EAAc;IAC1D,OAAOC,QAAQC,GAAG,CACdH,KAAKI,EAAE,CAACC,GAAG,CAACC,CAAAA;QACR,MAAMC,SAASC,MAAMC,IAAI,CAACC,SAASC,OAAO,EAAEC,IAAI,CAAC,CAAC,EAAEC,GAAG,EAAE,GAAKA,QAAQP;QACtE,IAAI,CAACC,QAAQ;YACT,OAAO,IAAIL,QAAcY,CAAAA;gBACrB,MAAMP,SAASG,SAASK,aAAa,CAAC;gBAEtCR,OAAOS,WAAW,GAAG;gBACrBT,OAAOU,MAAM,GAAG;oBACZV,OAAOW,OAAO,CAACC,YAAY,GAAGlB;oBAC9BM,OAAOU,MAAM,GAAG;oBAChBH;gBACJ;gBACAP,OAAOa,KAAK,GAAG;gBACfb,OAAOM,GAAG,GAAGP;gBAEbI,SAASW,IAAI,CAACC,MAAM,CAACf;YACzB;QACJ;QAEA,IAAI,CAACA,OAAOW,OAAO,CAACC,YAAY,EAAE;YAC9B,OAAO,IAAIjB,QAAcY,CAAAA;gBACrB,MAAMS,iBAAiBhB,OAAOU,MAAM;gBACpCV,OAAOU,MAAM,GAAG,CAAC,GAAGO;oBAChBD,2BAAAA,qCAAAA,eAAgBE,IAAI,CAAClB,WAAWiB;oBAChCjB,OAAOU,MAAM,GAAG;oBAChBH;gBACJ;YACJ;QACJ;QAEA,OAAOZ,QAAQY,OAAO;IAC1B;AAER"}
|
package/dist/utils/ttl-cache.js
CHANGED
|
@@ -1,32 +1,19 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
Object.defineProperty(this, "data", {
|
|
1
|
+
function _define_property(obj, key, value) {
|
|
2
|
+
if (key in obj) {
|
|
3
|
+
Object.defineProperty(obj, key, {
|
|
4
|
+
value: value,
|
|
6
5
|
enumerable: true,
|
|
7
6
|
configurable: true,
|
|
8
|
-
writable: true
|
|
9
|
-
value: void 0
|
|
7
|
+
writable: true
|
|
10
8
|
});
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
configurable: true,
|
|
14
|
-
writable: true,
|
|
15
|
-
value: void 0
|
|
16
|
-
});
|
|
17
|
-
Object.defineProperty(this, "ttl", {
|
|
18
|
-
enumerable: true,
|
|
19
|
-
configurable: true,
|
|
20
|
-
writable: true,
|
|
21
|
-
value: void 0
|
|
22
|
-
});
|
|
23
|
-
if (ttlMs < 0) {
|
|
24
|
-
throw new Error('default TTL must be zero or greater');
|
|
25
|
-
}
|
|
26
|
-
this.data = new Map();
|
|
27
|
-
this.timers = new Map();
|
|
28
|
-
this.ttl = ttlMs;
|
|
9
|
+
} else {
|
|
10
|
+
obj[key] = value;
|
|
29
11
|
}
|
|
12
|
+
return obj;
|
|
13
|
+
}
|
|
14
|
+
const MINUTE = 1000 * 60;
|
|
15
|
+
const DEFAULT_TTL = 5 * MINUTE;
|
|
16
|
+
export class TtlCache {
|
|
30
17
|
set(key, value, ttl) {
|
|
31
18
|
this.setTimeout(key, ttl !== null && ttl !== void 0 ? ttl : this.ttl);
|
|
32
19
|
this.data.set(key, value);
|
|
@@ -43,7 +30,7 @@ export class TtlCache {
|
|
|
43
30
|
}
|
|
44
31
|
clear() {
|
|
45
32
|
this.data.clear();
|
|
46
|
-
this.timers.forEach(value
|
|
33
|
+
this.timers.forEach((value)=>clearTimeout(value));
|
|
47
34
|
this.timers.clear();
|
|
48
35
|
}
|
|
49
36
|
cancelTimeout(key) {
|
|
@@ -58,8 +45,20 @@ export class TtlCache {
|
|
|
58
45
|
if (ttl < 0) {
|
|
59
46
|
return;
|
|
60
47
|
}
|
|
61
|
-
const id = setTimeout(()
|
|
48
|
+
const id = setTimeout(()=>this.delete(key), ttl);
|
|
62
49
|
this.timers.set(key, id);
|
|
63
50
|
}
|
|
51
|
+
constructor({ ttlMs = DEFAULT_TTL } = {}){
|
|
52
|
+
_define_property(this, "data", void 0);
|
|
53
|
+
_define_property(this, "timers", void 0);
|
|
54
|
+
_define_property(this, "ttl", void 0);
|
|
55
|
+
if (ttlMs < 0) {
|
|
56
|
+
throw new Error('default TTL must be zero or greater');
|
|
57
|
+
}
|
|
58
|
+
this.data = new Map();
|
|
59
|
+
this.timers = new Map();
|
|
60
|
+
this.ttl = ttlMs;
|
|
61
|
+
}
|
|
64
62
|
}
|
|
63
|
+
|
|
65
64
|
//# sourceMappingURL=ttl-cache.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../src/utils/ttl-cache.ts"],"sourcesContent":["const MINUTE = 1000 * 60;\nconst DEFAULT_TTL = 5 * MINUTE;\n\nexport interface TtlCacheOptions {\n ttlMs?: number;\n}\n\nexport class TtlCache<T = any> {\n private data: Map<string, T>;\n private timers: Map<string, ReturnType<typeof setTimeout>>;\n private ttl: number;\n\n constructor({ ttlMs = DEFAULT_TTL }: TtlCacheOptions = {}) {\n if (ttlMs < 0) {\n throw new Error('default TTL must be zero or greater');\n }\n\n this.data = new Map();\n this.timers = new Map();\n this.ttl = ttlMs;\n }\n\n set(key: string, value: T, ttl?: number) {\n this.setTimeout(key, ttl ?? this.ttl);\n this.data.set(key, value);\n }\n\n get(key: string) {\n return this.data.get(key);\n }\n\n has(key: string) {\n return this.data.has(key);\n }\n\n delete(key: string) {\n this.cancelTimeout(key);\n this.data.delete(key);\n }\n\n clear() {\n this.data.clear();\n this.timers.forEach(value => clearTimeout(value));\n this.timers.clear();\n }\n\n private cancelTimeout(key: string) {\n const id = this.timers.get(key);\n if (id) {\n clearTimeout(id);\n this.timers.delete(key);\n }\n }\n\n private setTimeout(key: string, ttl: number) {\n this.cancelTimeout(key);\n if (ttl < 0) {\n return;\n }\n\n const id = setTimeout(() => this.delete(key), ttl);\n this.timers.set(key, id);\n }\n}\n"],"names":["MINUTE","DEFAULT_TTL","TtlCache","set","key","value","ttl","setTimeout","data","get","has","delete","cancelTimeout","clear","timers","forEach","clearTimeout","id","constructor","ttlMs","Error","Map"],"mappings":";;;;;;;;;;;;;AAAA,MAAMA,SAAS,OAAO;AACtB,MAAMC,cAAc,IAAID;AAMxB,OAAO,MAAME;IAeTC,IAAIC,GAAW,EAAEC,KAAQ,EAAEC,GAAY,EAAE;QACrC,IAAI,CAACC,UAAU,CAACH,KAAKE,gBAAAA,iBAAAA,MAAO,IAAI,CAACA,GAAG;QACpC,IAAI,CAACE,IAAI,CAACL,GAAG,CAACC,KAAKC;IACvB;IAEAI,IAAIL,GAAW,EAAE;QACb,OAAO,IAAI,CAACI,IAAI,CAACC,GAAG,CAACL;IACzB;IAEAM,IAAIN,GAAW,EAAE;QACb,OAAO,IAAI,CAACI,IAAI,CAACE,GAAG,CAACN;IACzB;IAEAO,OAAOP,GAAW,EAAE;QAChB,IAAI,CAACQ,aAAa,CAACR;QACnB,IAAI,CAACI,IAAI,CAACG,MAAM,CAACP;IACrB;IAEAS,QAAQ;QACJ,IAAI,CAACL,IAAI,CAACK,KAAK;QACf,IAAI,CAACC,MAAM,CAACC,OAAO,CAACV,CAAAA,QAASW,aAAaX;QAC1C,IAAI,CAACS,MAAM,CAACD,KAAK;IACrB;IAEQD,cAAcR,GAAW,EAAE;QAC/B,MAAMa,KAAK,IAAI,CAACH,MAAM,CAACL,GAAG,CAACL;QAC3B,IAAIa,IAAI;YACJD,aAAaC;YACb,IAAI,CAACH,MAAM,CAACH,MAAM,CAACP;QACvB;IACJ;IAEQG,WAAWH,GAAW,EAAEE,GAAW,EAAE;QACzC,IAAI,CAACM,aAAa,CAACR;QACnB,IAAIE,MAAM,GAAG;YACT;QACJ;QAEA,MAAMW,KAAKV,WAAW,IAAM,IAAI,CAACI,MAAM,CAACP,MAAME;QAC9C,IAAI,CAACQ,MAAM,CAACX,GAAG,CAACC,KAAKa;IACzB;IAlDAC,YAAY,EAAEC,QAAQlB,WAAW,EAAmB,GAAG,CAAC,CAAC,CAAE;QAJ3D,uBAAQO,QAAR,KAAA;QACA,uBAAQM,UAAR,KAAA;QACA,uBAAQR,OAAR,KAAA;QAGI,IAAIa,QAAQ,GAAG;YACX,MAAM,IAAIC,MAAM;QACpB;QAEA,IAAI,CAACZ,IAAI,GAAG,IAAIa;QAChB,IAAI,CAACP,MAAM,GAAG,IAAIO;QAClB,IAAI,CAACf,GAAG,GAAGa;IACf;AA2CJ"}
|
|
@@ -1,39 +1,42 @@
|
|
|
1
1
|
export function validateBundleInfo({ mismatch, mfeHasCompatibleLaunchDarklyVersion }, { exposedDependencies = {}, exposedInstanceDependencies, logService, packageUrl }) {
|
|
2
|
-
var _a, _b;
|
|
3
2
|
if (!logService) {
|
|
4
3
|
return;
|
|
5
4
|
}
|
|
6
5
|
if (mismatch) {
|
|
7
|
-
const data = {
|
|
6
|
+
const data = {
|
|
7
|
+
package: packageUrl,
|
|
8
|
+
dependencies: JSON.stringify(mismatch)
|
|
9
|
+
};
|
|
8
10
|
if (Object.keys(exposedDependencies).length === 0) {
|
|
9
11
|
logService.warning({
|
|
10
12
|
category: 'MicroFrontends.NoExposedDependencies',
|
|
11
13
|
message: 'Cannot use light bundle because the host is not exposing dependencies or the list of shared dependencies is empty.',
|
|
12
|
-
data
|
|
14
|
+
data
|
|
13
15
|
});
|
|
14
|
-
}
|
|
15
|
-
else {
|
|
16
|
+
} else {
|
|
16
17
|
logService.warning({
|
|
17
18
|
category: 'MicroFrontends.DependenciesMismatch',
|
|
18
19
|
message: 'Some of the package dependencies have incompatible versions.',
|
|
19
|
-
data
|
|
20
|
+
data
|
|
20
21
|
});
|
|
21
22
|
}
|
|
22
23
|
}
|
|
23
24
|
/**
|
|
24
25
|
* Note, only checking false here because the value is undefined when the host
|
|
25
26
|
* or the MFE isn't using LaunchDarkly at all.
|
|
26
|
-
*/
|
|
27
|
-
|
|
27
|
+
*/ if (mfeHasCompatibleLaunchDarklyVersion === false) {
|
|
28
|
+
var _exposedInstanceDependencies_launchDarkly;
|
|
29
|
+
var _exposedInstanceDependencies_launchDarkly_version;
|
|
28
30
|
const data = {
|
|
29
31
|
package: packageUrl,
|
|
30
|
-
hostVersion: (
|
|
32
|
+
hostVersion: (_exposedInstanceDependencies_launchDarkly_version = exposedInstanceDependencies === null || exposedInstanceDependencies === void 0 ? void 0 : (_exposedInstanceDependencies_launchDarkly = exposedInstanceDependencies.launchDarkly) === null || _exposedInstanceDependencies_launchDarkly === void 0 ? void 0 : _exposedInstanceDependencies_launchDarkly.version) !== null && _exposedInstanceDependencies_launchDarkly_version !== void 0 ? _exposedInstanceDependencies_launchDarkly_version : ''
|
|
31
33
|
};
|
|
32
34
|
logService.warning({
|
|
33
35
|
category: 'MicroFrontends.LaunchDarklyMismatch',
|
|
34
36
|
message: 'LaunchDarkly versions are incompatible',
|
|
35
|
-
data
|
|
37
|
+
data
|
|
36
38
|
});
|
|
37
39
|
}
|
|
38
40
|
}
|
|
41
|
+
|
|
39
42
|
//# sourceMappingURL=validate-bundle-info.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../src/utils/validate-bundle-info.ts"],"sourcesContent":["import { Log } from '@servicetitan/log-service';\nimport { ExposedDependencies, ExposedInstanceDependencies } from '../common';\nimport { BundleInfo } from './get-bundle-info';\n\ninterface Context {\n exposedDependencies?: ExposedDependencies;\n exposedInstanceDependencies?: ExposedInstanceDependencies;\n logService?: Log;\n packageUrl: string;\n}\nexport function validateBundleInfo(\n { mismatch, mfeHasCompatibleLaunchDarklyVersion }: BundleInfo,\n { exposedDependencies = {}, exposedInstanceDependencies, logService, packageUrl }: Context\n) {\n if (!logService) {\n return;\n }\n\n if (mismatch) {\n const data = { package: packageUrl, dependencies: JSON.stringify(mismatch) };\n if (Object.keys(exposedDependencies).length === 0) {\n logService.warning({\n category: 'MicroFrontends.NoExposedDependencies',\n message:\n 'Cannot use light bundle because the host is not exposing dependencies or the list of shared dependencies is empty.',\n data,\n });\n } else {\n logService.warning({\n category: 'MicroFrontends.DependenciesMismatch',\n message: 'Some of the package dependencies have incompatible versions.',\n data,\n });\n }\n }\n\n /**\n * Note, only checking false here because the value is undefined when the host\n * or the MFE isn't using LaunchDarkly at all.\n */\n\n if (mfeHasCompatibleLaunchDarklyVersion === false) {\n const data = {\n package: packageUrl,\n hostVersion: exposedInstanceDependencies?.launchDarkly?.version ?? '',\n };\n logService.warning({\n category: 'MicroFrontends.LaunchDarklyMismatch',\n message: 'LaunchDarkly versions are incompatible',\n data,\n });\n }\n}\n"],"names":["validateBundleInfo","mismatch","mfeHasCompatibleLaunchDarklyVersion","exposedDependencies","exposedInstanceDependencies","logService","packageUrl","data","package","dependencies","JSON","stringify","Object","keys","length","warning","category","message","hostVersion","launchDarkly","version"],"mappings":"AAUA,OAAO,SAASA,mBACZ,EAAEC,QAAQ,EAAEC,mCAAmC,EAAc,EAC7D,EAAEC,sBAAsB,CAAC,CAAC,EAAEC,2BAA2B,EAAEC,UAAU,EAAEC,UAAU,EAAW;IAE1F,IAAI,CAACD,YAAY;QACb;IACJ;IAEA,IAAIJ,UAAU;QACV,MAAMM,OAAO;YAAEC,SAASF;YAAYG,cAAcC,KAAKC,SAAS,CAACV;QAAU;QAC3E,IAAIW,OAAOC,IAAI,CAACV,qBAAqBW,MAAM,KAAK,GAAG;YAC/CT,WAAWU,OAAO,CAAC;gBACfC,UAAU;gBACVC,SACI;gBACJV;YACJ;QACJ,OAAO;YACHF,WAAWU,OAAO,CAAC;gBACfC,UAAU;gBACVC,SAAS;gBACTV;YACJ;QACJ;IACJ;IAEA;;;KAGC,GAED,IAAIL,wCAAwC,OAAO;YAG9BE;YAAAA;QAFjB,MAAMG,OAAO;YACTC,SAASF;YACTY,aAAad,CAAAA,oDAAAA,wCAAAA,mDAAAA,4CAAAA,4BAA6Be,YAAY,cAAzCf,gEAAAA,0CAA2CgB,OAAO,cAAlDhB,+DAAAA,oDAAsD;QACvE;QACAC,WAAWU,OAAO,CAAC;YACfC,UAAU;YACVC,SAAS;YACTV;QACJ;IACJ;AACJ"}
|
|
@@ -13,6 +13,6 @@ interface WebComponentProps {
|
|
|
13
13
|
ldService?: LDService;
|
|
14
14
|
logService?: Log;
|
|
15
15
|
}
|
|
16
|
-
export declare function webComponent(props: WebComponentProps): ({ LoadingFallback, ...
|
|
16
|
+
export declare function webComponent(props: WebComponentProps): ({ LoadingFallback, ...innerProps }: LoaderDataProps) => import("react/jsx-runtime").JSX.Element;
|
|
17
17
|
export {};
|
|
18
18
|
//# sourceMappingURL=web-component.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"web-component.d.ts","sourceRoot":"","sources":["../../src/utils/web-component.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,GAAG,EAAE,MAAM,2BAA2B,CAAC;AAChD,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,oCAAoC,CAAC;AAGpE,OAAO,EAAE,mBAAmB,EAAE,2BAA2B,EAAiB,MAAM,WAAW,CAAC;AAE5F,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAG/C,OAAO,EAAE,eAAe,EAAE,MAAM,WAAW,CAAC;AAE5C,UAAU,iBAAiB;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,UAAU,CAAC;IACvB,QAAQ,EAAE,QAAQ,CAAC;IACnB,mBAAmB,CAAC,EAAE,mBAAmB,CAAC;IAC1C,2BAA2B,CAAC,EAAE,2BAA2B,CAAC;IAC1D,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,UAAU,CAAC,EAAE,GAAG,CAAC;CACpB;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,
|
|
1
|
+
{"version":3,"file":"web-component.d.ts","sourceRoot":"","sources":["../../src/utils/web-component.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,GAAG,EAAE,MAAM,2BAA2B,CAAC;AAChD,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,oCAAoC,CAAC;AAGpE,OAAO,EAAE,mBAAmB,EAAE,2BAA2B,EAAiB,MAAM,WAAW,CAAC;AAE5F,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAG/C,OAAO,EAAE,eAAe,EAAE,MAAM,WAAW,CAAC;AAE5C,UAAU,iBAAiB;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,UAAU,CAAC;IACvB,QAAQ,EAAE,QAAQ,CAAC;IACnB,mBAAmB,CAAC,EAAE,mBAAmB,CAAC;IAC1C,2BAA2B,CAAC,EAAE,2BAA2B,CAAC;IAC1D,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,UAAU,CAAC,EAAE,GAAG,CAAC;CACpB;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,IAWzC,oCAAoC,eAAe,6CAyD9D"}
|
|
@@ -4,15 +4,15 @@ import { useOptionalDependencies } from '@servicetitan/react-ioc';
|
|
|
4
4
|
import { getElementName } from './get-element-name';
|
|
5
5
|
import { HistoryManager } from '../history-manager';
|
|
6
6
|
export function webComponent(props) {
|
|
7
|
-
var
|
|
7
|
+
var _bundleInfo_bundledWith;
|
|
8
8
|
const { basename, bundleInfo, eventBus, exposedDependencies, ldService, logService } = props;
|
|
9
|
-
const { WebComponent, disposer, mfeSupportsRerendering, version } = bundleInfo;
|
|
9
|
+
const { WebComponent, resolvedBundleType, disposer, mfeSupportsRerendering, version } = bundleInfo;
|
|
10
10
|
const elementName = getElementName(bundleInfo);
|
|
11
|
-
const exposedInstanceDependencies = ensureLDVersion(props.exposedInstanceDependencies, (
|
|
12
|
-
return ({ LoadingFallback, ...
|
|
11
|
+
const exposedInstanceDependencies = ensureLDVersion(props.exposedInstanceDependencies, (_bundleInfo_bundledWith = bundleInfo.bundledWith) === null || _bundleInfo_bundledWith === void 0 ? void 0 : _bundleInfo_bundledWith['launchdarkly-js-client-sdk']);
|
|
12
|
+
return ({ LoadingFallback, ...innerProps })=>{
|
|
13
13
|
const [isLoading, setIsLoading] = useState(true);
|
|
14
14
|
const [historyManager] = useOptionalDependencies(HistoryManager);
|
|
15
|
-
const handleRef = (webComponent)
|
|
15
|
+
const handleRef = (webComponent)=>{
|
|
16
16
|
webComponent === null || webComponent === void 0 ? void 0 : webComponent.provide({
|
|
17
17
|
ldService,
|
|
18
18
|
logService,
|
|
@@ -21,44 +21,70 @@ export function webComponent(props) {
|
|
|
21
21
|
exposedInstanceDependencies,
|
|
22
22
|
eventBus,
|
|
23
23
|
basename,
|
|
24
|
-
onReady: ()
|
|
24
|
+
onReady: ()=>{
|
|
25
25
|
setIsLoading(false);
|
|
26
26
|
},
|
|
27
|
-
onDispose: ()
|
|
27
|
+
onDispose: ()=>{
|
|
28
28
|
disposer();
|
|
29
|
-
}
|
|
29
|
+
}
|
|
30
30
|
});
|
|
31
31
|
};
|
|
32
32
|
// Stringify data object so that it can be passed as a data-attribute
|
|
33
|
-
const stringifiedData = useMemo(()
|
|
33
|
+
const stringifiedData = useMemo(()=>JSON.stringify(innerProps.data), [
|
|
34
|
+
innerProps.data
|
|
35
|
+
]);
|
|
34
36
|
/*
|
|
35
37
|
* Set key for rendering the web component so that if the data from the Host change,
|
|
36
38
|
* and the MFE's version of startup doesn't support watching for data changes, then
|
|
37
39
|
* the web component will be re-mounted whenever the data changes.
|
|
38
40
|
* This is only used as a fallback when the MFE's version is older.
|
|
39
|
-
*/
|
|
40
|
-
const
|
|
41
|
-
|
|
41
|
+
*/ const key = mfeSupportsRerendering ? undefined : stringifiedData;
|
|
42
|
+
const dataAttrs = useMemo(()=>composeDataAttributes(innerProps.data), [
|
|
43
|
+
innerProps.data
|
|
44
|
+
]);
|
|
42
45
|
const styleUrls = getStyleUrls(bundleInfo);
|
|
43
|
-
return
|
|
44
|
-
|
|
45
|
-
|
|
46
|
+
return /*#__PURE__*/ _jsxs(Fragment, {
|
|
47
|
+
children: [
|
|
48
|
+
isLoading && /*#__PURE__*/ _jsx(LoadingFallback, {}),
|
|
49
|
+
/*#__PURE__*/ _jsx(WebComponent, {
|
|
50
|
+
ref: handleRef,
|
|
51
|
+
class: innerProps.className,
|
|
52
|
+
...styleUrls && {
|
|
53
|
+
'style-urls': styleUrls
|
|
54
|
+
},
|
|
55
|
+
...dataAttrs,
|
|
56
|
+
"data-mfe-data": stringifiedData,
|
|
57
|
+
"data-mfe-name": elementName,
|
|
58
|
+
...version && {
|
|
59
|
+
'data-mfe-version': version
|
|
60
|
+
},
|
|
61
|
+
// @ts-expect-error style exists on HTMLElement
|
|
62
|
+
style: resolvedBundleType === 'headless' ? {
|
|
63
|
+
display: 'none'
|
|
64
|
+
} : undefined
|
|
65
|
+
}, key)
|
|
66
|
+
]
|
|
67
|
+
});
|
|
46
68
|
};
|
|
47
69
|
}
|
|
48
70
|
/*
|
|
49
71
|
* Convert camelCase data props to kebab-case data attributes, prepended with data-
|
|
50
72
|
* Ex: fooBar -> data-foo-bar
|
|
51
|
-
*/
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
]));
|
|
73
|
+
*/ function composeDataAttributes(data = {}) {
|
|
74
|
+
return Object.fromEntries(Object.entries(data).map(([key, value])=>[
|
|
75
|
+
'data-' + key.replace(/[A-Z]/g, (letter)=>'-' + letter.toLowerCase()),
|
|
76
|
+
value
|
|
77
|
+
]));
|
|
57
78
|
}
|
|
58
79
|
function ensureLDVersion(exposedInstanceDependencies = {}, version) {
|
|
59
|
-
var
|
|
60
|
-
if (version && !((
|
|
61
|
-
return {
|
|
80
|
+
var _exposedInstanceDependencies_launchDarkly;
|
|
81
|
+
if (version && !((_exposedInstanceDependencies_launchDarkly = exposedInstanceDependencies.launchDarkly) === null || _exposedInstanceDependencies_launchDarkly === void 0 ? void 0 : _exposedInstanceDependencies_launchDarkly.ldService)) {
|
|
82
|
+
return {
|
|
83
|
+
...exposedInstanceDependencies,
|
|
84
|
+
launchDarkly: {
|
|
85
|
+
version
|
|
86
|
+
}
|
|
87
|
+
};
|
|
62
88
|
}
|
|
63
89
|
return exposedInstanceDependencies;
|
|
64
90
|
}
|
|
@@ -67,4 +93,5 @@ function getStyleUrls({ urls }) {
|
|
|
67
93
|
return encodeURIComponent(JSON.stringify(urls.css));
|
|
68
94
|
}
|
|
69
95
|
}
|
|
96
|
+
|
|
70
97
|
//# sourceMappingURL=web-component.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../src/utils/web-component.tsx"],"sourcesContent":["import { Fragment, useMemo, useState } from 'react';\nimport { Log } from '@servicetitan/log-service';\nimport { type LDService } from '@servicetitan/launchdarkly-service';\nimport { useOptionalDependencies } from '@servicetitan/react-ioc';\n\nimport { ExposedDependencies, ExposedInstanceDependencies, IWebComponent } from '../common';\nimport { MFEContextData } from '../contexts/mfe-data-context';\nimport { EventBus } from '../event-bus';\nimport { BundleInfo } from './get-bundle-info';\nimport { getElementName } from './get-element-name';\nimport { HistoryManager } from '../history-manager';\nimport { LoaderDataProps } from '../loader';\n\ninterface WebComponentProps {\n basename?: string;\n bundleInfo: BundleInfo;\n eventBus: EventBus;\n exposedDependencies?: ExposedDependencies;\n exposedInstanceDependencies?: ExposedInstanceDependencies;\n ldService?: LDService;\n logService?: Log;\n}\n\nexport function webComponent(props: WebComponentProps) {\n const { basename, bundleInfo, eventBus, exposedDependencies, ldService, logService } = props;\n const { WebComponent, resolvedBundleType, disposer, mfeSupportsRerendering, version } =\n bundleInfo;\n const elementName = getElementName(bundleInfo);\n\n const exposedInstanceDependencies = ensureLDVersion(\n props.exposedInstanceDependencies,\n bundleInfo.bundledWith?.['launchdarkly-js-client-sdk']\n );\n\n return ({ LoadingFallback, ...innerProps }: LoaderDataProps) => {\n const [isLoading, setIsLoading] = useState(true);\n const [historyManager] = useOptionalDependencies(HistoryManager);\n\n const handleRef = (webComponent: IWebComponent | null) => {\n webComponent?.provide({\n ldService,\n logService,\n historyManager,\n exposedDependencies,\n exposedInstanceDependencies,\n eventBus,\n basename,\n onReady: () => {\n setIsLoading(false);\n },\n onDispose: () => {\n disposer();\n },\n });\n };\n\n // Stringify data object so that it can be passed as a data-attribute\n const stringifiedData = useMemo(() => JSON.stringify(innerProps.data), [innerProps.data]);\n\n /*\n * Set key for rendering the web component so that if the data from the Host change,\n * and the MFE's version of startup doesn't support watching for data changes, then\n * the web component will be re-mounted whenever the data changes.\n * This is only used as a fallback when the MFE's version is older.\n */\n const key = mfeSupportsRerendering ? undefined : stringifiedData;\n const dataAttrs = useMemo(() => composeDataAttributes(innerProps.data), [innerProps.data]);\n const styleUrls = getStyleUrls(bundleInfo);\n\n return (\n <Fragment>\n {isLoading && <LoadingFallback />}\n <WebComponent\n key={key}\n ref={handleRef}\n class={innerProps.className}\n {...(styleUrls && { 'style-urls': styleUrls })}\n /*\n * Continue to spread data as separate data attributes for backwards compatibility,\n * in case the Host has updated web-components, but the MFE has not\n */\n {...dataAttrs}\n data-mfe-data={stringifiedData}\n data-mfe-name={elementName}\n {...(version && { 'data-mfe-version': version })}\n // @ts-expect-error style exists on HTMLElement\n style={resolvedBundleType === 'headless' ? { display: 'none' } : undefined}\n />\n </Fragment>\n );\n };\n}\n\n/*\n * Convert camelCase data props to kebab-case data attributes, prepended with data-\n * Ex: fooBar -> data-foo-bar\n */\nfunction composeDataAttributes(data: MFEContextData<{}> | undefined = {}) {\n return Object.fromEntries(\n Object.entries(data).map(([key, value]) => [\n 'data-' + key.replace(/[A-Z]/g, letter => '-' + letter.toLowerCase()),\n value,\n ])\n );\n}\n\nfunction ensureLDVersion(\n exposedInstanceDependencies: ExposedInstanceDependencies = {},\n version?: string\n) {\n if (version && !exposedInstanceDependencies.launchDarkly?.ldService) {\n return { ...exposedInstanceDependencies, launchDarkly: { version } };\n }\n return exposedInstanceDependencies;\n}\n\nfunction getStyleUrls({ urls }: Pick<BundleInfo, 'urls'>) {\n if (urls.css.length) {\n return encodeURIComponent(JSON.stringify(urls.css));\n }\n}\n"],"names":["Fragment","useMemo","useState","useOptionalDependencies","getElementName","HistoryManager","webComponent","props","bundleInfo","basename","eventBus","exposedDependencies","ldService","logService","WebComponent","resolvedBundleType","disposer","mfeSupportsRerendering","version","elementName","exposedInstanceDependencies","ensureLDVersion","bundledWith","LoadingFallback","innerProps","isLoading","setIsLoading","historyManager","handleRef","provide","onReady","onDispose","stringifiedData","JSON","stringify","data","key","undefined","dataAttrs","composeDataAttributes","styleUrls","getStyleUrls","ref","class","className","data-mfe-data","data-mfe-name","style","display","Object","fromEntries","entries","map","value","replace","letter","toLowerCase","launchDarkly","urls","css","length","encodeURIComponent"],"mappings":";AAAA,SAASA,QAAQ,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,QAAQ;AAGpD,SAASC,uBAAuB,QAAQ,0BAA0B;AAMlE,SAASC,cAAc,QAAQ,qBAAqB;AACpD,SAASC,cAAc,QAAQ,qBAAqB;AAapD,OAAO,SAASC,aAAaC,KAAwB;QAQ7CC;IAPJ,MAAM,EAAEC,QAAQ,EAAED,UAAU,EAAEE,QAAQ,EAAEC,mBAAmB,EAAEC,SAAS,EAAEC,UAAU,EAAE,GAAGN;IACvF,MAAM,EAAEO,YAAY,EAAEC,kBAAkB,EAAEC,QAAQ,EAAEC,sBAAsB,EAAEC,OAAO,EAAE,GACjFV;IACJ,MAAMW,cAAcf,eAAeI;IAEnC,MAAMY,8BAA8BC,gBAChCd,MAAMa,2BAA2B,GACjCZ,0BAAAA,WAAWc,WAAW,cAAtBd,8CAAAA,uBAAwB,CAAC,6BAA6B;IAG1D,OAAO,CAAC,EAAEe,eAAe,EAAE,GAAGC,YAA6B;QACvD,MAAM,CAACC,WAAWC,aAAa,GAAGxB,SAAS;QAC3C,MAAM,CAACyB,eAAe,GAAGxB,wBAAwBE;QAEjD,MAAMuB,YAAY,CAACtB;YACfA,yBAAAA,mCAAAA,aAAcuB,OAAO,CAAC;gBAClBjB;gBACAC;gBACAc;gBACAhB;gBACAS;gBACAV;gBACAD;gBACAqB,SAAS;oBACLJ,aAAa;gBACjB;gBACAK,WAAW;oBACPf;gBACJ;YACJ;QACJ;QAEA,qEAAqE;QACrE,MAAMgB,kBAAkB/B,QAAQ,IAAMgC,KAAKC,SAAS,CAACV,WAAWW,IAAI,GAAG;YAACX,WAAWW,IAAI;SAAC;QAExF;;;;;SAKC,GACD,MAAMC,MAAMnB,yBAAyBoB,YAAYL;QACjD,MAAMM,YAAYrC,QAAQ,IAAMsC,sBAAsBf,WAAWW,IAAI,GAAG;YAACX,WAAWW,IAAI;SAAC;QACzF,MAAMK,YAAYC,aAAajC;QAE/B,qBACI,MAACR;;gBACIyB,2BAAa,KAACF;8BACf,KAACT;oBAEG4B,KAAKd;oBACLe,OAAOnB,WAAWoB,SAAS;oBAC1B,GAAIJ,aAAa;wBAAE,cAAcA;oBAAU,CAAC;oBAK5C,GAAGF,SAAS;oBACbO,iBAAeb;oBACfc,iBAAe3B;oBACd,GAAID,WAAW;wBAAE,oBAAoBA;oBAAQ,CAAC;oBAC/C,+CAA+C;oBAC/C6B,OAAOhC,uBAAuB,aAAa;wBAAEiC,SAAS;oBAAO,IAAIX;mBAb5DD;;;IAiBrB;AACJ;AAEA;;;CAGC,GACD,SAASG,sBAAsBJ,OAAuC,CAAC,CAAC;IACpE,OAAOc,OAAOC,WAAW,CACrBD,OAAOE,OAAO,CAAChB,MAAMiB,GAAG,CAAC,CAAC,CAAChB,KAAKiB,MAAM,GAAK;YACvC,UAAUjB,IAAIkB,OAAO,CAAC,UAAUC,CAAAA,SAAU,MAAMA,OAAOC,WAAW;YAClEH;SACH;AAET;AAEA,SAAShC,gBACLD,8BAA2D,CAAC,CAAC,EAC7DF,OAAgB;QAEAE;IAAhB,IAAIF,WAAW,GAACE,4CAAAA,4BAA4BqC,YAAY,cAAxCrC,gEAAAA,0CAA0CR,SAAS,GAAE;QACjE,OAAO;YAAE,GAAGQ,2BAA2B;YAAEqC,cAAc;gBAAEvC;YAAQ;QAAE;IACvE;IACA,OAAOE;AACX;AAEA,SAASqB,aAAa,EAAEiB,IAAI,EAA4B;IACpD,IAAIA,KAAKC,GAAG,CAACC,MAAM,EAAE;QACjB,OAAOC,mBAAmB5B,KAAKC,SAAS,CAACwB,KAAKC,GAAG;IACrD;AACJ"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@servicetitan/web-components",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "31.1.0",
|
|
4
4
|
"description": "",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -15,17 +15,17 @@
|
|
|
15
15
|
"src"
|
|
16
16
|
],
|
|
17
17
|
"dependencies": {
|
|
18
|
-
"@servicetitan/error-boundary": "
|
|
18
|
+
"@servicetitan/error-boundary": "31.1.0",
|
|
19
19
|
"lodash.get": "~4.4.2",
|
|
20
20
|
"mitt": "~3.0.1",
|
|
21
21
|
"semver": "~7.7.2"
|
|
22
22
|
},
|
|
23
23
|
"devDependencies": {
|
|
24
|
-
"@servicetitan/anvil2": "^1.
|
|
24
|
+
"@servicetitan/anvil2": "^1.39.0",
|
|
25
25
|
"@servicetitan/design-system": "~14.5.3",
|
|
26
|
-
"@servicetitan/launchdarkly-service": "
|
|
27
|
-
"@servicetitan/log-service": "
|
|
28
|
-
"@servicetitan/react-ioc": "
|
|
26
|
+
"@servicetitan/launchdarkly-service": "31.1.0",
|
|
27
|
+
"@servicetitan/log-service": "31.1.0",
|
|
28
|
+
"@servicetitan/react-ioc": "31.1.0",
|
|
29
29
|
"@testing-library/dom": "^10.4.0",
|
|
30
30
|
"@testing-library/jest-dom": "^6.6.3",
|
|
31
31
|
"@testing-library/react": "^16.3.0",
|
|
@@ -35,17 +35,17 @@
|
|
|
35
35
|
"@types/react-dom": "~18.3.0",
|
|
36
36
|
"@types/semver": "~7.7.0",
|
|
37
37
|
"history": "~4.10.1",
|
|
38
|
-
"launchdarkly-react-client-sdk": "
|
|
38
|
+
"launchdarkly-react-client-sdk": "3.6.1",
|
|
39
39
|
"react": "~18.3.1",
|
|
40
40
|
"react-dom": "~18.3.1",
|
|
41
41
|
"shadow-dom-testing-library": "^1.12.0"
|
|
42
42
|
},
|
|
43
43
|
"peerDependencies": {
|
|
44
|
-
"@servicetitan/anvil2": ">=1.
|
|
44
|
+
"@servicetitan/anvil2": ">=1.39.0",
|
|
45
45
|
"@servicetitan/design-system": ">=14.5.3",
|
|
46
|
-
"@servicetitan/launchdarkly-service": "
|
|
47
|
-
"@servicetitan/log-service": "
|
|
48
|
-
"@servicetitan/react-ioc": "
|
|
46
|
+
"@servicetitan/launchdarkly-service": "31.1.0",
|
|
47
|
+
"@servicetitan/log-service": "31.1.0",
|
|
48
|
+
"@servicetitan/react-ioc": "31.1.0",
|
|
49
49
|
"history": "~4.10.1",
|
|
50
50
|
"react": ">=17.0.2",
|
|
51
51
|
"react-dom": ">=17.0.2"
|
|
@@ -67,5 +67,5 @@
|
|
|
67
67
|
"cli": {
|
|
68
68
|
"webpack": false
|
|
69
69
|
},
|
|
70
|
-
"gitHead": "
|
|
70
|
+
"gitHead": "d01cfe32c50461245ce52c911710e8eb879290e9"
|
|
71
71
|
}
|