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

package/dist/BlogTagPage-ELG2H5N5.js

@@ -0,0 +1,101 @@
+import { BlogListLayout, BlogArticleCard } from './chunk-4EQEYRZ7.js';
+import { blog } from './chunk-DFMO5KBU.js';
+import './chunk-GLM3RPCP.js';
+import './chunk-QTDGM2SO.js';
+import './chunk-5Q6PFLDN.js';
+import { useLocation } from './chunk-GO34DE35.js';
+import './chunk-VVZNW5CB.js';
+import './chunk-LBUMC5PB.js';
+import './chunk-MTONGOJD.js';
+import './chunk-2FU6CVSB.js';
+import './chunk-I5Z4NJBB.js';
+import './chunk-TCSNNCRH.js';
+import './chunk-2TB2LTL2.js';
+import './chunk-QYL5OHAV.js';
+import './chunk-KIPZQN3Y.js';
+import './chunk-Z653O7MX.js';
+import './chunk-ZCH7W7DZ.js';
+import './chunk-SSRNIBVV.js';
+import './chunk-GN34LCTG.js';
+import './chunk-CW625T2E.js';
+import './chunk-BVSJPBJ6.js';
+import './chunk-GBWCXUPD.js';
+import './chunk-UIX3W2PN.js';
+import { useTranslation } from './chunk-VVRYP6IL.js';
+import './chunk-T72DAX7R.js';
+import './chunk-YMVLYYLU.js';
+import './chunk-RYBA3JDM.js';
+import { HookSlot } from './chunk-25SSLQAJ.js';
+import './chunk-J37AYLWL.js';
+import { LazyBreadcrumb, LazyNoContent } from './chunk-2KF5JJU6.js';
+import './chunk-TZ4YD5CU.js';
+import './chunk-XUI3TRXF.js';
+import './chunk-6BZ5TKEV.js';
+import './chunk-UE3BUFZI.js';
+import './chunk-3DCZJDDK.js';
+import './chunk-3UHSMGPY.js';
+import './chunk-MXQCE3KA.js';
+import './chunk-BWFBVXT3.js';
+import './chunk-DGUM43GV.js';
+import { useRef, useCallback } from 'react';
+import { ItemsList } from '@salla.sa/twilight-components-react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function BlogTagPage({
+  page,
+  blogTag,
+  categories = [],
+  articles = [],
+  cursor
+}) {
+  const { t } = useTranslation();
+  const { pathname, searchStr } = useLocation();
+  const nextCursorRef = useRef(cursor?.next ?? null);
+  const loader = useCallback(async () => {
+    const nextUrl = nextCursorRef.current;
+    const cursorMatch = nextUrl?.match(/[?&]cursor=([^&]+)/);
+    const cursorValue = cursorMatch ? decodeURIComponent(cursorMatch[1]) : nextUrl ?? void 0;
+    const result = await blog.articles.list({ tag: String(blogTag.id), cursor: cursorValue });
+    nextCursorRef.current = result.cursor?.next ?? null;
+    return {
+      items: result.data,
+      next: result.cursor?.next ?? null
+    };
+  }, [blogTag.id]);
+  if (articles.length === 0) {
+    return /* @__PURE__ */ jsxs("div", { className: "container mb-8 sm:mb-24", children: [
+      /* @__PURE__ */ jsx(LazyBreadcrumb, { page }),
+      /* @__PURE__ */ jsxs(BlogListLayout, { categories, children: [
+        /* @__PURE__ */ jsx(HookSlot, { name: "blog:tag.start" }),
+        /* @__PURE__ */ jsx(LazyNoContent, { icon: "sicon-inbox", message: t("pages.blog_articles.no_articles") }),
+        /* @__PURE__ */ jsx(HookSlot, { name: "blog:tag.end" })
+      ] })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "container mb-8 sm:mb-24", children: [
+    /* @__PURE__ */ jsx(LazyBreadcrumb, { page }),
+    /* @__PURE__ */ jsxs(BlogListLayout, { categories, children: [
+      /* @__PURE__ */ jsx(HookSlot, { name: "blog:tag.start" }),
+      /* @__PURE__ */ jsx("div", { className: "mb-6", children: /* @__PURE__ */ jsx("h1", { className: "font-bold text-xl", children: blogTag.name }) }),
+      /* @__PURE__ */ jsx(
+        ItemsList,
+        {
+          items: articles,
+          loader: cursor?.next ? loader : void 0,
+          mode: cursor?.next ? "infinite" : "static",
+          pageUrl: pathname + searchStr,
+          className: "s-blog-list",
+          itemsClassName: "grid md:grid-cols-2 gap-2.5 md:gap-8",
+          empty: /* @__PURE__ */ jsx(LazyNoContent, { icon: "sicon-inbox", message: t("pages.blog_articles.no_articles") }),
+          t: (key, fallback) => t(key, fallback || key),
+          children: (items) => items.map((article) => /* @__PURE__ */ jsx(BlogArticleCard, { article, showAuthor: true }, article.id))
+        }
+      ),
+      /* @__PURE__ */ jsx(HookSlot, { name: "blog:tag.end" })
+    ] })
+  ] });
+}
+
+export { BlogTagPage };
+//# sourceMappingURL=BlogTagPage-ELG2H5N5.js.map
+//# sourceMappingURL=BlogTagPage-ELG2H5N5.js.map

package/dist/BlogTagPage-ELG2H5N5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/routes/blog/BlogTagPage.tsx"],"names":[],"mappings":"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","file":"BlogTagPage-ELG2H5N5.js","sourcesContent":["import { useRef, useCallback } from 'react';\nimport { ItemsList } from '@salla.sa/twilight-components-react';\nimport { HookSlot } from '../../hooks';\nimport { useTranslation } from '../../providers/i18n';\nimport { useLocation } from '../../providers/NavigationProvider';\nimport { Breadcrumb, NoContent } from '../../components/common';\nimport { blog } from '../../api/blog';\nimport { BlogArticleCard, BlogListLayout } from './components';\nimport type { BlogTagLoaderData, ArticleSummary } from './types';\n\nexport function BlogTagPage({\n  page,\n  blogTag,\n  categories = [],\n  articles = [],\n  cursor,\n}: BlogTagLoaderData) {\n  const { t } = useTranslation();\n  const { pathname, searchStr } = useLocation();\n  const nextCursorRef = useRef<string | null>(cursor?.next ?? null);\n\n  const loader = useCallback(async () => {\n    const nextUrl = nextCursorRef.current;\n    const cursorMatch = nextUrl?.match(/[?&]cursor=([^&]+)/);\n    const cursorValue = cursorMatch ? decodeURIComponent(cursorMatch[1]) : (nextUrl ?? undefined);\n\n    const result = await blog.articles.list({ tag: String(blogTag.id), cursor: cursorValue });\n    nextCursorRef.current = result.cursor?.next ?? null;\n\n    return {\n      items: result.data,\n      next: result.cursor?.next ?? null,\n    };\n  }, [blogTag.id]);\n\n  if (articles.length === 0) {\n    return (\n      <div className=\"container mb-8 sm:mb-24\">\n        <Breadcrumb page={page} />\n        <BlogListLayout categories={categories}>\n          <HookSlot name=\"blog:tag.start\" />\n          <NoContent icon=\"sicon-inbox\" message={t('pages.blog_articles.no_articles')} />\n          <HookSlot name=\"blog:tag.end\" />\n        </BlogListLayout>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"container mb-8 sm:mb-24\">\n      <Breadcrumb page={page} />\n\n      <BlogListLayout categories={categories}>\n        <HookSlot name=\"blog:tag.start\" />\n\n        <div className=\"mb-6\">\n          <h1 className=\"font-bold text-xl\">{blogTag.name}</h1>\n        </div>\n\n        <ItemsList<ArticleSummary>\n          items={articles}\n          loader={cursor?.next ? loader : undefined}\n          mode={cursor?.next ? 'infinite' : 'static'}\n          pageUrl={pathname + searchStr}\n          className=\"s-blog-list\"\n          itemsClassName=\"grid md:grid-cols-2 gap-2.5 md:gap-8\"\n          empty={<NoContent icon=\"sicon-inbox\" message={t('pages.blog_articles.no_articles')} />}\n          t={(key, fallback) => t(key, fallback || key)}\n        >\n          {(items) =>\n            items.map((article) => (\n              <BlogArticleCard key={article.id} article={article} showAuthor />\n            ))\n          }\n        </ItemsList>\n\n        <HookSlot name=\"blog:tag.end\" />\n      </BlogListLayout>\n    </div>\n  );\n}\n"]}

package/dist/BrandsPage-ZSO3PYAV.js

@@ -0,0 +1,127 @@
+import './chunk-GLM3RPCP.js';
+import './chunk-QTDGM2SO.js';
+import './chunk-5Q6PFLDN.js';
+import './chunk-GO34DE35.js';
+import './chunk-VVZNW5CB.js';
+import './chunk-LBUMC5PB.js';
+import './chunk-MTONGOJD.js';
+import './chunk-2FU6CVSB.js';
+import './chunk-I5Z4NJBB.js';
+import './chunk-TCSNNCRH.js';
+import './chunk-2TB2LTL2.js';
+import './chunk-QYL5OHAV.js';
+import './chunk-KIPZQN3Y.js';
+import './chunk-Z653O7MX.js';
+import './chunk-ZCH7W7DZ.js';
+import './chunk-SSRNIBVV.js';
+import './chunk-GN34LCTG.js';
+import './chunk-CW625T2E.js';
+import './chunk-BVSJPBJ6.js';
+import './chunk-GBWCXUPD.js';
+import './chunk-UIX3W2PN.js';
+import { useTranslation } from './chunk-VVRYP6IL.js';
+import './chunk-T72DAX7R.js';
+import './chunk-YMVLYYLU.js';
+import './chunk-RYBA3JDM.js';
+import { HookSlot } from './chunk-25SSLQAJ.js';
+import './chunk-J37AYLWL.js';
+import { LazyBreadcrumb, Image, LazyNoContent } from './chunk-2KF5JJU6.js';
+import { Link } from './chunk-TZ4YD5CU.js';
+import './chunk-XUI3TRXF.js';
+import './chunk-6BZ5TKEV.js';
+import './chunk-UE3BUFZI.js';
+import './chunk-3DCZJDDK.js';
+import './chunk-3UHSMGPY.js';
+import './chunk-MXQCE3KA.js';
+import './chunk-BWFBVXT3.js';
+import './chunk-DGUM43GV.js';
+import { memo, useState, useRef, useCallback } from 'react';
+import { useWindowScroll } from '@uidotdev/usehooks';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+function BrandsPageComponent({ page, brands }) {
+  const { t } = useTranslation();
+  const brandEntries = Object.entries(brands);
+  const hasBrands = brandEntries.length > 0;
+  const [selectedChar, setSelectedChar] = useState(null);
+  const sectionRefs = useRef({});
+  const [{ y }] = useWindowScroll();
+  const isSticky = (y ?? 0) > 200;
+  const handleBrandClick = useCallback((e) => {
+    e.preventDefault();
+    const char = e.currentTarget.dataset.id;
+    if (char) {
+      setSelectedChar(char);
+      sectionRefs.current[char]?.scrollIntoView({ behavior: "smooth" });
+    }
+  }, []);
+  return /* @__PURE__ */ jsxs("div", { className: "container mb-20", children: [
+    /* @__PURE__ */ jsx(LazyBreadcrumb, { page }),
+    /* @__PURE__ */ jsx("div", { className: "flex justify-between pt-2 pb-6", children: /* @__PURE__ */ jsx("h1", { className: "font-bold mb-6 md:mb-0", children: page.title }) }),
+    hasBrands ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("div", { className: "brands-nav-wrap", children: /* @__PURE__ */ jsxs(
+        "ul",
+        {
+          id: "brands-nav",
+          className: `brands-nav ${isSticky ? "is-sticky" : "is-not-sticky"}`,
+          children: [
+            /* @__PURE__ */ jsx("li", {}),
+            brandEntries?.map(([char]) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
+              "a",
+              {
+                className: `brands-nav__item ${selectedChar === char ? "is-selected" : "unselected"}`,
+                href: `#brand-section-${char}`,
+                onClick: handleBrandClick,
+                "data-id": char,
+                children: /* @__PURE__ */ jsx("span", { className: "fix-align", children: char })
+              }
+            ) }, char))
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ jsxs("div", { className: "px-8 xl:px-0", children: [
+        /* @__PURE__ */ jsx(HookSlot, { name: "brands:index.items.start" }),
+        brandEntries.map(([char, brandGroup]) => /* @__PURE__ */ jsxs(
+          "section",
+          {
+            id: `brand-section-${char}`,
+            ref: (el) => {
+              sectionRefs.current[char] = el;
+            },
+            className: "pt-24 first:pt-16 md:first:pt-24",
+            children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center mb-10", children: [
+                /* @__PURE__ */ jsx("span", { "data-id": char, className: "brand-char", children: /* @__PURE__ */ jsx("span", { className: "fix-align", children: char }) }),
+                /* @__PURE__ */ jsx("div", { className: "bg-border-color h-px flex-1" })
+              ] }),
+              /* @__PURE__ */ jsx("div", { className: "grid grid-cols-3 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-6 grid-flow-row gap-4 md:gap-8", children: brandGroup.map((brand) => /* @__PURE__ */ jsx(Link, { to: `/brands/${brand.id}`, className: "brand-item", children: /* @__PURE__ */ jsx(
+                Image,
+                {
+                  className: "max-h-full",
+                  width: 400,
+                  height: 300,
+                  src: brand.logo,
+                  alt: brand.name
+                }
+              ) }, brand.id)) })
+            ]
+          },
+          char
+        )),
+        /* @__PURE__ */ jsx(HookSlot, { name: "brands:index.items.end" })
+      ] })
+    ] }) : /* @__PURE__ */ jsx(
+      LazyNoContent,
+      {
+        icon: "sicon-award-ribbon",
+        message: t("pages.brands.non_brands"),
+        actionLabel: t("common.elements.back_home")
+      }
+    )
+  ] });
+}
+var BrandsPage = memo(BrandsPageComponent);
+
+export { BrandsPage };
+//# sourceMappingURL=BrandsPage-ZSO3PYAV.js.map
+//# sourceMappingURL=BrandsPage-ZSO3PYAV.js.map

package/dist/BrandsPage-ZSO3PYAV.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/routes/brands/BrandsPage.tsx"],"names":[],"mappings":"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","file":"BrandsPage-ZSO3PYAV.js","sourcesContent":["import { memo, useState, useRef, useCallback } from 'react';\nimport { useWindowScroll } from '@uidotdev/usehooks';\nimport { Link, Breadcrumb, NoContent, Image } from '../../components/common';\nimport { HookSlot } from '../../hooks';\nimport { useTranslation } from '../../providers/i18n';\nimport type { BrandsPageProps } from './types';\n\nfunction BrandsPageComponent({ page, brands }: BrandsPageProps) {\n  const { t } = useTranslation();\n  const brandEntries = Object.entries(brands);\n\n  const hasBrands = brandEntries.length > 0;\n  const [selectedChar, setSelectedChar] = useState<string | null>(null);\n  const sectionRefs = useRef<Record<string, HTMLElement | null>>({});\n\n  // Use useWindowScroll hook instead of manual listener\n  const [{ y }] = useWindowScroll();\n  const isSticky = (y ?? 0) > 200;\n\n  // Handle brand nav item click - matches brands.js toggle class logic\n  const handleBrandClick = useCallback((e: React.MouseEvent<HTMLAnchorElement>) => {\n    e.preventDefault();\n    const char = e.currentTarget.dataset.id;\n    if (char) {\n      setSelectedChar(char);\n      sectionRefs.current[char]?.scrollIntoView({ behavior: 'smooth' });\n    }\n  }, []);\n\n  return (\n    <div className=\"container mb-20\">\n      <Breadcrumb page={page} />\n\n      <div className=\"flex justify-between pt-2 pb-6\">\n        <h1 className=\"font-bold mb-6 md:mb-0\">{page.title}</h1>\n      </div>\n\n      {hasBrands ? (\n        <>\n          <div className=\"brands-nav-wrap\">\n            <ul\n              id=\"brands-nav\"\n              className={`brands-nav ${isSticky ? 'is-sticky' : 'is-not-sticky'}`}\n            >\n              <li></li>\n              {brandEntries?.map(([char]) => (\n                <li key={char}>\n                  <a\n                    className={`brands-nav__item ${selectedChar === char ? 'is-selected' : 'unselected'}`}\n                    href={`#brand-section-${char}`}\n                    onClick={handleBrandClick}\n                    data-id={char}\n                  >\n                    <span className=\"fix-align\">{char}</span>\n                  </a>\n                </li>\n              ))}\n            </ul>\n          </div>\n\n          <div className=\"px-8 xl:px-0\">\n            <HookSlot name=\"brands:index.items.start\" />\n\n            {brandEntries.map(([char, brandGroup]) => (\n              <section\n                key={char}\n                id={`brand-section-${char}`}\n                ref={(el) => {\n                  sectionRefs.current[char] = el;\n                }}\n                className=\"pt-24 first:pt-16 md:first:pt-24\"\n              >\n                <div className=\"flex items-center mb-10\">\n                  <span data-id={char} className=\"brand-char\">\n                    <span className=\"fix-align\">{char}</span>\n                  </span>\n                  <div className=\"bg-border-color h-px flex-1\"></div>\n                </div>\n                <div className=\"grid grid-cols-3 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-6 grid-flow-row gap-4 md:gap-8\">\n                  {brandGroup.map((brand) => (\n                    <Link key={brand.id} to={`/brands/${brand.id}`} className=\"brand-item\">\n                      <Image\n                        className=\"max-h-full\"\n                        width={400}\n                        height={300}\n                        src={brand.logo}\n                        alt={brand.name}\n                      />\n                    </Link>\n                  ))}\n                </div>\n              </section>\n            ))}\n\n            <HookSlot name=\"brands:index.items.end\" />\n          </div>\n        </>\n      ) : (\n        <NoContent\n          icon=\"sicon-award-ribbon\"\n          message={t('pages.brands.non_brands')}\n          actionLabel={t('common.elements.back_home')}\n        />\n      )}\n    </div>\n  );\n}\n\nexport const BrandsPage = memo(BrandsPageComponent);\n"]}

package/dist/Breadcrumb-N32QFMVK.js

@@ -0,0 +1,152 @@
+import { useBreadcrumbs } from './chunk-GLM3RPCP.js';
+import './chunk-QTDGM2SO.js';
+import './chunk-5Q6PFLDN.js';
+import './chunk-GO34DE35.js';
+import './chunk-VVZNW5CB.js';
+import './chunk-LBUMC5PB.js';
+import './chunk-MTONGOJD.js';
+import './chunk-2FU6CVSB.js';
+import './chunk-I5Z4NJBB.js';
+import './chunk-TCSNNCRH.js';
+import './chunk-2TB2LTL2.js';
+import './chunk-QYL5OHAV.js';
+import './chunk-KIPZQN3Y.js';
+import './chunk-Z653O7MX.js';
+import './chunk-ZCH7W7DZ.js';
+import './chunk-SSRNIBVV.js';
+import './chunk-GN34LCTG.js';
+import './chunk-CW625T2E.js';
+import './chunk-BVSJPBJ6.js';
+import './chunk-GBWCXUPD.js';
+import './chunk-UIX3W2PN.js';
+import './chunk-VVRYP6IL.js';
+import './chunk-T72DAX7R.js';
+import './chunk-YMVLYYLU.js';
+import './chunk-RYBA3JDM.js';
+import './chunk-25SSLQAJ.js';
+import './chunk-J37AYLWL.js';
+import './chunk-2KF5JJU6.js';
+import { Link } from './chunk-TZ4YD5CU.js';
+import './chunk-XUI3TRXF.js';
+import './chunk-6BZ5TKEV.js';
+import './chunk-UE3BUFZI.js';
+import './chunk-3DCZJDDK.js';
+import './chunk-3UHSMGPY.js';
+import './chunk-MXQCE3KA.js';
+import { useTwilight } from './chunk-BWFBVXT3.js';
+import './chunk-DGUM43GV.js';
+import { memo, useState, useEffect } from 'react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+var MAX_VISIBLE_ITEMS = 4;
+var ChevronIcon = () => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    version: "1.1",
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "32",
+    height: "32",
+    viewBox: "0 0 32 32",
+    "aria-hidden": "true",
+    children: [
+      /* @__PURE__ */ jsx("title", { children: "keyboard_arrow_left" }),
+      /* @__PURE__ */ jsx("path", { d: "M20.563 22.104l-1.875 1.875-8-8 8-8 1.875 1.875-6.125 6.125z" })
+    ]
+  }
+);
+function truncateItems(items) {
+  if (items.length <= MAX_VISIBLE_ITEMS) return items;
+  return [items[0], { name: "\u2026", url: "" }, ...items.slice(-2)];
+}
+var BreadcrumbTrail = memo(function BreadcrumbTrail2({
+  items,
+  className
+}) {
+  const [expanded, setExpanded] = useState(false);
+  useEffect(() => {
+    setExpanded(false);
+  }, [items]);
+  if (items.length === 0) return null;
+  const displayItems = expanded ? items : truncateItems(items);
+  return /* @__PURE__ */ jsx("nav", { className: className ?? "breadcrumbs w-full py-5", "aria-label": "Breadcrumb", children: /* @__PURE__ */ jsx("ol", { className: "s-breadcrumb-wrapper", itemScope: true, itemType: "https://schema.org/BreadcrumbList", children: displayItems.map((item, index) => {
+    const isLast = index === displayItems.length - 1;
+    const isEllipsis = item.name === "\u2026" && !item.url;
+    return /* @__PURE__ */ jsxs(
+      "li",
+      {
+        className: ["s-breadcrumb-item", isEllipsis ? "cursor-pointer select-none" : ""].join(
+          " "
+        ),
+        "aria-current": isLast ? "page" : void 0,
+        itemProp: "itemListElement",
+        itemScope: true,
+        itemType: "https://schema.org/ListItem",
+        children: [
+          isEllipsis ? /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => {
+                setExpanded(true);
+              },
+              className: "inline-flex items-center gap-1 hover:underline",
+              "aria-label": "Show all breadcrumbs",
+              children: /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "text-xs", children: "\u2022\u2022\u2022" })
+            }
+          ) : isLast ? /* @__PURE__ */ jsx("span", { itemProp: "name", children: item.name }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(Link, { to: item.url, itemProp: "item", children: /* @__PURE__ */ jsx("span", { itemProp: "name", children: item.name }) }),
+            /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "s-breadcrumb-arrow inline-flex", children: /* @__PURE__ */ jsx(ChevronIcon, {}) }),
+            /* @__PURE__ */ jsx("meta", { itemProp: "position", content: String(index + 1) })
+          ] }),
+          isLast && /* @__PURE__ */ jsx("meta", { itemProp: "position", content: String(index + 1) })
+        ]
+      },
+      `${item.url}-${item.name}`
+    );
+  }) }) });
+});
+function toAbsoluteUrl(origin, path) {
+  if (path.startsWith("http")) return path;
+  return origin + path;
+}
+function BreadcrumbJsonLd({ items, origin }) {
+  if (items.length === 0) return null;
+  const schema = {
+    "@context": "https://schema.org",
+    "@type": "BreadcrumbList",
+    itemListElement: items.map((item, index) => {
+      const isLast = index === items.length - 1;
+      const url = toAbsoluteUrl(origin, item.url);
+      return {
+        "@type": "ListItem",
+        position: index + 1,
+        name: item.name,
+        ...isLast ? { "@id": url } : { item: url }
+      };
+    })
+  };
+  const html = JSON.stringify(schema);
+  return /* @__PURE__ */ jsx(
+    "script",
+    {
+      type: "application/ld+json",
+      suppressHydrationWarning: true,
+      dangerouslySetInnerHTML: { __html: html }
+    }
+  );
+}
+function Breadcrumb({ page, className }) {
+  const { theme, store } = useTwilight();
+  const breadcrumbsEnabled = theme.settings.is_breadcrumbs_enabled ?? true;
+  const origin = store.url;
+  const items = useBreadcrumbs(page);
+  if (!breadcrumbsEnabled) return null;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(BreadcrumbTrail, { items, className }),
+    /* @__PURE__ */ jsx(BreadcrumbJsonLd, { items, origin })
+  ] });
+}
+
+export { Breadcrumb };
+//# sourceMappingURL=Breadcrumb-N32QFMVK.js.map
+//# sourceMappingURL=Breadcrumb-N32QFMVK.js.map

package/dist/Breadcrumb-N32QFMVK.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/common/BreadcrumbTrail.tsx","../src/components/common/BreadcrumbJsonLd.tsx","../src/components/common/Breadcrumb.tsx"],"names":["BreadcrumbTrail","jsx","jsxs","Fragment"],"mappings":"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","file":"Breadcrumb-N32QFMVK.js","sourcesContent":["import { memo, useState, useEffect } from 'react';\nimport type { Breadcrumb } from '../../types';\nimport { Link } from './Link';\n\nconst MAX_VISIBLE_ITEMS = 4;\n\ninterface BreadcrumbTrailProps {\n  items: Breadcrumb[];\n  className?: string;\n}\n\nconst ChevronIcon = () => (\n  <svg\n    version=\"1.1\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    width=\"32\"\n    height=\"32\"\n    viewBox=\"0 0 32 32\"\n    aria-hidden=\"true\"\n  >\n    <title>keyboard_arrow_left</title>\n    <path d=\"M20.563 22.104l-1.875 1.875-8-8 8-8 1.875 1.875-6.125 6.125z\"></path>\n  </svg>\n);\n\nfunction truncateItems(items: Breadcrumb[]): Breadcrumb[] {\n  if (items.length <= MAX_VISIBLE_ITEMS) return items;\n\n  return [items[0], { name: '…', url: '' }, ...items.slice(-2)];\n}\n\nexport const BreadcrumbTrail = memo(function BreadcrumbTrail({\n  items,\n  className,\n}: BreadcrumbTrailProps) {\n  const [expanded, setExpanded] = useState(false);\n\n  useEffect(() => {\n    setExpanded(false);\n  }, [items]);\n\n  if (items.length === 0) return null;\n\n  const displayItems = expanded ? items : truncateItems(items);\n\n  return (\n    <nav className={className ?? 'breadcrumbs w-full py-5'} aria-label=\"Breadcrumb\">\n      <ol className=\"s-breadcrumb-wrapper\" itemScope itemType=\"https://schema.org/BreadcrumbList\">\n        {displayItems.map((item, index) => {\n          const isLast = index === displayItems.length - 1;\n          const isEllipsis = item.name === '…' && !item.url;\n\n          return (\n            <li\n              key={`${item.url}-${item.name}`}\n              className={['s-breadcrumb-item', isEllipsis ? 'cursor-pointer select-none' : ''].join(\n                ' '\n              )}\n              aria-current={isLast ? 'page' : undefined}\n              itemProp=\"itemListElement\"\n              itemScope\n              itemType=\"https://schema.org/ListItem\"\n            >\n              {isEllipsis ? (\n                <button\n                  type=\"button\"\n                  onClick={() => {\n                    setExpanded(true);\n                  }}\n                  className=\"inline-flex items-center gap-1 hover:underline\"\n                  aria-label=\"Show all breadcrumbs\"\n                >\n                  <span aria-hidden=\"true\" className=\"text-xs\">\n                    •••\n                  </span>\n                </button>\n              ) : isLast ? (\n                <span itemProp=\"name\">{item.name}</span>\n              ) : (\n                <>\n                  <Link to={item.url} itemProp=\"item\">\n                    <span itemProp=\"name\">{item.name}</span>\n                  </Link>\n                  <span aria-hidden=\"true\" className=\"s-breadcrumb-arrow inline-flex\">\n                    <ChevronIcon />\n                  </span>\n                  <meta itemProp=\"position\" content={String(index + 1)} />\n                </>\n              )}\n              {isLast && <meta itemProp=\"position\" content={String(index + 1)} />}\n            </li>\n          );\n        })}\n      </ol>\n    </nav>\n  );\n});\n","import type { Breadcrumb } from '../../types';\n\ninterface BreadcrumbJsonLdProps {\n  items: Breadcrumb[];\n  origin: string;\n}\n\nfunction toAbsoluteUrl(origin: string, path: string): string {\n  if (path.startsWith('http')) return path;\n  return origin + path;\n}\n\nexport function BreadcrumbJsonLd({ items, origin }: BreadcrumbJsonLdProps) {\n  if (items.length === 0) return null;\n\n  const schema = {\n    '@context': 'https://schema.org',\n    '@type': 'BreadcrumbList',\n    itemListElement: items.map((item, index) => {\n      const isLast = index === items.length - 1;\n      const url = toAbsoluteUrl(origin, item.url);\n      return {\n        '@type': 'ListItem',\n        position: index + 1,\n        name: item.name,\n        ...(isLast ? { '@id': url } : { item: url }),\n      };\n    }),\n  };\n\n  const html = JSON.stringify(schema);\n\n  return (\n    <script\n      type=\"application/ld+json\"\n      suppressHydrationWarning\n      dangerouslySetInnerHTML={{ __html: html }}\n    />\n  );\n}\n","import type { Page } from '../../types';\nimport { useBreadcrumbs } from '../../hooks/useBreadcrumbs';\nimport { useTwilight } from '../../providers';\nimport { BreadcrumbTrail } from './BreadcrumbTrail';\nimport { BreadcrumbJsonLd } from './BreadcrumbJsonLd';\n\nexport interface BreadcrumbProps {\n  page?: Page | null;\n  className?: string;\n}\n\nexport function Breadcrumb({ page, className }: BreadcrumbProps) {\n  const { theme, store } = useTwilight();\n  const breadcrumbsEnabled = theme.settings.is_breadcrumbs_enabled ?? true;\n  const origin = store.url;\n\n  const items = useBreadcrumbs(page);\n\n  if (!breadcrumbsEnabled) return null;\n\n  return (\n    <>\n      <BreadcrumbTrail items={items} className={className} />\n      <BreadcrumbJsonLd items={items} origin={origin} />\n    </>\n  );\n}\n"]}

package/dist/CartItem-SGTGOTEC.js

@@ -0,0 +1,171 @@
+import { useMoney } from './chunk-GLM3RPCP.js';
+import './chunk-QTDGM2SO.js';
+import './chunk-5Q6PFLDN.js';
+import './chunk-GO34DE35.js';
+import './chunk-VVZNW5CB.js';
+import './chunk-LBUMC5PB.js';
+import './chunk-MTONGOJD.js';
+import './chunk-2FU6CVSB.js';
+import './chunk-I5Z4NJBB.js';
+import './chunk-TCSNNCRH.js';
+import './chunk-2TB2LTL2.js';
+import './chunk-QYL5OHAV.js';
+import './chunk-KIPZQN3Y.js';
+import './chunk-Z653O7MX.js';
+import './chunk-ZCH7W7DZ.js';
+import './chunk-SSRNIBVV.js';
+import './chunk-GN34LCTG.js';
+import './chunk-CW625T2E.js';
+import './chunk-BVSJPBJ6.js';
+import './chunk-GBWCXUPD.js';
+import './chunk-UIX3W2PN.js';
+import { useTranslation } from './chunk-VVRYP6IL.js';
+import './chunk-T72DAX7R.js';
+import './chunk-YMVLYYLU.js';
+import './chunk-RYBA3JDM.js';
+import './chunk-25SSLQAJ.js';
+import './chunk-J37AYLWL.js';
+import { Image } from './chunk-2KF5JJU6.js';
+import { Link } from './chunk-TZ4YD5CU.js';
+import './chunk-XUI3TRXF.js';
+import './chunk-6BZ5TKEV.js';
+import './chunk-UE3BUFZI.js';
+import './chunk-3DCZJDDK.js';
+import './chunk-3UHSMGPY.js';
+import './chunk-MXQCE3KA.js';
+import './chunk-BWFBVXT3.js';
+import './chunk-DGUM43GV.js';
+import { SallaCartItemOffers } from '@salla.sa/twilight-components-react/cart-item-offers';
+import { SallaQuantityInput } from '@salla.sa/twilight-components-react/quantity-input';
+import { SallaButton } from '@salla.sa/twilight-components-react/button';
+import { SallaProductOptions } from '@salla.sa/twilight-components-react/product-options';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+function toNumber(value) {
+  if (value === void 0) return void 0;
+  if (typeof value === "number") return value;
+  return value.amount;
+}
+function moneyCurrency(value) {
+  if (typeof value !== "object") return void 0;
+  return value.currency;
+}
+function CartItem({ item, isFirst = false }) {
+  const { t } = useTranslation();
+  const { format } = useMoney();
+  const handleChange = (e) => {
+    window.salla?.form.onChange("cart.updateItem", e);
+  };
+  const handleDelete = async () => {
+    await window.salla?.cart.deleteItem(item.id);
+    document.querySelector(`#item-${item.id}`)?.remove();
+  };
+  const isFreeProduct = toNumber(item.price) === 0 && item.has_discount;
+  return /* @__PURE__ */ jsx("form", { onChange: handleChange, id: `item-${item.id}`, children: /* @__PURE__ */ jsxs("section", { className: "cart-item bg-white p-5 xs:p-7 rounded-md mb-5 relative", children: [
+    /* @__PURE__ */ jsx("input", { type: "hidden", name: "id", value: item.id }),
+    /* @__PURE__ */ jsxs("div", { className: "md:flex rtl:space-x-reverse md:space-x-12 items-start justify-between mb-8 last:mb-0", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-1 rtl:space-x-reverse space-x-4", children: [
+        /* @__PURE__ */ jsxs(Link, { to: item.url, className: "relative overflow-hidden shrink-0", children: [
+          /* @__PURE__ */ jsx(
+            Image,
+            {
+              src: item.product_image,
+              alt: item.product_name,
+              className: "flex-none w-24 h-20 border border-gray-200 bg-gray-100 rounded-md object-center object-cover",
+              aspectRatio: "6/5",
+              priority: isFirst
+            }
+          ),
+          isFreeProduct && /* @__PURE__ */ jsx("div", { className: "free-ribbon absolute top-[11px] right-[-38px] w-32 bg-red-600 text-white text-xs font-bold text-center py-1 rotate-45 shadow-md", children: t("pages.loyalty_program.free_product", "Free") })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+          /* @__PURE__ */ jsx("div", { className: "text-gray-900 leading-6 text-lg font-bold", children: /* @__PURE__ */ jsx(Link, { to: item.url, className: "text-base", children: item.product_name }) }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-wrap", children: [
+            item.offer && /* @__PURE__ */ jsx("span", { className: "text-sm text-gray-500 line-through item-regular-price", children: format(toNumber(item.product_price), {
+              currency: moneyCurrency(item.product_price)
+            }) }),
+            item.is_on_sale && /* @__PURE__ */ jsx("span", { className: "inline-flex gap-1 leading-4 text-sm text-gray-500 line-through item-original-price", children: format(toNumber(item.original_price), {
+              currency: moneyCurrency(item.original_price)
+            }) }),
+            /* @__PURE__ */ jsx(
+              "span",
+              {
+                className: `inline-flex gap-1 leading-4 item-price ${item.has_discount ? "text-red-800" : "text-sm text-gray-500"}`,
+                children: format(toNumber(item.price), { currency: moneyCurrency(item.price) })
+              }
+            )
+          ] }),
+          item.weight_label && /* @__PURE__ */ jsxs("p", { className: "text-sm text-gray-500", children: [
+            t("pages.cart.weight", "Weight"),
+            ": ",
+            /* @__PURE__ */ jsx("span", { children: item.weight_label })
+          ] }),
+          item.offer && !item.detailed_offers?.length && /* @__PURE__ */ jsxs("span", { className: "old-offers flex items-center gap-1 mx-1.5", children: [
+            /* @__PURE__ */ jsx("i", { className: "sicon-discount-calculator text-gray-500 offer-icon" }),
+            /* @__PURE__ */ jsx("span", { className: "text-sm text-gray-500 offer-name", children: item.offer.names })
+          ] }),
+          item.detailed_offers && item.detailed_offers.length > 0 && /* @__PURE__ */ jsx(
+            SallaCartItemOffers,
+            {
+              quantity: item.quantity,
+              itemId: String(item.id),
+              productPrice: toNumber(item.product_price) ?? 0,
+              offers: JSON.stringify(item.detailed_offers)
+            }
+          )
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "border-t border-b border-gray-200 py-3 md:p-0 md:border-none mt-5 md:mt-0 flex gap-8 justify-between items-center md:items-start", children: [
+        item.type === "donating" ? /* @__PURE__ */ jsx("span", {}) : item.is_hidden_quantity ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              type: "hidden",
+              value: item.quantity,
+              name: "quantity",
+              "aria-label": t("pages.products.quantity", "Quantity")
+            }
+          ),
+          /* @__PURE__ */ jsx("span", { className: "w-10 text-center", children: item.quantity })
+        ] }) : /* @__PURE__ */ jsx(
+          SallaQuantityInput,
+          {
+            cartItemId: item.id,
+            max: item.max_quantity ?? void 0,
+            className: "transition transition-color duration-300",
+            "aria-label": t("pages.products.quantity", "Quantity"),
+            value: item.quantity,
+            name: "quantity"
+          }
+        ),
+        /* @__PURE__ */ jsxs("p", { className: "text-primary flex-none font-bold text-sm rtl:md:pl-12 ltr:md:pr-12", children: [
+          /* @__PURE__ */ jsxs("span", { children: [
+            t("pages.cart.total", "Total"),
+            ":"
+          ] }),
+          /* @__PURE__ */ jsx("span", { className: "inline-block item-total", children: item.is_available ? item.detailed_offers?.length ? format(toNumber(item.total_special_price), {
+            currency: moneyCurrency(item.total_special_price)
+          }) : format(toNumber(item.total), { currency: moneyCurrency(item.total) }) : t("pages.products.out_of_stock", "Out of Stock") })
+        ] })
+      ] })
+    ] }),
+    item.options && item.options.length > 0 && /* @__PURE__ */ jsx(SallaProductOptions, { options: JSON.stringify(item.options), productId: item.product_id }),
+    /* @__PURE__ */ jsx("span", { className: "absolute top-1.5 rtl:left-1.5 ltr:right-1.5 rtl:xs:left-5 ltr:xs:right-5 xs:top-5", children: /* @__PURE__ */ jsx(
+      SallaButton,
+      {
+        type: "button",
+        shape: "icon",
+        size: "small",
+        color: "danger",
+        className: "btn--delete",
+        ariaLabel: t("common.elements.remove", "Remove from the cart"),
+        onClick: handleDelete,
+        children: /* @__PURE__ */ jsx("i", { className: "sicon-cancel" })
+      }
+    ) })
+  ] }) });
+}
+
+export { CartItem };
+//# sourceMappingURL=CartItem-SGTGOTEC.js.map
+//# sourceMappingURL=CartItem-SGTGOTEC.js.map

package/dist/CartItem-SGTGOTEC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/cart/CartItem.tsx"],"names":[],"mappings":"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","file":"CartItem-SGTGOTEC.js","sourcesContent":["import type { Money, CartItem as CartItemType } from '../../types';\nimport { useTranslation } from '../../providers/i18n';\nimport { useMoney } from '../../hooks/useMoney';\nimport { Link, Image } from '../common';\nimport { SallaCartItemOffers } from '@salla.sa/twilight-components-react/cart-item-offers';\nimport { SallaQuantityInput } from '@salla.sa/twilight-components-react/quantity-input';\nimport { SallaButton } from '@salla.sa/twilight-components-react/button';\nimport { SallaProductOptions } from '@salla.sa/twilight-components-react/product-options';\n\ninterface CartItemProps {\n  item: CartItemType;\n  isFirst?: boolean;\n}\n\nfunction toNumber(value: number | Money | undefined): number | undefined {\n  if (value === undefined) return undefined;\n  if (typeof value === 'number') return value;\n  return value.amount;\n}\n\nfunction moneyCurrency(value: number | Money | undefined): string | undefined {\n  if (typeof value !== 'object') return undefined;\n  return value.currency;\n}\n\nexport function CartItem({ item, isFirst = false }: CartItemProps) {\n  const { t } = useTranslation();\n  const { format } = useMoney();\n\n  const handleChange = (e: React.ChangeEvent<HTMLFormElement>) => {\n    window.salla?.form.onChange('cart.updateItem', e);\n  };\n\n  const handleDelete = async () => {\n    await window.salla?.cart.deleteItem(item.id);\n    document.querySelector(`#item-${item.id}`)?.remove();\n  };\n\n  const isFreeProduct = toNumber(item.price) === 0 && item.has_discount;\n\n  return (\n    <form onChange={handleChange} id={`item-${item.id}`}>\n      <section className=\"cart-item bg-white p-5 xs:p-7 rounded-md mb-5 relative\">\n        <input type=\"hidden\" name=\"id\" value={item.id} />\n\n        <div className=\"md:flex rtl:space-x-reverse md:space-x-12 items-start justify-between mb-8 last:mb-0\">\n          <div className=\"flex flex-1 rtl:space-x-reverse space-x-4\">\n            <Link to={item.url} className=\"relative overflow-hidden shrink-0\">\n              <Image\n                src={item.product_image}\n                alt={item.product_name}\n                className=\"flex-none w-24 h-20 border border-gray-200 bg-gray-100 rounded-md object-center object-cover\"\n                aspectRatio=\"6/5\"\n                priority={isFirst}\n              />\n\n              {isFreeProduct && (\n                <div className=\"free-ribbon absolute top-[11px] right-[-38px] w-32 bg-red-600 text-white text-xs font-bold text-center py-1 rotate-45 shadow-md\">\n                  {/* Twig: trans('pages.loyalty_program.free_product') */}\n                  {t('pages.loyalty_program.free_product', 'Free')}\n                </div>\n              )}\n            </Link>\n\n            <div className=\"space-y-1\">\n              <div className=\"text-gray-900 leading-6 text-lg font-bold\">\n                <Link to={item.url} className=\"text-base\">\n                  {item.product_name}\n                </Link>\n              </div>\n\n              <div className=\"flex items-center gap-2 flex-wrap\">\n                {item.offer && (\n                  <span className=\"text-sm text-gray-500 line-through item-regular-price\">\n                    {format(toNumber(item.product_price), {\n                      currency: moneyCurrency(item.product_price),\n                    })}\n                  </span>\n                )}\n\n                {item.is_on_sale && (\n                  <span className=\"inline-flex gap-1 leading-4 text-sm text-gray-500 line-through item-original-price\">\n                    {format(toNumber(item.original_price), {\n                      currency: moneyCurrency(item.original_price),\n                    })}\n                  </span>\n                )}\n\n                <span\n                  className={`inline-flex gap-1 leading-4 item-price ${item.has_discount ? 'text-red-800' : 'text-sm text-gray-500'}`}\n                >\n                  {format(toNumber(item.price), { currency: moneyCurrency(item.price) })}\n                </span>\n              </div>\n\n              {item.weight_label && (\n                <p className=\"text-sm text-gray-500\">\n                  {t('pages.cart.weight', 'Weight')}: <span>{item.weight_label}</span>\n                </p>\n              )}\n\n              {/* Twig: class=\"{{ item.detailed_offers ? 'hidden' : '' }}\" — hide old offer when detailed_offers present */}\n              {item.offer && !item.detailed_offers?.length && (\n                <span className=\"old-offers flex items-center gap-1 mx-1.5\">\n                  <i className=\"sicon-discount-calculator text-gray-500 offer-icon\"></i>\n                  <span className=\"text-sm text-gray-500 offer-name\">{item.offer.names}</span>\n                </span>\n              )}\n\n              {item.detailed_offers && item.detailed_offers.length > 0 && (\n                <SallaCartItemOffers\n                  quantity={item.quantity}\n                  itemId={String(item.id) as any}\n                  productPrice={toNumber(item.product_price) ?? 0}\n                  offers={JSON.stringify(item.detailed_offers)}\n                />\n              )}\n            </div>\n          </div>\n\n          <div className=\"border-t border-b border-gray-200 py-3 md:p-0 md:border-none mt-5 md:mt-0 flex gap-8 justify-between items-center md:items-start\">\n            {item.type === 'donating' ? (\n              <span></span>\n            ) : item.is_hidden_quantity ? (\n              <>\n                <input\n                  type=\"hidden\"\n                  value={item.quantity}\n                  name=\"quantity\"\n                  aria-label={t('pages.products.quantity', 'Quantity')}\n                />\n                <span className=\"w-10 text-center\">{item.quantity}</span>\n              </>\n            ) : (\n              <SallaQuantityInput\n                cartItemId={item.id}\n                max={item.max_quantity ?? undefined}\n                className=\"transition transition-color duration-300\"\n                aria-label={t('pages.products.quantity', 'Quantity')}\n                value={item.quantity}\n                name=\"quantity\"\n              />\n            )}\n\n            <p className=\"text-primary flex-none font-bold text-sm rtl:md:pl-12 ltr:md:pr-12\">\n              <span>{t('pages.cart.total', 'Total')}:</span>\n              <span className=\"inline-block item-total\">\n                {item.is_available\n                  ? item.detailed_offers?.length\n                    ? format(toNumber(item.total_special_price), {\n                        currency: moneyCurrency(item.total_special_price),\n                      })\n                    : format(toNumber(item.total), { currency: moneyCurrency(item.total) })\n                  : t('pages.products.out_of_stock', 'Out of Stock')}\n              </span>\n            </p>\n          </div>\n        </div>\n\n        {/* Twig: {% include 'pages.partials.product.options' with {product:item} %} */}\n        {item.options && item.options.length > 0 && (\n          <SallaProductOptions options={JSON.stringify(item.options)} productId={item.product_id} />\n        )}\n\n        <span className=\"absolute top-1.5 rtl:left-1.5 ltr:right-1.5 rtl:xs:left-5 ltr:xs:right-5 xs:top-5\">\n          <SallaButton\n            type=\"button\"\n            shape=\"icon\"\n            size=\"small\"\n            color=\"danger\"\n            className=\"btn--delete\"\n            ariaLabel={t('common.elements.remove', 'Remove from the cart')}\n            onClick={handleDelete}\n          >\n            <i className=\"sicon-cancel\"></i>\n          </SallaButton>\n        </span>\n      </section>\n    </form>\n  );\n}\n"]}