@webiny/app 6.3.0-beta.4 → 6.4.0-beta.0

package/plugins/components/Image.js

@@ -1,18 +1,11 @@
-import React from "react";
-
-// Accepts all props that a normal <img> element would accept.
-
-const Image = ({
-  ...rest
-}) => {
-  const finalProps = {
-    ...rest
-  };
-  const srcSet = finalProps.srcSet;
-  if (srcSet && typeof srcSet === "object") {
-    finalProps.srcSet = Object.keys(srcSet).map(key => `${srcSet[key]} ${key}`).join(", ");
-  }
-  return /*#__PURE__*/React.createElement("img", finalProps);
+import react from "react";
+const Image = ({ ...rest })=>{
+    const finalProps = {
+        ...rest
+    };
+    const srcSet = finalProps.srcSet;
+    if (srcSet && "object" == typeof srcSet) finalProps.srcSet = Object.keys(srcSet).map((key)=>`${srcSet[key]} ${key}`).join(", ");
+    return /*#__PURE__*/ react.createElement("img", finalProps);
 };
 export { Image };
 

package/plugins/components/Image.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Image","rest","finalProps","srcSet","Object","keys","map","key","join","createElement"],"sources":["Image.tsx"],"sourcesContent":["import React from \"react\";\n\n// Accepts all props that a normal <img> element would accept.\ninterface ImageProps extends React.DetailedHTMLProps<\n    React.ImgHTMLAttributes<HTMLImageElement>,\n    HTMLImageElement\n> {\n    [key: string]: any;\n}\n\nconst Image = ({ ...rest }: ImageProps) => {\n    const finalProps = { ...rest };\n    const srcSet = finalProps.srcSet;\n    if (srcSet && typeof srcSet === \"object\") {\n        finalProps.srcSet = Object.keys(srcSet)\n            .map(key => `${srcSet[key]} ${key}`)\n            .join(\", \");\n    }\n\n    return <img {...finalProps} />;\n};\n\nexport { Image, type ImageProps };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;;AAEzB;;AAQA,MAAMC,KAAK,GAAGA,CAAC;EAAE,GAAGC;AAAiB,CAAC,KAAK;EACvC,MAAMC,UAAU,GAAG;IAAE,GAAGD;EAAK,CAAC;EAC9B,MAAME,MAAM,GAAGD,UAAU,CAACC,MAAM;EAChC,IAAIA,MAAM,IAAI,OAAOA,MAAM,KAAK,QAAQ,EAAE;IACtCD,UAAU,CAACC,MAAM,GAAGC,MAAM,CAACC,IAAI,CAACF,MAAM,CAAC,CAClCG,GAAG,CAACC,GAAG,IAAI,GAAGJ,MAAM,CAACI,GAAG,CAAC,IAAIA,GAAG,EAAE,CAAC,CACnCC,IAAI,CAAC,IAAI,CAAC;EACnB;EAEA,oBAAOT,KAAA,CAAAU,aAAA,QAASP,UAAa,CAAC;AAClC,CAAC;AAED,SAASF,KAAK","ignoreList":[]}
+{"version":3,"file":"plugins/components/Image.js","sources":["../../../src/plugins/components/Image.tsx"],"sourcesContent":["import React from \"react\";\n\n// Accepts all props that a normal <img> element would accept.\ninterface ImageProps extends React.DetailedHTMLProps<\n    React.ImgHTMLAttributes<HTMLImageElement>,\n    HTMLImageElement\n> {\n    [key: string]: any;\n}\n\nconst Image = ({ ...rest }: ImageProps) => {\n    const finalProps = { ...rest };\n    const srcSet = finalProps.srcSet;\n    if (srcSet && typeof srcSet === \"object\") {\n        finalProps.srcSet = Object.keys(srcSet)\n            .map(key => `${srcSet[key]} ${key}`)\n            .join(\", \");\n    }\n\n    return <img {...finalProps} />;\n};\n\nexport { Image, type ImageProps };\n"],"names":["Image","rest","finalProps","srcSet","Object","key"],"mappings":";AAUA,MAAMA,QAAQ,CAAC,EAAE,GAAGC,MAAkB;IAClC,MAAMC,aAAa;QAAE,GAAGD,IAAI;IAAC;IAC7B,MAAME,SAASD,WAAW,MAAM;IAChC,IAAIC,UAAU,AAAkB,YAAlB,OAAOA,QACjBD,WAAW,MAAM,GAAGE,OAAO,IAAI,CAACD,QAC3B,GAAG,CAACE,CAAAA,MAAO,GAAGF,MAAM,CAACE,IAAI,CAAC,CAAC,EAAEA,KAAK,EAClC,IAAI,CAAC;IAGd,OAAO,WAAP,GAAO,oBAAC,OAAQH;AACpB"}

package/plugins/image.js

@@ -1,145 +1,106 @@
-import React from "react";
+import react from "react";
 import { Image } from "./components/Image.js";
-const SUPPORTED_IMAGE_RESIZE_WIDTHS = [128, 384, 640, 750, 828, 1080, 1200, 1920, 2048, 3840];
-
-/**
- * Width of the image should not be just any random number. For optimization reasons,
- * we only allow the ones listed in SUPPORTED_IMAGE_RESIZE_WIDTHS list (Webiny Cloud supports only these).
- */
-const getSupportedImageResizeWidth = width => {
-  let output = SUPPORTED_IMAGE_RESIZE_WIDTHS[0];
-  let i = SUPPORTED_IMAGE_RESIZE_WIDTHS.length;
-  while (i >= 0) {
-    if (width === SUPPORTED_IMAGE_RESIZE_WIDTHS[i]) {
-      output = SUPPORTED_IMAGE_RESIZE_WIDTHS[i];
-      break;
-    }
-    if (width > SUPPORTED_IMAGE_RESIZE_WIDTHS[i]) {
-      // Use next larger width. If there isn't any, use current.
-      output = SUPPORTED_IMAGE_RESIZE_WIDTHS[i + 1];
-      if (!output) {
-        output = SUPPORTED_IMAGE_RESIZE_WIDTHS[i];
-      }
-      break;
+const SUPPORTED_IMAGE_RESIZE_WIDTHS = [
+    128,
+    384,
+    640,
+    750,
+    828,
+    1080,
+    1200,
+    1920,
+    2048,
+    3840
+];
+const getSupportedImageResizeWidth = (width)=>{
+    let output = SUPPORTED_IMAGE_RESIZE_WIDTHS[0];
+    let i = SUPPORTED_IMAGE_RESIZE_WIDTHS.length;
+    while(i >= 0){
+        if (width === SUPPORTED_IMAGE_RESIZE_WIDTHS[i]) {
+            output = SUPPORTED_IMAGE_RESIZE_WIDTHS[i];
+            break;
+        }
+        if (width > SUPPORTED_IMAGE_RESIZE_WIDTHS[i]) {
+            output = SUPPORTED_IMAGE_RESIZE_WIDTHS[i + 1];
+            if (!output) output = SUPPORTED_IMAGE_RESIZE_WIDTHS[i];
+            break;
+        }
+        i--;
     }
-    i--;
-  }
-  return output;
-};
-/**
- * Currently we only allow "width" as a transform option.
- * @param args
- */
-const sanitizeTransformArgs = args => {
-  const output = {};
-  if (!args || args.width === undefined || args.width === null) {
     return output;
-  }
-  const width = parseInt(args.width);
-  if (width > 0) {
-    output.width = getSupportedImageResizeWidth(width);
-  }
-  return output;
 };
-const getSizes = width => {
-  if (typeof width !== "string") {
-    return undefined;
-  }
-  // Check if width was set as percentage, with "%" in the value.
-  if (width.endsWith("%")) {
-    return `${parseInt(width)}vw`;
-  }
-  // Check if width was set as viewport width, with "vw" in the value.
-  if (width.endsWith("vw")) {
-    return `${parseInt(width)}vw`;
-  }
-
-  // Check if width was set as relative, with "em" in the value.
-  if (width.endsWith("em")) {
-    return `${parseInt(width)}em`;
-  }
-  return undefined;
+const sanitizeTransformArgs = (args)=>{
+    const output = {};
+    if (!args || void 0 === args.width || null === args.width) return output;
+    const width = parseInt(args.width);
+    if (width > 0) output.width = getSupportedImageResizeWidth(width);
+    return output;
 };
-const isFixedImageWidth = width => {
-  if (Number.isFinite(width)) {
-    return true;
-  }
-  if (typeof width === "string" && width.endsWith("px")) {
-    return true;
-  }
-  return false;
+const getSizes = (width)=>{
+    if ("string" != typeof width) return;
+    if (width.endsWith("%")) return `${parseInt(width)}vw`;
+    if (width.endsWith("vw")) return `${parseInt(width)}vw`;
+    if (width.endsWith("em")) return `${parseInt(width)}em`;
 };
-const getSrcSetAutoSizes = max => {
-  max = isFixedImageWidth(max) ? parseInt("" + max) : 2500;
-  const maxWidth = getSupportedImageResizeWidth(max);
-  return SUPPORTED_IMAGE_RESIZE_WIDTHS.filter(supportedWidth => {
-    return supportedWidth <= maxWidth;
-  });
+const isFixedImageWidth = (width)=>{
+    if (Number.isFinite(width)) return true;
+    if ("string" == typeof width && width.endsWith("px")) return true;
+    return false;
 };
-const convertTransformToQueryParams = transform => {
-  return Object.keys(transform).map(key => `${key}=${transform[key]}`).join("&");
+const getSrcSetAutoSizes = (max)=>{
+    max = isFixedImageWidth(max) ? parseInt("" + max) : 2500;
+    const maxWidth = getSupportedImageResizeWidth(max);
+    return SUPPORTED_IMAGE_RESIZE_WIDTHS.filter((supportedWidth)=>supportedWidth <= maxWidth);
 };
-export default () => {
-  const imagePlugin = {
-    name: "image-component",
-    type: "image-component",
-    presets: {
-      avatar: {
-        width: 300
-      }
-    },
-    getImageSrc: props => {
-      if (!props) {
-        return "";
-      }
-      const {
-        src,
-        transform
-      } = props;
-      if (!transform) {
-        return src;
-      }
-      if (!src || src.startsWith("data:") || src.endsWith("svg")) {
-        return src;
-      }
-      const sanitizedParams = sanitizeTransformArgs(transform);
-      const params = convertTransformToQueryParams(sanitizedParams);
-      return src + "?" + params;
-    },
-    render(props) {
-      const {
-        transform,
-        srcSet: srcSetInitial,
-        ...imageProps
-      } = props;
-      let srcSet = srcSetInitial;
-      let sizes;
-      const src = imageProps.src;
-      if (srcSet && srcSet === "auto") {
-        srcSet = {};
-
-        // Check if image width was forced, and additionally if width was set as pixels, with "px" in the value.
-        const forcedWidth = props.width || props.style && props.style.width;
-        const srcSetAutoWidths = getSrcSetAutoSizes(forcedWidth);
-        srcSetAutoWidths.forEach(width => {
-          srcSet[width + "w"] = imagePlugin.getImageSrc({
-            src,
-            transform: {
-              ...transform,
-              width
+const convertTransformToQueryParams = (transform)=>Object.keys(transform).map((key)=>`${key}=${transform[key]}`).join("&");
+const plugins_image = ()=>{
+    const imagePlugin = {
+        name: "image-component",
+        type: "image-component",
+        presets: {
+            avatar: {
+                width: 300
             }
-          });
-        });
-        sizes = getSizes(forcedWidth);
-      }
-      return /*#__PURE__*/React.createElement(Image, Object.assign({}, imageProps, {
-        srcSet: srcSet,
-        src: src,
-        sizes: sizes
-      }));
-    }
-  };
-  return imagePlugin;
+        },
+        getImageSrc: (props)=>{
+            if (!props) return "";
+            const { src, transform } = props;
+            if (!transform) return src;
+            if (!src || src.startsWith("data:") || src.endsWith("svg")) return src;
+            const sanitizedParams = sanitizeTransformArgs(transform);
+            const params = convertTransformToQueryParams(sanitizedParams);
+            return src + "?" + params;
+        },
+        render (props) {
+            const { transform, srcSet: srcSetInitial, ...imageProps } = props;
+            let srcSet = srcSetInitial;
+            let sizes;
+            const src = imageProps.src;
+            if (srcSet && "auto" === srcSet) {
+                srcSet = {};
+                const forcedWidth = props.width || props.style && props.style.width;
+                const srcSetAutoWidths = getSrcSetAutoSizes(forcedWidth);
+                srcSetAutoWidths.forEach((width)=>{
+                    srcSet[width + "w"] = imagePlugin.getImageSrc({
+                        src,
+                        transform: {
+                            ...transform,
+                            width
+                        }
+                    });
+                });
+                sizes = getSizes(forcedWidth);
+            }
+            return /*#__PURE__*/ react.createElement(Image, {
+                ...imageProps,
+                srcSet: srcSet,
+                src: src,
+                sizes: sizes
+            });
+        }
+    };
+    return imagePlugin;
 };
+export default plugins_image;
 
 //# sourceMappingURL=image.js.map

package/plugins/image.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Image","SUPPORTED_IMAGE_RESIZE_WIDTHS","getSupportedImageResizeWidth","width","output","i","length","sanitizeTransformArgs","args","undefined","parseInt","getSizes","endsWith","isFixedImageWidth","Number","isFinite","getSrcSetAutoSizes","max","maxWidth","filter","supportedWidth","convertTransformToQueryParams","transform","Object","keys","map","key","join","imagePlugin","name","type","presets","avatar","getImageSrc","props","src","startsWith","sanitizedParams","params","render","srcSet","srcSetInitial","imageProps","sizes","forcedWidth","style","srcSetAutoWidths","forEach","createElement","assign"],"sources":["image.tsx"],"sourcesContent":["import React from \"react\";\nimport { Image } from \"./components/Image.js\";\nimport type { ImageComponentPlugin } from \"~/types.js\";\n\nconst SUPPORTED_IMAGE_RESIZE_WIDTHS = [128, 384, 640, 750, 828, 1080, 1200, 1920, 2048, 3840];\n\n/**\n * Width of the image should not be just any random number. For optimization reasons,\n * we only allow the ones listed in SUPPORTED_IMAGE_RESIZE_WIDTHS list (Webiny Cloud supports only these).\n */\nconst getSupportedImageResizeWidth = (width: number) => {\n    let output = SUPPORTED_IMAGE_RESIZE_WIDTHS[0];\n    let i = SUPPORTED_IMAGE_RESIZE_WIDTHS.length;\n    while (i >= 0) {\n        if (width === SUPPORTED_IMAGE_RESIZE_WIDTHS[i]) {\n            output = SUPPORTED_IMAGE_RESIZE_WIDTHS[i];\n            break;\n        }\n\n        if (width > SUPPORTED_IMAGE_RESIZE_WIDTHS[i]) {\n            // Use next larger width. If there isn't any, use current.\n            output = SUPPORTED_IMAGE_RESIZE_WIDTHS[i + 1];\n            if (!output) {\n                output = SUPPORTED_IMAGE_RESIZE_WIDTHS[i];\n            }\n            break;\n        }\n\n        i--;\n    }\n\n    return output;\n};\n\ninterface SanitizeTransformArgsParams {\n    width?: string;\n}\ninterface SanitizeTransformArgsResult {\n    width?: number;\n}\n/**\n * Currently we only allow \"width\" as a transform option.\n * @param args\n */\nconst sanitizeTransformArgs = (args?: SanitizeTransformArgsParams): SanitizeTransformArgsResult => {\n    const output: SanitizeTransformArgsResult = {};\n    if (!args || args.width === undefined || args.width === null) {\n        return output;\n    }\n    const width = parseInt(args.width);\n    if (width > 0) {\n        output.width = getSupportedImageResizeWidth(width);\n    }\n\n    return output;\n};\n\nconst getSizes = (width?: string | number): string | undefined => {\n    if (typeof width !== \"string\") {\n        return undefined;\n    }\n    // Check if width was set as percentage, with \"%\" in the value.\n    if (width.endsWith(\"%\")) {\n        return `${parseInt(width)}vw`;\n    }\n    // Check if width was set as viewport width, with \"vw\" in the value.\n    if (width.endsWith(\"vw\")) {\n        return `${parseInt(width)}vw`;\n    }\n\n    // Check if width was set as relative, with \"em\" in the value.\n    if (width.endsWith(\"em\")) {\n        return `${parseInt(width)}em`;\n    }\n\n    return undefined;\n};\n\nconst isFixedImageWidth = (width?: number | string) => {\n    if (Number.isFinite(width)) {\n        return true;\n    }\n\n    if (typeof width === \"string\" && width.endsWith(\"px\")) {\n        return true;\n    }\n    return false;\n};\n\nconst getSrcSetAutoSizes = (max?: string | number) => {\n    max = isFixedImageWidth(max) ? parseInt(\"\" + max) : 2500;\n    const maxWidth = getSupportedImageResizeWidth(max);\n    return SUPPORTED_IMAGE_RESIZE_WIDTHS.filter((supportedWidth: number) => {\n        return supportedWidth <= maxWidth;\n    });\n};\n\nconst convertTransformToQueryParams = (transform: Record<string, any>): string => {\n    return Object.keys(transform)\n        .map(key => `${key}=${transform[key]}`)\n        .join(\"&\");\n};\n\nexport default () => {\n    const imagePlugin: ImageComponentPlugin = {\n        name: \"image-component\",\n        type: \"image-component\",\n        presets: {\n            avatar: { width: 300 }\n        },\n        getImageSrc: (props?: Record<string, any>) => {\n            if (!props) {\n                return \"\";\n            }\n\n            const { src, transform } = props;\n            if (!transform) {\n                return src;\n            }\n\n            if (!src || src.startsWith(\"data:\") || src.endsWith(\"svg\")) {\n                return src;\n            }\n\n            const sanitizedParams = sanitizeTransformArgs(transform);\n            const params = convertTransformToQueryParams(sanitizedParams);\n            return src + \"?\" + params;\n        },\n        render(props) {\n            const { transform, srcSet: srcSetInitial, ...imageProps } = props;\n            let srcSet: any = srcSetInitial;\n            let sizes: string | undefined;\n            const src = imageProps.src;\n            if (srcSet && srcSet === \"auto\") {\n                srcSet = {};\n\n                // Check if image width was forced, and additionally if width was set as pixels, with \"px\" in the value.\n                const forcedWidth = props.width || (props.style && props.style.width);\n                const srcSetAutoWidths = getSrcSetAutoSizes(forcedWidth);\n                srcSetAutoWidths.forEach(width => {\n                    srcSet[width + \"w\"] = imagePlugin.getImageSrc({\n                        src,\n                        transform: { ...transform, width }\n                    });\n                });\n                sizes = getSizes(forcedWidth);\n            }\n\n            return <Image {...imageProps} srcSet={srcSet} src={src} sizes={sizes} />;\n        }\n    };\n\n    return imagePlugin;\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"plugins/image.js","sources":["../../src/plugins/image.tsx"],"sourcesContent":["import React from \"react\";\nimport { Image } from \"./components/Image.js\";\nimport type { ImageComponentPlugin } from \"~/types.js\";\n\nconst SUPPORTED_IMAGE_RESIZE_WIDTHS = [128, 384, 640, 750, 828, 1080, 1200, 1920, 2048, 3840];\n\n/**\n * Width of the image should not be just any random number. For optimization reasons,\n * we only allow the ones listed in SUPPORTED_IMAGE_RESIZE_WIDTHS list (Webiny Cloud supports only these).\n */\nconst getSupportedImageResizeWidth = (width: number) => {\n    let output = SUPPORTED_IMAGE_RESIZE_WIDTHS[0];\n    let i = SUPPORTED_IMAGE_RESIZE_WIDTHS.length;\n    while (i >= 0) {\n        if (width === SUPPORTED_IMAGE_RESIZE_WIDTHS[i]) {\n            output = SUPPORTED_IMAGE_RESIZE_WIDTHS[i];\n            break;\n        }\n\n        if (width > SUPPORTED_IMAGE_RESIZE_WIDTHS[i]) {\n            // Use next larger width. If there isn't any, use current.\n            output = SUPPORTED_IMAGE_RESIZE_WIDTHS[i + 1];\n            if (!output) {\n                output = SUPPORTED_IMAGE_RESIZE_WIDTHS[i];\n            }\n            break;\n        }\n\n        i--;\n    }\n\n    return output;\n};\n\ninterface SanitizeTransformArgsParams {\n    width?: string;\n}\ninterface SanitizeTransformArgsResult {\n    width?: number;\n}\n/**\n * Currently we only allow \"width\" as a transform option.\n * @param args\n */\nconst sanitizeTransformArgs = (args?: SanitizeTransformArgsParams): SanitizeTransformArgsResult => {\n    const output: SanitizeTransformArgsResult = {};\n    if (!args || args.width === undefined || args.width === null) {\n        return output;\n    }\n    const width = parseInt(args.width);\n    if (width > 0) {\n        output.width = getSupportedImageResizeWidth(width);\n    }\n\n    return output;\n};\n\nconst getSizes = (width?: string | number): string | undefined => {\n    if (typeof width !== \"string\") {\n        return undefined;\n    }\n    // Check if width was set as percentage, with \"%\" in the value.\n    if (width.endsWith(\"%\")) {\n        return `${parseInt(width)}vw`;\n    }\n    // Check if width was set as viewport width, with \"vw\" in the value.\n    if (width.endsWith(\"vw\")) {\n        return `${parseInt(width)}vw`;\n    }\n\n    // Check if width was set as relative, with \"em\" in the value.\n    if (width.endsWith(\"em\")) {\n        return `${parseInt(width)}em`;\n    }\n\n    return undefined;\n};\n\nconst isFixedImageWidth = (width?: number | string) => {\n    if (Number.isFinite(width)) {\n        return true;\n    }\n\n    if (typeof width === \"string\" && width.endsWith(\"px\")) {\n        return true;\n    }\n    return false;\n};\n\nconst getSrcSetAutoSizes = (max?: string | number) => {\n    max = isFixedImageWidth(max) ? parseInt(\"\" + max) : 2500;\n    const maxWidth = getSupportedImageResizeWidth(max);\n    return SUPPORTED_IMAGE_RESIZE_WIDTHS.filter((supportedWidth: number) => {\n        return supportedWidth <= maxWidth;\n    });\n};\n\nconst convertTransformToQueryParams = (transform: Record<string, any>): string => {\n    return Object.keys(transform)\n        .map(key => `${key}=${transform[key]}`)\n        .join(\"&\");\n};\n\nexport default () => {\n    const imagePlugin: ImageComponentPlugin = {\n        name: \"image-component\",\n        type: \"image-component\",\n        presets: {\n            avatar: { width: 300 }\n        },\n        getImageSrc: (props?: Record<string, any>) => {\n            if (!props) {\n                return \"\";\n            }\n\n            const { src, transform } = props;\n            if (!transform) {\n                return src;\n            }\n\n            if (!src || src.startsWith(\"data:\") || src.endsWith(\"svg\")) {\n                return src;\n            }\n\n            const sanitizedParams = sanitizeTransformArgs(transform);\n            const params = convertTransformToQueryParams(sanitizedParams);\n            return src + \"?\" + params;\n        },\n        render(props) {\n            const { transform, srcSet: srcSetInitial, ...imageProps } = props;\n            let srcSet: any = srcSetInitial;\n            let sizes: string | undefined;\n            const src = imageProps.src;\n            if (srcSet && srcSet === \"auto\") {\n                srcSet = {};\n\n                // Check if image width was forced, and additionally if width was set as pixels, with \"px\" in the value.\n                const forcedWidth = props.width || (props.style && props.style.width);\n                const srcSetAutoWidths = getSrcSetAutoSizes(forcedWidth);\n                srcSetAutoWidths.forEach(width => {\n                    srcSet[width + \"w\"] = imagePlugin.getImageSrc({\n                        src,\n                        transform: { ...transform, width }\n                    });\n                });\n                sizes = getSizes(forcedWidth);\n            }\n\n            return <Image {...imageProps} srcSet={srcSet} src={src} sizes={sizes} />;\n        }\n    };\n\n    return imagePlugin;\n};\n"],"names":["SUPPORTED_IMAGE_RESIZE_WIDTHS","getSupportedImageResizeWidth","width","output","i","sanitizeTransformArgs","args","undefined","parseInt","getSizes","isFixedImageWidth","Number","getSrcSetAutoSizes","max","maxWidth","supportedWidth","convertTransformToQueryParams","transform","Object","key","imagePlugin","props","src","sanitizedParams","params","srcSetInitial","imageProps","srcSet","sizes","forcedWidth","srcSetAutoWidths","Image"],"mappings":"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"}

package/plugins/index.js

@@ -1,66 +1,42 @@
-import React from "react";
+import react from "react";
 import warning from "warning";
 import { plugins } from "@webiny/plugins";
-import imagePlugin from "./image.js";
-export { imagePlugin };
-const PluginComponent = props => {
-  return props.children;
-};
-const PluginsComponent = props => {
-  return props.children;
-};
-export const renderPlugin = (name, params = {}, options = {}) => {
-  const {
-    wrapper = true,
-    fn = "render"
-  } = options;
-  const plugin = plugins.byName(name);
-  warning(plugin, `No such plugin "${name}"`);
-  if (!plugin) {
+import image_0 from "./image.js";
+const PluginComponent = (props)=>props.children;
+const PluginsComponent = (props)=>props.children;
+const renderPlugin = (name, params = {}, options = {})=>{
+    const { wrapper = true, fn = "render" } = options;
+    const plugin = plugins.byName(name);
+    warning(plugin, `No such plugin "${name}"`);
+    if (!plugin) return null;
+    const content = plugin[fn](params);
+    if (content) return wrapper ? /*#__PURE__*/ react.createElement(PluginComponent, {
+        key: plugin.name,
+        name: name,
+        params: params,
+        fn: fn
+    }, content) : /*#__PURE__*/ react.cloneElement(content, {
+        key: plugin.name
+    });
     return null;
-  }
-  const content = plugin[fn](params);
-  if (content) {
-    return wrapper ? /*#__PURE__*/React.createElement(PluginComponent, {
-      key: plugin.name,
-      name: name,
-      params: params,
-      fn: fn
-    }, content) : (/*#__PURE__*/React.cloneElement(content, {
-      key: plugin.name
-    }));
-  }
-  return null;
 };
-export const renderPlugins = (type, params = {}, options = {}) => {
-  const {
-    wrapper = true,
-    fn = "render",
-    filter = v => v,
-    reverse
-  } = options;
-  const content = plugins.byType(type).filter(pl => {
-    /**
-     * TODO @ts-refactor Problem with possibility of a different subtype.
-     */
-    // @ts-expect-error
-    return filter(pl);
-  })
-  /**
-   * We cast as string because renderPlugin checks for the plugin.name
-   */.map(plugin => renderPlugin(plugin.name, params, {
-    wrapper,
-    fn
-  })).filter(Boolean);
-  if (reverse) {
-    content.reverse();
-  }
-  return wrapper ? /*#__PURE__*/React.createElement(PluginsComponent, {
-    type: type,
-    params: params,
-    fn: fn
-  }, content) : content;
+const renderPlugins = (type, params = {}, options = {})=>{
+    const { wrapper = true, fn = "render", filter = (v)=>v, reverse } = options;
+    const content = plugins.byType(type).filter((pl)=>filter(pl)).map((plugin)=>renderPlugin(plugin.name, params, {
+            wrapper,
+            fn
+        })).filter(Boolean);
+    if (reverse) content.reverse();
+    return wrapper ? /*#__PURE__*/ react.createElement(PluginsComponent, {
+        type: type,
+        params: params,
+        fn: fn
+    }, content) : content;
 };
-export default [imagePlugin];
+const src_plugins = [
+    image_0
+];
+export default src_plugins;
+export { image_0 as imagePlugin, renderPlugin, renderPlugins };
 
 //# sourceMappingURL=index.js.map

package/plugins/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","warning","plugins","imagePlugin","PluginComponent","props","children","PluginsComponent","renderPlugin","name","params","options","wrapper","fn","plugin","byName","content","createElement","key","cloneElement","renderPlugins","type","filter","v","reverse","byType","pl","map","Boolean"],"sources":["index.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport React from \"react\";\nimport warning from \"warning\";\nimport { plugins } from \"@webiny/plugins\";\nimport type { Plugin } from \"@webiny/plugins/types.js\";\nimport imagePlugin from \"./image.js\";\n\nexport { imagePlugin };\n\ntype RenderPluginOptions<T> = {\n    wrapper?: boolean;\n    fn?: string;\n    filter?: (value: T, index: number, array: T[]) => boolean;\n    reverse?: boolean;\n};\n\ninterface RenderPlugin {\n    <T extends Plugin = Plugin>(\n        name: string,\n        params?: any,\n        options?: RenderPluginOptions<T>\n    ): ReactNode | ReactNode[];\n}\n\ninterface RenderPlugins {\n    <T extends Plugin = Plugin>(\n        type: string,\n        params?: any,\n        options?: RenderPluginOptions<T>\n    ): ReactNode | ReactNode[];\n}\n\ninterface PluginComponentProps {\n    name: string;\n    params: Record<string, any>;\n    fn: string;\n    children: React.ReactNode;\n}\nconst PluginComponent = (props: PluginComponentProps) => {\n    return props.children as React.ReactElement;\n};\ninterface PluginsComponentProps {\n    type: string;\n    params: Record<string, any>;\n    fn: string;\n    children: React.ReactNode;\n}\nconst PluginsComponent = (props: PluginsComponentProps) => {\n    return props.children as React.ReactElement;\n};\n\nexport const renderPlugin: RenderPlugin = (name, params = {}, options = {}) => {\n    const { wrapper = true, fn = \"render\" } = options;\n\n    const plugin = plugins.byName(name);\n    warning(plugin, `No such plugin \"${name}\"`);\n\n    if (!plugin) {\n        return null;\n    }\n\n    const content = plugin[fn](params);\n    if (content) {\n        return wrapper ? (\n            <PluginComponent key={plugin.name} name={name} params={params} fn={fn}>\n                {content}\n            </PluginComponent>\n        ) : (\n            React.cloneElement(content, { key: plugin.name })\n        );\n    }\n    return null;\n};\n\nexport const renderPlugins: RenderPlugins = (type, params = {}, options = {}) => {\n    const { wrapper = true, fn = \"render\", filter = v => v, reverse } = options;\n\n    const content = plugins\n        .byType(type)\n        .filter(pl => {\n            /**\n             * TODO @ts-refactor Problem with possibility of a different subtype.\n             */\n            // @ts-expect-error\n            return filter(pl);\n        })\n        /**\n         * We cast as string because renderPlugin checks for the plugin.name\n         */\n        .map(plugin => renderPlugin(plugin.name as string, params, { wrapper, fn }))\n        .filter(Boolean);\n\n    if (reverse) {\n        content.reverse();\n    }\n\n    return wrapper ? (\n        <PluginsComponent type={type} params={params} fn={fn}>\n            {content}\n        </PluginsComponent>\n    ) : (\n        content\n    );\n};\n\nexport default [imagePlugin];\n"],"mappings":"AACA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,OAAO,MAAM,SAAS;AAC7B,SAASC,OAAO,QAAQ,iBAAiB;AAEzC,OAAOC,WAAW;AAElB,SAASA,WAAW;AA+BpB,MAAMC,eAAe,GAAIC,KAA2B,IAAK;EACrD,OAAOA,KAAK,CAACC,QAAQ;AACzB,CAAC;AAOD,MAAMC,gBAAgB,GAAIF,KAA4B,IAAK;EACvD,OAAOA,KAAK,CAACC,QAAQ;AACzB,CAAC;AAED,OAAO,MAAME,YAA0B,GAAGA,CAACC,IAAI,EAAEC,MAAM,GAAG,CAAC,CAAC,EAAEC,OAAO,GAAG,CAAC,CAAC,KAAK;EAC3E,MAAM;IAAEC,OAAO,GAAG,IAAI;IAAEC,EAAE,GAAG;EAAS,CAAC,GAAGF,OAAO;EAEjD,MAAMG,MAAM,GAAGZ,OAAO,CAACa,MAAM,CAACN,IAAI,CAAC;EACnCR,OAAO,CAACa,MAAM,EAAE,mBAAmBL,IAAI,GAAG,CAAC;EAE3C,IAAI,CAACK,MAAM,EAAE;IACT,OAAO,IAAI;EACf;EAEA,MAAME,OAAO,GAAGF,MAAM,CAACD,EAAE,CAAC,CAACH,MAAM,CAAC;EAClC,IAAIM,OAAO,EAAE;IACT,OAAOJ,OAAO,gBACVZ,KAAA,CAAAiB,aAAA,CAACb,eAAe;MAACc,GAAG,EAAEJ,MAAM,CAACL,IAAK;MAACA,IAAI,EAAEA,IAAK;MAACC,MAAM,EAAEA,MAAO;MAACG,EAAE,EAAEA;IAAG,GACjEG,OACY,CAAC,iBAElBhB,KAAK,CAACmB,YAAY,CAACH,OAAO,EAAE;MAAEE,GAAG,EAAEJ,MAAM,CAACL;IAAK,CAAC,CAAC,CACpD;EACL;EACA,OAAO,IAAI;AACf,CAAC;AAED,OAAO,MAAMW,aAA4B,GAAGA,CAACC,IAAI,EAAEX,MAAM,GAAG,CAAC,CAAC,EAAEC,OAAO,GAAG,CAAC,CAAC,KAAK;EAC7E,MAAM;IAAEC,OAAO,GAAG,IAAI;IAAEC,EAAE,GAAG,QAAQ;IAAES,MAAM,GAAGC,CAAC,IAAIA,CAAC;IAAEC;EAAQ,CAAC,GAAGb,OAAO;EAE3E,MAAMK,OAAO,GAAGd,OAAO,CAClBuB,MAAM,CAACJ,IAAI,CAAC,CACZC,MAAM,CAACI,EAAE,IAAI;IACV;AACZ;AACA;IACY;IACA,OAAOJ,MAAM,CAACI,EAAE,CAAC;EACrB,CAAC;EACD;AACR;AACA,KAFQ,CAGCC,GAAG,CAACb,MAAM,IAAIN,YAAY,CAACM,MAAM,CAACL,IAAI,EAAYC,MAAM,EAAE;IAAEE,OAAO;IAAEC;EAAG,CAAC,CAAC,CAAC,CAC3ES,MAAM,CAACM,OAAO,CAAC;EAEpB,IAAIJ,OAAO,EAAE;IACTR,OAAO,CAACQ,OAAO,CAAC,CAAC;EACrB;EAEA,OAAOZ,OAAO,gBACVZ,KAAA,CAAAiB,aAAA,CAACV,gBAAgB;IAACc,IAAI,EAAEA,IAAK;IAACX,MAAM,EAAEA,MAAO;IAACG,EAAE,EAAEA;EAAG,GAChDG,OACa,CAAC,GAEnBA,OACH;AACL,CAAC;AAED,eAAe,CAACb,WAAW,CAAC","ignoreList":[]}
+{"version":3,"file":"plugins/index.js","sources":["../../src/plugins/index.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport React from \"react\";\nimport warning from \"warning\";\nimport { plugins } from \"@webiny/plugins\";\nimport type { Plugin } from \"@webiny/plugins/types.js\";\nimport imagePlugin from \"./image.js\";\n\nexport { imagePlugin };\n\ntype RenderPluginOptions<T> = {\n    wrapper?: boolean;\n    fn?: string;\n    filter?: (value: T, index: number, array: T[]) => boolean;\n    reverse?: boolean;\n};\n\ninterface RenderPlugin {\n    <T extends Plugin = Plugin>(\n        name: string,\n        params?: any,\n        options?: RenderPluginOptions<T>\n    ): ReactNode | ReactNode[];\n}\n\ninterface RenderPlugins {\n    <T extends Plugin = Plugin>(\n        type: string,\n        params?: any,\n        options?: RenderPluginOptions<T>\n    ): ReactNode | ReactNode[];\n}\n\ninterface PluginComponentProps {\n    name: string;\n    params: Record<string, any>;\n    fn: string;\n    children: React.ReactNode;\n}\nconst PluginComponent = (props: PluginComponentProps) => {\n    return props.children as React.ReactElement;\n};\ninterface PluginsComponentProps {\n    type: string;\n    params: Record<string, any>;\n    fn: string;\n    children: React.ReactNode;\n}\nconst PluginsComponent = (props: PluginsComponentProps) => {\n    return props.children as React.ReactElement;\n};\n\nexport const renderPlugin: RenderPlugin = (name, params = {}, options = {}) => {\n    const { wrapper = true, fn = \"render\" } = options;\n\n    const plugin = plugins.byName(name);\n    warning(plugin, `No such plugin \"${name}\"`);\n\n    if (!plugin) {\n        return null;\n    }\n\n    const content = plugin[fn](params);\n    if (content) {\n        return wrapper ? (\n            <PluginComponent key={plugin.name} name={name} params={params} fn={fn}>\n                {content}\n            </PluginComponent>\n        ) : (\n            React.cloneElement(content, { key: plugin.name })\n        );\n    }\n    return null;\n};\n\nexport const renderPlugins: RenderPlugins = (type, params = {}, options = {}) => {\n    const { wrapper = true, fn = \"render\", filter = v => v, reverse } = options;\n\n    const content = plugins\n        .byType(type)\n        .filter(pl => {\n            /**\n             * TODO @ts-refactor Problem with possibility of a different subtype.\n             */\n            // @ts-expect-error\n            return filter(pl);\n        })\n        /**\n         * We cast as string because renderPlugin checks for the plugin.name\n         */\n        .map(plugin => renderPlugin(plugin.name as string, params, { wrapper, fn }))\n        .filter(Boolean);\n\n    if (reverse) {\n        content.reverse();\n    }\n\n    return wrapper ? (\n        <PluginsComponent type={type} params={params} fn={fn}>\n            {content}\n        </PluginsComponent>\n    ) : (\n        content\n    );\n};\n\nexport default [imagePlugin];\n"],"names":["PluginComponent","props","PluginsComponent","renderPlugin","name","params","options","wrapper","fn","plugin","plugins","warning","content","React","renderPlugins","type","filter","v","reverse","pl","Boolean","imagePlugin"],"mappings":";;;;AAsCA,MAAMA,kBAAkB,CAACC,QACdA,MAAM,QAAQ;AAQzB,MAAMC,mBAAmB,CAACD,QACfA,MAAM,QAAQ;AAGlB,MAAME,eAA6B,CAACC,MAAMC,SAAS,CAAC,CAAC,EAAEC,UAAU,CAAC,CAAC;IACtE,MAAM,EAAEC,UAAU,IAAI,EAAEC,KAAK,QAAQ,EAAE,GAAGF;IAE1C,MAAMG,SAASC,QAAQ,MAAM,CAACN;IAC9BO,QAAQF,QAAQ,CAAC,gBAAgB,EAAEL,KAAK,CAAC,CAAC;IAE1C,IAAI,CAACK,QACD,OAAO;IAGX,MAAMG,UAAUH,MAAM,CAACD,GAAG,CAACH;IAC3B,IAAIO,SACA,OAAOL,UAAU,WAAVA,GACH,oBAACP,iBAAeA;QAAC,KAAKS,OAAO,IAAI;QAAE,MAAML;QAAM,QAAQC;QAAQ,IAAIG;OAC9DI,WAAAA,WAAAA,GAGLC,MAAAA,YAAkB,CAACD,SAAS;QAAE,KAAKH,OAAO,IAAI;IAAC;IAGvD,OAAO;AACX;AAEO,MAAMK,gBAA+B,CAACC,MAAMV,SAAS,CAAC,CAAC,EAAEC,UAAU,CAAC,CAAC;IACxE,MAAM,EAAEC,UAAU,IAAI,EAAEC,KAAK,QAAQ,EAAEQ,SAASC,CAAAA,IAAKA,CAAC,EAAEC,OAAO,EAAE,GAAGZ;IAEpE,MAAMM,UAAUF,QAAAA,MACL,CAACK,MACP,MAAM,CAACI,CAAAA,KAKGH,OAAOG,KAKjB,GAAG,CAACV,CAAAA,SAAUN,aAAaM,OAAO,IAAI,EAAYJ,QAAQ;YAAEE;YAASC;QAAG,IACxE,MAAM,CAACY;IAEZ,IAAIF,SACAN,QAAQ,OAAO;IAGnB,OAAOL,UAAU,WAAVA,GACH,oBAACL,kBAAgBA;QAAC,MAAMa;QAAM,QAAQV;QAAQ,IAAIG;OAC7CI,WAGLA;AAER;AAEA,oBAAe;IAACS;CAAY"}

package/presentation/envConfig/useEnvConfig.js

@@ -1,13 +1,9 @@
 import { useFeature } from "../../shared/di/useFeature.js";
 import { EnvConfigFeature } from "../../features/envConfig/feature.js";
-
-/**
- * Returns the EnvConfig instance from DI.
- * Useful when you want to access EnvConfig inside components and hooks.
- */
-export function useEnvConfig() {
-  const envConfig = useFeature(EnvConfigFeature);
-  return envConfig.getAll();
+function useEnvConfig() {
+    const envConfig = useFeature(EnvConfigFeature);
+    return envConfig.getAll();
 }
+export { useEnvConfig };
 
 //# sourceMappingURL=useEnvConfig.js.map

package/presentation/envConfig/useEnvConfig.js.map

@@ -1 +1 @@
-{"version":3,"names":["useFeature","EnvConfigFeature","useEnvConfig","envConfig","getAll"],"sources":["useEnvConfig.ts"],"sourcesContent":["import { useFeature } from \"~/shared/di/useFeature.js\";\nimport { EnvConfig } from \"~/features/envConfig/index.js\";\nimport { EnvConfigFeature } from \"~/features/envConfig/feature.js\";\n\n/**\n * Returns the EnvConfig instance from DI.\n * Useful when you want to access EnvConfig inside components and hooks.\n */\nexport function useEnvConfig(): EnvConfig.Config {\n    const envConfig = useFeature(EnvConfigFeature);\n\n    return envConfig.getAll();\n}\n"],"mappings":"AAAA,SAASA,UAAU;AAEnB,SAASC,gBAAgB;;AAEzB;AACA;AACA;AACA;AACA,OAAO,SAASC,YAAYA,CAAA,EAAqB;EAC7C,MAAMC,SAAS,GAAGH,UAAU,CAACC,gBAAgB,CAAC;EAE9C,OAAOE,SAAS,CAACC,MAAM,CAAC,CAAC;AAC7B","ignoreList":[]}
+{"version":3,"file":"presentation/envConfig/useEnvConfig.js","sources":["../../../src/presentation/envConfig/useEnvConfig.ts"],"sourcesContent":["import { useFeature } from \"~/shared/di/useFeature.js\";\nimport { EnvConfig } from \"~/features/envConfig/index.js\";\nimport { EnvConfigFeature } from \"~/features/envConfig/feature.js\";\n\n/**\n * Returns the EnvConfig instance from DI.\n * Useful when you want to access EnvConfig inside components and hooks.\n */\nexport function useEnvConfig(): EnvConfig.Config {\n    const envConfig = useFeature(EnvConfigFeature);\n\n    return envConfig.getAll();\n}\n"],"names":["useEnvConfig","envConfig","useFeature","EnvConfigFeature"],"mappings":";;AAQO,SAASA;IACZ,MAAMC,YAAYC,WAAWC;IAE7B,OAAOF,UAAU,MAAM;AAC3B"}

package/presentation/localStorage/index.js

@@ -1,5 +1,3 @@
 export { useLocalStorage } from "./useLocalStorage.js";
 export { useLocalStorageValue } from "./useLocalStorageValue.js";
 export { useLocalStorageValues } from "./useLocalStorageValues.js";
-
-//# sourceMappingURL=index.js.map

package/presentation/localStorage/useLocalStorage.js

@@ -1,21 +1,15 @@
 import { LocalStorageFeature } from "../../features/localStorage/feature.js";
 import { useFeature } from "../../shared/di/useFeature.js";
-
-/**
- * Returns the LocalStorage instance from DI.
- * Useful when you want to call service methods imperatively inside components.
- */
-export function useLocalStorage() {
-  const {
-    localStorageService
-  } = useFeature(LocalStorageFeature);
-  return {
-    get: localStorageService.get.bind(localStorageService),
-    set: localStorageService.set.bind(localStorageService),
-    remove: localStorageService.remove.bind(localStorageService),
-    clear: localStorageService.clear.bind(localStorageService),
-    keys: localStorageService.keys.bind(localStorageService)
-  };
+function useLocalStorage() {
+    const { localStorageService } = useFeature(LocalStorageFeature);
+    return {
+        get: localStorageService.get.bind(localStorageService),
+        set: localStorageService.set.bind(localStorageService),
+        remove: localStorageService.remove.bind(localStorageService),
+        clear: localStorageService.clear.bind(localStorageService),
+        keys: localStorageService.keys.bind(localStorageService)
+    };
 }
+export { useLocalStorage };
 
 //# sourceMappingURL=useLocalStorage.js.map

package/presentation/localStorage/useLocalStorage.js.map

@@ -1 +1 @@
-{"version":3,"names":["LocalStorageFeature","useFeature","useLocalStorage","localStorageService","get","bind","set","remove","clear","keys"],"sources":["useLocalStorage.ts"],"sourcesContent":["import { LocalStorageFeature } from \"~/features/localStorage/feature.js\";\nimport { LocalStorage } from \"~/features/localStorage/index.js\";\nimport { useFeature } from \"~/shared/di/useFeature.js\";\n\n/**\n * Returns the LocalStorage instance from DI.\n * Useful when you want to call service methods imperatively inside components.\n */\nexport function useLocalStorage(): LocalStorage.Interface {\n    const { localStorageService } = useFeature(LocalStorageFeature);\n\n    return {\n        get: localStorageService.get.bind(localStorageService),\n        set: localStorageService.set.bind(localStorageService),\n        remove: localStorageService.remove.bind(localStorageService),\n        clear: localStorageService.clear.bind(localStorageService),\n        keys: localStorageService.keys.bind(localStorageService)\n    };\n}\n"],"mappings":"AAAA,SAASA,mBAAmB;AAE5B,SAASC,UAAU;;AAEnB;AACA;AACA;AACA;AACA,OAAO,SAASC,eAAeA,CAAA,EAA2B;EACtD,MAAM;IAAEC;EAAoB,CAAC,GAAGF,UAAU,CAACD,mBAAmB,CAAC;EAE/D,OAAO;IACHI,GAAG,EAAED,mBAAmB,CAACC,GAAG,CAACC,IAAI,CAACF,mBAAmB,CAAC;IACtDG,GAAG,EAAEH,mBAAmB,CAACG,GAAG,CAACD,IAAI,CAACF,mBAAmB,CAAC;IACtDI,MAAM,EAAEJ,mBAAmB,CAACI,MAAM,CAACF,IAAI,CAACF,mBAAmB,CAAC;IAC5DK,KAAK,EAAEL,mBAAmB,CAACK,KAAK,CAACH,IAAI,CAACF,mBAAmB,CAAC;IAC1DM,IAAI,EAAEN,mBAAmB,CAACM,IAAI,CAACJ,IAAI,CAACF,mBAAmB;EAC3D,CAAC;AACL","ignoreList":[]}
+{"version":3,"file":"presentation/localStorage/useLocalStorage.js","sources":["../../../src/presentation/localStorage/useLocalStorage.ts"],"sourcesContent":["import { LocalStorageFeature } from \"~/features/localStorage/feature.js\";\nimport { LocalStorage } from \"~/features/localStorage/index.js\";\nimport { useFeature } from \"~/shared/di/useFeature.js\";\n\n/**\n * Returns the LocalStorage instance from DI.\n * Useful when you want to call service methods imperatively inside components.\n */\nexport function useLocalStorage(): LocalStorage.Interface {\n    const { localStorageService } = useFeature(LocalStorageFeature);\n\n    return {\n        get: localStorageService.get.bind(localStorageService),\n        set: localStorageService.set.bind(localStorageService),\n        remove: localStorageService.remove.bind(localStorageService),\n        clear: localStorageService.clear.bind(localStorageService),\n        keys: localStorageService.keys.bind(localStorageService)\n    };\n}\n"],"names":["useLocalStorage","localStorageService","useFeature","LocalStorageFeature"],"mappings":";;AAQO,SAASA;IACZ,MAAM,EAAEC,mBAAmB,EAAE,GAAGC,WAAWC;IAE3C,OAAO;QACH,KAAKF,oBAAoB,GAAG,CAAC,IAAI,CAACA;QAClC,KAAKA,oBAAoB,GAAG,CAAC,IAAI,CAACA;QAClC,QAAQA,oBAAoB,MAAM,CAAC,IAAI,CAACA;QACxC,OAAOA,oBAAoB,KAAK,CAAC,IAAI,CAACA;QACtC,MAAMA,oBAAoB,IAAI,CAAC,IAAI,CAACA;IACxC;AACJ"}

package/presentation/localStorage/useLocalStorageValue.js

@@ -2,19 +2,21 @@ import { useEffect, useState } from "react";
 import { autorun } from "mobx";
 import { LocalStorageFeature } from "../../features/localStorage/feature.js";
 import { useFeature } from "../../shared/di/useFeature.js";
-export function useLocalStorageValue(key) {
-  const {
-    localStorageService
-  } = useFeature(LocalStorageFeature);
-  const [value, setValue] = useState(() => localStorageService.get(key));
-  useEffect(() => {
-    const dispose = autorun(() => {
-      const value = localStorageService.get(key);
-      setValue(value);
-    });
-    return () => dispose();
-  }, [localStorageService, key]);
-  return value;
+function useLocalStorageValue(key) {
+    const { localStorageService } = useFeature(LocalStorageFeature);
+    const [value, setValue] = useState(()=>localStorageService.get(key));
+    useEffect(()=>{
+        const dispose = autorun(()=>{
+            const value = localStorageService.get(key);
+            setValue(value);
+        });
+        return ()=>dispose();
+    }, [
+        localStorageService,
+        key
+    ]);
+    return value;
 }
+export { useLocalStorageValue };
 
 //# sourceMappingURL=useLocalStorageValue.js.map

package/presentation/localStorage/useLocalStorageValue.js.map

@@ -1 +1 @@
-{"version":3,"names":["useEffect","useState","autorun","LocalStorageFeature","useFeature","useLocalStorageValue","key","localStorageService","value","setValue","get","dispose"],"sources":["useLocalStorageValue.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { autorun } from \"mobx\";\nimport { LocalStorageFeature } from \"~/features/localStorage/feature.js\";\nimport { useFeature } from \"~/shared/di/useFeature.js\";\n\nexport function useLocalStorageValue<T = string>(key: string): T | undefined {\n    const { localStorageService } = useFeature(LocalStorageFeature);\n\n    const [value, setValue] = useState<T | undefined>(() => localStorageService.get<T>(key));\n\n    useEffect(() => {\n        const dispose = autorun(() => {\n            const value = localStorageService.get<T>(key);\n            setValue(value);\n        });\n        return () => dispose();\n    }, [localStorageService, key]);\n\n    return value;\n}\n"],"mappings":"AAAA,SAASA,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAC3C,SAASC,OAAO,QAAQ,MAAM;AAC9B,SAASC,mBAAmB;AAC5B,SAASC,UAAU;AAEnB,OAAO,SAASC,oBAAoBA,CAAaC,GAAW,EAAiB;EACzE,MAAM;IAAEC;EAAoB,CAAC,GAAGH,UAAU,CAACD,mBAAmB,CAAC;EAE/D,MAAM,CAACK,KAAK,EAAEC,QAAQ,CAAC,GAAGR,QAAQ,CAAgB,MAAMM,mBAAmB,CAACG,GAAG,CAAIJ,GAAG,CAAC,CAAC;EAExFN,SAAS,CAAC,MAAM;IACZ,MAAMW,OAAO,GAAGT,OAAO,CAAC,MAAM;MAC1B,MAAMM,KAAK,GAAGD,mBAAmB,CAACG,GAAG,CAAIJ,GAAG,CAAC;MAC7CG,QAAQ,CAACD,KAAK,CAAC;IACnB,CAAC,CAAC;IACF,OAAO,MAAMG,OAAO,CAAC,CAAC;EAC1B,CAAC,EAAE,CAACJ,mBAAmB,EAAED,GAAG,CAAC,CAAC;EAE9B,OAAOE,KAAK;AAChB","ignoreList":[]}
+{"version":3,"file":"presentation/localStorage/useLocalStorageValue.js","sources":["../../../src/presentation/localStorage/useLocalStorageValue.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { autorun } from \"mobx\";\nimport { LocalStorageFeature } from \"~/features/localStorage/feature.js\";\nimport { useFeature } from \"~/shared/di/useFeature.js\";\n\nexport function useLocalStorageValue<T = string>(key: string): T | undefined {\n    const { localStorageService } = useFeature(LocalStorageFeature);\n\n    const [value, setValue] = useState<T | undefined>(() => localStorageService.get<T>(key));\n\n    useEffect(() => {\n        const dispose = autorun(() => {\n            const value = localStorageService.get<T>(key);\n            setValue(value);\n        });\n        return () => dispose();\n    }, [localStorageService, key]);\n\n    return value;\n}\n"],"names":["useLocalStorageValue","key","localStorageService","useFeature","LocalStorageFeature","value","setValue","useState","useEffect","dispose","autorun"],"mappings":";;;;AAKO,SAASA,qBAAiCC,GAAW;IACxD,MAAM,EAAEC,mBAAmB,EAAE,GAAGC,WAAWC;IAE3C,MAAM,CAACC,OAAOC,SAAS,GAAGC,SAAwB,IAAML,oBAAoB,GAAG,CAAID;IAEnFO,UAAU;QACN,MAAMC,UAAUC,QAAQ;YACpB,MAAML,QAAQH,oBAAoB,GAAG,CAAID;YACzCK,SAASD;QACb;QACA,OAAO,IAAMI;IACjB,GAAG;QAACP;QAAqBD;KAAI;IAE7B,OAAOI;AACX"}