@numueg/theme-sdk 0.4.0 → 0.5.1

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/index.cjs CHANGED
@@ -9,7 +9,7 @@ var MAX_BLOCK_DEPTH = 5;
9
9
 
10
10
  // src/validation/index.ts
11
11
  var THEME_CONTRACT_VERSION = 1;
12
- var SDK_VERSION = "0.4.0" ;
12
+ var SDK_VERSION = "0.5.1" ;
13
13
  var REQUIRED_TEMPLATES = [
14
14
  "home",
15
15
  "product",
@@ -709,7 +709,7 @@ function useOrder(id) {
709
709
  const [tick, setTick] = react.useState(0);
710
710
  react.useEffect(() => {
711
711
  if (typeof window === "undefined") return;
712
- if (!customer || !id) {
712
+ if (!id) {
713
713
  setOrder(null);
714
714
  setError(null);
715
715
  setLoading(false);
@@ -720,14 +720,15 @@ function useOrder(id) {
720
720
  setError(null);
721
721
  void (async () => {
722
722
  try {
723
- const res = await fetch(
724
- `/api/customer/me/orders/${encodeURIComponent(id)}`,
725
- {
726
- method: "GET",
727
- credentials: "include",
728
- cache: "no-store"
729
- }
730
- );
723
+ const trackUrl = `/api/storefront/track/${encodeURIComponent(id)}`;
724
+ let res = customer ? await fetch(`/api/customer/me/orders/${encodeURIComponent(id)}`, {
725
+ method: "GET",
726
+ credentials: "include",
727
+ cache: "no-store"
728
+ }) : await fetch(trackUrl, { cache: "no-store" });
729
+ if (!res.ok && customer) {
730
+ res = await fetch(trackUrl, { cache: "no-store" });
731
+ }
731
732
  if (!res.ok) throw new Error(`HTTP ${res.status}`);
732
733
  const body = unwrap(await res.json());
733
734
  if (cancelled) return;
@@ -2330,6 +2331,64 @@ function NuMuProvider({
2330
2331
  function ProductProvider({ product, children }) {
2331
2332
  return /* @__PURE__ */ jsxRuntime.jsx(ProductContext.Provider, { value: product, children });
2332
2333
  }
2334
+ function CollectionProvider({ collection, children }) {
2335
+ return /* @__PURE__ */ jsxRuntime.jsx(CollectionContext.Provider, { value: collection, children });
2336
+ }
2337
+
2338
+ // src/utils/logoStyle.ts
2339
+ var LOGO_SHAPE_OPTIONS = [
2340
+ { value: "none", label: "Original", label_ar: "\u0627\u0644\u0623\u0635\u0644\u064A" },
2341
+ { value: "square", label: "Square", label_ar: "\u0645\u0631\u0628\u0639" },
2342
+ { value: "rounded", label: "Rounded square", label_ar: "\u0645\u0631\u0628\u0639 \u0628\u0632\u0648\u0627\u064A\u0627 \u062F\u0627\u0626\u0631\u064A\u0629" },
2343
+ { value: "circle", label: "Circle", label_ar: "\u062F\u0627\u0626\u0631\u0629" },
2344
+ { value: "triangle", label: "Triangle", label_ar: "\u0645\u062B\u0644\u062B" }
2345
+ ];
2346
+ var LOGO_SIZE_OPTIONS = [
2347
+ { value: "small", label: "Small", label_ar: "\u0635\u063A\u064A\u0631" },
2348
+ { value: "medium", label: "Medium", label_ar: "\u0645\u062A\u0648\u0633\u0637" },
2349
+ { value: "large", label: "Large", label_ar: "\u0643\u0628\u064A\u0631" }
2350
+ ];
2351
+ var SHAPED_PX = {
2352
+ small: { plain: 32, rounded: 48 },
2353
+ medium: { plain: 40, rounded: 64 },
2354
+ large: { plain: 56, rounded: 80 }
2355
+ };
2356
+ function normalizeSize(size) {
2357
+ return size === "large" || size === "medium" ? size : "small";
2358
+ }
2359
+ function logoImgStyle(shape, size) {
2360
+ if (!shape || shape === "none") return void 0;
2361
+ const s = normalizeSize(size);
2362
+ const isRound = shape === "circle" || shape === "rounded";
2363
+ const px = isRound ? SHAPED_PX[s].rounded : SHAPED_PX[s].plain;
2364
+ const base = {
2365
+ height: px,
2366
+ width: px,
2367
+ objectFit: "cover",
2368
+ flex: "0 0 auto"
2369
+ };
2370
+ switch (shape) {
2371
+ case "circle":
2372
+ return { ...base, borderRadius: "9999px" };
2373
+ case "rounded":
2374
+ return { ...base, borderRadius: "0.5rem" };
2375
+ case "triangle":
2376
+ return { ...base, clipPath: "polygon(50% 0%, 100% 100%, 0% 100%)" };
2377
+ case "square":
2378
+ default:
2379
+ return base;
2380
+ }
2381
+ }
2382
+ function logoStyleTokens(shape, size) {
2383
+ const style = logoImgStyle(shape, size);
2384
+ if (!style) return {};
2385
+ const box = `${style.height}px`;
2386
+ return {
2387
+ "--theme-logo-box": box,
2388
+ "--theme-logo-radius": typeof style.borderRadius === "string" ? style.borderRadius : "0",
2389
+ "--theme-logo-clip": typeof style.clipPath === "string" ? style.clipPath : "none"
2390
+ };
2391
+ }
2333
2392
 
2334
2393
  // src/utils/styleTokens.ts
2335
2394
  var COLOR_ROLE_ALIASES = {
@@ -2470,6 +2529,12 @@ function computeGlobalStyleTokens(globalSettings) {
2470
2529
  pushHref(FONT_REGISTRY[value]?.href);
2471
2530
  }
2472
2531
  }
2532
+ const gs = globalSettings;
2533
+ const logoTokens = logoStyleTokens(
2534
+ typeof gs.logo_shape === "string" ? gs.logo_shape : void 0,
2535
+ typeof gs.logo_size === "string" ? gs.logo_size : void 0
2536
+ );
2537
+ for (const [k, v] of Object.entries(logoTokens)) cssVars[k] = v;
2473
2538
  return { cssVars, fontHrefs };
2474
2539
  }
2475
2540
  function applyGlobalStyleTokens(globalSettings, el) {
@@ -2512,6 +2577,16 @@ function pickDemo(ctx, themeSettings) {
2512
2577
  const t = themeSettings.templates;
2513
2578
  return !t || Object.keys(t).length === 0;
2514
2579
  }
2580
+ function wrapEntityProviders(app, pageData) {
2581
+ let inner = app;
2582
+ if (pageData.collection) {
2583
+ inner = /* @__PURE__ */ jsxRuntime.jsx(CollectionProvider, { collection: pageData.collection, children: inner });
2584
+ }
2585
+ if (pageData.product) {
2586
+ inner = /* @__PURE__ */ jsxRuntime.jsx(ProductProvider, { product: pageData.product, children: inner });
2587
+ }
2588
+ return inner;
2589
+ }
2515
2590
  var ThemeMountBridge = react.forwardRef(function ThemeMountBridge2({ ctx, mountEl, renderApp }, ref) {
2516
2591
  const [themeSettings, setThemeSettings] = react.useState(
2517
2592
  ctx.themeSettings
@@ -2552,7 +2627,7 @@ var ThemeMountBridge = react.forwardRef(function ThemeMountBridge2({ ctx, mountE
2552
2627
  initialProducts: pageData.products,
2553
2628
  initialCollections: pageData.collections,
2554
2629
  currentTemplate: template,
2555
- children: pageData.product ? /* @__PURE__ */ jsxRuntime.jsx(ProductProvider, { product: pageData.product, children: app }) : app
2630
+ children: wrapEntityProviders(app, pageData)
2556
2631
  }
2557
2632
  );
2558
2633
  });
@@ -2588,9 +2663,6 @@ function defineThemeEntry(renderApp) {
2588
2663
  createApp: (ctx) => buildThemeElement(ctx, null, renderApp)
2589
2664
  };
2590
2665
  }
2591
- function CollectionProvider({ collection, children }) {
2592
- return /* @__PURE__ */ jsxRuntime.jsx(CollectionContext.Provider, { value: collection, children });
2593
- }
2594
2666
  function Money({
2595
2667
  amount,
2596
2668
  currency,
@@ -2741,6 +2813,43 @@ function Image({
2741
2813
  }
2742
2814
  );
2743
2815
  }
2816
+ var str = (v) => typeof v === "string" ? v : "";
2817
+ var NONE_HEIGHT = { small: 28, medium: 36, large: 48 };
2818
+ function Logo({
2819
+ src,
2820
+ alt,
2821
+ shape,
2822
+ size,
2823
+ className,
2824
+ style,
2825
+ fallback
2826
+ }) {
2827
+ const settings = useThemeSettings();
2828
+ const shop = useShop();
2829
+ const g = settings?.global_settings ?? {};
2830
+ const url = str(src) || str(g.logo_url) || shop?.logo_url || "";
2831
+ const resolvedShape = shape || str(g.logo_shape) || "none";
2832
+ const resolvedSize = size || str(g.logo_size) || "small";
2833
+ const altText = alt || str(g.brand_name) || shop?.name || "";
2834
+ if (!url) return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: fallback ?? null });
2835
+ const shaped = resolvedShape !== "none";
2836
+ const imgStyle = shaped ? { ...logoImgStyle(resolvedShape, resolvedSize), ...style } : {
2837
+ height: NONE_HEIGHT[resolvedSize] ?? NONE_HEIGHT.small,
2838
+ width: "auto",
2839
+ objectFit: "contain",
2840
+ ...style
2841
+ };
2842
+ return /* @__PURE__ */ jsxRuntime.jsx(
2843
+ "img",
2844
+ {
2845
+ src: url,
2846
+ alt: altText,
2847
+ className,
2848
+ style: imgStyle,
2849
+ loading: "eager"
2850
+ }
2851
+ );
2852
+ }
2744
2853
  var ABSOLUTE_URL = /^[a-z]+:|^\/\//i;
2745
2854
  function Link({ to, children, ...rest }) {
2746
2855
  const shop = useShop();
@@ -3968,9 +4077,12 @@ exports.IconMap = IconMap;
3968
4077
  exports.Image = Image;
3969
4078
  exports.KNOWN_SETTING_TYPES = KNOWN_SETTING_TYPES;
3970
4079
  exports.KNOWN_TEMPLATES = KNOWN_TEMPLATES;
4080
+ exports.LOGO_SHAPE_OPTIONS = LOGO_SHAPE_OPTIONS;
4081
+ exports.LOGO_SIZE_OPTIONS = LOGO_SIZE_OPTIONS;
3971
4082
  exports.Link = Link;
3972
4083
  exports.LocaleSwitcher = LocaleSwitcher;
3973
4084
  exports.LocalizationContext = LocalizationContext;
4085
+ exports.Logo = Logo;
3974
4086
  exports.MAX_BLOCK_DEPTH = MAX_BLOCK_DEPTH;
3975
4087
  exports.Money = Money;
3976
4088
  exports.NavigationContext = NavigationContext;
@@ -4012,6 +4124,8 @@ exports.isDefinedBlock = isDefinedBlock;
4012
4124
  exports.isDefinedSection = isDefinedSection;
4013
4125
  exports.isDynamicSource = isDynamicSource;
4014
4126
  exports.isSdkAvailable = isSdkAvailable;
4127
+ exports.logoImgStyle = logoImgStyle;
4128
+ exports.logoStyleTokens = logoStyleTokens;
4015
4129
  exports.mergeResults = mergeResults;
4016
4130
  exports.mountTheme = mountTheme;
4017
4131
  exports.pickTranslations = pickTranslations;