@pack/react 0.1.1 → 0.1.3

package/dist/index.d.ts

@@ -1,9 +1,9 @@
-import { RenderSections } from "./render-sections";
+import { RenderSections, useSections } from "./render-sections";
 import { PreviewProvider } from "./preview/preview-provider";
 import { usePreviewContext } from "./preview/preview-content";
 import { useSiteSettings } from "./use-site-settings";
 import { useOverlayScript } from "./use-overlay-script";
 import { registerSection } from "./register-section";
 import { registerStorefrontSettingsSchema } from "./register-storefront-settings-schema";
-export { registerSection, registerStorefrontSettingsSchema, usePreviewContext, useSiteSettings, useOverlayScript, PreviewProvider, RenderSections, };
+export { registerSection, registerStorefrontSettingsSchema, usePreviewContext, useSiteSettings, useOverlayScript, PreviewProvider, RenderSections, useSections, };
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAC7D,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,gCAAgC,EAAE,MAAM,uCAAuC,CAAC;AAEzF,OAAO,EACL,eAAe,EACf,gCAAgC,EAChC,iBAAiB,EACjB,eAAe,EACf,gBAAgB,EAChB,eAAe,EACf,cAAc,GACf,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChE,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAC7D,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,gCAAgC,EAAE,MAAM,uCAAuC,CAAC;AAEzF,OAAO,EACL,eAAe,EACf,gCAAgC,EAChC,iBAAiB,EACjB,eAAe,EACf,gBAAgB,EAChB,eAAe,EACf,cAAc,EACd,WAAW,GACZ,CAAC"}

package/dist/index.js

@@ -1,8 +1,8 @@
-import { RenderSections } from "./render-sections";
+import { RenderSections, useSections } from "./render-sections";
 import { PreviewProvider } from "./preview/preview-provider";
 import { usePreviewContext } from "./preview/preview-content";
 import { useSiteSettings } from "./use-site-settings";
 import { useOverlayScript } from "./use-overlay-script";
 import { registerSection } from "./register-section";
 import { registerStorefrontSettingsSchema } from "./register-storefront-settings-schema";
-export { registerSection, registerStorefrontSettingsSchema, usePreviewContext, useSiteSettings, useOverlayScript, PreviewProvider, RenderSections, };
+export { registerSection, registerStorefrontSettingsSchema, usePreviewContext, useSiteSettings, useOverlayScript, PreviewProvider, RenderSections, useSections, };

package/dist/preview/pack-analytics.d.ts

@@ -0,0 +1,16 @@
+export type BrowserData = {
+    userAgent: string;
+    pathname: string;
+    query: string;
+    screen: string;
+    referrer: string;
+    hostname: string;
+    language: string;
+    locale: string;
+    userTimeZone: string;
+    connection: string;
+    deviceCategory: string;
+    href: string;
+};
+export declare function usePackTrack(): void;
+//# sourceMappingURL=pack-analytics.d.ts.map

package/dist/preview/pack-analytics.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pack-analytics.d.ts","sourceRoot":"","sources":["../../src/preview/pack-analytics.tsx"],"names":[],"mappings":"AAEA,MAAM,MAAM,WAAW,GAAG;IACxB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,cAAc,EAAE,MAAM,CAAC;IACvB,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAiDF,wBAAgB,YAAY,SA0B3B"}

package/dist/preview/pack-analytics.js

@@ -0,0 +1,65 @@
+import { useEffect, useState } from "react";
+function getBrowserData() {
+    let userTimeZone;
+    let userLocale;
+    try {
+        userTimeZone = Intl.DateTimeFormat().resolvedOptions().timeZone;
+        userLocale =
+            navigator.languages && navigator.languages.length
+                ? navigator.languages[0]
+                : navigator.userLanguage ||
+                    navigator.language ||
+                    navigator.browserLanguage ||
+                    "unknown";
+    }
+    catch (error) { }
+    const connection = navigator.connection ||
+        navigator.mozConnection ||
+        navigator.webkitConnection;
+    const minWidth = 768;
+    // prettier-ignore
+    const hasTouchSupport = 'ontouchstart' in window || navigator.maxTouchPoints > 0;
+    let deviceCategory = "desktop";
+    if (hasTouchSupport) {
+        const hasSmallScreen = window.screen.width < minWidth;
+        deviceCategory = hasSmallScreen ? "mobile" : "tablet";
+    }
+    return {
+        userAgent: window.navigator.userAgent,
+        pathname: window.location.pathname,
+        query: window.location.search,
+        screen: `${window.screen.width}x${window.screen.height}`,
+        referrer: document.referrer,
+        hostname: window.location.hostname,
+        language: navigator.language,
+        locale: userLocale,
+        userTimeZone: userTimeZone || "unknown",
+        connection: connection?.effectiveType || "unknown",
+        deviceCategory,
+        href: window.location.href,
+    };
+}
+export function usePackTrack() {
+    const [pathname, setPathname] = useState();
+    const analytics = async () => {
+        const browserData = getBrowserData();
+        if (pathname === browserData.pathname)
+            return;
+        setPathname(browserData.pathname);
+        try {
+            await fetch("/pack/track", {
+                method: "POST",
+                headers: {
+                    "Content-Type": "application/json",
+                },
+                body: JSON.stringify(getBrowserData()),
+            });
+        }
+        catch (error) {
+            console.error("Error hit /pack/track: ", error.message);
+        }
+    };
+    useEffect(() => {
+        analytics();
+    }, [analytics]);
+}

package/dist/preview/preview-provider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"preview-provider.d.ts","sourceRoot":"","sources":["../../src/preview/preview-provider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAInD,UAAU,mBAAmB;IAC3B,QAAQ,EAAE,SAAS,CAAC;IACpB,YAAY,EAAE,GAAG,CAAC;IAClB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,cAAc,CAAC,EAAE;QACf,OAAO,CAAC,EAAE;YACR,GAAG,CAAC,EAAE,MAAM,CAAC;YACb,OAAO,CAAC,EAAE,MAAM,CAAC;SAClB,CAAC;QACF,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;KACpB,CAAC;CACH;AAED,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,oBAAoB,EACpB,YAAY,EACZ,cAAc,GACf,EAAE,mBAAmB,qBAmBrB"}
+{"version":3,"file":"preview-provider.d.ts","sourceRoot":"","sources":["../../src/preview/preview-provider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAKnD,UAAU,mBAAmB;IAC3B,QAAQ,EAAE,SAAS,CAAC;IACpB,YAAY,EAAE,GAAG,CAAC;IAClB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,cAAc,CAAC,EAAE;QACf,OAAO,CAAC,EAAE;YACR,GAAG,CAAC,EAAE,MAAM,CAAC;YACb,OAAO,CAAC,EAAE,MAAM,CAAC;SAClB,CAAC;QACF,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;KACpB,CAAC;CACH;AAED,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,oBAAoB,EACpB,YAAY,EACZ,cAAc,GACf,EAAE,mBAAmB,qBAqBrB"}

package/dist/preview/preview-provider.js

@@ -1,8 +1,10 @@
 import React, { useState } from "react";
+import { usePackTrack } from "./pack-analytics";
 import { PreviewContext } from "./preview-content";
 import { PreviewToast } from "./preview-toast";
 export function PreviewProvider({ children, isPreviewModeEnabled, siteSettings, customizerMeta, }) {
     const [previewStorefrontSettings, setPreviewStorefrontSettings] = useState();
+    usePackTrack();
     return (React.createElement(PreviewContext.Provider, { value: {
             isPreview: !!isPreviewModeEnabled,
             previewStorefrontSettings,

package/dist/render-sections.d.ts

@@ -1,3 +1,4 @@
 import React from "react";
+export declare function useSections({ content }: any): any;
 export declare function RenderSections({ content }: any): React.JSX.Element | null;
 //# sourceMappingURL=render-sections.d.ts.map

package/dist/render-sections.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"render-sections.d.ts","sourceRoot":"","sources":["../src/render-sections.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6B,MAAM,OAAO,CAAC;AAoClD,wBAAgB,cAAc,CAAC,EAAE,OAAO,EAAE,EAAE,GAAG,4BAiC9C"}
+{"version":3,"file":"render-sections.d.ts","sourceRoot":"","sources":["../src/render-sections.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6B,MAAM,OAAO,CAAC;AAuElD,wBAAgB,WAAW,CAAC,EAAE,OAAO,EAAE,EAAE,GAAG,OAM3C;AAED,wBAAgB,cAAc,CAAC,EAAE,OAAO,EAAE,EAAE,GAAG,4BAI9C"}

package/dist/render-sections.js

@@ -25,7 +25,7 @@ function Sections({ sections }) {
     }, [sections]);
     return React.createElement(React.Fragment, null, renderedSections);
 }
-export function RenderSections({ content }) {
+function useRenderSections({ content }) {
     const { isPreview, setPreviewStorefrontSettings, customizerMeta } = usePreviewContext();
     const { content: liveContent, storefrontSettings } = useCustomizerShell({
         environment: "production",
@@ -49,6 +49,19 @@ export function RenderSections({ content }) {
     const sections = useMemo(() => {
         return liveContent?.sections?.nodes || liveContent?.sections;
     }, [liveContent?.sections]);
+    return {
+        sections,
+    };
+}
+export function useSections({ content }) {
+    const { sections } = useRenderSections({ content });
+    if (!sections)
+        return null;
+    const visibleSections = Sections({ sections });
+    return visibleSections?.props?.children || null;
+}
+export function RenderSections({ content }) {
+    const { sections } = useRenderSections({ content });
     if (!sections)
         return null;
     return React.createElement(Sections, { sections: sections });

package/dist/use-overlay-script.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-overlay-script.d.ts","sourceRoot":"","sources":["../src/use-overlay-script.ts"],"names":[],"mappings":"AAEA,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,MAAM;QACd,IAAI,CAAC,EAAE;YACL,uBAAuB,EAAE,OAAO,CAAC;SAClC,CAAC;KACH;CACF;AAED,eAAO,MAAM,gBAAgB,4BAG1B;IACD,SAAS,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE;QAAE,GAAG,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CAC7C,SAkBA,CAAC"}
+{"version":3,"file":"use-overlay-script.d.ts","sourceRoot":"","sources":["../src/use-overlay-script.ts"],"names":[],"mappings":"AAEA,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,MAAM;QACd,IAAI,CAAC,EAAE;YACL,uBAAuB,EAAE,OAAO,CAAC;SAClC,CAAC;KACH;CACF;AAED,eAAO,MAAM,gBAAgB;eAIhB,OAAO;aACT;QAAE,GAAG,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE;UAmB5C,CAAC"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pack/react",
   "description": "React",
-  "version": "0.1.1",
+  "version": "0.1.3",
   "exports": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "engines": {