@gem-sdk/pages 1.0.0

package/dist/esm/libs/api/get-home-page-props.js

@@ -0,0 +1,133 @@
+import { PublishedThemePagesDocument, StorePropertyDocument, prefetchQueries } from '@gem-sdk/core';
+import { ShopMetaDocument } from '@gem-sdk/adapter-shopify';
+import { getFontFromGlobalStyle } from '../google-fonts.js';
+import { genCSS } from '../helpers/gen-css.js';
+import { generateManifest } from '../helpers/generate-manifres.js';
+import { parseBuilderTemplate } from '../helpers/normalize.js';
+import { parseJson, serializableJson } from '../helpers/parse-json.js';
+
+const getHomePageProps = (fetcher, shopifyFetcher) => async () => {
+    const pageType = 'STATIC';
+    const variables = {
+        slugType: pageType,
+    };
+    // const theme = await fetcher<PublishedThemePagesQueryResponse, PublishedThemePagesQueryVariables>([
+    //   PublishedThemePagesDocument,
+    //   variables,
+    // ]);
+    const [theme, storeProperty, shopifyMeta] = await Promise.allSettled([
+        fetcher([
+            PublishedThemePagesDocument,
+            variables,
+        ]),
+        fetcher([StorePropertyDocument]),
+        shopifyFetcher([ShopMetaDocument]),
+    ]);
+    if (theme.status === 'rejected') {
+        return {
+            pageType,
+        };
+    }
+    const dataBuilder = theme.value.publishedThemePages?.[0];
+    const homeTemplate = parseBuilderTemplate(dataBuilder);
+    const fontStyle = await getFontFromGlobalStyle(dataBuilder?.pageStyle?.data);
+    const queries = prefetchQueries(homeTemplate);
+    const datas = await Promise.allSettled(queries.map(({ query, variables, func }) => {
+        if (func) {
+            return func(fetcher, variables);
+        }
+        if (query)
+            return fetcher([query, variables]);
+        return {};
+    }));
+    const fallback = queries.reduce((acc, { key }, index) => {
+        const res = datas[index];
+        if (res?.status === 'fulfilled') {
+            return {
+                ...acc,
+                [key]: res.value,
+            };
+        }
+        return acc;
+    }, {});
+    const description = dataBuilder?.themePageDataSEO?.find((item) => item?.key === 'global-meta-description')?.value;
+    const thumbnail = parseJson(dataBuilder?.themePageDataSEO?.find((item) => item?.key === 'global-meta-thumbnail')?.value);
+    const shopMeta = shopifyMeta.status === 'fulfilled' ? shopifyMeta.value : undefined;
+    const shopData = storeProperty.status === 'fulfilled' ? storeProperty.value : undefined;
+    const favicon = shopData?.storeProperty?.favicon ?? '/favicon/favicon-32x32.png';
+    const seo = {
+        defaultTitle: shopMeta?.shop.name,
+        title: dataBuilder?.name ?? 'Home',
+        description: description ?? shopMeta?.shop.description,
+        openGraph: {
+            site_name: shopMeta?.shop.name,
+            locale: shopMeta?.localization.country.isoCode,
+            title: dataBuilder?.name ?? shopMeta?.shop.name,
+            description: description ?? shopMeta?.shop.description,
+            images: thumbnail ? [thumbnail] : [],
+        },
+        additionalMetaTags: [
+            {
+                name: 'theme-color',
+                content: '#000000',
+            },
+        ],
+        canonical: '/',
+        additionalLinkTags: [
+            {
+                rel: 'icon',
+                sizes: '32x32',
+                href: `${favicon}-/crop/1:1/center/-/smart_resize/32x32/`,
+            },
+            {
+                rel: 'icon',
+                sizes: '16x16',
+                href: `${favicon}-/crop/1:1/center/-/smart_resize/16x16/`,
+            },
+            {
+                rel: 'apple-touch-icon',
+                sizes: '180x180',
+                href: `${favicon}-/crop/1:1/center/-/smart_resize/180x180/`,
+            },
+            {
+                rel: 'manifest',
+                href: generateManifest({
+                    theme_color: '#000000',
+                    background_color: '#ffffff',
+                    display: 'standalone',
+                    scope: '/',
+                    start_url: '/',
+                    name: shopMeta?.shop.name,
+                    short_name: shopMeta?.shop.name,
+                    description: shopMeta?.shop.description,
+                    icons: [
+                        {
+                            src: `${favicon}-/crop/1:1/center/-/smart_resize/192x192/`,
+                            sizes: '192x192',
+                            type: 'image/png',
+                            purpose: 'any maskable',
+                        },
+                        {
+                            src: `${favicon}-/crop/1:1/center/-/smart_resize/512x512/`,
+                            sizes: '512x512',
+                            type: 'image/png',
+                        },
+                    ],
+                }),
+            },
+        ],
+    };
+    return serializableJson({
+        themeStyle: genCSS(dataBuilder?.pageStyle?.data),
+        fontStyle,
+        builderData: homeTemplate,
+        pageType,
+        swr: { fallback },
+        currency: shopMeta?.localization.country.currency.isoCode ?? null,
+        locale: shopMeta?.localization.country.isoCode ?? null,
+        swatches: parseJson(shopData?.storeProperty?.swatchesConfig),
+        seo,
+    });
+};
+
+export { getHomePageProps };

package/dist/esm/libs/api/get-preview-props.js

@@ -0,0 +1,16 @@
+import { getCollectionProps } from './get-collection-props.js';
+import { getProductProps } from './get-product-props.js';
+import { getStaticPageProps } from './get-static-page-props.js';
+
+const getPreviewProps = (fetcher, shopifyFetcher) => async (pageType, slug) => {
+    switch (pageType) {
+        case 'COLLECTION':
+            return getCollectionProps(fetcher)(slug);
+        case 'PRODUCT':
+            return getProductProps(fetcher)(slug);
+        default:
+            return getStaticPageProps(fetcher, shopifyFetcher)(slug);
+    }
+};
+
+export { getPreviewProps };

package/dist/esm/libs/api/get-product-props.js

@@ -0,0 +1,69 @@
+import { getProductBySlug, PublishedThemePagesDocument, prefetchQueries } from '@gem-sdk/core';
+import { genCSS } from '../helpers/gen-css.js';
+import { parseBuilderTemplate } from '../helpers/normalize.js';
+import { serializableJson } from '../helpers/parse-json.js';
+
+const getProductProps = (fetcher) => async (handle) => {
+    const pageType = 'PRODUCT';
+    const variables = {
+        slug: handle,
+        slugType: pageType,
+    };
+    const [product, theme] = await Promise.all([
+        getProductBySlug(fetcher, handle),
+        fetcher([
+            PublishedThemePagesDocument,
+            variables,
+        ]),
+    ]);
+    const dataBuilder = theme.publishedThemePages?.[0];
+    if (!product || !dataBuilder) {
+        throw new Error('Product not found');
+    }
+    const productTemplate = parseBuilderTemplate(dataBuilder);
+    const queries = prefetchQueries(productTemplate);
+    const datas = await Promise.allSettled(queries.map(({ query, variables, func }) => {
+        if (func) {
+            return func(fetcher, variables);
+        }
+        if (query)
+            return fetcher([query, variables]);
+        return {};
+    }));
+    const fallback = queries.reduce((acc, { key }, index) => {
+        const res = datas[index];
+        if (res?.status === 'fulfilled') {
+            return {
+                ...acc,
+                [key]: res.value,
+            };
+        }
+        return acc;
+    }, {});
+    return serializableJson({
+        builderData: productTemplate,
+        themeStyle: genCSS(dataBuilder.pageStyle?.data),
+        pageType,
+        swr: { fallback },
+        seo: {
+            title: product.title,
+            description: product.description,
+            openGraph: {
+                images: product.featuredImage?.src
+                    ? [
+                        {
+                            url: product.featuredImage.src,
+                            alt: product.featuredImage?.alt,
+                            height: product.featuredImage?.height,
+                            width: product.featuredImage?.width,
+                            type: product.featuredImage?.contentType,
+                        },
+                    ]
+                    : [],
+            },
+        },
+        product,
+    });
+};
+
+export { getProductProps };

package/dist/esm/libs/api/get-static-page-props-preview.js

@@ -0,0 +1,131 @@
+import { PreviewPageDocument, StorePropertyDocument } from '@gem-sdk/core';
+import { ShopMetaDocument } from '@gem-sdk/adapter-shopify';
+import { captureException } from '@sentry/nextjs';
+import { getFontFromGlobalStyle } from '../google-fonts.js';
+import { genCSS } from '../helpers/gen-css.js';
+import { generateManifest } from '../helpers/generate-manifres.js';
+import { getFallbackV2 } from '../helpers/get-fallback.js';
+import { parseBuilderTemplateV2 } from '../helpers/normalize.js';
+import { parseJson, serializableJson } from '../helpers/parse-json.js';
+
+const getStaticPagePropsPreview = (fetcher, shopifyFetcher) => async (slug) => {
+    try {
+        const pageType = 'STATIC';
+        const variables = {
+            handleURL: slug,
+            pageType,
+        };
+        const [theme, storeProperty, shopifyMeta] = await Promise.allSettled([
+            fetcher([
+                PreviewPageDocument,
+                variables,
+                'previewPage',
+            ]),
+            fetcher([StorePropertyDocument]),
+            shopifyFetcher([ShopMetaDocument]),
+        ]);
+        if (theme.status === 'rejected') {
+            throw new Error(theme.reason?.[0]);
+        }
+        const dataBuilder = theme.value.previewPage;
+        if (!dataBuilder) {
+            throw new Error(`No data builder found for slug: /preview/${slug}`);
+        }
+        const pageTemplate = parseBuilderTemplateV2(dataBuilder);
+        const [fontStyle, fallback] = await Promise.all([
+            getFontFromGlobalStyle(dataBuilder?.pageStyle?.data),
+            getFallbackV2(fetcher, pageTemplate),
+        ]);
+        const mobileOnly = dataBuilder.isMobile ?? false;
+        const description = dataBuilder?.themePageDataSEO?.find((item) => item?.key === 'global-meta-description')?.value;
+        const thumbnail = parseJson(dataBuilder?.themePageDataSEO?.find((item) => item?.key === 'global-meta-thumbnail')?.value);
+        const shopMeta = shopifyMeta.status === 'fulfilled' ? shopifyMeta.value : undefined;
+        const shopData = storeProperty.status === 'fulfilled' ? storeProperty.value : undefined;
+        const favicon = shopData?.storeProperty?.favicon ?? '/favicon/favicon-32x32.png';
+        const seo = {
+            defaultTitle: shopMeta?.shop.name,
+            title: dataBuilder?.name,
+            description: description ?? shopMeta?.shop.description,
+            openGraph: {
+                site_name: shopMeta?.shop.name,
+                locale: shopMeta?.localization.country.isoCode,
+                title: dataBuilder?.name ?? shopMeta?.shop.name,
+                description: description ?? shopMeta?.shop.description,
+                images: thumbnail ? [thumbnail] : [],
+            },
+            nofollow: true,
+            noindex: true,
+            canonical: `/preview/${slug}`,
+            additionalMetaTags: [
+                {
+                    name: 'theme-color',
+                    content: '#000000',
+                },
+            ],
+            additionalLinkTags: [
+                {
+                    rel: 'icon',
+                    sizes: '32x32',
+                    href: `${favicon}-/crop/1:1/center/-/smart_resize/32x32/`,
+                },
+                {
+                    rel: 'icon',
+                    sizes: '16x16',
+                    href: `${favicon}-/crop/1:1/center/-/smart_resize/16x16/`,
+                },
+                {
+                    rel: 'apple-touch-icon',
+                    sizes: '180x180',
+                    href: `${favicon}-/crop/1:1/center/-/smart_resize/180x180/`,
+                },
+                {
+                    rel: 'manifest',
+                    href: generateManifest({
+                        theme_color: '#000000',
+                        background_color: '#ffffff',
+                        display: 'standalone',
+                        scope: '/',
+                        start_url: '/',
+                        name: shopMeta?.shop.name,
+                        short_name: shopMeta?.shop.name,
+                        description: shopMeta?.shop.description,
+                        icons: [
+                            {
+                                src: `${favicon}-/crop/1:1/center/-/smart_resize/192x192/`,
+                                sizes: '192x192',
+                                type: 'image/png',
+                                purpose: 'any maskable',
+                            },
+                            {
+                                src: `${favicon}-/crop/1:1/center/-/smart_resize/512x512/`,
+                                sizes: '512x512',
+                                type: 'image/png',
+                            },
+                        ],
+                    }),
+                },
+            ],
+        };
+        return serializableJson({
+            themeStyle: genCSS(dataBuilder?.pageStyle?.data, mobileOnly),
+            fontStyle,
+            builderData: pageTemplate,
+            pageType,
+            currency: shopMeta?.localization.country.currency.isoCode ?? null,
+            locale: shopMeta?.localization.country.isoCode ?? null,
+            swr: { fallback },
+            swatches: parseJson(shopData?.storeProperty?.swatchesConfig),
+            seo,
+            mobileOnly,
+            gaTrackingId: dataBuilder.themePageAnalytic?.gaTrackingID ?? null,
+            facebookPixelId: dataBuilder.themePageAnalytic?.fbPixelID ?? null,
+            tiktokPixelId: dataBuilder.themePageAnalytic?.tiktokPixelID ?? null,
+        });
+    }
+    catch (err) {
+        captureException(err);
+        throw err;
+    }
+};
+
+export { getStaticPagePropsPreview };

package/dist/esm/libs/api/get-static-page-props-v2.js

@@ -0,0 +1,128 @@
+import { PublishedThemePagesDocument, StorePropertyDocument } from '@gem-sdk/core';
+import { ShopMetaDocument } from '@gem-sdk/adapter-shopify';
+import { getFontFromGlobalStyle } from '../google-fonts.js';
+import { genCSS } from '../helpers/gen-css.js';
+import { generateManifest } from '../helpers/generate-manifres.js';
+import { getFallbackV2 } from '../helpers/get-fallback.js';
+import { parseBuilderTemplateV2 } from '../helpers/normalize.js';
+import { parseJson, serializableJson } from '../helpers/parse-json.js';
+import { captureException } from '@sentry/nextjs';
+
+const getStaticPagePropsV2 = (fetcher, shopifyFetcher) => async (slug) => {
+    try {
+        const pageType = 'STATIC';
+        const variables = {
+            slug,
+            slugType: pageType,
+        };
+        const [theme, storeProperty, shopifyMeta] = await Promise.allSettled([
+            fetcher([
+                PublishedThemePagesDocument,
+                variables,
+            ]),
+            fetcher([StorePropertyDocument]),
+            shopifyFetcher([ShopMetaDocument]),
+        ]);
+        if (theme.status === 'rejected') {
+            throw new Error(theme.reason?.[0]);
+        }
+        const dataBuilder = theme.value.publishedThemePages?.[0];
+        if (!dataBuilder) {
+            throw new Error(`No data builder found for slug: /${slug}`);
+        }
+        const pageTemplate = parseBuilderTemplateV2(dataBuilder);
+        const [fontStyle, fallback] = await Promise.all([
+            getFontFromGlobalStyle(dataBuilder?.pageStyle?.data),
+            getFallbackV2(fetcher, pageTemplate),
+        ]);
+        const mobileOnly = dataBuilder.isMobile ?? false;
+        const description = dataBuilder?.themePageDataSEO?.find((item) => item?.key === 'global-meta-description')?.value;
+        const thumbnail = parseJson(dataBuilder?.themePageDataSEO?.find((item) => item?.key === 'global-meta-thumbnail')?.value);
+        const shopMeta = shopifyMeta.status === 'fulfilled' ? shopifyMeta.value : undefined;
+        const shopData = storeProperty.status === 'fulfilled' ? storeProperty.value : undefined;
+        const favicon = shopData?.storeProperty?.favicon ?? '/favicon/favicon-32x32.png';
+        const seo = {
+            defaultTitle: shopMeta?.shop.name,
+            title: dataBuilder?.name,
+            description: description ?? shopMeta?.shop.description,
+            openGraph: {
+                site_name: shopMeta?.shop.name,
+                locale: shopMeta?.localization.country.isoCode,
+                title: dataBuilder?.name ?? shopMeta?.shop.name,
+                description: description ?? shopMeta?.shop.description,
+                images: thumbnail ? [thumbnail] : [],
+            },
+            canonical: `/${slug}`,
+            additionalMetaTags: [
+                {
+                    name: 'theme-color',
+                    content: '#000000',
+                },
+            ],
+            additionalLinkTags: [
+                {
+                    rel: 'icon',
+                    sizes: '32x32',
+                    href: `${favicon}-/crop/1:1/center/-/smart_resize/32x32/`,
+                },
+                {
+                    rel: 'icon',
+                    sizes: '16x16',
+                    href: `${favicon}-/crop/1:1/center/-/smart_resize/16x16/`,
+                },
+                {
+                    rel: 'apple-touch-icon',
+                    sizes: '180x180',
+                    href: `${favicon}-/crop/1:1/center/-/smart_resize/180x180/`,
+                },
+                {
+                    rel: 'manifest',
+                    href: generateManifest({
+                        theme_color: '#000000',
+                        background_color: '#ffffff',
+                        display: 'standalone',
+                        scope: '/',
+                        start_url: '/',
+                        name: shopMeta?.shop.name,
+                        short_name: shopMeta?.shop.name,
+                        description: shopMeta?.shop.description,
+                        icons: [
+                            {
+                                src: `${favicon}-/crop/1:1/center/-/smart_resize/192x192/`,
+                                sizes: '192x192',
+                                type: 'image/png',
+                                purpose: 'any maskable',
+                            },
+                            {
+                                src: `${favicon}-/crop/1:1/center/-/smart_resize/512x512/`,
+                                sizes: '512x512',
+                                type: 'image/png',
+                            },
+                        ],
+                    }),
+                },
+            ],
+        };
+        return serializableJson({
+            themeStyle: genCSS(dataBuilder?.pageStyle?.data, mobileOnly),
+            fontStyle,
+            builderData: pageTemplate,
+            pageType,
+            currency: shopMeta?.localization.country.currency.isoCode ?? null,
+            locale: shopMeta?.localization.country.isoCode ?? null,
+            swr: { fallback },
+            swatches: parseJson(shopData?.storeProperty?.swatchesConfig),
+            seo,
+            mobileOnly,
+            gaTrackingId: dataBuilder.themePageAnalytic?.gaTrackingID ?? null,
+            facebookPixelId: dataBuilder.themePageAnalytic?.fbPixelID ?? null,
+            tiktokPixelId: dataBuilder.themePageAnalytic?.tiktokPixelID ?? null,
+        });
+    }
+    catch (err) {
+        captureException(err);
+        throw err;
+    }
+};
+
+export { getStaticPagePropsV2 };

package/dist/esm/libs/api/get-static-page-props.js

@@ -0,0 +1,130 @@
+import { PublishedThemePagesDocument, StorePropertyDocument, prefetchQueries } from '@gem-sdk/core';
+import { ShopMetaDocument } from '@gem-sdk/adapter-shopify';
+import { getFontFromGlobalStyle } from '../google-fonts.js';
+import { genCSS } from '../helpers/gen-css.js';
+import { generateManifest } from '../helpers/generate-manifres.js';
+import { parseBuilderTemplate } from '../helpers/normalize.js';
+import { parseJson, serializableJson } from '../helpers/parse-json.js';
+
+const getStaticPageProps = (fetcher, shopifyFetcher) => async (slug) => {
+    const pageType = 'STATIC';
+    const variables = {
+        slug,
+        slugType: pageType,
+    };
+    const [theme, storeProperty, shopifyMeta] = await Promise.allSettled([
+        fetcher([
+            PublishedThemePagesDocument,
+            variables,
+        ]),
+        fetcher([StorePropertyDocument]),
+        shopifyFetcher([ShopMetaDocument]),
+    ]);
+    if (theme.status === 'rejected') {
+        return {
+            pageType,
+        };
+    }
+    const dataBuilder = theme.value.publishedThemePages?.[0];
+    const pageTemplate = parseBuilderTemplate(dataBuilder);
+    const fontStyle = await getFontFromGlobalStyle(dataBuilder?.pageStyle?.data);
+    const queries = prefetchQueries(pageTemplate);
+    const datas = await Promise.allSettled(queries.map(({ query, variables, func }) => {
+        if (func) {
+            return func(fetcher, variables);
+        }
+        if (query)
+            return fetcher([query, variables]);
+        return {};
+    }));
+    const fallback = queries.reduce((acc, { key }, index) => {
+        const res = datas[index];
+        if (res?.status === 'fulfilled') {
+            return {
+                ...acc,
+                [key]: res.value,
+            };
+        }
+        return acc;
+    }, {});
+    const description = dataBuilder?.themePageDataSEO?.find((item) => item?.key === 'global-meta-description')?.value;
+    const thumbnail = parseJson(dataBuilder?.themePageDataSEO?.find((item) => item?.key === 'global-meta-thumbnail')?.value);
+    const shopMeta = shopifyMeta.status === 'fulfilled' ? shopifyMeta.value : undefined;
+    const shopData = storeProperty.status === 'fulfilled' ? storeProperty.value : undefined;
+    const favicon = shopData?.storeProperty?.favicon ?? '/favicon/favicon-32x32.png';
+    const seo = {
+        defaultTitle: shopMeta?.shop.name ?? '',
+        title: dataBuilder?.name ?? '',
+        description: description ?? shopMeta?.shop.description ?? '',
+        openGraph: {
+            site_name: shopMeta?.shop.name ?? '',
+            locale: shopMeta?.localization.country.isoCode ?? '',
+            title: dataBuilder?.name ?? shopMeta?.shop.name ?? '',
+            description: description ?? shopMeta?.shop.description ?? '',
+            images: thumbnail ? [thumbnail] : [],
+        },
+        additionalMetaTags: [
+            {
+                name: 'theme-color',
+                content: '#000000',
+            },
+        ],
+        canonical: `/${slug}`,
+        additionalLinkTags: [
+            {
+                rel: 'icon',
+                sizes: '32x32',
+                href: `${favicon}-/crop/1:1/center/-/smart_resize/32x32/`,
+            },
+            {
+                rel: 'icon',
+                sizes: '16x16',
+                href: `${favicon}-/crop/1:1/center/-/smart_resize/16x16/`,
+            },
+            {
+                rel: 'apple-touch-icon',
+                sizes: '180x180',
+                href: `${favicon}-/crop/1:1/center/-/smart_resize/180x180/`,
+            },
+            {
+                rel: 'manifest',
+                href: generateManifest({
+                    theme_color: '#000000',
+                    background_color: '#ffffff',
+                    display: 'standalone',
+                    scope: '/',
+                    start_url: '/',
+                    name: shopMeta?.shop.name,
+                    short_name: shopMeta?.shop.name,
+                    description: shopMeta?.shop.description,
+                    icons: [
+                        {
+                            src: `${favicon}-/crop/1:1/center/-/smart_resize/192x192/`,
+                            sizes: '192x192',
+                            type: 'image/png',
+                            purpose: 'any maskable',
+                        },
+                        {
+                            src: `${favicon}-/crop/1:1/center/-/smart_resize/512x512/`,
+                            sizes: '512x512',
+                            type: 'image/png',
+                        },
+                    ],
+                }),
+            },
+        ],
+    };
+    return serializableJson({
+        themeStyle: genCSS(dataBuilder?.pageStyle?.data),
+        fontStyle,
+        builderData: pageTemplate,
+        pageType,
+        currency: shopMeta?.localization.country.currency.isoCode ?? null,
+        locale: shopMeta?.localization.country.isoCode ?? null,
+        swr: { fallback },
+        swatches: parseJson(shopData?.storeProperty?.swatchesConfig),
+        seo,
+    });
+};
+
+export { getStaticPageProps };

package/dist/esm/libs/fetcher.js

@@ -0,0 +1,68 @@
+import { getStorefrontApi } from './get-storefront-api.js';
+
+const createFetcher = (token) => {
+    const shopToken = token || process.env.NEXT_PUBLIC_SHOP_TOKEN;
+    return async (args) => {
+        const [query, variables, operationName] = args;
+        if (!shopToken) {
+            throw new Error('shopToken is not defined');
+        }
+        if (!process.env.NEXT_PUBLIC_API_URL) {
+            throw new Error('NEXT_PUBLIC_API_URL is not defined');
+        }
+        const headers = {
+            'Content-Type': 'application/json',
+            'X-GemX-Shop-Token': shopToken,
+        };
+        return fetch(process.env.NEXT_PUBLIC_API_URL, {
+            method: 'POST',
+            headers,
+            body: JSON.stringify({
+                query,
+                variables,
+                operationName,
+            }),
+        })
+            .then((res) => res.json())
+            .then((res) => {
+            if (res.errors) {
+                return Promise.reject(res.errors);
+            }
+            return res.data;
+        });
+    };
+};
+const createShopifyFetcher = (storefrontToken, handle) => {
+    const token = storefrontToken ?? process.env.NEXT_PUBLIC_STOREFRONT_TOKEN;
+    const storefrontHandle = handle ?? process.env.NEXT_PUBLIC_STOREFRONT_HANDLE;
+    return async (args) => {
+        if (!token) {
+            throw new Error('NEXT_PUBLIC_STOREFRONT_TOKEN is not defined');
+        }
+        if (!storefrontHandle) {
+            throw new Error('NEXT_PUBLIC_STOREFRONT_HANDLE is not defined');
+        }
+        const headers = {
+            'Content-Type': 'application/json',
+            'X-Shopify-Storefront-Access-Token': token,
+        };
+        const [query, variables] = args;
+        return fetch(getStorefrontApi(storefrontHandle), {
+            method: 'POST',
+            headers,
+            body: JSON.stringify({
+                query,
+                variables,
+            }),
+        })
+            .then((res) => res.json())
+            .then((res) => {
+            if (res.errors) {
+                return Promise.reject(res.errors);
+            }
+            return res.data;
+        });
+    };
+};
+
+export { createFetcher, createShopifyFetcher };

package/dist/esm/libs/get-layout.js

@@ -0,0 +1,8 @@
+import { jsx } from 'react/jsx-runtime';
+import MainLayout from '../layouts/main.js';
+
+const getLayout = (page) => {
+    return jsx(MainLayout, { children: page });
+};
+
+export { getLayout };