@lanaco/lnc-react-ui 4.0.37 → 4.0.39

package/dist/{index-CHkb_Sj6.js → index-BN8qgFbe.js}

@@ -1,8 +1,8 @@
-import { jsxs as e, jsx as o } from "react/jsx-runtime";
+import { jsxs as e, jsx as a } from "react/jsx-runtime";
 import { forwardRef as f } from "react";
-import { n as a } from "./emotion-styled.browser.esm-CjCaF13H.js";
+import { n as o } from "./emotion-styled.browser.esm-CjCaF13H.js";
 import { m as u, l as h, n as b, G as x } from "./utils-DtRLzzTZ.js";
-a.div`
+const C = o.div`
   background-color: var(--gray-200, #dddfe4);
   border-radius: 0.75rem;
   min-width: 11.625rem;
@@ -10,8 +10,7 @@ a.div`
   max-width: 11.625rem;
   max-height: 11.625rem;
   ${u("-90deg")}
-`;
-const v = a.div`
+`, v = o.div`
   display: flex;
   flex-direction: column;
   justify-content: end;
@@ -89,14 +88,14 @@ const v = a.div`
       color: var(--primary-500, #F59E0B);
     }
   }
-`, S = f((d, y) => {
+`, F = f((n, y) => {
   const {
     uuid: w,
-    title: n,
+    title: d,
     price: r,
     currency: i,
-    isNegotiable: m,
-    isFree: l,
+    isNegotiable: l,
+    isFree: m,
     image: c,
     sellerUuid: k,
     onSelectCard: s = () => {
@@ -104,19 +103,20 @@ const v = a.div`
     imageComponent: t,
     negotiableText: p = "Negotiable",
     freeText: g = "Free"
-  } = d;
+  } = n;
   return /* @__PURE__ */ e(v, { className: "simple-product-card", onClick: s, children: [
-    h(t) ? t : /* @__PURE__ */ o("img", { src: c }),
+    h(t) ? t : /* @__PURE__ */ a("img", { src: c }),
     /* @__PURE__ */ e("div", { className: "text-block", children: [
-      /* @__PURE__ */ o("div", { className: "title-simple-product-card", children: n }),
+      /* @__PURE__ */ a("div", { className: "title-simple-product-card", children: d }),
       /* @__PURE__ */ e("div", { className: "price-chip", children: [
         r && i && `${b(r)} ${x(i)}`,
-        m && p,
-        l && g
+        l && p,
+        m && g
       ] })
     ] })
   ] });
 });
 export {
-  S
+  C as S,
+  F as a
 };

package/dist/{index-Dj5wZCVs.cjs → index-_Db92CJE.cjs}

@@ -1,4 +1,4 @@
-"use strict";const e=require("react/jsx-runtime"),p=require("react"),a=require("./emotion-styled.browser.esm-Cle7tAM9.cjs"),r=require("./utils-NZLCh-J5.cjs");a.newStyled.div`
+"use strict";const e=require("react/jsx-runtime"),u=require("react"),a=require("./emotion-styled.browser.esm-Cle7tAM9.cjs"),r=require("./utils-NZLCh-J5.cjs"),f=a.newStyled.div`
   background-color: var(--gray-200, #dddfe4);
   border-radius: 0.75rem;
   min-width: 11.625rem;
@@ -6,7 +6,7 @@
   max-width: 11.625rem;
   max-height: 11.625rem;
   ${r.linearGradientAnimation("-90deg")}
-`;const f=a.newStyled.div`
+`,h=a.newStyled.div`
   display: flex;
   flex-direction: column;
   justify-content: end;
@@ -84,4 +84,4 @@
       color: var(--primary-500, #F59E0B);
     }
   }
-`,h=p.forwardRef((d,b)=>{const{uuid:x,title:n,price:i,currency:t,isNegotiable:c,isFree:l,image:s,sellerUuid:y,onSelectCard:m=()=>{},imageComponent:o,negotiableText:g="Negotiable",freeText:u="Free"}=d;return e.jsxs(f,{className:"simple-product-card",onClick:m,children:[r.isDefined(o)?o:e.jsx("img",{src:s}),e.jsxs("div",{className:"text-block",children:[e.jsx("div",{className:"title-simple-product-card",children:n}),e.jsxs("div",{className:"price-chip",children:[i&&t&&`${r.formatPrice(i)} ${r.GetCurrencySymbol(t)}`,c&&g,l&&u]})]})]})});exports.SimpleProductCard=h;
+`,b=u.forwardRef((n,x)=>{const{uuid:y,title:d,price:i,currency:t,isNegotiable:c,isFree:l,image:s,sellerUuid:v,onSelectCard:m=()=>{},imageComponent:o,negotiableText:p="Negotiable",freeText:g="Free"}=n;return e.jsxs(h,{className:"simple-product-card",onClick:m,children:[r.isDefined(o)?o:e.jsx("img",{src:s}),e.jsxs("div",{className:"text-block",children:[e.jsx("div",{className:"title-simple-product-card",children:d}),e.jsxs("div",{className:"price-chip",children:[i&&t&&`${r.formatPrice(i)} ${r.GetCurrencySymbol(t)}`,c&&p,l&&g]})]})]})});exports.SimpleProductCard=b;exports.SkeletonWrapper=f;

package/dist/suspense-product-card-detailed-BETmfKMT.js

@@ -0,0 +1,189 @@
+import { jsxs as t, jsx as e, Fragment as p } from "react/jsx-runtime";
+import { forwardRef as c, Suspense as $ } from "react";
+import { t as y, o as m, m as s, l as S, n as C, G as z } from "./utils-DtRLzzTZ.js";
+import { n as g } from "./emotion-styled.browser.esm-CjCaF13H.js";
+import { M as P } from "./consts-C1uHV4xc.js";
+const h = g.div`
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
+  cursor: pointer;
+
+  & .wrapper-card-1 {
+    display: flex;
+    flex-direction: column;
+    gap: 0.38rem;
+  }
+
+  & .wrapper-card-2 {
+    display: flex;
+    flex-direction: column;
+    gap: 0;
+  }
+
+  & img {
+    width: 100%;
+    aspect-ratio: 1 / 1; /* defining the aspect ratio of the image */
+    object-fit: cover; /* making sure the image isn't distorted */
+    border-radius: 0.75rem;
+  }
+
+  & .card-title {
+    font-size: 0.875rem;
+    font-weight: 600;
+    ${y(2)}
+  }
+
+  & .price-text {
+    font-size: 1rem;
+    font-weight: 600;
+    ${m()}
+  }
+
+  & .location-text {
+    font-size: 0.75rem;
+    font-weight: 400;
+    color: var(--gray-600, #676e79);
+    ${m()}
+  }
+
+  & .tags-wrapper {
+    display: flex;
+    gap: 0.5rem;
+  }
+
+  &:hover {
+    & .card-title {
+      color: var(--primary-500, #f59e0b);
+    }
+  }
+
+  & .skeleton-img {
+    background-color: ${s("-90deg")};
+    border-radius: 0.75rem;
+    border: 1px solid white;
+  }
+
+  & .skeleton-title {
+    background-color: ${s("-90deg")};
+    width: 100%;
+    height: 2.5rem;
+  }
+
+  & .skeleton-tags {
+    background-color: ${s("-90deg")};
+    width: 80%;
+    height: 1.5rem;
+  }
+
+  & .skeleton-price {
+    background-color: ${s("-90deg")};
+    width: 50%;
+    height: 2.5rem;
+  }
+
+  & .skeleton-sponsored {
+    background-color: ${s("-90deg")};
+    width: 50%;
+    height: 1rem;
+  }
+
+  @media (max-width: ${P + "px"}) {
+    & img {
+      width: 8.875rem;
+      height: 8.875rem;
+      min-width: 8.875rem;
+      min-height: 8.875rem;
+      min-width: 8.875rem;
+      min-height: 8.875rem;
+      object-fit: cover;
+    }
+
+    & .price-text {
+      font-size: 0.875rem;
+      font-weight: 600;
+    }
+  }
+`, D = g.div`
+  display: flex;
+  align-items: center;
+  gap: 0.25rem;
+  color: var(--gray-500);
+  font-size:  0.75rem;
+  font-weight: 500;
+
+  & i {
+    font-size: 1rem;
+    color: var(--warning-500, #F59E0B);
+  }
+`, j = c(({ sponsoredText: r = "Sponsored" }, i) => /* @__PURE__ */ t(D, { ref: i, className: "sponsored-line", children: [
+  /* @__PURE__ */ e("i", { className: "mng-lnc-paw2" }),
+  /* @__PURE__ */ e("span", { children: r })
+] })), M = c((r, i) => {
+  const {
+    uuid: o,
+    title: n,
+    price: a,
+    currency: d,
+    isNegotiable: f,
+    isFree: u,
+    image: w,
+    sellerUuid: E,
+    location: x,
+    isSponsored: k,
+    imageComponent: l,
+    onSelectCard: v = () => {
+    },
+    freeText: N = "Free",
+    negotiableText: b = "Negotiable"
+  } = r;
+  return (
+    // <LandingPageProductCardSkeleton />
+    /* @__PURE__ */ t(h, { className: "product-card", onClick: v, children: [
+      S(l) ? l : /* @__PURE__ */ e("img", { src: w }),
+      /* @__PURE__ */ e("div", { className: "wrapper-card-1", children: /* @__PURE__ */ e("div", { className: "card-title", children: n }) }),
+      /* @__PURE__ */ t("div", { className: "wrapper-card-2", children: [
+        /* @__PURE__ */ t("div", { className: "price-text", children: [
+          a && d && `${C(a)} ${z(d)}`,
+          f && { negotiableText: b },
+          u && { freeText: N }
+        ] }),
+        /* @__PURE__ */ e("div", { className: "location-text", children: x })
+      ] }),
+      k === !0 && /* @__PURE__ */ e(j, {})
+    ] })
+  );
+}), F = c(({}, r) => /* @__PURE__ */ t(h, { className: "product-card", children: [
+  /* @__PURE__ */ e("img", { className: "skeleton-img" }),
+  /* @__PURE__ */ t("div", { className: "wrapper-card-1", children: [
+    /* @__PURE__ */ e("div", { className: "skeleton-title" }),
+    /* @__PURE__ */ e("div", { className: "skeleton-tags" })
+  ] }),
+  /* @__PURE__ */ t("div", { className: "wrapper-card-1", children: [
+    /* @__PURE__ */ e("div", { className: "skeleton-price" }),
+    /* @__PURE__ */ e("div", { className: "skeleton-sponsored" })
+  ] })
+] })), T = ({ limit: r = 5, isLoading: i = !1, keyPrefix: o }) => /* @__PURE__ */ e(p, { children: Array.from({ length: r }, (n, a) => /* @__PURE__ */ e(
+  F,
+  {
+    isLoading: i
+  },
+  `${o}-skeleton-product-card-${a}`
+)) }), R = ({
+  children: r,
+  fallbackComponent: i = /* @__PURE__ */ e(p, {}),
+  isLoading: o = !1,
+  limit: n,
+  keyPrefix: a
+}) => /* @__PURE__ */ e($, { fallbackComponent: i, children: o === !0 ? /* @__PURE__ */ e(
+  T,
+  {
+    isLoading: o,
+    limit: n,
+    keyPrefix: a
+  }
+) : r });
+export {
+  M as D,
+  R as S
+};

package/dist/{index-vXmvgZ2Y.cjs → suspense-product-card-detailed-DtzOxHaH.cjs}

@@ -1,4 +1,4 @@
-"use strict";const e=require("react/jsx-runtime"),s=require("react"),c=require("./emotion-styled.browser.esm-Cle7tAM9.cjs"),w=require("./consts-CtNoHdBj.cjs"),r=require("./utils-NZLCh-J5.cjs"),b=c.newStyled.div`
+"use strict";const e=require("react/jsx-runtime"),o=require("react"),r=require("./utils-NZLCh-J5.cjs"),l=require("./emotion-styled.browser.esm-Cle7tAM9.cjs"),k=require("./consts-CtNoHdBj.cjs"),m=l.newStyled.div`
   display: flex;
   flex-direction: column;
   gap: 0.5rem;
@@ -83,7 +83,7 @@
     height: 1rem;
   }
 
-  @media (max-width: ${w.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${k.MOBILE_SIZE_PX+"px"}) {
     & img {
       width: 8.875rem;
       height: 8.875rem;
@@ -99,7 +99,7 @@
       font-weight: 600;
     }
   }
-`,j=c.newStyled.div`
+`,v=l.newStyled.div`
   display: flex;
   align-items: center;
   gap: 0.25rem;
@@ -111,4 +111,4 @@
     font-size: 1rem;
     color: var(--warning-500, #F59E0B);
   }
-`,v=s.forwardRef(({sponsoredText:i="Sponsored"},t)=>e.jsxs(j,{ref:t,className:"sponsored-line",children:[e.jsx("i",{className:"mng-lnc-paw2"}),e.jsx("span",{children:i})]})),y=s.forwardRef((i,t)=>{const{uuid:k,title:d,price:n,currency:o,isNegotiable:l,isFree:m,image:g,sellerUuid:$,location:p,isSponsored:h,imageComponent:a,onSelectCard:u=()=>{},freeText:x="Free",negotiableText:f="Negotiable"}=i;return e.jsxs(b,{className:"product-card",onClick:u,children:[r.isDefined(a)?a:e.jsx("img",{src:g}),e.jsx("div",{className:"wrapper-card-1",children:e.jsx("div",{className:"card-title",children:d})}),e.jsxs("div",{className:"wrapper-card-2",children:[e.jsxs("div",{className:"price-text",children:[n&&o&&`${r.formatPrice(n)} ${r.GetCurrencySymbol(o)}`,l&&{negotiableText:f},m&&{freeText:x}]}),e.jsx("div",{className:"location-text",children:p})]}),h===!0&&e.jsx(v,{})]})});exports.DetailedProductCard=y;
+`,N=o.forwardRef(({sponsoredText:t="Sponsored"},i)=>e.jsxs(v,{ref:i,className:"sponsored-line",children:[e.jsx("i",{className:"mng-lnc-paw2"}),e.jsx("span",{children:t})]})),b=o.forwardRef((t,i)=>{const{uuid:a,title:n,price:s,currency:c,isNegotiable:p,isFree:g,image:h,sellerUuid:C,location:u,isSponsored:x,imageComponent:d,onSelectCard:f=()=>{},freeText:w="Free",negotiableText:j="Negotiable"}=t;return e.jsxs(m,{className:"product-card",onClick:f,children:[r.isDefined(d)?d:e.jsx("img",{src:h}),e.jsx("div",{className:"wrapper-card-1",children:e.jsx("div",{className:"card-title",children:n})}),e.jsxs("div",{className:"wrapper-card-2",children:[e.jsxs("div",{className:"price-text",children:[s&&c&&`${r.formatPrice(s)} ${r.GetCurrencySymbol(c)}`,p&&{negotiableText:j},g&&{freeText:w}]}),e.jsx("div",{className:"location-text",children:u})]}),x===!0&&e.jsx(N,{})]})}),y=o.forwardRef(({},t)=>e.jsxs(m,{className:"product-card",children:[e.jsx("img",{className:"skeleton-img"}),e.jsxs("div",{className:"wrapper-card-1",children:[e.jsx("div",{className:"skeleton-title"}),e.jsx("div",{className:"skeleton-tags"})]}),e.jsxs("div",{className:"wrapper-card-1",children:[e.jsx("div",{className:"skeleton-price"}),e.jsx("div",{className:"skeleton-sponsored"})]})]})),S=({limit:t=5,isLoading:i=!1,keyPrefix:a})=>e.jsx(e.Fragment,{children:Array.from({length:t},(n,s)=>e.jsx(y,{isLoading:i},`${a}-skeleton-product-card-${s}`))}),$=({children:t,fallbackComponent:i=e.jsx(e.Fragment,{}),isLoading:a=!1,limit:n,keyPrefix:s})=>e.jsx(o.Suspense,{fallbackComponent:i,children:a===!0?e.jsx(S,{isLoading:a,limit:n,keyPrefix:s}):t});exports.DetailedProductCard=b;exports.SuspenseDetailedProductCard=$;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lanaco/lnc-react-ui",
-  "version": "4.0.37",
+  "version": "4.0.39",
   "description": "React component library",
   "type": "module",
   "keywords": [
@@ -139,7 +139,7 @@
     "./FieldOfInterestsWithAvatarsCardsSection": "./dist/FieldOfInterestsWithAvatarsCardsSection.js",
     "./FieldOfInterestsWithTagsCardsSection": "./dist/FieldOfInterestsWithTagsCardsSection.js",
     "./GeneralWithTagsCardsSection": "./dist/GeneralWithTagsCardsSection.js",
-    "./QuizSection": "./dist/QuizSection.jsx",
+    "./QuizSection": "./dist/QuizSection.js",
     "./OverlayGeneralCardsSection": "./dist/OverlayGeneralCardsSection.js",
     "./ShopCardsSection": "./dist/ShopCardsSection.js",
     "./LocationSearchSection": "./dist/LocationSearchSection.js",

package/dist/index-D6g5ZqyJ.js

@@ -1,159 +0,0 @@
-import { jsxs as i, jsx as e } from "react/jsx-runtime";
-import { forwardRef as s } from "react";
-import { n as l } from "./emotion-styled.browser.esm-CjCaF13H.js";
-import { M as v } from "./consts-C1uHV4xc.js";
-import { t as k, o as d, m as r, l as y, n as $, G as N } from "./utils-DtRLzzTZ.js";
-const S = l.div`
-  display: flex;
-  flex-direction: column;
-  gap: 0.5rem;
-  cursor: pointer;
-
-  & .wrapper-card-1 {
-    display: flex;
-    flex-direction: column;
-    gap: 0.38rem;
-  }
-
-  & .wrapper-card-2 {
-    display: flex;
-    flex-direction: column;
-    gap: 0;
-  }
-
-  & img {
-    width: 100%;
-    aspect-ratio: 1 / 1; /* defining the aspect ratio of the image */
-    object-fit: cover; /* making sure the image isn't distorted */
-    border-radius: 0.75rem;
-  }
-
-  & .card-title {
-    font-size: 0.875rem;
-    font-weight: 600;
-    ${k(2)}
-  }
-
-  & .price-text {
-    font-size: 1rem;
-    font-weight: 600;
-    ${d()}
-  }
-
-  & .location-text {
-    font-size: 0.75rem;
-    font-weight: 400;
-    color: var(--gray-600, #676e79);
-    ${d()}
-  }
-
-  & .tags-wrapper {
-    display: flex;
-    gap: 0.5rem;
-  }
-
-  &:hover {
-    & .card-title {
-      color: var(--primary-500, #f59e0b);
-    }
-  }
-
-  & .skeleton-img {
-    background-color: ${r("-90deg")};
-    border-radius: 0.75rem;
-    border: 1px solid white;
-  }
-
-  & .skeleton-title {
-    background-color: ${r("-90deg")};
-    width: 100%;
-    height: 2.5rem;
-  }
-
-  & .skeleton-tags {
-    background-color: ${r("-90deg")};
-    width: 80%;
-    height: 1.5rem;
-  }
-
-  & .skeleton-price {
-    background-color: ${r("-90deg")};
-    width: 50%;
-    height: 2.5rem;
-  }
-
-  & .skeleton-sponsored {
-    background-color: ${r("-90deg")};
-    width: 50%;
-    height: 1rem;
-  }
-
-  @media (max-width: ${v + "px"}) {
-    & img {
-      width: 8.875rem;
-      height: 8.875rem;
-      min-width: 8.875rem;
-      min-height: 8.875rem;
-      min-width: 8.875rem;
-      min-height: 8.875rem;
-      object-fit: cover;
-    }
-
-    & .price-text {
-      font-size: 0.875rem;
-      font-weight: 600;
-    }
-  }
-`, z = l.div`
-  display: flex;
-  align-items: center;
-  gap: 0.25rem;
-  color: var(--gray-500);
-  font-size:  0.75rem;
-  font-weight: 500;
-
-  & i {
-    font-size: 1rem;
-    color: var(--warning-500, #F59E0B);
-  }
-`, C = s(({ sponsoredText: t = "Sponsored" }, o) => /* @__PURE__ */ i(z, { ref: o, className: "sponsored-line", children: [
-  /* @__PURE__ */ e("i", { className: "mng-lnc-paw2" }),
-  /* @__PURE__ */ e("span", { children: t })
-] })), P = s((t, o) => {
-  const {
-    uuid: j,
-    title: m,
-    price: a,
-    currency: n,
-    isNegotiable: p,
-    isFree: g,
-    image: h,
-    sellerUuid: T,
-    location: f,
-    isSponsored: w,
-    imageComponent: c,
-    onSelectCard: u = () => {
-    },
-    freeText: x = "Free",
-    negotiableText: b = "Negotiable"
-  } = t;
-  return (
-    // <LandingPageProductCardSkeleton />
-    /* @__PURE__ */ i(S, { className: "product-card", onClick: u, children: [
-      y(c) ? c : /* @__PURE__ */ e("img", { src: h }),
-      /* @__PURE__ */ e("div", { className: "wrapper-card-1", children: /* @__PURE__ */ e("div", { className: "card-title", children: m }) }),
-      /* @__PURE__ */ i("div", { className: "wrapper-card-2", children: [
-        /* @__PURE__ */ i("div", { className: "price-text", children: [
-          a && n && `${$(a)} ${N(n)}`,
-          p && { negotiableText: b },
-          g && { freeText: x }
-        ] }),
-        /* @__PURE__ */ e("div", { className: "location-text", children: f })
-      ] }),
-      w === !0 && /* @__PURE__ */ e(C, {})
-    ] })
-  );
-});
-export {
-  P as D
-};