@salla.sa/twilight-theme-engine 1.0.0-beta.4

package/dist/chunk-2KF5JJU6.js

@@ -0,0 +1,169 @@
+import { lazy, memo, use, Suspense } from 'react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+export { BlogSkeleton, BreadcrumbSkeleton, CustomerLayoutSkeleton, CustomerPageSkeleton, PageSkeleton, ProductCardSkeleton, ProductDetailSkeleton, ProductGridSkeleton, SkeletonPulse } from '@salla.sa/twilight-components-react';
+
+// src/components/common/lazy.ts
+var LazyBreadcrumb = lazy(
+  () => import('./Breadcrumb-N32QFMVK.js').then((m) => ({ default: m.Breadcrumb }))
+);
+var LazyNoContent = lazy(
+  () => import('./NoContent-PBGESHBJ.js').then((m) => ({ default: m.NoContent }))
+);
+var LazyRenderWhenVisible = lazy(
+  () => import('./RenderWhenVisible-TR7G2KUC.js').then((m) => ({ default: m.RenderWhenVisible }))
+);
+var LazyCurrencySymbol = lazy(
+  () => import('./CurrencySymbol-TARAYUOT.js').then((m) => ({ default: m.CurrencySymbol }))
+);
+var LazyErrorPage = lazy(
+  () => import('./ErrorPage-TK4U3ENF.js').then((m) => ({ default: m.ErrorPage }))
+);
+
+// src/utils/cdn-image.ts
+var CDN_HOSTS = ["cdn.salla.sa", "cdn.salla.network", "cdn.files.salla.network"];
+function getCdnImageUrl(url, options) {
+  if (!url) return url;
+  try {
+    const parsed = new URL(url);
+    if (!CDN_HOSTS.includes(parsed.hostname)) return url;
+    if (parsed.pathname.startsWith("/cdn-cgi/image/")) return url;
+    const w = options.width ? Number(options.width) : void 0;
+    const h = options.height ? Number(options.height) : void 0;
+    if (!w && !h) return url;
+    const parts = ["fit=scale-down", "onerror=redirect", "format=auto"];
+    if (w) parts.push(`width=${w}`);
+    if (h) parts.push(`height=${h}`);
+    return `${parsed.origin}/cdn-cgi/image/${parts.join(",")}${parsed.pathname}${parsed.search}`;
+  } catch {
+    return url;
+  }
+}
+var Image = memo(function Image2({
+  src,
+  alt,
+  priority = false,
+  aspectRatio,
+  objectFit = "cover",
+  mobileSrc,
+  mobileBreakpoint = 768,
+  noWrapper = false,
+  className = "",
+  style,
+  width,
+  height,
+  ...rest
+}) {
+  if (!src) return null;
+  const optimizedSrc = getCdnImageUrl(src, { width, height });
+  const optimizedMobileSrc = getCdnImageUrl(mobileSrc, { width, height });
+  const objectFitClass = `object-${objectFit}`;
+  const imgClasses = [className, objectFitClass].filter(Boolean).join(" ");
+  const loadingProps = priority ? { loading: "eager", fetchPriority: "high", decoding: "sync" } : { loading: "lazy", decoding: "async" };
+  const imgElement = optimizedMobileSrc ? /* @__PURE__ */ jsxs("picture", { children: [
+    /* @__PURE__ */ jsx("source", { media: `(max-width: ${mobileBreakpoint}px)`, srcSet: optimizedMobileSrc }),
+    /* @__PURE__ */ jsx(
+      "img",
+      {
+        src: optimizedSrc,
+        alt,
+        className: imgClasses,
+        width,
+        height,
+        ...loadingProps,
+        ...rest
+      }
+    )
+  ] }) : /* @__PURE__ */ jsx(
+    "img",
+    {
+      src: optimizedSrc,
+      alt,
+      className: imgClasses,
+      width,
+      height,
+      ...loadingProps,
+      ...rest
+    }
+  );
+  if (noWrapper || !aspectRatio) {
+    return imgElement;
+  }
+  return /* @__PURE__ */ jsx("div", { className: "relative overflow-hidden", style: { aspectRatio, ...style }, children: imgElement });
+});
+var DEFERRED_KEY = /* @__PURE__ */ Symbol.for("twilight.deferred");
+var seenPromises = typeof WeakSet !== "undefined" ? /* @__PURE__ */ new WeakSet() : null;
+function defer(promise) {
+  const existing = promise[DEFERRED_KEY];
+  if (existing) return promise;
+  const state = { status: "pending" };
+  const deferred = promise;
+  deferred[DEFERRED_KEY] = state;
+  promise.then(
+    (value) => {
+      state.status = "success";
+      state.value = value;
+    },
+    (error) => {
+      state.status = "error";
+      state.error = error;
+    }
+  );
+  return deferred;
+}
+var DeferredRenderer = memo(function DeferredRenderer2({
+  promise,
+  children
+}) {
+  const state = promise[DEFERRED_KEY];
+  if (state?.status === "success") {
+    return children(state.value);
+  }
+  if (state?.status === "error") {
+    throw state.error;
+  }
+  const data = use(promise);
+  return children(data);
+});
+function DeferredFallback({
+  promise,
+  fallback,
+  children
+}) {
+  const state = promise[DEFERRED_KEY];
+  if (state?.status === "success") {
+    return children(state.value);
+  }
+  return /* @__PURE__ */ jsx(Fragment, { children: fallback });
+}
+function resolveDeferred(promiseOrValue) {
+  if (promiseOrValue == null || !(promiseOrValue instanceof Promise)) return promiseOrValue;
+  const deferred = defer(promiseOrValue);
+  const state = deferred[DEFERRED_KEY];
+  if (state?.status === "success") return state.value;
+  return promiseOrValue;
+}
+function DeferredData({ promise, fallback, children }) {
+  if (!(promise instanceof Promise)) {
+    return children(promise);
+  }
+  if (seenPromises && promise instanceof Promise) seenPromises.add(promise);
+  const deferred = defer(promise);
+  const state = deferred[DEFERRED_KEY];
+  if (state?.status === "success") {
+    return children(state.value);
+  }
+  if (state?.status === "error") {
+    throw state.error;
+  }
+  return /* @__PURE__ */ jsx(
+    Suspense,
+    {
+      fallback: /* @__PURE__ */ jsx(DeferredFallback, { promise: deferred, fallback, children }),
+      children: /* @__PURE__ */ jsx(DeferredRenderer, { promise: deferred, children })
+    }
+  );
+}
+
+export { DeferredData, Image, LazyBreadcrumb, LazyCurrencySymbol, LazyErrorPage, LazyNoContent, LazyRenderWhenVisible, resolveDeferred };
+//# sourceMappingURL=chunk-2KF5JJU6.js.map
+//# sourceMappingURL=chunk-2KF5JJU6.js.map

package/dist/chunk-2KF5JJU6.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/common/lazy.ts","../src/utils/cdn-image.ts","../src/components/common/Image.tsx","../src/components/common/DeferredData.tsx"],"names":["Image","memo","DeferredRenderer","jsx"],"mappings":"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","file":"chunk-2KF5JJU6.js","sourcesContent":["import { lazy } from 'react';\n\n/**\n * Lazy-loaded common components\n * Use these for code-splitting non-critical components\n *\n * NOTE: Skeleton components are sourced from @salla.sa/twilight-components-react\n * because they must render instantly during route transitions.\n */\nexport const LazyBreadcrumb = lazy(() =>\n  import('./Breadcrumb').then((m) => ({ default: m.Breadcrumb }))\n);\n\nexport const LazyNoContent = lazy(() =>\n  import('./NoContent').then((m) => ({ default: m.NoContent }))\n);\n\nexport const LazyRenderWhenVisible = lazy(() =>\n  import('./RenderWhenVisible').then((m) => ({ default: m.RenderWhenVisible }))\n);\n\nexport const LazyCurrencySymbol = lazy(() =>\n  import('./CurrencySymbol').then((m) => ({ default: m.CurrencySymbol }))\n);\n\nexport const LazyErrorPage = lazy(() =>\n  import('./ErrorPage').then((m) => ({ default: m.ErrorPage }))\n);\n","const CDN_HOSTS = ['cdn.salla.sa', 'cdn.salla.network', 'cdn.files.salla.network'];\n\nexport function getCdnImageUrl(\n  url: string | undefined,\n  options: { width?: number | string; height?: number | string }\n): string | undefined {\n  if (!url) return url;\n\n  try {\n    const parsed = new URL(url);\n    if (!CDN_HOSTS.includes(parsed.hostname)) return url;\n    if (parsed.pathname.startsWith('/cdn-cgi/image/')) return url;\n\n    const w = options.width ? Number(options.width) : undefined;\n    const h = options.height ? Number(options.height) : undefined;\n    if (!w && !h) return url;\n\n    const parts: string[] = ['fit=scale-down', 'onerror=redirect', 'format=auto'];\n    if (w) parts.push(`width=${w}`);\n    if (h) parts.push(`height=${h}`);\n\n    return `${parsed.origin}/cdn-cgi/image/${parts.join(',')}${parsed.pathname}${parsed.search}`;\n  } catch {\n    return url;\n  }\n}\n","import { memo } from 'react';\nimport { getCdnImageUrl } from '../../utils/cdn-image';\n\nexport interface ImageProps extends React.ImgHTMLAttributes<HTMLImageElement> {\n  /** Image source URL */\n  src?: string;\n  /** Alt text for accessibility */\n  alt: string;\n  /** Whether this image is above the fold / LCP candidate */\n  priority?: boolean;\n  /** Aspect ratio for CLS prevention (e.g. \"16/9\", \"1/1\", \"4/3\") */\n  aspectRatio?: string;\n  /** Object fit mode */\n  objectFit?: 'cover' | 'contain' | 'fill' | 'none' | 'scale-down';\n  /** Mobile image source for <picture> element */\n  mobileSrc?: string;\n  /** Mobile breakpoint for <source> media query (default: 768px) */\n  mobileBreakpoint?: number;\n  /** Skip the wrapper div */\n  noWrapper?: boolean;\n}\n\n/**\n * Optimized Image component with native browser lazy loading.\n *\n * - Uses `loading=\"lazy\"` + `decoding=\"async\"` by default for below-the-fold images.\n * - Uses `loading=\"eager\"` + `fetchPriority=\"high\"` for priority (above-the-fold / LCP) images.\n * - Supports responsive `<picture>` with mobile source.\n * - Provides `aspectRatio` for CLS prevention.\n */\nexport const Image = memo(function Image({\n  src,\n  alt,\n  priority = false,\n  aspectRatio,\n  objectFit = 'cover',\n  mobileSrc,\n  mobileBreakpoint = 768,\n  noWrapper = false,\n  className = '',\n  style,\n  width,\n  height,\n  ...rest\n}: ImageProps) {\n  if (!src) return null;\n\n  const optimizedSrc = getCdnImageUrl(src, { width, height });\n  const optimizedMobileSrc = getCdnImageUrl(mobileSrc, { width, height });\n\n  const objectFitClass = `object-${objectFit}`;\n  const imgClasses = [className, objectFitClass].filter(Boolean).join(' ');\n\n  const loadingProps: React.ImgHTMLAttributes<HTMLImageElement> = priority\n    ? { loading: 'eager' as const, fetchPriority: 'high' as const, decoding: 'sync' as const }\n    : { loading: 'lazy' as const, decoding: 'async' as const };\n\n  const imgElement = optimizedMobileSrc ? (\n    <picture>\n      <source media={`(max-width: ${mobileBreakpoint}px)`} srcSet={optimizedMobileSrc} />\n      <img\n        src={optimizedSrc}\n        alt={alt}\n        className={imgClasses}\n        width={width}\n        height={height}\n        {...loadingProps}\n        {...rest}\n      />\n    </picture>\n  ) : (\n    <img\n      src={optimizedSrc}\n      alt={alt}\n      className={imgClasses}\n      width={width}\n      height={height}\n      {...loadingProps}\n      {...rest}\n    />\n  );\n\n  if (noWrapper || !aspectRatio) {\n    return imgElement;\n  }\n\n  return (\n    <div className=\"relative overflow-hidden\" style={{ aspectRatio, ...style }}>\n      {imgElement}\n    </div>\n  );\n});\n","import { Suspense, memo, use, type ReactNode } from 'react';\n\nexport interface DeferredDataProps<T> {\n  promise: Promise<T> | T;\n  fallback: ReactNode;\n  children: (data: T) => ReactNode;\n}\n\nconst DEFERRED_KEY = Symbol.for('twilight.deferred');\n\ninterface DeferredState<T> {\n  status: 'pending' | 'success' | 'error';\n  value?: T;\n  error?: unknown;\n}\n\nexport interface DeferredPromise<T> extends Promise<T> {\n  [DEFERRED_KEY]?: DeferredState<T>;\n}\n\nconst seenPromises = typeof WeakSet !== 'undefined' ? new WeakSet() : null;\n\nexport function defer<T>(promise: Promise<T>): DeferredPromise<T> {\n  const existing = (promise as DeferredPromise<T>)[DEFERRED_KEY];\n  if (existing) return promise as DeferredPromise<T>;\n\n  const state: DeferredState<T> = { status: 'pending' };\n\n  const deferred = promise as DeferredPromise<T>;\n  deferred[DEFERRED_KEY] = state;\n\n  promise.then(\n    (value) => {\n      state.status = 'success';\n      state.value = value;\n    },\n    (error) => {\n      state.status = 'error';\n      state.error = error;\n    },\n  );\n\n  return deferred;\n}\n\nconst DeferredRenderer = memo(function DeferredRenderer<T>({\n  promise,\n  children,\n}: {\n  promise: DeferredPromise<T>;\n  children: (data: T) => ReactNode;\n}) {\n  const state = promise[DEFERRED_KEY];\n\n  if (state?.status === 'success') {\n    return children(state.value!);\n  }\n\n  if (state?.status === 'error') {\n    throw state.error;\n  }\n\n  const data = use(promise);\n  return children(data);\n}) as <T>(props: { promise: DeferredPromise<T>; children: (data: T) => ReactNode }) => ReactNode;\n\nfunction DeferredFallback<T>({\n  promise,\n  fallback,\n  children,\n}: {\n  promise: DeferredPromise<T>;\n  fallback: ReactNode;\n  children: (data: T) => ReactNode;\n}) {\n  const state = promise[DEFERRED_KEY];\n  if (state?.status === 'success') {\n    return children(state.value!);\n  }\n  return <>{fallback}</>;\n}\n\nexport function resolveDeferred<T>(promiseOrValue: Promise<T> | T | undefined): T | Promise<T> | undefined {\n  if (promiseOrValue == null || !(promiseOrValue instanceof Promise)) return promiseOrValue;\n  const deferred = defer(promiseOrValue);\n  const state = deferred[DEFERRED_KEY];\n  if (state?.status === 'success') return state.value as T;\n  return promiseOrValue;\n}\n\nexport function DeferredData<T>({ promise, fallback, children }: DeferredDataProps<T>) {\n  if (!(promise instanceof Promise)) {\n    return children(promise);\n  }\n\n  if (seenPromises && promise instanceof Promise) seenPromises.add(promise);\n\n  const deferred = defer(promise);\n  const state = deferred[DEFERRED_KEY];\n\n  if (state?.status === 'success') {\n    return children(state.value!);\n  }\n\n  if (state?.status === 'error') {\n    throw state.error;\n  }\n\n  return (\n    <Suspense\n      fallback={\n        <DeferredFallback promise={deferred} fallback={fallback}>\n          {children}\n        </DeferredFallback>\n      }\n    >\n      <DeferredRenderer promise={deferred}>{children}</DeferredRenderer>\n    </Suspense>\n  );\n}\n"]}

package/dist/chunk-2TB2LTL2.js

@@ -0,0 +1,103 @@
+import { AUTH_TOKEN_COOKIE_NAME, extractTokenFromCookies, getStoreIdentifier } from './chunk-QYL5OHAV.js';
+import { getTwilightContext } from './chunk-KIPZQN3Y.js';
+import ky from 'ky';
+import { createIsomorphicFn } from '@tanstack/react-start';
+import { getCookie } from '@tanstack/react-start/server';
+
+var readFallbackToken = createIsomorphicFn().server(() => {
+  try {
+    return getCookie(AUTH_TOKEN_COOKIE_NAME) ?? null;
+  } catch {
+    return null;
+  }
+}).client(() => {
+  const fromCookie = typeof document !== "undefined" ? extractTokenFromCookies(document.cookie, AUTH_TOKEN_COOKIE_NAME) : null;
+  if (fromCookie) return fromCookie;
+  const storage = typeof window !== "undefined" ? window.salla?.storage : void 0;
+  const fromStorage = typeof storage?.get === "function" ? storage.get(AUTH_TOKEN_COOKIE_NAME) : null;
+  if (typeof fromStorage === "string" && fromStorage) return fromStorage;
+  const fromSdkApi = typeof window !== "undefined" ? window.salla?.api?.token : void 0;
+  return typeof fromSdkApi === "string" && fromSdkApi ? fromSdkApi : null;
+});
+var getAuthToken = () => getTwilightContext().authToken ?? readFallbackToken();
+var API_HEADERS = {
+  ACCEPT: "accept",
+  ACCEPT_LANGUAGE: "accept-language",
+  APP_OS: "s-app-os",
+  APP_VERSION: "s-app-version",
+  RAY: "s-ray",
+  SOURCE: "s-source",
+  THEME_TYPE: "s-theme-type",
+  STORE_API_VERSION: "s-store-api-version",
+  REQUESTED_WITH: "x-requested-with",
+  CF_PROXY_WHITELIST: "s-cf-proxy-whitelist-id",
+  STORE_IDENTIFIER: "store-identifier",
+  AUTHORIZATION: "Authorization",
+  VERSION_ID: "s-version-id",
+  SCOPE_ID: "s-scope-id"
+};
+var getActiveScopeId = () => {
+  const storage = typeof window !== "undefined" ? window.salla?.storage : void 0;
+  if (typeof storage?.get === "function") {
+    const scope = storage.get("scope");
+    const id = typeof scope === "object" && scope !== null ? scope.id : scope;
+    if (id != null) return String(id);
+  }
+  try {
+    const { scopeId } = getTwilightContext();
+    return scopeId != null ? String(scopeId) : null;
+  } catch {
+    return null;
+  }
+};
+var sharedHeaders = (locale) => ({
+  [API_HEADERS.ACCEPT]: "application/json",
+  [API_HEADERS.ACCEPT_LANGUAGE]: locale,
+  [API_HEADERS.APP_OS]: "browser",
+  [API_HEADERS.APP_VERSION]: "2.14.363",
+  [API_HEADERS.RAY]: "50",
+  [API_HEADERS.SOURCE]: "twilight",
+  [API_HEADERS.THEME_TYPE]: "react",
+  [API_HEADERS.STORE_API_VERSION]: "swoole",
+  [API_HEADERS.REQUESTED_WITH]: "XMLHttpRequest",
+  [API_HEADERS.CF_PROXY_WHITELIST]: "019a2f78-a64c-7edb-proxy-whitelist-id-9a3a-17afda90f03a"
+});
+var api = ky.extend({
+  prefixUrl: "https://api.salla.dev/store/v1",
+  timeout: 8e3,
+  hooks: {
+    beforeRequest: [
+      (request) => {
+        const { locale, authToken } = getTwilightContext();
+        const headers = sharedHeaders(locale);
+        for (const [key, value] of Object.entries(headers)) {
+          request.headers.set(key, value);
+        }
+        request.headers.set(API_HEADERS.STORE_IDENTIFIER, getStoreIdentifier());
+        try {
+          const profileId = getTwilightContext().settings?.theme?.profile?.id;
+          if (profileId != null) {
+            request.headers.set(API_HEADERS.VERSION_ID, String(profileId));
+          }
+        } catch {
+        }
+        const token = authToken ?? readFallbackToken();
+        if (token) {
+          request.headers.set(API_HEADERS.AUTHORIZATION, `Bearer ${token}`);
+        }
+        const scopeId = getActiveScopeId();
+        if (scopeId != null) {
+          request.headers.set(API_HEADERS.SCOPE_ID, scopeId);
+        }
+      }
+    ]
+  }
+});
+var cdn = ky.extend({
+  prefixUrl: "https://cdn.salla.network",
+  timeout: 5e3
+});
+
+export { api, cdn, getActiveScopeId, getAuthToken };
+//# sourceMappingURL=chunk-2TB2LTL2.js.map
+//# sourceMappingURL=chunk-2TB2LTL2.js.map

package/dist/chunk-2TB2LTL2.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/api/client.ts"],"names":[],"mappings":"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","file":"chunk-2TB2LTL2.js","sourcesContent":["import ky from 'ky';\nimport { createIsomorphicFn } from '@tanstack/react-start';\nimport { getCookie } from '@tanstack/react-start/server';\nimport { getStoreIdentifier } from '../utils/sdk-helpers';\nimport { getTwilightContext } from '../twilight/context';\nimport { AUTH_TOKEN_COOKIE_NAME, extractTokenFromCookies } from '../utils/cookies';\n\n// The twilight module store doesn't reliably carry authToken into every scope: on the\n// SERVER workerd has no AsyncLocalStorage, and on BOTH sides this api client can live in a\n// different module instance than the one rootBeforeLoad populates (engine subpath import vs\n// engine-internal relative import). So `getTwilightContext().authToken` is often null even\n// for logged-in users → API calls (orders/customer/…) return `token_not_provided` (400).\n// Read the token directly from the request cookie (server) or document.cookie / salla.storage\n// (client) as a fallback. The server-only import is stripped from the client bundle by\n// createIsomorphicFn.\nconst readFallbackToken = createIsomorphicFn()\n  .server((): string | null => {\n    try {\n      return getCookie(AUTH_TOKEN_COOKIE_NAME) ?? null;\n    } catch {\n      return null;\n    }\n  })\n  .client((): string | null => {\n    const fromCookie =\n      typeof document !== 'undefined'\n        ? extractTokenFromCookies(document.cookie, AUTH_TOKEN_COOKIE_NAME)\n        : null;\n    if (fromCookie) return fromCookie;\n    const storage = typeof window !== 'undefined' ? window.salla?.storage : undefined;\n    const fromStorage =\n      typeof storage?.get === 'function' ? storage.get(AUTH_TOKEN_COOKIE_NAME) : null;\n    if (typeof fromStorage === 'string' && fromStorage) return fromStorage;\n    // `?token=` webview injection lands only on the SDK's axios instance\n    const fromSdkApi = typeof window !== 'undefined' ? window.salla?.api?.token : undefined;\n    return typeof fromSdkApi === 'string' && fromSdkApi ? fromSdkApi : null;\n  });\n\n/**\n * The auth token as the api client sees it: twilight context first, cookie/storage fallback.\n * Use this (not `getTwilightContext().authToken`, which is often null for logged-in users —\n * see the note above) to decide whether an authenticated-only query should run.\n */\nexport const getAuthToken = (): string | null =>\n  getTwilightContext().authToken ?? readFallbackToken();\n\nconst API_HEADERS = {\n  ACCEPT: 'accept',\n  ACCEPT_LANGUAGE: 'accept-language',\n  APP_OS: 's-app-os',\n  APP_VERSION: 's-app-version',\n  RAY: 's-ray',\n  SOURCE: 's-source',\n  THEME_TYPE: 's-theme-type',\n  STORE_API_VERSION: 's-store-api-version',\n  REQUESTED_WITH: 'x-requested-with',\n  CF_PROXY_WHITELIST: 's-cf-proxy-whitelist-id',\n  STORE_IDENTIFIER: 'store-identifier',\n  AUTHORIZATION: 'Authorization',\n  VERSION_ID: 's-version-id',\n  SCOPE_ID: 's-scope-id',\n} as const;\n\n/**\n * Active branch/scope id. On the client it comes from the branch Salla persists\n * in storage (`salla.storage.get('scope').id`); on the server (or before the SDK\n * hydrates storage) it falls back to the id seeded from the `scope` cookie by\n * twilightMiddleware. Requests vary by `s-scope-id`, so React Query keys must\n * include this to avoid serving another scope's cached categories/products.\n */\nexport const getActiveScopeId = (): string | null => {\n  const storage = typeof window !== 'undefined' ? window.salla?.storage : undefined;\n  if (typeof storage?.get === 'function') {\n    const scope = storage.get('scope') as { id?: number | string | null } | number | string | null;\n    const id = typeof scope === 'object' && scope !== null ? scope.id : scope;\n    if (id != null) return String(id);\n  }\n\n  try {\n    const { scopeId } = getTwilightContext();\n    return scopeId != null ? String(scopeId) : null;\n  } catch {\n    return null;\n  }\n};\n\nconst sharedHeaders = (locale: string) => ({\n  [API_HEADERS.ACCEPT]: 'application/json' as const,\n  [API_HEADERS.ACCEPT_LANGUAGE]: locale,\n  [API_HEADERS.APP_OS]: 'browser',\n  [API_HEADERS.APP_VERSION]: '2.14.363',\n  [API_HEADERS.RAY]: '50',\n  [API_HEADERS.SOURCE]: 'twilight',\n  [API_HEADERS.THEME_TYPE]: 'react',\n  [API_HEADERS.STORE_API_VERSION]: 'swoole',\n  [API_HEADERS.REQUESTED_WITH]: 'XMLHttpRequest',\n  [API_HEADERS.CF_PROXY_WHITELIST]: '019a2f78-a64c-7edb-proxy-whitelist-id-9a3a-17afda90f03a',\n});\n\nexport const api = ky.extend({\n  prefixUrl: 'https://api.salla.dev/store/v1',\n  timeout: 8000,\n  hooks: {\n    beforeRequest: [\n      (request) => {\n        const { locale, authToken } = getTwilightContext();\n        const headers = sharedHeaders(locale);\n        for (const [key, value] of Object.entries(headers)) {\n          request.headers.set(key, value);\n        }\n        request.headers.set(API_HEADERS.STORE_IDENTIFIER, getStoreIdentifier());\n\n        try {\n          const profileId = getTwilightContext().settings?.theme?.profile?.id;\n          if (profileId != null) {\n            request.headers.set(API_HEADERS.VERSION_ID, String(profileId));\n          }\n        } catch {\n          // settings not loaded yet — skip VERSION_ID header\n        }\n\n        const token = authToken ?? readFallbackToken();\n        if (token) {\n          request.headers.set(API_HEADERS.AUTHORIZATION, `Bearer ${token}`);\n        }\n\n        const scopeId = getActiveScopeId();\n        if (scopeId != null) {\n          request.headers.set(API_HEADERS.SCOPE_ID, scopeId);\n        }\n      },\n    ],\n  },\n});\n\nexport const cdn = ky.extend({\n  prefixUrl: 'https://cdn.salla.network',\n  timeout: 5000,\n});\n"]}

package/dist/chunk-3DCZJDDK.js

@@ -0,0 +1,10 @@
+import { lazy } from 'react';
+
+// src/components/modal/lazy.ts
+var LazyImageModal = lazy(
+  () => import('./ImageModal-WLJM3WIE.js').then((m) => ({ default: m.ImageModal }))
+);
+
+export { LazyImageModal };
+//# sourceMappingURL=chunk-3DCZJDDK.js.map
+//# sourceMappingURL=chunk-3DCZJDDK.js.map

package/dist/chunk-3DCZJDDK.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/modal/lazy.ts"],"names":[],"mappings":";;;AAOO,IAAM,cAAA,GAAiB,IAAA;AAAA,EAAK,MACjC,OAAO,0BAAc,CAAA,CAAE,IAAA,CAAK,CAAC,CAAA,MAAO,EAAE,OAAA,EAAS,CAAA,CAAE,UAAA,EAAW,CAAE;AAChE","file":"chunk-3DCZJDDK.js","sourcesContent":["import { lazy } from 'react';\n\n/**\n * Lazy-loaded modal components\n * ImageModal is lazy-loaded since it's a standalone component.\n * Modal is kept eager because it uses compound component pattern.\n */\nexport const LazyImageModal = lazy(() =>\n  import('./ImageModal').then((m) => ({ default: m.ImageModal }))\n);\n"]}

package/dist/chunk-3UHSMGPY.js

@@ -0,0 +1,145 @@
+import { useRef, useCallback, useEffect } from 'react';
+import { createPortal } from 'react-dom';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/components/modal/Modal.tsx
+var sizeClasses = {
+  sm: "max-w-sm",
+  md: "max-w-md",
+  lg: "max-w-lg",
+  xl: "max-w-xl",
+  full: "max-w-full mx-4"
+};
+var positionClasses = {
+  center: "items-center",
+  top: "items-start pt-10"
+};
+function Modal({
+  isOpen,
+  onClose,
+  children,
+  closeOnBackdropClick = true,
+  closeOnEscape = true,
+  preventBodyScroll = true,
+  size = "md",
+  position = "center",
+  className
+}) {
+  const modalRef = useRef(null);
+  const previousActiveElement = useRef(null);
+  const handleKeyDown = useCallback(
+    (event) => {
+      if (event.key === "Escape" && closeOnEscape) {
+        onClose();
+      }
+    },
+    [closeOnEscape, onClose]
+  );
+  const handleBackdropClick = useCallback(
+    (event) => {
+      if (closeOnBackdropClick && event.target === event.currentTarget) {
+        onClose();
+      }
+    },
+    [closeOnBackdropClick, onClose]
+  );
+  useEffect(() => {
+    if (isOpen) {
+      previousActiveElement.current = document.activeElement;
+      modalRef.current?.focus();
+      if (preventBodyScroll) {
+        document.body.classList.add("menu-opened");
+      }
+      document.addEventListener("keydown", handleKeyDown);
+    }
+    return () => {
+      document.removeEventListener("keydown", handleKeyDown);
+      if (preventBodyScroll) {
+        document.body.classList.remove("menu-opened");
+      }
+      previousActiveElement.current?.focus();
+    };
+  }, [isOpen, handleKeyDown, preventBodyScroll]);
+  if (!isOpen || typeof document === "undefined") {
+    return null;
+  }
+  return createPortal(
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: `fixed inset-0 z-50 flex justify-center ${positionClasses[position]}`,
+        onClick: handleBackdropClick,
+        "aria-modal": "true",
+        role: "dialog",
+        children: [
+          /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-black/50 transition-opacity" }),
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              ref: modalRef,
+              tabIndex: -1,
+              className: `relative z-10 w-full rounded-lg bg-white shadow-xl transform transition-all duration-200 ease-out ${sizeClasses[size]} ${isOpen ? "scale-100 opacity-100" : "scale-95 opacity-0"} ${className || ""}`,
+              children
+            }
+          )
+        ]
+      }
+    ),
+    document.body
+  );
+}
+Modal.Header = function ModalHeader({
+  children,
+  showCloseButton = true,
+  onClose,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `flex items-center justify-between border-b border-gray-200 px-6 py-4 ${className || ""}`,
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold text-gray-900", children }),
+        showCloseButton && onClose && /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: onClose,
+            className: "rounded-md text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-gray-500",
+            children: [
+              /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" }),
+              /* @__PURE__ */ jsx("svg", { className: "h-6 w-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx(
+                "path",
+                {
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  strokeWidth: 2,
+                  d: "M6 18L18 6M6 6l12 12"
+                }
+              ) })
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
+Modal.Body = function ModalBody({ children, className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { className: `px-6 py-4 ${className || ""}`, ...props, children });
+};
+Modal.Footer = function ModalFooter({ children, className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: `flex items-center justify-end gap-3 border-t border-gray-200 px-6 py-4 ${className || ""}`,
+      ...props,
+      children
+    }
+  );
+};
+
+export { Modal };
+//# sourceMappingURL=chunk-3UHSMGPY.js.map
+//# sourceMappingURL=chunk-3UHSMGPY.js.map

package/dist/chunk-3UHSMGPY.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/modal/Modal.tsx"],"names":[],"mappings":"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","file":"chunk-3UHSMGPY.js","sourcesContent":["/**\n * Modal Component\n *\n * A controlled modal dialog with backdrop, close button, and keyboard support.\n *\n * @example\n * ```tsx\n * function MyComponent() {\n *   const [isOpen, setIsOpen] = useState(false);\n *\n *   return (\n *     <>\n *       <button onClick={() => setIsOpen(true)}>Open Modal</button>\n *       <Modal isOpen={isOpen} onClose={() => setIsOpen(false)}>\n *         <Modal.Header>Modal Title</Modal.Header>\n *         <Modal.Body>Modal content here</Modal.Body>\n *         <Modal.Footer>\n *           <Button onClick={() => setIsOpen(false)}>Close</Button>\n *         </Modal.Footer>\n *       </Modal>\n *     </>\n *   );\n * }\n * ```\n */\n\nimport React, { useEffect, useCallback, useRef, type ReactNode, type HTMLAttributes } from 'react';\nimport { createPortal } from 'react-dom';\n\nexport interface ModalProps {\n  isOpen: boolean;\n  onClose: () => void;\n  children: ReactNode;\n  /**\n   * Close modal when clicking backdrop\n   * @default true\n   */\n  closeOnBackdropClick?: boolean;\n  /**\n   * Close modal on Escape key\n   * @default true\n   */\n  closeOnEscape?: boolean;\n  /**\n   * Prevent body scroll when modal is open\n   * @default true\n   */\n  preventBodyScroll?: boolean;\n  /**\n   * Size of the modal\n   * @default 'md'\n   */\n  size?: 'sm' | 'md' | 'lg' | 'xl' | 'full';\n  /**\n   * Position of the modal\n   * @default 'center'\n   */\n  position?: 'center' | 'top';\n  /**\n   * Additional className for the modal content\n   */\n  className?: string;\n}\n\nconst sizeClasses = {\n  sm: 'max-w-sm',\n  md: 'max-w-md',\n  lg: 'max-w-lg',\n  xl: 'max-w-xl',\n  full: 'max-w-full mx-4',\n};\n\nconst positionClasses = {\n  center: 'items-center',\n  top: 'items-start pt-10',\n};\n\nexport function Modal({\n  isOpen,\n  onClose,\n  children,\n  closeOnBackdropClick = true,\n  closeOnEscape = true,\n  preventBodyScroll = true,\n  size = 'md',\n  position = 'center',\n  className,\n}: ModalProps) {\n  const modalRef = useRef<HTMLDivElement>(null);\n  const previousActiveElement = useRef<HTMLElement | null>(null);\n\n  // Handle Escape key\n  const handleKeyDown = useCallback(\n    (event: KeyboardEvent) => {\n      if (event.key === 'Escape' && closeOnEscape) {\n        onClose();\n      }\n    },\n    [closeOnEscape, onClose]\n  );\n\n  // Handle backdrop click\n  const handleBackdropClick = useCallback(\n    (event: React.MouseEvent) => {\n      if (closeOnBackdropClick && event.target === event.currentTarget) {\n        onClose();\n      }\n    },\n    [closeOnBackdropClick, onClose]\n  );\n\n  // Focus management and body scroll\n  useEffect(() => {\n    if (isOpen) {\n      // Store the previously focused element\n      previousActiveElement.current = document.activeElement as HTMLElement;\n\n      // Focus the modal\n      modalRef.current?.focus();\n\n      // Prevent body scroll\n      if (preventBodyScroll) {\n        document.body.classList.add('menu-opened');\n      }\n\n      // Add keyboard listener\n      document.addEventListener('keydown', handleKeyDown);\n    }\n\n    return () => {\n      document.removeEventListener('keydown', handleKeyDown);\n\n      // Restore body scroll\n      if (preventBodyScroll) {\n        document.body.classList.remove('menu-opened');\n      }\n\n      // Restore focus\n      previousActiveElement.current?.focus();\n    };\n  }, [isOpen, handleKeyDown, preventBodyScroll]);\n\n  if (!isOpen || typeof document === 'undefined') {\n    return null;\n  }\n\n  return createPortal(\n    <div\n      className={`fixed inset-0 z-50 flex justify-center ${positionClasses[position]}`}\n      onClick={handleBackdropClick}\n      aria-modal=\"true\"\n      role=\"dialog\"\n    >\n      {/* Backdrop */}\n      <div className=\"absolute inset-0 bg-black/50 transition-opacity\" />\n\n      {/* Modal Content */}\n      <div\n        ref={modalRef}\n        tabIndex={-1}\n        className={`relative z-10 w-full rounded-lg bg-white shadow-xl transform transition-all duration-200 ease-out ${sizeClasses[size]} ${isOpen ? 'scale-100 opacity-100' : 'scale-95 opacity-0'} ${className || ''}`}\n      >\n        {children}\n      </div>\n    </div>,\n    document.body\n  );\n}\n\n// Modal Sub-components\nexport interface ModalHeaderProps extends HTMLAttributes<HTMLDivElement> {\n  children: ReactNode;\n  showCloseButton?: boolean;\n  onClose?: () => void;\n}\n\nModal.Header = function ModalHeader({\n  children,\n  showCloseButton = true,\n  onClose,\n  className,\n  ...props\n}: ModalHeaderProps) {\n  return (\n    <div\n      className={`flex items-center justify-between border-b border-gray-200 px-6 py-4 ${className || ''}`}\n      {...props}\n    >\n      <h2 className=\"text-lg font-semibold text-gray-900\">{children}</h2>\n      {showCloseButton && onClose && (\n        <button\n          type=\"button\"\n          onClick={onClose}\n          className=\"rounded-md text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-gray-500\"\n        >\n          <span className=\"sr-only\">Close</span>\n          <svg className=\"h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n            <path\n              strokeLinecap=\"round\"\n              strokeLinejoin=\"round\"\n              strokeWidth={2}\n              d=\"M6 18L18 6M6 6l12 12\"\n            />\n          </svg>\n        </button>\n      )}\n    </div>\n  );\n};\n\nexport interface ModalBodyProps extends HTMLAttributes<HTMLDivElement> {\n  children: ReactNode;\n}\n\nModal.Body = function ModalBody({ children, className, ...props }: ModalBodyProps) {\n  return (\n    <div className={`px-6 py-4 ${className || ''}`} {...props}>\n      {children}\n    </div>\n  );\n};\n\nexport interface ModalFooterProps extends HTMLAttributes<HTMLDivElement> {\n  children: ReactNode;\n}\n\nModal.Footer = function ModalFooter({ children, className, ...props }: ModalFooterProps) {\n  return (\n    <div\n      className={`flex items-center justify-end gap-3 border-t border-gray-200 px-6 py-4 ${className || ''}`}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n};\n"]}

package/dist/chunk-4EQEYRZ7.js

@@ -0,0 +1,65 @@
+import { useDate } from './chunk-GLM3RPCP.js';
+import { useTranslation } from './chunk-VVRYP6IL.js';
+import { Image } from './chunk-2KF5JJU6.js';
+import { Link } from './chunk-TZ4YD5CU.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function BlogCategoriesSidebar({ categories }) {
+  const { t } = useTranslation();
+  if (!categories.length) return null;
+  return /* @__PURE__ */ jsxs("nav", { "aria-label": "Sidebar", className: "hidden lg:block lg:sticky shrink-0 top-24 col-span-2", children: [
+    /* @__PURE__ */ jsx("h2", { className: "font-bold mb-3", children: t("pages.blog_categories.categories") }),
+    /* @__PURE__ */ jsx("ul", { children: categories.map((category) => /* @__PURE__ */ jsx("li", { className: category.is_current ? "text-primary" : "", children: /* @__PURE__ */ jsx(Link, { className: "py-3 block text-sm hover:text-primary", to: category.url, children: category.name }) }, category.id)) })
+  ] });
+}
+function BlogArticleCard({
+  article,
+  showAuthor = false
+}) {
+  const { format: formatDate } = useDate();
+  return /* @__PURE__ */ jsxs("div", { className: "list-block post-entry relative h-full transition-shadow duration-500 bg-white hover:shadow-default rounded-lg justify-around overflow-hidden flex flex-col", children: [
+    /* @__PURE__ */ jsx(
+      Link,
+      {
+        to: article.url,
+        className: "post-entry__image relative overflow-hidden hover:opacity-90 w-full h-56 bg-border-color flex items-center justify-center",
+        children: article.image && /* @__PURE__ */ jsx(
+          Image,
+          {
+            className: "h-full w-full object-cover",
+            src: article.image,
+            alt: article.name,
+            aspectRatio: "16/9"
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: "flex-1 px-5 pt-5 pb-7", children: [
+      /* @__PURE__ */ jsxs("div", { className: "mb-2.5 text-gray-500 rounded-md inline-flex text-sm rtl:space-x-reverse space-x-5", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
+          /* @__PURE__ */ jsx("i", { className: "sicon-calendar-date rtl:ml-1 ltr:mr-1" }),
+          /* @__PURE__ */ jsx("span", { children: formatDate(article.created_at) })
+        ] }),
+        showAuthor && article.author && /* @__PURE__ */ jsxs(Link, { to: article.author.url, className: "flex items-center hover:text-dark", children: [
+          /* @__PURE__ */ jsx("i", { className: "sicon-user rtl:ml-1 ltr:mr-1" }),
+          /* @__PURE__ */ jsx("span", { children: article.author.name })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx("h3", { className: "post-entry__title text-sm font-bold text-gray-800 leading-6 mb-2.5", children: /* @__PURE__ */ jsx(Link, { to: article.url, children: article.name }) }),
+      /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-500 leading-6 mb-2.5", children: article.description })
+    ] })
+  ] });
+}
+function BlogListLayout({
+  categories,
+  children
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 lg:grid-cols-8 gap-8", children: [
+    /* @__PURE__ */ jsx(BlogCategoriesSidebar, { categories }),
+    /* @__PURE__ */ jsx("div", { className: "main-content lg:col-span-6", children })
+  ] });
+}
+
+export { BlogArticleCard, BlogListLayout };
+//# sourceMappingURL=chunk-4EQEYRZ7.js.map
+//# sourceMappingURL=chunk-4EQEYRZ7.js.map

package/dist/chunk-4EQEYRZ7.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/routes/blog/components.tsx"],"names":[],"mappings":"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","file":"chunk-4EQEYRZ7.js","sourcesContent":["import type { ReactNode } from 'react';\nimport { useTranslation } from '../../providers/i18n';\nimport { useDate } from '../../hooks';\nimport { Image, Link } from '../../components/common';\nimport type { BlogCategory, ArticleSummary } from './types';\n\nexport function BlogCategoriesSidebar({ categories }: { categories: BlogCategory[] }) {\n  const { t } = useTranslation();\n\n  if (!categories.length) return null;\n\n  return (\n    <nav aria-label=\"Sidebar\" className=\"hidden lg:block lg:sticky shrink-0 top-24 col-span-2\">\n      <h2 className=\"font-bold mb-3\">{t('pages.blog_categories.categories')}</h2>\n      <ul>\n        {categories.map((category) => (\n          <li key={category.id} className={category.is_current ? 'text-primary' : ''}>\n            <Link className=\"py-3 block text-sm hover:text-primary\" to={category.url}>\n              {category.name}\n            </Link>\n          </li>\n        ))}\n      </ul>\n    </nav>\n  );\n}\n\nexport function BlogArticleCard({\n  article,\n  showAuthor = false,\n}: {\n  article: ArticleSummary;\n  showAuthor?: boolean;\n}) {\n  const { format: formatDate } = useDate();\n\n  return (\n    <div className=\"list-block post-entry relative h-full transition-shadow duration-500 bg-white hover:shadow-default rounded-lg justify-around overflow-hidden flex flex-col\">\n      <Link\n        to={article.url}\n        className=\"post-entry__image relative overflow-hidden hover:opacity-90 w-full h-56 bg-border-color flex items-center justify-center\"\n      >\n        {article.image && (\n          <Image\n            className=\"h-full w-full object-cover\"\n            src={article.image}\n            alt={article.name}\n            aspectRatio=\"16/9\"\n          />\n        )}\n      </Link>\n      <div className=\"flex-1 px-5 pt-5 pb-7\">\n        <div className=\"mb-2.5 text-gray-500 rounded-md inline-flex text-sm rtl:space-x-reverse space-x-5\">\n          <div className=\"flex items-center\">\n            <i className=\"sicon-calendar-date rtl:ml-1 ltr:mr-1\"></i>\n            <span>{formatDate(article.created_at)}</span>\n          </div>\n          {showAuthor && article.author && (\n            <Link to={article.author.url} className=\"flex items-center hover:text-dark\">\n              <i className=\"sicon-user rtl:ml-1 ltr:mr-1\"></i>\n              <span>{article.author.name}</span>\n            </Link>\n          )}\n        </div>\n        <h3 className=\"post-entry__title text-sm font-bold text-gray-800 leading-6 mb-2.5\">\n          <Link to={article.url}>{article.name}</Link>\n        </h3>\n        <p className=\"text-sm text-gray-500 leading-6 mb-2.5\">{article.description}</p>\n      </div>\n    </div>\n  );\n}\n\nexport function BlogListLayout({\n  categories,\n  children,\n}: {\n  categories: BlogCategory[];\n  children: ReactNode;\n}) {\n  return (\n    <div className=\"grid grid-cols-1 lg:grid-cols-8 gap-8\">\n      <BlogCategoriesSidebar categories={categories} />\n      <div className=\"main-content lg:col-span-6\">{children}</div>\n    </div>\n  );\n}\n"]}