@momentum-design/components 0.140.0 → 0.141.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.
Files changed (30) hide show
  1. package/dist/browser/index.js +424 -424
  2. package/dist/browser/index.js.map +4 -4
  3. package/dist/components/brandvisual/brandvisual.component.d.ts +49 -1
  4. package/dist/components/brandvisual/brandvisual.component.js +154 -19
  5. package/dist/components/brandvisualprovider/brandvisualprovider.component.d.ts +97 -0
  6. package/dist/components/brandvisualprovider/brandvisualprovider.component.js +105 -0
  7. package/dist/components/brandvisualprovider/brandvisualprovider.constants.d.ts +7 -0
  8. package/dist/components/brandvisualprovider/brandvisualprovider.constants.js +10 -0
  9. package/dist/components/brandvisualprovider/brandvisualprovider.context.d.ts +12 -0
  10. package/dist/components/brandvisualprovider/brandvisualprovider.context.js +7 -0
  11. package/dist/components/brandvisualprovider/brandvisualprovider.types.d.ts +3 -0
  12. package/dist/components/brandvisualprovider/brandvisualprovider.types.js +1 -0
  13. package/dist/components/brandvisualprovider/index.d.ts +7 -0
  14. package/dist/components/brandvisualprovider/index.js +4 -0
  15. package/dist/components/icon/icon.component.js +3 -2
  16. package/dist/components/illustration/illustration.component.js +3 -2
  17. package/dist/custom-elements.json +252 -7
  18. package/dist/index.d.ts +2 -1
  19. package/dist/index.js +2 -1
  20. package/dist/react/brandvisualprovider/index.d.ts +24 -0
  21. package/dist/react/brandvisualprovider/index.js +17 -0
  22. package/dist/react/index.d.ts +1 -0
  23. package/dist/react/index.js +1 -0
  24. package/dist/utils/asset-fetch/index.d.ts +42 -0
  25. package/dist/utils/asset-fetch/index.js +101 -0
  26. package/package.json +1 -1
  27. package/dist/components/icon/icon.utils.d.ts +0 -32
  28. package/dist/components/icon/icon.utils.js +0 -91
  29. package/dist/components/illustration/illustration.utils.d.ts +0 -32
  30. package/dist/components/illustration/illustration.utils.js +0 -91
@@ -1,91 +0,0 @@
1
- import { assetsCache } from '../../utils/assets-cache';
2
- /**
3
- * Utility function for fetching the icon from the provided `request`.
4
- * It will throw an error if the response is not ok.
5
- * @param request - The request object to fetch the icon
6
- * @returns Promise<Response> - The response from the fetch
7
- * @throws Error if the response is not ok
8
- */
9
- const fetchIcon = async (request) => fetch(request).then(response => {
10
- if (!response.ok) {
11
- throw new Error('There was a problem while fetching the icon!');
12
- }
13
- return response;
14
- });
15
- // Map of in-flight fetch promises keyed by URL to deduplicate concurrent requests
16
- const pendingFetches = new Map();
17
- /**
18
- * Fetches a dynamic SVG icon based on the provided `url`, `name` and `fileExtension`.
19
- * The fetch is aborted if the signal is aborted.
20
- *
21
- * This function also includes the logic to cache the fetched icon using the In Memory Cache or Web Cache API.
22
- * If the `cacheStrategy` is set to `web-cache-api` or `in-memory-cache` and `cacheName` is provided,
23
- * the fetched icon will be cached using the respective cache.
24
- *
25
- * It will throw an error if the response is not ok.
26
- *
27
- * @param url - The base url of the icon
28
- * @param name - The name of the icon
29
- * @param fileExtension - The file extension of the icon
30
- * @param signal - The signal to abort the fetch.
31
- * It is used to cancel the fetch when the component is disconnected or updated.
32
- * @param cacheStrategy - The cache strategy to use.
33
- * @param cacheName - The cache name to use.
34
- *
35
- * @returns Response string from the fetch
36
- * @throws Error if the response is not ok
37
- */
38
- const svgFetch = async ({ url, name, fileExtension, cacheStrategy, cacheName, renewSignal }) => {
39
- // abort the previous fetch request if it is still pending
40
- // and create a new signal
41
- const signal = renewSignal();
42
- const iconUrl = `${url}/${name}.${fileExtension}`;
43
- const request = new Request(iconUrl, {
44
- signal,
45
- });
46
- // if there is no cache defined (cacheName and cacheStrategy properly set),
47
- // fetch the icon and return the response
48
- if (!cacheName || !cacheStrategy || !['in-memory-cache', 'web-cache-api'].includes(cacheStrategy)) {
49
- return fetchIcon(request).then(response => response.text());
50
- }
51
- return assetsCache(cacheName, cacheStrategy).then(iconsCache => iconsCache
52
- .get(request)
53
- .then(responseFromCache => {
54
- // **If entry in cache, return**
55
- if (responseFromCache) {
56
- return responseFromCache;
57
- }
58
- // **Check for in-flight fetch for same URL**
59
- const pending = pendingFetches.get(iconUrl);
60
- if (pending) {
61
- return pending;
62
- }
63
- // **Otherwise, fetch and cache if successful**
64
- // Both fetchIcon() and iconsCache.set() "consume" the request,
65
- // so we need to make a copy.
66
- // (see https://developer.mozilla.org/en-US/docs/Web/API/Request/clone)
67
- const fetchPromise = fetchIcon(new Request(iconUrl)).then(response => {
68
- var _a;
69
- // This avoids caching responses that we know are errors
70
- // (i.e. HTTP status code of 4xx or 5xx).
71
- if (response.status < 400 && response.headers.has('content-type')) {
72
- // Call .clone() on the response to save copy to cache.
73
- // https://developer.mozilla.org/en-US/docs/Web/API/Request/clone
74
- return (_a = iconsCache.set) === null || _a === void 0 ? void 0 : _a.call(iconsCache, request, response.clone()).then(() => response.text());
75
- }
76
- return response.text();
77
- }).finally(() => {
78
- pendingFetches.delete(iconUrl);
79
- });
80
- pendingFetches.set(iconUrl, fetchPromise);
81
- return fetchPromise;
82
- })
83
- .catch(error => {
84
- // Note that a HTTP error response (e.g. 404) will NOT trigger
85
- // an exception.
86
- // It will return a normal response object that has the appropriate
87
- // error code set.
88
- throw new Error(`Error in caching the Icon ${name}, ${error}`);
89
- }));
90
- };
91
- export { svgFetch };
@@ -1,32 +0,0 @@
1
- import type { CacheStrategy } from '../../utils/assets-cache';
2
- interface Args {
3
- url: string;
4
- name: string;
5
- fileExtension: string;
6
- cacheStrategy?: CacheStrategy;
7
- cacheName?: string;
8
- renewSignal: () => AbortSignal;
9
- }
10
- /**
11
- * Fetches a dynamic SVG illustration based on the provided `url`, `name` and `fileExtension`.
12
- * The fetch is aborted if the signal is aborted.
13
- *
14
- * This function also includes the logic to cache the fetched illustration using the In Memory Cache or Web Cache API.
15
- * If the `cacheStrategy` is set to `web-cache-api` or `in-memory-cache` and `cacheName` is provided,
16
- * the fetched illustration will be cached using the respective cache.
17
- *
18
- * It will throw an error if the response is not ok.
19
- *
20
- * @param url - The base url of the illustration
21
- * @param name - The name of the illustration
22
- * @param fileExtension - The file extension of the illustration
23
- * @param signal - The signal to abort the fetch.
24
- * It is used to cancel the fetch when the component is disconnected or updated.
25
- * @param cacheStrategy - The cache strategy to use.
26
- * @param cacheName - The cache name to use.
27
- *
28
- * @returns Response string from the fetch
29
- * @throws Error if the response is not ok
30
- */
31
- declare const svgFetch: ({ url, name, fileExtension, cacheStrategy, cacheName, renewSignal }: Args) => Promise<string>;
32
- export { svgFetch };
@@ -1,91 +0,0 @@
1
- import { assetsCache } from '../../utils/assets-cache';
2
- /**
3
- * Utility function for fetching the illustration from the provided `request`.
4
- * It will throw an error if the response is not ok.
5
- * @param request - The request object to fetch the illustration
6
- * @returns Promise<Response> - The response from the fetch
7
- * @throws Error if the response is not ok
8
- */
9
- const fetchIllustration = async (request) => fetch(request).then(response => {
10
- if (!response.ok) {
11
- throw new Error('There was a problem while fetching the illustration!');
12
- }
13
- return response;
14
- });
15
- // Map of in-flight fetch promises keyed by URL to deduplicate concurrent requests
16
- const pendingFetches = new Map();
17
- /**
18
- * Fetches a dynamic SVG illustration based on the provided `url`, `name` and `fileExtension`.
19
- * The fetch is aborted if the signal is aborted.
20
- *
21
- * This function also includes the logic to cache the fetched illustration using the In Memory Cache or Web Cache API.
22
- * If the `cacheStrategy` is set to `web-cache-api` or `in-memory-cache` and `cacheName` is provided,
23
- * the fetched illustration will be cached using the respective cache.
24
- *
25
- * It will throw an error if the response is not ok.
26
- *
27
- * @param url - The base url of the illustration
28
- * @param name - The name of the illustration
29
- * @param fileExtension - The file extension of the illustration
30
- * @param signal - The signal to abort the fetch.
31
- * It is used to cancel the fetch when the component is disconnected or updated.
32
- * @param cacheStrategy - The cache strategy to use.
33
- * @param cacheName - The cache name to use.
34
- *
35
- * @returns Response string from the fetch
36
- * @throws Error if the response is not ok
37
- */
38
- const svgFetch = async ({ url, name, fileExtension, cacheStrategy, cacheName, renewSignal }) => {
39
- // abort the previous fetch request if it is still pending
40
- // and create a new signal
41
- const signal = renewSignal();
42
- const illustrationUrl = `${url}/${name}.${fileExtension}`;
43
- const request = new Request(illustrationUrl, {
44
- signal,
45
- });
46
- // if there is no cache defined (cacheName and cacheStrategy properly set),
47
- // fetch the illustration and return the response
48
- if (!cacheName || !cacheStrategy || !['in-memory-cache', 'web-cache-api'].includes(cacheStrategy)) {
49
- return fetchIllustration(request).then(response => response.text());
50
- }
51
- return assetsCache(cacheName, cacheStrategy).then(illustrationsCache => illustrationsCache
52
- .get(request)
53
- .then(responseFromCache => {
54
- // **If entry in cache, return**
55
- if (responseFromCache) {
56
- return responseFromCache;
57
- }
58
- // **Check for in-flight fetch for same URL**
59
- const pending = pendingFetches.get(illustrationUrl);
60
- if (pending) {
61
- return pending;
62
- }
63
- // **Otherwise, fetch and cache if successful**
64
- // Both fetchIllustration() and illustrationsCache.set() "consume" the request,
65
- // so we need to make a copy.
66
- // (see https://developer.mozilla.org/en-US/docs/Web/API/Request/clone)
67
- const fetchPromise = fetchIllustration(new Request(illustrationUrl)).then(response => {
68
- var _a;
69
- // This avoids caching responses that we know are errors
70
- // (i.e. HTTP status code of 4xx or 5xx).
71
- if (response.status < 400 && response.headers.has('content-type')) {
72
- // Call .clone() on the response to save copy to cache.
73
- // https://developer.mozilla.org/en-US/docs/Web/API/Request/clone
74
- return (_a = illustrationsCache.set) === null || _a === void 0 ? void 0 : _a.call(illustrationsCache, request, response.clone()).then(() => response.text());
75
- }
76
- return response.text();
77
- }).finally(() => {
78
- pendingFetches.delete(illustrationUrl);
79
- });
80
- pendingFetches.set(illustrationUrl, fetchPromise);
81
- return fetchPromise;
82
- })
83
- .catch(error => {
84
- // Note that a HTTP error response (e.g. 404) will NOT trigger
85
- // an exception.
86
- // It will return a normal response object that has the appropriate
87
- // error code set.
88
- throw new Error(`Error in caching the Illustration ${name}, ${error}`);
89
- }));
90
- };
91
- export { svgFetch };