@shopify/hydrogen-react 2026.4.4 → 2026.4.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/browser-dev/analytics-schema-custom-storefront-customer-tracking.mjs +1 -1
- package/dist/browser-dev/load-script.mjs +4 -4
- package/dist/browser-dev/load-script.mjs.map +1 -1
- package/dist/browser-dev/packages/hydrogen-react/package.mjs +1 -1
- package/dist/browser-dev/packages/hydrogen-react/package.mjs.map +1 -1
- package/dist/browser-prod/analytics-schema-custom-storefront-customer-tracking.mjs +1 -1
- package/dist/browser-prod/load-script.mjs +4 -4
- package/dist/browser-prod/load-script.mjs.map +1 -1
- package/dist/browser-prod/packages/hydrogen-react/package.mjs +1 -1
- package/dist/browser-prod/packages/hydrogen-react/package.mjs.map +1 -1
- package/dist/node-dev/analytics-schema-custom-storefront-customer-tracking.js +1 -1
- package/dist/node-dev/analytics-schema-custom-storefront-customer-tracking.mjs +1 -1
- package/dist/node-dev/load-script.js +4 -4
- package/dist/node-dev/load-script.js.map +1 -1
- package/dist/node-dev/load-script.mjs +4 -4
- package/dist/node-dev/load-script.mjs.map +1 -1
- package/dist/node-dev/packages/hydrogen-react/package.js +1 -1
- package/dist/node-dev/packages/hydrogen-react/package.js.map +1 -1
- package/dist/node-dev/packages/hydrogen-react/package.mjs +1 -1
- package/dist/node-dev/packages/hydrogen-react/package.mjs.map +1 -1
- package/dist/node-prod/analytics-schema-custom-storefront-customer-tracking.js +1 -1
- package/dist/node-prod/analytics-schema-custom-storefront-customer-tracking.mjs +1 -1
- package/dist/node-prod/load-script.js +4 -4
- package/dist/node-prod/load-script.js.map +1 -1
- package/dist/node-prod/load-script.mjs +4 -4
- package/dist/node-prod/load-script.mjs.map +1 -1
- package/dist/node-prod/packages/hydrogen-react/package.js +1 -1
- package/dist/node-prod/packages/hydrogen-react/package.js.map +1 -1
- package/dist/node-prod/packages/hydrogen-react/package.mjs +1 -1
- package/dist/node-prod/packages/hydrogen-react/package.mjs.map +1 -1
- package/dist/umd/hydrogen-react.dev.js +5 -5
- package/dist/umd/hydrogen-react.dev.js.map +1 -1
- package/dist/umd/hydrogen-react.prod.js +2 -2
- package/dist/umd/hydrogen-react.prod.js.map +1 -1
- package/package.json +1 -1
|
@@ -100,7 +100,7 @@ function formatPayload(payload) {
|
|
|
100
100
|
const payloadWithPrivacy = payload;
|
|
101
101
|
return {
|
|
102
102
|
source: payload.shopifySalesChannel || ShopifySalesChannel.headless,
|
|
103
|
-
asset_version_id: payload.assetVersionId || "2026.4.
|
|
103
|
+
asset_version_id: payload.assetVersionId || "2026.4.5",
|
|
104
104
|
hydrogenSubchannelId: payload.storefrontId || payload.hydrogenSubchannelId || "0",
|
|
105
105
|
is_persistent_cookie: payload.hasUserConsent,
|
|
106
106
|
deprecated_visit_token: payload.visitToken,
|
|
@@ -8,6 +8,10 @@ function loadScript(src, options) {
|
|
|
8
8
|
const script = document.createElement("script");
|
|
9
9
|
if (options?.module) script.type = "module";
|
|
10
10
|
else script.type = "text/javascript";
|
|
11
|
+
const attributes = options?.attributes;
|
|
12
|
+
if (attributes) Object.keys(attributes).forEach((key) => {
|
|
13
|
+
script.setAttribute(key, attributes[key]);
|
|
14
|
+
});
|
|
11
15
|
script.src = src;
|
|
12
16
|
script.onload = () => {
|
|
13
17
|
resolve(true);
|
|
@@ -17,10 +21,6 @@ function loadScript(src, options) {
|
|
|
17
21
|
};
|
|
18
22
|
if (options?.in === "head") document.head.appendChild(script);
|
|
19
23
|
else document.body.appendChild(script);
|
|
20
|
-
const attributes = options?.attributes;
|
|
21
|
-
if (attributes) Object.keys(attributes).forEach((key) => {
|
|
22
|
-
script.setAttribute(key, attributes[key]);
|
|
23
|
-
});
|
|
24
24
|
});
|
|
25
25
|
SCRIPTS_LOADED[src] = promise;
|
|
26
26
|
return promise;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"load-script.mjs","names":[],"sources":["../../src/load-script.tsx"],"sourcesContent":["import {useState, useEffect} from 'react';\n\nconst SCRIPTS_LOADED: Record<string, Promise<boolean>> = {};\n\ntype LoadScriptOptions = {\n module?: boolean;\n in?: 'head' | 'body';\n attributes?: Record<string, string>;\n};\n\nexport function loadScript(\n src: string,\n options?: LoadScriptOptions,\n): Promise<boolean> {\n const isScriptLoaded = SCRIPTS_LOADED[src];\n\n // eslint-disable-next-line @typescript-eslint/no-misused-promises\n if (isScriptLoaded) {\n return isScriptLoaded;\n }\n\n const promise = new Promise<boolean>((resolve, reject) => {\n const script = document.createElement('script');\n if (options?.module) {\n script.type = 'module';\n } else {\n script.type = 'text/javascript';\n }\n script.src = src;\n script.onload = (): void => {\n resolve(true);\n };\n script.onerror = (): void => {\n reject(false);\n };\n if (options?.in === 'head') {\n document.head.appendChild(script);\n } else {\n document.body.appendChild(script);\n }\n
|
|
1
|
+
{"version":3,"file":"load-script.mjs","names":[],"sources":["../../src/load-script.tsx"],"sourcesContent":["import {useState, useEffect} from 'react';\n\nconst SCRIPTS_LOADED: Record<string, Promise<boolean>> = {};\n\ntype LoadScriptOptions = {\n module?: boolean;\n in?: 'head' | 'body';\n attributes?: Record<string, string>;\n};\n\nexport function loadScript(\n src: string,\n options?: LoadScriptOptions,\n): Promise<boolean> {\n const isScriptLoaded = SCRIPTS_LOADED[src];\n\n // eslint-disable-next-line @typescript-eslint/no-misused-promises\n if (isScriptLoaded) {\n return isScriptLoaded;\n }\n\n const promise = new Promise<boolean>((resolve, reject) => {\n const script = document.createElement('script');\n if (options?.module) {\n script.type = 'module';\n } else {\n script.type = 'text/javascript';\n }\n const attributes = options?.attributes;\n if (attributes) {\n Object.keys(attributes).forEach((key) => {\n script.setAttribute(key, attributes[key]);\n });\n }\n\n script.src = src;\n script.onload = (): void => {\n resolve(true);\n };\n script.onerror = (): void => {\n reject(false);\n };\n if (options?.in === 'head') {\n document.head.appendChild(script);\n } else {\n document.body.appendChild(script);\n }\n });\n\n SCRIPTS_LOADED[src] = promise;\n\n return promise;\n}\n\n/** @publicDocs */\nexport type LoadScriptParams = Parameters<typeof loadScript>;\n\n/**\n * The `useLoadScript` hook loads an external script tag in the browser. It allows React components to lazy-load large third-party dependencies.\n * @publicDocs\n */\nexport function useLoadScript(\n url: LoadScriptParams[0],\n options?: LoadScriptParams[1],\n): ScriptState {\n const [status, setStatus] = useState<ScriptState>('loading');\n\n useEffect(\n () => {\n loadScript(url, options)\n .then(() => setStatus('done'))\n .catch(() => setStatus('error'));\n },\n // Ignore options changes since it won't trigger a new load.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [url],\n );\n\n return status;\n}\n\ntype ScriptState = 'loading' | 'done' | 'error';\n"],"mappings":";;AAEA,IAAM,iBAAmD,EAAE;AAQ3D,SAAgB,WACd,KACA,SACkB;CAClB,MAAM,iBAAiB,eAAe;AAGtC,KAAI,eACF,QAAO;CAGT,MAAM,UAAU,IAAI,SAAkB,SAAS,WAAW;EACxD,MAAM,SAAS,SAAS,cAAc,SAAS;AAC/C,MAAI,SAAS,OACX,QAAO,OAAO;MAEd,QAAO,OAAO;EAEhB,MAAM,aAAa,SAAS;AAC5B,MAAI,WACF,QAAO,KAAK,WAAW,CAAC,SAAS,QAAQ;AACvC,UAAO,aAAa,KAAK,WAAW,KAAK;IACzC;AAGJ,SAAO,MAAM;AACb,SAAO,eAAqB;AAC1B,WAAQ,KAAK;;AAEf,SAAO,gBAAsB;AAC3B,UAAO,MAAM;;AAEf,MAAI,SAAS,OAAO,OAClB,UAAS,KAAK,YAAY,OAAO;MAEjC,UAAS,KAAK,YAAY,OAAO;GAEnC;AAEF,gBAAe,OAAO;AAEtB,QAAO;;;;;;AAUT,SAAgB,cACd,KACA,SACa;CACb,MAAM,CAAC,QAAQ,aAAa,SAAsB,UAAU;AAE5D,iBACQ;AACJ,aAAW,KAAK,QAAQ,CACrB,WAAW,UAAU,OAAO,CAAC,CAC7B,YAAY,UAAU,QAAQ,CAAC;IAIpC,CAAC,IAAI,CACN;AAED,QAAO"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"package.mjs","names":[],"sources":["../../../../package.json"],"sourcesContent":["{\n \"name\": \"@shopify/hydrogen-react\",\n \"version\": \"2026.4.
|
|
1
|
+
{"version":3,"file":"package.mjs","names":[],"sources":["../../../../package.json"],"sourcesContent":["{\n \"name\": \"@shopify/hydrogen-react\",\n \"version\": \"2026.4.5\",\n \"description\": \"React components, hooks, and utilities for creating custom Shopify storefronts\",\n \"homepage\": \"https://github.com/Shopify/hydrogen/tree/main/packages/hydrogen-react\",\n \"license\": \"MIT\",\n \"publishConfig\": {\n \"access\": \"public\",\n \"@shopify:registry\": \"https://registry.npmjs.org\"\n },\n \"files\": [\n \"dist\",\n \"storefront.schema.json\",\n \"customer-account.schema.json\"\n ],\n \"type\": \"commonjs\",\n \"exports\": {\n \".\": {\n \"node\": {\n \"require\": {\n \"types\": \"./dist/types/index.d.cts\",\n \"development\": \"./dist/node-dev/index.js\",\n \"default\": \"./dist/node-prod/index.js\"\n },\n \"import\": {\n \"types\": \"./dist/types/index.d.ts\",\n \"development\": \"./dist/node-dev/index.mjs\",\n \"default\": \"./dist/node-prod/index.mjs\"\n },\n \"default\": \"./dist/node-prod/index.js\"\n },\n \"module\": {\n \"types\": \"./dist/types/index.d.ts\",\n \"development\": \"./dist/browser-dev/index.mjs\",\n \"default\": \"./dist/browser-prod/index.mjs\"\n },\n \"import\": {\n \"types\": \"./dist/types/index.d.ts\",\n \"development\": \"./dist/browser-dev/index.mjs\",\n \"default\": \"./dist/browser-prod/index.mjs\"\n },\n \"require\": {\n \"types\": \"./dist/types/index.d.cts\",\n \"development\": \"./dist/node-dev/index.js\",\n \"default\": \"./dist/node-prod/index.js\"\n },\n \"default\": \"./dist/browser-prod/index.mjs\"\n },\n \"./storefront-api-types\": \"./dist/types/storefront-api-types.d.ts\",\n \"./storefront.schema.json\": \"./storefront.schema.json\",\n \"./customer-account.schema.json\": \"./customer-account.schema.json\",\n \"./customer-account-api-types\": \"./dist/types/customer-account-api-types.d.ts\",\n \"./package.json\": \"./package.json\",\n \"./*\": {\n \"node\": {\n \"require\": {\n \"types\": \"./dist/types/*.d.cts\",\n \"development\": \"./dist/node-dev/*.js\",\n \"default\": \"./dist/node-prod/*.js\"\n },\n \"import\": {\n \"types\": \"./dist/types/*.d.ts\",\n \"development\": \"./dist/node-dev/*.mjs\",\n \"default\": \"./dist/node-prod/*.mjs\"\n },\n \"default\": \"./dist/node-prod/*.js\"\n },\n \"module\": {\n \"types\": \"./dist/types/*.d.ts\",\n \"development\": \"./dist/browser-dev/*.mjs\",\n \"default\": \"./dist/browser-prod/*.mjs\"\n },\n \"import\": {\n \"types\": \"./dist/types/*.d.ts\",\n \"development\": \"./dist/browser-dev/*.mjs\",\n \"default\": \"./dist/browser-prod/*.mjs\"\n },\n \"require\": {\n \"types\": \"./dist/types/*.d.cts\",\n \"development\": \"./dist/node-dev/*.js\",\n \"default\": \"./dist/node-prod/*.js\"\n },\n \"default\": \"./dist/browser-prod/*.mjs\"\n }\n },\n \"typesVersions\": {\n \"*\": {\n \"storefront-api-types\": [\n \"./dist/types/storefront-api-types.d.ts\"\n ]\n }\n },\n \"main\": \"./dist/node-prod/index.js\",\n \"module\": \"./dist/node-prod/index.mjs\",\n \"browser\": \"./dist/browser-prod/index.mjs\",\n \"types\": \"./dist/types/index.d.ts\",\n \"unpkg\": \"./dist/umd/hydrogen-react.prod.js\",\n \"jsdelivr\": \"./dist/umd/hydrogen-react.prod.js\",\n \"sideEffects\": false,\n \"scripts\": {\n \"build-docs\": \"sh ./docs/build-docs.sh && pnpm run format\",\n \"clean-dist\": \"rimraf ./dist\",\n \"dev\": \"run-s dev:demo\",\n \"dev:story\": \"ladle serve\",\n \"dev:demo\": \"run-p dev:demo:* copy-api-types\",\n \"dev:demo:browser-dev\": \"vite build --watch --emptyOutDir false --clearScreen false --mode devbuild\",\n \"dev:demo:ts\": \"tsc --watch --emitDeclarationOnly\",\n \"build\": \"npm-run-all --sequential clean-dist --parallel build:vite:* build:tsc:es --parallel build:tsc:cjs copy-api-types\",\n \"build:vite:browser-dev\": \"vite build --mode devbuild\",\n \"build:vite:browser-prod\": \"vite build\",\n \"build:vite:node-dev\": \"vite build --mode devbuild --ssr\",\n \"build:vite:node-prod\": \"vite build --ssr\",\n \"build:vite:umddev\": \"vite build --mode umdbuilddev\",\n \"build:vite:umdprod\": \"vite build --mode umdbuild\",\n \"build:tsc:cjs\": \"cpy ./dist/types/index.d.ts ./dist/types/ --rename=index.d.cts --flat\",\n \"build:tsc:es\": \"tsc --emitDeclarationOnly --project tsconfig.typeoutput.json\",\n \"copy-api-types\": \"cpy ./src/storefront-api-types.d.ts ./src/customer-account-api-types.d.ts ./dist/types/ --flat\",\n \"format\": \"prettier --write \\\"{src,docs}/**/*\\\" --ignore-unknown\",\n \"graphql-types\": \"graphql-codegen --config codegen.ts && pnpm run format\",\n \"test\": \"vitest run --coverage\",\n \"test:watch\": \"vitest\",\n \"typecheck\": \"run-p typecheck:*\",\n \"typecheck:code\": \"tsc --noEmit\",\n \"typecheck:examples\": \"tsc --noEmit --project tsconfig.examples.json\",\n \"preview-docs\": \"pnpm --dir ../../docs/preview run dev\"\n },\n \"devDependencies\": {\n \"@faker-js/faker\": \"^9.4.0\",\n \"@graphql-codegen/add\": \"^5.0.3\",\n \"@graphql-codegen/cli\": \"^5.0.4\",\n \"@graphql-codegen/introspection\": \"^4.0.3\",\n \"@graphql-codegen/typescript\": \"^4.1.3\",\n \"@ladle/react\": \"^5.0.1\",\n \"@shopify/generate-docs\": \"catalog:\",\n \"@testing-library/jest-dom\": \"^6.6.3\",\n \"@testing-library/react\": \"^14.0.0\",\n \"@testing-library/user-event\": \"^14.6.1\",\n \"@types/react\": \"catalog:\",\n \"@types/react-dom\": \"catalog:\",\n \"@vitejs/plugin-react\": \"^6.0.1\",\n \"@vitest/coverage-v8\": \"^3.2.4\",\n \"cpy-cli\": \"^5.0.0\",\n \"eslint\": \"9.19.0\",\n \"eslint-config-prettier\": \"10.0.1\",\n \"eslint-import-resolver-typescript\": \"3.7.0\",\n \"eslint-plugin-eslint-comments\": \"3.2.0\",\n \"eslint-plugin-import\": \"2.31.0\",\n \"eslint-plugin-jest\": \"28.11.0\",\n \"eslint-plugin-jsx-a11y\": \"6.10.2\",\n \"eslint-plugin-node\": \"11.1.0\",\n \"eslint-plugin-prettier\": \"4.2.1\",\n \"eslint-plugin-react\": \"7.37.4\",\n \"eslint-plugin-react-hooks\": \"5.1.0\",\n \"eslint-plugin-simple-import-sort\": \"12.1.1\",\n \"eslint-plugin-tsdoc\": \"0.2.14\",\n \"happy-dom\": \"^20.8.9\",\n \"npm-run-all\": \"^4.1.5\",\n \"react\": \"catalog:\",\n \"react-dom\": \"catalog:\",\n \"rimraf\": \"^6.0.1\",\n \"ts-expect\": \"^1.3.0\",\n \"typescript\": \"5.9.2\",\n \"vite\": \"^8.0.1\",\n \"vitest\": \"^3.2.4\"\n },\n \"peerDependencies\": {\n \"react\": \"^18.3.1 || ~19.0.3 || ~19.1.4 || ^19.2.3\",\n \"react-dom\": \"^18.3.1 || ~19.0.3 || ~19.1.4 || ^19.2.3\",\n \"vite\": \"^5.1.0 || ^6.2.1 || ^7.0.0 || ^8.0.0\"\n },\n \"dependencies\": {\n \"@google/model-viewer\": \"^4.0.0\",\n \"@xstate/fsm\": \"2.0.0\",\n \"ast-v8-to-istanbul\": \"^0.3.11\",\n \"graphql\": \"^16.10.0\",\n \"type-fest\": \"^4.33.0\",\n \"worktop\": \"^0.7.3\"\n },\n \"repository\": {\n \"type\": \"git\",\n \"url\": \"https://github.com/Shopify/hydrogen.git\",\n \"directory\": \"packages/hydrogen-react\"\n },\n \"bugs\": \"https://github.com/shopify/hydrogen/issues\"\n}\n"],"mappings":""}
|
|
@@ -100,7 +100,7 @@ function formatPayload(payload) {
|
|
|
100
100
|
const payloadWithPrivacy = payload;
|
|
101
101
|
return {
|
|
102
102
|
source: payload.shopifySalesChannel || ShopifySalesChannel.headless,
|
|
103
|
-
asset_version_id: payload.assetVersionId || "2026.4.
|
|
103
|
+
asset_version_id: payload.assetVersionId || "2026.4.5",
|
|
104
104
|
hydrogenSubchannelId: payload.storefrontId || payload.hydrogenSubchannelId || "0",
|
|
105
105
|
is_persistent_cookie: payload.hasUserConsent,
|
|
106
106
|
deprecated_visit_token: payload.visitToken,
|
|
@@ -8,6 +8,10 @@ function loadScript(src, options) {
|
|
|
8
8
|
const script = document.createElement("script");
|
|
9
9
|
if (options?.module) script.type = "module";
|
|
10
10
|
else script.type = "text/javascript";
|
|
11
|
+
const attributes = options?.attributes;
|
|
12
|
+
if (attributes) Object.keys(attributes).forEach((key) => {
|
|
13
|
+
script.setAttribute(key, attributes[key]);
|
|
14
|
+
});
|
|
11
15
|
script.src = src;
|
|
12
16
|
script.onload = () => {
|
|
13
17
|
resolve(true);
|
|
@@ -17,10 +21,6 @@ function loadScript(src, options) {
|
|
|
17
21
|
};
|
|
18
22
|
if (options?.in === "head") document.head.appendChild(script);
|
|
19
23
|
else document.body.appendChild(script);
|
|
20
|
-
const attributes = options?.attributes;
|
|
21
|
-
if (attributes) Object.keys(attributes).forEach((key) => {
|
|
22
|
-
script.setAttribute(key, attributes[key]);
|
|
23
|
-
});
|
|
24
24
|
});
|
|
25
25
|
SCRIPTS_LOADED[src] = promise;
|
|
26
26
|
return promise;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"load-script.mjs","names":[],"sources":["../../src/load-script.tsx"],"sourcesContent":["import {useState, useEffect} from 'react';\n\nconst SCRIPTS_LOADED: Record<string, Promise<boolean>> = {};\n\ntype LoadScriptOptions = {\n module?: boolean;\n in?: 'head' | 'body';\n attributes?: Record<string, string>;\n};\n\nexport function loadScript(\n src: string,\n options?: LoadScriptOptions,\n): Promise<boolean> {\n const isScriptLoaded = SCRIPTS_LOADED[src];\n\n // eslint-disable-next-line @typescript-eslint/no-misused-promises\n if (isScriptLoaded) {\n return isScriptLoaded;\n }\n\n const promise = new Promise<boolean>((resolve, reject) => {\n const script = document.createElement('script');\n if (options?.module) {\n script.type = 'module';\n } else {\n script.type = 'text/javascript';\n }\n script.src = src;\n script.onload = (): void => {\n resolve(true);\n };\n script.onerror = (): void => {\n reject(false);\n };\n if (options?.in === 'head') {\n document.head.appendChild(script);\n } else {\n document.body.appendChild(script);\n }\n
|
|
1
|
+
{"version":3,"file":"load-script.mjs","names":[],"sources":["../../src/load-script.tsx"],"sourcesContent":["import {useState, useEffect} from 'react';\n\nconst SCRIPTS_LOADED: Record<string, Promise<boolean>> = {};\n\ntype LoadScriptOptions = {\n module?: boolean;\n in?: 'head' | 'body';\n attributes?: Record<string, string>;\n};\n\nexport function loadScript(\n src: string,\n options?: LoadScriptOptions,\n): Promise<boolean> {\n const isScriptLoaded = SCRIPTS_LOADED[src];\n\n // eslint-disable-next-line @typescript-eslint/no-misused-promises\n if (isScriptLoaded) {\n return isScriptLoaded;\n }\n\n const promise = new Promise<boolean>((resolve, reject) => {\n const script = document.createElement('script');\n if (options?.module) {\n script.type = 'module';\n } else {\n script.type = 'text/javascript';\n }\n const attributes = options?.attributes;\n if (attributes) {\n Object.keys(attributes).forEach((key) => {\n script.setAttribute(key, attributes[key]);\n });\n }\n\n script.src = src;\n script.onload = (): void => {\n resolve(true);\n };\n script.onerror = (): void => {\n reject(false);\n };\n if (options?.in === 'head') {\n document.head.appendChild(script);\n } else {\n document.body.appendChild(script);\n }\n });\n\n SCRIPTS_LOADED[src] = promise;\n\n return promise;\n}\n\n/** @publicDocs */\nexport type LoadScriptParams = Parameters<typeof loadScript>;\n\n/**\n * The `useLoadScript` hook loads an external script tag in the browser. It allows React components to lazy-load large third-party dependencies.\n * @publicDocs\n */\nexport function useLoadScript(\n url: LoadScriptParams[0],\n options?: LoadScriptParams[1],\n): ScriptState {\n const [status, setStatus] = useState<ScriptState>('loading');\n\n useEffect(\n () => {\n loadScript(url, options)\n .then(() => setStatus('done'))\n .catch(() => setStatus('error'));\n },\n // Ignore options changes since it won't trigger a new load.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [url],\n );\n\n return status;\n}\n\ntype ScriptState = 'loading' | 'done' | 'error';\n"],"mappings":";;AAEA,IAAM,iBAAmD,EAAE;AAQ3D,SAAgB,WACd,KACA,SACkB;CAClB,MAAM,iBAAiB,eAAe;AAGtC,KAAI,eACF,QAAO;CAGT,MAAM,UAAU,IAAI,SAAkB,SAAS,WAAW;EACxD,MAAM,SAAS,SAAS,cAAc,SAAS;AAC/C,MAAI,SAAS,OACX,QAAO,OAAO;MAEd,QAAO,OAAO;EAEhB,MAAM,aAAa,SAAS;AAC5B,MAAI,WACF,QAAO,KAAK,WAAW,CAAC,SAAS,QAAQ;AACvC,UAAO,aAAa,KAAK,WAAW,KAAK;IACzC;AAGJ,SAAO,MAAM;AACb,SAAO,eAAqB;AAC1B,WAAQ,KAAK;;AAEf,SAAO,gBAAsB;AAC3B,UAAO,MAAM;;AAEf,MAAI,SAAS,OAAO,OAClB,UAAS,KAAK,YAAY,OAAO;MAEjC,UAAS,KAAK,YAAY,OAAO;GAEnC;AAEF,gBAAe,OAAO;AAEtB,QAAO;;;;;;AAUT,SAAgB,cACd,KACA,SACa;CACb,MAAM,CAAC,QAAQ,aAAa,SAAsB,UAAU;AAE5D,iBACQ;AACJ,aAAW,KAAK,QAAQ,CACrB,WAAW,UAAU,OAAO,CAAC,CAC7B,YAAY,UAAU,QAAQ,CAAC;IAIpC,CAAC,IAAI,CACN;AAED,QAAO"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"package.mjs","names":[],"sources":["../../../../package.json"],"sourcesContent":["{\n \"name\": \"@shopify/hydrogen-react\",\n \"version\": \"2026.4.
|
|
1
|
+
{"version":3,"file":"package.mjs","names":[],"sources":["../../../../package.json"],"sourcesContent":["{\n \"name\": \"@shopify/hydrogen-react\",\n \"version\": \"2026.4.5\",\n \"description\": \"React components, hooks, and utilities for creating custom Shopify storefronts\",\n \"homepage\": \"https://github.com/Shopify/hydrogen/tree/main/packages/hydrogen-react\",\n \"license\": \"MIT\",\n \"publishConfig\": {\n \"access\": \"public\",\n \"@shopify:registry\": \"https://registry.npmjs.org\"\n },\n \"files\": [\n \"dist\",\n \"storefront.schema.json\",\n \"customer-account.schema.json\"\n ],\n \"type\": \"commonjs\",\n \"exports\": {\n \".\": {\n \"node\": {\n \"require\": {\n \"types\": \"./dist/types/index.d.cts\",\n \"development\": \"./dist/node-dev/index.js\",\n \"default\": \"./dist/node-prod/index.js\"\n },\n \"import\": {\n \"types\": \"./dist/types/index.d.ts\",\n \"development\": \"./dist/node-dev/index.mjs\",\n \"default\": \"./dist/node-prod/index.mjs\"\n },\n \"default\": \"./dist/node-prod/index.js\"\n },\n \"module\": {\n \"types\": \"./dist/types/index.d.ts\",\n \"development\": \"./dist/browser-dev/index.mjs\",\n \"default\": \"./dist/browser-prod/index.mjs\"\n },\n \"import\": {\n \"types\": \"./dist/types/index.d.ts\",\n \"development\": \"./dist/browser-dev/index.mjs\",\n \"default\": \"./dist/browser-prod/index.mjs\"\n },\n \"require\": {\n \"types\": \"./dist/types/index.d.cts\",\n \"development\": \"./dist/node-dev/index.js\",\n \"default\": \"./dist/node-prod/index.js\"\n },\n \"default\": \"./dist/browser-prod/index.mjs\"\n },\n \"./storefront-api-types\": \"./dist/types/storefront-api-types.d.ts\",\n \"./storefront.schema.json\": \"./storefront.schema.json\",\n \"./customer-account.schema.json\": \"./customer-account.schema.json\",\n \"./customer-account-api-types\": \"./dist/types/customer-account-api-types.d.ts\",\n \"./package.json\": \"./package.json\",\n \"./*\": {\n \"node\": {\n \"require\": {\n \"types\": \"./dist/types/*.d.cts\",\n \"development\": \"./dist/node-dev/*.js\",\n \"default\": \"./dist/node-prod/*.js\"\n },\n \"import\": {\n \"types\": \"./dist/types/*.d.ts\",\n \"development\": \"./dist/node-dev/*.mjs\",\n \"default\": \"./dist/node-prod/*.mjs\"\n },\n \"default\": \"./dist/node-prod/*.js\"\n },\n \"module\": {\n \"types\": \"./dist/types/*.d.ts\",\n \"development\": \"./dist/browser-dev/*.mjs\",\n \"default\": \"./dist/browser-prod/*.mjs\"\n },\n \"import\": {\n \"types\": \"./dist/types/*.d.ts\",\n \"development\": \"./dist/browser-dev/*.mjs\",\n \"default\": \"./dist/browser-prod/*.mjs\"\n },\n \"require\": {\n \"types\": \"./dist/types/*.d.cts\",\n \"development\": \"./dist/node-dev/*.js\",\n \"default\": \"./dist/node-prod/*.js\"\n },\n \"default\": \"./dist/browser-prod/*.mjs\"\n }\n },\n \"typesVersions\": {\n \"*\": {\n \"storefront-api-types\": [\n \"./dist/types/storefront-api-types.d.ts\"\n ]\n }\n },\n \"main\": \"./dist/node-prod/index.js\",\n \"module\": \"./dist/node-prod/index.mjs\",\n \"browser\": \"./dist/browser-prod/index.mjs\",\n \"types\": \"./dist/types/index.d.ts\",\n \"unpkg\": \"./dist/umd/hydrogen-react.prod.js\",\n \"jsdelivr\": \"./dist/umd/hydrogen-react.prod.js\",\n \"sideEffects\": false,\n \"scripts\": {\n \"build-docs\": \"sh ./docs/build-docs.sh && pnpm run format\",\n \"clean-dist\": \"rimraf ./dist\",\n \"dev\": \"run-s dev:demo\",\n \"dev:story\": \"ladle serve\",\n \"dev:demo\": \"run-p dev:demo:* copy-api-types\",\n \"dev:demo:browser-dev\": \"vite build --watch --emptyOutDir false --clearScreen false --mode devbuild\",\n \"dev:demo:ts\": \"tsc --watch --emitDeclarationOnly\",\n \"build\": \"npm-run-all --sequential clean-dist --parallel build:vite:* build:tsc:es --parallel build:tsc:cjs copy-api-types\",\n \"build:vite:browser-dev\": \"vite build --mode devbuild\",\n \"build:vite:browser-prod\": \"vite build\",\n \"build:vite:node-dev\": \"vite build --mode devbuild --ssr\",\n \"build:vite:node-prod\": \"vite build --ssr\",\n \"build:vite:umddev\": \"vite build --mode umdbuilddev\",\n \"build:vite:umdprod\": \"vite build --mode umdbuild\",\n \"build:tsc:cjs\": \"cpy ./dist/types/index.d.ts ./dist/types/ --rename=index.d.cts --flat\",\n \"build:tsc:es\": \"tsc --emitDeclarationOnly --project tsconfig.typeoutput.json\",\n \"copy-api-types\": \"cpy ./src/storefront-api-types.d.ts ./src/customer-account-api-types.d.ts ./dist/types/ --flat\",\n \"format\": \"prettier --write \\\"{src,docs}/**/*\\\" --ignore-unknown\",\n \"graphql-types\": \"graphql-codegen --config codegen.ts && pnpm run format\",\n \"test\": \"vitest run --coverage\",\n \"test:watch\": \"vitest\",\n \"typecheck\": \"run-p typecheck:*\",\n \"typecheck:code\": \"tsc --noEmit\",\n \"typecheck:examples\": \"tsc --noEmit --project tsconfig.examples.json\",\n \"preview-docs\": \"pnpm --dir ../../docs/preview run dev\"\n },\n \"devDependencies\": {\n \"@faker-js/faker\": \"^9.4.0\",\n \"@graphql-codegen/add\": \"^5.0.3\",\n \"@graphql-codegen/cli\": \"^5.0.4\",\n \"@graphql-codegen/introspection\": \"^4.0.3\",\n \"@graphql-codegen/typescript\": \"^4.1.3\",\n \"@ladle/react\": \"^5.0.1\",\n \"@shopify/generate-docs\": \"catalog:\",\n \"@testing-library/jest-dom\": \"^6.6.3\",\n \"@testing-library/react\": \"^14.0.0\",\n \"@testing-library/user-event\": \"^14.6.1\",\n \"@types/react\": \"catalog:\",\n \"@types/react-dom\": \"catalog:\",\n \"@vitejs/plugin-react\": \"^6.0.1\",\n \"@vitest/coverage-v8\": \"^3.2.4\",\n \"cpy-cli\": \"^5.0.0\",\n \"eslint\": \"9.19.0\",\n \"eslint-config-prettier\": \"10.0.1\",\n \"eslint-import-resolver-typescript\": \"3.7.0\",\n \"eslint-plugin-eslint-comments\": \"3.2.0\",\n \"eslint-plugin-import\": \"2.31.0\",\n \"eslint-plugin-jest\": \"28.11.0\",\n \"eslint-plugin-jsx-a11y\": \"6.10.2\",\n \"eslint-plugin-node\": \"11.1.0\",\n \"eslint-plugin-prettier\": \"4.2.1\",\n \"eslint-plugin-react\": \"7.37.4\",\n \"eslint-plugin-react-hooks\": \"5.1.0\",\n \"eslint-plugin-simple-import-sort\": \"12.1.1\",\n \"eslint-plugin-tsdoc\": \"0.2.14\",\n \"happy-dom\": \"^20.8.9\",\n \"npm-run-all\": \"^4.1.5\",\n \"react\": \"catalog:\",\n \"react-dom\": \"catalog:\",\n \"rimraf\": \"^6.0.1\",\n \"ts-expect\": \"^1.3.0\",\n \"typescript\": \"5.9.2\",\n \"vite\": \"^8.0.1\",\n \"vitest\": \"^3.2.4\"\n },\n \"peerDependencies\": {\n \"react\": \"^18.3.1 || ~19.0.3 || ~19.1.4 || ^19.2.3\",\n \"react-dom\": \"^18.3.1 || ~19.0.3 || ~19.1.4 || ^19.2.3\",\n \"vite\": \"^5.1.0 || ^6.2.1 || ^7.0.0 || ^8.0.0\"\n },\n \"dependencies\": {\n \"@google/model-viewer\": \"^4.0.0\",\n \"@xstate/fsm\": \"2.0.0\",\n \"ast-v8-to-istanbul\": \"^0.3.11\",\n \"graphql\": \"^16.10.0\",\n \"type-fest\": \"^4.33.0\",\n \"worktop\": \"^0.7.3\"\n },\n \"repository\": {\n \"type\": \"git\",\n \"url\": \"https://github.com/Shopify/hydrogen.git\",\n \"directory\": \"packages/hydrogen-react\"\n },\n \"bugs\": \"https://github.com/shopify/hydrogen/issues\"\n}\n"],"mappings":""}
|
|
@@ -100,7 +100,7 @@ function formatPayload(payload) {
|
|
|
100
100
|
const payloadWithPrivacy = payload;
|
|
101
101
|
return {
|
|
102
102
|
source: payload.shopifySalesChannel || require_analytics_constants.ShopifySalesChannel.headless,
|
|
103
|
-
asset_version_id: payload.assetVersionId || "2026.4.
|
|
103
|
+
asset_version_id: payload.assetVersionId || "2026.4.5",
|
|
104
104
|
hydrogenSubchannelId: payload.storefrontId || payload.hydrogenSubchannelId || "0",
|
|
105
105
|
is_persistent_cookie: payload.hasUserConsent,
|
|
106
106
|
deprecated_visit_token: payload.visitToken,
|
|
@@ -100,7 +100,7 @@ function formatPayload(payload) {
|
|
|
100
100
|
const payloadWithPrivacy = payload;
|
|
101
101
|
return {
|
|
102
102
|
source: payload.shopifySalesChannel || ShopifySalesChannel.headless,
|
|
103
|
-
asset_version_id: payload.assetVersionId || "2026.4.
|
|
103
|
+
asset_version_id: payload.assetVersionId || "2026.4.5",
|
|
104
104
|
hydrogenSubchannelId: payload.storefrontId || payload.hydrogenSubchannelId || "0",
|
|
105
105
|
is_persistent_cookie: payload.hasUserConsent,
|
|
106
106
|
deprecated_visit_token: payload.visitToken,
|
|
@@ -10,6 +10,10 @@ function loadScript(src, options) {
|
|
|
10
10
|
const script = document.createElement("script");
|
|
11
11
|
if (options?.module) script.type = "module";
|
|
12
12
|
else script.type = "text/javascript";
|
|
13
|
+
const attributes = options?.attributes;
|
|
14
|
+
if (attributes) Object.keys(attributes).forEach((key) => {
|
|
15
|
+
script.setAttribute(key, attributes[key]);
|
|
16
|
+
});
|
|
13
17
|
script.src = src;
|
|
14
18
|
script.onload = () => {
|
|
15
19
|
resolve(true);
|
|
@@ -19,10 +23,6 @@ function loadScript(src, options) {
|
|
|
19
23
|
};
|
|
20
24
|
if (options?.in === "head") document.head.appendChild(script);
|
|
21
25
|
else document.body.appendChild(script);
|
|
22
|
-
const attributes = options?.attributes;
|
|
23
|
-
if (attributes) Object.keys(attributes).forEach((key) => {
|
|
24
|
-
script.setAttribute(key, attributes[key]);
|
|
25
|
-
});
|
|
26
26
|
});
|
|
27
27
|
SCRIPTS_LOADED[src] = promise;
|
|
28
28
|
return promise;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"load-script.js","names":[],"sources":["../../src/load-script.tsx"],"sourcesContent":["import {useState, useEffect} from 'react';\n\nconst SCRIPTS_LOADED: Record<string, Promise<boolean>> = {};\n\ntype LoadScriptOptions = {\n module?: boolean;\n in?: 'head' | 'body';\n attributes?: Record<string, string>;\n};\n\nexport function loadScript(\n src: string,\n options?: LoadScriptOptions,\n): Promise<boolean> {\n const isScriptLoaded = SCRIPTS_LOADED[src];\n\n // eslint-disable-next-line @typescript-eslint/no-misused-promises\n if (isScriptLoaded) {\n return isScriptLoaded;\n }\n\n const promise = new Promise<boolean>((resolve, reject) => {\n const script = document.createElement('script');\n if (options?.module) {\n script.type = 'module';\n } else {\n script.type = 'text/javascript';\n }\n script.src = src;\n script.onload = (): void => {\n resolve(true);\n };\n script.onerror = (): void => {\n reject(false);\n };\n if (options?.in === 'head') {\n document.head.appendChild(script);\n } else {\n document.body.appendChild(script);\n }\n
|
|
1
|
+
{"version":3,"file":"load-script.js","names":[],"sources":["../../src/load-script.tsx"],"sourcesContent":["import {useState, useEffect} from 'react';\n\nconst SCRIPTS_LOADED: Record<string, Promise<boolean>> = {};\n\ntype LoadScriptOptions = {\n module?: boolean;\n in?: 'head' | 'body';\n attributes?: Record<string, string>;\n};\n\nexport function loadScript(\n src: string,\n options?: LoadScriptOptions,\n): Promise<boolean> {\n const isScriptLoaded = SCRIPTS_LOADED[src];\n\n // eslint-disable-next-line @typescript-eslint/no-misused-promises\n if (isScriptLoaded) {\n return isScriptLoaded;\n }\n\n const promise = new Promise<boolean>((resolve, reject) => {\n const script = document.createElement('script');\n if (options?.module) {\n script.type = 'module';\n } else {\n script.type = 'text/javascript';\n }\n const attributes = options?.attributes;\n if (attributes) {\n Object.keys(attributes).forEach((key) => {\n script.setAttribute(key, attributes[key]);\n });\n }\n\n script.src = src;\n script.onload = (): void => {\n resolve(true);\n };\n script.onerror = (): void => {\n reject(false);\n };\n if (options?.in === 'head') {\n document.head.appendChild(script);\n } else {\n document.body.appendChild(script);\n }\n });\n\n SCRIPTS_LOADED[src] = promise;\n\n return promise;\n}\n\n/** @publicDocs */\nexport type LoadScriptParams = Parameters<typeof loadScript>;\n\n/**\n * The `useLoadScript` hook loads an external script tag in the browser. It allows React components to lazy-load large third-party dependencies.\n * @publicDocs\n */\nexport function useLoadScript(\n url: LoadScriptParams[0],\n options?: LoadScriptParams[1],\n): ScriptState {\n const [status, setStatus] = useState<ScriptState>('loading');\n\n useEffect(\n () => {\n loadScript(url, options)\n .then(() => setStatus('done'))\n .catch(() => setStatus('error'));\n },\n // Ignore options changes since it won't trigger a new load.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [url],\n );\n\n return status;\n}\n\ntype ScriptState = 'loading' | 'done' | 'error';\n"],"mappings":";;;;AAEA,IAAM,iBAAmD,EAAE;AAQ3D,SAAgB,WACd,KACA,SACkB;CAClB,MAAM,iBAAiB,eAAe;AAGtC,KAAI,eACF,QAAO;CAGT,MAAM,UAAU,IAAI,SAAkB,SAAS,WAAW;EACxD,MAAM,SAAS,SAAS,cAAc,SAAS;AAC/C,MAAI,SAAS,OACX,QAAO,OAAO;MAEd,QAAO,OAAO;EAEhB,MAAM,aAAa,SAAS;AAC5B,MAAI,WACF,QAAO,KAAK,WAAW,CAAC,SAAS,QAAQ;AACvC,UAAO,aAAa,KAAK,WAAW,KAAK;IACzC;AAGJ,SAAO,MAAM;AACb,SAAO,eAAqB;AAC1B,WAAQ,KAAK;;AAEf,SAAO,gBAAsB;AAC3B,UAAO,MAAM;;AAEf,MAAI,SAAS,OAAO,OAClB,UAAS,KAAK,YAAY,OAAO;MAEjC,UAAS,KAAK,YAAY,OAAO;GAEnC;AAEF,gBAAe,OAAO;AAEtB,QAAO;;;;;;AAUT,SAAgB,cACd,KACA,SACa;CACb,MAAM,CAAC,QAAQ,cAAA,GAAA,MAAA,UAAmC,UAAU;AAE5D,EAAA,GAAA,MAAA,iBACQ;AACJ,aAAW,KAAK,QAAQ,CACrB,WAAW,UAAU,OAAO,CAAC,CAC7B,YAAY,UAAU,QAAQ,CAAC;IAIpC,CAAC,IAAI,CACN;AAED,QAAO"}
|
|
@@ -8,6 +8,10 @@ function loadScript(src, options) {
|
|
|
8
8
|
const script = document.createElement("script");
|
|
9
9
|
if (options?.module) script.type = "module";
|
|
10
10
|
else script.type = "text/javascript";
|
|
11
|
+
const attributes = options?.attributes;
|
|
12
|
+
if (attributes) Object.keys(attributes).forEach((key) => {
|
|
13
|
+
script.setAttribute(key, attributes[key]);
|
|
14
|
+
});
|
|
11
15
|
script.src = src;
|
|
12
16
|
script.onload = () => {
|
|
13
17
|
resolve(true);
|
|
@@ -17,10 +21,6 @@ function loadScript(src, options) {
|
|
|
17
21
|
};
|
|
18
22
|
if (options?.in === "head") document.head.appendChild(script);
|
|
19
23
|
else document.body.appendChild(script);
|
|
20
|
-
const attributes = options?.attributes;
|
|
21
|
-
if (attributes) Object.keys(attributes).forEach((key) => {
|
|
22
|
-
script.setAttribute(key, attributes[key]);
|
|
23
|
-
});
|
|
24
24
|
});
|
|
25
25
|
SCRIPTS_LOADED[src] = promise;
|
|
26
26
|
return promise;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"load-script.mjs","names":[],"sources":["../../src/load-script.tsx"],"sourcesContent":["import {useState, useEffect} from 'react';\n\nconst SCRIPTS_LOADED: Record<string, Promise<boolean>> = {};\n\ntype LoadScriptOptions = {\n module?: boolean;\n in?: 'head' | 'body';\n attributes?: Record<string, string>;\n};\n\nexport function loadScript(\n src: string,\n options?: LoadScriptOptions,\n): Promise<boolean> {\n const isScriptLoaded = SCRIPTS_LOADED[src];\n\n // eslint-disable-next-line @typescript-eslint/no-misused-promises\n if (isScriptLoaded) {\n return isScriptLoaded;\n }\n\n const promise = new Promise<boolean>((resolve, reject) => {\n const script = document.createElement('script');\n if (options?.module) {\n script.type = 'module';\n } else {\n script.type = 'text/javascript';\n }\n script.src = src;\n script.onload = (): void => {\n resolve(true);\n };\n script.onerror = (): void => {\n reject(false);\n };\n if (options?.in === 'head') {\n document.head.appendChild(script);\n } else {\n document.body.appendChild(script);\n }\n
|
|
1
|
+
{"version":3,"file":"load-script.mjs","names":[],"sources":["../../src/load-script.tsx"],"sourcesContent":["import {useState, useEffect} from 'react';\n\nconst SCRIPTS_LOADED: Record<string, Promise<boolean>> = {};\n\ntype LoadScriptOptions = {\n module?: boolean;\n in?: 'head' | 'body';\n attributes?: Record<string, string>;\n};\n\nexport function loadScript(\n src: string,\n options?: LoadScriptOptions,\n): Promise<boolean> {\n const isScriptLoaded = SCRIPTS_LOADED[src];\n\n // eslint-disable-next-line @typescript-eslint/no-misused-promises\n if (isScriptLoaded) {\n return isScriptLoaded;\n }\n\n const promise = new Promise<boolean>((resolve, reject) => {\n const script = document.createElement('script');\n if (options?.module) {\n script.type = 'module';\n } else {\n script.type = 'text/javascript';\n }\n const attributes = options?.attributes;\n if (attributes) {\n Object.keys(attributes).forEach((key) => {\n script.setAttribute(key, attributes[key]);\n });\n }\n\n script.src = src;\n script.onload = (): void => {\n resolve(true);\n };\n script.onerror = (): void => {\n reject(false);\n };\n if (options?.in === 'head') {\n document.head.appendChild(script);\n } else {\n document.body.appendChild(script);\n }\n });\n\n SCRIPTS_LOADED[src] = promise;\n\n return promise;\n}\n\n/** @publicDocs */\nexport type LoadScriptParams = Parameters<typeof loadScript>;\n\n/**\n * The `useLoadScript` hook loads an external script tag in the browser. It allows React components to lazy-load large third-party dependencies.\n * @publicDocs\n */\nexport function useLoadScript(\n url: LoadScriptParams[0],\n options?: LoadScriptParams[1],\n): ScriptState {\n const [status, setStatus] = useState<ScriptState>('loading');\n\n useEffect(\n () => {\n loadScript(url, options)\n .then(() => setStatus('done'))\n .catch(() => setStatus('error'));\n },\n // Ignore options changes since it won't trigger a new load.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [url],\n );\n\n return status;\n}\n\ntype ScriptState = 'loading' | 'done' | 'error';\n"],"mappings":";;AAEA,IAAM,iBAAmD,EAAE;AAQ3D,SAAgB,WACd,KACA,SACkB;CAClB,MAAM,iBAAiB,eAAe;AAGtC,KAAI,eACF,QAAO;CAGT,MAAM,UAAU,IAAI,SAAkB,SAAS,WAAW;EACxD,MAAM,SAAS,SAAS,cAAc,SAAS;AAC/C,MAAI,SAAS,OACX,QAAO,OAAO;MAEd,QAAO,OAAO;EAEhB,MAAM,aAAa,SAAS;AAC5B,MAAI,WACF,QAAO,KAAK,WAAW,CAAC,SAAS,QAAQ;AACvC,UAAO,aAAa,KAAK,WAAW,KAAK;IACzC;AAGJ,SAAO,MAAM;AACb,SAAO,eAAqB;AAC1B,WAAQ,KAAK;;AAEf,SAAO,gBAAsB;AAC3B,UAAO,MAAM;;AAEf,MAAI,SAAS,OAAO,OAClB,UAAS,KAAK,YAAY,OAAO;MAEjC,UAAS,KAAK,YAAY,OAAO;GAEnC;AAEF,gBAAe,OAAO;AAEtB,QAAO;;;;;;AAUT,SAAgB,cACd,KACA,SACa;CACb,MAAM,CAAC,QAAQ,aAAa,SAAsB,UAAU;AAE5D,iBACQ;AACJ,aAAW,KAAK,QAAQ,CACrB,WAAW,UAAU,OAAO,CAAC,CAC7B,YAAY,UAAU,QAAQ,CAAC;IAIpC,CAAC,IAAI,CACN;AAED,QAAO"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"package.js","names":[],"sources":["../../../../package.json"],"sourcesContent":["{\n \"name\": \"@shopify/hydrogen-react\",\n \"version\": \"2026.4.
|
|
1
|
+
{"version":3,"file":"package.js","names":[],"sources":["../../../../package.json"],"sourcesContent":["{\n \"name\": \"@shopify/hydrogen-react\",\n \"version\": \"2026.4.5\",\n \"description\": \"React components, hooks, and utilities for creating custom Shopify storefronts\",\n \"homepage\": \"https://github.com/Shopify/hydrogen/tree/main/packages/hydrogen-react\",\n \"license\": \"MIT\",\n \"publishConfig\": {\n \"access\": \"public\",\n \"@shopify:registry\": \"https://registry.npmjs.org\"\n },\n \"files\": [\n \"dist\",\n \"storefront.schema.json\",\n \"customer-account.schema.json\"\n ],\n \"type\": \"commonjs\",\n \"exports\": {\n \".\": {\n \"node\": {\n \"require\": {\n \"types\": \"./dist/types/index.d.cts\",\n \"development\": \"./dist/node-dev/index.js\",\n \"default\": \"./dist/node-prod/index.js\"\n },\n \"import\": {\n \"types\": \"./dist/types/index.d.ts\",\n \"development\": \"./dist/node-dev/index.mjs\",\n \"default\": \"./dist/node-prod/index.mjs\"\n },\n \"default\": \"./dist/node-prod/index.js\"\n },\n \"module\": {\n \"types\": \"./dist/types/index.d.ts\",\n \"development\": \"./dist/browser-dev/index.mjs\",\n \"default\": \"./dist/browser-prod/index.mjs\"\n },\n \"import\": {\n \"types\": \"./dist/types/index.d.ts\",\n \"development\": \"./dist/browser-dev/index.mjs\",\n \"default\": \"./dist/browser-prod/index.mjs\"\n },\n \"require\": {\n \"types\": \"./dist/types/index.d.cts\",\n \"development\": \"./dist/node-dev/index.js\",\n \"default\": \"./dist/node-prod/index.js\"\n },\n \"default\": \"./dist/browser-prod/index.mjs\"\n },\n \"./storefront-api-types\": \"./dist/types/storefront-api-types.d.ts\",\n \"./storefront.schema.json\": \"./storefront.schema.json\",\n \"./customer-account.schema.json\": \"./customer-account.schema.json\",\n \"./customer-account-api-types\": \"./dist/types/customer-account-api-types.d.ts\",\n \"./package.json\": \"./package.json\",\n \"./*\": {\n \"node\": {\n \"require\": {\n \"types\": \"./dist/types/*.d.cts\",\n \"development\": \"./dist/node-dev/*.js\",\n \"default\": \"./dist/node-prod/*.js\"\n },\n \"import\": {\n \"types\": \"./dist/types/*.d.ts\",\n \"development\": \"./dist/node-dev/*.mjs\",\n \"default\": \"./dist/node-prod/*.mjs\"\n },\n \"default\": \"./dist/node-prod/*.js\"\n },\n \"module\": {\n \"types\": \"./dist/types/*.d.ts\",\n \"development\": \"./dist/browser-dev/*.mjs\",\n \"default\": \"./dist/browser-prod/*.mjs\"\n },\n \"import\": {\n \"types\": \"./dist/types/*.d.ts\",\n \"development\": \"./dist/browser-dev/*.mjs\",\n \"default\": \"./dist/browser-prod/*.mjs\"\n },\n \"require\": {\n \"types\": \"./dist/types/*.d.cts\",\n \"development\": \"./dist/node-dev/*.js\",\n \"default\": \"./dist/node-prod/*.js\"\n },\n \"default\": \"./dist/browser-prod/*.mjs\"\n }\n },\n \"typesVersions\": {\n \"*\": {\n \"storefront-api-types\": [\n \"./dist/types/storefront-api-types.d.ts\"\n ]\n }\n },\n \"main\": \"./dist/node-prod/index.js\",\n \"module\": \"./dist/node-prod/index.mjs\",\n \"browser\": \"./dist/browser-prod/index.mjs\",\n \"types\": \"./dist/types/index.d.ts\",\n \"unpkg\": \"./dist/umd/hydrogen-react.prod.js\",\n \"jsdelivr\": \"./dist/umd/hydrogen-react.prod.js\",\n \"sideEffects\": false,\n \"scripts\": {\n \"build-docs\": \"sh ./docs/build-docs.sh && pnpm run format\",\n \"clean-dist\": \"rimraf ./dist\",\n \"dev\": \"run-s dev:demo\",\n \"dev:story\": \"ladle serve\",\n \"dev:demo\": \"run-p dev:demo:* copy-api-types\",\n \"dev:demo:browser-dev\": \"vite build --watch --emptyOutDir false --clearScreen false --mode devbuild\",\n \"dev:demo:ts\": \"tsc --watch --emitDeclarationOnly\",\n \"build\": \"npm-run-all --sequential clean-dist --parallel build:vite:* build:tsc:es --parallel build:tsc:cjs copy-api-types\",\n \"build:vite:browser-dev\": \"vite build --mode devbuild\",\n \"build:vite:browser-prod\": \"vite build\",\n \"build:vite:node-dev\": \"vite build --mode devbuild --ssr\",\n \"build:vite:node-prod\": \"vite build --ssr\",\n \"build:vite:umddev\": \"vite build --mode umdbuilddev\",\n \"build:vite:umdprod\": \"vite build --mode umdbuild\",\n \"build:tsc:cjs\": \"cpy ./dist/types/index.d.ts ./dist/types/ --rename=index.d.cts --flat\",\n \"build:tsc:es\": \"tsc --emitDeclarationOnly --project tsconfig.typeoutput.json\",\n \"copy-api-types\": \"cpy ./src/storefront-api-types.d.ts ./src/customer-account-api-types.d.ts ./dist/types/ --flat\",\n \"format\": \"prettier --write \\\"{src,docs}/**/*\\\" --ignore-unknown\",\n \"graphql-types\": \"graphql-codegen --config codegen.ts && pnpm run format\",\n \"test\": \"vitest run --coverage\",\n \"test:watch\": \"vitest\",\n \"typecheck\": \"run-p typecheck:*\",\n \"typecheck:code\": \"tsc --noEmit\",\n \"typecheck:examples\": \"tsc --noEmit --project tsconfig.examples.json\",\n \"preview-docs\": \"pnpm --dir ../../docs/preview run dev\"\n },\n \"devDependencies\": {\n \"@faker-js/faker\": \"^9.4.0\",\n \"@graphql-codegen/add\": \"^5.0.3\",\n \"@graphql-codegen/cli\": \"^5.0.4\",\n \"@graphql-codegen/introspection\": \"^4.0.3\",\n \"@graphql-codegen/typescript\": \"^4.1.3\",\n \"@ladle/react\": \"^5.0.1\",\n \"@shopify/generate-docs\": \"catalog:\",\n \"@testing-library/jest-dom\": \"^6.6.3\",\n \"@testing-library/react\": \"^14.0.0\",\n \"@testing-library/user-event\": \"^14.6.1\",\n \"@types/react\": \"catalog:\",\n \"@types/react-dom\": \"catalog:\",\n \"@vitejs/plugin-react\": \"^6.0.1\",\n \"@vitest/coverage-v8\": \"^3.2.4\",\n \"cpy-cli\": \"^5.0.0\",\n \"eslint\": \"9.19.0\",\n \"eslint-config-prettier\": \"10.0.1\",\n \"eslint-import-resolver-typescript\": \"3.7.0\",\n \"eslint-plugin-eslint-comments\": \"3.2.0\",\n \"eslint-plugin-import\": \"2.31.0\",\n \"eslint-plugin-jest\": \"28.11.0\",\n \"eslint-plugin-jsx-a11y\": \"6.10.2\",\n \"eslint-plugin-node\": \"11.1.0\",\n \"eslint-plugin-prettier\": \"4.2.1\",\n \"eslint-plugin-react\": \"7.37.4\",\n \"eslint-plugin-react-hooks\": \"5.1.0\",\n \"eslint-plugin-simple-import-sort\": \"12.1.1\",\n \"eslint-plugin-tsdoc\": \"0.2.14\",\n \"happy-dom\": \"^20.8.9\",\n \"npm-run-all\": \"^4.1.5\",\n \"react\": \"catalog:\",\n \"react-dom\": \"catalog:\",\n \"rimraf\": \"^6.0.1\",\n \"ts-expect\": \"^1.3.0\",\n \"typescript\": \"5.9.2\",\n \"vite\": \"^8.0.1\",\n \"vitest\": \"^3.2.4\"\n },\n \"peerDependencies\": {\n \"react\": \"^18.3.1 || ~19.0.3 || ~19.1.4 || ^19.2.3\",\n \"react-dom\": \"^18.3.1 || ~19.0.3 || ~19.1.4 || ^19.2.3\",\n \"vite\": \"^5.1.0 || ^6.2.1 || ^7.0.0 || ^8.0.0\"\n },\n \"dependencies\": {\n \"@google/model-viewer\": \"^4.0.0\",\n \"@xstate/fsm\": \"2.0.0\",\n \"ast-v8-to-istanbul\": \"^0.3.11\",\n \"graphql\": \"^16.10.0\",\n \"type-fest\": \"^4.33.0\",\n \"worktop\": \"^0.7.3\"\n },\n \"repository\": {\n \"type\": \"git\",\n \"url\": \"https://github.com/Shopify/hydrogen.git\",\n \"directory\": \"packages/hydrogen-react\"\n },\n \"bugs\": \"https://github.com/shopify/hydrogen/issues\"\n}\n"],"mappings":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"package.mjs","names":[],"sources":["../../../../package.json"],"sourcesContent":["{\n \"name\": \"@shopify/hydrogen-react\",\n \"version\": \"2026.4.
|
|
1
|
+
{"version":3,"file":"package.mjs","names":[],"sources":["../../../../package.json"],"sourcesContent":["{\n \"name\": \"@shopify/hydrogen-react\",\n \"version\": \"2026.4.5\",\n \"description\": \"React components, hooks, and utilities for creating custom Shopify storefronts\",\n \"homepage\": \"https://github.com/Shopify/hydrogen/tree/main/packages/hydrogen-react\",\n \"license\": \"MIT\",\n \"publishConfig\": {\n \"access\": \"public\",\n \"@shopify:registry\": \"https://registry.npmjs.org\"\n },\n \"files\": [\n \"dist\",\n \"storefront.schema.json\",\n \"customer-account.schema.json\"\n ],\n \"type\": \"commonjs\",\n \"exports\": {\n \".\": {\n \"node\": {\n \"require\": {\n \"types\": \"./dist/types/index.d.cts\",\n \"development\": \"./dist/node-dev/index.js\",\n \"default\": \"./dist/node-prod/index.js\"\n },\n \"import\": {\n \"types\": \"./dist/types/index.d.ts\",\n \"development\": \"./dist/node-dev/index.mjs\",\n \"default\": \"./dist/node-prod/index.mjs\"\n },\n \"default\": \"./dist/node-prod/index.js\"\n },\n \"module\": {\n \"types\": \"./dist/types/index.d.ts\",\n \"development\": \"./dist/browser-dev/index.mjs\",\n \"default\": \"./dist/browser-prod/index.mjs\"\n },\n \"import\": {\n \"types\": \"./dist/types/index.d.ts\",\n \"development\": \"./dist/browser-dev/index.mjs\",\n \"default\": \"./dist/browser-prod/index.mjs\"\n },\n \"require\": {\n \"types\": \"./dist/types/index.d.cts\",\n \"development\": \"./dist/node-dev/index.js\",\n \"default\": \"./dist/node-prod/index.js\"\n },\n \"default\": \"./dist/browser-prod/index.mjs\"\n },\n \"./storefront-api-types\": \"./dist/types/storefront-api-types.d.ts\",\n \"./storefront.schema.json\": \"./storefront.schema.json\",\n \"./customer-account.schema.json\": \"./customer-account.schema.json\",\n \"./customer-account-api-types\": \"./dist/types/customer-account-api-types.d.ts\",\n \"./package.json\": \"./package.json\",\n \"./*\": {\n \"node\": {\n \"require\": {\n \"types\": \"./dist/types/*.d.cts\",\n \"development\": \"./dist/node-dev/*.js\",\n \"default\": \"./dist/node-prod/*.js\"\n },\n \"import\": {\n \"types\": \"./dist/types/*.d.ts\",\n \"development\": \"./dist/node-dev/*.mjs\",\n \"default\": \"./dist/node-prod/*.mjs\"\n },\n \"default\": \"./dist/node-prod/*.js\"\n },\n \"module\": {\n \"types\": \"./dist/types/*.d.ts\",\n \"development\": \"./dist/browser-dev/*.mjs\",\n \"default\": \"./dist/browser-prod/*.mjs\"\n },\n \"import\": {\n \"types\": \"./dist/types/*.d.ts\",\n \"development\": \"./dist/browser-dev/*.mjs\",\n \"default\": \"./dist/browser-prod/*.mjs\"\n },\n \"require\": {\n \"types\": \"./dist/types/*.d.cts\",\n \"development\": \"./dist/node-dev/*.js\",\n \"default\": \"./dist/node-prod/*.js\"\n },\n \"default\": \"./dist/browser-prod/*.mjs\"\n }\n },\n \"typesVersions\": {\n \"*\": {\n \"storefront-api-types\": [\n \"./dist/types/storefront-api-types.d.ts\"\n ]\n }\n },\n \"main\": \"./dist/node-prod/index.js\",\n \"module\": \"./dist/node-prod/index.mjs\",\n \"browser\": \"./dist/browser-prod/index.mjs\",\n \"types\": \"./dist/types/index.d.ts\",\n \"unpkg\": \"./dist/umd/hydrogen-react.prod.js\",\n \"jsdelivr\": \"./dist/umd/hydrogen-react.prod.js\",\n \"sideEffects\": false,\n \"scripts\": {\n \"build-docs\": \"sh ./docs/build-docs.sh && pnpm run format\",\n \"clean-dist\": \"rimraf ./dist\",\n \"dev\": \"run-s dev:demo\",\n \"dev:story\": \"ladle serve\",\n \"dev:demo\": \"run-p dev:demo:* copy-api-types\",\n \"dev:demo:browser-dev\": \"vite build --watch --emptyOutDir false --clearScreen false --mode devbuild\",\n \"dev:demo:ts\": \"tsc --watch --emitDeclarationOnly\",\n \"build\": \"npm-run-all --sequential clean-dist --parallel build:vite:* build:tsc:es --parallel build:tsc:cjs copy-api-types\",\n \"build:vite:browser-dev\": \"vite build --mode devbuild\",\n \"build:vite:browser-prod\": \"vite build\",\n \"build:vite:node-dev\": \"vite build --mode devbuild --ssr\",\n \"build:vite:node-prod\": \"vite build --ssr\",\n \"build:vite:umddev\": \"vite build --mode umdbuilddev\",\n \"build:vite:umdprod\": \"vite build --mode umdbuild\",\n \"build:tsc:cjs\": \"cpy ./dist/types/index.d.ts ./dist/types/ --rename=index.d.cts --flat\",\n \"build:tsc:es\": \"tsc --emitDeclarationOnly --project tsconfig.typeoutput.json\",\n \"copy-api-types\": \"cpy ./src/storefront-api-types.d.ts ./src/customer-account-api-types.d.ts ./dist/types/ --flat\",\n \"format\": \"prettier --write \\\"{src,docs}/**/*\\\" --ignore-unknown\",\n \"graphql-types\": \"graphql-codegen --config codegen.ts && pnpm run format\",\n \"test\": \"vitest run --coverage\",\n \"test:watch\": \"vitest\",\n \"typecheck\": \"run-p typecheck:*\",\n \"typecheck:code\": \"tsc --noEmit\",\n \"typecheck:examples\": \"tsc --noEmit --project tsconfig.examples.json\",\n \"preview-docs\": \"pnpm --dir ../../docs/preview run dev\"\n },\n \"devDependencies\": {\n \"@faker-js/faker\": \"^9.4.0\",\n \"@graphql-codegen/add\": \"^5.0.3\",\n \"@graphql-codegen/cli\": \"^5.0.4\",\n \"@graphql-codegen/introspection\": \"^4.0.3\",\n \"@graphql-codegen/typescript\": \"^4.1.3\",\n \"@ladle/react\": \"^5.0.1\",\n \"@shopify/generate-docs\": \"catalog:\",\n \"@testing-library/jest-dom\": \"^6.6.3\",\n \"@testing-library/react\": \"^14.0.0\",\n \"@testing-library/user-event\": \"^14.6.1\",\n \"@types/react\": \"catalog:\",\n \"@types/react-dom\": \"catalog:\",\n \"@vitejs/plugin-react\": \"^6.0.1\",\n \"@vitest/coverage-v8\": \"^3.2.4\",\n \"cpy-cli\": \"^5.0.0\",\n \"eslint\": \"9.19.0\",\n \"eslint-config-prettier\": \"10.0.1\",\n \"eslint-import-resolver-typescript\": \"3.7.0\",\n \"eslint-plugin-eslint-comments\": \"3.2.0\",\n \"eslint-plugin-import\": \"2.31.0\",\n \"eslint-plugin-jest\": \"28.11.0\",\n \"eslint-plugin-jsx-a11y\": \"6.10.2\",\n \"eslint-plugin-node\": \"11.1.0\",\n \"eslint-plugin-prettier\": \"4.2.1\",\n \"eslint-plugin-react\": \"7.37.4\",\n \"eslint-plugin-react-hooks\": \"5.1.0\",\n \"eslint-plugin-simple-import-sort\": \"12.1.1\",\n \"eslint-plugin-tsdoc\": \"0.2.14\",\n \"happy-dom\": \"^20.8.9\",\n \"npm-run-all\": \"^4.1.5\",\n \"react\": \"catalog:\",\n \"react-dom\": \"catalog:\",\n \"rimraf\": \"^6.0.1\",\n \"ts-expect\": \"^1.3.0\",\n \"typescript\": \"5.9.2\",\n \"vite\": \"^8.0.1\",\n \"vitest\": \"^3.2.4\"\n },\n \"peerDependencies\": {\n \"react\": \"^18.3.1 || ~19.0.3 || ~19.1.4 || ^19.2.3\",\n \"react-dom\": \"^18.3.1 || ~19.0.3 || ~19.1.4 || ^19.2.3\",\n \"vite\": \"^5.1.0 || ^6.2.1 || ^7.0.0 || ^8.0.0\"\n },\n \"dependencies\": {\n \"@google/model-viewer\": \"^4.0.0\",\n \"@xstate/fsm\": \"2.0.0\",\n \"ast-v8-to-istanbul\": \"^0.3.11\",\n \"graphql\": \"^16.10.0\",\n \"type-fest\": \"^4.33.0\",\n \"worktop\": \"^0.7.3\"\n },\n \"repository\": {\n \"type\": \"git\",\n \"url\": \"https://github.com/Shopify/hydrogen.git\",\n \"directory\": \"packages/hydrogen-react\"\n },\n \"bugs\": \"https://github.com/shopify/hydrogen/issues\"\n}\n"],"mappings":""}
|
|
@@ -100,7 +100,7 @@ function formatPayload(payload) {
|
|
|
100
100
|
const payloadWithPrivacy = payload;
|
|
101
101
|
return {
|
|
102
102
|
source: payload.shopifySalesChannel || require_analytics_constants.ShopifySalesChannel.headless,
|
|
103
|
-
asset_version_id: payload.assetVersionId || "2026.4.
|
|
103
|
+
asset_version_id: payload.assetVersionId || "2026.4.5",
|
|
104
104
|
hydrogenSubchannelId: payload.storefrontId || payload.hydrogenSubchannelId || "0",
|
|
105
105
|
is_persistent_cookie: payload.hasUserConsent,
|
|
106
106
|
deprecated_visit_token: payload.visitToken,
|
|
@@ -100,7 +100,7 @@ function formatPayload(payload) {
|
|
|
100
100
|
const payloadWithPrivacy = payload;
|
|
101
101
|
return {
|
|
102
102
|
source: payload.shopifySalesChannel || ShopifySalesChannel.headless,
|
|
103
|
-
asset_version_id: payload.assetVersionId || "2026.4.
|
|
103
|
+
asset_version_id: payload.assetVersionId || "2026.4.5",
|
|
104
104
|
hydrogenSubchannelId: payload.storefrontId || payload.hydrogenSubchannelId || "0",
|
|
105
105
|
is_persistent_cookie: payload.hasUserConsent,
|
|
106
106
|
deprecated_visit_token: payload.visitToken,
|
|
@@ -10,6 +10,10 @@ function loadScript(src, options) {
|
|
|
10
10
|
const script = document.createElement("script");
|
|
11
11
|
if (options?.module) script.type = "module";
|
|
12
12
|
else script.type = "text/javascript";
|
|
13
|
+
const attributes = options?.attributes;
|
|
14
|
+
if (attributes) Object.keys(attributes).forEach((key) => {
|
|
15
|
+
script.setAttribute(key, attributes[key]);
|
|
16
|
+
});
|
|
13
17
|
script.src = src;
|
|
14
18
|
script.onload = () => {
|
|
15
19
|
resolve(true);
|
|
@@ -19,10 +23,6 @@ function loadScript(src, options) {
|
|
|
19
23
|
};
|
|
20
24
|
if (options?.in === "head") document.head.appendChild(script);
|
|
21
25
|
else document.body.appendChild(script);
|
|
22
|
-
const attributes = options?.attributes;
|
|
23
|
-
if (attributes) Object.keys(attributes).forEach((key) => {
|
|
24
|
-
script.setAttribute(key, attributes[key]);
|
|
25
|
-
});
|
|
26
26
|
});
|
|
27
27
|
SCRIPTS_LOADED[src] = promise;
|
|
28
28
|
return promise;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"load-script.js","names":[],"sources":["../../src/load-script.tsx"],"sourcesContent":["import {useState, useEffect} from 'react';\n\nconst SCRIPTS_LOADED: Record<string, Promise<boolean>> = {};\n\ntype LoadScriptOptions = {\n module?: boolean;\n in?: 'head' | 'body';\n attributes?: Record<string, string>;\n};\n\nexport function loadScript(\n src: string,\n options?: LoadScriptOptions,\n): Promise<boolean> {\n const isScriptLoaded = SCRIPTS_LOADED[src];\n\n // eslint-disable-next-line @typescript-eslint/no-misused-promises\n if (isScriptLoaded) {\n return isScriptLoaded;\n }\n\n const promise = new Promise<boolean>((resolve, reject) => {\n const script = document.createElement('script');\n if (options?.module) {\n script.type = 'module';\n } else {\n script.type = 'text/javascript';\n }\n script.src = src;\n script.onload = (): void => {\n resolve(true);\n };\n script.onerror = (): void => {\n reject(false);\n };\n if (options?.in === 'head') {\n document.head.appendChild(script);\n } else {\n document.body.appendChild(script);\n }\n
|
|
1
|
+
{"version":3,"file":"load-script.js","names":[],"sources":["../../src/load-script.tsx"],"sourcesContent":["import {useState, useEffect} from 'react';\n\nconst SCRIPTS_LOADED: Record<string, Promise<boolean>> = {};\n\ntype LoadScriptOptions = {\n module?: boolean;\n in?: 'head' | 'body';\n attributes?: Record<string, string>;\n};\n\nexport function loadScript(\n src: string,\n options?: LoadScriptOptions,\n): Promise<boolean> {\n const isScriptLoaded = SCRIPTS_LOADED[src];\n\n // eslint-disable-next-line @typescript-eslint/no-misused-promises\n if (isScriptLoaded) {\n return isScriptLoaded;\n }\n\n const promise = new Promise<boolean>((resolve, reject) => {\n const script = document.createElement('script');\n if (options?.module) {\n script.type = 'module';\n } else {\n script.type = 'text/javascript';\n }\n const attributes = options?.attributes;\n if (attributes) {\n Object.keys(attributes).forEach((key) => {\n script.setAttribute(key, attributes[key]);\n });\n }\n\n script.src = src;\n script.onload = (): void => {\n resolve(true);\n };\n script.onerror = (): void => {\n reject(false);\n };\n if (options?.in === 'head') {\n document.head.appendChild(script);\n } else {\n document.body.appendChild(script);\n }\n });\n\n SCRIPTS_LOADED[src] = promise;\n\n return promise;\n}\n\n/** @publicDocs */\nexport type LoadScriptParams = Parameters<typeof loadScript>;\n\n/**\n * The `useLoadScript` hook loads an external script tag in the browser. It allows React components to lazy-load large third-party dependencies.\n * @publicDocs\n */\nexport function useLoadScript(\n url: LoadScriptParams[0],\n options?: LoadScriptParams[1],\n): ScriptState {\n const [status, setStatus] = useState<ScriptState>('loading');\n\n useEffect(\n () => {\n loadScript(url, options)\n .then(() => setStatus('done'))\n .catch(() => setStatus('error'));\n },\n // Ignore options changes since it won't trigger a new load.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [url],\n );\n\n return status;\n}\n\ntype ScriptState = 'loading' | 'done' | 'error';\n"],"mappings":";;;;AAEA,IAAM,iBAAmD,EAAE;AAQ3D,SAAgB,WACd,KACA,SACkB;CAClB,MAAM,iBAAiB,eAAe;AAGtC,KAAI,eACF,QAAO;CAGT,MAAM,UAAU,IAAI,SAAkB,SAAS,WAAW;EACxD,MAAM,SAAS,SAAS,cAAc,SAAS;AAC/C,MAAI,SAAS,OACX,QAAO,OAAO;MAEd,QAAO,OAAO;EAEhB,MAAM,aAAa,SAAS;AAC5B,MAAI,WACF,QAAO,KAAK,WAAW,CAAC,SAAS,QAAQ;AACvC,UAAO,aAAa,KAAK,WAAW,KAAK;IACzC;AAGJ,SAAO,MAAM;AACb,SAAO,eAAqB;AAC1B,WAAQ,KAAK;;AAEf,SAAO,gBAAsB;AAC3B,UAAO,MAAM;;AAEf,MAAI,SAAS,OAAO,OAClB,UAAS,KAAK,YAAY,OAAO;MAEjC,UAAS,KAAK,YAAY,OAAO;GAEnC;AAEF,gBAAe,OAAO;AAEtB,QAAO;;;;;;AAUT,SAAgB,cACd,KACA,SACa;CACb,MAAM,CAAC,QAAQ,cAAA,GAAA,MAAA,UAAmC,UAAU;AAE5D,EAAA,GAAA,MAAA,iBACQ;AACJ,aAAW,KAAK,QAAQ,CACrB,WAAW,UAAU,OAAO,CAAC,CAC7B,YAAY,UAAU,QAAQ,CAAC;IAIpC,CAAC,IAAI,CACN;AAED,QAAO"}
|
|
@@ -8,6 +8,10 @@ function loadScript(src, options) {
|
|
|
8
8
|
const script = document.createElement("script");
|
|
9
9
|
if (options?.module) script.type = "module";
|
|
10
10
|
else script.type = "text/javascript";
|
|
11
|
+
const attributes = options?.attributes;
|
|
12
|
+
if (attributes) Object.keys(attributes).forEach((key) => {
|
|
13
|
+
script.setAttribute(key, attributes[key]);
|
|
14
|
+
});
|
|
11
15
|
script.src = src;
|
|
12
16
|
script.onload = () => {
|
|
13
17
|
resolve(true);
|
|
@@ -17,10 +21,6 @@ function loadScript(src, options) {
|
|
|
17
21
|
};
|
|
18
22
|
if (options?.in === "head") document.head.appendChild(script);
|
|
19
23
|
else document.body.appendChild(script);
|
|
20
|
-
const attributes = options?.attributes;
|
|
21
|
-
if (attributes) Object.keys(attributes).forEach((key) => {
|
|
22
|
-
script.setAttribute(key, attributes[key]);
|
|
23
|
-
});
|
|
24
24
|
});
|
|
25
25
|
SCRIPTS_LOADED[src] = promise;
|
|
26
26
|
return promise;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"load-script.mjs","names":[],"sources":["../../src/load-script.tsx"],"sourcesContent":["import {useState, useEffect} from 'react';\n\nconst SCRIPTS_LOADED: Record<string, Promise<boolean>> = {};\n\ntype LoadScriptOptions = {\n module?: boolean;\n in?: 'head' | 'body';\n attributes?: Record<string, string>;\n};\n\nexport function loadScript(\n src: string,\n options?: LoadScriptOptions,\n): Promise<boolean> {\n const isScriptLoaded = SCRIPTS_LOADED[src];\n\n // eslint-disable-next-line @typescript-eslint/no-misused-promises\n if (isScriptLoaded) {\n return isScriptLoaded;\n }\n\n const promise = new Promise<boolean>((resolve, reject) => {\n const script = document.createElement('script');\n if (options?.module) {\n script.type = 'module';\n } else {\n script.type = 'text/javascript';\n }\n script.src = src;\n script.onload = (): void => {\n resolve(true);\n };\n script.onerror = (): void => {\n reject(false);\n };\n if (options?.in === 'head') {\n document.head.appendChild(script);\n } else {\n document.body.appendChild(script);\n }\n
|
|
1
|
+
{"version":3,"file":"load-script.mjs","names":[],"sources":["../../src/load-script.tsx"],"sourcesContent":["import {useState, useEffect} from 'react';\n\nconst SCRIPTS_LOADED: Record<string, Promise<boolean>> = {};\n\ntype LoadScriptOptions = {\n module?: boolean;\n in?: 'head' | 'body';\n attributes?: Record<string, string>;\n};\n\nexport function loadScript(\n src: string,\n options?: LoadScriptOptions,\n): Promise<boolean> {\n const isScriptLoaded = SCRIPTS_LOADED[src];\n\n // eslint-disable-next-line @typescript-eslint/no-misused-promises\n if (isScriptLoaded) {\n return isScriptLoaded;\n }\n\n const promise = new Promise<boolean>((resolve, reject) => {\n const script = document.createElement('script');\n if (options?.module) {\n script.type = 'module';\n } else {\n script.type = 'text/javascript';\n }\n const attributes = options?.attributes;\n if (attributes) {\n Object.keys(attributes).forEach((key) => {\n script.setAttribute(key, attributes[key]);\n });\n }\n\n script.src = src;\n script.onload = (): void => {\n resolve(true);\n };\n script.onerror = (): void => {\n reject(false);\n };\n if (options?.in === 'head') {\n document.head.appendChild(script);\n } else {\n document.body.appendChild(script);\n }\n });\n\n SCRIPTS_LOADED[src] = promise;\n\n return promise;\n}\n\n/** @publicDocs */\nexport type LoadScriptParams = Parameters<typeof loadScript>;\n\n/**\n * The `useLoadScript` hook loads an external script tag in the browser. It allows React components to lazy-load large third-party dependencies.\n * @publicDocs\n */\nexport function useLoadScript(\n url: LoadScriptParams[0],\n options?: LoadScriptParams[1],\n): ScriptState {\n const [status, setStatus] = useState<ScriptState>('loading');\n\n useEffect(\n () => {\n loadScript(url, options)\n .then(() => setStatus('done'))\n .catch(() => setStatus('error'));\n },\n // Ignore options changes since it won't trigger a new load.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [url],\n );\n\n return status;\n}\n\ntype ScriptState = 'loading' | 'done' | 'error';\n"],"mappings":";;AAEA,IAAM,iBAAmD,EAAE;AAQ3D,SAAgB,WACd,KACA,SACkB;CAClB,MAAM,iBAAiB,eAAe;AAGtC,KAAI,eACF,QAAO;CAGT,MAAM,UAAU,IAAI,SAAkB,SAAS,WAAW;EACxD,MAAM,SAAS,SAAS,cAAc,SAAS;AAC/C,MAAI,SAAS,OACX,QAAO,OAAO;MAEd,QAAO,OAAO;EAEhB,MAAM,aAAa,SAAS;AAC5B,MAAI,WACF,QAAO,KAAK,WAAW,CAAC,SAAS,QAAQ;AACvC,UAAO,aAAa,KAAK,WAAW,KAAK;IACzC;AAGJ,SAAO,MAAM;AACb,SAAO,eAAqB;AAC1B,WAAQ,KAAK;;AAEf,SAAO,gBAAsB;AAC3B,UAAO,MAAM;;AAEf,MAAI,SAAS,OAAO,OAClB,UAAS,KAAK,YAAY,OAAO;MAEjC,UAAS,KAAK,YAAY,OAAO;GAEnC;AAEF,gBAAe,OAAO;AAEtB,QAAO;;;;;;AAUT,SAAgB,cACd,KACA,SACa;CACb,MAAM,CAAC,QAAQ,aAAa,SAAsB,UAAU;AAE5D,iBACQ;AACJ,aAAW,KAAK,QAAQ,CACrB,WAAW,UAAU,OAAO,CAAC,CAC7B,YAAY,UAAU,QAAQ,CAAC;IAIpC,CAAC,IAAI,CACN;AAED,QAAO"}
|